balibabu commited on
Commit
2d45930
·
1 Parent(s): 9d3ef9c

fix: fetch the file list after uploading the file by @tanstack/react-query #1306 (#1654)

Browse files

### What problem does this PR solve?
fix: fetch the file list after uploading the file by
@tanstack/react-query #1306

### Type of change

- [x] Bug Fix (non-breaking change which fixes an issue)

web/src/hooks/file-manager-hooks.ts CHANGED
@@ -1,13 +1,12 @@
1
  import { ResponseType } from '@/interfaces/database/base';
2
- import {
3
- IConnectRequestBody,
4
- IFileListRequestBody,
5
- } from '@/interfaces/request/file-manager';
6
  import fileManagerService from '@/services/file-manager-service';
7
- import { useMutation, useQuery } from '@tanstack/react-query';
8
- import { PaginationProps, UploadFile } from 'antd';
9
  import React, { useCallback } from 'react';
10
- import { useDispatch, useSearchParams, useSelector } from 'umi';
 
11
  import { useGetNextPagination, useHandleSearchChange } from './logic-hooks';
12
  import { useSetPaginationParams } from './route-hook';
13
 
@@ -18,41 +17,22 @@ export const useGetFolderId = () => {
18
  return id ?? '';
19
  };
20
 
21
- export const useFetchFileList = () => {
22
- const dispatch = useDispatch();
23
-
24
- const fetchFileList = useCallback(
25
- (payload: IFileListRequestBody) => {
26
- return dispatch<any>({
27
- type: 'fileManager/listFile',
28
- payload,
29
- });
30
- },
31
- [dispatch],
32
- );
33
-
34
- return fetchFileList;
35
- };
36
-
37
  export interface IListResult {
38
  searchString: string;
39
  handleInputChange: React.ChangeEventHandler<HTMLInputElement>;
40
  pagination: PaginationProps;
41
  setPagination: (pagination: { page: number; pageSize: number }) => void;
 
42
  }
43
 
