51:I[707087,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/3j06ow7w40nxu.js","/_next/static/immutable/chunks/31nn7jwsjvqii.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"RegistryDependencies"] 52:I[314491,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/3j06ow7w40nxu.js","/_next/static/immutable/chunks/31nn7jwsjvqii.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"FilesView"] 53:T3954,"use client"; import { useState } from "react"; import { toast, Toaster } from "@/components/ui/toast"; import { KeyRound, Plus, Copy, RefreshCcw, Trash2, MoreHorizontal, GitBranch, MessagesSquare, Webhook, Landmark, CreditCard, } from "lucide-react"; import { Button } from "@/components/ui/button"; import { Badge } from "@/components/ui/badge"; import { Card, CardContent, CardHeader, CardTitle, CardDescription } from "@/components/ui/card"; import { Progress } from "@/components/ui/progress"; import { Switch } from "@/components/ui/switch"; import { Separator } from "@/components/ui/separator"; import { Field, FieldLabel } from "@/components/ui/field"; import { Input } from "@/components/ui/input"; import { Item, ItemGroup, ItemMedia, ItemContent, ItemTitle, ItemDescription, ItemActions, ItemSeparator, } from "@/components/ui/item"; import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuSeparator, DropdownMenuTrigger, } from "@/components/ui/dropdown-menu"; import { Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, DialogTrigger, } from "@/components/ui/dialog"; import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs"; const apiKeys = [ { name: "Production key", key: "sk_live_51N••••••••••••••••8f2k", created: "Created Jan 12, 2026", lastUsed: "Last used 2 hours ago", }, { name: "Staging key", key: "sk_test_4hP••••••••••••••••a91x", created: "Created Nov 3, 2025", lastUsed: "Last used 3 days ago", }, { name: "CI / automation key", key: "sk_test_9zQ••••••••••••••••c47r", created: "Created Sep 21, 2025", lastUsed: "Never used", }, ]; const integrations = [ { name: "GitHub", description: "Sync deployments and issues with your repositories.", icon: GitBranch, connected: true, }, { name: "Slack", description: "Get usage alerts and billing notifications in Slack.", icon: MessagesSquare, connected: true, }, { name: "Webhooks", description: "Send real-time events to your own endpoints.", icon: Webhook, connected: false, }, { name: "Accounting sync", description: "Export invoices and usage to your ledger automatically.", icon: Landmark, connected: false, }, ]; const AccountSetting1 = () => { const [hasCard, setHasCard] = useState(true); const copyKey = (key: string) => { navigator.clipboard?.writeText(key); toast.add({ title: "API key copied to clipboard", type: "success" }); }; return (

{/* */} Account Settings Manage your API keys, integrations, and billing details. API Keys Integrations Billing {/* ---------------- API Keys ---------------- */}

API usage this month

8,420 / 10,000 requests

Usage resets on Aug 1, 2026.

Your API keys

{apiKeys.map((item, index) => (

{item.name} Active {item.key} {item.created} · {item.lastUsed} } /> copyKey(item.key)}> Copy key Regenerate Revoke key {index < apiKeys.length - 1 && }

))}

{/* ---------------- Integrations ---------------- */}

{integrations.map((integration) => (

{integration.name}

{integration.connected ? "Connected" : "Not connected"}

{integration.description}

))}

{/* ---------------- Billing ---------------- */}

Payment method

{hasCard ? (

•••• •••• •••• 4242

Expires 08/27

) : (

No payment method on file

Add a card to keep your subscription active without interruption.

)}

Current plan

Pro plan

$49/month · renews Aug 1, 2026

); }; const AddCardDialog = ({ onSave }: { onSave: () => void }) => { return ( Add payment method Your card details are encrypted and processed securely.

CardHolder Name Card Number

Expiry CVC

Cancel} /> { onSave(); toast.add({ title: "Payment method saved", type: "success" }); }} > Save card } /> ); }; export default AccountSetting1; 50:["$","div",null,{"className":"mt-3 flex min-h-0 min-w-0 flex-1 flex-col gap-3","children":[["$","div",null,{"className":"flex shrink-0 items-start gap-3","children":[["$","div",null,{"className":"flex max-h-28 min-w-0 flex-1 flex-wrap items-center gap-2 overflow-y-auto","children":[["$","ul",null,{"className":"flex min-w-0 flex-wrap gap-2","aria-label":"Package dependencies","children":[["$","li","lucide-react",{"className":"min-w-0 max-w-full","children":["$","a",null,{"href":"https://www.npmjs.com/package/lucide-react","target":"_blank","rel":"noopener noreferrer","className":"flex max-w-full min-w-0 items-center gap-1.5 rounded-md border px-2 py-1.5 text-xs","children":[["$","svg",null,{"viewBox":"0 0 24 24","className":"size-3 shrink-0","children":["$","path",null,{"d":"M1.763 0C.786 0 0 .786 0 1.763v20.474C0 23.214.786 24 1.763 24h20.474c.977 0 1.763-.786 1.763-1.763V1.763C24 .786 23.214 0 22.237 0zM5.13 5.323l13.837.019-.009 13.836h-3.464l.01-10.382h-3.456L12.04 19.17H5.113z","fill":"currentColor"}]}],["$","span",null,{"className":"min-w-0 break-all text-xs font-medium","children":"lucide-react"}]]}]}]]}],["$","$L51",null,{"namespace":"@shadcn-dashboard","registryDependencies":["card","field","input","button","badge","progress","switch","separator","item","dropdown-menu","dialog","toast","tabs"]}]]}],null]}],["$","$L52",null,{"files":[{"path":"src/components/shadcn-dashboard/blocks/account-setting/account-setting-1.tsx","content":"$53","type":"registry:component","target":"components/shadcn-dashboard/blocks/account-setting/account-setting-1.tsx"}],"className":"h-[70svh] min-h-80"}]]}]