@zjlab-fe/data-hub-ui 0.21.7 → 0.22.0

package/es/components/FileUploader/Locale/translations.js

@@ -0,0 +1,52 @@
+const localeEn = {
+    'FileUploader 必须在 UploadStoreProvider 内使用': 'FileUploader must be used within UploadStoreProvider',
+    'FileUploadModal 必须在 UploadStoreProvider 内使用': 'FileUploadModal must be used within UploadStoreProvider',
+    文件上传: 'File Upload',
+    确定: 'Confirm',
+    等待上传: 'Waiting for upload',
+    已取消: 'Cancelled',
+    上传中: 'Uploading',
+    上传失败: 'Upload failed',
+    已上传: 'Uploaded',
+    分块合并中: 'Merging parts',
+    以下文件大小超过: 'The following files exceed the size',
+    已删除: 'Deleted',
+    点击或拖拽上传文件: 'Click or drag to upload files',
+    '发现同名文件，是否覆盖？': 'Duplicate file found, overwrite?',
+    覆盖: 'Overwrite',
+    取消: 'Cancel',
+    正在上传: 'Uploading',
+    取消失败: 'Cancel failed',
+    当前上传: 'Current Upload',
+    已暂停: 'Paused',
+    上传成功: 'Upload successful',
+    校验中: 'Calibrating',
+    合并中: 'Merging',
+};
+const localeZh = {
+    'FileUploader 必须在 UploadStoreProvider 内使用': 'FileUploader 必须在 UploadStoreProvider 内使用',
+    'FileUploadModal 必须在 UploadStoreProvider 内使用': 'FileUploadModal 必须在 UploadStoreProvider 内使用',
+    文件上传: '文件上传',
+    确定: '确定',
+    等待上传: '等待上传',
+    已取消: '已取消',
+    上传中: '上传中',
+    上传失败: '上传失败',
+    已上传: '已上传',
+    分块合并中: '分块合并中',
+    以下文件大小超过: '以下文件大小超过',
+    已删除: '已删除',
+    点击或拖拽上传文件: '点击或拖拽上传文件',
+    '发现同名文件，是否覆盖？': '发现同名文件，是否覆盖？',
+    覆盖: '覆盖',
+    取消: '取消',
+    正在上传: '正在上传',
+    取消失败: '取消失败',
+    当前上传: '当前上传',
+    已暂停: '已暂停',
+    上传成功: '上传成功',
+    校验中: '校验中',
+    合并中: '合并中',
+};
+
+export { localeEn, localeZh };

package/es/components/FileUploader/Locale/useTranslate.js

@@ -0,0 +1,16 @@
+import { useContext, useCallback } from 'react';
+import { FileUploaderLocaleContext } from '../UploadStoreProvider/UploadStoreProvider.js';
+
+function useTranslate() {
+    const locale = useContext(FileUploaderLocaleContext);
+    return useCallback((key) => {
+        const content = locale[key];
+        if (!content) {
+            console.warn(`Translation key not found: ${key}`);
+            return key;
+        }
+        return content;
+    }, [locale]);
+}
+
+export { useTranslate };

package/es/components/FileUploader/UploadStoreProvider/UploadStoreProvider.js

