From 97807950108d30ceeb24bda3590d74797d1d105e Mon Sep 17 00:00:00 2001
From: Joel <iamjoel007@gmail.com>
Date: Fri, 28 Feb 2025 15:32:26 +0800
Subject: [PATCH] feat: in document detail to manange

---
 .../metadata/hooks/use-edit-dataset-metadata.ts     | 13 +++++++++++--
 .../metadata-dataset/select-metadata-modal.tsx      |  4 +++-
 .../datasets/metadata/metadata-document/index.tsx   |  4 ++++
 .../metadata/metadata-document/info-group.tsx       | 12 +++++++++++-
 web/app/components/datasets/metadata/types.ts       |  2 ++
 5 files changed, 31 insertions(+), 4 deletions(-)

diff --git a/web/app/components/datasets/metadata/hooks/use-edit-dataset-metadata.ts b/web/app/components/datasets/metadata/hooks/use-edit-dataset-metadata.ts
index 3fdf3a475c..b538e5da23 100644
--- a/web/app/components/datasets/metadata/hooks/use-edit-dataset-metadata.ts
+++ b/web/app/components/datasets/metadata/hooks/use-edit-dataset-metadata.ts
@@ -1,8 +1,8 @@
 import { useBoolean } from 'ahooks'
 import { useBuiltInMetaDataFields, useCreateMetaData, useDatasetMetaData, useDeleteMetaData, useRenameMeta, useUpdateBuiltInStatus } from '@/service/knowledge/use-metadata'
 import type { DataSet } from '@/models/datasets'
