start progress immiedtly after start

instill-ai · Nov 4, 2024 · 24a066c · 24a066c
1 parent 8f5c581
commit 24a066c
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 8 deletions.
diff --git a/packages/toolkit/src/view/catalog/components/lib/uploadFileWithProgress.ts b/packages/toolkit/src/view/catalog/components/lib/uploadFileWithProgress.ts
@@ -13,13 +13,15 @@ export function useUploadWithProgress() {
     async (file: File, onProgress: (progress: number) => void) => {
       try {
         setUploadProgress((prev) => ({ ...(prev ?? {}), [file.name]: 0 }));
+        onProgress(0);
+
         const totalSize = file.size;
         let uploadedSize = 0;
         const chunkSize = 1024 * 1024; // 1MB chunks
         while (uploadedSize < totalSize) {
           await new Promise((resolve) => setTimeout(resolve, 100)); // Simulate network delay
           uploadedSize = Math.min(uploadedSize + chunkSize, totalSize);
-          const progress = (uploadedSize / totalSize) * 100;
+          const progress = Math.round((uploadedSize / totalSize) * 100);
           setUploadProgress((prev) => ({
             ...(prev ?? {}),
             [file.name]: progress,

diff --git a/packages/toolkit/src/view/catalog/components/tabs/UploadExploreTab.tsx b/packages/toolkit/src/view/catalog/components/tabs/UploadExploreTab.tsx
@@ -298,6 +298,13 @@ export const UploadExploreTab = ({
         setProcessingFileIndex(i);
 
         try {
+          await uploadFile(file, (progress) => {
+            setUploadProgress((prev) => ({
+              ...prev,
+              [file.name]: progress,
+            }));
+          });
+
           const content = await readFileAsBase64(file);
 
           const payload: CreateNamespaceCatalogFileRequest = {
@@ -313,13 +320,6 @@ export const UploadExploreTab = ({
             accessToken,
           });
 
-          await uploadFile(file, (progress) => {
-            setUploadProgress((prev) => ({
-              ...prev,
-              [file.name]: progress,
-            }));
-          });
-
           await processCatalogFiles.mutateAsync({
             fileUids: [uploadedFile.fileUid],
             accessToken,