Developer settingsPro

1"use client"
2
3import { DeveloperSettings } from "@/components/dashral/blocks/developer-settings"
4
5export default function Developers() {
6  return (
7    <DeveloperSettings
8      keys={[{ id: "k1", name: "Production server", environment: "live", scope: "full", last4: "8f2a", created: "Mar 2, 2026", lastUsed: "2 minutes ago" }]}
9      endpoints={[{ id: "e1", url: "https://api.acme.com/webhooks", events: ["invoice.paid"], status: "active", secretLast4: "a7f1", environment: "live" }]}
10      deliveries={[]}
11      history={{}}
12      // Return the key with its full secret: it's shown once.
13      onCreateKey={async (input) => {
14        const secret = `sk_${input.environment}_${crypto.randomUUID().replaceAll("-", "")}`
15        return { key: { id: crypto.randomUUID(), name: input.name, environment: input.environment, scope: input.scope, scopes: input.scopes, last4: secret.slice(-4), created: "Just now" }, secret }
16      }}
17      onRevokeKey={async (key) => console.log("revoke", key.id)}
18      // Send the event to the endpoint and return the delivery as it went.
19      onSendTest={async (endpoint, event) => ({ id: crypto.randomUUID(), endpointId: endpoint.id, event, status: 200, duration: 120, time: "Just now" })}
20    />
21  )
22}