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

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

@@ -0,0 +1,31 @@
+import { __awaiter } from 'tslib';
+import { useAtomValue, useSetAtom } from 'jotai';
+import { useContext, useCallback } from 'react';
+import { AllUploaderManagersContext } from '../UploadStoreProvider/UploadStoreProvider.js';
+import { currentFileNameAtom, currentFileUploadIdAtom, currentFileAtom } from './useCurrentFile.js';
+
+function useHandleChunkCompletion(identifier) {
+    const currentFileName = useAtomValue(currentFileNameAtom);
+    const currentUploadId = useAtomValue(currentFileUploadIdAtom);
+    const allUploaderManagers = useContext(AllUploaderManagersContext);
+    const setCurrentFile = useSetAtom(currentFileAtom);
+    const uploadManager = allUploaderManagers[identifier];
+    const { onOnePartDone } = uploadManager;
+    return useCallback((urlInfo) => __awaiter(this, void 0, void 0, function* () {
+        if (!currentFileName || !currentUploadId)
+            return;
+        const result = yield onOnePartDone(currentFileName, currentUploadId, urlInfo.partNum);
+        if (!result.status) {
+            throw new Error(result.reason);
+        }
+        setCurrentFile((prev) => {
+            if (!prev)
+                return prev;
+            const uploadStatus = [...prev.uploadStatus];
+            uploadStatus[urlInfo.partNum] = 1;
+            return Object.assign(Object.assign({}, prev), { uploadStatus, uploadUrls: prev.uploadUrls.filter((u) => u.partNum !== urlInfo.partNum), completeSeq: [...prev.completeSeq, urlInfo] });
+        });
+    }), [currentFileName, currentUploadId, onOnePartDone, setCurrentFile]);
+}
+
+export { useHandleChunkCompletion };

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

@@ -0,0 +1,24 @@
+import { useContext, useRef, useEffect } from 'react';
+import { UploadStoreContext, UploadStoreDispatchContext } from '../UploadStoreProvider/UploadStoreProvider.js';
+import { useOnMountedResumeUnfinished } from './useOnMountedResumeUnfinished.js';
+import { IdentifierContext } from '../FileUploaderImpl/FileUploaderContextProvider.js';
+
+function useOnMounted() {
+    const identifier = useContext(IdentifierContext);
+    const uploadStore = useContext(UploadStoreContext);
+    const setUploadsStore = useContext(UploadStoreDispatchContext);
+    const currentIdentifier = useRef('');
+    const resumeUnfinishedUploads = useOnMountedResumeUnfinished(identifier);
+    useEffect(() => {
+        if (currentIdentifier.current === identifier) {
+            return;
+        }
+        currentIdentifier.current = identifier;
+        if (!uploadStore[identifier]) {
+            setUploadsStore({ type: 'add', identifier });
+        }
+        resumeUnfinishedUploads();
+    }, [identifier, resumeUnfinishedUploads, uploadStore, setUploadsStore]);
+}
+
+export { useOnMounted };

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

