Disconnect dialog

Letting a provider go, with the records DomainKit added as one decision: a switch over the exact cleanup plan, then the release of the connection itself.

disconnect-dialog asks one question rather than two. Confirming removes what this domain’s apply receipt proves DomainKit created, then releases the connection.

import { Domain } from "@domainkit/react";

import { DisconnectDialog } from "@/components/domainkit/disconnect-dialog";

import { PreviewRoot, previewDomain, previewRequirements } from "../../lib/preview-flow.tsx";

function Trigger() {
  const flow = Domain.useFlow({ domain: previewDomain, requirements: previewRequirements });
  return <DisconnectDialog flow={flow} />;
}

export default function DisconnectDialogExample() {
  return (
    <PreviewRoot connected>
      <Trigger />
    </PreviewRoot>
  );
}

Installation

npx shadcn@latest add https://domain-kit.dev/r/disconnect-dialog.json

pnpm dlx shadcn@latest add https://domain-kit.dev/r/disconnect-dialog.json

yarn dlx shadcn@latest add https://domain-kit.dev/r/disconnect-dialog.json

bunx shadcn@latest add https://domain-kit.dev/r/disconnect-dialog.json

What it offers

The cleanup plan is built when the dialog opens, so what would be removed is on screen while the customer decides rather than after. Only an apply receipt proves DomainKit created anything, so the switch appears over records or not at all, and a plan with nothing in it goes straight to the release.

Releasing a connection takes every domain on it, so a shared connection asks which the customer meant: this domain alone detaches, and every domain ends the connection.

API

Boundary

Cleanup is separate from apply and bound to a receipt: it removes only what an apply proved DomainKit created, and never a record the customer wrote themselves.