fix(web): show warning if upload completed with errors (#3634)

web/src/lib/components/shared-components/upload-panel.svelte

@@ -10,6 +10,7 @@
   let showDetail = true;
   let uploadLength = 0;
   let duplicateCount = 0;
+  let errorCount = 0;
   let isUploading = false;
 
   // Reactive action to update asset uploadLength whenever there is a new one added to the list
@@ -26,6 +27,10 @@
   uploadAssetsStore.duplicateCounter.subscribe((value) => {
     duplicateCount = value;
   });
+
+  uploadAssetsStore.errorCounter.subscribe((value) => {
+    errorCount = value;
+  });
 </script>
 
 {#if isUploading}
@@ -33,10 +38,17 @@
     in:fade={{ duration: 250 }}
     out:fade={{ duration: 250, delay: 1000 }}
     on:outroend={() => {
+      const errorInfo =
+        errorCount > 0 ? `Upload completed with ${errorCount} error${errorCount > 1 ? 's' : ''}` : 'Upload success';
+      const type = errorCount > 0 ? NotificationType.Warning : NotificationType.Info;
+
       notificationController.show({
-        message: 'Upload success, refresh the page to see new upload assets',
+        message: `${errorInfo}, refresh the page to see new upload assets`,
-        type: NotificationType.Info,
+        type,
       });
+
+      uploadAssetsStore.errorCounter.set(0);
+
       if (duplicateCount > 0) {
         notificationController.show({
           message: `Skipped ${duplicateCount} duplicate picture${duplicateCount > 1 ? 's' : ''}`,

web/src/lib/stores/upload.ts

@@ -4,6 +4,7 @@ import type { UploadAsset } from '../models/upload-asset';
 function createUploadStore() {
   const uploadAssets = writable<Array<UploadAsset>>([]);
   const duplicateCounter = writable(0);
+  const errorCounter = writable(0);
 
   const { subscribe } = uploadAssets;
 
@@ -36,6 +37,7 @@ function createUploadStore() {
 
   return {
     subscribe,
+    errorCounter,
     duplicateCounter,
     isUploading,
     addNewUploadAsset,

web/src/lib/utils/file-uploader.ts

@@ -173,6 +173,8 @@ async function fileUploader(
 }
 
 function handleUploadError(asset: File, respBody = '{}', extraMessage?: string) {
+  uploadAssetsStore.errorCounter.update((count) => count + 1);
+
   try {
     const res = JSON.parse(respBody);