fix(playground): move useState/useCallback above early returns to fix React error #310 (#429)

Hooks (useState for copied, useCallback for handleCopy) were placed after conditional early returns for loading/error states, violating React Rules of Hooks. Moved both hooks above the early returns so all 11 hooks are called unconditionally on every render.

Root cause: the hooks violation was previously masked because the WASM binary was missing (404), so the component always stayed in the error branch. Once the WASM binary was committed (#423), the loading→ready transition exposed the hook count mismatch, triggering React error #310.

Fixes #427

Author: ajitpratap0

website/src/components/playground/Playground.tsx

@@ -109,6 +109,15 @@ export default function Playground() {
     []
   );
 
+  const [copied, setCopied] = useState(false);
+
+  const handleCopy = useCallback(() => {
+    navigator.clipboard.writeText('go get github.com/ajitpratap0/GoSQLX').then(() => {
+      setCopied(true);
+      setTimeout(() => setCopied(false), 2000);
+    });
+  }, []);
+
   if (loading) {
     return (
       <div className="flex flex-col h-full bg-[#09090b]" aria-busy="true" aria-label="Loading SQL parser">
@@ -190,16 +199,8 @@ export default function Playground() {
     );
   }
 
-  const [copied, setCopied] = useState(false);
   const hasResults = results.ast !== null;
 
-  const handleCopy = useCallback(() => {
-    navigator.clipboard.writeText('go get github.com/ajitpratap0/GoSQLX').then(() => {
-      setCopied(true);
-      setTimeout(() => setCopied(false), 2000);
-    });
-  }, []);
-
   return (
     <div className="flex flex-col h-full bg-[#09090b]">
       {/* Top toolbar */}