@@ -0,0 +1,58 @@
+import { __awaiter } from 'tslib';
+import { App } from 'antd';
+import '../utils/checkExpiryTime.js';
+import { FILE_UPLOAD_STATUS } from '../types.js';
+import { openDBAndRetrieveData } from '../utils/fileDB/openDBAndRetrieveData.js';
+import { useContext, useCallback } from 'react';
+import { useRetryUpload } from './useRetryUpload.js';
+import { UploadStoreDispatchContext } from '../UploadStoreProvider/UploadStoreProvider.js';
+import { confirmModalConfig } from '../utils/modalConfig.js';
+
+function useOnMountedResumeUnfinished(identifier) {
+    const { message, modal } = App.useApp();
+    const setUploadStore = useContext(UploadStoreDispatchContext);
+    const retryUpload = useRetryUpload();
+    return useCallback(() => __awaiter(this, void 0, void 0, function* () {
+        const prevUploadableFiles = yield reloadSaveData(identifier);
+        setUploadStore({ type: 'add_files', identifier, files: prevUploadableFiles });
+        if (prevUploadableFiles.length) {
+            modal.confirm(Object.assign(Object.assign({}, confirmModalConfig), { title: '提示', content: '检测到未完成上传任务，是否继续上传？', onOk() {
+                    prevUploadableFiles.forEach((file) => retryUpload(file));
+                },
+                onCancel() {
+                    message.info('点击上传按钮手动继续');
+                } }));
+        }
+    }), [identifier, setUploadStore, retryUpload, modal, message]);
+}
+function reloadSaveData(identifier) {
+    return __awaiter(this, void 0, void 0, function* () {
+        const rawFiles = yield openDBAndRetrieveData(identifier);
+        const pendingFileInfos = JSON.parse(localStorage.getItem(identifier) || '[]');
+        const uploadingFileInfos = JSON.parse(localStorage.getItem(identifier + '_uploading') || '[]');
+        const uploadInfos = (function () {
+            // 同一个组件实例下永远只有一个文件正在上传，所以uploadingFileInfos的长度永远为1
+            if (uploadingFileInfos.length) {
+                const pendingFile = pendingFileInfos.findIndex((file) => file.fileName === uploadingFileInfos[0].fileName);
+                if (pendingFile !== -1) {
+                    pendingFileInfos.splice(pendingFile, 1, uploadingFileInfos[0]);
+                }
+            }
+            return pendingFileInfos;
+        })();
+        const mergedSaveData = rawFiles
+            .map((rawFile) => {
+            const matchingFile = uploadInfos.find((file) => file.fileName === rawFile.name);
+            if (matchingFile) {
+                return Object.assign(Object.assign({}, matchingFile), { raw: rawFile, fileStatus: FILE_UPLOAD_STATUS.PAUSED });
+            }
+            return null;
+        })
+            .filter((file) => file !== null);
+        localStorage.removeItem(identifier);
+        localStorage.removeItem(identifier + '_uploading');
+        return mergedSaveData;
+    });
+}
+
+export { useOnMountedResumeUnfinished };

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

@@ -0,0 +1,33 @@
+import { __awaiter } from 'tslib';
+import { checkExpiryTime, CHECK_RESULT } from '../utils/checkExpiryTime.js';
+import { createFileToUpload } from '../utils/createFileToUpload.js';
+import { useContext, useCallback } from 'react';
+import { AllUploaderManagersContext, UploadStoreDispatchContext } from '../UploadStoreProvider/UploadStoreProvider.js';
+import { FILE_UPLOAD_STATUS } from '../types.js';
+import { IdentifierContext, ChunkSizeContext } from '../FileUploaderImpl/FileUploaderContextProvider.js';
+
+function useRetryUpload() {
+    const identifier = useContext(IdentifierContext);
+    const chunkSize = useContext(ChunkSizeContext);
+    const allUploaderManagers = useContext(AllUploaderManagersContext);
+    const setUploadStore = useContext(UploadStoreDispatchContext);
+    return useCallback((selectedFile) => __awaiter(this, void 0, void 0, function* () {
+        const uploadManager = allUploaderManagers[identifier];
+        const checkResult = checkExpiryTime(selectedFile.expiryTime);
+        if (checkResult === CHECK_RESULT.SHOULD_CREATE_NEW_FILE) {
+            // 因为是重新上传，所以不需要指定root
+            const file = yield createFileToUpload(selectedFile.raw, undefined, uploadManager.getUploadUrls, undefined, chunkSize);
+            setUploadStore({ type: 'edit_file', identifier, file });
+        }
+        else {
+            const uploadUrls = [...selectedFile.failSeq, ...selectedFile.uploadUrls];
+            setUploadStore({
+                type: 'edit_file',
+                identifier,
+                file: Object.assign(Object.assign({}, selectedFile), { uploadUrls, failSeq: [], cancelControllers: [], fileStatus: FILE_UPLOAD_STATUS.INIT }),
+            });
+        }
+    }), [identifier, chunkSize, allUploaderManagers, setUploadStore]);
+}
+
+export { useRetryUpload };

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

