Merge pull request #22 from CodeChefVIT/staging

NishantGupt786 · web-flow · commit f7770f69129d · 2024-10-12T15:59:45.000+05:30
Staging
diff --git a/src/app/api/mail/route.ts b/src/app/api/mail/route.ts
@@ -1,5 +1,6 @@
 import { NextResponse } from "next/server";
 import nodemailer from "nodemailer";
+import path from "path";
 
 type MailOptions = {
   from: string;
@@ -14,58 +15,31 @@ type MailOptions = {
   }[];
 };
 
-const RATE_LIMIT_WINDOW_MS = 60 * 60 * 1000;
-const RATE_LIMIT_MAX_REQUESTS = 3;
-
-const rateLimitStore: Record<string, { count: number; lastRequest: number }> =
-  {};
-function isRateLimited(ip: string) {
-  const currentTime = Date.now();
-  const record = rateLimitStore[ip];
-
-  if (record) {
-    if (currentTime - record.lastRequest > RATE_LIMIT_WINDOW_MS) {
-      rateLimitStore[ip] = { count: 1, lastRequest: currentTime };
-      return false;
-    } else {
-      if (record.count >= RATE_LIMIT_MAX_REQUESTS) {
-        return true;
-      } else {
-        record.count++;
-        record.lastRequest = currentTime;
-        return false;
-      }
-    }
-  } else {
-    rateLimitStore[ip] = { count: 1, lastRequest: currentTime };
-    return false;
-  }
-}
+const ALLOWED_MIME_TYPES = [
+  "application/pdf",
+  "image/jpeg",
+  "image/png",
+  "image/gif",
+];
+const MAX_FILE_SIZE_MB = 5;
+const ALLOWED_EXTENSIONS = [".pdf", ".jpg", ".jpeg", ".png", ".gif"];
 
 export async function POST(request: Request) {
   try {
     const formData = await request.formData();
 
     const ip =
-      request.headers.get("x-real-ip") ?? 
-      request.headers.get("x-forwarded-for") ?? 
+      request.headers.get("x-real-ip") ??
+      request.headers.get("x-forwarded-for") ??
       request.headers.get("remote-addr");
 
     if (!ip) {
       return NextResponse.json(
-        { message: "IP address not found" }, 
-        { status: 400 },
+        { message: "IP address not found" },
+        { status: 400 }
       );
     }
 
-    // Uncomment to enable rate-limiter
-    // if (isRateLimited(ip)) {
-    //   return NextResponse.json(
-    //     { message: "Too many requests. Please try again later." },
-    //     { status: 429 },
-    //   );
-    // }
-
     const transporter = nodemailer.createTransport({
       host: process.env.EMAIL_HOST,
       port: parseInt(process!.env.EMAIL_PORT as string),
@@ -76,11 +50,10 @@ export async function POST(request: Request) {
       },
     });
 
-    const zipFile = formData.get("zipFile");
-    const slot = formData.get("slot")?.toString() ?? '';
-    const subject = formData.get("subject")?.toString() ?? '';
-    const exam = formData.get("exam")?.toString() ?? '';
-    const year = formData.get("year")?.toString() ?? '';
+    const slot = formData.get("slot")?.toString() ?? "";
+    const subject = formData.get("subject")?.toString() ?? "";
+    const exam = formData.get("exam")?.toString() ?? "";
+    const year = formData.get("year")?.toString() ?? "";
 
     const htmlContent = `
       <div style="font-family: Arial, sans-serif; line-height: 1.5;">
@@ -92,32 +65,53 @@ export async function POST(request: Request) {
       </div>
     `;
 
+    const attachments: { filename: string; content: Buffer }[] = [];
+    const files = formData.getAll("files");
+
+    for (const file of files) {
+      if (file instanceof Blob) {
+        const fileType = file.type;
+        const fileName = (file as any).name;
+        const fileExtension = path.extname(fileName).toLowerCase();
+        const fileSizeMB = file.size / (1024 * 1024);
+
+        if (!ALLOWED_MIME_TYPES.includes(fileType) || !ALLOWED_EXTENSIONS.includes(fileExtension)) {
+          return NextResponse.json(
+            { message: `File type not allowed: ${fileType}` },
+            { status: 400 }
+          );
+        }
+
+        if (fileSizeMB > MAX_FILE_SIZE_MB) {
+          return NextResponse.json(
+            { message: `File ${fileName} exceeds the 5MB size limit` },
+            { status: 400 }
+          );
+        }
+
+        const buffer = await file.arrayBuffer();
+        attachments.push({
+          filename: fileName,
+          content: Buffer.from(buffer),
+        });
+      }
+    }
+
     const mailOptions: MailOptions = {
       from: process.env.EMAIL_USER!,
       to: process.env.EMAIL_USER!,
       subject: subject,
       html: htmlContent,
-      attachments: [],
+      attachments,
     };
 
-    if (zipFile instanceof Blob) {
-      const buffer = await zipFile.arrayBuffer();
-      const content = Buffer.from(buffer);
-
-      mailOptions.attachments!.push({
-        filename: "files.zip",
-        content: content,
-      });
-    }
-
     await transporter.sendMail(mailOptions);
 
     return NextResponse.json({ message: "Email sent successfully!" }, { status: 200 });
   } catch (error) {
     return NextResponse.json(
       { message: "Error sending email", error: error },
-      { status: 422 },
+      { status: 422 }
     );
   }
 }
