fix: Change document status with @tanstack/react-query #13306 (#2788)

### What problem does this PR solve?

fix: Change document status with @tanstack/react-query #13306

### Type of change

- [x] Bug Fix (non-breaking change which fixes an issue)
- [ ] New Feature (non-breaking change which adds functionality)
- [ ] Documentation Update
- [ ] Refactoring
- [ ] Performance Improvement
- [ ] Other (please describe):

web/src/pages/add-knowledge/components/knowledge-file/document-toolbar.tsx

@@ -5,11 +5,10 @@ import { ReactComponent as EnableIcon } from '@/assets/svg/enable.svg';
 import { ReactComponent as RunIcon } from '@/assets/svg/run.svg';
 import { useShowDeleteConfirm, useTranslate } from '@/hooks/common-hooks';
 import {
-  useRemoveDocument,
-  useRunDocument,
-  useSetDocumentStatus,
+  useRemoveNextDocument,
+  useRunNextDocument,
+  useSetNextDocumentStatus,
 } from '@/hooks/document-hooks';
-import { useGetKnowledgeSearchParams } from '@/hooks/route-hook';
 import {
   DownOutlined,
   FileOutlined,
@@ -19,11 +18,7 @@ import {
 } from '@ant-design/icons';
 import { Button, Dropdown, Flex, Input, MenuProps, Space } from 'antd';
 import { useCallback, useMemo } from 'react';
-import {
-  useFetchDocumentListOnMount,
-  useGetPagination,
-  useHandleSearchChange,
-} from './hooks';
+
 import styles from './index.less';
 
 interface IProps {
@@ -31,23 +26,22 @@ interface IProps {
   showCreateModal(): void;
   showWebCrawlModal(): void;
   showDocumentUploadModal(): void;
+  searchString: string;
+  handleInputChange: React.ChangeEventHandler<HTMLInputElement>;
 }
 
 const DocumentToolbar = ({
+  searchString,
   selectedRowKeys,
   showCreateModal,
-  showWebCrawlModal,
   showDocumentUploadModal,
+  handleInputChange,
 }: IProps) => {
   const { t } = useTranslate('knowledgeDetails');
-  const { fetchDocumentList } = useFetchDocumentListOnMount();
-  const { setPagination, searchString } = useGetPagination(fetchDocumentList);
-  const { handleInputChange } = useHandleSearchChange(setPagination);
-  const removeDocument = useRemoveDocument();
+  const { removeDocument } = useRemoveNextDocument();
   const showDeleteConfirm = useShowDeleteConfirm();
-  const runDocumentByIds = useRunDocument();
-  const { knowledgeId } = useGetKnowledgeSearchParams();
-  const changeStatus = useSetDocumentStatus();
+  const { runDocumentByIds } = useRunNextDocument();
+  const { setDocumentStatus } = useSetNextDocumentStatus();
 
   const actionItems: MenuProps['items'] = useMemo(() => {
     return [
@@ -66,19 +60,6 @@ const DocumentToolbar = ({
         ),
       },
       { type: 'divider' },
-      // {
-      //   key: '2',
-      //   onClick: showWebCrawlModal,
-      //   label: (
-      //     <div>
-      //       <Button type="link">
-      //         <FileTextOutlined />
-      //         {t('webCrawl')}
-      //       </Button>
-      //     </div>
-      //   ),
-      // },
-      { type: 'divider' },
       {
         key: '3',
         onClick: showCreateModal,
@@ -105,12 +86,11 @@ const DocumentToolbar = ({
   const runDocument = useCallback(
     (run: number) => {
       runDocumentByIds({
-        doc_ids: selectedRowKeys,
+        documentIds: selectedRowKeys,
         run,
-        knowledgeBaseId: knowledgeId,
       });
     },
-    [runDocumentByIds, selectedRowKeys, knowledgeId],
+    [runDocumentByIds, selectedRowKeys],
   );
 
   const handleRunClick = useCallback(() => {
@@ -124,10 +104,10 @@ const DocumentToolbar = ({
   const onChangeStatus = useCallback(
     (enabled: boolean) => {
       selectedRowKeys.forEach((id) => {
-        changeStatus(enabled, id);
+        setDocumentStatus({ status: enabled, documentId: id });
       });
     },
-    [selectedRowKeys, changeStatus],
+    [selectedRowKeys, setDocumentStatus],
   );
 
   const handleEnableClick = useCallback(() => {