@@ -0,0 +1,31 @@
+import { jsx } from 'react/jsx-runtime';
+import { createContext, useReducer, useState } from 'react';
+import { useSaveUnfinishedUploads } from './useSaveUnfinishedUploads.js';
+import { localeZh, localeEn } from '../Locale/translations.js';
+import { useSetupMergingEvent } from './useSetupMergingEvent.js';
+import { useOnFileAllUploaded } from './useOnFileAllUploaded.js';
+import { uploadReducer } from './uploadStoreReducer.js';
+
+const FileUploaderLocaleContext = createContext(localeZh);
+const AllUploaderManagersContext = createContext({});
+const AllUploaderManagersDispatchContext = createContext(() => null);
+const AllOnUploadSuccessesContext = createContext({});
+const AllOnUploadSuccessesDispatchContext = createContext(() => null);
+const TEMP_STORE = {};
+const UploadStoreContext = createContext(TEMP_STORE);
+const UploadStoreDispatchContext = createContext(() => null);
+/**
+ * @deprecated This component is deprecated and will be removed in future releases.
+ */
+function UploadStoreProvider({ locale = 'zh', children, }) {
+    const FileUploaderLocale = locale === 'zh' ? localeZh : localeEn;
+    const [uploadStore, setUploadStore] = useReducer(uploadReducer, {});
+    const [allUploaderManagers, setAllUploaderManagers] = useState({});
+    const [allOnUploadSuccesses, setAllOnUploadSuccesses] = useState({});
+    useSaveUnfinishedUploads(uploadStore);
+    useOnFileAllUploaded(uploadStore, setUploadStore);
+    useSetupMergingEvent(uploadStore, allUploaderManagers, allOnUploadSuccesses, setUploadStore);
+    return (jsx(FileUploaderLocaleContext.Provider, { value: FileUploaderLocale, children: jsx(AllUploaderManagersContext.Provider, { value: allUploaderManagers, children: jsx(AllUploaderManagersDispatchContext.Provider, { value: setAllUploaderManagers, children: jsx(AllOnUploadSuccessesContext.Provider, { value: allOnUploadSuccesses, children: jsx(AllOnUploadSuccessesDispatchContext.Provider, { value: setAllOnUploadSuccesses, children: jsx(UploadStoreContext.Provider, { value: uploadStore, children: jsx(UploadStoreDispatchContext.Provider, { value: setUploadStore, children: children }) }) }) }) }) }) }));
+}
+
+export { AllOnUploadSuccessesContext, AllOnUploadSuccessesDispatchContext, AllUploaderManagersContext, AllUploaderManagersDispatchContext, FileUploaderLocaleContext, TEMP_STORE, UploadStoreContext, UploadStoreDispatchContext, UploadStoreProvider as default };

package/es/components/FileUploader/UploadStoreProvider/uploadStoreReducer.js

@@ -0,0 +1,62 @@
+import { FILE_UPLOAD_STATUS } from '../types.js';
+
+function uploadReducer(uploads, action) {
+    switch (action.type) {
+        case 'add': {
+            return Object.assign(Object.assign({}, uploads), { [action.identifier]: [] });
+        }
+        case 'remove_file': {
+            const fileList = uploads[action.identifier];
+            const fileIndex = fileList.findIndex((p) => p.fileName === action.fileName);
+            return Object.assign(Object.assign({}, uploads), { [action.identifier]: [...fileList.slice(0, fileIndex), ...fileList.slice(fileIndex + 1)] });
+        }
+        case 'edit_file': {
+            const fileList = uploads[action.identifier];
+            const fileIndex = fileList.findIndex((p) => p.fileName === action.file.fileName);
+            return Object.assign(Object.assign({}, uploads), { [action.identifier]: [...fileList.slice(0, fileIndex), action.file, ...fileList.slice(fileIndex + 1)] });
+        }
+        case 'add_file': {
+            const fileList = uploads[action.identifier];
+            const fileIndex = fileList.findIndex((p) => p.fileName === action.file.fileName);
+            if (fileIndex === -1) {
+                return Object.assign(Object.assign({}, uploads), { [action.identifier]: [...fileList, action.file] });
+            }
+            else {
+                return Object.assign(Object.assign({}, uploads), { [action.identifier]: [
+                        ...fileList.slice(0, fileIndex),
+                        action.file,
+                        ...fileList.slice(fileIndex + 1),
+                    ] });
+            }
+        }
+        case 'add_files': {
+            const fileList = uploads[action.identifier];
+            return Object.assign(Object.assign({}, uploads), { [action.identifier]: [...fileList, ...action.files] });
+        }
+        case 'clear_finished': {
+            const fileList = uploads[action.identifier];
+            return Object.assign(Object.assign({}, uploads), { [action.identifier]: fileList.filter((f) => f.fileStatus !== FILE_UPLOAD_STATUS.FINISHED) });
+        }
+        case 'edit_files': {
+            const updatedFiles = Object.entries(action.files).reduce((acc, [identifier, files]) => {
+                const fileList = uploads[identifier];
+                files.forEach((file) => {
+                    const fileIndex = fileList.findIndex((p) => p.fileName === file.fileName);
+                    if (fileIndex !== -1) {
+                        fileList[fileIndex] = file;
+                    }
+                    else {
+                        fileList.push(file);
+                    }
+                });
+                return acc;
+            }, Object.assign({}, uploads));
+            return updatedFiles;
+        }
+        default: {
+            throw Error('Unknown action');
+        }
+    }
+}
+
+export { uploadReducer };

