Add max timeout for chunks in resumable upload and misc tweaks (#7932)

* add max timeout for chunks in resumable upload; use floor for rounding progress; tweak listed supported extensions * update changelog * remove rogue 'import' from UI * Update frontend/javascripts/admin/admin_rest_api.ts Co-authored-by: Florian M <[email protected]> --------- Co-authored-by: Florian M <[email protected]>
scalableminds · Jul 18, 2024 · afb4f88 · afb4f88
1 parent 98e70d5
commit afb4f88
Show file tree

Hide file tree

Showing 4 changed files with 9 additions and 7 deletions.
diff --git a/CHANGELOG.unreleased.md b/CHANGELOG.unreleased.md
@@ -21,6 +21,7 @@ For upgrade instructions, please check the [migration guide](MIGRATIONS.released
 
 ### Fixed
 - Fixed a bug that allowed the default newly created bounding box to appear outside the dataset. In case the whole bounding box would be outside it is created regardless. [#7892](https://github.com/scalableminds/webknossos/pull/7892)
+- Fixed a rare bug that could cause hanging dataset uploads. [#7932](https://github.com/scalableminds/webknossos/pull/7932)
 
 ### Removed
 

diff --git a/frontend/javascripts/admin/admin_rest_api.ts b/frontend/javascripts/admin/admin_rest_api.ts
@@ -1269,12 +1269,12 @@ export function createResumableUpload(datastoreUrl: string, uploadId: string): P
       new ResumableJS({
         testChunks: false,
         target: `${datastoreUrl}/data/datasets?token=${token}`,
-        chunkSize: 10 * 1024 * 1024,
-        // set chunk size to 10MB
+        chunkSize: 10 * 1024 * 1024, // 10MB
         permanentErrors: [400, 403, 404, 409, 415, 500, 501],
         simultaneousUploads: 3,
         chunkRetryInterval: 2000,
         maxChunkRetries: undefined,
+        xhrTimeout: 10 * 60 * 1000, // 10m
         // @ts-expect-error ts-migrate(2322) FIXME: Type '(file: any) => string' is not assignable to ... Remove this comment to see the full error message
         generateUniqueIdentifier,
       }),

diff --git a/frontend/javascripts/admin/dataset/dataset_add_view.tsx b/frontend/javascripts/admin/dataset/dataset_add_view.tsx
@@ -317,7 +317,6 @@ const getPostUploadModal = (
                 <Button type="primary" onClick={() => history.push("/jobs")}>
                   View the Jobs Queue
                 </Button>
-                import
                 <Button onClick={() => history.push("/dashboard/datasets")}>Go to Dashboard</Button>
               </React.Fragment>
             ) : (

diff --git a/frontend/javascripts/admin/dataset/dataset_upload_view.tsx b/frontend/javascripts/admin/dataset/dataset_upload_view.tsx
@@ -476,8 +476,10 @@ class DatasetUploadView extends React.Component<PropsWithFormAndRouter, State> {
             <br />
             {isRetrying ? "Retrying to continue the upload …" : null}
             <br />
-            <Progress // Round to 1 digit after the comma.
-              percent={Math.round(uploadProgress * 1000) / 10}
+            <Progress
+              // Round to 1 digit after the comma, but use floor
+              // to avoid that 100% are displayed even though the progress is lower.
+              percent={Math.floor(uploadProgress * 1000) / 10}
               status="active"
             />
           </Spin>
@@ -1028,7 +1030,7 @@ function FileUploadArea({
 
                   <li>
                     <Popover content={<SingleLayerImageStackExample />} trigger="hover">
-                      Single-Layer Image File Sequence (tif, jpg, png, dm3, dm4)
+                      Single-Layer Image File Sequence (tif, jpg, png, dm3, dm4 etc.)
                       <InfoCircleOutlined
                         style={{
                           marginLeft: 4,
@@ -1113,7 +1115,7 @@ function FileUploadArea({
                       />
                     </Popover>
                   </li>
-                  <li>Single-file images (tif, czi, nifti, raw)</li>
+                  <li>Single-file images (tif, czi, nifti, raw, ims etc.)</li>
 
                   <li>KNOSSOS file hierarchy</li>
                 </ul>