Feat: Added meta data to the chat configuration page #8531 (#9417)

### What problem does this PR solve?

Feat: Added meta data to the chat configuration page #8531

### Type of change


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

web/src/pages/chat/chat-configuration-modal/assistant-setting.tsx

@@ -14,19 +14,6 @@ import { MetadataFilterConditions } from './metadata-filter-conditions';
 
 const emptyResponseField = ['prompt_config', 'empty_response'];
 
-const MetadataOptions = Object.values(DatasetMetadata).map((x) => {
-  let value: DatasetMetadata | boolean = x;
-  if (x === DatasetMetadata.Disabled) {
-    value = false;
-  } else if (x === DatasetMetadata.Automatic) {
-    value = true;
-  }
-  return {
-    value,
-    label: x,
-  };
-});
-
 const AssistantSetting = ({
   show,
   form,
@@ -35,7 +22,14 @@ const AssistantSetting = ({
   const { t } = useTranslate('chat');
   const { data } = useFetchTenantInfo(true);
 
-  const metadata = Form.useWatch(['meta_data_filter', 'auto'], form);
+  const MetadataOptions = Object.values(DatasetMetadata).map((x) => {
+    return {
+      value: x,
+      label: t(`meta.${x}`),
+    };
+  });
+
+  const metadata = Form.useWatch(['meta_data_filter', 'method'], form);
   const kbIds = Form.useWatch(['kb_ids'], form);
 
   const hasKnowledge = Array.isArray(kbIds) && kbIds.length > 0;
@@ -176,8 +170,9 @@ const AssistantSetting = ({
       {hasKnowledge && (
         <Form.Item
           label={t('metadata')}
-          name={['meta_data_filter', 'auto']}
+          name={['meta_data_filter', 'method']}
           tooltip={t('metadataTip')}
+          initialValue={DatasetMetadata.Disabled}
         >
           <Select options={MetadataOptions} />
         </Form.Item>

web/src/pages/chat/chat-configuration-modal/metadata-filter-conditions.tsx

@@ -1,5 +1,6 @@
 import { useFetchKnowledgeMetadata } from '@/hooks/use-knowledge-request';
 import { SwitchOperatorOptions } from '@/pages/agent/constant';
+import { useBuildSwitchOperatorOptions } from '@/pages/agent/form/switch-form';
 import { MinusCircleOutlined, PlusOutlined } from '@ant-design/icons';
 import {
   Button,
@@ -12,9 +13,12 @@ import {
   Space,
 } from 'antd';
 import { useCallback } from 'react';
+import { useTranslation } from 'react-i18next';
 
 export function MetadataFilterConditions({ kbIds }: { kbIds: string[] }) {
   const metadata = useFetchKnowledgeMetadata(kbIds);
+  const { t } = useTranslation();
+  const switchOperatorOptions = useBuildSwitchOperatorOptions();
 
   const renderItems = useCallback(
     (add: FormListOperation['add']) => {
@@ -50,22 +54,22 @@ export function MetadataFilterConditions({ kbIds }: { kbIds: string[] }) {
               <Form.Item
                 {...restField}
                 name={[name, 'key']}
-                rules={[{ required: true, message: 'Missing first name' }]}
+                rules={[{ required: true, message: t('common.pleaseInput') }]}
               >
-                <Input placeholder="First Name" />
+                <Input placeholder={t('common.pleaseInput')} />
               </Form.Item>
               <Form.Item {...restField} name={[name, 'op']} className="w-20">
                 <Select
-                  options={SwitchOperatorOptions}
+                  options={switchOperatorOptions}
                   popupMatchSelectWidth={false}
                 />
               </Form.Item>
               <Form.Item
                 {...restField}
                 name={[name, 'value']}
-                rules={[{ required: true, message: 'Missing last name' }]}
+                rules={[{ required: true, message: t('common.pleaseInput') }]}
               >
-                <Input placeholder="Last Name" />
+                <Input placeholder={t('common.pleaseInput')} />
               </Form.Item>
               <MinusCircleOutlined onClick={() => remove(name)} />
             </Space>
@@ -73,7 +77,7 @@ export function MetadataFilterConditions({ kbIds }: { kbIds: string[] }) {
           <Form.Item>
             <Dropdown trigger={['click']} menu={{ items: renderItems(add) }}>
               <Button type="dashed" block icon={<PlusOutlined />}>
-                Add Condition
+                {t('chat.addCondition')}
               </Button>
             </Dropdown>
           </Form.Item>