diff --git a/apps/cloud/src/routes/billing.tsx b/apps/cloud/src/routes/billing.tsx index ca90c507..f879eb1a 100644 --- a/apps/cloud/src/routes/billing.tsx +++ b/apps/cloud/src/routes/billing.tsx @@ -65,7 +65,7 @@ function BillingPage() {
-

+

{planName}

{isSwitching && ( @@ -79,7 +79,7 @@ function BillingPage() { )}
-

+

{isSwitching && sub?.currentPeriodEnd ? `Starts ${new Date(sub.currentPeriodEnd).toLocaleDateString(undefined, { month: "long", day: "numeric", year: "numeric" })}` : isCanceling && sub?.currentPeriodEnd @@ -95,14 +95,14 @@ function BillingPage() { variant="ghost" type="button" onClick={() => openCustomerPortal()} - className="rounded-md px-3 py-1.5 text-[0.75rem] font-medium text-destructive transition-colors hover:bg-destructive/10" + className="rounded-md px-3 py-1.5 text-xs font-medium text-destructive transition-colors hover:bg-destructive/10" > Cancel plan )} Manage @@ -116,10 +116,10 @@ function BillingPage() { {executions && (

-

Executions

-

+

Executions

+

{executions.usage.toLocaleString()} - + {" / "} {executions.granted.toLocaleString()} this month diff --git a/apps/cloud/src/routes/billing_.plans.tsx b/apps/cloud/src/routes/billing_.plans.tsx index 85742add..a1114a0e 100644 --- a/apps/cloud/src/routes/billing_.plans.tsx +++ b/apps/cloud/src/routes/billing_.plans.tsx @@ -58,7 +58,7 @@ function PlansPage() {

Choose a plan -

+

Pick the plan that works for you. Upgrade or downgrade anytime.

@@ -117,7 +117,7 @@ function PlansPage() { ].join(" ")} >
-

+

{plan.name}

{isCurrent && ( @@ -136,14 +136,14 @@ function PlansPage() { )}
-

{meta.tagline}

+

{meta.tagline}

${plan.price?.amount ?? 0} {plan.price?.interval && ( - + USD / seat / {plan.price.interval} )} @@ -151,7 +151,7 @@ function PlansPage() {
{(isCurrent && !isCanceling) || isScheduled ? ( -
+
{isCurrent ? "Current plan" : "Scheduled"}
) : isCanceling ? ( @@ -159,7 +159,7 @@ function PlansPage() { type="button" disabled={loadingPlan !== null} onClick={() => openCustomerPortal()} - className="flex h-9 w-full items-center justify-center rounded-md bg-primary text-[0.8125rem] font-medium text-primary-foreground transition-colors hover:bg-primary/90 disabled:opacity-60" + className="flex h-9 w-full items-center justify-center rounded-md bg-primary text-sm font-medium text-primary-foreground transition-colors hover:bg-primary/90 disabled:opacity-60" > Resume @@ -173,7 +173,7 @@ function PlansPage() { setLoadingPlan(null); }} className={[ - "flex h-9 w-full items-center justify-center rounded-md text-[0.8125rem] font-medium transition-colors disabled:opacity-60", + "flex h-9 w-full items-center justify-center rounded-md text-sm font-medium transition-colors disabled:opacity-60", isUpgradeAction ? "bg-primary text-primary-foreground hover:bg-primary/90" : "border border-border bg-background text-foreground hover:bg-muted", @@ -188,7 +188,7 @@ function PlansPage() { {meta.features.map((f) => (
  • ) : ( -
    +
    {member.name ? member.name .split(" ") @@ -368,7 +368,7 @@ function OrgPage() { {/* Name + email */}
    -

    +

    {member.name ?? member.email}

    {member.isCurrentUser && ( @@ -381,19 +381,19 @@ function OrgPage() { )}
    {member.name && ( -

    +

    {member.email}

    )}
    {/* Role */} -

    +

    {member.role}

    {/* Last active */} -

    +

    {formatLastActive(member.lastActiveAt)}

    @@ -417,14 +417,14 @@ function OrgPage() { {roles.length > 0 && ( <> - + Change role {roles.map((role) => ( handleChangeRole(member.id, role.slug, role.name) @@ -452,7 +452,7 @@ function OrgPage() { )} handleRemove(member.id, member.name ?? member.email)} > Remove member @@ -539,7 +539,7 @@ function DomainCard({ Remove domain @@ -618,7 +618,7 @@ function InviteDialog(props: { Invite member - + Send an email invitation to join your organization. @@ -627,7 +627,7 @@ function InviteDialog(props: {
    @@ -642,7 +642,7 @@ function InviteDialog(props: { onKeyDown={(e) => { if (e.key === "Enter") handleInvite(); }} - className="text-[0.8125rem] h-9" + className="text-sm h-9" />
    @@ -650,7 +650,7 @@ function InviteDialog(props: {
    @@ -658,7 +658,7 @@ function InviteDialog(props: { value={state.roleSlug} onValueChange={(v) => dispatch({ type: "setRole", roleSlug: v })} > - + @@ -674,7 +674,7 @@ function InviteDialog(props: { {state.status === "error" && state.error && (
    -

    {state.error}

    +

    {state.error}

    )}
    diff --git a/apps/cloud/src/web/shell.tsx b/apps/cloud/src/web/shell.tsx index 269ea6e0..e84916fa 100644 --- a/apps/cloud/src/web/shell.tsx +++ b/apps/cloud/src/web/shell.tsx @@ -28,7 +28,7 @@ function NavItem(props: { to: string; label: string; active: boolean; onNavigate to={props.to} onClick={props.onNavigate} className={[ - "flex items-center gap-2.5 rounded-md px-2.5 py-1.5 text-[13px] transition-colors", + "flex items-center gap-2.5 rounded-md px-2.5 py-1.5 text-sm transition-colors", props.active ? "bg-sidebar-active text-foreground font-medium" : "text-sidebar-foreground hover:bg-sidebar-active/60 hover:text-foreground", @@ -47,14 +47,14 @@ function SourceList(props: { pathname: string; onNavigate?: () => void }) { return Result.match(sources, { onInitial: () => ( -
    Loading…
    +
    Loading…
    ), onFailure: () => ( -
    No sources yet
    +
    No sources yet
    ), onSuccess: ({ value }) => value.length === 0 ? ( -
    +
    No sources yet
    ) : ( @@ -70,7 +70,7 @@ function SourceList(props: { pathname: string; onNavigate?: () => void }) { params={{ namespace: s.id }} onClick={props.onNavigate} className={[ - "group flex items-center gap-2 rounded-md px-2.5 py-1.5 text-[13px] transition-colors", + "group flex items-center gap-2 rounded-md px-2.5 py-1.5 text-xs transition-colors", active ? "bg-sidebar-active text-foreground font-medium" : "text-sidebar-foreground hover:bg-sidebar-active/60 hover:text-foreground", @@ -78,7 +78,7 @@ function SourceList(props: { pathname: string; onNavigate?: () => void }) { > {s.name} - + {s.kind} @@ -110,16 +110,16 @@ function UserFooter() { {auth.user.avatarUrl ? ( ) : ( -
    +
    {initials}
    )}
    -

    +

    {auth.user.name ?? auth.user.email}

    {auth.organization && ( -

    {auth.organization.name}

    +

    {auth.organization.name}

    )}
    @@ -127,7 +127,7 @@ function UserFooter() { variant="ghost" size="icon-xs" type="submit" - className="shrink-0 text-muted-foreground/50 hover:bg-sidebar-active hover:text-foreground" + className="shrink-0 text-muted-foreground hover:bg-sidebar-active hover:text-foreground" title="Sign out" > @@ -170,7 +170,7 @@ function SidebarContent(props: { pathname: string; onNavigate?: () => void; show -
    +
    Sources
    diff --git a/apps/local/src/web/shell.tsx b/apps/local/src/web/shell.tsx index f214b8e6..0c54fcc0 100644 --- a/apps/local/src/web/shell.tsx +++ b/apps/local/src/web/shell.tsx @@ -152,8 +152,8 @@ function UpdateCard(props: { latestVersion: string; channel: UpdateChannel }) {
    -

    Update available

    -

    v{props.latestVersion}

    +

    Update available

    +

    v{props.latestVersion}

    -

    +

    {template.service} · {template.version}

    @@ -680,7 +680,7 @@ export default function AddGoogleDiscoverySource(props: {

    {probe.title ?? probe.name}

    -

    +

    {probe.service} · {probe.version}

    @@ -731,7 +731,7 @@ export default function AddGoogleDiscoverySource(props: {
    -

    +

    {canUseOAuth ? `${probe?.scopes.length ?? 0} scopes will be requested from Google.` : "This API does not advertise OAuth scopes."} @@ -782,7 +782,7 @@ export default function AddGoogleDiscoverySource(props: { {(probe?.scopes ?? []).map((scope) => (

  • {scope}
  • diff --git a/packages/plugins/google-discovery/src/react/EditGoogleDiscoverySource.tsx b/packages/plugins/google-discovery/src/react/EditGoogleDiscoverySource.tsx index f97516d1..fbb87f8b 100644 --- a/packages/plugins/google-discovery/src/react/EditGoogleDiscoverySource.tsx +++ b/packages/plugins/google-discovery/src/react/EditGoogleDiscoverySource.tsx @@ -23,7 +23,7 @@ export default function EditGoogleDiscoverySource({

    Edit Google Discovery Source

    -

    +

    View configuration for this Google API source. To change authentication, remove and re-add the source with updated OAuth credentials.

    @@ -40,7 +40,7 @@ export default function EditGoogleDiscoverySource({

    )}
    - + Google Discovery
    @@ -49,13 +49,13 @@ export default function EditGoogleDiscoverySource({
    -

    +

    Service

    {config.service}

    -

    +

    Version

    {config.version}

    @@ -63,7 +63,7 @@ export default function EditGoogleDiscoverySource({
    -

    +

    Authentication

    diff --git a/packages/plugins/google-discovery/src/react/GoogleDiscoverySourceSummary.tsx b/packages/plugins/google-discovery/src/react/GoogleDiscoverySourceSummary.tsx index 2165d91c..5b48c17d 100644 --- a/packages/plugins/google-discovery/src/react/GoogleDiscoverySourceSummary.tsx +++ b/packages/plugins/google-discovery/src/react/GoogleDiscoverySourceSummary.tsx @@ -3,10 +3,10 @@ import { Badge } from "@executor/react/components/badge"; export default function GoogleDiscoverySourceSummary({ sourceId }: { readonly sourceId: string }) { return ( - + Google - {sourceId} + {sourceId} ); } diff --git a/packages/plugins/graphql/src/react/AddGraphqlSource.tsx b/packages/plugins/graphql/src/react/AddGraphqlSource.tsx index 4b852654..aa28c771 100644 --- a/packages/plugins/graphql/src/react/AddGraphqlSource.tsx +++ b/packages/plugins/graphql/src/react/AddGraphqlSource.tsx @@ -106,7 +106,7 @@ export default function AddGraphqlSource(props: { placeholder="https://api.example.com/graphql" className="font-mono text-sm" /> -

    +

    The endpoint will be introspected to discover available queries and mutations.

    @@ -122,7 +122,7 @@ export default function AddGraphqlSource(props: { placeholder="my_api" className="font-mono text-sm" /> -

    +

    A prefix for the tool names. Derived from the endpoint hostname if not provided.

    @@ -134,7 +134,7 @@ export default function AddGraphqlSource(props: { -

    +

    Secret-backed headers sent with every request, including introspection.

    @@ -171,7 +171,7 @@ export default function AddGraphqlSource(props: { {/* Error */} {addError && (
    -

    {addError}

    +

    {addError}

    )} diff --git a/packages/plugins/graphql/src/react/EditGraphqlSource.tsx b/packages/plugins/graphql/src/react/EditGraphqlSource.tsx index 6dfc4c93..7185411d 100644 --- a/packages/plugins/graphql/src/react/EditGraphqlSource.tsx +++ b/packages/plugins/graphql/src/react/EditGraphqlSource.tsx @@ -69,7 +69,7 @@ function EditForm(props: {

    Edit GraphQL Source

    -

    +

    Update the endpoint and authentication headers for this source.

    @@ -78,7 +78,7 @@ function EditForm(props: {

    {props.sourceId}

    - + GraphQL
    @@ -129,7 +129,7 @@ function EditForm(props: { {error && (
    -

    {error}

    +

    {error}

    )} @@ -158,7 +158,7 @@ export default function EditGraphqlSource(props: { sourceId: string; onSave: ()

    Edit GraphQL Source

    -

    Loading configuration…

    +

    Loading configuration…

    ); diff --git a/packages/plugins/mcp/src/react/AddMcpSource.tsx b/packages/plugins/mcp/src/react/AddMcpSource.tsx index 0224724e..f7e59cf7 100644 --- a/packages/plugins/mcp/src/react/AddMcpSource.tsx +++ b/packages/plugins/mcp/src/react/AddMcpSource.tsx @@ -487,7 +487,7 @@ export default function AddMcpSource(props: {

    Add MCP Source

    -

    +

    Connect to an MCP server to discover and use its tools.

    @@ -550,7 +550,7 @@ export default function AddMcpSource(props: { )}
    -

    +

    Supports Streamable HTTP and SSE transports.

    @@ -581,7 +581,7 @@ export default function AddMcpSource(props: {

    {probe.serverName ?? probe.name}

    -

    +

    {probe.connected ? `${probe.toolCount} tool${probe.toolCount !== 1 ? "s" : ""} available` : "OAuth required to discover tools"} @@ -590,14 +590,14 @@ export default function AddMcpSource(props: { {probe.connected ? ( Connected ) : ( OAuth required @@ -625,7 +625,7 @@ export default function AddMcpSource(props: { > None - + no auth header @@ -640,7 +640,7 @@ export default function AddMcpSource(props: { > Header - + use a secret-backed auth header @@ -655,7 +655,7 @@ export default function AddMcpSource(props: { > OAuth - + sign in with the server's OAuth flow @@ -710,7 +710,7 @@ export default function AddMcpSource(props: { {state.step === "oauth-starting" && (

    - Starting authorization… + Starting authorization…
    )} @@ -751,7 +751,7 @@ export default function AddMcpSource(props: { )} {remoteAuthMode === "none" && probe.requiresOAuth && ( -

    +

    This server requires authentication before it can be added.

    )} @@ -764,7 +764,7 @@ export default function AddMcpSource(props: {
    -

    +

    Plaintext headers sent with every request. Use authentication for secret-backed auth headers.

    @@ -790,7 +790,7 @@ export default function AddMcpSource(props: { className="rounded-lg border border-border bg-card p-3 space-y-2" >
    -
    @@ -927,7 +927,7 @@ export default function AddMcpSource(props: { placeholder="-y chrome-devtools-mcp@latest" className="font-mono text-sm" /> -

    +

    Space-separated arguments passed to the command.

    @@ -956,14 +956,14 @@ export default function AddMcpSource(props: { rows={3} className="font-mono text-sm" /> -

    One per line, KEY=value format.

    +

    One per line, KEY=value format.

    {/* Stdio error */} {stdioError && (
    -

    {stdioError}

    +

    {stdioError}

    )} diff --git a/packages/plugins/mcp/src/react/EditMcpSource.tsx b/packages/plugins/mcp/src/react/EditMcpSource.tsx index 379beadf..a89591d4 100644 --- a/packages/plugins/mcp/src/react/EditMcpSource.tsx +++ b/packages/plugins/mcp/src/react/EditMcpSource.tsx @@ -89,7 +89,7 @@ function RemoteEditForm(props: {

    Edit MCP Source

    -

    +

    Update the endpoint and headers for this MCP connection.

    @@ -98,7 +98,7 @@ function RemoteEditForm(props: {

    {props.sourceId}

    - + remote
    @@ -126,13 +126,13 @@ function RemoteEditForm(props: { value={entry.name} onChange={(e) => updateHeader(i, "name", (e.target as HTMLInputElement).value)} placeholder="Header name" - className="h-8 text-xs font-mono flex-1" + className="h-8 text-sm font-mono flex-1" /> updateHeader(i, "value", (e.target as HTMLInputElement).value)} placeholder="Header value" - className="h-8 text-xs font-mono flex-1" + className="h-8 text-sm font-mono flex-1" />
    )} @@ -181,7 +181,7 @@ function StdioReadOnly(props: {

    Edit MCP Source

    -

    +

    Stdio MCP sources cannot be edited in the UI. Modify the executor.jsonc config file directly.

    @@ -194,7 +194,7 @@ function StdioReadOnly(props: { {command} {(args ?? []).join(" ")}

    - + stdio
    @@ -225,7 +225,7 @@ export default function EditMcpSource({

    Edit MCP Source

    -

    Loading configuration…

    +

    Loading configuration…

    ); diff --git a/packages/plugins/mcp/src/react/McpSourceSummary.tsx b/packages/plugins/mcp/src/react/McpSourceSummary.tsx index f0a3ee7b..1d89e477 100644 --- a/packages/plugins/mcp/src/react/McpSourceSummary.tsx +++ b/packages/plugins/mcp/src/react/McpSourceSummary.tsx @@ -7,10 +7,10 @@ import { Badge } from "@executor/react/components/badge"; export default function McpSourceSummary({ sourceId }: { readonly sourceId: string }) { return ( - + MCP - {sourceId} + {sourceId} ); } diff --git a/packages/plugins/onepassword/src/react/OnePasswordSettings.tsx b/packages/plugins/onepassword/src/react/OnePasswordSettings.tsx index b77858e4..a5eb2daf 100644 --- a/packages/plugins/onepassword/src/react/OnePasswordSettings.tsx +++ b/packages/plugins/onepassword/src/react/OnePasswordSettings.tsx @@ -74,7 +74,7 @@ function VaultPicker(props: { if (!account) { return ( -

    +

    Enter account details to load vaults.

    ); @@ -90,7 +90,7 @@ function VaultPicker(props: { if (v) props.onVaultSelect(v.id, v.name); }} > - + @@ -103,7 +103,7 @@ function VaultPicker(props: { {error && (
    -

    +

    {error}

    @@ -182,7 +182,7 @@ function ConfigDialog(props: { {isEdit ? "Edit 1Password" : "Connect 1Password"} - + Link a vault to resolve secrets via the 1Password desktop app or a service account. @@ -190,14 +190,14 @@ function ConfigDialog(props: {
    {/* Auth method */}
    -
    @@ -322,19 +322,19 @@ export default function OnePasswordSettings() {
    -

    1Password

    +

    1Password

    {isLoading ? ( ) : isError ? ( - + Error ) : config ? ( - + Connected ) : ( - + Not configured )} @@ -345,7 +345,7 @@ export default function OnePasswordSettings() {
    ); } diff --git a/packages/react/src/components/code-block.tsx b/packages/react/src/components/code-block.tsx index 8df77586..d188f3ed 100644 --- a/packages/react/src/components/code-block.tsx +++ b/packages/react/src/components/code-block.tsx @@ -110,14 +110,14 @@ export function CodeBlock(props: {
    {title && (
    - + {title} diff --git a/packages/react/src/components/expandable-code-block.tsx b/packages/react/src/components/expandable-code-block.tsx index 97e6fade..52dbb95f 100644 --- a/packages/react/src/components/expandable-code-block.tsx +++ b/packages/react/src/components/expandable-code-block.tsx @@ -369,13 +369,13 @@ export function ExpandableCodeBlock(props: { variant="ghost" size="icon-xs" onClick={handleCopy} - className="absolute right-2 top-2 z-10 rounded-md border border-border bg-card/90 p-1.5 text-muted-foreground/40 opacity-0 backdrop-blur-sm hover:text-foreground group-hover:opacity-100 transition-opacity" + className="absolute right-2 top-2 z-10 rounded-md border border-border bg-card/90 p-1.5 text-muted-foreground opacity-0 backdrop-blur-sm hover:text-foreground group-hover:opacity-100 transition-opacity" title="Copy to clipboard" > {copied ? : } -
    +        
               
                 
             

    Connect an agent

    -

    {description}

    +

    {description}

    @@ -72,7 +72,7 @@ export function McpInstallCard(props: { className?: string }) { ))}
    - and more + and more
    @@ -87,7 +87,7 @@ export function McpInstallCard(props: { className?: string }) { -

    +

    {isDev ? "Uses the repo-local dev CLI. Run from the repository root." : "Requires the executor CLI on your PATH."} diff --git a/packages/react/src/components/schema-explorer.tsx b/packages/react/src/components/schema-explorer.tsx index c5341f01..5aa0db8a 100644 --- a/packages/react/src/components/schema-explorer.tsx +++ b/packages/react/src/components/schema-explorer.tsx @@ -181,7 +181,7 @@ const mergeAllOf = (schemas: JsonSchema[], root: JsonSchema): JsonSchema => { // Type label styling — plain text, no colored pills // --------------------------------------------------------------------------- -const typeClasses = "font-mono text-[0.6875rem] leading-5 text-muted-foreground"; +const typeClasses = "font-mono text-xs leading-5 text-muted-foreground"; // --------------------------------------------------------------------------- // PropertyRow @@ -255,14 +255,14 @@ function PropertyRow(props: {

    {typeLabel}

    {!hideRequiredBadge && (required ? ( -

    +

    required

    ) : ( -

    optional

    +

    optional

    ))} {schema.default !== undefined && ( -

    +

    = {JSON.stringify(schema.default)}

    )} @@ -272,7 +272,7 @@ function PropertyRow(props: { {/* Description — below the row */} {description && (

    {description} @@ -298,7 +298,7 @@ function PropertyChildren(props: { schema: JsonSchema; root: JsonSchema; depth: if (depth > 6) { return ( -

    +

    Nested too deep to display.

    ); @@ -357,7 +357,7 @@ function PropertyChildren(props: { schema: JsonSchema; root: JsonSchema; depth: return (

    0 ? { paddingLeft: `${depth * 16 + 16}px` } : undefined} > {label} @@ -446,7 +446,7 @@ export function SchemaExplorer(props: { schema: unknown; title?: string }) { + {countLabel} ) : undefined diff --git a/packages/react/src/components/tool-tree.tsx b/packages/react/src/components/tool-tree.tsx index 6308b5f3..8ead4136 100644 --- a/packages/react/src/components/tool-tree.tsx +++ b/packages/react/src/components/tool-tree.tsx @@ -254,14 +254,14 @@ export function ToolTree(props: { return (

    - + setSearch(e.target.value)} placeholder={`Filter ${tools.length} tools…`} aria-label="Filter tools" - className="h-auto min-w-0 flex-1 rounded-none border-0 bg-transparent p-0 text-[0.75rem] shadow-none outline-none placeholder:text-muted-foreground/50 focus-visible:border-transparent focus-visible:ring-0" + className="h-auto min-w-0 flex-1 rounded-none border-0 bg-transparent p-0 text-xs shadow-none outline-none placeholder:text-muted-foreground focus-visible:border-transparent focus-visible:ring-0" /> {search.length > 0 && ( ); } diff --git a/packages/react/src/pages/secrets.tsx b/packages/react/src/pages/secrets.tsx index e1d80d17..92035bef 100644 --- a/packages/react/src/pages/secrets.tsx +++ b/packages/react/src/pages/secrets.tsx @@ -103,7 +103,7 @@ function AddSecretDialog(props: { open: boolean; onOpenChange: (v: boolean) => v New secret - + Store a credential or API key. Values are kept in your system keychain when available, with a local encrypted file fallback. @@ -114,7 +114,7 @@ function AddSecretDialog(props: { open: boolean; onOpenChange: (v: boolean) => v
    @@ -123,13 +123,13 @@ function AddSecretDialog(props: { open: boolean; onOpenChange: (v: boolean) => v placeholder="github-token" value={id} onChange={(e) => setId((e.target as HTMLInputElement).value)} - className="font-mono text-[13px] h-9" + className="font-mono text-xs h-9" />
    @@ -138,7 +138,7 @@ function AddSecretDialog(props: { open: boolean; onOpenChange: (v: boolean) => v placeholder="GitHub PAT" value={name} onChange={(e) => setName((e.target as HTMLInputElement).value)} - className="text-[13px] h-9" + className="text-sm h-9" />
    @@ -146,7 +146,7 @@ function AddSecretDialog(props: { open: boolean; onOpenChange: (v: boolean) => v
    @@ -156,7 +156,7 @@ function AddSecretDialog(props: { open: boolean; onOpenChange: (v: boolean) => v placeholder="ghp_xxxxxxxxxxxxxxxxxxxx" value={value} onChange={(e) => setValue((e.target as HTMLInputElement).value)} - className="font-mono text-[13px] h-9" + className="font-mono text-xs h-9" />
    @@ -164,10 +164,10 @@ function AddSecretDialog(props: { open: boolean; onOpenChange: (v: boolean) => v
    @@ -176,18 +176,18 @@ function AddSecretDialog(props: { open: boolean; onOpenChange: (v: boolean) => v placeholder="GitHub API auth" value={purpose} onChange={(e) => setPurpose((e.target as HTMLInputElement).value)} - className="text-[13px] h-9" + className="text-sm h-9" />
    setSecretId((e.target as HTMLInputElement).value)} placeholder="my-api-token" - className="h-8 text-xs font-mono" + className="h-8 text-sm font-mono" />
    -
    - +
    - {error &&

    {error}

    } + {error &&

    {error}

    }