## What kind of change does this PR introduce?
Feature + docs. Closes
[DEPR-604](https://linear.app/supabase/issue/DEPR-604/define-connect-logo-asset-and-variant-contract).
## What is the current behavior?
`/authorize` logo resolution trusted self-asserted requester `name` (and
similar) for curated MCP marks, fell back to a letter tile when there
was no usable icon, and always used theme-reactive tile chrome. This
includes the scenario when pairing against unclassified uploaded OAuth
app bitmaps.
## What is the new behavior?
- [Documents the Connect logo asset/variant
contract](https://design-system-git-danny-depr-604-connect-logo-contract-supabase.vercel.app/design-system/docs/ui-patterns/connect-interstitials#logos)
(default to light, keep pairs matched, no theme-recolour of vendor
SVGs).
- Resolves curated partner logos from allowlisted `redirect_uri` hosts
only (`claude.ai` / `anthropic.com`, `cursor.com` / `cursor.sh`,
`chatgpt.com` / `openai.com`, `perplexity.ai`).
- Unknown / missing / failed requester icons show `SupabaseLogo` alone
(no letter tile).
- Uploaded organisation OAuth app icons (unclassified bitmaps) pair with
fixed light tile chrome (`border-black/10 bg-white` / `SupabaseLogo
forceLight`) on both sides across Studio themes.
- Curated partners keep theme-reactive tiles and may use dark assets
when available.
### To test
Real MCP clients (Claude, Cursor, etc.) only send users to
**production** `/authorize`, so you cannot drive a local or preview
Studio build from those tools. Use a Network override instead:
1. Start Studio and sign in (`pnpm dev:studio`, or use the Vercel
preview once available).
2. Open `/dashboard/authorize?auth_id=foo` (any `auth_id` is fine — the
real response may 404).
3. DevTools → **Network** → find `GET
…/platform/oauth/authorizations/foo` (or whatever id you used).
4. Right-click → **Override content** (enable Local Overrides / pick a
folder if prompted).
5. Paste one of the payloads below (status **200**), save, then reload
the authorize page.
6. Keep `expires_at` in the future so the request does not look expired.
The fields that matter for this PR are `name`, `icon`, and
`redirect_uri`.
#### Curated pair (allowlisted redirect)
Expect Cursor mark + Supabase pair. Toggle light/dark: curated dark
assets may swap; tiles stay theme-reactive (`bg-surface-75`).
```json
{
"name": "Cursor",
"website": "https://cursor.com",
"icon": null,
"domain": "cursor.com",
"redirect_uri": "https://cursor.com/callback",
"expires_at": "2099-01-01T00:00:00.000Z",
"scopes": ["organizations:read", "projects:read"],
"approved_at": null,
"registration_type": "dynamic"
}
```
#### Unknown → Supabase alone
Expect Supabase bolt alone. No letter tile. No curated mark even if
`name` says Claude.
```json
{
"name": "Acme",
"website": "https://acme.example",
"icon": null,
"domain": "acme.example",
"redirect_uri": "https://acme.example/callback",
"expires_at": "2099-01-01T00:00:00.000Z",
"scopes": ["organizations:read", "projects:read"],
"approved_at": null,
"registration_type": "dynamic"
}
```
#### Spoofed trusted name, non-allowlisted redirect (logo only)
Expect Supabase alone (no Claude mark). This PR does **not** show the
impersonation caution (that is coming in #48162).
```json
{
"name": "Claude",
"website": "https://claude.ai",
"icon": null,
"domain": "claude.ai",
"redirect_uri": "https://evil.com/callback",
"expires_at": "2099-01-01T00:00:00.000Z",
"scopes": ["organizations:read", "projects:read"],
"approved_at": null,
"registration_type": "dynamic"
}
```
#### Uploaded OAuth app icon → forced-light pair
Expect remote icon + Supabase pair with forced-light tiles
(`border-black/10 bg-white`) on both sides in light and dark Studio
themes. The icon URL below is the checked-in solid-colour Acme bitmap on
this branch.
```json
{
"name": "Acme",
"website": "https://acme.example",
"icon": "https://raw.githubusercontent.com/supabase/supabase/danny/depr-604-connect-logo-contract/apps/design-system/public/img/icons/acme-oauth-icon.png",
"domain": "acme.example",
"redirect_uri": "https://acme.example/callback",
"expires_at": "2099-01-01T00:00:00.000Z",
"scopes": ["organizations:read", "projects:read"],
"approved_at": null,
"registration_type": "static"
}
```
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* Improved authorization interstitial branding with trusted requester
logos and safer fallback behavior.
* Added support for consistent light-theme treatment of uploaded OAuth
app icons.
* Added examples and documentation for unknown requesters, uploaded
logos, and wrong-account states.
* **Bug Fixes**
* Prevented unverified or unavailable requester icons from being
presented as trusted.
* Ensured logo pairing remains visually consistent across light and dark
themes.
* **Tests**
* Added coverage for trusted-host validation, fallback branding, icon
loading failures, and theme behavior.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
---------
Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
* feat: tidy up header on mobile
* fix: graceful searchbar header
* fix: header classes and unused elements
* feat: trim down logo on header
* fix: logos again
* chore: remove dead code
* fix: classic dark logo header
* fix: page padding tidy ups
* fix: some font sizing
* feat: updated homepage cards
* fix: toc layout
* fix: toc again
* feat: homepage cards all the same size
* fix: footer paddings
* fix: pager if only 1 directional item
* fix: sidebar padding issues
* chore: killing all the defaults
* fix: import for side nav
* fix: sidebar complaining about dialog title
* fix: homepage paddings
* fix: killing one more default export
* feat: update colours icon to francescos
* fix: loose repeated copy
* Refactor Drawer component and add date-fns dependency
Refactored the Drawer component for improved slot-based structure, updated styles, and added 'use client' directive. Added 'date-fns' as a dependency in design-system, updated tsconfig paths for icons, and marked ToggleGroup as a client component.
* nit: add env for svg path
* fix: instructions
* chore: new generated llms
* Rebuild the pnpm-lock file.
* fix: update vaul dep in ui for drawer
* chore: update radix dialog deps
* fix: clipPath prop on chart tooltip svg
* fix: update dialog deps
* fix: update hover card deps
* fix: remove legacy next link from nav menu docs
* fix: radio group dep update
* fix: scroll area example key
* fix: sheet form readOnly
* fix: slider dep update
* fix: hide empty toast view
* fix: toggle and toggle group dep update
* Rebuild the lockfile.
* chore: updating branch
* fix: remove unused prop in docs
Removes unused prop on Drawer component inside docs causing type error
* Update apps/design-system/registry/default/example/scroll-area-demo.tsx
Co-authored-by: Danny White <3104761+dnywh@users.noreply.github.com>
* chore: remove commented out menu item
* chore: remove types/node in common
---------
Co-authored-by: Jonathan Summers-Muir <MildTomato@users.noreply.github.com>
Co-authored-by: Danny White <3104761+dnywh@users.noreply.github.com>
Co-authored-by: Ivan Vasilov <vasilov.ivan@gmail.com>
Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
* add filter bar component
* update filter bar demo
* add custom component support
* filter bar component
* example filter bar in use
* remove search filter
* reinstate older filter bar
* revert
* update registry
* update example name
* clean up example imports
* Update FilterBar.tsx
---------
Co-authored-by: Jonathan Summers-Muir <MildTomato@users.noreply.github.com>