-import { useCallback, useState } from 'react'
-import type { BuiltInMetadataItem, MetadataItemWithValueLength } from '../types'
+import { useCallback, useEffect, useState } from 'react'
+import { type BuiltInMetadataItem, type MetadataItemWithValueLength, isShowManageMetadataLocalStorageKey } from '../types'
 
 const useEditDatasetMetadata = ({
   datasetId,
@@ -16,6 +16,15 @@ const useEditDatasetMetadata = ({
     setFalse: hideEditModal,
   }] = useBoolean(false)
 
+  useEffect(() => {
+    const isShowManageMetadata = localStorage.getItem(isShowManageMetadataLocalStorageKey)
+    if (isShowManageMetadata) {
+      showEditModal()
+      localStorage.removeItem(isShowManageMetadataLocalStorageKey)
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [])
+
   const { data: datasetMetaData } = useDatasetMetaData(datasetId)
 
   const { mutate: doAddMetaData } = useCreateMetaData(datasetId)
diff --git a/web/app/components/datasets/metadata/metadata-dataset/select-metadata-modal.tsx b/web/app/components/datasets/metadata/metadata-dataset/select-metadata-modal.tsx
index a296b91bf6..a31b5c89e6 100644
--- a/web/app/components/datasets/metadata/metadata-dataset/select-metadata-modal.tsx
+++ b/web/app/components/datasets/metadata/metadata-dataset/select-metadata-modal.tsx
@@ -14,6 +14,7 @@ type Props = {
   popupOffset?: { mainAxis: number, crossAxis: number }
   onSave: (data: MetadataItem) => void
   trigger: React.ReactNode
+  onManage: () => void
 } & CreateContentProps
 
 enum Step {
@@ -32,6 +33,7 @@ const SelectMetadataModal: FC<Props> = ({
   popupOffset = { mainAxis: -38, crossAxis: 4 },
   trigger,
   onSave,
+  onManage,
 }) => {
   const [open, setOpen] = useState(false)
   const [step, setStep] = useState(Step.select)
@@ -59,7 +61,7 @@ const SelectMetadataModal: FC<Props> = ({
             onSelect={handleSave}
             list={testMetadataList}
             onNew={() => setStep(Step.create)}
-            onManage={() => { }}
+            onManage={onManage}
           />
         ) : (
           <CreateContent
diff --git a/web/app/components/datasets/metadata/metadata-document/index.tsx b/web/app/components/datasets/metadata/metadata-document/index.tsx
index 7ad3a02fd7..a16c1c9c72 100644
--- a/web/app/components/datasets/metadata/metadata-document/index.tsx
+++ b/web/app/components/datasets/metadata/metadata-document/index.tsx
@@ -51,6 +51,7 @@ const MetadataDocument: FC<Props> = ({
             uppercaseTitle={false}
             titleTooltip={t(`${i18nPrefix}.metadataToolTip`)}
             list={isEdit ? tempList : list}
+            dataSetId={datasetId}
             headerRight={isEdit ? (
               <div className='flex space-x-1'>
                 <Button variant='ghost' size='small' onClick={handleCancel}>
@@ -88,6 +89,7 @@ const MetadataDocument: FC<Props> = ({
                 noHeader
                 titleTooltip='Built-in metadata is system-generated metadata that is automatically added to the document. You can enable or disable built-in metadata here.'
                 list={builtList}
+                dataSetId={datasetId}
               />
             </>
           )}
@@ -101,11 +103,13 @@ const MetadataDocument: FC<Props> = ({
         className='pl-2'
         title={t(`${i18nPrefix}.documentInformation`)}
         list={originInfo}
+        dataSetId={datasetId}
       />
       <InfoGroup
         className='pl-2'
         title={t(`${i18nPrefix}.technicalParameters`)}
         list={technicalParameters}
+        dataSetId={datasetId}
       />
     </div>
   )
diff --git a/web/app/components/datasets/metadata/metadata-document/info-group.tsx b/web/app/components/datasets/metadata/metadata-document/info-group.tsx
index 7a52960439..92da4f774b 100644
--- a/web/app/components/datasets/metadata/metadata-document/info-group.tsx
+++ b/web/app/components/datasets/metadata/metadata-document/info-group.tsx
@@ -1,7 +1,8 @@
 'use client'
 import type { FC } from 'react'
 import React from 'react'
-import type { MetadataItemWithValue } from '../types'
+import { useRouter } from 'next/navigation'
+import { type MetadataItemWithValue, isShowManageMetadataLocalStorageKey } from '../types'
 import Field from './field'
 import InputCombined from '../edit-metadata-batch/input-combined'
 import { RiDeleteBinLine, RiQuestionLine } from '@remixicon/react'
@@ -12,6 +13,7 @@ import SelectMetadataModal from '../metadata-dataset/select-metadata-modal'
 import AddMetadataButton from '../add-metadata-button'
 
 type Props = {
+  dataSetId: string
   className?: string
   noHeader?: boolean
   title?: string
@@ -27,6 +29,7 @@ type Props = {
 }
 
 const InfoGroup: FC<Props> = ({
+  dataSetId,
   className,
   noHeader,
   title,
@@ -40,6 +43,12 @@ const InfoGroup: FC<Props> = ({
   onDelete,
   onAdd,
 }) => {
+  const router = useRouter()
+  const handleMangeMetadata = () => {
+    localStorage.setItem(isShowManageMetadataLocalStorageKey, 'true')
+    router.push(`/datasets/${dataSetId}/documents`)
+  }
+
   return (
     <div className={cn('bg-white', className)}>
       {!noHeader && (
@@ -66,6 +75,7 @@ const InfoGroup: FC<Props> = ({
                 <AddMetadataButton />
               }
               onSave={data => onAdd?.(data)}
+              onManage={handleMangeMetadata}
             />
             <Divider className='my-3 ' bgStyle='gradient' />
           </div>
diff --git a/web/app/components/datasets/metadata/types.ts b/web/app/components/datasets/metadata/types.ts
index e1a0b703ab..c0bb8c124a 100644
--- a/web/app/components/datasets/metadata/types.ts
+++ b/web/app/components/datasets/metadata/types.ts
@@ -37,3 +37,5 @@ export type MetadataItemWithEdit = MetadataItemWithValue & {
   isUpdated?: boolean
   updateType?: UpdateType
 }
+
+export const isShowManageMetadataLocalStorageKey = 'dify-isShowManageMetadata'