Fix: Optimize the metadata code structure to implement metadata list structure functionality. (#12741)

### What problem does this PR solve? Fix: Optimize the metadata code structure to implement metadata list structure functionality. #11564 ### Type of change - [x] Bug Fix (non-breaking change which fixes an issue)
2026-02-04 09:35:06 +08:00 · 2026-01-21 16:15:43 +08:00
parent e1143d40bc
commit 83e17d8c4a
13 changed files with 315 additions and 251 deletions
--- a/web/src/pages/dataset/components/metedata/hooks/use-manage-modal.ts
+++ b/web/src/pages/dataset/components/metedata/hooks/use-manage-modal.ts
@ -1,20 +1,17 @@
 import message from '@/components/ui/message';
 import { useSetModalState } from '@/hooks/common-hooks';
 import { useSelectedIds } from '@/hooks/logic-hooks/use-row-selection';
-import {
-  DocumentApiAction,
-  useSetDocumentMeta,
-} from '@/hooks/use-document-request';
+import { DocumentApiAction } from '@/hooks/use-document-request';
 import kbService, {
  getMetaDataService,
  updateMetaData,
 } from '@/services/knowledge-service';
 import { useQuery, useQueryClient } from '@tanstack/react-query';
 import { RowSelectionState } from '@tanstack/react-table';
-import { TFunction } from 'i18next';
 import { useCallback, useEffect, useMemo, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import { useParams } from 'react-router';
+import { MetadataType, metadataValueTypeEnum } from '../constant';
 import {
  IBuiltInMetadataItem,
  IMetaDataReturnJSONSettings,
@ -25,141 +22,6 @@ import {
  MetadataValueType,
  ShowManageMetadataModalProps,
 } from '../interface';
-export enum MetadataType {
-  Manage = 1,
-  UpdateSingle = 2,
-  Setting = 3,
-  SingleFileSetting = 4,
-}
-
-export const MetadataDeleteMap = (
-  t: TFunction<'translation', undefined>,
-): Record<
-  MetadataType,
-  {
-    title: string;
-    warnFieldText: string;
-    warnValueText: string;
-    warnFieldName: string;
-    warnValueName: string;
-  }
-> => {
-  return {
-    [MetadataType.Manage]: {
-      title: t('common.delete') + ' ' + t('knowledgeDetails.metadata.metadata'),
-      warnFieldText: t('knowledgeDetails.metadata.deleteManageFieldAllWarn'),
-      warnValueText: t('knowledgeDetails.metadata.deleteManageValueAllWarn'),
-      warnFieldName: t('knowledgeDetails.metadata.fieldNameExists'),
-      warnValueName: t('knowledgeDetails.metadata.valueExists'),
-    },
-    [MetadataType.Setting]: {
-      title: t('common.delete') + ' ' + t('knowledgeDetails.metadata.metadata'),
-      warnFieldText: t('knowledgeDetails.metadata.deleteSettingFieldWarn'),
-      warnValueText: t('knowledgeDetails.metadata.deleteSettingValueWarn'),
-      warnFieldName: t('knowledgeDetails.metadata.fieldExists'),
-      warnValueName: t('knowledgeDetails.metadata.valueExists'),
-    },
-    [MetadataType.UpdateSingle]: {
-      title: t('common.delete') + ' ' + t('knowledgeDetails.metadata.metadata'),
-      warnFieldText: t('knowledgeDetails.metadata.deleteManageFieldSingleWarn'),
-      warnValueText: t('knowledgeDetails.metadata.deleteManageValueSingleWarn'),
-      warnFieldName: t('knowledgeDetails.metadata.fieldSingleNameExists'),
-      warnValueName: t('knowledgeDetails.metadata.valueSingleExists'),
-    },
-    [MetadataType.SingleFileSetting]: {
-      title: t('common.delete') + ' ' + t('knowledgeDetails.metadata.metadata'),
-      warnFieldText: t('knowledgeDetails.metadata.deleteSettingFieldWarn'),
-      warnValueText: t('knowledgeDetails.metadata.deleteSettingValueWarn'),
-      warnFieldName: t('knowledgeDetails.metadata.fieldExists'),
-      warnValueName: t('knowledgeDetails.metadata.valueSingleExists'),
-    },
-  };
-};
-
-const DEFAULT_VALUE_TYPE: MetadataValueType = 'string';
-// const VALUE_TYPES_WITH_ENUM = new Set<MetadataValueType>(['enum']);
-const VALUE_TYPE_LABELS: Record<MetadataValueType, string> = {
-  string: 'String',
-  time: 'Time',
-  number: 'Number',
-  // bool: 'Bool',
-  // enum: 'Enum',
-  // 'list<string>': 'List<String>',
-  // int: 'Int',
-  // float: 'Float',
-};
-
-export const metadataValueTypeOptions = Object.entries(VALUE_TYPE_LABELS).map(
-  ([value, label]) => ({ label, value }),
-);
-
-export const getMetadataValueTypeLabel = (value?: MetadataValueType) =>
-  VALUE_TYPE_LABELS[value || DEFAULT_VALUE_TYPE] || VALUE_TYPE_LABELS.string;
-
-// export const isMetadataValueTypeWithEnum = (value?: MetadataValueType) =>
-//   VALUE_TYPES_WITH_ENUM.has(value || DEFAULT_VALUE_TYPE);
-
-// const schemaToValueType = (
-//   property?: IMetaDataJsonSchemaProperty,
-// ): MetadataValueType => {
-//   if (!property) return DEFAULT_VALUE_TYPE;
-//   if (
-//     property.type === 'array' &&
-//     property.items?.type === 'string' &&
-//     (property.items.enum?.length || 0) > 0
-//   ) {
-//     return 'enum';
-//   }
-//   if (property.type === 'boolean') return 'bool';
-//   if (property.type === 'integer') return 'int';
-//   if (property.type === 'number') return 'float';
-//   if (property.type === 'string' && property.format) {
-//     return 'time';
-//   }
-//   if (property.type === 'string' && property.enum?.length) {
-//     return 'enum';
-//   }
-//   return DEFAULT_VALUE_TYPE;
-// };
-
-// const valueTypeToSchema = (
-//   valueType: MetadataValueType,
-//   description: string,
-//   values: string[],
-// ): IMetaDataJsonSchemaProperty => {
-//   const schema: IMetaDataJsonSchemaProperty = {
-//     description: description || '',
-//   };
-
-//   switch (valueType) {
-//     case 'bool':
-//       schema.type = 'boolean';
-//       return schema;
-//     case 'int':
-//       schema.type = 'integer';
-//       return schema;
-//     case 'float':
-//       schema.type = 'number';
-//       return schema;
-//     case 'time':
-//       schema.type = 'string';
-//       schema.format = 'date-time';
-//       return schema;
-//     case 'enum':
-//       schema.type = 'string';
-//       if (values?.length) {
-//         schema.enum = values;
-//       }
-//       return schema;
-//     case 'string':
-//     default:
-//       schema.type = 'string';
-//       if (values?.length) {
-//         schema.enum = values;
-//       }
-//       return schema;
-//   }
-// };

 export const util = {
  changeToMetaDataTableData(data: IMetaDataReturnType): IMetaDataTableData[] {
@ -293,7 +155,22 @@ export const useMetadataOperations = () => {
  }, []);

  const addUpdateValue = useCallback(
-    (key: string, originalValue: string, newValue: string) => {
+    (
+      key: string,
+      originalValue: string,
+      newValue: string | string[],
+      type?: MetadataValueType,
+    ) => {
+      let newValuesRes: string | string[];
+      if (type !== metadataValueTypeEnum['list']) {
+        if (Array.isArray(newValue) && newValue.length > 0) {
+          newValuesRes = newValue[0];
+        } else {
+          newValuesRes = newValue;
+        }
+      } else {
+        newValuesRes = newValue;
+      }
      setOperations((prev) => {
        const existsIndex = prev.updates.findIndex(
          (update) => update.key === key && update.match === originalValue,
@ -304,7 +181,8 @@ export const useMetadataOperations = () => {
          updatedUpdates[existsIndex] = {
            key,
            match: originalValue,
-            value: newValue,
+            value: newValuesRes,
+            type,
          };
          return {
            ...prev,
@ -315,7 +193,7 @@ export const useMetadataOperations = () => {
          ...prev,
          updates: [
            ...prev.updates,
-            { key, match: originalValue, value: newValue },
+            { key, match: originalValue, value: newValuesRes, type },
          ],
        };
      });
@ -398,7 +276,7 @@ export const useManageMetaDataModal = (
    resetOperations,
  } = useMetadataOperations();

-  const { setDocumentMeta } = useSetDocumentMeta();
+  // const { setDocumentMeta } = useSetDocumentMeta();

  useEffect(() => {
    if (fetchTypeList.includes(type)) {
@ -468,6 +346,7 @@ export const useManageMetaDataModal = (

  const handleSaveManage = useCallback(
    async (callback: () => void) => {
+      console.log('handleSaveManage', tableData);
      const { data: res } = await updateMetaData({
        kb_id: id as string,
        data: operations,
@ -482,25 +361,25 @@ export const useManageMetaDataModal = (
        callback();
      }
    },
-    [operations, id, t, queryClient, resetOperations, documentIds],
+    [operations, id, t, queryClient, resetOperations, documentIds, tableData],
  );

-  const handleSaveUpdateSingle = useCallback(
-    async (callback: () => void) => {
-      const reqData = util.tableDataToMetaDataJSON(tableData);
-      if (otherData?.id) {
-        const ret = await setDocumentMeta({
-          documentId: otherData?.id,
-          meta: JSON.stringify(reqData),
-        });
-        if (ret === 0) {
-          // message.success(t('message.success'));
-          callback();
-        }
-      }
-    },
-    [tableData, otherData, setDocumentMeta],
-  );
+  // const handleSaveUpdateSingle = useCallback(
+  //   async (callback: () => void) => {
+  //     const reqData = util.tableDataToMetaDataJSON(tableData);
+  //     if (otherData?.id) {
+  //       const ret = await setDocumentMeta({
+  //         documentId: otherData?.id,
+  //         meta: JSON.stringify(reqData),
+  //       });
+  //       if (ret === 0) {
+  //         // message.success(t('message.success'));
+  //         callback();
+  //       }
+  //     }
+  //   },
+  //   [tableData, otherData, setDocumentMeta],
+  // );

  const handleSaveSettings = useCallback(
    async (callback: () => void, builtInMetadata?: IBuiltInMetadataItem[]) => {
--- a/web/src/pages/dataset/components/metedata/hooks/use-manage-values-modal.ts
+++ b/web/src/pages/dataset/components/metedata/hooks/use-manage-values-modal.ts
@ -1,12 +1,16 @@
 import { useCallback, useEffect, useState } from 'react';
 import { useTranslation } from 'react-i18next';
-import { MetadataDeleteMap, MetadataType } from '../hooks/use-manage-modal';
+import {
+  MetadataDeleteMap,
+  MetadataType,
+  metadataValueTypeEnum,
+} from '../constant';
 import { IManageValuesProps, IMetaDataTableData } from '../interface';

 export const useManageValues = (props: IManageValuesProps) => {
  const {
    data,
-
+    isAddValueMode,
    hideModal,
    onSave,
    addUpdateValue,
@ -17,7 +21,8 @@ export const useManageValues = (props: IManageValuesProps) => {
  const { t } = useTranslation();
  const [metaData, setMetaData] = useState<IMetaDataTableData>({
    ...data,
-    valueType: data.valueType || 'string',
+    valueType: data.valueType || metadataValueTypeEnum.string,
+    values: data.values || [''],
  });
  const [valueError, setValueError] = useState<Record<string, string>>({
    field: '',
@ -31,6 +36,8 @@ export const useManageValues = (props: IManageValuesProps) => {
    onOk: () => {},
    onCancel: () => {},
  });
+
+  const [shouldSave, setShouldSave] = useState(false);
  const hideDeleteModal = () => {
    setDeleteDialogContent({
      visible: false,
@ -79,10 +86,11 @@ export const useManageValues = (props: IManageValuesProps) => {
            restrictDefinedValues: prev.restrictDefinedValues,
          };
        }
-        return {
+        const newMetadata = {
          ...prev,
          [field]: value,
        };
+        return newMetadata;
      });
      return true;
    },
@ -90,13 +98,13 @@ export const useManageValues = (props: IManageValuesProps) => {
  );

  // Maintain separate state for each input box
-  const [tempValues, setTempValues] = useState<string[]>([...data.values]);
+  const [tempValues, setTempValues] = useState<string[]>(['']);

  useEffect(() => {
    setTempValues([...data.values]);
    setMetaData({
      ...data,
-      valueType: data.valueType || 'string',
+      valueType: data.valueType || metadataValueTypeEnum.string,
    });
  }, [data]);

@ -119,31 +127,63 @@ export const useManageValues = (props: IManageValuesProps) => {
    // handleHideModal();
    // return;
    // }
-    onSave(metaData);
-    handleHideModal();
-  }, [metaData, onSave, handleHideModal, type, valueError]);
+    if (isAddValueMode) {
+      addUpdateValue(
+        metaData.field,
+        undefined,
+        metaData.values,
+        metaData.valueType,
+      );
+    }
+    // onSave(metaData);
+    setShouldSave(true);
+  }, [
+    metaData,
+    // onSave,
+    // handleHideModal,
+    type,
+    valueError,
+    isAddValueMode,
+    addUpdateValue,
+  ]);
+
+  useEffect(() => {
+    if (shouldSave) {
+      const timer = setTimeout(() => {
+        onSave(metaData);
+        setShouldSave(false);
+        clearTimeout(timer);
+        handleHideModal();
+      }, 100);
+    }
+  }, [shouldSave, onSave, handleHideModal, metaData]);

  // Handle blur event, synchronize to main state
  const handleValueBlur = useCallback(
    (values?: string[]) => {
      const newValues = values || tempValues;
-      if (data.values.length > 0) {
+      if (data.values.length > 0 && !isAddValueMode) {
        newValues.forEach((newValue, index) => {
          if (index < data.values.length) {
            const originalValue = data.values[index];
            if (originalValue !== newValue) {
-              addUpdateValue(metaData.field, originalValue, newValue);
+              addUpdateValue(
+                metaData.field,
+                originalValue,
+                newValue,
+                metaData.valueType,
+              );
            }
          } else {
            if (newValue) {
-              addUpdateValue(metaData.field, '', newValue);
+              addUpdateValue(metaData.field, '', newValue, metaData.valueType);
            }
          }
        });
      }
      handleChange('values', [...new Set([...newValues])]);
    },
-    [handleChange, tempValues, metaData, data, addUpdateValue],
+    [handleChange, tempValues, metaData, data, addUpdateValue, isAddValueMode],
  );

  // Handle value changes, only update temporary state
@ -200,13 +240,16 @@ export const useManageValues = (props: IManageValuesProps) => {
    [addDeleteValue, metaData],
  );

-  const handleClearValues = useCallback(() => {
-    setTempValues([]);
-    setMetaData((prev) => ({
-      ...prev,
-      values: [],
-    }));
-  }, [setTempValues, setMetaData]);
+  const handleClearValues = useCallback(
+    (isClearInitialValues = false) => {
+      setTempValues(isClearInitialValues ? [] : ['']);
+      setMetaData((prev) => ({
+        ...prev,
+        values: isClearInitialValues ? [] : [''],
+      }));
+    },
+    [setTempValues, setMetaData],
+  );

  const showDeleteModal = (item: string, callback: () => void) => {
    setDeleteDialogContent({