DeleteCompanyAddressButton

A button that opens the delete confirmation, for a surface whose trigger is a button.

import { DeleteCompanyAddressButton } from "@evolve-storefront/feature-organization/delete-company-address-button";

Renders inside OrganizationProvider.

Design notes

Owns the open state and nothing else. Reach for DeleteCompanyAddressDialog directly from a row action, where the trigger is a menu item.

Preview

DefaultOpen in Storybook ↗

Usage

Confirming runs the delete against the mock transport and closes the dialog.

// In a card's footer: the mutation is bound inside, and the address book
// query is invalidated on success.
<AddressCardFooter>
  <DeleteCompanyAddressButton address={address} />
</AddressCardFooter>;

Props

Prop	Type	Description
address	Address
children?	ReactNode	An optional trigger, rendered inside the dialog so it can open it. Omit it when driving open yourself — which is the case a row action needs.
defaultOpen?	boolean
onDeleted?	(() => void)

Change the layout

Pass children to DeleteCompanyAddressButton to arrange its parts yourself. Every part is exported from @evolve-storefront/feature-organization/delete-company-address-button.

DeleteCompanyAddressDialogThe confirmation for deleting a company address: the copy, the destructive tone and the pending label, in one place.

Takes open / onOpenChange, and renders no trigger unless given one. A menu item cannot be an AlertDialogTrigger — the menu closes on select and unmounts the item, taking the trigger with it before the dialog has opened — so a component that owns its own boolean is unusable exactly where a per-record delete lives. See ActionsMenu, which documents the same constraint from the menu's side.

Prop	Type	Description
address	Address
open?	boolean	Controlled open state. Omit to let the dialog own it.
onOpenChange?	((open: boolean) => void)
defaultOpen?	boolean
onDeleted?	(() => void)
children?	ReactNode	An optional trigger, rendered inside the dialog so it can open it. Omit it when driving open yourself — which is the case a row action needs.

Examples

With Own TriggerA caller-supplied trigger replaces the default button.

<DeleteCompanyAddressButton address={address} onDeleted={onDeleted}>
  <Button variant="tertiary" tone="destructive">{t("delete-address")}</Button>
</DeleteCompanyAddressButton>;

Open in Storybook ↗