From ae52635c2c5c2c8cf6d4362e30a6815d0a1102c5 Mon Sep 17 00:00:00 2001
From: Truong Vo <41848815+vmtruong301296@users.noreply.github.com>
Date: Tue, 2 Dec 2025 15:03:00 +0700
Subject: [PATCH] =?UTF-8?q?B=E1=BB=95=20sung=20m=C3=A0u=20m=E1=BB=9Bi=20ch?=
 =?UTF-8?q?o=20n=C3=BAt=20copy=20pid+sn?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 FRONTEND/src/components/CardLine.tsx      |  2 ++
 FRONTEND/src/components/CopyIcon.tsx      | 14 ++++++++++++--
 FRONTEND/src/components/ModalTerminal.tsx |  2 ++
 3 files changed, 16 insertions(+), 2 deletions(-)

diff --git a/FRONTEND/src/components/CardLine.tsx b/FRONTEND/src/components/CardLine.tsx
index 8a22305..06100c9 100644
--- a/FRONTEND/src/components/CardLine.tsx
+++ b/FRONTEND/src/components/CardLine.tsx
@@ -299,6 +299,8 @@ const CardLine = ({
                           value={`${line.inventory?.pid} ${line.inventory?.sn}`}
                           label="Copy PID + SN"
                           copiedLabel="Copied PID + SN"
+                          color="grape"
+                          copiedColor="violet"
                         />
                       )}
                     </div>
diff --git a/FRONTEND/src/components/CopyIcon.tsx b/FRONTEND/src/components/CopyIcon.tsx
index 31a2f94..cd99b07 100644
--- a/FRONTEND/src/components/CopyIcon.tsx
+++ b/FRONTEND/src/components/CopyIcon.tsx
@@ -9,9 +9,19 @@ interface CopyIconProps {
   copiedLabel?: string; // Tooltip khi đã copy, ví dụ: "Copied PID"
   ml?: number;
   mr?: number;
+  color?: string; // màu khi chưa copy
+  copiedColor?: string; // màu khi đã copy
 }
 
-const CopyIcon = ({ value, label, copiedLabel, ml = 4, mr = 0 }: CopyIconProps) => {
+const CopyIcon = ({
+  value,
+  label,
+  copiedLabel,
+  ml = 4,
+  mr = 0,
+  color = "blue",
+  copiedColor = "teal",
+}: CopyIconProps) => {
   const [copied, setCopied] = useState(false);
 
   if (!value) return null;
@@ -31,7 +41,7 @@ const CopyIcon = ({ value, label, copiedLabel, ml = 4, mr = 0 }: CopyIconProps)
       <ActionIcon
         size="xs"
         variant={copied ? "filled" : "light"}
-        color={copied ? "teal" : "blue"}
+        color={copied ? copiedColor : color}
         onClick={handleClick}
         style={{ marginLeft: ml, marginRight: mr }}
       >
diff --git a/FRONTEND/src/components/ModalTerminal.tsx b/FRONTEND/src/components/ModalTerminal.tsx
index d2a1dc5..68b039e 100644
--- a/FRONTEND/src/components/ModalTerminal.tsx
+++ b/FRONTEND/src/components/ModalTerminal.tsx
@@ -547,6 +547,8 @@ const ModalTerminal = ({
                     }
                     label="Copy PID + SN"
                     copiedLabel="Copied PID + SN"
+                    color="grape"
+                    copiedColor="violet"
                   />
                 </Flex>
                 <Flex mt="4px">