From 8589faa4c4b6c201c6ece7bcc563f9cccee49a5f Mon Sep 17 00:00:00 2001
From: Alejandro Borbolla <alejandro.borbolla@datadoghq.com>
Date: Thu, 31 Jul 2025 00:32:39 +0200
Subject: [PATCH] refactor: Use `useCopy()` in `JsonView`

---
 client/src/components/JsonView.tsx | 17 ++---------------
 1 file changed, 2 insertions(+), 15 deletions(-)

diff --git a/client/src/components/JsonView.tsx b/client/src/components/JsonView.tsx
index e9ef0d2d..7cb38667 100644
--- a/client/src/components/JsonView.tsx
+++ b/client/src/components/JsonView.tsx
@@ -5,6 +5,7 @@ import { Copy, CheckCheck } from "lucide-react";
 import { Button } from "@/components/ui/button";
 import { useToast } from "@/lib/hooks/useToast";
 import { getDataType, tryParseJson } from "@/utils/jsonUtils";
+import useCopy from "@/lib/hooks/useCopy";
 
 interface JsonViewProps {
   data: unknown;
@@ -25,21 +26,7 @@ const JsonView = memo(
     isError = false,
   }: JsonViewProps) => {
     const { toast } = useToast();
-    const [copied, setCopied] = useState(false);
-
-    useEffect(() => {
-      let timeoutId: NodeJS.Timeout;
-      if (copied) {
-        timeoutId = setTimeout(() => {
-          setCopied(false);
-        }, 500);
-      }
-      return () => {
-        if (timeoutId) {
-          clearTimeout(timeoutId);
-        }
-      };
-    }, [copied]);
+    const { copied, setCopied } = useCopy();
 
     const normalizedData = useMemo(() => {
       return typeof data === "string"