Data controls

Pro

Control over the account's data: facts about how it's used (from the service), an export, deleting thread history, and deleting the account. Destructive steps say exactly what goes and ask you to type the account's name; the account delete is owner-only and says so to everyone else. Deleting history and exporting can be locked with a reason the same way.

Markdown

Preview

Install

With the Candor CLI

First time? Get started sets up the registry and theme. Or with shadcn directly: npx shadcn@latest add @candor/data-controls

Brings in: button, locale, locked, relative-time, type-to-confirm, utils · npm: lucide-react@^1.67.0

Usage

TSX · The example above

"use client"

import * as React from "react"
import { DataControls, type ExportState } from "@/components/data-controls"

export default function Example() {
  const [exportState, setExportState] = React.useState<ExportState>({ kind: "idle" })
  return (
    <DataControls
      className="max-w-xl"
      account="Acme"
      statements={["Never used to train models", "Encrypted at rest and in transit", "Only your members can open your threads"]}
      exportState={exportState}
      onExport={() => setExportState({ kind: "preparing", startedAt: new Date().toISOString() })}
      exportIncludes="Every thread, run log and approval, as JSON in a zip."
      onDeleteHistory={() => {}}
      historyNote="Removes every thread and its messages. Run logs and the audit log stay."
      onDeleteAccount={() => {}}
      deleteAccountLocked="Only the account owner can delete the account."
      whatDeleteRemoves={["Every thread, run and approval", "Connections to your repositories", "All members’ access"]}
    />
  )
}

<DataControls>

Prop	Type	Default	Description
accountrequired	`string`	—	The account's name; destructive steps ask for it typed exactly.
statementsrequired	`string[]`	—	How data is used, one sentence each, e.g. "Never used to train models".
exportStaterequired	`ExportState`	—	Where the export is: idle, preparing, ready to download, or failed.
onExportrequired	`() => void`	—	Start an export.
onDeleteHistory	`(() => void) \| undefined`	—	Delete all thread history. Without it, the row isn't shown.
onDeleteAccount	`(() => void) \| undefined`	—	Delete the account. Without it, the row isn't shown.
deleteAccountLocked	`string \| undefined`	—	Why the viewer can't delete the account (non-owners).
deleteHistoryLocked	`string \| undefined`	—	Why the viewer can't delete thread history, e.g. "Only owners can delete data." The row shows, locked.
exportLocked	`string \| undefined`	—	Why the viewer can't export, e.g. "Only admins can export."
whatDeleteRemovesrequired	`string[]`	—	What deleting the account removes, from the service.
exportIncludesrequired	`string`	—	What the export contains, from the service.
historyNoterequired	`string`	—	What deleting history removes and keeps, from the service.
className	`string \| undefined`	—	Extra classes for the outer element.

Strings

The fixed words, in English by default. Change any of them under dataControls in <LocaleProvider strings={{ … }}>; the table is exported as dataControlsStrings.

Key	English
label	Data controls
typeToConfirm	Type {account} to confirm.
typeExactly	Type the account name exactly.
cancel	Cancel
deleteAllThreads	Delete all threads
deleteTheAccount	Delete the account
exportEverything	Export everything
preparing	Preparing since {since}. You can leave this page.
ready	Ready. The link expires {expires}.
exportFailed	Export failed: {reason}
download	Download
export	Export
tryAgain	Try again
deleteThreadHistory	Delete thread history
deleteHistory	Delete history
deleteAccount	Delete account

Types

ExportState: { kind: "idle" } | { kind: "preparing"; startedAt: string } | { kind: "ready"; href: string; expiresAt: string } | { kind: "failed"; reason: string }