package/es/components/FileUploader/UploadStoreProvider/useOnFileAllUploaded.js

@@ -0,0 +1,31 @@
+import { useEffect } from 'react';
+import { FILE_UPLOAD_STATUS } from '../types.js';
+
+function useOnFileAllUploaded(uploadStore, setUploadStore) {
+    useEffect(() => {
+        const identifiers = Object.keys(uploadStore);
+        const allEditFiles = identifiers.reduce((acc, identifier) => {
+            const store = uploadStore[identifier];
+            const allUploadedFile = store.filter((file) => file.fileStatus === FILE_UPLOAD_STATUS.ALL_UPLOADED);
+            const successfulUploads = allUploadedFile.filter((file) => file.failSeq.length === 0);
+            const failedUploads = allUploadedFile.filter((file) => file.failSeq.length > 0);
+            const uploadingFile = store.find((file) => file.fileStatus === FILE_UPLOAD_STATUS.UPLOADING);
+            const initFile = store.find((file) => file.fileStatus === FILE_UPLOAD_STATUS.INIT);
+            const shouldUploadFile = uploadingFile ? undefined : initFile;
+            const editFiles = [
+                ...failedUploads.map((file) => (Object.assign(Object.assign({}, file), { fileStatus: FILE_UPLOAD_STATUS.FAILED }))),
+                ...successfulUploads.map((file) => (Object.assign(Object.assign({}, file), { fileStatus: FILE_UPLOAD_STATUS.MERGING }))),
+                shouldUploadFile ? Object.assign(Object.assign({}, shouldUploadFile), { fileStatus: FILE_UPLOAD_STATUS.UPLOADING }) : undefined,
+            ].filter((f) => !!f);
+            if (editFiles.length) {
+                return Object.assign(Object.assign({}, acc), { [identifier]: editFiles });
+            }
+            return acc;
+        }, {});
+        if (Object.keys(allEditFiles).length) {
+            setUploadStore({ type: 'edit_files', files: allEditFiles });
+        }
+    }, [setUploadStore, uploadStore]);
+}
+
+export { useOnFileAllUploaded };

package/es/components/FileUploader/UploadStoreProvider/useSaveUnfinishedUploads.js

@@ -0,0 +1,42 @@
+import { __rest } from 'tslib';
+import { useEffect } from 'react';
+import '../utils/checkExpiryTime.js';
+import { FILE_UPLOAD_STATUS } from '../types.js';
+import { deleteObjectStore } from '../utils/fileDB/deleteObjectStore.js';
+
+/**
+ * 未完成任务信息存储在localStorage而不是indexdb中，需要分别处理
+ * 因为之前的测试中发现，indexdb的存储方式在某些浏览器中会丢失数据
+ * 所以需要将未完成任务信息存储在localStorage中
+ *
+ * TODO: 将未完成任务信息存储在indexdb中
+ */
+function useSaveUnfinishedUploads(uploadStore) {
+    useEffect(() => {
+        window.addEventListener('beforeunload', saveUnfinishedUploads);
+        return () => {
+            window.removeEventListener('beforeunload', saveUnfinishedUploads);
+        };
+        function saveUnfinishedUploads() {
+            Object.entries(uploadStore).forEach(([key, uploads]) => {
+                const unfinishedUploads = uploads.filter((upload) => upload.fileStatus !== FILE_UPLOAD_STATUS.FINISHED);
+                if (unfinishedUploads.length) {
+                    localStorage.setItem(key, formatUnfinishedUploads(unfinishedUploads));
+                }
+                else {
+                    deleteObjectStore(key);
+                }
+            });
+        }
+    }, [uploadStore]);
+}
+function formatUnfinishedUploads(uploads) {
+    const formattedUploads = uploads.map((_a) => {
+        var { raw: _raw } = _a, uploadInfo = __rest(_a, ["raw"]);
+        const { uploadUrls, failSeq } = uploadInfo;
+        return Object.assign(Object.assign({}, uploadInfo), { failSeq: [], cancelControllers: {}, uploadUrls: [...uploadUrls, ...failSeq] });
+    });
+    return JSON.stringify(formattedUploads);
+}
+
+export { formatUnfinishedUploads, useSaveUnfinishedUploads };

package/es/components/FileUploader/UploadStoreProvider/useSetupMergingEvent.js