@@ -0,0 +1,46 @@
+import { __awaiter } from 'tslib';
+import axios from 'axios';
+import { useAtomValue, useSetAtom } from 'jotai';
+import { useContext, useCallback } from 'react';
+import { currentFileCancelControllersAtom, currentFileAtom } from './useCurrentFile.js';
+import { FILE_UPLOAD_STATUS } from '../types.js';
+import { UploadRequestConfigContext } from '../FileUploaderImpl/FileUploaderContextProvider.js';
+
+const axiosInstance = axios.create();
+function useUploadChunk() {
+    const uploadRequestConfig = useContext(UploadRequestConfigContext);
+    const currentFileCancelControllers = useAtomValue(currentFileCancelControllersAtom);
+    const setCurrentFile = useSetAtom(currentFileAtom);
+    const handleUploadProgress = useCallback((e, partNum) => {
+        setCurrentFile((prev) => {
+            if (!prev || prev.fileStatus !== FILE_UPLOAD_STATUS.UPLOADING)
+                return prev;
+            const prevPartStatus = prev.uploadStatus[partNum];
+            const uploadStatus = prevPartStatus !== 1
+                ? prev.uploadStatus.toSpliced(partNum, 1, Number(e.progress))
+                : prev.uploadStatus;
+            const overallProgress = prev.uploadStatus.reduce((acc, curr) => acc + (curr || 0), 0);
+            const percentage = overallProgress * (100 / prev.partCount);
+            return Object.assign(Object.assign({}, prev), { percentage,
+                uploadStatus });
+        });
+    }, [setCurrentFile]);
+    return useCallback((urlInfo, chunk) => __awaiter(this, void 0, void 0, function* () {
+        if (!currentFileCancelControllers)
+            return;
+        yield axiosInstance.put(urlInfo.uploadUrl, chunk, Object.assign(Object.assign({}, uploadRequestConfig), { withCredentials: (uploadRequestConfig === null || uploadRequestConfig === void 0 ? void 0 : uploadRequestConfig.withCredentials) || false, timeout: (uploadRequestConfig === null || uploadRequestConfig === void 0 ? void 0 : uploadRequestConfig.timeout) || 60 * 10 * 3 * 1000, headers: Object.assign({ 'Content-Type': 'application/octet-stream' }, uploadRequestConfig === null || uploadRequestConfig === void 0 ? void 0 : uploadRequestConfig.headers), signal: currentFileCancelControllers[urlInfo.partNum].signal, onUploadProgress: throttled((e) => handleUploadProgress(e, urlInfo.partNum)) }));
+    }), [currentFileCancelControllers, uploadRequestConfig, handleUploadProgress]);
+}
+function throttled(fn, delay = 500) {
+    let timer = null;
+    return function (arg) {
+        if (!timer) {
+            timer = setTimeout(() => {
+                fn(arg);
+                timer = null;
+            }, delay);
+        }
+    };
+}
+
+export { useUploadChunk };

package/es/components/FileUploader/icons/CloseFilled.js

@@ -0,0 +1,7 @@
+import { jsx } from 'react/jsx-runtime';
+
+function CloseFilled(props) {
+    return (jsx("svg", Object.assign({ width: "16", height: "17", viewBox: "0 0 16 17", fill: "currentColor", xmlns: "http://www.w3.org/2000/svg" }, props, { children: jsx("g", { id: "icon/\u00E5\u0085\u00B3\u00E9\u0097\u00AD\u00E6\u008C\u0089\u00E9\u0092\u00AE", children: jsx("path", { id: "Subtract", fillRule: "evenodd", clipRule: "evenodd", d: "M14.6668 8.49967C14.6668 12.1816 11.6821 15.1663 8.00016 15.1663C4.31826 15.1663 1.3335 12.1816 1.3335 8.49967C1.3335 4.81777 4.31826 1.83301 8.00016 1.83301C11.6821 1.83301 14.6668 4.81777 14.6668 8.49967ZM10.239 6.26052C10.4343 6.45578 10.4343 6.77237 10.239 6.96763L8.70698 8.49969L10.239 10.0318C10.4343 10.227 10.4343 10.5436 10.239 10.7389C10.0438 10.9341 9.7272 10.9341 9.53194 10.7389L7.99987 9.2068L6.46781 10.7389C6.27255 10.9341 5.95597 10.9341 5.7607 10.7389C5.56544 10.5436 5.56544 10.227 5.7607 10.0318L7.29277 8.49969L5.7607 6.96763C5.56544 6.77237 5.56544 6.45578 5.7607 6.26052C5.95597 6.06526 6.27255 6.06526 6.46781 6.26052L7.99987 7.79258L9.53194 6.26052C9.7272 6.06526 10.0438 6.06526 10.239 6.26052Z", fill: "currentColor" }) }) })));
+}
+
+export { CloseFilled as default };

package/es/components/FileUploader/icons/UnkownFileIcon.js