-
diff --git a/src/app/upload/page.tsx b/src/app/upload/page.tsx
@@ -1,6 +1,5 @@
 "use client";
 import React, { useRef, useState } from "react";
-import JSZip from "jszip";
 import axios from "axios";
 import { slots, courses } from "./select_options";
 import toast, { Toaster } from "react-hot-toast";
@@ -31,7 +30,6 @@ import Footer from "@/components/Footer";
 
 const Page = () => {
   const router = useRouter();
-  // const [openCamera, setOpenCamera] = useState(false);
   const fileInputRef = useRef<HTMLInputElement>(null);
 
   const [slot, setSlot] = useState("");
@@ -40,45 +38,61 @@ const Page = () => {
   const [year, setYear] = useState("");
   const [files, setFiles] = useState<File[]>([]);
   const [inputValue, setInputValue] = useState('')
-
   const [isSubjectCommandOpen, setIsSubjectCommandOpen] = useState(false);
-  // const toggleOpenCamera = () => {
-  //   setOpenCamera((prev) => !prev);
-  // };
+  const [isUploading, setIsUploading] = useState(false);
 
   const handlePrint = async () => {
-    // file validation
     const maxFileSize = 5 * 1024 * 1024;
+    const allowedFileTypes = ["application/pdf", "image/jpeg", "image/png", "image/gif"];
     const files = fileInputRef.current?.files as FileList | null;
-    if (!files || files.length == 0) {
+  
+    if (!slot) {
+      toast.error("Slot is required");
+      return;
+    }
+    if (!subject) {
+      toast.error("Subject is required");
+      return;
+    }
+    if (!exam) {
+      toast.error("Exam is required");
+      return;
+    }
+    if (!year) {
+      toast.error("Year is required");
+      return;
+    }
+    if (!files || files.length === 0) {
       toast.error("No files selected");
       return;
     } else if (files.length > 5) {
       toast.error("More than 5 files selected");
       return;
     }
+  
     for (const file of files) {
       if (file.size > maxFileSize) {
         toast.error(`File ${file.name} is more than 5MB`);
         return;
       }
+  
+      if (!allowedFileTypes.includes(file.type)) {
+        toast.error(`File type of ${file.name} is not allowed. Only PDFs and images are accepted.`);
+        return;
+      }
     }
-    const zip = new JSZip();
+  
     const formData = new FormData();
-
     for (const file of files) {
-      zip.file(file.name, file);
-      const content = await zip.generateAsync({ type: "blob" });
-
-      const arrayBuffer = await new Response(content).arrayBuffer();
-      const uint8Array = new Uint8Array(arrayBuffer);
-
-      formData.append("zipFile", new Blob([uint8Array]), "files.zip");
-      formData.append("slot", slot);
-      formData.append("subject", subject);
-      formData.append("exam", exam);
-      formData.append("year", year);
+      formData.append("files", file);
     }
+    formData.append("slot", slot);
+    formData.append("subject", subject);
+    formData.append("exam", exam);
+    formData.append("year", year);
+  
+    setIsUploading(true); // Set uploading to true
+
     try {
       const result = await toast.promise(
         (async () => {
@@ -90,28 +104,28 @@ const Page = () => {
                 headers: {
                   "Content-Type": "multipart/form-data",
                 },
-              },
+              }
             );
             return response.data;
           } catch (error) {
-            handleAPIError(error);
+            throw handleAPIError(error);
           }
         })(),
         {
           loading: "Sending papers",
           success: "Papers successfully sent",
           error: (err: ApiError) => err.message,
-        },
+        }
       );
+
       if (result?.message === "Email sent successfully!") {
-        setTimeout(() => {
-          router.push("/");
-        }, 1500);
       }
     } catch (e) {
+    } finally {
+      setIsUploading(false);
     }
   };
