feat: add use api

web/app/components/datasets/documents/index.tsx

@@ -241,6 +241,7 @@ const Documents: FC<IDocumentsProps> = ({ datasetId }) => {
     showEditModal: showEditMetadataModal,
     hideEditModal: hideEditMetadataModal,
     datasetMetaData,
+    handleAddMetaData,
     handleDeleteMetaData,
     builtInEnabled,
     setBuiltInEnabled,
@@ -291,6 +292,7 @@ const Documents: FC<IDocumentsProps> = ({ datasetId }) => {
                 onIsBuiltInEnabledChange={setBuiltInEnabled}
                 onClose={hideEditMetadataModal}
                 onChange={() => { }}
+                onAdd={handleAddMetaData}
                 onRemove={handleDeleteMetaData}
               />
             )}

web/app/components/datasets/metadata/hooks/use-edit-document-metadata.ts

@@ -1,7 +1,8 @@
 import { useBoolean } from 'ahooks'
-import { useBuiltInMetaData, useDatasetMetaData, useDeleteMetaData, useUpdateBuiltInStatus } from '@/service/knowledge/use-metadata'
+import { useBuiltInMetaData, useCreateMetaData, useDatasetMetaData, useDeleteMetaData, useUpdateBuiltInStatus } from '@/service/knowledge/use-metadata'
 import type { DataSet } from '@/models/datasets'
 import { useCallback, useState } from 'react'