@@ -0,0 +1,45 @@
+import { __awaiter } from 'tslib';
+import { useRef, useCallback, useEffect } from 'react';
+import { FILE_UPLOAD_STATUS } from '../types.js';
+
+function useSetupMergingEvent(uploadStore, allUploaderManagers, allOnUploadSuccesses, setUploadStore) {
+    /**
+     * 记录每个 identifier 中正在合并的 uploadId, 防止重复调用 handleAllUploaded
+     */
+    const allCurrentlyInMergingUpload = useRef({});
+    const handleAllUploaded = useCallback(function handleAllUploaded(identifier, mergingFiles) {
+        return __awaiter(this, void 0, void 0, function* () {
+            const { onAllPartDone } = allUploaderManagers[identifier];
+            const onUploadSuccess = allOnUploadSuccesses[identifier];
+            const finishedOrFailedFiles = yield Promise.all(mergingFiles.map((file) => __awaiter(this, void 0, void 0, function* () {
+                const result = yield onAllPartDone(file.fileName, file.uploadId);
+                if (!result.status) {
+                    return Object.assign(Object.assign({}, file), { fileStatus: FILE_UPLOAD_STATUS.FAILED });
+                }
+                onUploadSuccess === null || onUploadSuccess === void 0 ? void 0 : onUploadSuccess(file);
+                allCurrentlyInMergingUpload.current[identifier].delete(file.uploadId);
+                return Object.assign(Object.assign({}, file), { percentage: 100, fileStatus: FILE_UPLOAD_STATUS.FINISHED });
+            })));
+            setUploadStore({
+                type: 'edit_files',
+                files: { [identifier]: finishedOrFailedFiles },
+            });
+        });
+    }, [allUploaderManagers, allOnUploadSuccesses, setUploadStore]);
+    useEffect(() => {
+        const identifiers = Object.keys(uploadStore);
+        identifiers.forEach((identifier) => {
+            const store = uploadStore[identifier];
+            const mergingFiles = store.filter((file) => file.fileStatus === FILE_UPLOAD_STATUS.MERGING);
+            if (mergingFiles.length > 0) {
+                const currentlyInMergingUpload = allCurrentlyInMergingUpload.current[identifier] || new Set();
+                const newMergingUploads = mergingFiles.filter((file) => !currentlyInMergingUpload.has(file.uploadId));
+                newMergingUploads.forEach((file) => currentlyInMergingUpload.add(file.uploadId));
+                allCurrentlyInMergingUpload.current[identifier] = currentlyInMergingUpload;
+                handleAllUploaded(identifier, newMergingUploads);
+            }
+        });
+    }, [uploadStore, handleAllUploaded]);
+}
+
+export { useSetupMergingEvent };

package/es/components/FileUploader/hooks/useCancelUpload.js

@@ -0,0 +1,40 @@
+import { __awaiter } from 'tslib';
+import { App } from 'antd';
+import { useContext } from 'react';
+import { AllUploaderManagersContext, UploadStoreDispatchContext } from '../UploadStoreProvider/UploadStoreProvider.js';
+import '../utils/checkExpiryTime.js';
+import '../types.js';
+import { deleteFileInStore } from '../utils/fileDB/deleteFileInStore.js';
+import { IdentifierContext } from '../FileUploaderImpl/FileUploaderContextProvider.js';
+import { useTranslate } from '../Locale/useTranslate.js';
+
+function useCancelUpload() {
+    const t = useTranslate();
+    const { message } = App.useApp();
+    const identifier = useContext(IdentifierContext);
+    const allUploaderManagers = useContext(AllUploaderManagersContext);
+    const setUploadStore = useContext(UploadStoreDispatchContext);
+    return function cancelUpload(file) {
+        return __awaiter(this, void 0, void 0, function* () {
+            const { onCancelUpload } = allUploaderManagers[identifier];
+            // 没有上传id，说明getUploadUrls失败，则直接删除文件
+            if (!file.uploadId) {
+                deleteFile(file.fileName);
+                return;
+            }
+            const result = yield onCancelUpload(file.fileName, file.uploadId);
+            if (result.status) {
+                deleteFile(file.fileName);
+            }
+            else {
+                message.error(result.reason || t('取消失败'));
+            }
+        });
+    };
+    function deleteFile(fileName) {
+        deleteFileInStore(String(identifier), fileName);
+        setUploadStore({ type: 'remove_file', identifier, fileName });
+    }
+}
+
+export { useCancelUpload };

