Commit Graph

27 Commits

Author SHA1 Message Date
Ivan Vasilov
df002b4018 fix: Fix a type error in List JIT access API (#49612)
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->

## Summary by CodeRabbit

* **Bug Fixes**
* Improved database access rule handling by excluding records without an
associated user.
* Preserved valid user-rule mappings while preventing incomplete entries
from being included.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2026-08-27 14:14:50 +00:00
Ivan Vasilov
b5477a89a3 chore: Update API types (#48981)
Update the API types by running `api:codegen`. Some of the changes are
fixed in code, some of the type changes had to be reverted (JIT Access,
SSO features).

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

* **Billing**
  * Updated subscription messaging to reflect AWS Marketplace billing.
  * Removed outdated partner-billing downgrade notices.

* **Bug Fixes**
* Improved request handling for API keys, custom domains, SQL snippets,
branches, and storage operations.
  * Improved legacy signing-key compatibility.
  * Refined temporary database access availability messaging.

* **Updates**
  * Removed Fly as an available cloud provider for region selection.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2026-08-13 09:48:13 +02:00
Etienne Stalmans
51c5b9f013 chore: sync ssl enforcement and temporary access (#48743)
## 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?

Chore - fix-up

## What is the current behavior?

Temporary access depends on ssl enforcement. The frontend doesn't
enforce this very well or keep state between the two configs.

## What is the new behavior?

This updates the two configs to be interdependent and updates to each
one triggers a frontend state change on the other.

## Additional context

Before:



https://github.com/user-attachments/assets/8f040b62-587c-4268-9e27-27dd09b052a3



After:



https://github.com/user-attachments/assets/c62e006e-6147-4c94-b6cf-375ca300b890



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

- **New Features**
- Added confirmation dialogs and downtime warnings before changing
database SSL enforcement.
- Added loading states and success or failure notifications for SSL
updates.
- Enabled SSL enforcement directly from temporary database access
settings.

- **Bug Fixes**
- Prevented SSL enforcement from being disabled while temporary database
access is enabled.
  - Improved settings refresh after SSL enforcement changes.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2026-08-06 10:52:37 +02:00
Joshen Lim
fcfb0f0222 Refactor all usage of form.watch to either useWatch or subscribe (#48436)
## Context

Replaces all usage of `form.watch()` to use `useWatch` instead + follows
the "name what you watch" convention as specified in the react-hook-form
skills.

There's also a small refactor in `SmtpForm.tsx` which removes the
unnecessary use of a `useState` to track if SMTP is enabled or not

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

* **Improvements**
* Updated many Studio forms to watch specific fields more precisely,
improving live UI updates for previews, warnings, conditional sections,
and validation messages.
* Enhanced responsiveness across settings, authentication, billing,
storage, integrations, and support flows while keeping save/update
behavior the same.
* **Refined Experiences**
* Improved the analytics table creation flow with tighter, enum-based
column type validation and structured, type-specific column options.
* **Preserved Behavior**
* Maintained existing permission checks, submission flows, and
account-management workflows.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2026-07-30 11:45:40 +08:00
Saxon Fletcher
ad203ae277 Merge compute and disk into Infrastructure (#48370)
## Summary

This is the final step in merging compute and disk with infrastructure
to become a single place to manage everything. This moves everything
we've done in compute and disk over to infrastructure along with
redirects.

- Makes Infrastructure canonical for the completed compute and disk
configuration and usage charts.
- Moves Service Versions to General Project Settings.
- Removes the legacy Infrastructure activity implementation and
constants.
- Updates settings navigation, shortcuts, banners, billing links,
warning CTAs, usage pages, support suggestions, and other internal entry
points.
- Adds the permanent `/settings/compute-and-disk` redirect, removes its
Next and TanStack routes, regenerates the route tree, and updates the
migration checklist.
- Preserves query parameters and legacy metric anchors, including
`#cpu`.

## Stack

1. #48368
2. #48369
3. #48370 (this PR)

## How to test

1. Check out `chore/infra-compute-3-cutover`.
2. Test the Next implementation with `pnpm dev:studio`, then stop it and
test TanStack with `STUDIO_FRAMEWORK=tanstack pnpm dev:studio`.
3. In each implementation, open
`/project/<ref>/settings/infrastructure`. Confirm the page contains the
usage charts and the Scaling, Compute, Disk, and Advanced configuration
sections.
4. Open `/project/<ref>/settings/general`. Confirm Service Versions
appears there with its existing name, content, and styling, and no
longer appears on Infrastructure.
5. Open `/project/<ref>/settings/compute-and-disk?upgrade=micro#disk`.
Confirm it permanently redirects to
`/project/<ref>/settings/infrastructure?upgrade=micro#disk`, preserving
the query string and hash.
6. Confirm the settings menu exposes Infrastructure and no longer
exposes Compute and Disk. Repeat with platform and self-hosted settings.
7. Follow representative entry points from billing usage, resource
warning CTAs, upgrade banners, shortcuts, and support suggestions.
Confirm they land on Infrastructure and preserve any query parameters or
metric anchors such as `#cpu`.
8. Smoke-test compute and disk updates from Infrastructure, including
validation, the sticky review footer, and warning/critical chart states.


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

* **New Features**
* Consolidated compute and disk management under the **Infrastructure**
project settings page.
* Added a **Service versions** section to **General** project settings.
* **Bug Fixes**
* Updated links and upgrade CTAs across the product to route to the
correct **Infrastructure** or **Service versions** destinations.
* Added permanent redirects from legacy **Compute and Disk** to
**Infrastructure**, preserving query/hash.
  * Improved resource warning upgrade routing for compute scenarios.
* **Tests**
* Expanded automated coverage for **Infrastructure**, **Service
versions**, redirects, and warning-link routing.
* **Chores**
  * Updated ESLint rule baseline configuration for the studio app.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

---------

Co-authored-by: Alaister Young <10985857+alaister@users.noreply.github.com>
2026-07-29 19:26:28 +08:00
Alaister 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
Danny White
c8aca8d3a0 chore(design-system): standardise keyboard focus rings (#41575)
## 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?

UI / design-system consistency (accessibility).

## What is the current behavior?

Keyboard focus rings are inconsistent across Studio and `packages/ui`:

- Custom Button uses thick `outline` with per-variant colours (brand /
grey / destructive / warning)
- Form controls use muted grey rings (`ring-background-control`)
- Tabs / NavMenu / Radio use soft brand `ring-ring`
- Studio `.inset-focus` uses dark green `outline-brand-600`

Related: [DEPR-354](https://linear.app/supabase/issue/DEPR-354).

## What is the new behavior?

One shared focus recipe, exposed as Tailwind `@utility` classes in
`packages/config/css/utilities.css`:

| Utility | Use when |
| --- | --- |
| `focus-ring` | Buttons, inputs, most controls (offset ring) |
| `focus-inset` | Dense/flush surfaces such as interactive table rows
(renamed from `inset-focus`) |

```txt
# focus-ring
outline-hidden
focus-visible:ring-2
focus-visible:ring-ring
focus-visible:ring-offset-2
focus-visible:ring-offset-background
```

Applied on Button, shadcn form controls, Menu/NavMenu, Command palette
trigger, Studio table rows, and related call sites. Documented in the
design-system accessibility docs. Variants do not change focus ring
colour.

When the ring must appear on a different element than the focused one
(e.g. Menu + ProductMenu `Link` via `group-focus-visible`, or InputGroup
via `:has()`), keep an explicit ring stack. The utilities bake in
`:focus-visible` on the same element.

## Additional context

**Out of scope**

- Full `packages/ui` / Studio / www sweep
- Legacy Studio form-group green box-shadow cleanup
- ESLint rule for bare `outline-none`

## Test plan

Prefer Safari (“hard mode” for `tabIndex`). Expect one soft brand ring
everywhere: not grey, not solid green outline.

### Design system

- [ ]
[Accessibility](https://design-system-git-dnywh-choreimprove-tab-focus-styles-supabase.vercel.app/design-system/docs/accessibility):
recipe docs match what you see
- [ ]
[Button](https://design-system-git-dnywh-choreimprove-tab-focus-styles-supabase.vercel.app/design-system/docs/components/button):
Tab primary / default / danger; same ring colour
- [ ] [Table → Row-level
navigation](https://design-system-git-dnywh-choreimprove-tab-focus-styles-supabase.vercel.app/design-system/docs/components/table#row-level-navigation):
Tab an interactive row; inset outline (`focus-inset`) sits inside the
row

### Studio

- [ ] **Org home → table view** (`/organizations/_` or org projects):
switch to the table layout, Tab onto a project row; inset outline sits
inside the row (list/card view uses CardButton, not `focus-inset`)
- [ ] **Project sidebar** (Database, Auth, Storage, …): Tab the main
product nav links; ring follows the focused item (not the nested section
menus like Tables / Roles)
- [ ] **Storage → Files**: Tab a bucket row; same inset outline as org
table rows
- [ ] **Project Settings → General** (or Compute and Disk): Tab through
inputs, checkboxes, switches, selects; same offset ring, no ring on
mouse click
- [ ] **Header ⌘K** (desktop width): Tab to the search control after
Feedback; same soft brand `focus-ring` (was a thicker
`ring-border-strong` before)
- [ ] **Table Editor or SQL Editor tabs**: focus a tab, Tab to × if
active; close shows a ring
- [ ] **Light + dark**: ring stays visible against both backgrounds
2026-07-22 12:10:07 -04:00
Etienne Stalmans
05d5da0340 chore: add ssl_enforcement_required for jit (#48032)
## 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?

chore / bug fix

## What is the current behavior?

The new `ssl_enforcement_required` state is not handled

## What is the new behavior?

Displays the correct message




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

## Summary by CodeRabbit

* **Bug Fixes**
* Improved temporary database access messaging when SSL enforcement is
required.
* Added a direct action to open database settings and enable SSL
enforcement before activating temporary access.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2026-07-20 13:46:44 +02:00
Gildas Garcia
b30db91d71 chore: cleanup UI patterns exports (#47406)
## Problem

We now export components under a subpath in ui-patterns to avoid barrel
files as they slow down every tools (from IDE to linters, etc.) and may
also affect bundles our users have to download.

## Solution

- Remove the UI patterns index file
- Fix invalid impors
2026-06-30 09:23:17 +02:00
Gildas Garcia
c6fc456910 chore: cleanup duplicate exports studio (#47387)
## Problem

Knip reports many duplicate exports (both named and default). Besides,
we're moving away from default exports and even have an eslint rule to
enforce it on new code.

## Solution

- Cleanup those exports
- Update imports when necessary

No functional changes. If it builds, it's fine
2026-06-29 15:46:16 +02:00
Gildas Garcia
96d43099bb chore: refactor Button API so that it can be used a standard button (#46880)
## Problem

Our `<Button>` component breaks the default `button` contract by
redefining the `type` prop to set its variant (`primary`, `default`,
etc) instead of the button type (`submit`, `button`, etc).
This is confusing and forces to write more code when using it with
shadcn components that expect/inject the standard button props.

## Solution

- rename the `type` prop to `variant`
- rename the `htmlType` prop to `type`
- propagate the changes where necessary
- format code

## How to test

As this is just prop renaming, if it builds it's ok

---------

Co-authored-by: Ivan Vasilov <vasilov.ivan@gmail.com>
2026-06-16 23:59:58 +02:00
Danny White
331278bfe4 feat(studio): add async handling to AlertDialog actions (#45960)
## What kind of change does this PR introduce?

Feature, bug fix, and docs update. Addresses the AlertDialog async
action behaviour discussed in Slack and follow-up PR feedback.

## What is the current behavior?

`AlertDialogAction` delegates directly to Radix, so confirm actions
close the dialog immediately on click. Async mutation flows have to use
`asChild` with `event.preventDefault()` and a custom loading button to
keep the dialog open while work is in flight.

## What is the new behavior?

- `AlertDialogAction` now accepts async handlers and a controlled
`loading` prop. Promise-returning actions keep the dialog open, show the
existing Button loading state, disable cancel/dismissal while pending,
close on success, and stay open on rejection.
- Existing workaround usages in Studio have been migrated to the direct
action API (see 'To test' callsite list below)
- design-system docs now include async action examples and
`AlertDialogBody` guidance for inline feedback


https://github.com/user-attachments/assets/1af66410-e9f9-4231-9c6d-fe650bd717a4


## Additional context

- [ ] Once #45572 is rebased onto this change, `ResetTemplateDialog`
should use `AlertDialogAction loading={isResettingTemplate}` with a
promise-returning reset handler instead of a plain loading `Button` in
`AlertDialogFooter`.

## To test

- [x] On Studio API Keys settings, use a project with no publishable or
secret API keys, click the “Create API keys” banner action, and confirm
the Alert Dialog stays open with loading until the default publishable
and secret keys are created.
- [x] Delete a JIT database access rule and confirm the Alert Dialog
stays open with loading until deletion succeeds, and stays open with
inline feedback if it fails.
- [x] With temporary access disabled and existing rules configured,
enable temporary access and confirm the “This will activate existing
rules” Alert Dialog stays open with loading until the configuration
update succeeds, and stays open with inline feedback if it fails.
- [x] Disable external replication and confirm the Alert Dialog stays
open with loading until the mutation succeeds.
- [x] Enable Index Advisor and confirm the Alert Dialog stays open with
loading until the mutation succeeds, and stays open with inline feedback
if it fails.


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

* **New Features**
* Alert dialogs support async actions with built-in loading, dismissal
blocking while pending, and preserved dialog on error.
* Two interactive examples demonstrating async success and error flows.

* **Improvements**
* Dialogs now surface inline error messages and consistent
loading/confirm behavior across flows (create keys, replication, JIT DB
access, index advisor).
  * Minor UI refinements for action controls.

* **Documentation**
* Docs updated with async-action guidance and inline-error
recommendations.

* **Tests**
  * New test suite validating async dialog behaviors.

<!-- review_stack_entry_start -->

[![Review Change
Stack](https://storage.googleapis.com/coderabbit_public_assets/review-stack-in-coderabbit-ui.svg)](https://app.coderabbit.ai/change-stack/supabase/supabase/pull/45960)

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

---------

Co-authored-by: Gildas Garcia <1122076+djhi@users.noreply.github.com>
2026-05-22 11:44:45 +10:00
Danny White
4c148ea060 chore(studio): move short Admonitions to descriptions (#46049)
## What kind of change does this PR introduce?

Chore. Follow-up to DEPR-551, #45302, #45535, and #45618.

## What is the current behaviour?

Some short Studio Admonitions still put their entire message in `title`
or legacy `label`, so body-copy callouts render as headings.

## What is the new behaviour?

Moves selected single-message Studio Admonitions to `description`,
keeping the follow-up deliberately limited to Studio callsites.

This PR does not touch Docs content, shared Alert styling, ui-patterns,
design-system registry/docs, or Tailwind config.

| Before | After |
| --- | --- |
| <img width="1818" height="388" alt="Image"
src="https://github.com/user-attachments/assets/283a1853-348a-4d74-a408-013957350e5e"
/> | <img width="1380" height="462" alt="Image"
src="https://github.com/user-attachments/assets/e5761e8e-3697-423b-805b-45110205099a"
/> |
| <img width="1640" height="716" alt="CleanShot 2026-04-28 at 15 17
25@2x"
src="https://github.com/user-attachments/assets/a5be4d5f-2bf7-4dc2-b396-56129fe64ec9"
/> | <img width="1630" height="716" alt="CleanShot 2026-04-28 at 15 16
00@2x"
src="https://github.com/user-attachments/assets/0d589252-aaf8-4efc-9d81-15ec4f99ec61"
/> |


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

## Summary by CodeRabbit

* **Style**
* Refined message displays and admonition styling across settings,
database, dashboard, and admin interfaces for improved visual
consistency and clarity.

* **UI Updates**
* Updated search input layouts and form element styling in publications
tables and other admin pages.

<!-- review_stack_entry_start -->

[![Review Change
Stack](https://storage.googleapis.com/coderabbit_public_assets/review-stack-in-coderabbit-ui.svg)](https://app.coderabbit.ai/change-stack/supabase/supabase/pull/46049?utm_source=github_walkthrough&utm_medium=github&utm_campaign=change_stack)

<!-- review_stack_entry_end -->

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2026-05-19 10:20:54 +10:00
Etienne Stalmans
85743d7215 feat: branching support for temporary access (#45411)
## 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?

feature


## Additional context

Needs API deployment, adds a toggle to allow roles to only be available
on branch projects


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

* **New Features**
* Added a "Branches only" option for JIT database access grants;
included when grants are submitted.

* **UI**
* Configuration UI shows an informational notice and hides
temporary-access controls when preview branches are managed from the
main branch.
* Feature preview label changed to "Temporary access"; badge text now
reads "Preview".

* **Tests**
  * Unit test updated to cover branches-only serialization.

<!-- review_stack_entry_start -->

[![Review Change
Stack](https://storage.googleapis.com/coderabbit_public_assets/review-stack-in-coderabbit-ui.svg)](https://app.coderabbit.ai/change-stack/supabase/supabase/pull/45411?utm_source=github_walkthrough&utm_medium=github&utm_campaign=change_stack)

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

---------

Co-authored-by: Danny White <3104761+dnywh@users.noreply.github.com>
Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
2026-05-18 09:47:59 +02:00
Gildas Garcia
5d97339d41 chore: remove <Select> _Shadcn_ suffix (#45988)
## Problem

The `_Shadcn_` suffix isn't needed anymore on `Select` components

## Solution

Remove it. No other changes

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

## Summary by CodeRabbit

* **Refactor**
* Updated internal component architecture to standardize and simplify
the codebase. These changes improve code maintainability and consistency
across the application without affecting existing functionality or user
experience.

<!-- review_stack_entry_start -->

[![Review Change
Stack](https://storage.googleapis.com/coderabbit_public_assets/review-stack-in-coderabbit-ui.svg)](https://app.coderabbit.ai/change-stack/supabase/supabase/pull/45988)

<!-- review_stack_entry_end -->

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2026-05-15 16:39:57 +02:00
Jeremias Menichelli
c49eb8bb7d Revert "chore(studio + design-system): more flexible Admonition" (#45535) 2026-05-05 00:18:27 +08:00
Danny White
5bfbae22a9 chore(studio + design-system): more flexible Admonition (#45302)
## What kind of change does this PR introduce?

Feature and design-system cleanup. Resolves DEPR-551.

## What is the current behavior?

Admonition supports several overlapping content shapes, but it
previously did not support a first-class success state or
description-only usage cleanly. Title-only usage was also possible,
which made some callouts read like floating headings without body copy.

Docs MDX Admonitions could also pick up prose spacing around rich
children, while the design-system Tailwind config emitted an
ESM/CommonJS warning in the design-system app.

## What is the new behavior?

Adds a `success` Admonition type, description-only support, and a
stricter content contract: `title` or legacy `label` now requires either
`description` or `children`. Existing title-only Studio callsites have
been converted to description-only callouts.

The design-system docs now include examples for description-only and
success Admonitions, plus guidance for `title`, `description`,
`children`, and legacy `label` usage.

This also tightens Admonition body spacing so rich MDX children keep
docs link/code styling without inheriting excessive prose margins, and
renames the design-system Tailwind config to `tailwind.config.cjs` so it
matches its CommonJS syntax.

Warning and destructive alerts now explicitly set `text-foreground`,
preventing nested Admonition titles from inheriting muted
form-description colour after the Tailwind v4 cascade changes.

| Before | After |
| --- | --- |
| <img width="1818" height="388" alt="Image"
src="https://github.com/user-attachments/assets/283a1853-348a-4d74-a408-013957350e5e"
/> | <img width="1380" height="462" alt="Image"
src="https://github.com/user-attachments/assets/e5761e8e-3697-423b-805b-45110205099a"
/> |
| <img width="1398" height="550" alt="CleanShot 2026-04-28 at 15 12
41@2x"
src="https://github.com/user-attachments/assets/982694d9-5461-4362-8bae-a6e2b4c60e8b"
/> | <img width="1402" height="450" alt="CleanShot 2026-04-28 at 15 13
09@2x"
src="https://github.com/user-attachments/assets/0b1257c4-6b58-4c39-a182-4861a9e378ee"
/> |
| <img width="1640" height="716" alt="CleanShot 2026-04-28 at 15 17
25@2x"
src="https://github.com/user-attachments/assets/a5be4d5f-2bf7-4dc2-b396-56129fe64ec9"
/> | <img width="1630" height="716" alt="CleanShot 2026-04-28 at 15 16
00@2x"
src="https://github.com/user-attachments/assets/0d589252-aaf8-4efc-9d81-15ec4f99ec61"
/> |

| Design System Docs |
| --- |
| <img width="1646" height="1864" alt="CleanShot 2026-04-28 at 14 59
15@2x"
src="https://github.com/user-attachments/assets/12d13595-8972-4fb2-a04a-fb916388ebb6"
/> |


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

* **New Features**
* Added a "success" admonition variant and new example previews
demonstrating success and description-only usages.

* **Documentation**
* Clarified admonition guidance: when to use title vs description vs
children; added example sections for short callouts and success
messages.

* **Refactor**
* Standardized UI by moving short/advisory text into description across
the app and harmonized trailing punctuation.

* **Style**
* Ensured warning/destructive admonitions use consistent foreground text
styling.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2026-05-01 07:15:00 -06:00
Joshen Lim
50eea124e7 Small tweaks to feature preview badge (#45409)
## Context

Small improvements from this PR:
https://github.com/supabase/supabase/pull/45373

- Fix feature preview badge alignment
  - Before:
<img width="341" height="75" alt="image"
src="https://github.com/user-attachments/assets/e6e2f727-fc75-4f70-b9cd-94d67aed8c5d"
/>
  - After:
<img width="365" height="64" alt="image"
src="https://github.com/user-attachments/assets/3d6e5e5d-c285-48f4-8f8f-251c23101e41"
/>
- Shift feature preview badge for policies into tester side panel
<img width="640" height="93" alt="image"
src="https://github.com/user-attachments/assets/3efb73a7-f7f5-4ae0-8560-d1e0ba989626"
/>
- Realised that advisor settings wasn't set up to be behind the feature
preview
  - Fixing that in this PR

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

## Summary by CodeRabbit

* **New Features**
  * Added preview badge indicator to the RLS Tester feature

* **Style**
* Improved spacing and layout alignment across authentication, database
access, webhook, logging, and advisor interface components
  * Enhanced badge component styling for better vertical alignment

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2026-05-01 10:18:20 +08:00
Ivan Vasilov
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
Monica Khoury
49ff97af06 feat: add global feature preview badge for enabled preview features (#45373)
## What kind of change does this PR introduce?

Fixes FE-2526. 

Adds a global Feature Preview badge to pages enabled via Feature
Previews, improving visibility and making it clearer to users that the
feature can be managed (or disabled) from the Feature Previews settings.

## Why

Previously, once a feature preview was enabled, there was no clear
indication within the UI that:

- the feature was still in preview, or
- where to go to disable it

This lead to confusion and made the feature feel “permanent”.

## What’s included

New FeaturePreviewBadge UI component

<img width="417" height="80" alt="CleanShot 2026-04-29 at 17 20 10"
src="https://github.com/user-attachments/assets/6fbc96e3-35ef-46d1-893a-2188c4d237a3"
/>

</br>

Added badge across pages enabled via Feature Previews:
- Webhooks
- Unified Logs
- JIT DB Access
- Column Privileges
- Policies
- Merge page
- Advisor Rules

Consistent placement and styling.

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

## Summary by CodeRabbit

* **New Features**
* Feature preview badges now appear across the platform on preview
features, including Platform Webhooks, Database functionality, Unified
Logs, Advisor Rules, and other features, providing quick identification
and access to manage preview settings.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2026-04-29 20:47:30 +03:00
Danny White
05fc4aca13 chore(studio): clean up temporary access response typing (#45354)
## What kind of change does this PR introduce?

Cleanup.

## What is the current behavior?

Temporary access still has a couple of leftover JIT fallback messages
and an unnecessary local unavailable-reason type after the Platform
response types were split into `JitAccessResponse` and
`JitStateResponse`.

## What is the new behavior?

Studio relies on the generated `JitStateResponse` discriminated union
for the toggle warning and uses temporary access copy consistently in
the remaining fallback toasts.


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

## Summary by CodeRabbit

* **Improvements**
* Refined error messaging for temporary database access grant and revoke
operations.
* Enhanced condition detection for toggle failure warnings in database
access configuration.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2026-04-29 14:12:33 +08: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
Danny White
bedb2efb87 chore(studio): JIT access UI improvements (#44161)
## What kind of change does this PR introduce?

UI and copywriting improvements for temporary access.

## What is the current behavior?

The temporary access UI still used older JIT/ephemeral naming in some
places, did not clearly explain the setup requirements, and had to infer
unavailable states from Platform error message text.

## What is the new behavior?

The settings UI now uses temporary access naming consistently, explains
that temporary access uses short-lived tokens for manual database
connections, and renders clearer unavailable states for projects that
require either a Postgres upgrade or a platform migration.

The Studio query now consumes Platform’s structured `unavailableReason`
contract instead of parsing human-readable error strings, so the UI owns
the copy while Platform owns the eligibility reason.

Validation:

- `pnpm eslint
components/interfaces/Settings/Database/JitDatabaseAccess/JitDbAccessConfiguration.tsx
data/jit-db-access/jit-db-access-query.ts`
- `pnpm tsc --noEmit --pretty false`

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

* **New Features**
* IP range input now supports one CIDR range per row with add/remove
rows and form integration.

* **Documentation**
* Replaced “JIT” wording with “Temporary” / “Ephemeral token-based”
access across UI, dialogs, toasts, and help links.
  * Added minimum PostgreSQL version requirement (17.6.1.081+).

* **Improvements**
  * Per-row CIDR validation with precise nested error messages.
* Refined layout spacing and moved the temporary-access configuration
earlier in Database settings.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

---------

Co-authored-by: Etienne Stalmans <etienne@supabase.io>
Co-authored-by: Claude Sonnet 4.6 <noreply@anthropic.com>
Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
2026-04-28 17:26:59 +10:00
Gildas Garcia
416210d666 chore: remove _Shadcn_ suffix for Checkbox and Radio components (#45263)
## Problem

With #45211 and #45218 merged, we don't need the `_Shadcn_` suffix
anymore

## Solution

- [x] Remove the `_Shadcn_` suffix 
- [x] Update exports and imports 

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

## Summary by CodeRabbit

* **Refactor**
* Standardized UI component exports by removing legacy naming
conventions and providing direct imports for checkbox and radio group
components throughout the design system.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2026-04-27 11:07:06 +02:00
Gildas Garcia
0facd341a6 chore: remove UI form components _Shadcn_ suffix (#45212)
## Problem

We used to have a `_Shadcn_` suffix for all the shadcn form components
because we also had `formik` form components.
This is not needed anymore.

## Solution

- Remove the suffix
- Update all usages
2026-04-24 12:14:15 +02:00
Charis
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
Etienne Stalmans
c198a61951 feat: UI for managing jit database access (#43735)
## 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?

feature


## Additional context

Adds a feature flagged UI for toggling JIT based access to a project's
database and managing permissions/access

---------

Co-authored-by: Danny White <3104761+dnywh@users.noreply.github.com>
Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
2026-03-24 15:22:38 +08:00