From 1de743a40452c1260baa2505e1d6fb1c61b25126 Mon Sep 17 00:00:00 2001
From: ValdiANS <rvdans002@gmail.com>
Date: Fri, 28 Nov 2025 10:31:08 +0700
Subject: [PATCH] feat(FE-196,199): create ExpensePDFButton component

---
 .../pages/expense/pdf/ExpensePDFButton.tsx    | 53 +++++++++++++++++++
 1 file changed, 53 insertions(+)
 create mode 100644 src/components/pages/expense/pdf/ExpensePDFButton.tsx

diff --git a/src/components/pages/expense/pdf/ExpensePDFButton.tsx b/src/components/pages/expense/pdf/ExpensePDFButton.tsx
new file mode 100644
index 00000000..fe062c25
--- /dev/null
+++ b/src/components/pages/expense/pdf/ExpensePDFButton.tsx
@@ -0,0 +1,53 @@
+'use client';
+
+import { pdf } from '@react-pdf/renderer';
+
+import Button from '@/components/Button';
+import { Icon } from '@iconify/react';
+import ExpensePDF from '@/components/pages/expense/pdf/ExpensePDF';
+
+import { Expense } from '@/types/api/expense';
+
+interface ExpensePDFPreviewButtonProps {
+  expense?: Expense;
+}
+
+const ExpensePDFPreviewButton = ({ expense }: ExpensePDFPreviewButtonProps) => {
+  const openPdf = async () => {
+    const expensePdfBlob = await pdf(<ExpensePDF expense={expense} />).toBlob();
+
+    const expensePdfUrl = URL.createObjectURL(expensePdfBlob);
+    window.open(expensePdfUrl, '_blank');
+  };
+
+  const downloadPdf = async () => {
+    const blob = await pdf(<ExpensePDF expense={expense} />).toBlob();
+    const url = URL.createObjectURL(blob);
+
+    const link = document.createElement('a');
+    link.href = url;
+    link.download = `${expense?.po_number}.pdf`;
+    link.click();
+
+    URL.revokeObjectURL(url);
+  };
+
+  return (
+    <div className='w-fit flex flex-col'>
+      <Button onClick={downloadPdf} className='text-xs'>
+        <Icon icon='bx:file' width={16} height={16} />
+        {expense?.po_number}
+      </Button>
+
+      <Button
+        onClick={openPdf}
+        variant='link'
+        className='p-0 mt-1 text-xs justify-start'
+      >
+        Lihat Dokumen
+      </Button>
+    </div>
+  );
+};
+
+export default ExpensePDFPreviewButton;