Billing Settings
Settings
Source and install need .
pnpm dlx shadcn@latest add @assembli/connected-appsConnected Apps
The integrations page of app settings: a row per app with its tile, what it does and where it stands. Connected apps show who they're connected as, when they last synced and a sync switch; Manage lists granted permissions and holds Disconnect, which confirms inline. Connect shows Authorizing… while OAuth runs, lapsed access turns amber with Reconnect, and a filter and search sit on top.
- Dependencies
- lucide-react(npm, opens in a new tab)
Props
Other props pass through to the root element.
apps
ConnectedApp[]
defaultApps
ConnectedApp[]
Default
[]onAppsChange
(apps: ConnectedApp[]) => void
onConnect
(app: ConnectedApp) => Promise<ConnectResult> | ConnectResult
Runs the authorization, e.g. an OAuth popup. Resolving connects the app; rejecting shows an error on its row.
onDisconnect
(app: ConnectedApp) => Promise<void> | void
onSyncChange
(app: ConnectedApp, sync: boolean) => Promise<void> | void
now
string
Reference time (ISO) for "Synced 4 min ago". Defaults to the visitor's clock after hydration.
toolbar
boolean
Default
trueShow the All / Connected filter and the search field.
title
React.ReactNode
Default
"Connected apps"description
React.ReactNode
Default
"Bring your tools together. Connections apply to everyone i…
| Description | |||
|---|---|---|---|
| apps | ConnectedApp[] | – | |
| defaultApps | ConnectedApp[] | [] | |
| onAppsChange | (apps: ConnectedApp[]) => void | – | |
| onConnect | (app: ConnectedApp) => Promise<ConnectResult> | ConnectResult | – | Runs the authorization, e.g. an OAuth popup. Resolving connects the app; rejecting shows an error on its row. |
| onDisconnect | (app: ConnectedApp) => Promise<void> | void | – | |
| onSyncChange | (app: ConnectedApp, sync: boolean) => Promise<void> | void | – | |
| now | string | – | Reference time (ISO) for "Synced 4 min ago". Defaults to the visitor's clock after hydration. |
| toolbar | boolean | true | Show the All / Connected filter and the search field. |
| title | React.ReactNode | "Connected apps" | |
| description | React.ReactNode | "Bring your tools together. Connections apply to everyone i… |
