Mintplex-Labs · timothycarambat · Aug 23, 2023 · Aug 22, 2023 · Aug 22, 2023 · Aug 22, 2023
diff --git a/frontend/src/components/Modals/MangeWorkspace/Upload/FileUploadProgress/index.jsx b/frontend/src/components/Modals/MangeWorkspace/Upload/FileUploadProgress/index.jsx
@@ -10,6 +10,8 @@ function FileUploadProgressComponent({
   file,
   rejected = false,
   reason = null,
+  onUploadSuccess,
+  onUploadError,
 }) {
   const [timerMs, setTimerMs] = useState(10);
   const [status, setStatus] = useState(file?.rejected ? "uploading" : "failed");
@@ -24,9 +26,16 @@ function FileUploadProgressComponent({
       }, 100);
 
       // Chunk streaming not working in production so we just sit and wait
-      await Workspace.uploadFile(slug, formData);
-      setStatus("complete");
-      clearInterval(timer);
+      const { response, data } = await Workspace.uploadFile(slug, formData);
+      if (!response.ok) {
+        setStatus("failed");
+        clearInterval(timer);
+        onUploadError(data.error);
+      } else {
+        setStatus("complete");
+        clearInterval(timer);
+        onUploadSuccess();
+      }
     }
     !!file && !rejected && uploadFile();
   }, []);

diff --git a/frontend/src/components/Modals/MangeWorkspace/Upload/index.jsx b/frontend/src/components/Modals/MangeWorkspace/Upload/index.jsx
@@ -10,6 +10,19 @@ import { Frown } from "react-feather";
 export default function UploadToWorkspace({ workspace, fileTypes }) {
   const [ready, setReady] = useState(null);
   const [files, setFiles] = useState([]);
+  const [successMsg, setSuccessMsg] = useState("");
+  const [errorMsg, setErrorMsg] = useState("");
+
+  const handleUploadSuccess = () => {
+    setSuccessMsg("File uploaded successfully");
+    setErrorMsg(null);
+  };
+
+  const handleUploadError = (message) => {
+    setErrorMsg(`Upload failed: ${message}`);
+    setSuccessMsg(null);
+  };
+
   const onDrop = useCallback(async (acceptedFiles, rejections) => {
     const newAccepted = acceptedFiles.map((file) => {
       return {
@@ -37,6 +50,20 @@ export default function UploadToWorkspace({ workspace, fileTypes }) {
     checkProcessorOnline();
   }, []);
 
+  useEffect(() => {
+    if (!!successMsg) {
+      setTimeout(() => {
+        setSuccessMsg("");
+      }, 3_500);
+    }
+
+    if (!!errorMsg) {
+      setTimeout(() => {
+        setErrorMsg("");
+      }, 3_500);
+    }
+  }, [successMsg, errorMsg]);
+
   const { getRootProps, getInputProps } = useDropzone({
     onDrop,
     accept: {
@@ -133,6 +160,8 @@ export default function UploadToWorkspace({ workspace, fileTypes }) {
                 slug={workspace.slug}
                 rejected={file?.rejected}
                 reason={file?.reason}
+                onUploadSuccess={handleUploadSuccess}
+                onUploadError={handleUploadError}
               />
             ))}
           </div>
@@ -144,6 +173,16 @@ export default function UploadToWorkspace({ workspace, fileTypes }) {
           {Object.values(fileTypes).flat().join(" ")}
         </code>
       </p>
+      {successMsg && (
+        <p className="text-green-600 dark:text-green-400 text-sm text-center pt-2">
+          {successMsg}
+        </p>
+      )}
+      {errorMsg && (
+        <p className="text-red-600 dark:text-red-400 text-sm text-center pt-2">
+          {errorMsg}
+        </p>
+      )}
     </ModalWrapper>
   );
 }

diff --git a/frontend/src/models/workspace.js b/frontend/src/models/workspace.js
@@ -107,7 +107,9 @@ const Workspace = {
       body: formData,
       headers: baseHeaders(),
     });
-    return response;
+
+    const data = await response.json();
+    return { response, data };
   },
 };
 

diff --git a/server/endpoints/workspaces.js b/server/endpoints/workspaces.js
@@ -6,9 +6,6 @@ const { WorkspaceChats } = require("../models/workspaceChats");
 const { convertToChatHistory } = require("../utils/chats");
 const { getVectorDbClass } = require("../utils/helpers");
 const { setupMulter } = require("../utils/files/multer");
-const {
-  fileUploadProgress,
-} = require("../utils/middleware/fileUploadProgress");
 const {
   checkPythonAppAlive,
   processDocument,
@@ -69,32 +66,31 @@ function workspaceEndpoints(app) {
 
   app.post(
     "/workspace/:slug/upload",
-    fileUploadProgress,
     handleUploads.single("file"),
-    async function (request, _) {
+    async function (request, response) {
       const { originalname } = request.file;
       const processingOnline = await checkPythonAppAlive();
 
       if (!processingOnline) {
-        console.log(
-          `Python processing API is not online. Document ${originalname} will not be processed automatically.`
-        );
-        return;
+        response
+          .status(500)
+          .json({
+            success: false,
+            error: `Python processing API is not online. Document ${originalname} will not be processed automatically.`,
+          })
+          .end();
       }
 
       const { success, reason } = await processDocument(originalname);
       if (!success) {
-        console.log(
-          `Python processing API was not able to process document ${originalname}. Reason: ${reason}`
-        );
-        return false;
+        response.status(500).json({ success: false, error: reason }).end();
       }
 
       console.log(
         `Document ${originalname} uploaded processed and successfully. It is now available in documents.`
       );
       await Telemetry.sendTelemetry("document_uploaded");
-      return;
+      response.status(200).json({ success: true, error: null });
     }
   );
 

diff --git a/server/utils/middleware/fileUploadProgress.js b/server/utils/middleware/fileUploadProgress.js