Commit Graph
9 Commits
Author SHA1 Message Date
Danny WhiteandJoshen Lim e19cd1863d feat(studio): connect logo contract for authorize (#48161)
## 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>
2026-07-23 02:20:42 +10:00
Francesco Sansalvadore ae52e9093d Chore: design system favicon (#42336)
- add favicon to the design system app
- fix broken introduction pages
2026-02-01 12:15:41 +01:00
kemal.earth b97e41e20b chore(design-system): tidy up mobile styling (#41267)
* 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
2025-12-12 10:08:48 +00:00
kemal.earth 0d224c3aae feat(design-system): remove llms from design system (#38376)
feat: remove llms from design system

This removes the llm generator script from design system.
2025-09-02 10:53:19 +01:00
6851d7a5ba fix(design-system): missing path and deps (#38307)
* 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>
2025-09-02 09:54:06 +01:00
Saxon FletcherandJonathan Summers-Muir 98ae279a2b Add's a filter bar component to design system (#35238)
* 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>
2025-04-25 15:11:28 +08:00
Jordi Enric e8bc81e2ad feat: add llms txt (#34017)
* feat: add llms txt

* add logs
2025-03-05 17:38:26 +01:00
Ivan Vasilov 1b1d748ed6 fix: Fix missing images in the design-system app (#27953)
Add images for all themes. Fix the links to the images.
2024-07-12 12:53:29 +02:00
b8243e06d8 Feat/design system site (#26586)
* init site

* add nav menu

* add props table component

* init all the examples

• also includes moving a bunch of ./ui files to ./ui-patterns

* update package

• might need to remove some of these

* Update rehype-component.ts

* move nav

* more changes

* add new source information to contentlayer

* fix copy buttons

* add text-confirm. start new concept of "fragments"

* move base path. add homepage. add theme selection

* added colors

* add form-item-layout

* temporary fix code blocks in light mode. they currently don't switch theme to theme

* start adding code themes

* Update dark.json

* update code block themes

* fix animations

* add cdmk search

* export registry of icons in ./icons package

* add comments

* add icon copy stuff

* Update icons.tsx

* more docs

* more docs. cleaned up colors and icons docs

* Update theming.mdx

* add more docs

* update

* add package

* Update tailwind.config.js

* update content

* Update drawer-demo.tsx

* Update aspect-ratio-demo.tsx

* add new blocks

* Update source-panel.tsx

* Update source-panel.tsx

* Update source-panel.tsx

* add new source block

* Update source-panel.tsx

* Update _app.tsx

* Update page.tsx

* Delete layout-old.tsx

* remove old themes

* remove old ui registry

* comment out nav items

* Update package-lock.json

* Update AssistantChatForm.tsx

* move back

* move again

* update

* Update index.tsx

* Update package-lock.json

* Update package-lock.json

* Update package-lock.json

* update package

* udpate prettier

* fix tag issues

* Update package-lock.json

* update to contentlayer2

* update package-lock.json

* fix type errors

* ignore spelling

* Update avoid-typos.yml

* Update avoid-typos.yml

* Update package-lock.json

* Use ui type definitions.

* move tsconfig base stuff. fix content layer issue

* Update package-lock.json

* Update package-lock.json

---------

Co-authored-by: Alaister Young <a@alaisteryoung.com>
Co-authored-by: Ivan Vasilov <vasilov.ivan@gmail.com>
2024-05-23 17:39:56 +08:00