+import type { BuiltInMetadataItem } from '../types'
 
 const useEditDocumentMetadata = ({
   datasetId,
@@ -16,6 +17,12 @@ const useEditDocumentMetadata = ({
   }] = useBoolean(false)
 
   const { data: datasetMetaData } = useDatasetMetaData(datasetId)
+
+  const { mutate: doAddMetaData } = useCreateMetaData(datasetId)
+  const handleAddMetaData = useCallback((payload: BuiltInMetadataItem) => {
+    doAddMetaData(payload)
+  }, [doAddMetaData])
+
   const { mutate: doDeleteMetaData } = useDeleteMetaData(datasetId)
   const handleDeleteMetaData = useCallback((metaDataId: string) => {
     doDeleteMetaData(metaDataId)
@@ -29,6 +36,7 @@ const useEditDocumentMetadata = ({
     showEditModal,
     hideEditModal,
     datasetMetaData: datasetMetaData?.data,
+    handleAddMetaData,
     handleDeleteMetaData,
     builtInMetaData: builtInMetaData?.fields,
     builtInEnabled,

web/app/components/datasets/metadata/metadata-dataset/create-content.tsx

@@ -12,12 +12,14 @@ import { useTranslation } from 'react-i18next'
 const i18nPrefix = 'dataset.metadata.createMetadata'
 
 export type Props = {
+  onClose?: () => void
   onSave: (data: any) => void
   hasBack?: boolean
   onBack?: () => void
 }
 
 const CreateContent: FC<Props> = ({
+  onClose = () => { },
   hasBack,
   onBack,
   onSave,
@@ -43,7 +45,7 @@ const CreateContent: FC<Props> = ({
   return (
     <ModalLikeWrap
       title={t(`${i18nPrefix}.title`)}
-      onClose={() => { }}
+      onClose={onClose}
       onConfirm={handleSave}
       hideCloseBtn={hasBack}
       beforeHeader={hasBack && (

web/app/components/datasets/metadata/metadata-dataset/create-metadata-modal.tsx

@@ -1,23 +1,25 @@
 'use client'
 import type { FC } from 'react'
-import React, { useState } from 'react'
+import React from 'react'
 import type { Props as CreateContentProps } from './create-content'
 import CreateContent from './create-content'
 import { PortalToFollowElem, PortalToFollowElemContent, PortalToFollowElemTrigger } from '../../../base/portal-to-follow-elem'
 
 type Props = {
+  open: boolean
+  setOpen: (open: boolean) => void
   onSave: (data: any) => void
   trigger: React.ReactNode
   popupLeft?: number
 } & CreateContentProps
 
 const CreateMetadataModal: FC<Props> = ({
+  open,
+  setOpen,
   trigger,
   popupLeft = 20,
   ...createContentProps
 }) => {
-  const [open, setOpen] = useState(false)
-
   return (
     <PortalToFollowElem
       open={open}
@@ -34,7 +36,7 @@ const CreateMetadataModal: FC<Props> = ({
         {trigger}
       </PortalToFollowElemTrigger>
       <PortalToFollowElemContent className='z-[1000]'>
-        <CreateContent {...createContentProps} />
+        <CreateContent {...createContentProps} onClose={() => setOpen(false)} />
       </PortalToFollowElemContent>
     </PortalToFollowElem >
 

web/app/components/datasets/metadata/metadata-dataset/dataset-metadata-drawer.tsx

@@ -28,6 +28,7 @@ type Props = {
   onIsBuiltInEnabledChange: (value: boolean) => void
   onClose: () => void
   onChange: (data: MetadataItemWithValueLength[]) => void
+  onAdd: (payload: BuiltInMetadataItem) => void
   onRemove: (metaDataId: string) => void
 }
 
@@ -96,8 +97,8 @@ const Item: FC<ItemProps> = ({
           <Confirm
             isShow
             type='warning'
-            title={'Confirm to delete'}
-            content={`Are you sure you want to delete the metadata "${payload.name}"?`}
+            title={t('dataset.metadata.datasetMetadata.deleteTitle')}
+            content={t('dataset.metadata.datasetMetadata.deleteContent', { name: payload.name })}
             onConfirm={handleDelete}
             onCancel={hideDeleteConfirm}
           />
@@ -114,6 +115,7 @@ const DatasetMetadataDrawer: FC<Props> = ({
   onIsBuiltInEnabledChange,
   onClose,
   onChange,
+  onAdd,
   onRemove,
 }) => {
   const { t } = useTranslation()
@@ -128,12 +130,15 @@ const DatasetMetadataDrawer: FC<Props> = ({
     }
   }, [setCurrPayload, setIsShowRenameModal])
 
-  const handleAdd = useCallback((data: MetadataItemWithValueLength) => {
-    const nextUserMetadata = produce(userMetadata, (draft) => {
-      draft.push(data)
+  const [open, setOpen] = useState(false)
+  const handleAdd = useCallback(async (data: MetadataItemWithValueLength) => {
+    await onAdd(data)
+    Toast.notify({
+      type: 'success',
+      message: t('common.api.success'),
     })
-    onChange(nextUserMetadata)
-  }, [userMetadata, onChange])
+    setOpen(false)
+  }, [onAdd, t])
 
   const handleRenamed = useCallback(() => {
     const nextUserMetadata = produce(userMetadata, (draft) => {
@@ -167,10 +172,14 @@ const DatasetMetadataDrawer: FC<Props> = ({
     >
       <div className='system-sm-regular text-text-tertiary'>{t(`${i18nPrefix}.description`)}</div>
 
-      <CreateModal trigger={<Button variant='primary' className='mt-3'>
+      <CreateModal
+        open={open}
+        setOpen={setOpen}
+        trigger={<Button variant='primary' className='mt-3'>
           <RiAddLine className='mr-1' />
           {t(`${i18nPrefix}.addMetaData`)}
-      </Button>} hasBack onSave={handleAdd} />
+        </Button>} hasBack onSave={handleAdd}
+      />
 
       <div className='mt-3 space-y-1'>
         {userMetadata.map(payload => (

web/app/components/datasets/metadata/types.ts

@@ -20,6 +20,7 @@ export type MetadataItemWithValue = MetadataItem & {
 export type MetadataItemWithValueLength = MetadataItem & {
   use_count: number
 }
+
 export enum UpdateType {
   changeValue = 'changeValue',
   delete = 'delete',

web/i18n/en-US/dataset.ts

@@ -200,6 +200,8 @@ const translation = {
       namePlaceholder: 'Metadata name',
       builtIn: 'Built-in',
       builtInDescription: 'Built-in metadata is automatically extracted and generated. It must be enabled before use and cannot be edited.',
+      deleteTitle: 'Confirm to delete',
+      deleteContent: 'Are you sure you want to delete the metadata "{{name}}"',
     },
     documentMetadata: {
       metadataToolTip: 'Metadata serves as a critical filter that enhances the accuracy and relevance of information retrieval. You can modify and add metadata for this document here.',

web/i18n/zh-Hans/dataset.ts

@@ -200,6 +200,8 @@ const translation = {
       namePlaceholder: '元数据名称',
       builtIn: '内置',
       builtInDescription: '内置元数据是系统预定义的元数据，您可以在此处查看和管理内置元数据。',
+      deleteTitle: '确定删除',
+      deleteContent: '你确定要删除元数据 "{{name}}" 吗?',
     },
     documentMetadata: {
       metadataToolTip: '元数据是关于文档的数据，用于描述文档的属性。元数据可以帮助您更好地组织和管理文档。',

web/service/knowledge/use-metadata.ts

@@ -36,6 +36,21 @@ export const useInvalidDatasetMetaData = (datasetId: string) => {
   return useInvalid([NAME_SPACE, 'dataset', datasetId])
 }
 
+export const useCreateMetaData = (datasetId: string) => {
+  const invalidDatasetMetaData = useInvalidDatasetMetaData(datasetId)
+  return useMutation({
+    mutationFn: async (payload: BuiltInMetadataItem) => {
+      datasetMetaData.push({
+        id: `${Math.random()}`,
+        ...payload,
+        use_count: 0,
+      })
+      await invalidDatasetMetaData()
+      return Promise.resolve(true)
+    },
+  })
+}
+
 export const useDeleteMetaData = (datasetId: string) => {
   const invalidDatasetMetaData = useInvalidDatasetMetaData(datasetId)
   return useMutation({