From 9a6fd6a5ee1a773ee5f56bc67a5cc50c798469c5 Mon Sep 17 00:00:00 2001
From: Frank <frank@sst.dev>
Date: Sat, 11 Oct 2025 14:48:34 -0400
Subject: [PATCH] wip: zen

---
 .../src/routes/workspace/[id]/new-user-section.tsx  | 13 ++++++++++---
 1 file changed, 10 insertions(+), 3 deletions(-)

diff --git a/packages/console/app/src/routes/workspace/[id]/new-user-section.tsx b/packages/console/app/src/routes/workspace/[id]/new-user-section.tsx
index b694801c..65edc684 100644
--- a/packages/console/app/src/routes/workspace/[id]/new-user-section.tsx
+++ b/packages/console/app/src/routes/workspace/[id]/new-user-section.tsx
@@ -28,7 +28,14 @@ export function NewUserSection() {
     const usageList = usage()
     return keysList?.length === 1 && (!usageList || usageList.length === 0)
   })
-  const defaultKey = createMemo(() => keys()?.at(-1)?.key)
+  const defaultKey = createMemo(() => {
+    const key = keys()?.at(-1)?.key
+    if (!key) return undefined
+    return {
+      actual: key,
+      masked: key.slice(0, 8) + "*".repeat(key.length - 12) + key.slice(-4),
+    }
+  })
 
   return (
     <Show when={isNew()}>
@@ -52,12 +59,12 @@ export function NewUserSection() {
           <Show when={defaultKey()}>
             <div data-slot="key-display">
               <div data-slot="key-container">
-                <code data-slot="key-value">{defaultKey()}</code>
+                <code data-slot="key-value">{defaultKey()?.masked}</code>
                 <button
                   data-color="primary"
                   disabled={copiedKey()}
                   onClick={async () => {
-                    await navigator.clipboard.writeText(defaultKey() ?? "")
+                    await navigator.clipboard.writeText(defaultKey()?.actual ?? "")
                     setCopiedKey(true)
                     setTimeout(() => setCopiedKey(false), 2000)
                   }}