CompanySwitcher

Switch the active company. Renders nothing when there is only one company. On selection it runs setActiveBusinessContext and calls onSwitched so the app can re-scope the session; with confirm, only after the buyer confirms.

import { CompanySwitcher } from "@evolve-storefront/feature-organization/company-switcher";

Renders inside OrganizationProvider.

Preview

DefaultOpen in Storybook ↗

Usage

const { data: companies = [] } = useQuery(businessUnitsQueryOptions({ gqlClient }));

// The switch re-scopes the session, so the app refetches what it rendered.
<CompanySwitcher companies={companies} onSwitched={() => router.refresh()} />;

Props

Prop	Type	Description
companies	BusinessUnitSummary[]	Companies the user can act within (from businessUnitsQueryOptions).
onSwitched?	((businessUnitId: string) => void)	Runs after the active company is switched (e.g. reload / re-scope).
storeKey?	string	Store key required by setActiveBusinessContext; falls back to the provider's.
confirm?	boolean	Ask before switching, where prices and addresses on screen would change, as in a checkout.

Any other props go to the root element, like on a plain HTML element.

Examples

ConfirmIn a checkout the prices and addresses on screen belong to the company, so confirm asks before switching.

<CompanySwitcher companies={companies} confirm onSwitched={() => router.refresh()} />;

Open in Storybook ↗