From 3e9ee9b15c709bf884037060611af8995c65700b Mon Sep 17 00:00:00 2001
From: Harshal Patel <hp842484@gmail.com>
Date: Thu, 25 Jun 2026 17:20:46 +0530
Subject: [PATCH] fix(webapp): clear overlapping timeouts and reset useCopy
 hook state on value change

---
 apps/webapp/app/hooks/useCopy.ts | 15 +++++++++++++--
 1 file changed, 13 insertions(+), 2 deletions(-)

diff --git a/apps/webapp/app/hooks/useCopy.ts b/apps/webapp/app/hooks/useCopy.ts
index 00d63c51bc5..843ff2b3298 100644
--- a/apps/webapp/app/hooks/useCopy.ts
+++ b/apps/webapp/app/hooks/useCopy.ts
@@ -1,7 +1,8 @@
-import { useCallback, useState } from "react";
+import { useCallback, useState, useRef, useEffect } from "react";
 
 export function useCopy(value: string, duration = 1500) {
   const [copied, setCopied] = useState(false);
+  const timeoutRef = useRef<NodeJS.Timeout | null>(null);
 
   const copy = useCallback(
     (e?: React.MouseEvent) => {
@@ -10,13 +11,23 @@ export function useCopy(value: string, duration = 1500) {
         e.stopPropagation();
       }
       navigator.clipboard.writeText(value);
+      
+      if (timeoutRef.current) clearTimeout(timeoutRef.current);
+      
       setCopied(true);
-      setTimeout(() => {
+      timeoutRef.current = setTimeout(() => {
         setCopied(false);
       }, duration);
     },
     [value, duration]
   );
 
+  useEffect(() => {
+    setCopied(false);
+    return () => {
+      if (timeoutRef.current) clearTimeout(timeoutRef.current);
+    };
+  }, [value]);
+
   return { copy, copied };
 }