package/es/components/FileUploader/hooks/useCurrentFile.js

@@ -0,0 +1,61 @@
+import { atom, useAtom } from 'jotai';
+import { useRef, useContext, useEffect } from 'react';
+import '../utils/checkExpiryTime.js';
+import 'tslib';
+import { FILE_UPLOAD_STATUS } from '../types.js';
+import { splitFileIntoChunk } from '../utils/splitFileIntoChunk.js';
+import { useCurrentFileOnUploading } from './useCurrentFileOnUploading.js';
+import { IdentifierContext } from '../FileUploaderImpl/FileUploaderContextProvider.js';
+import { useCurrentFileSetupAndBackUp } from './useCurrentFileSetupAndBackUp.js';
+import { UploadStoreDispatchContext } from '../UploadStoreProvider/UploadStoreProvider.js';
+
+const currentFileAtom = atom(null);
+const currentFileNameAtom = atom((get) => { var _a; return (_a = get(currentFileAtom)) === null || _a === void 0 ? void 0 : _a.fileName; });
+atom((get) => { var _a; return (_a = get(currentFileAtom)) === null || _a === void 0 ? void 0 : _a.expiryTime; });
+const currentFileUploadIdAtom = atom((get) => { var _a; return (_a = get(currentFileAtom)) === null || _a === void 0 ? void 0 : _a.uploadId; });
+atom((get) => { var _a; return (_a = get(currentFileAtom)) === null || _a === void 0 ? void 0 : _a.raw; });
+const currentFilePercentageAtom = atom((get) => { var _a; return (_a = get(currentFileAtom)) === null || _a === void 0 ? void 0 : _a.percentage; });
+const currentFileCancelControllersAtom = atom((get) => { var _a; return (_a = get(currentFileAtom)) === null || _a === void 0 ? void 0 : _a.cancelControllers; });
+function useCurrentFile() {
+    const isUploading = useRef(false);
+    const chunks = useRef([]);
+    const identifier = useContext(IdentifierContext);
+    const [currentFile, setCurrentFile] = useAtom(currentFileAtom);
+    const setUploadsStore = useContext(UploadStoreDispatchContext);
+    useCurrentFileSetupAndBackUp();
+    const onUploading = useCurrentFileOnUploading();
+    /**
+     * 为了实现当路由变更时仍然能够完成上传
+     * 当文件上传状态变为 ALL_UPLOADED 时，将转移到 uploadStore
+     * 剩下的工作将在 uploadStore 中完成
+     */
+    useEffect(() => {
+        if (!currentFile) {
+            isUploading.current = false;
+            return;
+        }
+        if (currentFile.fileStatus === FILE_UPLOAD_STATUS.INIT) {
+            chunks.current = splitFileIntoChunk(currentFile);
+            setCurrentFile((prev) => {
+                if (!prev)
+                    return prev;
+                return Object.assign(Object.assign({}, prev), { fileStatus: FILE_UPLOAD_STATUS.UPLOADING, cancelControllers: new Array(chunks.current.length).fill(new AbortController()) });
+            });
+        }
+        if (currentFile.fileStatus === FILE_UPLOAD_STATUS.UPLOADING && !isUploading.current) {
+            isUploading.current = true;
+            onUploading(chunks.current);
+        }
+        if (currentFile.fileStatus === FILE_UPLOAD_STATUS.CANCELED) {
+            Object.values(currentFile.cancelControllers).forEach((cc) => cc.abort());
+            setUploadsStore({ type: 'remove_file', identifier, fileName: currentFile.fileName });
+            setCurrentFile(null);
+        }
+        if (currentFile.fileStatus === FILE_UPLOAD_STATUS.FAILED) {
+            setUploadsStore({ type: 'edit_file', identifier, file: currentFile });
+            setCurrentFile(null);
+        }
+    }, [currentFile, identifier, onUploading, setCurrentFile, setUploadsStore]);
+}
+
+export { currentFileAtom, currentFileCancelControllersAtom, currentFileNameAtom, currentFilePercentageAtom, currentFileUploadIdAtom, useCurrentFile };

package/es/components/FileUploader/hooks/useCurrentFileOnUploading.js

