From e0e1baaefcf6fd38625562d0af028cd54f66c2e9 Mon Sep 17 00:00:00 2001
From: Trezy <tre@trezy.com>
Date: Fri, 06 Mar 2026 17:07:27 +0000
Subject: [PATCH] feat: move API keys into settings

---
 web/src/app/(dashboard)/api-keys/page.tsx | 278 --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
 web/src/app/(dashboard)/settings/page.tsx | 400 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++----------------------------------------------------------------------
 web/src/components/app-sidebar.tsx | 2 --
 3 file(s) changed, 330 insertion(s)(+), 350 deletion(s)(-)

diff --git a/web/src/app/(dashboard)/api-keys/page.tsx b/web/src/app/(dashboard)/api-keys/page.tsx
deleted file mode 100644
--- a/web/src/app/(dashboard)/api-keys/page.tsx
+++ /dev/null
@@ -1,278 +0,0 @@
-"use client";
-
-import { useCallback, useEffect, useState } from "react";
-import { Copy, Check } from "lucide-react";
-
-import { useAuth } from "@/lib/auth-context";
-import { getApiKeys, createApiKey, revokeApiKey } from "@/lib/api";
-import type { ApiKeySummary, CreateApiKeyResponse } from "@/types/api-keys";
-import { SiteHeader } from "@/components/site-header";
-import { Button } from "@/components/ui/button";
-import {
-  Dialog,
-  DialogClose,
-  DialogContent,
-  DialogDescription,
-  DialogFooter,
-  DialogHeader,
-  DialogTitle,
-  DialogTrigger,
-} from "@/components/ui/dialog";
-import {
-  AlertDialog,
-  AlertDialogAction,
-  AlertDialogCancel,
-  AlertDialogContent,
-  AlertDialogDescription,
-  AlertDialogFooter,
-  AlertDialogHeader,
-  AlertDialogTitle,
-  AlertDialogTrigger,
-} from "@/components/ui/alert-dialog";
-import { Input } from "@/components/ui/input";
-import { Label } from "@/components/ui/label";
-import {
-  Table,
-  TableBody,
-  TableCell,
-  TableHead,
-  TableHeader,
-  TableRow,
-} from "@/components/ui/table";
-
-export default function ApiKeysPage() {
-  const { getToken } = useAuth();
-  const [keys, setKeys] = useState<ApiKeySummary[]>([]);
-  const [error, setError] = useState<string | null>(null);
-
-  const load = useCallback(() => {
-    getApiKeys(getToken)
-      .then(setKeys)
-      .catch((e) => setError(e.message));
-  }, [getToken]);
-
-  useEffect(() => {
-    load();
-  }, [load]);
-
-  async function handleRevoke(id: string) {
-    try {
-      await revokeApiKey(getToken, id);
-      load();
-    } catch (e: unknown) {
-      setError(e instanceof Error ? e.message : String(e));
-    }
-  }
-
-  return (
-    <>
-      <SiteHeader title="API Keys" />
-      <div className="flex flex-1 flex-col gap-4 p-4 md:p-6">
-        {error && <p className="text-destructive text-sm">{error}</p>}
-
-        <div className="flex items-center justify-between">
-          <h2 className="text-lg font-semibold">API Keys</h2>
-          <CreateApiKeyDialog getToken={getToken} onSuccess={load} />
-        </div>
-
-        <div className="overflow-clip rounded-lg border">
-          <Table>
-            <TableHeader>
-              <TableRow>
-                <TableHead>Name</TableHead>
-                <TableHead>Key</TableHead>
-                <TableHead>Created</TableHead>
-                <TableHead>Last Used</TableHead>
-                <TableHead className="w-10 sticky right-0 bg-inherit z-[1]" />
-              </TableRow>
-            </TableHeader>
-            <TableBody>
-              {keys.length === 0 && (
-                <TableRow>
-                  <TableCell
-                    colSpan={5}
-                    className="text-muted-foreground text-center"
-                  >
-                    No API keys yet.
-                  </TableCell>
-                </TableRow>
-              )}
-              {keys.map((key) => (
-                <TableRow
-                  key={key.id}
-                  className={key.revoked_at ? "opacity-50" : undefined}
-                >
-                  <TableCell
-                    className={key.revoked_at ? "line-through" : undefined}
-                  >
-                    {key.name}
-                  </TableCell>
-                  <TableCell className="font-mono text-sm">
-                    {key.key_prefix}...
-                  </TableCell>
-                  <TableCell>
-                    {new Date(key.created_at).toLocaleString()}
-                  </TableCell>
-                  <TableCell>
-                    {key.last_used_at
-                      ? new Date(key.last_used_at).toLocaleString()
-                      : "Never"}
-                  </TableCell>
-                  <TableCell className="w-10 sticky right-0 bg-inherit z-[1]">
-                    {!key.revoked_at && (
-                      <AlertDialog>
-                        <AlertDialogTrigger asChild>
-                          <Button
-                            variant="outline"
-                            size="sm"
-                          >
-                            Revoke
-                          </Button>
-                        </AlertDialogTrigger>
-                        <AlertDialogContent>
-                          <AlertDialogHeader>
-                            <AlertDialogTitle>Revoke API Key</AlertDialogTitle>
-                            <AlertDialogDescription>
-                              This will permanently revoke the key &ldquo;{key.name}&rdquo;.
-                              Any services using this key will lose access.
-                            </AlertDialogDescription>
-                          </AlertDialogHeader>
-                          <AlertDialogFooter>
-                            <AlertDialogCancel>Cancel</AlertDialogCancel>
-                            <AlertDialogAction onClick={() => handleRevoke(key.id)}>
-                              Revoke
-                            </AlertDialogAction>
-                          </AlertDialogFooter>
-                        </AlertDialogContent>
-                      </AlertDialog>
-                    )}
-                  </TableCell>
-                </TableRow>
-              ))}
-            </TableBody>
-          </Table>
-        </div>
-      </div>
-    </>
-  );
-}
-
-function CreateApiKeyDialog({
-  getToken,
-  onSuccess,
-}: {
-  getToken: () => Promise<string | null>;
-  onSuccess: () => void;
-}) {
-  const [name, setName] = useState("");
-  const [error, setError] = useState<string | null>(null);
-  const [open, setOpen] = useState(false);
-  const [createdKey, setCreatedKey] = useState<CreateApiKeyResponse | null>(null);
-  const [copied, setCopied] = useState(false);
-
-  function handleOpenChange(nextOpen: boolean) {
-    setOpen(nextOpen);
-    if (!nextOpen) {
-      setName("");
-      setError(null);
-      if (createdKey) {
-        setCreatedKey(null);
-        onSuccess();
-      }
-    }
-  }
-
-  async function handleCreate() {
-    setError(null);
-    try {
-      const result = await createApiKey(getToken, { name });
-      setCreatedKey(result);
-      setCopied(false);
-    } catch (e: unknown) {
-      setError(e instanceof Error ? e.message : String(e));
-    }
-  }
-
-  async function handleCopy() {
-    if (!createdKey) return;
-    await navigator.clipboard.writeText(createdKey.key);
-    setCopied(true);
-    setTimeout(() => setCopied(false), 2000);
-  }
-
-  return (
-    <Dialog open={open} onOpenChange={handleOpenChange}>
-      <DialogTrigger asChild>
-        <Button>Create API Key</Button>
-      </DialogTrigger>
-      <DialogContent>
-        <DialogHeader>
-          <DialogTitle>
-            {createdKey ? "API Key Created" : "Create API Key"}
-          </DialogTitle>
-          <DialogDescription>
-            {createdKey
-              ? "Copy your API key now. It won\u2019t be shown again."
-              : "Give this key a name to identify its purpose."}
-          </DialogDescription>
-        </DialogHeader>
-
-        {createdKey ? (
-          <div className="flex flex-col gap-4">
-            <div className="flex flex-col gap-2">
-              <Label>API Key</Label>
-              <div className="flex gap-2">
-                <Input
-                  readOnly
-                  value={createdKey.key}
-                  className="font-mono text-sm"
-                />
-                <Button
-                  variant="outline"
-                  size="icon"
-                  onClick={handleCopy}
-                  title="Copy to clipboard"
-                >
-                  {copied ? (
-                    <Check className="size-4" />
-                  ) : (
-                    <Copy className="size-4" />
-                  )}
-                </Button>
-              </div>
-              <p className="text-muted-foreground text-xs">
-                Store this key securely. You will not be able to see it again.
-              </p>
-            </div>
-          </div>
-        ) : (
-          <div className="flex flex-col gap-4">
-            {error && <p className="text-destructive text-sm">{error}</p>}
-            <div className="flex flex-col gap-2">
-              <Label htmlFor="api-key-name">Name</Label>
-              <Input
-                id="api-key-name"
-                value={name}
-                onChange={(e) => setName(e.target.value)}
-                placeholder="e.g., CI Deploy"
-              />
-            </div>
-          </div>
-        )}
-
-        <DialogFooter>
-          <DialogClose asChild>
-            <Button variant={createdKey ? "default" : "outline"}>
-              {createdKey ? "Done" : "Cancel"}
-            </Button>
-          </DialogClose>
-          {!createdKey && (
-            <Button onClick={handleCreate} disabled={!name.trim()}>
-              Create
-            </Button>
-          )}
-        </DialogFooter>
-      </DialogContent>
-    </Dialog>
-  );
-}
diff --git a/web/src/app/(dashboard)/settings/page.tsx b/web/src/app/(dashboard)/settings/page.tsx
--- a/web/src/app/(dashboard)/settings/page.tsx
+++ b/web/src/app/(dashboard)/settings/page.tsx
@@ -1,17 +1,21 @@
 "use client";
 
 import { useCallback, useEffect, useState } from "react";
