Initial commit: fristy.net personal site

components/copy-email.tsx

@@ -0,0 +1,40 @@
+"use client";
+
+import { useState } from "react";
+
+export function CopyEmail({
+    email,
+    copyLabel,
+    copiedLabel,
+}: {
+    email: string;
+    copyLabel: string;
+    copiedLabel: string;
+}) {
+    const [copied, setCopied] = useState(false);
+
+    async function copy() {
+        try {
+            await navigator.clipboard.writeText(email);
+        } catch {
+            const area = document.createElement("textarea");
+            area.value = email;
+            document.body.appendChild(area);
+            area.select();
+            document.execCommand("copy");
+            document.body.removeChild(area);
+        }
+        setCopied(true);
+        window.setTimeout(() => setCopied(false), 2000);
+    }
+
+    return (
+        <button
+            type="button"
+            onClick={copy}
+            className="rounded-full border border-white/15 px-5 py-3 text-sm text-zinc-300 transition-colors hover:border-blurple hover:text-white"
+        >
+            {copied ? copiedLabel : copyLabel}
+        </button>
+    );
+}