-
+  
   const handleSubjectSelect = (value: string) => {
     setSubject(value);
     setInputValue(value)
@@ -169,30 +183,6 @@ const Page = () => {
             {/* Subject Selection */}
             <div>
               <label>Subject:</label>
-              {/* <div className="relative">
-                <Button
-                  type="button"
-                  onClick={() => setIsSubjectCommandOpen((prev) => !prev)}
-                  className="m-2 rounded-md border p-2"
-                >
-                  {subject || "Select subject"}
-                </Button>
-                {isSubjectCommandOpen && (
-                  <Command className="absolute z-10 mt-2 w-full rounded-lg border shadow-md">
-                    <CommandInput placeholder="Search subject..." />
-                    <CommandList>
-                      <CommandEmpty>No subjects found.</CommandEmpty>
-                      <CommandGroup heading="Subjects">
-                        {courses.map((course) => (
-                          <CommandItem key={course} onSelect={() => handleSubjectSelect(course)}>
-                            <span>{course}</span>
-                          </CommandItem>
-                        ))}
-                      </CommandGroup>
-                    </CommandList>
-                  </Command>
-                )}
-              </div> */}
               <Command className="rounded-lg border shadow-md md:min-w-[450px]">
                 <CommandInput 
                 value={inputValue} 
@@ -249,7 +239,7 @@ const Page = () => {
               <Input
                 required
                 type="file"
-                accept="image/*,.pdf"
+                // accept="image/*,.pdf"
                 multiple
                 ref={fileInputRef}
                 className="hidden"
@@ -261,7 +251,7 @@ const Page = () => {
               <div>
                 <Button
                   type="button"
-                  onClick={() => fileInputRef.current?.click()} // Trigger file input on button click
+                  onClick={() => fileInputRef.current?.click()}
                   className="rounded-md px-4 py-2 transition"
                 >
                   Choose files
@@ -277,9 +267,10 @@ const Page = () => {
         </fieldset>
         <Button
           onClick={handlePrint}
-          className="w-fit rounded-md px-4 py-3"
+          disabled={isUploading}
+          className={`w-fit rounded-md px-4 py-3 ${isUploading ? "bg-gray-300" : ""}`}
         >
-          Upload Papers
+          {isUploading ? "Uploading..." : "Upload Papers"}
         </Button>
       </div>
       <div className="">
diff --git a/src/components/Footer.tsx b/src/components/Footer.tsx
@@ -58,7 +58,7 @@ export default function Footer() {
             width={24}
           />
         </Link>
-        <Link href="https://x.com/codechefvit">
+        <Link href="https://x.com/codechefvit" className="pb-1.5">
           <Image
             src={isDarkMode ? x_twitter_icon_dark : x_twitter_icon}
             alt="x_twitter_icon"
