feat(frontend): add UI components

frontend/src/components/ui/code-block.tsx

@@ -0,0 +1,37 @@
+"use client";
+
+import { useState } from "react";
+
+interface CodeBlockProps {
+  code: string;
+  language?: string;
+}
+
+export function CodeBlock({ code, language = "python" }: CodeBlockProps) {
+  const [copied, setCopied] = useState(false);
+
+  const handleCopy = async () => {
+    await navigator.clipboard.writeText(code);
+    setCopied(true);
+    setTimeout(() => setCopied(false), 2000);
+  };
+
+  return (
+    <div className="relative group">
+      <div className="absolute right-2 top-2 opacity-0 group-hover:opacity-100 transition-opacity">
+        <button
+          onClick={handleCopy}
+          className="px-2 py-1 text-xs bg-[var(--secondary)] rounded hover:bg-[var(--muted)] transition-colors"
+        >
+          {copied ? "Copied!" : "Copy"}
+        </button>
+      </div>
+      <div className="text-xs text-[var(--muted-foreground)] mb-1">
+        {language}
+      </div>
+      <pre className="bg-[var(--secondary)] p-4 rounded-lg overflow-x-auto text-sm">
+        <code>{code}</code>
+      </pre>
+    </div>
+  );
+}