upd: pengajuan surat

Deskripsi:
- send wa penolakan + lik update
- send wa diterima
- upload ke seafile
- blm selesai ngirim link surat ke wa

No Issues

src/components/ModalSurat.tsx

@@ -1,10 +1,9 @@
 import apiFetch from "@/lib/apiFetch";
-import { ActionIcon, Flex, Modal } from "@mantine/core";
+import { Flex, Loader, Modal, Text } from "@mantine/core";
 import { useShallowEffect } from "@mantine/hooks";
-import { IconDownload, IconX } from "@tabler/icons-react";
 import html2canvas from "html2canvas";
 import jsPDF from "jspdf";
-import { useRef } from "react";
+import { useRef, useState } from "react";
 import useSWR from "swr";
 import SKBedaBiodataDiri from "./surat/SKBedaBiodataDiri";
 import SKBelumKawin from "./surat/SKBelumKawin";
@@ -36,6 +35,7 @@ export default function ModalSurat({
     fontSize: "14px",
     fontFamily: "Times New Roman",
   };
+  const [uploading, setUploading] = useState<"Menyiapkan" | "Mengupload" | "Selesai">("Menyiapkan")
   const hiddenRef = useRef<any>(null);
   const { data, mutate, isLoading } = useSWR("surat", () =>
     apiFetch.api.surat.detail.get({
@@ -49,29 +49,62 @@ export default function ModalSurat({
     mutate();
   }, []);
 
-  const downloadPDF = async () => {
-    const element = hiddenRef.current;
-    const canvas = await html2canvas(element, {
-      scale: 2,
-      useCORS: true,
-      allowTaint: true,
-      width: element.offsetWidth,
-      height: element.offsetHeight,
-    });
+  const uploadPdf = async () => {
+    try {
+      setUploading("Mengupload");
+      const element = hiddenRef.current;
+      const canvas = await html2canvas(element, {
+        scale: 2,
+        useCORS: true,
+        allowTaint: true,
+        width: element.offsetWidth,
+        height: element.offsetHeight,
+      });
 
-    const imgData = canvas.toDataURL("image/jpeg", 1.0);
+      const imgData = canvas.toDataURL("image/jpeg", 1.0);
 
-    const pdf = new jsPDF("p", "mm", "a4");
-    const pageWidth = 210; // A4 width mm
-    const pageHeight = 297; // A4 height mm
+      const pdf = new jsPDF("p", "mm", "a4");
+      const pageWidth = 210; // A4 width mm
+      const pageHeight = 297; // A4 height mm
 
-    const imgWidth = pageWidth;
-    const imgHeight = (canvas.height * pageWidth) / canvas.width;
+      const imgWidth = pageWidth;
+      const imgHeight = (canvas.height * pageWidth) / canvas.width;
 
-    pdf.addImage(imgData, "JPEG", 0, 0, imgWidth, imgHeight);
+      pdf.addImage(imgData, "JPEG", 0, 0, imgWidth, imgHeight);
 
-    pdf.save(`${data?.data?.surat?.nameCategory}.pdf`);
-  };
+      // ⬇️ ambil sebagai Blob
+      const pdfBlob = pdf.output("blob");
+
+      const pdfFile = new File(
+        [pdfBlob],
+        `${data?.data?.surat?.nameCategory}.pdf`,
+        {
+          type: "application/pdf",
+          lastModified: Date.now(),
+        }
+      );
+
+      const resImg = await apiFetch.api.pengaduan.upload.post({
+        file: pdfFile,
+        folder: "surat",
+      });
+
+      console.log(resImg.data)
+    } catch (error) {
+      console.error("Error uploading PDF:", error);
+    } finally {
+      setUploading("Selesai");
+      setTimeout(() => {
+        onClose();
+      }, 1000)
+    }
+  }
+
+  useShallowEffect(() => {
+    setTimeout(() => {
+      uploadPdf();
+    }, 5000);
+  }, [surat]);
 
   return (
     <>
@@ -97,14 +130,9 @@ export default function ModalSurat({
           <Flex justify="space-between" align="center" w="100%">
             <div style={{ fontSize: 18, fontWeight: 600 }}>Preview Surat</div>
 
-            <Flex gap={8}>
-              <ActionIcon size={32} variant="default">
-                <IconDownload size={20} onClick={downloadPDF} />
-              </ActionIcon>
-
-              <ActionIcon size={32} variant="default" onClick={onClose}>
-                <IconX size={20} />
-              </ActionIcon>
+            <Flex gap={8} align="center">
+              <Loader color="blue" size="xs" />
+              <Text size="sm">{uploading}</Text>
             </Flex>
           </Flex>
         }