@@ -0,0 +1,52 @@
+import { __awaiter } from 'tslib';
+import { useSetAtom } from 'jotai';
+import { useContext, useCallback } from 'react';
+import { FILE_UPLOAD_STATUS } from '../types.js';
+import { currentFileAtom } from './useCurrentFile.js';
+import { UploadStoreDispatchContext } from '../UploadStoreProvider/UploadStoreProvider.js';
+import { IdentifierContext } from '../FileUploaderImpl/FileUploaderContextProvider.js';
+import { useUploadChunk } from './useUploadChunk.js';
+import { useHandleChunkCompletion } from './useHandleChunkCompletion.js';
+
+function useCurrentFileOnUploading() {
+    const identifier = useContext(IdentifierContext);
+    const setCurrentFile = useSetAtom(currentFileAtom);
+    const setUploadStore = useContext(UploadStoreDispatchContext);
+    const uploadChunk = useUploadChunk();
+    const handleChunkCompletion = useHandleChunkCompletion(identifier);
+    const putChunk = useCallback((urlInfo, chunk) => __awaiter(this, void 0, void 0, function* () {
+        try {
+            yield uploadChunk(urlInfo, chunk);
+            yield handleChunkCompletion(urlInfo);
+        }
+        catch (e) {
+            if (e instanceof Error && e.message === 'canceled') {
+                return;
+            }
+            setCurrentFile((prev) => {
+                if (!prev)
+                    return prev;
+                return Object.assign(Object.assign({}, prev), { failSeq: [...prev.failSeq, urlInfo], uploadUrls: prev.uploadUrls.filter((u) => u !== urlInfo) });
+            });
+        }
+    }), [uploadChunk, handleChunkCompletion, setCurrentFile]);
+    return useCallback(function onUploading(chunks) {
+        return __awaiter(this, void 0, void 0, function* () {
+            for (const { url, chunk } of chunks) {
+                yield putChunk(url, chunk);
+            }
+            setCurrentFile((prev) => {
+                if (!prev)
+                    return prev;
+                setUploadStore({
+                    type: 'edit_file',
+                    identifier,
+                    file: Object.assign(Object.assign({}, prev), { fileStatus: FILE_UPLOAD_STATUS.ALL_UPLOADED }),
+                });
+                return null;
+            });
+        });
+    }, [identifier, putChunk, setCurrentFile, setUploadStore]);
+}
+
+export { useCurrentFileOnUploading };

package/es/components/FileUploader/hooks/useCurrentFileSetupAndBackUp.js

@@ -0,0 +1,39 @@
+import { useAtomValue, useSetAtom } from 'jotai';
+import { useContext, useEffect } from 'react';
+import { FILE_UPLOAD_STATUS } from '../types.js';
+import { UploadStoreContext } from '../UploadStoreProvider/UploadStoreProvider.js';
+import { currentFileAtom } from './useCurrentFile.js';
+import { IdentifierContext } from '../FileUploaderImpl/FileUploaderContextProvider.js';
+import { formatUnfinishedUploads } from '../UploadStoreProvider/useSaveUnfinishedUploads.js';
+
+function useCurrentFileSetupAndBackUp() {
+    const identifier = useContext(IdentifierContext);
+    const uploadStore = useContext(UploadStoreContext);
+    const currentFile = useAtomValue(currentFileAtom);
+    const setCurrentFile = useSetAtom(currentFileAtom);
+    useEffect(() => {
+        const fileList = uploadStore[identifier];
+        if (!fileList || fileList.length === 0) {
+            return;
+        }
+        const uploadingFile = fileList.find((file) => file.fileStatus === FILE_UPLOAD_STATUS.UPLOADING);
+        if (uploadingFile) {
+            setCurrentFile(Object.assign(Object.assign({}, uploadingFile), { fileStatus: FILE_UPLOAD_STATUS.INIT }));
+        }
+    }, [identifier, setCurrentFile, uploadStore]);
+    useEffect(() => {
+        window.addEventListener('beforeunload', saveUnfinishedUpload);
+        return () => {
+            window.removeEventListener('beforeunload', saveUnfinishedUpload);
+        };
+        function saveUnfinishedUpload() {
+            if (!currentFile)
+                return;
+            if (currentFile.fileStatus === FILE_UPLOAD_STATUS.UPLOADING) {
+                localStorage.setItem(identifier + '_uploading', formatUnfinishedUploads([currentFile]));
+            }
+        }
+    }, [currentFile, identifier]);
+}
+
+export { useCurrentFileSetupAndBackUp };

