Image upload mostly working

package.json

@@ -11,8 +11,11 @@
   "license": "ISC",
   "dependencies": {
     "archiver": "^6.0.1",
+    "axios": "^1.6.2",
     "create-react-app": "^5.0.1",
+    "multer": "^1.4.5-lts.1",
     "node-stream-zip": "^1.15.0",
+    "react-dropzone": "^14.2.3",
     "react-icons": "^4.12.0",
     "react-modal": "^3.16.1",
     "react-router-dom": "^6.18.0",

packages/backend/backend.js

@@ -2,8 +2,10 @@ import express from "express";
 import cors from "cors";
 import mongoose from 'mongoose';
 import { readFile } from 'fs/promises';
-import * as dotenv from "dotenv";
-import bcrypt from "bcrypt";
+import * as dotenv from 'dotenv';
+import bcrypt from 'bcrypt';
+import multer from 'multer';
+import path from 'path';
 import fs from 'fs';
 import request from 'request-promise';
 import archiver from 'archiver';
@@ -17,7 +19,6 @@ app.use(express.json());
 
 dotenv.config();
 
-// Uncomment the following to debug mongoose queries, etc.
 mongoose.set("debug", true);
 console.log(">>mongo cluster: " + process.env.MONGO_CLUSTER);
 mongoose
@@ -58,14 +59,48 @@ app.get("/receipt", async (req, res) => {
     // Replace 'receipt.json' with the actual path to your JSON file
     try {
         // Read and parse the JSON file using fs/promises
-        const data = await readFile('costcoTest.json', 'utf8');
+        const data = await readFile('main.json', 'utf8');
         const jsonData = JSON.parse(data);
         res.json({ data: jsonData });
     } catch (err) {
         console.error(err);
         res.status(500).json({ error: 'Error reading JSON file' });
     }});
 
+let relativeFilePath;
+
+const storage = multer.diskStorage({
+    destination: function (req, file, cb) {
+        cb(null, './uploads/'); // Save files to the 'uploads/' directory
+    },
+    filename: function (req, file, cb) {
+        const uniqueFileName = Date.now() + '-' + file.originalname;
+        req.uploadedFileName = uniqueFileName;
+        cb(null, uniqueFileName);
+
+        // Store the relative file path when the file is uploaded
+        relativeFilePath = path.join('./uploads', req.uploadedFileName);
+    }
+});
+
+const upload = multer({ storage: storage });
+
+// Handle file upload
+app.post('/upload', upload.single('file'), async (req, res) => {
+    const file = req.file;
+
+    if (!file) {
+        return res.status(400).json({error: 'No file provided'});
+    }
+    const fileDetails = {
+        filename: file.filename,
+        originalname: file.originalname,
+        mimetype: file.mimetype,
+        size: file.size,
+    };
+    res.status(200).json({ message: 'File uploaded successfully', file: fileDetails });
+});
+
 app.post("/register", async (req, res) => {
     const { username, password, email } = req.body;
     try {
@@ -108,8 +143,8 @@ app.post("/login", async (req, res) => {
     }
 });
 
-/*app.get("/process", async (req, res) => {
-    const listFiles = ['receipt1.jpg'];
+app.get("/process", async (req, res) => {
+    const listFiles = [relativeFilePath];
     const zipFilePath = 'receipts.zip';
 
     // Create a writable stream to the ZIP file
@@ -158,12 +193,14 @@ app.post("/login", async (req, res) => {
         try {
             // Send the ZIP file to the Veryfi API
             const response = await request(requestOptions);
+            const responseData = typeof response === 'string' ? JSON.parse(response) : response;
+            fs.writeFileSync('./main.json', JSON.stringify(responseData, null, 2));
             console.log('Response from Veryfi:', response);
         } catch (error) {
             console.error('Error:', error);
         }
     });
-});*/
+});
 
 app.listen(port, () => {
     console.log(`Server is running on port ${port}`);