Files
PaperClipAI/maps/feature-map/connection-setup.md
T
TonioandPaperclip 56517dda6c fix(ui): bundle connector, toolbar, empty-state and agent roster fixes (#18716)
## Thinking Path

> - Paperclip is the open source app people use to manage AI agents for
work.
> - Operators use connector setup, collection headers, empty states, and
agent lists to manage that work.
> - Provider redirects replace the setup page, and collection controls
use different sizes.
> - Agent selection inserts a bar above the list. The row link
highlights only part of the row.
> - This pull request keeps sign-in in a separate window and applies the
Tasks control sizes to collection and audit headers.
> - It also reuses artifact artwork for empty collections and gives
agent selection a fixed action card.
> - These changes preserve the operator's place and keep controls and
rows stable.

## Linked Issues or Issue Description

**What happened?**

Connector sign-in replaced the current page. Inline collection controls
had different heights. Projects and Artifacts used small placeholder
empty states. Agent selection moved the list, hover covered only the
identity cell, and chat/status shared that cell without matching
headings.

**Expected behavior**

Provider sign-in opens in a new tab or window. Collection controls match
Tasks. Empty collections use the large artifact graphics. Agent actions
float above the page while rows remain aligned.

**Steps to reproduce**

Start connector sign-in from a page or dialog. Compare collection and
Audit headers. Open an empty Projects or Artifacts collection. Select an
agent, then hover across its row.

Related public work: #13584 covers an earlier connector new-tab
implementation, including same-page fallbacks that this bundle does not
use. #8528 covers Tasks toggle sizing. #17742 covers scoped agent Audit
sections. This bundle does not change server callback or audit
authorization contracts.

## What Changed

- Reserve a separate authorization window during the click. Use
validated sign-in URLs, retain a new-tab fallback, and close blank
windows after failed requests. Store Cloud reauthentication state in the
destination window.
- Use the Tasks 44px control foundation for shared collection headers
and Audit, Costs, Timeline, Secrets, Teams, Gateways, and agent skill
controls.
- Use a large artifact stack with an off-white Paperclip image with a
dark icon for Projects and artifact Tasks empty states. Use one matching
artifact for other types. Set 20px gaps and use the label “Create
project”. Action hover and keyboard focus animate the artwork.
- Portal agent bulk actions to a fixed card 48px above the bottom safe
area. Use quintic entry/exit motion and respect reduced motion. Retain
card contents during exit.
- Give chat and status separate cells, add a Status heading, use the
MessagesSquare chat action with a hover tooltip, and highlight the
entire row.
- Add linked agent chips and a manager picker to the agent profile.
Block self and descendant manager choices. Keep the name crown and
custom title inline during edits.
- Update design guidance, the connection maps, regression tests, and
empty-state Storybook fixtures.

## Verification

- Final commit `a41a6c6494a839deaaec1ef7cc50c90078ab6381`: all 55 checks
passed, three skipped. [Canonical CI
run](https://github.com/paperclipai/paperclip/actions/runs/41999792769)
includes all eight browser shards and all server/runner/workspace
groups. Greptile: 5/5, zero unresolved review findings.
- Workspace typecheck/build passed. Local UI suite passed 11,006 tests
in 880 files, plus 542 CLI tests. Subsequent connector callback changes
passed all 245 AppsConnect tests, UI typecheck, token gates, and
query-error policy checks. Manager cache/error regressions passed four
tests. Map checks passed.
- Local connector browser suite: 20 passed. All six chat integration
shards: 1,931 passed. Workspace B groups passed; database tests passed
313 cases across 72 files with one worker.
- Browser preview verified agent manager changes, overview links, inline
name/title geometry, empty-state colors, row actions and the chat
tooltip. Live provider consent and post-deployment feature verification
remain separate from these fixtures.
- Preserved failures: ten bulk-roster tests initially missed the
portaled action card; their selectors were fixed and all twelve roster
tests passed. A nested fixture selected pnpm 11 and removed local
dependencies; the local shim now pins pnpm 9. Embedded PostgreSQL native
links were restored. A Python 3.9 fixture failure passed all 19 tests
with the current runtime. Concurrent local database startup failures
passed on the one-worker rerun.
- The broad local serialized server run passed 3,791 tests with one
scheduling assertion failure, which passed in isolation. The local
general-server run reproduced a native recovery provider/model fixture
failure and has not completed. These server sources are unchanged by
this bundle; all final canonical CI server shards passed. This is not a
claim that every broad local run passed.
- [Earlier CI
run](https://github.com/paperclipai/paperclip/actions/runs/41995119880)
failed a browser test during cleanup when heartbeat-run cancellation hit
a PostgreSQL lock timeout. All final browser shards passed without
weakening that test.
- Review follow-ups cover Slack popup/fallback recovery, a single
artwork hover transform, shared manager error rendering, detached
standalone OAuth windows, and verified task-bound callbacks in both
hosts.

## Risks

- Browser popup policy and provider callback behavior can affect sign-in
completion. The original setup page stays open; blocked windows have an
explicit recovery path.
- Shared toolbar styles affect several surfaces. Menu content remains in
its existing portals; canonical label tabs and search clear buttons
retain their own geometry.
- No schema, server, API authorization, or migration change.
- Required CI and review are complete. Deployment provenance and hosted
feature verification are checked separately after merge.

## Model Used

OpenAI Codex, GPT-6 family, with reasoning, repository tools, test
execution, and browser inspection. The exact model ID and context-window
size were not exposed in this session.

## Checklist

- [x] I have included a thinking path that traces from project context
to this change
- [x] I have specified the model used (with version and capability
details)
- [x] I have checked ROADMAP.md and confirmed this PR does not duplicate
planned core work
- [x] I have searched GitHub for duplicate or related PRs and linked
them above
- [x] I have either (a) linked existing issues with `Fixes: #` / `Closes
#` / `Refs #` OR (b) described the issue in-PR following the relevant
issue template
- [x] I have not referenced internal/instance-local Paperclip issues or
links (only public GitHub `#NNN` / `github.com/paperclipai/paperclip`
URLs)
- [x] My branch name describes the change (e.g. `docs/...`, `fix/...`)
and contains no internal Paperclip ticket id or instance-derived details
- [x] I have run relevant tests locally and they pass (broader local
exceptions are recorded above)
- [x] I have added or updated tests where applicable
- [x] I have updated relevant documentation to reflect my changes
- [x] I have considered and documented any risks above
- [x] All Paperclip CI gates are green
- [x] Greptile is 5/5 with no open P2s, recommendations, or follow-ups
- [x] I will address all Greptile and reviewer comments before
requesting merge

---------

Co-authored-by: Paperclip <noreply@paperclip.ing>
2026-11-05 01:23:53 -08:00

296 lines
18 KiB
Markdown

---
navigation: {"section":"Apps, channels, and extensions","sectionOrder":50,"order":10}
---
# Connection setup
People connect an app or account, choose who may use it, and recover incomplete
setup from either Apps or a task that needs access. A saved draft, a completed
provider login, a usable connection, and a resumed task are separate checkpoints.
Chat channels additionally require an endpoint and linked sender identity.
Google runtime setup offers a Gemini API key or a separate local Antigravity
browser sign-in. The browser redirect requires no pasted code; setup displays
the verified Google email before Connect. Connection setup does not qualify the
pending Antigravity execution profile. See [AI connections](../../doc/connections/AI-CONNECTIONS.md#local-subscription-sign-in).
Feature ID: `connection-setup`.
Agent access: [companion](../agent-access-map/connection-setup.md).
Prompt Injection Prevention reuses shared OpenRouter API-key setup directly from
Settings → Connections. It adds no Apps provider or transport. Credential ownership
and audience rules are the existing connection rules; saving a connection alone
does not activate the service. See [service configuration](../../doc/prompt-injection-prevention.md).
1Password is available from Apps with a service-account token and an official
service-account creation link. Its vault access is chosen in 1Password; action
policies use the ordinary Permissions screen. See [connector notes](../../doc/connections/1PASSWORD.md).
## Sub-features
- `catalog`: `connection-setup/catalog` — find a provider, inspect its available methods, and open setup;
unavailable methods explain their prerequisite rather than silently switching.
- `identity-and-access`: `connection-setup/identity-and-access` — select personal/shared identity and eligible agents;
an empty explicit selection and company-wide access must not be confused.
- `credentials`: `connection-setup/credentials` — provider sign-in, key, or generic MCP URL follows its supported
setup method; credentials are not retained in browser draft storage.
- `handoff`: `connection-setup/handoff` — provider sign-in opens in a separate tab/window; its callback returns to the correct setup
host with the original task intent and identity choice intact.
- `draft-recovery`: `connection-setup/draft-recovery` — cancel, Back, Save & exit, reload, Finish setup, and reconnect
preserve the exact draft rather than creating duplicate connections.
- `task-request`: `connection-setup/task-request` — only the addressed person resolves the requested connection;
usable access releases the pending task request through normal continuation.
- `channel-setup`: `connection-setup/channel-setup` — provider endpoint, represented agent, linked sender, and
communication instructions are configured before an external message is used.
- `failure`: `connection-setup/failure` — denied login, unreachable/private URL, expired credentials, and
permission errors leave an actionable state rather than a false success.
## How to get to it (user POV)
### `apps-catalog`
Open Apps (`/apps`), choose an app, and connect from its landing page. Select an
available method and access, then complete setup. Existing connections open
their details; unfinished ones offer a way to finish setup.
### `mcp-link`
Use **Connect with a link** or `/apps/byo` for a generic MCP server. Paste its
URL, select access, and follow the probe's sign-in/key guidance. Provider-specific
catalog setup and a generic endpoint may use different flows.
### `task-request`
Open the task's pending connection request and its setup action as the named
user. Setup can open in a task dialog; provider sign-in always uses a separate window/tab. Follow the
request's original link if setup falls back to a standalone page.
### `resume-connection`
From Apps or connection details, use Finish setup, reconnect, or the offered
authentication recovery action. Reload or return from the provider before
checking whether the same saved connection became usable.
### `chat-channel`
With chat connectors enabled, select a supported chat/email provider in Apps
or open `/apps/chat/connect`. Complete that provider's endpoint setup, then
open its settings (`/apps/chat/:endpointId/settings`). Follow identity linking
as the intended sender before messaging the agent externally.
### `delegated-configuration`
Ask a standard agent to configure a disposable app or account from its assigned
task. The agent uses REST or admitted native `search_api` / `call_api`, reuses
saved accounts and drafts, and returns the exact saved setup link when human
authentication, consent, credential entry or identity confirmation is required.
Open that link as the addressed person. Personal ownership stays with that
person; audit attribution stays with the acting agent. Existing agents retain
their explicit grants and restrictions. See the [access companion](../agent-access-map/connection-setup.md)
and [native admission contract](../agent-access-map/README.md#native-rest-transport).
## Driving it with Playwright and the Paperclip CLI
Preconditions: follow the [baseline](./README.md#before-driving-a-journey).
Choose a disposable provider account/resource and record its auth method,
deployment mode, account ownership, and access selection. For live setup, use
the provider's documented prerequisites in the
[connector playbook](../../doc/connections/CONNECTOR-PLAYBOOK.md). Automated fixtures
do not establish OAuth registration, public callbacks, or production provider access.
### `apps-catalog`
Automated: [Browse](../../ui/src/pages/apps/Browse.test.tsx),
[unconnected app](../../ui/src/pages/apps/AppNotConnected.test.tsx), and
[AppsConnect](../../ui/src/pages/apps/AppsConnect.test.tsx) cover catalog entry,
access selection, provider-specific method choices, and setup failures with
mocked APIs. [Connection intents](../../tests/e2e/connection-intents.spec.ts)
drives store and task setup against one fake provider through a useful continuation:
```sh
pnpm exec vitest run ui/src/pages/apps/Browse.test.tsx ui/src/pages/apps/AppsConnect.test.tsx
pnpm exec playwright test -c tests/e2e/playwright.config.ts tests/e2e/connection-intents.spec.ts
```
Manual: connect from an unconnected provider landing. Select the intended
identity and agent access, complete authentication, reload, and inspect the
saved connection. Run a permitted read-only action with an eligible agent and
verify its useful result. Try an ineligible agent and confirm denial. Repeat
with a user who cannot install company-wide; the UI must not imply broad access.
Notebook is internally gated by `enablePaperclipNotebook` (default off, no settings toggle). Disabled instances hide setup/discovery and deny curated Notebook dispatch and publishing; local removal and grant revocation remain available.
Availability is catalog metadata evaluated by shared connector checks. Notebook
publication and file uploads stay in the Notebook service.
Paperclip Notebook uses the existing personal-account MCP OAuth setup at
`https://notebook.paperclip.app/mcp`. Sign in through Cloud, assign agents, and
verify tool discovery. The connection keeps its default catalog name.
Reconnect must preserve agent assignments and Allowed / Ask first / Off choices.
Removal disables local use and clears saved credentials. Remote authorization
can be revoked separately in Notebook's Connected apps screen; automatic remote
cleanup and custom keyed refresh recovery are deferred. A lost rotating-token
response may require reconnecting. Notebook tools use the selected connection's
ordinary action gateway. See [Notebook](../../doc/connections/PAPERCLIP-NOTEBOOK.md)
for the Notebook-owned uploader and fixture coverage. Live Notebook qualification
still requires the deployed service and both hosted and self-hosted clients.
Daytona follows this same key/access wizard. Its native method exposes the
published platform and Toolbox HTTP actions using provider sandbox IDs, without
a Paperclip task or lease requirement. [Daytona browser setup](../../tests/e2e/daytona-connector.spec.ts)
checks the catalog, password field, access controls, and optional organization
pin. It does not submit a key or qualify a real provider account. See
[Daytona](../../doc/connections/DAYTONA.md) for API-key authority and OAuth limits.
For Braintrust, verify US OAuth (default), US API key, EU OAuth, and EU API key
from both Apps and `/apps/connect?source=braintrust`. Inspect the exact regional
endpoint and method after Save & exit, cancellation/resume, and reconnect;
these operations must retain the saved connection and its access choices.
Verify the key stays out of browser draft storage and public responses, then
perform a bounded read and disposable write through an actual eligible run.
The [Braintrust qualification matrix](../../doc/connections/BRAINTRUST.md#qualification-record)
records completed US OAuth connect/discovery, bounded read, synthetic write
through actual process-agent gateway calls, catalog refresh, reconnect, local
removal, and structural redaction. US API-key and both EU methods still need
account-bound proof. Live token expiry/refresh, remote OAuth revocation, and
native CLI automatic capability delivery remain unqualified; public metadata
and fixtures do not establish those results.
Unikraft follows the same key/access wizard. Setup asks only for the API token;
the default metro is an optional select under Advanced, and each action can name
another published metro. [Unikraft browser setup](../../tests/e2e/unikraft-connector.spec.ts)
checks the catalog, password field, access controls and the advanced metro. It
does not submit a token or qualify a real provider account. See
[Unikraft](../../doc/connections/UNIKRAFT.md) for token authority and metros.
### `mcp-link`
Automated: AppsConnect's generic MCP cases cover probe-driven auth, private or
unreachable endpoints, preregistered clients, secret-backed headers, and unsafe
authorization URLs. These are component/API mocks, not remote provider proof.
[Catalog publication](../../server/src/__tests__/tool-catalog-publication.test.ts)
uses PostgreSQL and a controlled MCP response to check bounded writes, repeated
page entries, preserved action choices, rollback, and concurrent publication.
It does not verify a live provider's discovery contract.
Manual: connect a known test MCP URL through the link flow, verify its saved
endpoint and a read-only action, then repeat with a bad URL and wrong credential.
The error should explain the next action and preserve non-secret setup context.
Test no-auth and authenticated endpoints separately; never infer one from the other.
### `task-request`
Automated: [interaction card](../../ui/src/components/IssueThreadInteractionCard.test.tsx)
checks addressed-user controls. AppsConnect tests cover page/dialog parity,
task-bound OAuth, popup handoff, and verifying a saved connection before closing.
Withdrawn requests render a terminal acknowledgement with no setup action; the
interaction-body test and narrow Storybook journey cover this recovery state.
The connection-intents browser suite above exercises fixture-backed continuation.
Manual: ask an agent to use an unavailable app, open its request as the named
user, and complete setup in the dialog. Verify the card settles, the exact task
resumes, and the agent returns a useful provider result. Repeat the page-host
fallback and denied OAuth path. As another user, confirm that merely seeing the
task does not grant the right to resolve the request.
### `resume-connection`
Automated: AppsConnect tests cover exact-draft resume, declined OAuth, reconnect
lookup failure/retry, response-lost creation, archived connection revival, and
saved account reuse. [App detail](../../ui/src/pages/apps/AppDetail.test.tsx) covers
the connection host. These tests do not complete a real provider login.
Manual: leave setup through its footer, reload Apps, choose Finish setup, and
confirm the same connection is resumed. Decline provider login and recover from
that checkpoint. Reconnect an expired disposable account and verify a permitted
action afterwards. Count connections before/after to catch accidental duplicates.
### `chat-channel`
Automated: [setup routing](../../ui/src/pages/apps/chat/ChatEndpointSetup.routing.test.tsx),
[saved setup state](../../ui/src/pages/apps/chat/ChatEndpointSetup.state.test.ts),
[email setup](../../ui/src/pages/apps/chat/EmailEndpointSetup.test.tsx), and
[identity confirmation](../../ui/src/pages/apps/chat/ChatIdentityConfirm.test.tsx)
cover shared UI logic with fixtures. Provider-specific live setup is not implied.
[Channel integration](../../server/src/__tests__/chat-channels.integration.test.ts)
also covers bounded Telegram subscription recovery at startup and after committed
configuration changes, saved retry deadlines, rollback, and parking pending
repair while an endpoint or connection is inactive. The provider responses are
fixtures. Settled maintenance leaves no discovery timer or database scans.
GitHub Cloud setup also covers an older empty-queue backoff, concurrent setup and
background leases, and retry after a Cloud error in the
[event poller regression](../../server/src/services/github-connection-events.test.ts).
Channel integration checks that active setup drains its signed ping through the
normal webhook handler; a forged ping still cannot verify the endpoint. These
fixtures do not establish live Cloud delivery. For live proof, start a disposable
App after an idle personal GitHub connection, complete installation, and confirm
that the same draft advances after authenticating the queued ping.
Manual: complete setup for one named provider, reload endpoint settings, link
the intended sender, and send a disposable message. Verify one task and a useful
reply in the originating conversation. Inspect an unlinked sender's denial and
the endpoint's pause behavior. Repeat independently for each provider at issue;
Slack setup does not qualify Discord, Telegram, GitHub, email, or iMessage.
### `delegated-configuration`
Automated: [agent-authenticated integration](../../server/src/__tests__/connection-management.integration.test.ts)
uses production agent creation, persistent keys, run JWTs, native tool bindings,
human sessions, PostgreSQL and deterministic provider fixtures. It covers saved
setup, ownership, attribution, scope, trust, work modes and revocation. The
[Google service picker tests](../../ui/src/features/connections/GoogleWorkspaceServices.test.tsx)
cover pending choices, consent precedence and failed grant loading with API mocks.
These are separate from live provider setup and model success.
Manual: Have the agent perform authorized setup, then open its saved handoff as
the addressed person. Reload before completing the required human step; verify
the same resource, saved access choices, human ownership and acting-agent audit
remain. Complete the step, verify the exact task continues, and confirm that
revoked authority or cancelled work prevents continuation. An ordinary bot-token
repair or an unchanged credential must not complete a signing-key request.
## Gotchas
- For connecting an assistant to Paperclip itself, use [Assistant connections (MCP)](./assistant-connections.md). This recipe's MCP-link journey connects Paperclip to an external app server.
- Private endpoint rejection depends on deployment: owned loopback MCP servers
are supported in local-trusted/private instances. Public authenticated
deployments apply the private-network restriction.
- A successful OAuth callback is not proof of saved connection access or task
continuation. Verify all three checkpoints.
- Personal identity, shared account access, and per-agent access are distinct.
Connecting an account does not waive an Off action or Ask first review.
- A tool app connection is not a chat endpoint. The same provider can offer both.
- Old Apps/Connections URLs can redirect to Apps. Use the current navigation and
record the actual destination rather than documenting an obsolete screen.
- Full provider matrix, AI-account selection, gateway/profile administration,
and account revocation lifecycles remain outside this seed recipe.
- For governed actions after setup, use [questions and approvals](./questions-and-approvals.md).
### Documentation scope: App catalog and connection setup
Provider-specific authentication/revocation, credential-only accounts, and aggregator administrative variants still need their own detailed matrices.
Supabase and Vercel deployment connections (2026-10-22): Apps offers Supabase
browser sign-in, hosted MCP personal access token, and project-scoped Management
API methods, plus Vercel's team-scoped access token method. Supabase's optional
MCP project pin leaves project creation available when unset; the native method
requires a project and offers Edge Function deployment and selected configuration.
Vercel supports preview/production deployment, build settings, environment
variables and existing domain attachment. Personal/shared credential ownership,
action permissions, reconnect and removal use the regular setup flow. See
[Supabase](../../doc/connections/SUPABASE.md) and
[Vercel](../../doc/connections/vercel.md) for method boundaries and qualification.
For these native methods, continue past a successful connection test into an
actual native agent task: readiness, assigned-tool delivery, and task-card reuse
must all work. The 2026-10-23 walkthrough exposed and repaired omitted REST
admission at those boundaries. Verify a served deployment and provider settings,
not only the catalog action count. Vercel preview requires an existing deployment;
its provider makes the first deployment production, so an empty-project preview
must fail before submission and explain the explicit production prerequisite.