+import { Copy, Check, Trash2, Pencil } from "lucide-react";
 
 import { useAuth } from "@/lib/auth-context";
 import {
   getScriptVariables,
   upsertScriptVariable,
   deleteScriptVariable,
+  getApiKeys,
+  createApiKey,
+  revokeApiKey,
 } from "@/lib/api";
 import type { ScriptVariableSummary } from "@/types/script-variables";
+import type { ApiKeySummary, CreateApiKeyResponse } from "@/types/api-keys";
 import { SiteHeader } from "@/components/site-header";
 import { Button } from "@/components/ui/button";
-import { Trash2, Pencil } from "lucide-react";
 import {
   Dialog,
   DialogClose,
@@ -22,6 +26,17 @@ DialogHeader,
   DialogTitle,
   DialogTrigger,
 } from "@/components/ui/dialog";
+import {
+  AlertDialog,
+  AlertDialogAction,
+  AlertDialogCancel,
+  AlertDialogContent,
+  AlertDialogDescription,
+  AlertDialogFooter,
+  AlertDialogHeader,
+  AlertDialogTitle,
+  AlertDialogTrigger,
+} from "@/components/ui/alert-dialog";
 import { Input } from "@/components/ui/input";
 import { Label } from "@/components/ui/label";
 import { Textarea } from "@/components/ui/textarea";