44
- export const useFetchNextFileList = (): ResponseType<any> & IListResult => {
45
  const { searchString, handleInputChange } = useHandleSearchChange();
46
  const { pagination, setPagination } = useGetNextPagination();
47
  const id = useGetFolderId();
48
 
49
- const { data } = useQuery({
50
  queryKey: [
51
  'fetchFileList',
52
- // pagination.current,
53
- // id,
54
- // pagination.pageSize,
55
- // searchString,
56
  {
57
  id,
58
  searchString,
@@ -87,27 +67,14 @@ export const useFetchNextFileList = (): ResponseType<any> & IListResult => {
87
  handleInputChange: onInputChange,
88
  pagination: { ...pagination, total: data?.data?.total },
89
  setPagination,
 
90
  };
91
  };
92
 
93
- export const useRemoveFile = () => {
94
- const dispatch = useDispatch();
95
-
96
- const removeFile = useCallback(
97
- (fileIds: string[], parentId: string) => {
98
- return dispatch<any>({
99
- type: 'fileManager/removeFile',
100
- payload: { fileIds, parentId },
101
- });
102
- },
103
- [dispatch],
104
- );
105
-
106
- return removeFile;
107
- };
108
-
109
  export const useDeleteFile = () => {
110
  const { setPaginationParams } = useSetPaginationParams();
 
 
111
  const {
112
  data,
113
  isPending: loading,
@@ -117,9 +84,10 @@ export const useDeleteFile = () => {
117
  mutationFn: async (params: { fileIds: string[]; parentId: string }) => {
118
  const { data } = await fileManagerService.removeFile(params);
119
  if (data.retcode === 0) {
120
- setPaginationParams(1);
 
121
  }
122
- return data?.data ?? {};
123
  },
124
  });
125
 
@@ -127,106 +95,129 @@ export const useDeleteFile = () => {
127
  };
128
 
129
  export const useRenameFile = () => {
130
- const dispatch = useDispatch();
131
-
132
- const renameFile = useCallback(
133
- (fileId: string, name: string, parentId: string) => {
134
- return dispatch<any>({
135
- type: 'fileManager/renameFile',
136
- payload: { fileId, name, parentId },
137
- });
 
 
 
 
 
 
 
138
  },
139
- [dispatch],
140
- );
141
 
142
- return renameFile;
143
  };
144
 
145
- export const useFetchParentFolderList = () => {
146
- const dispatch = useDispatch();
147
-
148
- const fetchParentFolderList = useCallback(
149
- (fileId: string) => {
150
- return dispatch<any>({
151
- type: 'fileManager/getAllParentFolder',
152
- payload: { fileId },
 
153
  });
 
 
154
  },
155
- [dispatch],
156
- );
157
 
158
- return fetchParentFolderList;
159
  };
160
 
161
  export const useCreateFolder = () => {
162
- const dispatch = useDispatch();
 
 
163
 
164
- const createFolder = useCallback(
165
- (parentId: string, name: string) => {
166
- return dispatch<any>({
167
- type: 'fileManager/createFolder',
168
- payload: { parentId, name, type: 'folder' },
 
 
 
 
 
169
  });
 
 
 
 
 
 
170
  },
171
- [dispatch],
172
- );
173
-
174
- return createFolder;
175
- };
176
-
177
- export const useSelectFileList = () => {
178
- const fileList = useSelector((state) => state.fileManager.fileList);
179
 
180
- return fileList;
181
- };
182
-
183
- export const useSelectParentFolderList = () => {
184
- const parentFolderList = useSelector(
185
- (state) => state.fileManager.parentFolderList,
186
- );
187
- return parentFolderList.toReversed();
188
  };
189
 
190
  export const useUploadFile = () => {
191
- const dispatch = useDispatch();
192
-
193
- const uploadFile = useCallback(
194
- (fileList: UploadFile[], parentId: string) => {
195
- try {
196
- return dispatch<any>({
197
- type: 'fileManager/uploadFile',
198
- payload: {
199
- file: fileList,
200
- parentId,
201
- path: fileList.map((file) => (file as any).webkitRelativePath),
202
- },
203
- });
204
- } catch (errorInfo) {
205
- console.log('Failed:', errorInfo);
 
 
 
 
 
 
 
 
 
 
 
 
 
206
  }
 
207
  },
208
- [dispatch],
209
- );
210
 
211
- return uploadFile;
212
  };
213
 
214
  export const useConnectToKnowledge = () => {
215
- const dispatch = useDispatch();
216
-
217
- const uploadFile = useCallback(
218
- (payload: IConnectRequestBody) => {
219
- try {
220
- return dispatch<any>({
221
- type: 'fileManager/connectFileToKnowledge',
222
- payload,
223
- });
224
- } catch (errorInfo) {
225
- console.log('Failed:', errorInfo);
 
 
 
226
  }
 
227
  },
228
- [dispatch],
229
- );
230
 
231
- return uploadFile;
232
  };
 
1
  import { ResponseType } from '@/interfaces/database/base';
2
+ import { IFolder } from '@/interfaces/database/file-manager';
3
+ import { IConnectRequestBody } from '@/interfaces/request/file-manager';
 
 
4
  import fileManagerService from '@/services/file-manager-service';
5
+ import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query';
6
+ import { PaginationProps, UploadFile, message } from 'antd';
7
  import React, { useCallback } from 'react';
8
+ import { useTranslation } from 'react-i18next';
9
+ import { useSearchParams } from 'umi';
10
  import { useGetNextPagination, useHandleSearchChange } from './logic-hooks';
11
  import { useSetPaginationParams } from './route-hook';
12
 
 
17
  return id ?? '';
18
  };
19
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
20
  export interface IListResult {
21
  searchString: string;
22
  handleInputChange: React.ChangeEventHandler<HTMLInputElement>;
23
  pagination: PaginationProps;
24
  setPagination: (pagination: { page: number; pageSize: number }) => void;
25
+ loading: boolean;
26
  }
27
 
28
+ export const useFetchFileList = (): ResponseType<any> & IListResult => {
29
  const { searchString, handleInputChange } = useHandleSearchChange();
30
  const { pagination, setPagination } = useGetNextPagination();
31
  const id = useGetFolderId();
32
 
33
+ const { data, isFetching: loading } = useQuery({
34
  queryKey: [
35
  'fetchFileList',
 
 
 
 
36
  {
37
  id,
38
  searchString,
 
67
  handleInputChange: onInputChange,
68
  pagination: { ...pagination, total: data?.data?.total },
69
  setPagination,
70
+ loading,
71
  };
72
  };
73
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
74
  export const useDeleteFile = () => {
75
  const { setPaginationParams } = useSetPaginationParams();
76
+ const queryClient = useQueryClient();
77
+
78
  const {
79
  data,
80
  isPending: loading,
 
84
  mutationFn: async (params: { fileIds: string[]; parentId: string }) => {
85
  const { data } = await fileManagerService.removeFile(params);
86
  if (data.retcode === 0) {
87
+ setPaginationParams(1); // TODO: There should be a better way to paginate the request list
88
+ queryClient.invalidateQueries({ queryKey: ['fetchFileList'] });
89
  }
90
+ return data.retcode;
91
  },
92
  });
93
 
 
95
  };
96
 
97
  export const useRenameFile = () => {
98
+ const queryClient = useQueryClient();
99
+ const { t } = useTranslation();
100
+ const {
101
+ data,
102
+ isPending: loading,
103
+ mutateAsync,
104
+ } = useMutation({
105
+ mutationKey: ['renameFile'],
106
+ mutationFn: async (params: { fileId: string; name: string }) => {
107
+ const { data } = await fileManagerService.renameFile(params);
108
+ if (data.retcode === 0) {
109
+ message.success(t('message.renamed'));
110
+ queryClient.invalidateQueries({ queryKey: ['fetchFileList'] });
111
+ }
112
+ return data.retcode;
113
  },
114
+ });
 
115
 
116
+ return { data, loading, renameFile: mutateAsync };
117
  };
118
 
119
+ export const useFetchParentFolderList = (): IFolder[] => {
120
+ const id = useGetFolderId();
121
+ const { data } = useQuery({
122
+ queryKey: ['fetchParentFolderList', id],
123
+ initialData: [],
124
+ enabled: !!id,
125
+ queryFn: async () => {
126
+ const { data } = await fileManagerService.getAllParentFolder({
127
+ fileId: id,
128
  });
129
+
130
+ return data?.data?.parent_folders?.toReversed() ?? [];
131
  },
132
+ });
 
133
 
134
+ return data;
135
  };
136
 
137
  export const useCreateFolder = () => {
138
+ const { setPaginationParams } = useSetPaginationParams();
139
+ const queryClient = useQueryClient();
140
+ const { t } = useTranslation();
141
 
142
+ const {
143
+ data,
144
+ isPending: loading,
145
+ mutateAsync,
146
+ } = useMutation({
147
+ mutationKey: ['createFolder'],
148
+ mutationFn: async (params: { parentId: string; name: string }) => {
149
+ const { data } = await fileManagerService.createFolder({
150
+ ...params,
151
+ type: 'folder',
152
  });
153
+ if (data.retcode === 0) {
154
+ message.success(t('message.created'));
155
+ setPaginationParams(1);
156
+ queryClient.invalidateQueries({ queryKey: ['fetchFileList'] });
157
+ }
158
+ return data.retcode;
159
  },
160
+ });
 
 
 
 
 
 
 
161
 
162
+ return { data, loading, createFolder: mutateAsync };
 
 
 
 
 
 
 
163
  };
164
 
165
  export const useUploadFile = () => {
166
+ const { setPaginationParams } = useSetPaginationParams();
167
+ const { t } = useTranslation();
168
+ const queryClient = useQueryClient();
169
+ const {
170
+ data,
171
+ isPending: loading,
172
+ mutateAsync,
173
+ } = useMutation({
174
+ mutationKey: ['uploadFile'],
175
+ mutationFn: async (params: {
176
+ fileList: UploadFile[];
177
+ parentId: string;
178
+ }) => {
179
+ const fileList = params.fileList;
180
+ const pathList = params.fileList.map(
181
+ (file) => (file as any).webkitRelativePath,
182
+ );
183
+ const formData = new FormData();
184
+ formData.append('parent_id', params.parentId);
185
+ fileList.forEach((file: any, index: number) => {
186
+ formData.append('file', file);
187
+ formData.append('path', pathList[index]);
188
+ });
189
+ const { data } = await fileManagerService.uploadFile(formData);
190
+ if (data.retcode === 0) {
191
+ message.success(t('message.uploaded'));
192
+ setPaginationParams(1);
193
+ queryClient.invalidateQueries({ queryKey: ['fetchFileList'] });
194
  }
195
+ return data.retcode;
196
  },
197
+ });
 
198
 
199
+ return { data, loading, uploadFile: mutateAsync };
200
  };
201
 
202
  export const useConnectToKnowledge = () => {
203
+ const queryClient = useQueryClient();
204
+ const { t } = useTranslation();
205
+
206
+ const {
207
+ data,
208
+ isPending: loading,
209
+ mutateAsync,
210
+ } = useMutation({
211
+ mutationKey: ['connectFileToKnowledge'],
212
+ mutationFn: async (params: IConnectRequestBody) => {
213
+ const { data } = await fileManagerService.connectFileToKnowledge(params);
214
+ if (data.retcode === 0) {
215
+ message.success(t('message.operated'));
216
+ queryClient.invalidateQueries({ queryKey: ['fetchFileList'] });
217
  }
218
+ return data.retcode;
219
  },
220
+ });
 
221
 
222
+ return { data, loading, connectFileToKnowledge: mutateAsync };
223
  };
web/src/interfaces/request/file-manager.ts CHANGED
@@ -8,7 +8,7 @@ interface BaseRequestBody {
8
  parentId: string;
9
  }
10
 
11
- export interface IConnectRequestBody extends BaseRequestBody {
12
  fileIds: string[];
13
  kbIds: string[];
14
  }
 
8
  parentId: string;
9
  }
10
 
11
+ export interface IConnectRequestBody {
12
  fileIds: string[];
13
  kbIds: string[];
14
  }
web/src/pages/file-manager/file-toolbar.tsx CHANGED
@@ -26,7 +26,7 @@ import {
26
 
27
  import {
28
  IListResult,
29
- useSelectParentFolderList,
30
  } from '@/hooks/file-manager-hooks';
31
  import styles from './index.less';
32
 
@@ -49,7 +49,7 @@ const FileToolbar = ({
49
  const { t } = useTranslate('knowledgeDetails');
50
  const breadcrumbItems = useSelectBreadcrumbItems();
51
  const { handleBreadcrumbClick } = useHandleBreadcrumbClick();
52
- const parentFolderList = useSelectParentFolderList();
53
  const isKnowledgeBase =
54
  parentFolderList.at(-1)?.source_type === 'knowledgebase';
55
 
 
26
 
27
  import {
28
  IListResult,
29
+ useFetchParentFolderList,
30
  } from '@/hooks/file-manager-hooks';
31
  import styles from './index.less';
32
 
 
49
  const { t } = useTranslate('knowledgeDetails');
50
  const breadcrumbItems = useSelectBreadcrumbItems();
51
  const { handleBreadcrumbClick } = useHandleBreadcrumbClick();
52
+ const parentFolderList = useFetchParentFolderList();
53
  const isKnowledgeBase =
54
  parentFolderList.at(-1)?.source_type === 'knowledgebase';
55
 
web/src/pages/file-manager/hooks.ts CHANGED
@@ -3,21 +3,15 @@ import {
3
  useConnectToKnowledge,
4
  useCreateFolder,
5
  useDeleteFile,
6
- useFetchFileList,
7
  useFetchParentFolderList,
8
  useRenameFile,
9
- useSelectFileList,
10
- useSelectParentFolderList,
11
  useUploadFile,
12
  } from '@/hooks/file-manager-hooks';
13
- import { useGetPagination, useSetPagination } from '@/hooks/logic-hooks';
14
- import { useOneNamespaceEffectsLoading } from '@/hooks/store-hooks';
15
  import { IFile } from '@/interfaces/database/file-manager';
16
- import { PaginationProps } from 'antd';
17
  import { TableRowSelection } from 'antd/es/table/interface';
18
  import { UploadFile } from 'antd/lib';
19
- import { useCallback, useEffect, useMemo, useState } from 'react';
20
- import { useDispatch, useNavigate, useSearchParams, useSelector } from 'umi';
21
 
22
  export const useGetFolderId = () => {
23
  const [searchParams] = useSearchParams();
@@ -26,71 +20,6 @@ export const useGetFolderId = () => {
26
  return id ?? '';
27
  };
28
 
29
- export const useFetchDocumentListOnMount = () => {
30
- const fetchDocumentList = useFetchFileList();
31
- const fileList = useSelectFileList();
32
- const id = useGetFolderId();
33
- const { searchString, pagination } = useSelector(
34
- (state) => state.fileManager,
35
- );
36
- const { pageSize, current } = pagination;
37
-
38
- const dispatch = useDispatch();
39
-
40
- useEffect(() => {
41
- fetchDocumentList({
42
- parent_id: id,
43
- keywords: searchString,
44
- page_size: pageSize,
45
- page: current,
46
- });
47
- }, [dispatch, fetchDocumentList, id, current, pageSize, searchString]);
48
-
49
- return { fetchDocumentList, fileList };
50
- };
51
-
52
- export const useGetFilesPagination = () => {
53
- const { pagination } = useSelector((state) => state.fileManager);
54
-
55
- const setPagination = useSetPagination('fileManager');
56
-
57
- const onPageChange: PaginationProps['onChange'] = useCallback(
58
- (pageNumber: number, pageSize: number) => {
59
- setPagination(pageNumber, pageSize);
60
- },
61
- [setPagination],
62
- );
63
-
64
- const { pagination: paginationInfo } = useGetPagination(
65
- pagination.total,
66
- pagination.current,
67
- pagination.pageSize,
68
- onPageChange,
69
- );
70
-
71
- return {
72
- pagination: paginationInfo,
73
- setPagination,
74
- };
75
- };
76
-
77
- export const useHandleSearchChange = () => {
78
- const dispatch = useDispatch();
79
- const { searchString } = useSelector((state) => state.fileManager);
80
- const setPagination = useSetPagination('fileManager');
81
-
82
- const handleInputChange = useCallback(
83
- (e: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => {
84
- const value = e.target.value;
85
- dispatch({ type: 'fileManager/setSearchString', payload: value });
86
- setPagination();
87
- },
88
- [setPagination, dispatch],
89
- );
90
-
91
- return { handleInputChange, searchString };
92
- };
93
-
94
  export const useGetRowSelection = () => {
95
  const [selectedRowKeys, setSelectedRowKeys] = useState<React.Key[]>([]);
96
 
@@ -126,11 +55,14 @@ export const useRenameCurrentFile = () => {
126
  hideModal: hideFileRenameModal,
127
  showModal: showFileRenameModal,
128
  } = useSetModalState();
129
- const renameFile = useRenameFile();
130
 
131
  const onFileRenameOk = useCallback(
132
  async (name: string) => {
133
- const ret = await renameFile(file.id, name, file.parent_id);
 
 
 
134
 
135
  if (ret === 0) {
136
  hideFileRenameModal();
@@ -139,8 +71,6 @@ export const useRenameCurrentFile = () => {
139
  [renameFile, file, hideFileRenameModal],
140
  );
141
 
142
- const loading = useOneNamespaceEffectsLoading('fileManager', ['renameFile']);
143
-
144
  const handleShowFileRenameModal = useCallback(
145
  async (record: IFile) => {
146
  setFile(record);
@@ -160,15 +90,7 @@ export const useRenameCurrentFile = () => {
160
  };
161
 
162
  export const useSelectBreadcrumbItems = () => {
163
- const parentFolderList = useSelectParentFolderList();
164
- const id = useGetFolderId();
165
- const fetchParentFolderList = useFetchParentFolderList();
166
-
167
- useEffect(() => {
168
- if (id) {
169
- fetchParentFolderList(id);
170
- }
171
- }, [id, fetchParentFolderList]);
172
 
173
  return parentFolderList.length === 1
174
  ? []
@@ -184,12 +106,12 @@ export const useHandleCreateFolder = () => {
184
  hideModal: hideFolderCreateModal,
185
  showModal: showFolderCreateModal,
186
  } = useSetModalState();
187
- const createFolder = useCreateFolder();
188
  const id = useGetFolderId();
189
 
190
  const onFolderCreateOk = useCallback(
191
  async (name: string) => {
192
- const ret = await createFolder(id, name);
193
 
194
  if (ret === 0) {
195
  hideFolderCreateModal();
@@ -198,10 +120,6 @@ export const useHandleCreateFolder = () => {
198
  [createFolder, hideFolderCreateModal, id],
199
  );
200
 
201
- const loading = useOneNamespaceEffectsLoading('fileManager', [
202
- 'createFolder',
203
- ]);
204
-
205
  return {
206
  folderCreateLoading: loading,
207
  onFolderCreateOk,
@@ -234,24 +152,19 @@ export const useHandleDeleteFile = (
234
  return { handleRemoveFile };
235
  };
236
 
237
- export const useSelectFileListLoading = () => {
238
- return useOneNamespaceEffectsLoading('fileManager', ['listFile']);
239
- };
240
-
241
  export const useHandleUploadFile = () => {
242
  const {
243
  visible: fileUploadVisible,
244
  hideModal: hideFileUploadModal,
245
  showModal: showFileUploadModal,
246
  } = useSetModalState();
247
- const uploadFile = useUploadFile();
248
  const id = useGetFolderId();
249
 
250
  const onFileUploadOk = useCallback(
251
  async (fileList: UploadFile[]): Promise<number | undefined> => {
252
  if (fileList.length > 0) {
253
- const ret: number = await uploadFile(fileList, id);
254
- console.info(ret);
255
  if (ret === 0) {
256
  hideFileUploadModal();
257
  }
@@ -261,8 +174,6 @@ export const useHandleUploadFile = () => {
261
  [uploadFile, hideFileUploadModal, id],
262
  );
263
 
264
- const loading = useOneNamespaceEffectsLoading('fileManager', ['uploadFile']);
265
-
266
  return {
267
  fileUploadLoading: loading,
268
  onFileUploadOk,
@@ -278,8 +189,8 @@ export const useHandleConnectToKnowledge = () => {
278
  hideModal: hideConnectToKnowledgeModal,
279
  showModal: showConnectToKnowledgeModal,
280
  } = useSetModalState();
281
- const connectToKnowledge = useConnectToKnowledge();
282
- const id = useGetFolderId();
283
  const [record, setRecord] = useState<IFile>({} as IFile);
284
 
285
  const initialValue = useMemo(() => {
@@ -291,7 +202,6 @@ export const useHandleConnectToKnowledge = () => {
291
  const onConnectToKnowledgeOk = useCallback(
292
  async (knowledgeIds: string[]) => {
293
  const ret = await connectToKnowledge({
294
- parentId: id,
295
  fileIds: [record.id],
296
  kbIds: knowledgeIds,
297
  });
@@ -301,13 +211,9 @@ export const useHandleConnectToKnowledge = () => {
301
  }
302
  return ret;
303
  },
304
- [connectToKnowledge, hideConnectToKnowledgeModal, id, record.id],
305
  );
306
 
307
- const loading = useOneNamespaceEffectsLoading('fileManager', [
308
- 'connectFileToKnowledge',
309
- ]);
310
-
311
  const handleShowConnectToKnowledgeModal = useCallback(
312
  (record: IFile) => {
313
  setRecord(record);
@@ -328,16 +234,14 @@ export const useHandleConnectToKnowledge = () => {
328
 
329
  export const useHandleBreadcrumbClick = () => {
330
  const navigate = useNavigate();
331
- const setPagination = useSetPagination('fileManager');
332
 
333
  const handleBreadcrumbClick = useCallback(
334
  (path?: string) => {
335
  if (path) {
336
- setPagination();
337
  navigate(path);
338
  }
339
  },
340
- [setPagination, navigate],
341
  );
342
 
343
  return { handleBreadcrumbClick };
 
3
  useConnectToKnowledge,
4
  useCreateFolder,
5
  useDeleteFile,
 
6
  useFetchParentFolderList,
7
  useRenameFile,
 
 
8
  useUploadFile,
9
  } from '@/hooks/file-manager-hooks';
 
 
10
  import { IFile } from '@/interfaces/database/file-manager';
 
11
  import { TableRowSelection } from 'antd/es/table/interface';
12
  import { UploadFile } from 'antd/lib';
13
+ import { useCallback, useMemo, useState } from 'react';
14
+ import { useNavigate, useSearchParams } from 'umi';
15
 
16
  export const useGetFolderId = () => {
17
  const [searchParams] = useSearchParams();
 
20
  return id ?? '';
21
  };
22
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
23
  export const useGetRowSelection = () => {
24
  const [selectedRowKeys, setSelectedRowKeys] = useState<React.Key[]>([]);
25
 
 
55
  hideModal: hideFileRenameModal,
56
  showModal: showFileRenameModal,
57
  } = useSetModalState();
58
+ const { renameFile, loading } = useRenameFile();
59
 
60
  const onFileRenameOk = useCallback(
61
  async (name: string) => {
62
+ const ret = await renameFile({
63
+ fileId: file.id,
64
+ name,
65
+ });
66
 
67
  if (ret === 0) {
68
  hideFileRenameModal();
 
71
  [renameFile, file, hideFileRenameModal],
72
  );
73
 
 
 
74
  const handleShowFileRenameModal = useCallback(
75
  async (record: IFile) => {
76
  setFile(record);
 
90
  };
91
 
92
  export const useSelectBreadcrumbItems = () => {
93
+ const parentFolderList = useFetchParentFolderList();
 
 
 
 
 
 
 
 
94
 
95
  return parentFolderList.length === 1
96
  ? []
 
106
  hideModal: hideFolderCreateModal,
107
  showModal: showFolderCreateModal,
108
  } = useSetModalState();
109
+ const { createFolder, loading } = useCreateFolder();
110
  const id = useGetFolderId();
111
 
112
  const onFolderCreateOk = useCallback(
113
  async (name: string) => {
114
+ const ret = await createFolder({ parentId: id, name });
115
 
116
  if (ret === 0) {
117
  hideFolderCreateModal();
 
120
  [createFolder, hideFolderCreateModal, id],
121
  );
122
 
 
 
 
 
123
  return {
124
  folderCreateLoading: loading,
125
  onFolderCreateOk,
 
152
  return { handleRemoveFile };
153
  };
154
 
 
 
 
 
155
  export const useHandleUploadFile = () => {
156
  const {
157
  visible: fileUploadVisible,
158
  hideModal: hideFileUploadModal,
159
  showModal: showFileUploadModal,
160
  } = useSetModalState();
161
+ const { uploadFile, loading } = useUploadFile();
162
  const id = useGetFolderId();
163
 
164
  const onFileUploadOk = useCallback(
165
  async (fileList: UploadFile[]): Promise<number | undefined> => {
166
  if (fileList.length > 0) {
167
+ const ret: number = await uploadFile({ fileList, parentId: id });
 
168
  if (ret === 0) {
169
  hideFileUploadModal();
170
  }
 
174
  [uploadFile, hideFileUploadModal, id],
175
  );
176
 
 
 
177
  return {
178
  fileUploadLoading: loading,
179
  onFileUploadOk,
 
189
  hideModal: hideConnectToKnowledgeModal,
190
  showModal: showConnectToKnowledgeModal,
191
  } = useSetModalState();
192
+ const { connectFileToKnowledge: connectToKnowledge, loading } =
193
+ useConnectToKnowledge();
194
  const [record, setRecord] = useState<IFile>({} as IFile);
195
 
196
  const initialValue = useMemo(() => {
 
202
  const onConnectToKnowledgeOk = useCallback(
203
  async (knowledgeIds: string[]) => {
204
  const ret = await connectToKnowledge({
 
205
  fileIds: [record.id],
206
  kbIds: knowledgeIds,
207
  });
 
211
  }
212
  return ret;
213
  },
214
+ [connectToKnowledge, hideConnectToKnowledgeModal, record.id],
215
  );
216
 
 
 
 
 
217
  const handleShowConnectToKnowledgeModal = useCallback(
218
  (record: IFile) => {
219
  setRecord(record);
 
234
 
235
  export const useHandleBreadcrumbClick = () => {
236
  const navigate = useNavigate();
 
237
 
238
  const handleBreadcrumbClick = useCallback(
239
  (path?: string) => {
240
  if (path) {
 
241
  navigate(path);
242
  }
243
  },
244
+ [navigate],
245
  );
246
 
247
  return { handleBreadcrumbClick };
web/src/pages/file-manager/index.tsx CHANGED
@@ -1,4 +1,4 @@
1
- import { useFetchNextFileList } from '@/hooks/file-manager-hooks';
2
  import { IFile } from '@/interfaces/database/file-manager';
3
  import { formatDate } from '@/utils/date';
4
  import { Button, Flex, Space, Table, Tag, Typography } from 'antd';
@@ -12,7 +12,6 @@ import {
12
  useHandleUploadFile,
13
  useNavigateToOtherFolder,
14
  useRenameCurrentFile,
15
- useSelectFileListLoading,
16
  } from './hooks';
17
 
18
  import FileUploadModal from '@/components/file-upload-modal';
@@ -31,7 +30,6 @@ const FileManager = () => {
31
  const { t } = useTranslate('fileManager');
32
  // const fileList = useSelectFileList();
33
  const { rowSelection, setSelectedRowKeys } = useGetRowSelection();
34
- const loading = useSelectFileListLoading();
35
  const navigateToOtherFolder = useNavigateToOtherFolder();
36
  const {
37
  fileRenameVisible,
@@ -64,8 +62,8 @@ const FileManager = () => {
64
  connectToKnowledgeLoading,
65
  } = useHandleConnectToKnowledge();
66
  // const { pagination } = useGetFilesPagination();
67
- const { pagination, data, searchString, handleInputChange } =
68
- useFetchNextFileList();
69
  const columns: ColumnsType<IFile> = [
70
  {
71
  title: t('name'),
 
1
+ import { useFetchFileList } from '@/hooks/file-manager-hooks';
2
  import { IFile } from '@/interfaces/database/file-manager';
3
  import { formatDate } from '@/utils/date';
4
  import { Button, Flex, Space, Table, Tag, Typography } from 'antd';
 
12
  useHandleUploadFile,
13
  useNavigateToOtherFolder,
14
  useRenameCurrentFile,
 
15
  } from './hooks';
16
 
17
  import FileUploadModal from '@/components/file-upload-modal';
 
30
  const { t } = useTranslate('fileManager');
31
  // const fileList = useSelectFileList();
32
  const { rowSelection, setSelectedRowKeys } = useGetRowSelection();
 
33
  const navigateToOtherFolder = useNavigateToOtherFolder();
34
  const {
35
  fileRenameVisible,
 
62
  connectToKnowledgeLoading,
63
  } = useHandleConnectToKnowledge();
64
  // const { pagination } = useGetFilesPagination();
65
+ const { pagination, data, searchString, handleInputChange, loading } =
66
+ useFetchFileList();
67
  const columns: ColumnsType<IFile> = [
68
  {
69
  title: t('name'),
web/src/pages/file-manager/model.ts DELETED
@@ -1,159 +0,0 @@
1
- import { paginationModel } from '@/base';
2
- import { BaseState } from '@/interfaces/common';
3
- import { IFile, IFolder } from '@/interfaces/database/file-manager';
4
- import i18n from '@/locales/config';
5
- import fileManagerService, {
6
- getDocumentFile,
7
- } from '@/services/file-manager-service';
8
- import { message } from 'antd';
9
- import omit from 'lodash/omit';
10
- import { DvaModel } from 'umi';
11
-
12
- export interface FileManagerModelState extends BaseState {
13
- fileList: IFile[];
14
- parentFolderList: IFolder[];
15
- }
16
-
17
- const model: DvaModel<FileManagerModelState> = {
18
- namespace: 'fileManager',
19
- state: {
20
- fileList: [],
21
- parentFolderList: [],
22
- ...(paginationModel.state as BaseState),
23
- },
24
- reducers: {
25
- setFileList(state, { payload }) {
26
- return { ...state, fileList: payload };
27
- },
28
- setParentFolderList(state, { payload }) {
29
- return { ...state, parentFolderList: payload };
30
- },
31
- ...paginationModel.reducers,
32
- },
33
- effects: {
34
- *removeFile({ payload = {} }, { call, put }) {
35
- const { data } = yield call(fileManagerService.removeFile, {
36
- fileIds: payload.fileIds,
37
- });
38
- const { retcode } = data;
39
- if (retcode === 0) {
40
- message.success(i18n.t('message.deleted'));
41
- yield put({
42
- type: 'listFile',
43
- payload: { parentId: payload.parentId },
44
- });
45
- }
46
- return retcode;
47
- },
48
- *listFile({ payload = {} }, { call, put, select }) {
49
- const { searchString, pagination } = yield select(
50
- (state: any) => state.fileManager,
51
- );
52
- const { current, pageSize } = pagination;
53
- const { data } = yield call(fileManagerService.listFile, {
54
- ...payload,
55
- keywords: searchString.trim(),
56
- page: current,
57
- pageSize,
58
- });
59
- const { retcode, data: res } = data;
60
- if (retcode === 0 && Array.isArray(res.files)) {
61
- yield put({
62
- type: 'setFileList',
63
- payload: res.files,
64
- });
65
- yield put({
66
- type: 'setPagination',
67
- payload: { total: res.total },
68
- });
69
- }
70
- },
71
- *renameFile({ payload = {} }, { call, put }) {
72
- const { data } = yield call(
73
- fileManagerService.renameFile,
74
- omit(payload, ['parentId']),
75
- );
76
- if (data.retcode === 0) {
77
- message.success(i18n.t('message.renamed'));
78
- yield put({
79
- type: 'listFile',
80
- payload: { parentId: payload.parentId },
81
- });
82
- }
83
- return data.retcode;
84
- },
85
- *uploadFile({ payload = {} }, { call, put }) {
86
- const fileList = payload.file;
87
- const pathList = payload.path;
88
- const formData = new FormData();
89
- formData.append('parent_id', payload.parentId);
90
- fileList.forEach((file: any, index: number) => {
91
- formData.append('file', file);
92
- formData.append('path', pathList[index]);
93
- });
94
- const { data } = yield call(fileManagerService.uploadFile, formData);
95
- if (data.retcode === 0) {
96
- message.success(i18n.t('message.uploaded'));
97
-
98
- yield put({
99
- type: 'listFile',
100
- payload: { parentId: payload.parentId },
101
- });
102
- }
103
- return data.retcode;
104
- },
105
- *createFolder({ payload = {} }, { call, put }) {
106
- const { data } = yield call(fileManagerService.createFolder, payload);
107
- if (data.retcode === 0) {
108
- message.success(i18n.t('message.created'));
109
-
110
- yield put({
111
- type: 'listFile',
112
- payload: { parentId: payload.parentId },
113
- });
114
- }
115
- return data.retcode;
116
- },
117
- *getAllParentFolder({ payload = {} }, { call, put }) {
118
- const { data } = yield call(
119
- fileManagerService.getAllParentFolder,
120
- payload,
121
- );
122
- if (data.retcode === 0) {
123
- yield put({
124
- type: 'setParentFolderList',
125
- payload: data.data?.parent_folders ?? [],
126
- });
127
- }
128
- return data.retcode;
129
- },
130
- *connectFileToKnowledge({ payload = {} }, { call, put }) {
131
- const { data } = yield call(
132
- fileManagerService.connectFileToKnowledge,
133
- omit(payload, 'parentId'),
134
- );
135
- if (data.retcode === 0) {
136
- message.success(i18n.t('message.operated'));
137
- yield put({
138
- type: 'listFile',
139
- payload: { parentId: payload.parentId },
140
- });
141
- }
142
- return data.retcode;
143
- },
144
- *getDocumentFile({ payload = {} }, { call }) {
145
- const ret = yield call(getDocumentFile, payload);
146
-
147
- return ret;
148
- },
149
- },
150
- };
151
-
152
- // const finalModel = modelExtend<DvaModel<FileManagerModelState & BaseState>>(
153
- // paginationModel,
154
- // model,
155
- // );
156
-
157
- // console.info(finalModel);
158
-
159
- export default model;
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
web/typings.d.ts CHANGED
@@ -3,7 +3,6 @@ import { KFModelState } from '@/pages/add-knowledge/components/knowledge-file/mo
3
  import { TestingModelState } from '@/pages/add-knowledge/components/knowledge-testing/model';
4
  import { kAModelState } from '@/pages/add-knowledge/model';
5
  import { ChatModelState } from '@/pages/chat/model';
6
- import { FileManagerModelState } from '@/pages/file-manager/model';
7
  import { LoginModelState } from '@/pages/login/model';
8
  import { SettingModelState } from '@/pages/user-setting/model';
9
 
@@ -15,8 +14,6 @@ function useSelector<TState = RootState, TSelected = unknown>(
15
  ): TSelected;
16
 
17
  export interface RootState {
18
- // loading: Loading;
19
- fileManager: FileManagerModelState;
20
  chatModel: ChatModelState;
21
  loginModel: LoginModelState;
22
  settingModel: SettingModelState;
 
3
  import { TestingModelState } from '@/pages/add-knowledge/components/knowledge-testing/model';
4
  import { kAModelState } from '@/pages/add-knowledge/model';
5
  import { ChatModelState } from '@/pages/chat/model';
 
6
  import { LoginModelState } from '@/pages/login/model';
7
  import { SettingModelState } from '@/pages/user-setting/model';
8
 
 
14
  ): TSelected;
15
 
16
  export interface RootState {
 
 
17
  chatModel: ChatModelState;
18
  loginModel: LoginModelState;
19
  settingModel: SettingModelState;