feat: upload 3 files at same time

backend/src/prisma/prisma.service.ts

@@ -1,5 +1,4 @@
 import { Injectable } from "@nestjs/common";
-import { ConfigService } from "@nestjs/config";
 import { PrismaClient } from "@prisma/client";
 
 @Injectable()
@@ -8,7 +7,7 @@ export class PrismaService extends PrismaClient {
     super({
       datasources: {
         db: {
-          url: "file:../data/pingvin-share.db",
+          url: "file:../data/pingvin-share.db?connection_limit=1",
         },
       },
     });

frontend/package.json

@@ -27,6 +27,7 @@
     "next-cookies": "^2.0.3",
     "next-http-proxy-middleware": "^1.2.5",
     "next-pwa": "^5.6.0",
+    "p-limit": "^4.0.0",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "react-icons": "^4.7.1",

frontend/src/pages/upload.tsx

@@ -2,6 +2,7 @@ import { Button, Group } from "@mantine/core";
 import { useModals } from "@mantine/modals";
 import axios from "axios";
 import { useRouter } from "next/router";
+import pLimit from "p-limit";
 import { useEffect, useState } from "react";
 import Meta from "../components/Meta";
 import Dropzone from "../components/upload/Dropzone";
@@ -12,10 +13,11 @@ import useConfig from "../hooks/config.hook";
 import useUser from "../hooks/user.hook";
 import shareService from "../services/share.service";
 import { FileUpload } from "../types/File.type";
-import { ShareSecurity } from "../types/share.type";
+import { Share, ShareSecurity } from "../types/share.type";
 import toast from "../utils/toast.util";
 
-let share: any;
+let share: Share;
+const promiseLimit = pLimit(3);
 
 const Upload = () => {
   const router = useRouter();
@@ -41,7 +43,8 @@ const Upload = () => {
         })
       );
       share = await shareService.create(id, expiration, recipients, security);
-      for (let i = 0; i < files.length; i++) {
+      const uploadPromises = files.map((file, i) => {
+        // Callback to indicate current upload progress
         const progressCallBack = (progress: number) => {
           setFiles((files) => {
             return files.map((file, callbackIndex) => {
@@ -54,11 +57,15 @@ const Upload = () => {
         };
 
         try {
-          await shareService.uploadFile(share.id, files[i], progressCallBack);
+          return promiseLimit(() =>
+            shareService.uploadFile(share.id, file, progressCallBack)
+          );
         } catch {
-          files[i].uploadingProgress = -1;
+          file.uploadingProgress = -1;
         }
-      }
+      });
+
+      await Promise.all(uploadPromises);
     } catch (e) {
       if (axios.isAxiosError(e)) {
         toast.error(e.response?.data?.message ?? "An unkown error occured.");