From a8d7e839539b28de55b4e0493d8d8323e165f079 Mon Sep 17 00:00:00 2001
From: slsgzs-cloud <slsgzs@gmail.com>
Date: Wed, 9 Sep 2026 11:29:52 +0800
Subject: [PATCH] fix: handle clipboard failure in CopyButton (fixes #172)

---
 web/src/Landing.tsx | 31 +++++++++++++++++++++++--------
 1 file changed, 23 insertions(+), 8 deletions(-)

diff --git a/web/src/Landing.tsx b/web/src/Landing.tsx
index 3fa0fdf4..2457c012 100644
--- a/web/src/Landing.tsx
+++ b/web/src/Landing.tsx
@@ -233,25 +233,40 @@ function communitySummary(stats: Community | null): string | null {
 }
 
 function CopyButton({ text }: { text: string }) {
-  const [copied, setCopied] = useState(false);
+  const [status, setStatus] = useState<"idle" | "copied" | "failed">("idle");
 
   useEffect(() => {
-    if (!copied) {
+    if (status === "idle") {
       return;
     }
-    const timer = setTimeout(() => setCopied(false), 2000);
+    const timer = setTimeout(() => setStatus("idle"), 2000);
     return () => clearTimeout(timer);
-  }, [copied]);
+  }, [status]);
+
+  const handleClick = async () => {
+    if (!navigator.clipboard) {
+      setStatus("failed");
+      return;
+    }
+    try {
+      await navigator.clipboard.writeText(text);
+      setStatus("copied");
+    } catch {
+      setStatus("failed");
+    }
+  };
 
   return (
     <button
       className="sm"
       aria-live="polite"
-      onClick={() => {
-        void navigator.clipboard.writeText(text).then(() => setCopied(true));
-      }}
+      onClick={() => void handleClick()}
     >
-      {copied ? "Copied" : "Copy"}
+      {status === "copied"
+        ? "Copied"
+        : status === "failed"
+          ? "Copy failed"
+          : "Copy"}
     </button>
   );
 }