Components / Connection Request Card
Connection Request Card
A living, inline request to connect a signal provider. The same card remains in place as a connection moves from available through working, ready, failed, or skipped.
import { ConnectionRequestCard } from '@layers/ui/connection-request-card'Rendered stock
House rules
- The card is controlled. Its caller owns provider state and callbacks; the component never starts OAuth, polls, persists, or interprets an outcome.
- Use PlatformIcon through provider.platform for supported providers. Pass provider.icon for any other provider instead of substituting a Lucide brand glyph.
- Available offers Connect and Not now. Connecting keeps Connect in place as a loading button. Failed offers Retry and Not now. Settled states have no dead actions.
- Pass canonical provider identity exactly as it should render. Social usernames are bare, without an @ prefix, following the AccountIdentity rule.
- Progress is determinate and clamped from 0 to 100. Omit it when duration is unknown.
- The visible badge and live status carry the state. Healthy, working, and complete states use the ok status contract; failed is error-only.
- Place one card per provider. Do not collapse multiple providers into one card or put provider buttons in a prose message.
- Say what the connection grants us in accessClaim, and what it buys the user in reason. accessClaim is a standing fact, so it shows in every state, including settled ones, and never replaces the state line the way detail does.
- The access claim is prose and stays prose. It never becomes a link, a disclosure toggle, or a Manage permissions button.
- The access claim states the real grant. If the OAuth scopes include publishing or comment management, it does not say read-only, however much nicer that reads one click before the consent screen the provider is about to show.
- connectLabel overrides the button word only for a provider that links no account (the SDK, managed accounts). Every provider that really does connect one leaves it at Connect.
- Offering more than one provider at once wraps the cards in ConnectionRequestCardGroup with a label for the set. It renders a labelled list so each card is an item of a countable set, rather than a group inside a group.