Feat: Save the configuration information of the knowledge base document #3221 (#7317)

### What problem does this PR solve?

Feat: Save the configuration information of the knowledge base document
#3221

### Type of change


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

web/src/pages/dataset/dataset/parsing-status-cell.tsx

@@ -1,16 +1,16 @@
 import { ConfirmDeleteDialog } from '@/components/confirm-delete-dialog';
 import { Button } from '@/components/ui/button';
 import {
-  HoverCard,
-  HoverCardContent,
-  HoverCardTrigger,
-} from '@/components/ui/hover-card';
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuTrigger,
+} from '@/components/ui/dropdown-menu';
 import { Progress } from '@/components/ui/progress';
 import { Separator } from '@/components/ui/separator';
 import { IDocumentInfo } from '@/interfaces/database/document';
-import { cn } from '@/lib/utils';
 import { CircleX, Play, RefreshCw } from 'lucide-react';
-import { PropsWithChildren, useCallback } from 'react';
+import { useCallback } from 'react';
 import { useTranslation } from 'react-i18next';
 import { RunningStatus } from './constant';
 import { ParsingCard } from './parsing-card';
@@ -26,22 +26,6 @@ const IconMap = {
   [RunningStatus.FAIL]: <RefreshCw />,
 };
 
-function MenuItem({
-  children,
-  onClick,
-}: PropsWithChildren & { onClick?(): void }) {
-  return (
-    <div
-      onClick={onClick}
-      className={cn(
-        'relative flex cursor-default select-none items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0',
-      )}
-    >
-      {children}
-    </div>
-  );
-}
-
 export function ParsingStatusCell({
   record,
   showChangeParserModal,
@@ -67,19 +51,21 @@ export function ParsingStatusCell({
   return (
     <section className="flex gap-2 items-center ">
       <div>
-        <HoverCard>
-          <HoverCardTrigger>
+        <DropdownMenu>
+          <DropdownMenuTrigger>
             <Button variant={'ghost'} size={'sm'}>
               {parser_id}
             </Button>
-          </HoverCardTrigger>
-          <HoverCardContent>
-            <MenuItem onClick={handleShowChangeParserModal}>
+          </DropdownMenuTrigger>
+          <DropdownMenuContent>
+            <DropdownMenuItem onClick={handleShowChangeParserModal}>
               {t('knowledgeDetails.chunkMethod')}
-            </MenuItem>
-            <MenuItem>{t('knowledgeDetails.setMetaData')}</MenuItem>
-          </HoverCardContent>
-        </HoverCard>
+            </DropdownMenuItem>
+            <DropdownMenuItem>
+              {t('knowledgeDetails.setMetaData')}
+            </DropdownMenuItem>
+          </DropdownMenuContent>
+        </DropdownMenu>
 
         <Separator orientation="vertical" />
       </div>

web/src/pages/dataset/dataset/use-change-document-parser.ts

@@ -1,7 +1,7 @@
 import { useSetModalState } from '@/hooks/common-hooks';
 import { useSetDocumentParser } from '@/hooks/use-document-request';
 import { IDocumentInfo } from '@/interfaces/database/document';
-import { IChangeParserConfigRequestBody } from '@/interfaces/request/document';
+import { IChangeParserRequestBody } from '@/interfaces/request/document';
 import { useCallback, useState } from 'react';
 
 export const useChangeDocumentParser = () => {
@@ -15,12 +15,12 @@ export const useChangeDocumentParser = () => {
   } = useSetModalState();
 
   const onChangeParserOk = useCallback(
-    async (parserId: string, parserConfig: IChangeParserConfigRequestBody) => {
+    async (parserConfigInfo: IChangeParserRequestBody) => {
       if (record?.id) {
         const ret = await setDocumentParser({
-          parserId,
+          parserId: parserConfigInfo.parser_id,
           documentId: record?.id,
-          parserConfig,
+          parserConfig: parserConfigInfo.parser_config,
         });
         if (ret === 0) {
           hideChangeParserModal();

web/src/pages/dataset/dataset/use-dataset-table-columns.tsx

@@ -83,7 +83,7 @@ export function useDatasetTableColumns({
           </Button>
         );
       },
-      // meta: { cellClassName: 'max-w-[20vw]' },
+      meta: { cellClassName: 'max-w-[20vw]' },
       cell: ({ row }) => {
         const name: string = row.getValue('name');