Feat: Add a prefix to the name of the FormField associated with the chat. (#16178)

Fix: Add a prefix to the `name` of the `FormField` associated with the chat.

web/src/components/rerank.tsx

@@ -1,5 +1,6 @@
 import { ModelTreeSelect } from '@/components/model-tree-select';
 import { useTranslate } from '@/hooks/common-hooks';
+import { prefixName } from '@/utils/form';
 import { useFormContext } from 'react-hook-form';
 import { z } from 'zod';
 import { SliderInputFormField } from './slider-input-form-field';
@@ -19,16 +20,21 @@ export const initialTopKValue = {
   top_k: 1024,
 };
 
-const RerankId = 'rerank_id';
+const DefaultRerankId = 'rerank_id';
+const DefaultTopK = 'top_k';
 
-function RerankFormField() {
+interface RerankFormFieldProps {
+  name?: string;
+}
+
+function RerankFormField({ name = DefaultRerankId }: RerankFormFieldProps) {
   const form = useFormContext();
   const { t } = useTranslate('knowledgeDetails');
 
   return (
     <FormField
       control={form.control}
-      name={RerankId}
+      name={name}
       render={({ field }) => (
         <FormItem>
           <FormLabel tooltip={t('rerankTip')}>{t('rerankModel')}</FormLabel>
@@ -48,21 +54,28 @@ function RerankFormField() {
 }
 
 export const rerankFormSchema = {
-  [RerankId]: z.string().optional(),
+  [DefaultRerankId]: z.string().optional(),
   top_k: z.coerce.number().optional(),
 };
 
-export function RerankFormFields() {
+interface RerankFormFieldsProps {
+  prefix?: string;
+}
+
+export function RerankFormFields({ prefix = '' }: RerankFormFieldsProps) {
   const { watch } = useFormContext();
   const { t } = useTranslate('knowledgeDetails');
-  const rerankId = watch(RerankId);
+  const rerankIdName = prefixName(prefix, DefaultRerankId);
+  const topKName = prefixName(prefix, DefaultTopK);
+
+  const rerankId = watch(rerankIdName);
 
   return (
     <>
-      <RerankFormField></RerankFormField>
+      <RerankFormField name={rerankIdName}></RerankFormField>
       {rerankId && (
         <SliderInputFormField
-          name={'top_k'}
+          name={topKName}
           label={t('topK')}
           max={2048}
           min={1}

web/src/components/top-n-item.tsx

@@ -5,18 +5,22 @@ import { SliderInputFormField } from './slider-input-form-field';
 
 interface SimilaritySliderFormFieldProps {
   max?: number;
+  name?: string;
 }
 
 export const topnSchema = {
   top_n: z.number().optional(),
 };
 
-export function TopNFormField({ max = 30 }: SimilaritySliderFormFieldProps) {
+export function TopNFormField({
+  max = 30,
+  name = 'top_n',
+}: SimilaritySliderFormFieldProps) {
   const { t } = useTranslate('chat');
 
   return (
     <SliderInputFormField
-      name={'top_n'}
+      name={name}
       label={t('topN')}
       max={max}
       tooltip={t('topNTip')}