package/es/components/FileUploader/hooks/useFormatFiles.js

@@ -0,0 +1,64 @@
+import { __awaiter } from 'tslib';
+import { App } from 'antd';
+import { useContext, useState } from 'react';
+import '../utils/checkExpiryTime.js';
+import { createFileToUpload } from '../utils/createFileToUpload.js';
+import { addFilesToIndexdb } from '../utils/fileDB/addFilesToIndexdb.js';
+import { useFindDuplicates } from './useFormatFilesFindDuplicates.js';
+import { useRemoveDuplicates } from './useFormatFilesRemoveDuplicates.js';
+import { AllUploaderManagersContext, UploadStoreDispatchContext } from '../UploadStoreProvider/UploadStoreProvider.js';
+import { FILE_UPLOAD_STATUS } from '../types.js';
+import { useTranslate } from '../Locale/useTranslate.js';
+import { RootContext, IdentifierContext, ChunkSizeContext } from '../FileUploaderImpl/FileUploaderContextProvider.js';
+
+function useFormatFiles() {
+    const t = useTranslate();
+    const { message } = App.useApp();
+    const root = useContext(RootContext);
+    const identifier = useContext(IdentifierContext);
+    const chunkSize = useContext(ChunkSizeContext);
+    const allUploaderManagers = useContext(AllUploaderManagersContext);
+    const setUploadStore = useContext(UploadStoreDispatchContext);
+    const { getUploadUrls, onBeforeUpload } = allUploaderManagers[identifier];
+    const [isFormatingFiles, setIsFormatingFiles] = useState(false);
+    const findDuplicates = useFindDuplicates();
+    const removeDuplicatesInUploadQueue = useRemoveDuplicates();
+    return { isFormatingFiles, formatFiles };
+    function formatFiles(allFiles) {
+        return __awaiter(this, void 0, void 0, function* () {
+            setIsFormatingFiles(true);
+            const filesToUpload = yield handleDuplicatesFiles(allFiles);
+            const uploadableFiles = yield createUploadableFiles(filesToUpload);
+            setUploadStore({ type: 'add_files', identifier, files: uploadableFiles });
+            addFilesToIndexdb(identifier, uploadableFiles.map((f) => f.raw));
+            setIsFormatingFiles(false);
+        });
+    }
+    function handleDuplicatesFiles(files) {
+        return __awaiter(this, void 0, void 0, function* () {
+            const [shouldOverwrite, duplicateFileNames] = yield findDuplicates(files);
+            if (shouldOverwrite) {
+                removeDuplicatesInUploadQueue(duplicateFileNames);
+                return files;
+            }
+            return files.filter((f) => !duplicateFileNames.has(f.name));
+        });
+    }
+    function createUploadableFiles(files) {
+        return __awaiter(this, void 0, void 0, function* () {
+            const promises = files.map((file) => createFileToUpload(file, root, getUploadUrls, onBeforeUpload, chunkSize));
+            /* 过滤器是为了通过类型检查而设置的，如果按要求传递 getUploadUrls，状态应该总是 fulfilled */
+            const result = (yield Promise.allSettled(promises))
+                .filter((r) => r.status === 'fulfilled')
+                .map((f) => f.value);
+            if (result.some((f) => f.fileStatus === FILE_UPLOAD_STATUS.FAILED) ||
+                /** 因上述原因，这个条件应该总是为 false, 但为了保险，还是保留 */
+                result.length < files.length) {
+                message.info(t('部分文件获取上传地址失败'));
+            }
+            return result;
+        });
+    }
+}
+
+export { useFormatFiles };

package/es/components/FileUploader/hooks/useFormatFilesFindDuplicates.js