@@ -0,0 +1,7 @@
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+function UnkownFileIcon(props) {
+    return (jsx("svg", Object.assign({ width: "18", height: "16", viewBox: "0 0 18 16", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, props, { children: jsxs("g", { id: "Component 56", children: [jsx("path", { id: "Subtract", d: "M10.1988 5.9923V1.50071L5.00029 1.5C4.44796 1.49992 4.00016 1.94765 4.00015 2.49999L4 13.4998C3.99999 14.0521 4.44771 14.4999 5 14.4999H13.5068C14.0591 14.4999 14.5068 14.0522 14.5068 13.4999L14.507 5.9923H10.1988Z", fill: "currentColor" }), jsx("path", { id: "Subtract_2", d: "M14.507 4.82148H11.3911V1.5L14.507 4.82148Z", fill: "currentColor", fillOpacity: "0.4" })] }) })));
+}
+
+export { UnkownFileIcon as default };

package/es/components/FileUploader/icons/UploadIcon.js

@@ -0,0 +1,7 @@
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+function UploadIcon(props) {
+    return (jsx("svg", Object.assign({ width: "34", height: "31", viewBox: "0 0 34 31", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, props, { children: jsxs("g", { id: "\u00E4\u00B8\u008A\u00E4\u00BC\u00A0\u00E6\u008F\u0092\u00E5\u009B\u00BE", children: [jsx("path", { id: "Vector", d: "M26 8.66665V29.7043C26.0013 29.867 25.9705 30.0284 25.9094 30.1792C25.8483 30.33 25.7581 30.4672 25.6439 30.5831C25.5297 30.699 25.3938 30.7913 25.244 30.8547C25.0941 30.918 24.9332 30.9512 24.7705 30.9523H1.22943C0.903577 30.9523 0.591055 30.823 0.360528 30.5927C0.130002 30.3624 0.000328142 30.05 0 29.7241V1.22819C0 0.563332 0.553428 0 1.23562 0H17.3333V7.42856C17.3333 7.75692 17.4638 8.07184 17.6959 8.30402C17.9281 8.53621 18.243 8.66665 18.5714 8.66665H26ZM26 6.19047H19.8095V0.00371423L26 6.19047Z", fill: "#B9D6FF" }), jsxs("g", { id: "Group 1000006993", children: [jsx("circle", { id: "Ellipse 87", cx: "26", cy: "23", r: "8", fill: "#1775FE" }), jsx("path", { id: "Vector_2", d: "M26.4545 24.315V27.5714H25.5455V24.315L24.3034 25.2023L23.775 24.4625L26 22.8732L28.225 24.4625L27.6966 25.2023L26.4545 24.315ZM31 24.4545C31 25.7098 29.9825 26.7273 28.7273 26.7273H27.3636V25.8182H28.7273C29.0749 25.8184 29.4094 25.6858 29.6625 25.4476C29.9156 25.2094 30.0682 24.8835 30.0891 24.5365C30.11 24.1896 29.9976 23.8477 29.7749 23.5808C29.5522 23.314 29.236 23.1422 28.8909 23.1007L28.4568 23.0489L28.4918 22.6127C28.4973 22.5455 28.5 22.4775 28.5 22.4091C28.5 21.0284 27.3807 19.9091 26 19.9091C25.4245 19.9091 24.8666 20.1077 24.4205 20.4712C23.9744 20.8347 23.6672 21.3409 23.5509 21.9045L23.4955 22.175L23.2295 22.2507C22.8492 22.3591 22.5146 22.5885 22.2763 22.9042C22.038 23.2198 21.9091 23.6045 21.9091 24C21.9091 24.4822 22.1006 24.9447 22.4416 25.2856C22.7826 25.6266 23.2451 25.8182 23.7273 25.8182H24.6364V26.7273H23.7273C22.2211 26.7273 21 25.5061 21 24C21 22.8655 21.6989 21.8682 22.7239 21.4632C22.9292 20.753 23.3598 20.1288 23.9506 19.6846C24.5415 19.2403 25.2607 19.0001 26 19C27.8414 19 29.3416 20.4598 29.4068 22.2852C29.8687 22.4302 30.2723 22.7187 30.5588 23.1089C30.8453 23.499 30.9999 23.9705 31 24.4545Z", fill: "white" })] })] }) })));
+}
+
+export { UploadIcon as default };