@@ -33,26 +48,49 @@ TableHead,
   TableHeader,
   TableRow,
 } from "@/components/ui/table";
+import {
+  Tabs,
+  TabsContent,
+  TabsList,
+  TabsTrigger,
+} from "@/components/ui/tabs";
 
 export default function SettingsPage() {
   const { getToken } = useAuth();
   const [vars, setVars] = useState<ScriptVariableSummary[]>([]);
+  const [keys, setKeys] = useState<ApiKeySummary[]>([]);
   const [error, setError] = useState<string | null>(null);
 
-  const load = useCallback(() => {
+  const loadVars = useCallback(() => {
     getScriptVariables(getToken)
       .then(setVars)
+      .catch((e) => setError(e.message));
+  }, [getToken]);
+
+  const loadKeys = useCallback(() => {
+    getApiKeys(getToken)
+      .then(setKeys)
       .catch((e) => setError(e.message));
   }, [getToken]);
 
   useEffect(() => {
-    load();
-  }, [load]);
+    loadVars();
+    loadKeys();
+  }, [loadVars, loadKeys]);
 
-  async function handleDelete(key: string) {
+  async function handleDeleteVar(key: string) {
     try {
       await deleteScriptVariable(getToken, key);
-      load();
+      loadVars();
+    } catch (e: unknown) {
+      setError(e instanceof Error ? e.message : String(e));
+    }
+  }
+
+  async function handleRevoke(id: string) {
+    try {
+      await revokeApiKey(getToken, id);
+      loadKeys();
     } catch (e: unknown) {
       setError(e instanceof Error ? e.message : String(e));
     }
@@ -64,71 +102,169 @@ <SiteHeader title="Settings" />
       <div className="flex flex-1 flex-col gap-4 p-4 md:p-6">
         {error && <p className="text-destructive text-sm">{error}</p>}
 
-        <div className="flex items-center justify-between">
-          <div>
-            <h2 className="text-lg font-semibold">Script Variables</h2>
-            <p className="text-muted-foreground text-sm">
-              Define variables that Lua scripts can access via the{" "}
-              <code className="text-xs">env</code> global table.
-            </p>
-          </div>
-          <UpsertVariableDialog getToken={getToken} onSuccess={load} />
-        </div>
+        <Tabs defaultValue="env-variables">
+          <TabsList>
+            <TabsTrigger value="env-variables">ENV Variables</TabsTrigger>
+            <TabsTrigger value="api-keys">API Keys</TabsTrigger>
+          </TabsList>
 
-        <div className="overflow-clip rounded-lg border">
-          <Table>
-            <TableHeader>
-              <TableRow>
-                <TableHead>Key</TableHead>
-                <TableHead>Preview</TableHead>
-                <TableHead>Updated</TableHead>
-                <TableHead className="w-20 sticky right-0 bg-inherit z-[1]" />
-              </TableRow>
-            </TableHeader>
-            <TableBody>
-              {vars.length === 0 && (
-                <TableRow>
-                  <TableCell
-                    colSpan={4}
-                    className="text-muted-foreground text-center"
-                  >
-                    No script variables yet.
-                  </TableCell>
-                </TableRow>
-              )}
-              {vars.map((v) => (
-                <TableRow key={v.key}>
-                  <TableCell className="font-mono text-sm">{v.key}</TableCell>
-                  <TableCell className="font-mono text-sm text-muted-foreground">
-                    {v.preview}
-                  </TableCell>
-                  <TableCell>
-                    {new Date(v.updated_at).toLocaleString()}
-                  </TableCell>
-                  <TableCell className="w-20 sticky right-0 bg-inherit z-[1]">
-                    <div className="flex gap-1">
-                      <UpsertVariableDialog
-                        getToken={getToken}
-                        onSuccess={load}
-                        editKey={v.key}
-                      />
-                      <Button
-                        variant="destructive"
-                        size="icon"
-                        className="size-8 text-muted-foreground hover:text-destructive"
-                        title="Delete variable"
-                        aria-label="Delete variable"
-                        onClick={() => handleDelete(v.key)}
+          <TabsContent value="env-variables" className="flex flex-col gap-4">
+            <div className="flex items-center justify-between">
+              <div>
+                <h2 className="text-lg font-semibold">Script Variables</h2>
+                <p className="text-muted-foreground text-sm">
+                  Define variables that Lua scripts can access via the{" "}
+                  <code className="text-xs">env</code> global table.
+                </p>
+              </div>
+              <UpsertVariableDialog getToken={getToken} onSuccess={loadVars} />
+            </div>
+
+            <div className="overflow-clip rounded-lg border">
+              <Table>
+                <TableHeader>
+                  <TableRow>
+                    <TableHead>Key</TableHead>
+                    <TableHead>Preview</TableHead>
+                    <TableHead>Updated</TableHead>
+                    <TableHead className="w-20 sticky right-0 bg-inherit z-[1]" />
+                  </TableRow>
+                </TableHeader>
+                <TableBody>
+                  {vars.length === 0 && (
+                    <TableRow>
+                      <TableCell
+                        colSpan={4}
+                        className="text-muted-foreground text-center"
                       >
-                        <Trash2 className="size-4" />
-                      </Button>
-                    </div>
-                  </TableCell>
-                </TableRow>
-              ))}
-            </TableBody>
-          </Table>
-        </div>
+                        No script variables yet.
+                      </TableCell>
+                    </TableRow>
+                  )}
+                  {vars.map((v) => (
+                    <TableRow key={v.key}>
+                      <TableCell className="font-mono text-sm">
+                        {v.key}
+                      </TableCell>
+                      <TableCell className="font-mono text-sm text-muted-foreground">
+                        {v.preview}
+                      </TableCell>
+                      <TableCell>
+                        {new Date(v.updated_at).toLocaleString()}
+                      </TableCell>
+                      <TableCell className="w-20 sticky right-0 bg-inherit z-[1]">
+                        <div className="flex gap-1">
+                          <UpsertVariableDialog
+                            getToken={getToken}
+                            onSuccess={loadVars}
+                            editKey={v.key}
+                          />
+                          <Button
+                            variant="destructive"
+                            size="icon"
+                            className="size-8 text-muted-foreground hover:text-destructive"
+                            title="Delete variable"
+                            aria-label="Delete variable"
+                            onClick={() => handleDeleteVar(v.key)}
+                          >
+                            <Trash2 className="size-4" />
+                          </Button>
+                        </div>
+                      </TableCell>
+                    </TableRow>
+                  ))}
+                </TableBody>
+              </Table>
+            </div>
+          </TabsContent>
+
+          <TabsContent value="api-keys" className="flex flex-col gap-4">
+            <div className="flex items-center justify-between">
+              <h2 className="text-lg font-semibold">API Keys</h2>
+              <CreateApiKeyDialog getToken={getToken} onSuccess={loadKeys} />
+            </div>
+
+            <div className="overflow-clip rounded-lg border">
+              <Table>
+                <TableHeader>
+                  <TableRow>
+                    <TableHead>Name</TableHead>
+                    <TableHead>Key</TableHead>
+                    <TableHead>Created</TableHead>
+                    <TableHead>Last Used</TableHead>
+                    <TableHead className="w-10 sticky right-0 bg-inherit z-[1]" />
+                  </TableRow>
+                </TableHeader>
+                <TableBody>
+                  {keys.length === 0 && (
+                    <TableRow>
+                      <TableCell
+                        colSpan={5}
+                        className="text-muted-foreground text-center"
+                      >
+                        No API keys yet.
+                      </TableCell>
+                    </TableRow>
+                  )}
+                  {keys.map((key) => (
+                    <TableRow
+                      key={key.id}
+                      className={key.revoked_at ? "opacity-50" : undefined}
+                    >
+                      <TableCell
+                        className={key.revoked_at ? "line-through" : undefined}
+                      >
+                        {key.name}
+                      </TableCell>
+                      <TableCell className="font-mono text-sm">
+                        {key.key_prefix}...
+                      </TableCell>
+                      <TableCell>
+                        {new Date(key.created_at).toLocaleString()}
+                      </TableCell>
+                      <TableCell>
+                        {key.last_used_at
+                          ? new Date(key.last_used_at).toLocaleString()
+                          : "Never"}
+                      </TableCell>
+                      <TableCell className="w-10 sticky right-0 bg-inherit z-[1]">
+                        {!key.revoked_at && (
+                          <AlertDialog>
+                            <AlertDialogTrigger asChild>
+                              <Button variant="outline" size="sm">
+                                Revoke
+                              </Button>
+                            </AlertDialogTrigger>
+                            <AlertDialogContent>
+                              <AlertDialogHeader>
+                                <AlertDialogTitle>
+                                  Revoke API Key
+                                </AlertDialogTitle>
+                                <AlertDialogDescription>
+                                  This will permanently revoke the key &ldquo;
+                                  {key.name}&rdquo;. Any services using this key
+                                  will lose access.
+                                </AlertDialogDescription>
+                              </AlertDialogHeader>
+                              <AlertDialogFooter>
+                                <AlertDialogCancel>Cancel</AlertDialogCancel>
+                                <AlertDialogAction
+                                  onClick={() => handleRevoke(key.id)}
+                                >
+                                  Revoke
+                                </AlertDialogAction>
+                              </AlertDialogFooter>
+                            </AlertDialogContent>
+                          </AlertDialog>
+                        )}
+                      </TableCell>
+                    </TableRow>
+                  ))}
+                </TableBody>
+              </Table>
+            </div>
+          </TabsContent>
+        </Tabs>
       </div>
     </>
   );
@@ -195,7 +331,9 @@ )}
       </DialogTrigger>
       <DialogContent>
         <DialogHeader>
