Commit Graph
23 Commits
Author SHA1 Message Date
Danny White ec53175b8a refactor(ui): rename text-brand to text-primary (#50564)
## What kind of change does this PR introduce?

Refactor. Follow-up to #49871.

## What is the current behavior?

Branded (green) text still uses the `text-brand` classname while the
colour comes from `--primary`.

## What is the new behavior?

**Rename-only:** `text-brand` → `text-primary` across callsites and
docs. Leftover `bg-brand` / `border-brand` alias to `brand-default`. No
intentional colour changes in this PR.

This better matches how we treat our green in other components and
props, like `variant="primary"` for green buttons.

## To test

On light mode: smoke-test that branded text still looks like #49871
(readable green, not the bright fill).

-
[Homepage](https://zone-www-dot-com-git-dnywh-depr-316-text-brand-de2380-supabase.vercel.app/):
“Scale to millions” uses `text-primary`
- [Docs
homepage](https://docs-git-dnywh-depr-316-text-brand-to-primary-supabase.vercel.app/docs):
branded links like “More on self-hosting” are still readable
- [Typography
docs](https://design-system-git-dnywh-depr-316-text-brand-to-primary-supabase.vercel.app/design-system/docs/typography):
documents `text-primary`
- [Colour
usage](https://design-system-git-dnywh-depr-316-text-brand-to-primary-supabase.vercel.app/design-system/docs/color-usage):
`text-primary` is visibly darker than `bg-brand-default` _on light mode_
- [Studio auth
providers](https://studio-staging-git-dnywh-depr-316-text-brand-to-60fa6c-supabase.vercel.app/dashboard/project/_/auth/providers):
enabled provider badge text readable; status dot stays bright green

<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit

* **Style**
* Updated branded text, link hover states, icons, badges, indicators,
and highlighted content across the Design System, Docs, Studio, Learn,
UI Library, and marketing experiences to use the primary theme color.
* Updated syntax highlighting and table-of-contents styling for
consistent primary-color presentation.
  * Refined brand color fallback behavior for bright fills and borders.

* **Documentation**
* Updated color-usage and typography guidance to recommend the primary
text utility.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2026-09-22 16:19:03 +10:00
Danny White 1131e3e2ce fix(ui): default Button variant to default instead of primary (#50160)
## What kind of change does this PR introduce?

Bug fix / design-system alignment for the legacy `Button` from `ui`.

## What is the current behavior?

Omitting `variant` on the legacy `Button` falls back to brand-green
`primary`. That makes accidental greens easy, and it is hard to spot the
real main action on busy pages.

## What is the new behavior?

- Legacy `Button` now defaults to neutral `default`
- Intentional primary CTAs (create, save, submit, marketing CTAs, and
matching `ButtonTooltip` usages) now set `variant="primary"` so their
appearance is unchanged
- Neutral actions that previously relied on the old fallback (cancel,
close, back, dashboard nav, and similar) become grey/white
- Design-system docs updated; regression tests cover the new default

`Button_Shadcn_` is unchanged. It already uses its own CVA default.

This is PR 1 of 2 in a stack. PR 2 drops now-redundant
`variant="default"` props.

## To test

Studio (http://localhost:8082):

- `/sign-in`: Sign in stays green
- Open a project → Database → Tables: New table stays green
- Auth → Users → Invite: Invite user stays green; Cancel / dismiss
controls stay neutral
- Project Settings → General: edit a field so Cancel and Save appear.
Cancel is neutral, Save is green

Design system (http://localhost:3003):

- Components → Button: default demo is neutral; primary demo is green;
featured preview is the default variant

Marketing (optional):

- www header: Start your project stays green; logged-in Dashboard is
neutral

<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit

- **Style**
- Buttons now default to a neutral style, while primary actions across
Studio, documentation, marketing pages, forms, dialogs, and error states
use prominent primary styling.
- Updated button examples and previews clarify the distinction between
default and primary variants.
  - Event registration now includes a directional arrow icon.

- **Tests**
- Added coverage confirming default button styling and explicit primary
styling behave as expected.
- Updated related test fixtures to use primary styling where
appropriate.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2026-09-10 11:23:17 +10:00
2bc6144aec fix(studio): guard unguarded requester.name reads on the OAuth authorize and apps pages (#49267)
<!-- ccr-slack-attribution -->
_Requested by **Ali Waseem** · [Slack
thread](https://supabase.slack.com/archives/C063LNYJJKS/p1787146439389169)_

## I have read the
[CONTRIBUTING.md](https://github.com/supabase/supabase/blob/master/CONTRIBUTING.md)
file.

YES

## What kind of change does this PR introduce?

Bug fix.

## What is the current behavior?

Opening `/authorize` for an OAuth app whose `name` the platform API
omitted crashed the entire page with `TypeError: Cannot read properties
of undefined (reading 'toLowerCase')`
([SUPABASE-APP-K7E](https://supabase.sentry.io/issues/7679644991/)). The
user got a full-page error instead of a consent screen, and could
neither authorize nor decline.

The same class of crash hit the project-level OAuth apps list
([SUPABASE-APP-JB1](https://supabase.sentry.io/issues/7502074939/)).
Typing in the search box called `.toLowerCase()` on `client_name` for
every app, so one app registered without a name broke search for the
whole list.

The project-claim page crashed the same way, reading the first character
of the name for the fallback avatar.

## What is the new behavior?

The trusted-partner helpers treat a missing name as "no trusted partner
matched" and return `null`. The apps filter treats a missing name or
client ID as "does not match the search string". The claim page falls
back to a placeholder initial instead of indexing into `undefined`.

The authorize page now renders normally, minus the optional
partner-impersonation caution, which cannot be evaluated without a name.

Three changes:

-
`apps/studio/components/interfaces/Organization/OAuthApps/OAuthApps.utils.ts`
— `findTrustedPartnerByName` accepts `string | null | undefined` and
returns `null` early on a falsy name; `getOAuthImpersonationWarning`'s
`name` param widened to match (its existing `if (!namedPartner) return
null` already handles the rest).
- `apps/studio/components/interfaces/Auth/OAuthApps/oauthApps.utils.ts`
— `filterOAuthApps` optional-chains `client_name` and `client_id` before
`.toLowerCase()`, defaulting each match to `false`.
-
`apps/studio/components/interfaces/Organization/ProjectClaim/confirm.tsx`
— `{requester.name?.[0] ?? '?'}` for the fallback avatar initial.

Each is a separate commit so any one can be dropped independently.

## Additional context

### Root cause, not fixed here

`apps/studio/data/api-authorization/api-authorization-query.ts:37`
returns `data as ApiAuthorizationResponse`, an unchecked cast with no
runtime validation, even though the openapi-fetch client already types
the endpoint from the generated schema. Both the generated
`GetOAuthAuthorizationResponse` and the hand-written local type declare
`name: string` as required, so this was invisible to TypeScript.

The durable fix is to derive the type from the schema and drop the cast,
which is the house pattern elsewhere in `apps/studio/data`, and to
correct the OpenAPI spec at source if the API can legitimately omit
`name`. Left out deliberately to keep this cherry-pickable.

### Not in scope

`requester.scopes` is optional in the schema but required in the local
type, and is read unguarded in several places. Defaulting it to `[]`
would tell a user an app requested no permissions on a live consent
screen, so it needs a product decision rather than a drive-by guard.

### Testing

No local checks were run. This clone has no `node_modules` and `pnpm
install` is blocked in the environment, so `npm run build`, typecheck,
lint, Prettier and tests were all left to CI. Please treat CI as the
verification for this PR.

There is also a coverage gap worth noting:
`apps/studio/tests/components/ApiAuthorization.test.tsx:48-62` hardcodes
`name: 'Test App'` in `createMockAuthResponse`, and no test omits the
field, which is why none of these crashes were caught.

---
_Generated by [Claude
Code](https://claude.ai/code/session_01P489vrPdHcJfMfzCGM9rZ5)_

---------

Co-authored-by: Claude <noreply@anthropic.com>
Co-authored-by: Ali Waseem <waseema393@gmail.com>
2026-08-19 14:23:54 -06:00
Danny White 840127cd69 let inline error callers own mutation failures (#48640)
## What kind of change does this PR introduce?

Code clean-up following #48470, #48471, #48472, #48473, and #48474.

## What is the current behavior?

Mutation hooks provide fallback error toasts, so callers that already
render errors inline must suppress those toasts with empty `onError`
handlers.

## What is the new behavior?

The affected callers own their error presentation. Inline interstitial
errors remain unchanged, API authorisation retains its state-reset
handlers, and Project Claim retains its combined caller-owned toast.

## To test

There is no useful before-and-after visual check for this PR: the
rendered error states should be identical on `master` and this branch.
The change only removes the default-toast and no-op-handler pair
underneath the UI.

The existing [Organisation
Invite](https://github.com/supabase/supabase/pull/48470), [API
authorisation, AWS
Marketplace](https://github.com/supabase/supabase/pull/48471), and
[Stripe Projects](https://github.com/supabase/supabase/pull/48472)
failure tests cover the inline errors and confirm that no duplicate
toast appears.
2026-08-06 16:06:38 +07:00
Alaister YoungandAlaister Young ca2b50a0a7 chore(ui-patterns): collapse the admonition shim into ui-patterns/Admonition (#48377)
Follow-up to #48344: collapses the two resolution paths for the
Admonition module into one.

`src/admonition.tsx` was a back-compat shim re-exporting
`src/Admonition/`. Two ways to resolve one module is exactly what
produced the macOS self-import bug fixed in #48344, and the local
typecheck errors that #48374 worked around. This removes the shim and
standardizes on the PascalCase subpath, matching every other export in
the package.

**Changed:**

- Codemodded all 246 `ui-patterns/admonition` imports to
`ui-patterns/Admonition` (240 `.tsx`, 5 `.mdx`, 1 `.ts` across studio,
docs, www, design-system, and lite-studio)
- Pointed the 5 internal `'../admonition'` imports back at the
`'../Admonition'` directory

**Removed:**

- `packages/ui-patterns/src/admonition.tsx`, and its `./admonition`
entry in the exports map (regenerated with `pnpm gen:exports`)

## To test

- `grep -r "ui-patterns/admonition" --include='*.ts*'` → no hits
- `pnpm test:case-hazards` → passes
- `pnpm typecheck` → all 15 tasks green
- `pnpm --filter studio run lint:ratchet` → passes
- `pnpm --filter ui-patterns vitest run src/Admonition` → 11 tests pass

<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->

## Summary by CodeRabbit

* **Bug Fixes**
* Standardized Admonition component imports across the application and
documentation.
* Improved compatibility with case-sensitive environments by using the
canonical component path.
  * Removed the legacy Admonition import entry point.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->

---------

Co-authored-by: Alaister Young <10985857+alaister@users.noreply.github.com>
2026-07-29 00:48:56 +08:00
Gildas Garcia 0713a1efc1 chore: remove shadcn suffix for Input, Textarea, Alert and Collapsible (#45867)
## Problem

Now that we migrated old components to their new shadcn alternatives, we
don't need the `_Shadcn_` suffix anymore.

## Solution

Remove it

<img width="659" height="609" alt="image"
src="https://github.com/user-attachments/assets/2d7271a9-066a-4dcc-92fe-729b106d2c2f"
/>
2026-05-15 14:55:37 +02:00
Ivan VasilovandJordi Enric 56de26fe22 chore: Migrate the monorepo to use Tailwind v4 (#45318)
This PR migrates the whole monorepo to use Tailwind v4:
- Removed `@tailwindcss/container-queries` plugin since it's included by
default in v4,
- Bump all instances of Tailwind to v4. Made minimal changes to the
shared config to remove non-supported features (`alpha` mentions),
- Migrate all apps to be compatible with v4 configs,
- Fix the `typography.css` import in 3 apps,
- Add missing rules which were included by default in v3,
- Run `pnpm dlx @tailwindcss/upgrade` on all apps, which renames a lot
of classes
- Rename all misnamed classes according to
https://tailwindcss.com/docs/upgrade-guide#renamed-utilities in all
apps.

---------

Co-authored-by: Jordi Enric <jordi.err@gmail.com>
2026-04-30 10:53:24 +00:00
Ivan Vasilov 308cd791a2 chore: Prep work for migrating to Tailwind v4 (#45285)
This PR preps the monorepo for a migration to Tailwind v4:
- Bump all Tailwind dependencies and libraries to the latest possible
version, while still compatible with Tailwind 3.
- Cleans up obsolete Tailwind 3 specific options and configs.
- Cleans up unused CSS files and fixes the CSS imports.
- Migrates all `important` uses in `@apply` lines to using the `!`
prefix.
- Move `typography.css` to the `config` package and import it from the
apps.
- Migrated all occurrences of `flex-grow`, `flex-shrink`,
`overflow-clip` and `overflow-ellipsis` since they're deprecated and
will be removed in Tailwind 4.
- Make the default theme object typesafe in the `ui` package.
- Migrate all `bg-opacity`, `border-opacity`, `ring-opacity` and
`divider-opacity` to the new format where they're declared as part of
the property color.
- Bump and unify all imports of `postcss` dependency.
2026-04-28 11:33:53 +02:00
Alex Hall d70ed2ef76 chore: Add new OAuth scopes for analytics config to studio (#44826)
## Summary

Adds support for new OAuth scopes for reading and writing analytics
config to the app creation dialog and consent screen.

Depends on https://github.com/supabase/platform/pull/31539
2026-04-15 15:59:43 -04:00
4a0bb36ca8 style: require sorted imports in studio/components (#44408)
Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>
Co-authored-by: Ivan Vasilov <vasilov.ivan@gmail.com>
2026-04-01 10:22:37 +02:00
Francesco Sansalvadore 156f904018 feat: floating mobile toolbar (#43444)
- move navigation components to `apps/studio/components/layouts/Navigation`
- add [FloatingMobileToolbar](https://github.com/supabase/supabase/pull/43444/changes#diff-3dffe47fd51ca851d612d8728e03b2dc344ec213d4f3a46a824d3fa32a7cc851) as quick access to tools such as search, assistant, inline editor, etc - behind feature flag and feature preview (true by default as it's a bit
annoying to have to enable it all the time as previews are stored in
local-storage)
- fix sidebar panels closing on viewport resizing (regression from previous pr)

https://github.com/user-attachments/assets/d6881e3b-5128-4306-bb82-3ca39c755dba

<img width="986" height="697" alt="Screenshot 2026-03-12 at 12 40 11"
src="https://github.com/user-attachments/assets/da8511e2-7d01-4237-b814-596031c747c5"
/>
2026-03-13 12:13:07 +00:00
Raúl BarrosoandIvan Vasilov 87e3e8aa2a feat(mgmt-api): add ability to choose orgs (#43549)
Related to
https://github.com/supabase/platform/compare/raulb/fix-API-906

---------

Co-authored-by: Ivan Vasilov <vasilov.ivan@gmail.com>
2026-03-11 09:01:49 +00:00
Ivan Vasilov 43cc61818c chore: Migrate all isPending uses in react-query (#40642)
* Bump react-query. Minor type and logic fixes.

* Migrate all use of isLoading to isPending in mutations.

* Fix type errors.
2025-11-20 16:44:53 +01:00
Joshen LimandAlaister Young 9efe2643e3 Joshen/fe 2141 swap organization settings page to use paginated projects (#40513)
* Use version 2 organization roles endpoint and fix all affected files + unit tests

* Update API codegen

* Replace all usage of old useProjectsQuery with useOrgProjectsInfiniteQuery

* Swap access callout for project roles to use collapsible instead

* Deprecate useProjectsQuery and clean up

* Update apps/studio/components/interfaces/Organization/TeamSettings/UpdateRolesPanel/UpdateRolesPanel.tsx

Co-authored-by: Alaister Young <alaister@users.noreply.github.com>

---------

Co-authored-by: Alaister Young <alaister@users.noreply.github.com>
2025-11-18 13:26:09 +08:00
Joshen Lim 64e3e047eb Final final cleaning up barrel files (#40018)
* Final final cleaning up barrel files

* Fix merge conflict
2025-10-31 14:02:59 +08:00
Ivan Vasilov da4a40e308 chore: Migrate RQ functions to use object syntax style (#39895)
* Migrate all uses of invalidateQueries to use object syntax.

* Migrate the remainder of useInfiniteQuery.

* Migrate all setQueriesData.

* Migrate all fetchQuery uses.

* Migrate some leftover functions from RQ.

* Fix issues found by Charis.
2025-10-28 10:43:14 +01:00
Ivan VasilovandWen Bo Xie 977b867bef fix: During project claim, disable the orgs for choosing who can't add another projects (#39398)
* If the auth id has already been used for approving the same org, ignore the error.

* Accidentally committed the wrong code while testing.

* Disable the choose org button if the org can't add more free projects.

* Hide the tooltip if the condition is met.

---------

Co-authored-by: Wen Bo Xie <wenbox323@gmail.com>
2025-10-25 14:17:19 +02:00
Ivan VasilovandCharis 0eec4e2247 feat: Redirect the user after claiming a project (#39527)
* Use the url in the response to redirect the user.

* Fix a title warning.

* Update apps/studio/pages/claim-project.tsx

Co-authored-by: Charis <26616127+charislam@users.noreply.github.com>

---------

Co-authored-by: Charis <26616127+charislam@users.noreply.github.com>
2025-10-17 09:23:30 +02:00
CharisandJoshen Lim 1b8c8b7398 fix(feedback): generate image urls on backend (#39559)
* fix(feedback): generate image urls on backend

* Fix support form skip generate attachment urls if no attachments

* Refactor to use useLocalStorageQuery

* Nit

---------

Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
2025-10-16 12:52:05 +08:00
Drake CostaandJoshen Lim fe07b07ffa Replace deprecated Alert in /claim-project page (#37962)
* replace deprecated alert

* Swap to use Admonition

---------

Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
2025-08-26 12:15:53 +08:00
Joshen Lim 1d85aa632b Consolidate oauth apps perms descriptions, and make project perms clearer (#37525) 2025-07-29 17:27:07 +08:00
Ivan Vasilov 885df2ff62 fix: When claiming a project, first authorize the oAuth app (#36329)
When claiming a project, first authorize the oAuth app.
2025-06-11 15:46:32 +02:00
Ivan VasilovandJoshen Lim 586a829828 feat: Project claim (#35992)
* Add another page for claiming a project.

* Fix a misspell.

* Minor fixes.

* Comment some test code.

* Update the design on the confirm step.

* Reorganize the authorize page. Bunch of design fixes for the claim page.

* Fix

* Delete added files my mistake.

* Separate claim-project and authorize pages. Minor design fixes.

* Add more logs to the generate claim button.

* snapshot.

* Add more copy to the three steps.

* Make the claim URL button better.

* Add missing comma.

* Fix unneeded changes.

* Make the header full width.

* Fix all comments by Joshen.

* Clean up extra code.

* Forgotten some things to clean.

---------

Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
2025-06-10 11:49:23 +03:00