fix: improve failed upload error handling

frontend/src/components/upload/UploadProgressIndicator.tsx

@@ -1,6 +1,5 @@
 import { RingProgress } from "@mantine/core";
-import { TbCircleCheck, TbCircleX } from "react-icons/tb";;
+import { TbCircleCheck, TbCircleX } from "react-icons/tb";
-
 const UploadProgressIndicator = ({ progress }: { progress: number }) => {
   if (progress > 0 && progress < 100) {
     return (
@@ -10,7 +9,7 @@ const UploadProgressIndicator = ({ progress }: { progress: number }) => {
         size={25}
       />
     );
-  } else if (progress == 100) {
+  } else if (progress >= 100) {
     return <TbCircleCheck color="green" size={22} />;
   } else {
     return <TbCircleX color="red" size={22} />;

frontend/src/pages/upload.tsx

@@ -56,11 +56,25 @@ const Upload = () => {
           files[i].uploadingProgress = -1;
         }
 
-        if (!files.some((f) => f.uploadingProgress != 100)) {
+        if (
-          await shareService.completeShare(share.id);
+          files.every(
+            (file) =>
+              file.uploadingProgress >= 100 || file.uploadingProgress == -1
+          )
+        ) {
+          const fileErrorCount = files.filter(
+            (file) => file.uploadingProgress == -1
+          ).length;
           setisUploading(false);
-          showCompletedUploadModal(modals, share);
+          if (fileErrorCount > 0) {
-          setFiles([]);
+            toast.error(
+              `${fileErrorCount} file(s) failed to upload. Try again.`
+            );
+          } else {
+            await shareService.completeShare(share.id);
+            showCompletedUploadModal(modals, share);
+            setFiles([]);
+          }
         }
       }
     } catch (e) {

frontend/src/services/share.service.ts

@@ -72,7 +72,7 @@ const uploadFile = async (
   file: File,
   progressCallBack: (uploadingProgress: number) => void
 ) => {
-  var formData = new FormData();
+  let formData = new FormData();
   formData.append("file", file);
 
   return (