fix: Copy JSON button form submission

Author: fveiraswww

client/src/components/DynamicJsonForm.tsx

@@ -252,36 +252,45 @@ const DynamicJsonForm = ({
   }, [shouldUseJsonMode, isJsonMode]);
 
   const handleCopyJson = useCallback(() => {
-    try {
-      navigator.clipboard
-        .writeText(JSON.stringify(value, null, 2) ?? "[]")
-        .then(() => {
-          setCopiedJson(true);
+    const copyToClipboard = async () => {
+      try {
+        await navigator.clipboard.writeText(
+          JSON.stringify(value, null, 2) ?? "[]",
+        );
+        setCopiedJson(true);
 
-          toast({
-            title: "JSON copied",
-            description:
-              "The JSON data has been successfully copied to your clipboard.",
-          });
+        toast({
+          title: "JSON copied",
+          description:
+            "The JSON data has been successfully copied to your clipboard.",
+        });
 
-          setTimeout(() => {
-            setCopiedJson(false);
-          }, 2000);
-        })
-        .catch((error) => {
-          reportError(error);
+        setTimeout(() => {
+          setCopiedJson(false);
+        }, 2000);
+      } catch (error) {
+        toast({
+          title: "Error",
+          description: `Failed to copy JSON: ${error instanceof Error ? error.message : String(error)}`,
+          variant: "destructive",
         });
-    } catch (error) {
-      reportError(error);
-    }
+      }
+    };
+
+    copyToClipboard();
   }, [toast, value]);
 
   return (
     <div className="space-y-4">
       <div className="flex justify-end space-x-2">
         {isJsonMode && (
           <>
-            <Button variant="outline" size="sm" onClick={handleCopyJson}>
+            <Button
+              type="button"
+              variant="outline"
+              size="sm"
+              onClick={handleCopyJson}
+            >
               {copiedJson ? (
                 <CheckCheck className="h-4 w-4 mr-2" />
               ) : (