Staging

src/app/(login)/component/LoginForm.tsx

@@ -29,16 +29,16 @@ export default function LoginForm() {
     });
 
     if (status?.ok) {
-      toast.success("Logged in successfully");
+      toast.success("Berhasil Login");
       router.push("/assignment");
     }
   };
 
   return (
-    <div className="login-container flex h-screen items-center justify-center">
-      <div className="login-box text-center">
+    <div className="flex h-screen items-center justify-center">
+      <div className="w-full max-w-md text-center">
         <div className="flex flex-col items-center">
-          <div className="flex justify-center">
+          <div className="flex -scale-y-100 justify-center">
             <Image
               src="/img/oskmlogo.png"
               alt="OSKM Logo"
@@ -47,32 +47,26 @@ export default function LoginForm() {
             />
           </div>
           <h1
-            className="
-              text-shadow:
-              0
-              0
-              10px
-              #0010A4 mt-[-20px] font-mogula text-[42px] font-normal
-              text-[#0010A4]"
+            className="font-mogula text-[42px] font-normal text-[#0010A4]"
           >
             LOGIN
           </h1>
         </div>
-        <div className="mx-6 mt-4 flex flex-col items-start">
+        <div className="mt-4 flex w-full flex-col items-start">
           <p className="font-REM mb-1 mt-[-15px] text-sm font-normal text-[#0010A4]">
             NIM <span className="text-[#DC2522]">*</span>
           </p>
           <div className="mb-4 w-full">
             <label htmlFor="Email" className="font-REM sr-only">
               Nim
             </label>
-            <div className="flex items-center rounded-lg border border-[#9EA2AD] bg-white px-11 py-2">
+            <div className="flex items-center rounded-lg border border-[#9EA2AD] bg-white">
               <input
                 id="Nim"
                 type="text"
                 value={nim}
                 onChange={(v) => setNim(v.target.value)}
-                className="font-REM h-full w-full bg-white pl-3 pr-3 text-sm text-black placeholder-gray-500 focus:outline-none"
+                className="h-full w-full rounded-lg bg-white py-2 pl-3 pr-3 text-sm text-black placeholder-gray-500 focus:outline-none"
                 placeholder="Masukkan NIM Anda"
               />
             </div>
@@ -85,13 +79,13 @@ export default function LoginForm() {
             <label htmlFor="Kata Sandi" className="font-REM sr-only">
               Kata Sandi
             </label>
-            <div className="flex items-center rounded-lg border border-[#9EA2AD] bg-white px-11 py-2">
+            <div className="flex items-center rounded-lg border border-[#9EA2AD] bg-white">
               <input
                 id="Kata Sandi"
                 type={showPassword ? "text" : "password"}
                 value={password}
                 onChange={(v) => setPassword(v.target.value)}
-                className="font-REM h-full w-full bg-white pl-3 pr-10 text-sm text-black placeholder-gray-500 focus:outline-none"
+                className="font-REM h-full w-full rounded-lg bg-white py-2 pl-3 pr-10 text-sm text-black placeholder-gray-500 focus:outline-none"
                 placeholder="Masukkan Sandi Anda"
               />
               <button

src/app/(sidebar)/assignment/components/MametAddAssignment.tsx

@@ -8,6 +8,7 @@ import { api } from "~/trpc/react";
 import { useRouter } from "next/navigation";
 import type { AssignmentType } from "@katitb2024/database";
 import { FolderEnum } from "~/server/bucket";
+import toast from "react-hot-toast";
 
 export interface AssignmentInsertion {
   judul: string;
@@ -62,12 +63,10 @@ export default function MametAddAssignment() {
     const selectedFile = e.target?.files?.[0];
     if (selectedFile) {
       if (!ALLOWED_FORMATS.includes(selectedFile.type)) {
-        alert(
-          "Invalid file format. Please select a JPEG, PNG, PDF, or DOCX file.",
-        );
+        toast.error("Format file tidak sesuai");
         setFile(null);
       } else if (selectedFile.size > MAX_FILE_SIZE) {
-        alert("File is too large. Maximum size is 20 MB.");
+        toast.error("Ukuran file terlalu besar");
         setFile(null);
       } else {
         setFile(selectedFile);
@@ -94,7 +93,7 @@ export default function MametAddAssignment() {
       });
       router.push("/assignment");
     } catch (err) {
-      alert("Error creating assignment. Please try again.");
+      toast.error("Gagal membuat tugas");
       console.error("Error creating assignment:", err);
     } finally {
       setIsLoading(false);
@@ -119,14 +118,16 @@ export default function MametAddAssignment() {
       for (const [key, value] of Object.entries(field)) {
         if (!value) {
           if (key === "Poin" && assignmentType === "Main") continue;
-          alert(`Kolom ${key} harus diisi`);
+          toast.error(`Kolom ${key} harus diisi`);
           return;
         } else {
           if (
             key === "Waktu Selesai" &&
             setTime(startTime, jamMulai) >= setTime(deadline, jamSelesai)
           ) {
-            alert("Waktu selesai tidak boleh lebih kecil dari waktu mulai");
+            toast.error(
+              "Waktu selesai tidak boleh lebih kecil dari waktu mulai",
+            );
             return;
           }
         }
@@ -153,7 +154,7 @@ export default function MametAddAssignment() {
         await createAssignment();
       }
     } catch (err) {
-      alert("Error submitting assignment. Please try again.");
+      toast.error("Gagal submit tugas");
       console.error("Error submitting assignment:", err);
     }
   };

src/app/(sidebar)/assignment/components/MametEditAssignment.tsx

@@ -10,6 +10,7 @@ import { MdUpload } from "react-icons/md";
 import { api } from "~/trpc/react";
 import type { AssignmentType } from "@katitb2024/database";
 import { FolderEnum } from "~/server/bucket";
+import toast from "react-hot-toast";
 
 interface MametEditAssignmentProps {
   assignment: {
@@ -81,12 +82,12 @@ export default function MametEditAssignment({
     const selectedFile = e.target?.files?.[0];
     if (selectedFile) {
       if (!ALLOWED_FORMATS.includes(selectedFile.type)) {
-        alert(
-          "Invalid file format. Please select a JPEG, PNG, PDF, or DOCX file.",
+        toast.error(
+          "Format file tidak didukung. Silahkan upload file dengan format JPEG, PNG, PDF, atau DOCX.",
         );
         setFile(null);
       } else if (selectedFile.size > MAX_FILE_SIZE) {
-        alert("File is too large. Maximum size is 20 MB.");
+        toast.error("Ukuran file terlalu besar. Maksimum 20 MB.");
         setFile(null);
       } else {
         setFile(selectedFile);
@@ -96,24 +97,23 @@ export default function MametEditAssignment({
   };
 
   const updateAssignment = async (
-    filename?: string | undefined,
-    presignedUrl?: string | undefined,
+    filename?: string | null,
+    presignedUrl?: string | null,
   ) => {
     try {
-      const newFilename = filename ?? "existFile;";
       await editAssignmentMutation.mutateAsync({
         id: assignment.assignmentId,
-        filename: newFilename ?? existFile,
+        filename: filename ?? "",
         title: judul,
         description: deskripsi,
         startTime: setTime(waktuMulai, jamMulai),
         deadline: setTime(waktuSelesai, jamSelesai),
         point,
-        downloadUrl: presignedUrl ?? assignment.downloadUrl,
+        downloadUrl: presignedUrl ?? "",
       });
       router.push("/assignment");
     } catch (err) {
-      alert("Error updating assignment. Please try again.");
+      toast.error("Gagal mengupdate tugas. Silahkan coba lagi.");
       console.error("Error updating assignment", err);
     } finally {
       setIsLoading(false);
@@ -127,7 +127,7 @@ export default function MametEditAssignment({
     setIsLoading(true);
 
     if (setTime(waktuSelesai, jamSelesai) <= setTime(waktuMulai, jamMulai)) {
-      alert("Waktu selesai tidak boleh lebih awal dari waktu mulai.");
+      toast.error("Waktu selesai tidak boleh lebih awal dari waktu mulai.");
       setIsLoading(false);
       return;
     }
@@ -150,10 +150,10 @@ export default function MametEditAssignment({
         };
         reader.readAsDataURL(file);
       } else {
-        await updateAssignment();
+        await updateAssignment(existFile ? existFile : null, existFile ? assignment.downloadUrl : null);
       }
     } catch (err) {
-      alert("Error updating assignment. Please try again.");
+      toast.error("Gagal mengupdate tugas. Silahkan coba lagi.");
       console.error("Error updating assignment:", err);
     }
   };
@@ -264,9 +264,8 @@ export default function MametEditAssignment({
             <p className="text-xs text-gray-500">Maximum file size 20 MB</p>
           </div>
           <div
-            className={`my-3 flex w-1/3 items-center justify-between gap-2 rounded-sm border-2 border-[#0010A4] px-4 py-2 text-xs font-bold text-[#0010A4]  ${
-              (file ?? existFile) ? "block" : "hidden"
-            }`}
+            className={`my-3 flex w-1/3 items-center justify-between gap-2 rounded-sm border-2 border-[#0010A4] px-4 py-2 text-xs font-bold text-[#0010A4]  ${(file ?? existFile) ? "block" : "hidden"
+              }`}
           >
             <input
               id="file-upload"

src/app/(sidebar)/assignment/components/MametListAssignment.tsx

@@ -4,7 +4,6 @@ import Link from "next/link";
 import { api } from "~/trpc/react";
 import { useRouter } from "next/navigation";
 import { saveAs } from "file-saver";
-import { downloadFile } from "~/utils/fileUtils";
 
 import {
   Table,
@@ -16,12 +15,12 @@ import {
 } from "~/components/ui/table";
 import { Button } from "~/components/ui/button";
 import { RiPencilFill } from "react-icons/ri";
-import { MdDelete } from "react-icons/md";
-import { MdDownload } from "react-icons/md";
+import { MdDelete, MdDownload } from "react-icons/md";
 import Search from "./Search";
 import Pagination from "./Pagination";
 import ConfirmationModal from "./ConfirmationModal";
 import { dateWIB } from "~/utils/timeUtils";
+import toast from "react-hot-toast";
 
 interface MametAssignmentListProps {
   assignments: {
@@ -45,12 +44,23 @@ export default function MametListAssignment({
 }: MametAssignmentListProps) {
   const assignmentDeleteMutation =
     api.assignment.deleteAssignmentMamet.useMutation();
+  const assignmentCsvMutation =
+    api.assignment.getSpecificAssignmentCsv.useMutation();
   const router = useRouter();
 
-  const handleDownload = async (downloadUrl: string, judulTugas: string) => {
-    if (downloadUrl) {
-      const fileBlob = await downloadFile(downloadUrl);
-      saveAs(fileBlob, judulTugas);
+  const handleDownloadCsv = async (assignmentId: string) => {
+    try {
+      const response = await assignmentCsvMutation.mutateAsync({
+        assignmentId,
+      });
+
+      const { fileName, mimeType, content } = response;
+
+      const blob = new Blob([content], { type: mimeType });
+      saveAs(blob, fileName);
+    } catch (error) {
+      console.error("Error downloading CSV:", error);
+      toast.error("Failed to download CSV.");
     }
   };
 
@@ -59,10 +69,10 @@ export default function MametListAssignment({
       await assignmentDeleteMutation.mutateAsync({
         assignmentId,
       });
-      alert("Assignment deleted successfully");
+      toast.success("Berhasil Menghapus Tugas");
       router.refresh();
     } catch (err) {
-      alert("Error deleting assignment");
+      toast.error("Gagal Menghapus Tugas");
       console.error("Error deleting assignment : ", err);
     }
   };
@@ -158,10 +168,7 @@ export default function MametListAssignment({
                       </Button>
                       <Button
                         className={`bg-transparent text-2xl hover:bg-transparent`}
-                        onClick={() =>
-                          handleDownload(item.downloadUrl, item.judulTugas)
-                        }
-                        disabled={!item.downloadUrl}
+                        onClick={() => handleDownloadCsv(item.assignmentId)}
                       >
                         <MdDownload className="text-[#3678FF]" />
                       </Button>