Feat: Add retrieval tool #3221 (#8491)

### What problem does this PR solve?

Feat: Add retrieval tool #3221

### Type of change


- [x] New Feature (non-breaking change which adds functionality)

web/src/pages/agent/form/tool-form/constant.ts

@@ -12,9 +12,9 @@ import GithubForm from '../github-form';
 import GoogleForm from '../google-form';
 import GoogleScholarForm from '../google-scholar-form';
 import PubMedForm from '../pubmed-form';
-import RetrievalForm from '../retrieval-form/next';
 import WikipediaForm from '../wikipedia-form';
 import YahooFinanceForm from '../yahoo-finance-form';
+import RetrievalForm from './retrieval-form';
 import TavilyForm from './tavily-form';
 
 export const ToolFormConfigMap = {

web/src/pages/agent/form/tool-form/retrieval-form/index.tsx

@@ -0,0 +1,59 @@
+import { FormContainer } from '@/components/form-container';
+import { KnowledgeBaseFormField } from '@/components/knowledge-base-item';
+import { RerankFormFields } from '@/components/rerank';
+import { SimilaritySliderFormField } from '@/components/similarity-slider';
+import { TopNFormField } from '@/components/top-n-item';
+import { Form } from '@/components/ui/form';
+import { zodResolver } from '@hookform/resolvers/zod';
+import { useForm } from 'react-hook-form';
+import { z } from 'zod';
+import { DescriptionField } from '../../components/description-field';
+import {
+  EmptyResponseField,
+  RetrievalPartialSchema,
+} from '../../retrieval-form/next';
+import { useValues } from '../use-values';
+import { useWatchFormChange } from '../use-watch-change';
+
+export const FormSchema = z.object({
+  ...RetrievalPartialSchema,
+  description: z.string().optional(),
+});
+
+const RetrievalForm = () => {
+  const defaultValues = useValues();
+
+  const form = useForm({
+    defaultValues: defaultValues,
+    resolver: zodResolver(FormSchema),
+  });
+
+  useWatchFormChange(form);
+
+  return (
+    <Form {...form}>
+      <form
+        className="space-y-6 p-4"
+        onSubmit={(e) => {
+          e.preventDefault();
+        }}
+      >
+        <FormContainer>
+          <DescriptionField></DescriptionField>
+          <KnowledgeBaseFormField></KnowledgeBaseFormField>
+        </FormContainer>
+        <FormContainer>
+          <SimilaritySliderFormField
+            vectorSimilarityWeightName="keywords_similarity_weight"
+            isTooltipShown
+          ></SimilaritySliderFormField>
+          <TopNFormField></TopNFormField>
+          <RerankFormFields></RerankFormFields>
+          <EmptyResponseField></EmptyResponseField>
+        </FormContainer>
+      </form>
+    </Form>
+  );
+};
+
+export default RetrievalForm;

web/src/pages/agent/form/tool-form/use-values.ts

@@ -1,5 +1,6 @@
 import { isEmpty } from 'lodash';
 import { useMemo } from 'react';
+import { DefaultAgentToolValuesMap } from '../../constant';
 import useGraphStore from '../../store';
 import { getAgentNodeTools } from '../../utils';
 
@@ -13,10 +14,6 @@ export enum Topic {
   General = 'general',
 }
 
-export const defaultValues = {
-  api_key: '',
-};
-
 export function useValues() {
   const { clickedToolId, clickedNodeId, findUpstreamNodeById } = useGraphStore(
     (state) => state,
@@ -31,6 +28,11 @@ export function useValues() {
     )?.params;
 
     if (isEmpty(formData)) {
+      const defaultValues =
+        DefaultAgentToolValuesMap[
+          clickedToolId as keyof typeof DefaultAgentToolValuesMap
+        ];
+
       return defaultValues;
     }