@@ -0,0 +1,75 @@
+import { __awaiter } from 'tslib';
+import { App } from 'antd';
+import { useContext } from 'react';
+import { UploadStoreContext } from '../UploadStoreProvider/UploadStoreProvider.js';
+import { confirmModalConfig } from '../utils/modalConfig.js';
+import { useTranslate } from '../Locale/useTranslate.js';
+import { RootContext, IdentifierContext, ExternalUploadContextContext, ExternalUploadContextOnlyContext } from '../FileUploaderImpl/FileUploaderContextProvider.js';
+
+function useFindDuplicates() {
+    const { modal } = App.useApp();
+    const t = useTranslate();
+    const root = useContext(RootContext);
+    const identifier = useContext(IdentifierContext);
+    const uploadStore = useContext(UploadStoreContext);
+    const externalUploadContext = useContext(ExternalUploadContextContext);
+    const externalUploadContextOnly = useContext(ExternalUploadContextOnlyContext);
+    /**
+     * 检查重复文件并询问用户是否覆盖
+     * @returns [是否覆盖, 重复文件名列表]
+     */
+    return function findDuplicates(files) {
+        return __awaiter(this, void 0, void 0, function* () {
+            const duplicateFiles = externalUploadContextOnly
+                ? checkForDuplicatesInExternalUploadContext(files, externalUploadContext !== null && externalUploadContext !== void 0 ? externalUploadContext : [])
+                : [
+                    ...checkForDuplicatesInUploads(files, uploadStore[identifier], root),
+                    ...checkForDuplicatesInExternalUploadContext(files, externalUploadContext !== null && externalUploadContext !== void 0 ? externalUploadContext : []),
+                ];
+            if (duplicateFiles.length) {
+                const userChoice = yield modal.confirm(Object.assign(Object.assign({}, confirmModalConfig), { okText: t('覆盖'), cancelText: t('取消'), title: t('发现同名文件，是否覆盖？') }));
+                return [userChoice, new Set(duplicateFiles)];
+            }
+            return [true, new Set()];
+        });
+    };
+}
+function checkForDuplicatesInUploads(files, uploads, root) {
+    // 获取已存在的文件名集合
+    const existingFiles = new Set(uploads.map((f) => f.fileName));
+    // 检查新上传的文件是否与现有文件重名
+    const duplicateFiles = files
+        .filter((file) => {
+        const fileName = root ? `${root}${file.name}` : file.name;
+        return existingFiles.has(fileName);
+    })
+        .map((file) => file.name); // 最后，我们只保留重复文件的名称
+    return duplicateFiles;
+}
+function checkForDuplicatesInExternalUploadContext(files, externalUploadContext) {
+    // 检查新上传的文件是否与现有文件重名
+    const duplicateFiles = files
+        .filter((file) => {
+        var _a;
+        // 判断当前文件是否为文件夹
+        // 如果文件名中包含 '/', 则认为它是一个文件夹
+        const isNewFileFolder = file.name.includes('/');
+        // 获取文件或文件夹的第一级名称
+        // 例如，对于 "folder/file.txt"，只取 "folder"
+        const topLevelName = file.name.split('/')[0];
+        // 检查这个名称在已存在的文件列表中是否为文件夹
+        // existingFiles 是一个 Map，键是文件名，值是布尔值（true 表示文件夹，false 表示文件）
+        const isExistingFileFolder = (_a = externalUploadContext.find((v) => v.fileName === topLevelName)) === null || _a === void 0 ? void 0 : _a.isFolder;
+        // 比较新文件和已存在文件的类型（文件夹或非文件夹）是否相同
+        if (isNewFileFolder === isExistingFileFolder) {
+            // 如果类型相同（都是文件夹或都不是文件夹），则认为是重复的
+            return true;
+        }
+        // 如果类型不同，则不是重复的
+        return false;
+    })
+        .map((file) => file.name); // 最后，只保留重复文件的名称
+    return duplicateFiles;
+}
+
+export { useFindDuplicates };

package/es/components/FileUploader/hooks/useFormatFilesRemoveDuplicates.js

@@ -0,0 +1,21 @@
+import { useContext } from 'react';
+import { UploadStoreContext } from '../UploadStoreProvider/UploadStoreProvider.js';
+import { useCancelUpload } from './useCancelUpload.js';
+import { IdentifierContext } from '../FileUploaderImpl/FileUploaderContextProvider.js';
+
+function useRemoveDuplicates() {
+    const identifier = useContext(IdentifierContext);
+    const uploadStore = useContext(UploadStoreContext);
+    const cancelUpload = useCancelUpload();
+    return function removeDuplicates(duplicationOfName) {
+        const fileList = uploadStore[identifier];
+        for (const fileName of duplicationOfName) {
+            const upload = fileList.find((f) => f.fileName === fileName);
+            if (upload) {
+                cancelUpload(upload);
+            }
+        }
+    };
+}
+
+export { useRemoveDuplicates };