Connect Account Dialog
Integration connect dialog listing exact OAuth scopes, a minimal-scope trust note, and both an OAuth button and an API key path.
Integration connect dialog listing exact OAuth scopes, a minimal-scope trust note, and both an OAuth button and an API key path.
Search blocks by description or jump to a page.
The source for every Application block is included with Basic and Pro. Pick a plan to copy the code.
Already purchased? Log in
Connect Account Dialog is the static blueprint for the integration-connect entry point. The dialog opens with a GH monogram icon and the title Connect GitHub, linking repositories to Acme projects. Below it a ruled table lists the three permissions the connection will receive: Read repositories and branches (repo:read), Post deploy statuses on commits (statuses:write), and Read organization member list (org:read), each with its scope code right-aligned. A ShieldCheck callout reads We request the minimum scope needed. We do not read repository contents, issue data, or private email addresses. The primary action is Continue with GitHub OAuth; below an or divider the API key path offers a GitHub personal access token Input with a note that the token is stored encrypted and Acme disconnects the moment it is revoked on the GitHub side. Save token is disabled until a token is entered.
Permissions are a typed array. The two paths, OAuth and API key, satisfy the two user types: teams on GitHub Apps and solo developers with a PAT.
Reach for this block on the integrations settings page as the entry-point dialog for any OAuth or token-based service connection. Swap the service name, logo, and permissions array for each integration; the two-path layout works for any provider that supports both flows.
A natural flow around it on an Application Pro page:
Before
After
One strong use is the GitHub repository integration. Other connect-account patterns:
Tip: listing every scope with its code string is the difference between a permission dialog and a trust signal.