-          <DialogTitle>{isEdit ? "Edit Variable" : "Add Variable"}</DialogTitle>
+          <DialogTitle>
+            {isEdit ? "Edit Variable" : "Add Variable"}
+          </DialogTitle>
           <DialogDescription>
             {isEdit
               ? "Update the value for this script variable."
@@ -236,3 +374,125 @@ </DialogContent>
     </Dialog>
   );
 }
+
+function CreateApiKeyDialog({
+  getToken,
+  onSuccess,
+}: {
+  getToken: () => Promise<string | null>;
+  onSuccess: () => void;
+}) {
+  const [name, setName] = useState("");
+  const [error, setError] = useState<string | null>(null);
+  const [open, setOpen] = useState(false);
+  const [createdKey, setCreatedKey] = useState<CreateApiKeyResponse | null>(
+    null
+  );
+  const [copied, setCopied] = useState(false);
+
+  function handleOpenChange(nextOpen: boolean) {
+    setOpen(nextOpen);
+    if (!nextOpen) {
+      setName("");
+      setError(null);
+      if (createdKey) {
+        setCreatedKey(null);
+        onSuccess();
+      }
+    }
+  }
+
+  async function handleCreate() {
+    setError(null);
+    try {
+      const result = await createApiKey(getToken, { name });
+      setCreatedKey(result);
+      setCopied(false);
+    } catch (e: unknown) {
+      setError(e instanceof Error ? e.message : String(e));
+    }
+  }
+
+  async function handleCopy() {
+    if (!createdKey) return;
+    await navigator.clipboard.writeText(createdKey.key);
+    setCopied(true);
+    setTimeout(() => setCopied(false), 2000);
+  }
+
+  return (
+    <Dialog open={open} onOpenChange={handleOpenChange}>
+      <DialogTrigger asChild>
+        <Button>Create API Key</Button>
+      </DialogTrigger>
+      <DialogContent>
+        <DialogHeader>
+          <DialogTitle>
+            {createdKey ? "API Key Created" : "Create API Key"}
+          </DialogTitle>
+          <DialogDescription>
+            {createdKey
+              ? "Copy your API key now. It won\u2019t be shown again."
+              : "Give this key a name to identify its purpose."}
+          </DialogDescription>
+        </DialogHeader>
+
+        {createdKey ? (
+          <div className="flex flex-col gap-4">
+            <div className="flex flex-col gap-2">
+              <Label>API Key</Label>
+              <div className="flex gap-2">
+                <Input
+                  readOnly
+                  value={createdKey.key}
+                  className="font-mono text-sm"
+                />
+                <Button
+                  variant="outline"
+                  size="icon"
+                  onClick={handleCopy}
+                  title="Copy to clipboard"
+                >
+                  {copied ? (
+                    <Check className="size-4" />
+                  ) : (
+                    <Copy className="size-4" />
+                  )}
+                </Button>
+              </div>
+              <p className="text-muted-foreground text-xs">
+                Store this key securely. You will not be able to see it again.
+              </p>
+            </div>
+          </div>
+        ) : (
+          <div className="flex flex-col gap-4">
+            {error && <p className="text-destructive text-sm">{error}</p>}
+            <div className="flex flex-col gap-2">
+              <Label htmlFor="api-key-name">Name</Label>
+              <Input
+                id="api-key-name"
+                value={name}
+                onChange={(e) => setName(e.target.value)}
+                placeholder="e.g., CI Deploy"
+              />
+            </div>
+          </div>
+        )}
+
+        <DialogFooter>
+          <DialogClose asChild>
+            <Button variant={createdKey ? "default" : "outline"}>
+              {createdKey ? "Done" : "Cancel"}
+            </Button>
+          </DialogClose>
+          {!createdKey && (
+            <Button onClick={handleCreate} disabled={!name.trim()}>
+              Create
+            </Button>
+          )}
+        </DialogFooter>
+      </DialogContent>
+    </Dialog>
+  );
+}
diff --git a/web/src/components/app-sidebar.tsx b/web/src/components/app-sidebar.tsx
--- a/web/src/components/app-sidebar.tsx
+++ b/web/src/components/app-sidebar.tsx
@@ -7,7 +7,6 @@ IconDatabase,
   IconTable,
   IconClipboardList,
   IconUsers,
-  IconKey,
   IconSettings,
   IconLogout,
 } from "@tabler/icons-react"
@@ -35,7 +34,6 @@ { title: "Backfill", url: "/backfill", icon: IconDatabase },
   { title: "Records", url: "/records", icon: IconTable },
   { title: "Event Logs", url: "/events", icon: IconClipboardList },
   { title: "Admins", url: "/admins", icon: IconUsers },
-  { title: "API Keys", url: "/api-keys", icon: IconKey },
   { title: "Settings", url: "/settings", icon: IconSettings },
 ]
 

--
tangled.sh