Fix: Optimize code and fix ts type errors #9869 (#10666)

### What problem does this PR solve? Fix: Optimize code and fix ts type errors #9869 ### Type of change - [x] Bug Fix (non-breaking change which fixes an issue)
2025-12-08 20:42:30 +08:00 · 2025-10-20 15:59:56 +08:00
parent cc703da747
commit de46b0d46e
18 changed files with 377 additions and 267 deletions
--- a/web/src/pages/dataflow-result/components/chunk-result-bar/index.tsx
+++ b/web/src/pages/dataflow-result/components/chunk-result-bar/index.tsx
@ -5,7 +5,7 @@ import { Plus } from 'lucide-react';
 import { useState } from 'react';
 import { ChunkTextMode } from '../../constant';
 interface ChunkResultBarProps {
-  changeChunkTextMode: React.Dispatch<React.SetStateAction<string | number>>;
+  changeChunkTextMode: (mode: ChunkTextMode) => void;
  createChunk: (text: string) => void;
  isReadonly: boolean;
 }
@ -15,7 +15,7 @@ export default ({
  isReadonly,
 }: ChunkResultBarProps) => {
  const { t } = useTranslate('chunk');
-  const [textSelectValue, setTextSelectValue] = useState<string | number>(
+  const [textSelectValue, setTextSelectValue] = useState<ChunkTextMode>(
    ChunkTextMode.Full,
  );
  const textSelectOptions = [
@ -23,7 +23,7 @@ export default ({
    { label: t(ChunkTextMode.Ellipse), value: ChunkTextMode.Ellipse },
  ];

-  const changeTextSelectValue = (value: string | number) => {
+  const changeTextSelectValue = (value: ChunkTextMode) => {
    setTextSelectValue(value);
    changeChunkTextMode(value);
  };
--- a/web/src/pages/dataflow-result/components/parse-editer/interface.ts
+++ b/web/src/pages/dataflow-result/components/parse-editer/interface.ts
@ -8,6 +8,7 @@ export interface FormatPreserveEditorProps {
    key: keyof typeof parserKeyMap | 'text' | 'html';
    type: string;
    value: Array<{ [key: string]: string }>;
+    params: ComponentParams;
  };
  onSave: (value: any) => void;
  className?: string;
--- a/web/src/pages/dataflow-result/components/parse-editer/json-parser.tsx
+++ b/web/src/pages/dataflow-result/components/parse-editer/json-parser.tsx
@ -4,6 +4,7 @@ import { isArray } from 'lodash';
 import { useCallback, useEffect, useMemo } from 'react';
 import { ChunkTextMode } from '../../constant';
 import styles from '../../index.less';
+import { IChunk } from '../../interface';
 import { useParserInit } from './hook';
 import { IJsonContainerProps } from './interface';
 export const parserKeyMap = {
@ -17,8 +18,6 @@ export const ArrayContainer = (props: IJsonContainerProps) => {
    isChunck,
    handleCheck,
    selectedChunkIds,
-    unescapeNewlines,
-    escapeNewlines,
    onSave,
    className,
    textMode,
@ -26,13 +25,8 @@ export const ArrayContainer = (props: IJsonContainerProps) => {
    isReadonly,
  } = props;

-  const {
-    content,
-    setContent,
-    activeEditIndex,
-    setActiveEditIndex,
-    editDivRef,
-  } = useParserInit({ initialValue });
+  const { content, activeEditIndex, setActiveEditIndex, editDivRef } =
+    useParserInit({ initialValue });

  const parserKey = useMemo(() => {
    const key =
@ -46,35 +40,39 @@ export const ArrayContainer = (props: IJsonContainerProps) => {
    (e?: any, index?: number) => {
      setActiveEditIndex(index);
    },
-    [setContent, setActiveEditIndex],
+    [setActiveEditIndex],
  );

  const handleSave = useCallback(
    (e: any) => {
-      const saveData = {
-        ...content,
-        value: content.value?.map((item, index) => {
-          if (index === activeEditIndex) {
-            return {
-              ...item,
-              [parserKey]: e.target.textContent || '',
-            };
-          } else {
-            return item;
-          }
-        }),
-      };
-      onSave(saveData);
+      if (Array.isArray(content.value)) {
+        const saveData = {
+          ...content,
+          value: content.value?.map((item, index) => {
+            if (index === activeEditIndex) {
+              return {
+                ...item,
+                [parserKey]: e.target.textContent || '',
+              };
+            } else {
+              return item;
+            }
+          }),
+        };
+        onSave(saveData as any);
+      }
      setActiveEditIndex(undefined);
    },
-    [content, onSave],
+    [content, onSave, activeEditIndex, parserKey, setActiveEditIndex],
  );

  useEffect(() => {
    if (activeEditIndex !== undefined && editDivRef.current) {
      editDivRef.current.focus();
-      editDivRef.current.textContent =
-        content.value[activeEditIndex][parserKey];
+      if (typeof content.value !== 'string') {
+        editDivRef.current.textContent =
+          content.value[activeEditIndex][parserKey];
+      }
    }
  }, [editDivRef, activeEditIndex, content, parserKey]);

@ -122,7 +120,7 @@ export const ArrayContainer = (props: IJsonContainerProps) => {
              {activeEditIndex !== index && (
                <div
                  className={cn(
-                    'text-text-secondary overflow-auto scrollbar-auto w-full',
+                    'text-text-secondary overflow-auto scrollbar-auto w-full min-h-3',
                    {
                      [styles.contentEllipsis]:
                        textMode === ChunkTextMode.Ellipse,
@ -130,7 +128,8 @@ export const ArrayContainer = (props: IJsonContainerProps) => {
                  )}
                  key={index}
                  onClick={(e) => {
-                    clickChunk(item);
+                    clickChunk(item as unknown as IChunk);
+                    console.log('clickChunk', item, index);
                    if (!isReadonly) {
                      handleEdit(e, index);
                    }
--- a/web/src/pages/dataflow-result/components/parse-editer/object-parser.tsx
+++ b/web/src/pages/dataflow-result/components/parse-editer/object-parser.tsx
@ -2,14 +2,13 @@ import { cn } from '@/lib/utils';
 import { useCallback, useEffect } from 'react';
 import { ChunkTextMode } from '../../constant';
 import styles from '../../index.less';
+import { IChunk } from '../../interface';
 import { useParserInit } from './hook';
 import { IObjContainerProps } from './interface';
 export const ObjectContainer = (props: IObjContainerProps) => {
  const {
    initialValue,
    isChunck,
-    unescapeNewlines,
-    escapeNewlines,
    onSave,
    className,
    textMode,
@ -19,7 +18,7 @@ export const ObjectContainer = (props: IObjContainerProps) => {

  const {
    content,
-    setContent,
+    // setContent,
    activeEditIndex,
    setActiveEditIndex,
    editDivRef,
@ -31,7 +30,7 @@ export const ObjectContainer = (props: IObjContainerProps) => {
    //   value: escapeNewlines(e.target.innerText),
    // }));
    setActiveEditIndex(1);
-  }, [setContent, setActiveEditIndex]);
+  }, [setActiveEditIndex]);

  const handleSave = useCallback(
    (e: any) => {
@ -42,7 +41,7 @@ export const ObjectContainer = (props: IObjContainerProps) => {
      onSave(saveData);
      setActiveEditIndex(undefined);
    },
-    [content, onSave],
+    [content, onSave, setActiveEditIndex],
  );

  useEffect(() => {
@ -81,14 +80,14 @@ export const ObjectContainer = (props: IObjContainerProps) => {
                [styles.contentEllipsis]: textMode === ChunkTextMode.Ellipse,
              },
            )}
-            onClick={(e) => {
-              clickChunk(content);
+            onClick={() => {
+              clickChunk(content as unknown as IChunk);
              if (!isReadonly) {
-                handleEdit(e);
+                handleEdit();
              }
            }}
          >
-            {content.value}
+            {content.value as string}
          </div>
        )}
      </section>
--- a/web/src/pages/dataflow-result/hooks.ts
+++ b/web/src/pages/dataflow-result/hooks.ts
@ -4,7 +4,6 @@ import { useCreateChunk, useDeleteChunk } from '@/hooks/chunk-hooks';
 import { useSetModalState, useShowDeleteConfirm } from '@/hooks/common-hooks';
 import { useGetKnowledgeSearchParams } from '@/hooks/route-hook';
 import { useFetchMessageTrace } from '@/hooks/use-agent-request';
-import { IChunk } from '@/interfaces/database/knowledge';
 import kbService from '@/services/knowledge-service';
 import { formatSecondsToHumanReadable } from '@/utils/date';
 import { buildChunkHighlights } from '@/utils/document-util';
@ -20,7 +19,7 @@ import {
  PipelineResultSearchParams,
  TimelineNodeType,
 } from './constant';
-import { IDslComponent, IPipelineFileLogDetail } from './interface';
+import { IChunk, IDslComponent, IPipelineFileLogDetail } from './interface';

 export const useFetchPipelineFileLogDetail = ({
  isAgent = false,
@ -64,7 +63,6 @@ export const useHandleChunkCardClick = () => {
  const [selectedChunk, setSelectedChunk] = useState<IChunk>();

  const handleChunkCardClick = useCallback((chunk: IChunk) => {
-    console.log('click-chunk-->', chunk);
    setSelectedChunk(chunk);
  }, []);

@ -75,7 +73,9 @@ export const useGetChunkHighlights = (selectedChunk?: IChunk) => {
  const [size, setSize] = useState({ width: 849, height: 1200 });

  const highlights: IHighlight[] = useMemo(() => {
-    return selectedChunk ? buildChunkHighlights(selectedChunk, size) : [];
+    return selectedChunk
+      ? buildChunkHighlights(selectedChunk as any, size)
+      : [];
  }, [selectedChunk, size]);

  const setWidthAndHeight = useCallback((width: number, height: number) => {
--- a/web/src/pages/dataflow-result/interface.ts
+++ b/web/src/pages/dataflow-result/interface.ts
@ -126,8 +126,17 @@ export interface IPipelineFileLogDetail {
 }

 export interface IChunk {
+  available_int?: number; // Whether to enable, 0: not enabled, 1: enabled
+  chunk_id?: string;
+  content_with_weight?: string;
+  doc_id?: string;
+  doc_name?: string;
+  image_id?: string;
+  important_kwd?: string[];
+  question_kwd?: string[]; // keywords
+  tag_kwd?: string[];
  positions: number[][];
-  image_id: string;
+  tag_feas?: Record<string, number>;
  text: string;
 }

--- a/web/src/pages/dataflow-result/parser.tsx
+++ b/web/src/pages/dataflow-result/parser.tsx
@ -40,12 +40,17 @@ const ParserContainer = (props: IProps) => {
  const initialValue = useMemo(() => {
    const outputs = data?.value?.obj?.params?.outputs;
    const key = outputs?.output_format?.value;
-    if (!outputs || !key) return { key: '', type: '', value: [] };
-    const value = outputs[key]?.value;
-    const type = outputs[key]?.type;
+    if (!outputs || !key)
+      return {
+        key: '' as 'text' | 'html' | 'json' | 'chunks',
+        type: '',
+        value: [],
+      };
+    const value = outputs[key as keyof typeof outputs]?.value;
+    const type = outputs[key as keyof typeof outputs]?.type;
    console.log('outputs-->', outputs, data, key, value);
    return {
-      key,
+      key: key as 'text' | 'html' | 'json' | 'chunks',
      type,
      value,
      params: data?.value?.obj?.params,
@ -95,7 +100,7 @@ const ParserContainer = (props: IProps) => {
  const handleRemoveChunk = useCallback(async () => {
    if (selectedChunkIds.length > 0) {
      initialText.value = initialText.value.filter(
-        (item: any, index: number) => !selectedChunkIds.includes(index + ''),
+        (_item: any, index: number) => !selectedChunkIds.includes(index + ''),
      );
      setIsChange(true);
      setSelectedChunkIds([]);
@ -118,7 +123,7 @@ const ParserContainer = (props: IProps) => {
  const selectAllChunk = useCallback(
    (checked: boolean) => {
      setSelectedChunkIds(
-        checked ? initialText.value.map((x, index: number) => index) : [],
+        checked ? initialText.value.map((_x: any, index: number) => index) : [],
      );
    },
    [initialText.value],
--- a/web/src/pages/dataset/dataset-overview/index.tsx
+++ b/web/src/pages/dataset/dataset-overview/index.tsx
@ -12,6 +12,7 @@ import { RunningStatus } from '../dataset/constant';
 import { LogTabs } from './dataset-common';
 import { DatasetFilter } from './dataset-filter';
 import { useFetchFileLogList, useFetchOverviewTital } from './hook';
+import { DocumentLog, IFileLogItem } from './interface';
 import FileLogsTable from './overview-table';

 interface StatCardProps {
@ -212,18 +213,25 @@ const FileLogsPage: FC = () => {
      return tableOriginData.logs.map((item) => {
        return {
          ...item,
-          fileName: item.document_name,
-          statusName: item.operation_status,
-        };
+          status: item.operation_status as RunningStatus,
+          statusName: RunningStatusMap[item.operation_status as RunningStatus],
+        } as unknown as IFileLogItem & DocumentLog;
      });
    }
+    return [];
  }, [tableOriginData]);

  const changeActiveLogs = (active: (typeof LogTabs)[keyof typeof LogTabs]) => {
    setFilterValue({});
    setActive(active);
  };
-  const handlePaginationChange = (page: number, pageSize: number) => {
+  const handlePaginationChange = ({
+    page,
+    pageSize,
+  }: {
+    page: number;
+    pageSize: number;
+  }) => {
    console.log('Pagination changed:', { page, pageSize });
    setPagination({
      ...pagination,
--- a/web/src/pages/dataset/dataset-overview/interface.ts
+++ b/web/src/pages/dataset/dataset-overview/interface.ts
@ -57,6 +57,6 @@ export interface IFileLogItem {
  update_time: number;
 }
 export interface IFileLogList {
-  logs: IFileLogItem[];
+  logs: Array<IFileLogItem & DocumentLog>;
  total: number;
 }
--- a/web/src/pages/dataset/dataset-setting/index.tsx
+++ b/web/src/pages/dataset/dataset-setting/index.tsx
@ -1,7 +1,4 @@
-import {
-  DataFlowSelect,
-  IDataPipelineSelectNode,
-} from '@/components/data-pipeline-select';
+import { DataFlowSelect } from '@/components/data-pipeline-select';
 import GraphRagItems from '@/components/parse-configuration/graph-rag-form-fields';
 import RaptorFormFields from '@/components/parse-configuration/raptor-form-fields';
 import { Button } from '@/components/ui/button';
@ -22,7 +19,6 @@ import {
 } from '../dataset/generate-button/generate';
 import { ChunkMethodForm } from './chunk-method-form';
 import ChunkMethodLearnMore from './chunk-method-learn-more';
-import { IDataPipelineNodeProps } from './components/link-data-pipeline';
 import { MainContainer } from './configuration-form-container';
 import { ChunkMethodItem, ParseTypeItem } from './configuration/common-item';
 import { formSchema } from './form-schema';
@ -85,7 +81,7 @@ export default function DatasetSettings() {
    },
  });
  const knowledgeDetails = useFetchKnowledgeConfigurationOnMount(form);
-  const [pipelineData, setPipelineData] = useState<IDataPipelineNodeProps>();
+  // const [pipelineData, setPipelineData] = useState<IDataPipelineNodeProps>();
  const [graphRagGenerateData, setGraphRagGenerateData] =
    useState<IGenerateLogButtonProps>();
  const [raptorGenerateData, setRaptorGenerateData] =
@ -94,13 +90,13 @@ export default function DatasetSettings() {
  useEffect(() => {
    console.log('🚀 ~ DatasetSettings ~ knowledgeDetails:', knowledgeDetails);
    if (knowledgeDetails) {
-      const data: IDataPipelineNodeProps = {
-        id: knowledgeDetails.pipeline_id,
-        name: knowledgeDetails.pipeline_name,
-        avatar: knowledgeDetails.pipeline_avatar,
-        linked: true,
-      };
-      setPipelineData(data);
+      // const data: IDataPipelineNodeProps = {
+      //   id: knowledgeDetails.pipeline_id,
+      //   name: knowledgeDetails.pipeline_name,
+      //   avatar: knowledgeDetails.pipeline_avatar,
+      //   linked: true,
+      // };
+      // setPipelineData(data);
      setGraphRagGenerateData({
        finish_at: knowledgeDetails.graphrag_task_finish_at,
        task_id: knowledgeDetails.graphrag_task_id,
@ -121,17 +117,17 @@ export default function DatasetSettings() {
      console.error('An error occurred during submission:', error);
    }
  }
-  const handleLinkOrEditSubmit = (
-    data: IDataPipelineSelectNode | undefined,
-  ) => {
-    console.log('🚀 ~ DatasetSettings ~ data:', data);
-    if (data) {
-      setPipelineData(data);
-      form.setValue('pipeline_id', data.id || '');
-      // form.setValue('pipeline_name', data.name || '');
-      // form.setValue('pipeline_avatar', data.avatar || '');
-    }
-  };
+  // const handleLinkOrEditSubmit = (
+  //   data: IDataPipelineSelectNode | undefined,
+  // ) => {
+  //   console.log('🚀 ~ DatasetSettings ~ data:', data);
+  //   if (data) {
+  //     setPipelineData(data);
+  //     form.setValue('pipeline_id', data.id || '');
+  //     // form.setValue('pipeline_name', data.name || '');
+  //     // form.setValue('pipeline_avatar', data.avatar || '');
+  //   }
+  // };

  const handleDeletePipelineTask = (type: GenerateType) => {
    if (type === GenerateType.KnowledgeGraph) {
@ -203,11 +199,7 @@ export default function DatasetSettings() {
                )}

                <Divider />
-                {parseType === 1 && (
-                  <ChunkMethodForm
-                    selectedTag={selectedTag as DocumentParserType}
-                  />
-                )}
+                {parseType === 1 && <ChunkMethodForm />}

                {/* <LinkDataPipeline
                  data={pipelineData}
--- a/web/src/pages/next-search/mindmap-drawer.tsx
+++ b/web/src/pages/next-search/mindmap-drawer.tsx
@ -9,7 +9,7 @@ interface IProps extends IModalProps<any> {
  data: any;
 }

-const MindMapDrawer = ({ data, hideModal, visible, loading }: IProps) => {
+const MindMapDrawer = ({ data, hideModal, loading }: IProps) => {
  const { t } = useTranslation();
  const percent = usePendingMindMap();
  return (
--- a/web/src/pages/next-search/retrieval-documents/index.tsx
+++ b/web/src/pages/next-search/retrieval-documents/index.tsx
@ -14,15 +14,14 @@ import {
  PopoverContent,
  PopoverTrigger,
 } from '@/components/ui/popover';
+import { Separator } from '@/components/ui/separator';
 import {
  useAllTestingResult,
  useSelectTestingResult,
 } from '@/hooks/knowledge-hooks';
 import { cn } from '@/lib/utils';
-import { Separator } from '@radix-ui/react-select';
 import { CheckIcon, ChevronDown, Files, XIcon } from 'lucide-react';
 import { useMemo, useState } from 'react';
-import { useTranslation } from 'react-i18next';

 interface IProps {
  onTesting(documentIds: string[]): void;
@ -35,11 +34,9 @@ const RetrievalDocuments = ({
  selectedDocumentIds,
  setSelectedDocumentIds,
 }: IProps) => {
-  const { t } = useTranslation();
  const { documents: documentsAll } = useAllTestingResult();
  const { documents } = useSelectTestingResult();
  const [isPopoverOpen, setIsPopoverOpen] = useState(false);
-  const maxCount = 3;
  const { documents: useDocuments } = {
    documents:
      documentsAll?.length > documents?.length ? documentsAll : documents,
--- a/web/src/pages/next-searches/hooks.ts
+++ b/web/src/pages/next-searches/hooks.ts
@ -337,6 +337,8 @@ export const useRenameSearch = () => {
          });
          const detail = reponse.data?.data;
          console.log('detail-->', detail);
+
+          // eslint-disable-next-line @typescript-eslint/no-unused-vars
          const { id, created_by, update_time, ...searchDataTemp } = detail;
          res = await updateSearch({
            ...searchDataTemp,
--- a/web/src/pages/next-searches/index.tsx
+++ b/web/src/pages/next-searches/index.tsx
@ -5,14 +5,13 @@ import { Button } from '@/components/ui/button';
 import { RAGFlowPagination } from '@/components/ui/ragflow-pagination';
 import { useTranslate } from '@/hooks/common-hooks';
 import { Plus } from 'lucide-react';
-import { useState } from 'react';
 import { useFetchSearchList, useRenameSearch } from './hooks';
 import { SearchCard } from './search-card';

 export default function SearchList() {
  // const { data } = useFetchFlowList();
  const { t } = useTranslate('search');
-  const [isEdit, setIsEdit] = useState(false);
+  // const [isEdit, setIsEdit] = useState(false);
  const {
    data: list,
    searchParams,
@ -36,11 +35,11 @@ export default function SearchList() {
    });
  };
  const openCreateModalFun = () => {
-    setIsEdit(false);
+    // setIsEdit(false);
    showSearchRenameModal();
  };
  const handlePageChange = (page: number, pageSize: number) => {
-    setIsEdit(false);
+    // setIsEdit(false);
    setSearchListParams({ ...searchParams, page, page_size: pageSize });
  };