From de3343e12046a5a65630b8045d02ac5527dea81a Mon Sep 17 00:00:00 2001
From: ZacTohZY <zactoh0503@gmail.com>
Date: Tue, 13 Aug 2024 13:59:55 +0800
Subject: [PATCH] Update UserVoucher

---
 client/src/pages/UserVouchersPage.tsx | 13 +++++++++----
 1 file changed, 9 insertions(+), 4 deletions(-)

diff --git a/client/src/pages/UserVouchersPage.tsx b/client/src/pages/UserVouchersPage.tsx
index d9628d2..47fcf2b 100644
--- a/client/src/pages/UserVouchersPage.tsx
+++ b/client/src/pages/UserVouchersPage.tsx
@@ -117,8 +117,14 @@ export default function UserVoucherPage() {
     };
 
     const handleConfirm = async () => {
-        if (selectedUserVoucherId) {
+        if (selectedUserVoucherId && selectedVoucher) {
             try {
+                // Copy the voucher code to the clipboard
+                await navigator.clipboard.writeText(selectedVoucher.code);
+
+                // Show an alert to the user
+                alert(`Voucher code "${selectedVoucher.code}" copied to clipboard!`);
+
                 // DELETE request to remove the voucher from the user-vouchers
                 await instance.delete(
                     `${config.serverAddress}/user-vouchers/${selectedUserVoucherId}`
@@ -132,8 +138,8 @@ export default function UserVoucherPage() {
                 setSelectedUserVoucherId(null);
                 setIsModalOpen(false);
             } catch (error) {
-                console.error("Failed to delete voucher", error);
-                setError("Failed to delete voucher");
+                console.error("Failed to delete voucher or copy code", error);
+                setError("Failed to delete voucher or copy code");
             }
         }
     };
@@ -216,7 +222,6 @@ export default function UserVoucherPage() {
                             {selectedVoucher && (
                                 <>
                                     <p className="font-semibold">Brand: {selectedVoucher.brand}</p>
-                                    <p className="font-semibold">Code: {selectedVoucher.code}</p>
                                 </>
                             )}
                         </div>