Commit Graph

697 Commits

Author SHA1 Message Date
Joshen Lim 51b45ec715 Add project region info in settings and vector buckets + make region clickable in home page instance config (#45665)
## Context

Resolves FE-2985

As per PR title

- Add project region info in project settings page for convenience
<img width="722" height="375" alt="image"
src="https://github.com/user-attachments/assets/b32e80ed-42bd-4b12-b9b4-a3e696646335"
/>

- Add project region info in vector buckets empty state
<img width="1110" height="215" alt="image"
src="https://github.com/user-attachments/assets/60bfde97-c3e3-4c10-8b86-98ecd0437ad5"
/>

- Make DB region copyable by clicking in instance config chart on home
page
<img width="419" height="298" alt="image"
src="https://github.com/user-attachments/assets/269b9517-d0eb-42b9-9648-386c59d53842"
/>



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

* **New Features**
* Project region is now shown as a read-only field with a descriptive
region label in Settings.
* Region identifiers are clickable to copy to clipboard, with a “Click
to copy” tooltip and success toast.
* Storage/empty-state messaging updated to show clearer, region-specific
text and tooltip details.
  * Replica creation time now uses an enhanced timestamp display.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2026-05-08 18:33:45 +08:00
Saxon Fletcher ae66a6a9c0 Connect GitHub during project creation (#44884)
<img width="1289" height="863" alt="image"
src="https://github.com/user-attachments/assets/d661f107-b358-4894-8531-80441d60ab91"
/>

GitHub integration is now available on the free plan and so we'd like to
start promoting code-first workflows as much as possible. One way to do
that is to set the tone straight away by asking a user to connecting
their GitHub repository to a project as part of project creation.

This PR: 
- decouples GitHub connection and repo selection into a separate
component we can make use of in integration settings and project
creation.
- Adds new GitHub fields to project creation form and sends them off to
project creation endpoint
- Pre-fills project name based on repo selection 


To test locally:
- Ensure you have GitHub integration set up locally (using ngrok etc)
- Ensure you are on the connected platform branch
- Open create a new project page
- Connect GitHub as part of the creation form and select a repo
- Create the project and wait for status to be healthy
- Check project settings integrations page and ensure repo is connected

Note: 
- this requires changes on the management api end to accept new GitHub
fields
- it might make sense to pull out GitHub connection/authorization from
GitHub repository selection but in the current state they are tied
together.


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

## Summary by CodeRabbit

## Release Notes

* **New Features**
* GitHub repository selection now available during project creation with
integrated authorization flow
* GitHub connection status and compute availability indicators now
displayed on project dashboard
* Project name auto-populates from selected GitHub repository name when
available

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

---------

Co-authored-by: Gildas Garcia <1122076+djhi@users.noreply.github.com>
2026-05-08 13:52:09 +10:00
Jordi Enric 863d7af4c2 fix(studio): improve readability of logs refresh badge (#45582)
## Problem

The new-logs counter badge on the Logs refresh button became hard to
read. The number rendered as 0.6rem white text positioned absolutely
over two stacked semi-transparent green circles (`bg-green-800
opacity-60` ping plus `bg-green-900 opacity-80` solid). After the
Tailwind v4 upgrade shifted the default palette to OKLCH, the greens
rendered darker and the digit was nearly invisible.

## Fix

Replace the stacked opacity layers with a single solid `bg-brand-500`
pill, with a sized container (`h-4 min-w-4`), centered `text-[10px]
text-white`, and the ping animation rendered behind it instead of
layered on top. Same change applied to both `PreviewFilterPanel` and
`PreviewFilterPanelWithUniversal`.

## Before
<img width="274" height="194" alt="CleanShot 2026-05-05 at 13 55 53@2x"
src="https://github.com/user-attachments/assets/a5967091-b60f-42a9-9394-890c41df544c"
/>

## After
<img width="384" height="198" alt="CleanShot 2026-05-05 at 13 57 22@2x"
src="https://github.com/user-attachments/assets/30c440ce-f46f-4fda-8b96-08b068552da2"
/>


## How to test

- Open Studio and navigate to any Logs page (e.g. Logs > API Gateway).
- Wait for new log events to arrive, or trigger some traffic against the
project.
- Look at the refresh icon button in the filter bar.
- Expected result: the green badge in the top-right of the refresh icon
shows the new-event count clearly readable in white text, with a subtle
ping animation behind it.
- Verify counts in the 1, 10, 100, and 1000+ ranges (the 1000+ formats
as e.g. `1.2K`).

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

* **Style**
* Refined the "new logs" count badge: simplified markup, adjusted
positioning, color and opacity for a cleaner look.
* Updated refresh button badge to a brand-colored design with an
animated ping ring; count formatting and visibility rules (including
K-format for >1000) remain unchanged.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2026-05-06 11:55:34 +02:00
Gildas Garcia 4f28e5ccb4 chore: migrate Input usages to Shadcn component in settings (#45596)
screens/components

## Screeshots

### Delete project modal textarea
Before:
<img width="792" height="928" alt="image"
src="https://github.com/user-attachments/assets/f8276696-7bc0-415e-958c-b8794762013b"
/>

After:
<img width="788" height="928" alt="image"
src="https://github.com/user-attachments/assets/4b0991c1-7926-4b0a-b1cb-942f809f4a02"
/>

### Edge functions logs search input
Before:
<img width="667" height="219" alt="image"
src="https://github.com/user-attachments/assets/991b09ce-8d4f-4ccc-b787-3da611c78893"
/>

After:
<img width="695" height="231" alt="image"
src="https://github.com/user-attachments/assets/2623faeb-d636-4dec-8244-8e9bdad3acfb"
/>

### Infrastructure
Before:
<img width="1144" height="419" alt="image"
src="https://github.com/user-attachments/assets/25b27819-a3f6-4d67-9edc-f8225d07d592"
/>

After:
<img width="1153" height="440" alt="image"
src="https://github.com/user-attachments/assets/10eea888-09b0-463b-a307-6c58b4feb948"
/>

### DNS Record

Haven't been able to test this one

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

* **Refactor**
* Streamlined form and input layouts across Settings: DNS, Project
Deletion, Infrastructure Info, and Log Preview panels for a more
consistent, accessible editing experience.
* Replaced various single-line inputs with grouped controls,
read-only/display variants, and input-with-addon patterns, improving
readability, copy/readonly behavior, and control affordances (buttons,
badges, tooltips) in settings and log search.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2026-05-05 18:24:21 +02:00
Jordi Enric b55c1d85e6 fix(studio): restore 3xx/4xx log status badge colors (#45581)
## Problem

After the Tailwind v4 upgrade, the 3xx/4xx HTTP status badge in the Logs
explorer rendered with a saturated yellow background and washed-out
text, because `bg-amber-300`/`text-amber-1100` no longer resolve as they
did under v3.

## Fix

Switch the 3xx/4xx case in `ResponseCodeFormatter` to the existing
`bg-warning/10 text-warning` semantic tokens, matching the pattern used
by the shared `Badge` warning variant.

## Before
<img width="798" height="722" alt="CleanShot 2026-05-05 at 12 13 23@2x"
src="https://github.com/user-attachments/assets/a2d37f37-4260-4ec6-bf1c-ff96b6f51be0"
/>

## After
<img width="642" height="530" alt="CleanShot 2026-05-05 at 12 12 55@2x"
src="https://github.com/user-attachments/assets/7c82aee2-0d40-4213-8533-14ffb04fb5de"
/>


## How to test

- Run `pnpm dev:studio`
- Open any project's Logs explorer (API, Edge Functions, Auth, etc.)
- Find a row with a 3xx or 4xx status code
- Expected: faint yellow background with a darker amber/yellow text,
consistent with other warning badges in the app
- Confirm 2xx (brand) and 5xx (red) badges still render as before

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

## Summary by CodeRabbit

* **Style**
* Updated the visual styling of response codes in the logs display for
improved consistency.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2026-05-05 12:15:51 +02:00
Joshen Lim e98a302428 Refactor merge page into smaller components + add admonition if branch cannot be merged via dashboard (#45515)
## Context

Main fix is actually just the disabled check on the "Merge branch"
button

We're preventing merging of branches via the dashboard if the project
has GH integration + "Deploy to production" enabled (the latter we're
checking via if the `git_branch` property from the main branch exists,
from the GET branches API endpoint)

However, the `git_branch` property persists even after disabling the GH
integration (by design), and hence we were incorrectly disabling the
"Merge branch" button if the user removed the GH integration. Hence the
fix is to also check if the project has an active GH integration

## Other changes
- Refactored the merge page into smaller components
- Added an admonition to callout the "Deploy to production" + what steps
to take (otherwise it's not clear at all what to do in this scenario)
<img width="1451" height="524" alt="image"
src="https://github.com/user-attachments/assets/9df7d432-b220-4f71-b8f4-5ed0fd426afc"
/>


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

## Summary by CodeRabbit

* **New Features**
* Redesigned merge request page interface with dedicated components for
title, subtitle, and merge actions, improving user clarity and
experience.
* Added GitHub production deployment restriction messaging—users cannot
proceed with merge requests when this integration deployment method is
enabled.

* **Refactor**
* Enhanced GitHub integration connection query patterns and overall code
organization.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2026-05-05 16:32:37 +08:00
Charis 0433eeb5f5 feat(studio): mark sql provenance for safety (#45336)
Mark provenance of SQL via the branded types SafeSqlFragment and
UntrustedSqlFragment. Only SafeSqlFragment should be executed;
UntrustedSqlFragments require some kind of implicit user approval (show
on screen + user has to click something) before they are promoted to
SafeSqlFragment.

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

* **New Features**
* Editor and RLS tester show loading states for inferred/generated SQL
and include a dedicated user SQL editor for safer edits.

* **Refactor**
* Platform-wide SQL handling tightened: snippets and AI-generated SQL
are treated as untrusted/display-only until promoted, improving safety
and consistency.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2026-05-04 13:08:06 -04:00
Jeremias Menichelli c49eb8bb7d Revert "chore(studio + design-system): more flexible Admonition" (#45535) 2026-05-05 00:18:27 +08:00
Inian e61853c59c fix(studio): clarify default privileges toggle covers tables (#45458)
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->

## Summary by CodeRabbit

* **Documentation**
* Updated UI labels and descriptions across the Data API settings to
clarify that default privileges apply to new tables only (removed
references to functions).

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2026-05-04 11:35:02 +02:00
Joshen Lim bc9ecfb9ee Minor clean up for preview branch call outs (#45448)
## Context

Just happened to pass by this - refactor to use Admonition instead of
Alert + fix spacing + use InlineLink

e.g General settings while on a preview branch

### Before
<img width="795" height="364" alt="image"
src="https://github.com/user-attachments/assets/28ab66ab-bd10-408e-afb5-24e287efc705"
/>

### After
<img width="759" height="349" alt="image"
src="https://github.com/user-attachments/assets/db62925d-f2e2-4c10-9cab-ce8204f2077c"
/>


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

* **Style**
* Preview-branch notices across Settings now use a unified admonition
design with adjusted spacing for improved visual consistency.

* **Refactor**
* Standardized branch-notice layout and inline navigation links across
Addons, General, and Integrations; each notice now links directly to its
respective settings page for clearer navigation.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2026-05-04 15:27:52 +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 4c0d8cac4a fix: Fix the input group in database settings. (#45423)
The input groups in Database settings were rendered badly due to the
Tailwind v4 bump.

Before:
<img width="767" height="585" alt="Screenshot 2026-04-30 at 16 59 55"
src="https://github.com/user-attachments/assets/b55715b4-fdf2-4338-a10d-8c31138c49bc"
/>

After:
2026-04-30 15:08:16 +00: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
Saxon Fletcher 3ef1c1e08c Add recommendation on schema isolation (#45390) 2026-04-30 18:09:33 +10:00
Danny White 5dee242aa3 chore(studio): remove project usage settings callout (#45393)
## What kind of change does this PR introduce?

Dashboard cleanup and docs update.

## What is the current behaviour?

Project Settings > General still shows a legacy "Project usage" section
explaining that usage statistics moved to organisation settings. One
troubleshooting page also links to the old project billing usage page.

## What is the new behaviour?

The legacy Project Settings usage callout is removed, while the existing
old usage route redirect remains in place for stale links. The MAU
troubleshooting page now points users to the organisation usage page and
tells them to select a specific project from the dropdown.

| Before | After |
| --- | --- |
| <img width="1450" height="1314" alt="CleanShot 2026-04-30 at 16 11
16@2x"
src="https://github.com/user-attachments/assets/3ad8c41f-2eab-406c-bfd8-f5737ae9a5a3"
/> | <img width="1474" height="1004" alt="CleanShot 2026-04-30 at 16 11
04@2x-7CACB175-B6A9-4811-968F-030745F685AE"
src="https://github.com/user-attachments/assets/f541ee60-0c24-49e4-9446-3bd58c516797"
/> |

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

## Summary by CodeRabbit

* **Documentation**
* Updated Monthly Active Users (MAU) documentation to reflect accessing
usage data from the organization-level page instead of project settings

* **Refactor**
* Removed project-level usage viewing option from project settings
interface

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2026-04-30 16:48:51 +10:00
Danny White a34c299344 chore(studio): clarify pause project flow (#45392)
## What kind of change does this PR introduce?

Minor UI and copywriting change.

## What is the current behavior?

- Vague dialog copy for pausing a project
- Plain pause icon looks like two Tim Tams

## What is the new behavior?

- Clearer dialog copy
- More standard pause button

## Additional context

| Before | After |
| --- | --- |
| <img width="912" height="502" alt="11317"
src="https://github.com/user-attachments/assets/55a64d01-8171-498e-a03f-2e0060995400"
/> | <img width="850" height="476" alt="67001"
src="https://github.com/user-attachments/assets/054a8ca0-e06c-417c-9668-c3847013bbe2"
/> |

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

## Summary by CodeRabbit

* **Bug Fixes**
* Enhanced pause project confirmation dialog to clearly communicate the
90-day resume timeframe and backup availability after this period.

* **Style**
  * Updated pause icon display.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2026-04-30 14:03:47 +08: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
Gildas Garcia 718021fc7b chore: migrate Listbox to Shadcn components (#45279)
## Problem

We want to reduce the code we ship and maintain.

## Solution

Migrate old `<Listbox />` usage to the new Shadcn component.

## Screenshots

### Billing
Before:
<img width="536" height="458" alt="image"
src="https://github.com/user-attachments/assets/c8883bd8-cbbd-47cd-84a4-e37a36c05cd6"
/>

After:
<img width="541" height="451" alt="image"
src="https://github.com/user-attachments/assets/9c848b1b-e72a-413c-b264-48340ce0c7ef"
/>

### Foreign Key Editor
Before:
<img width="463" height="995" alt="image"
src="https://github.com/user-attachments/assets/4debeeeb-94bd-439d-8f57-a84a2ed5230a"
/>
<img width="428" height="241" alt="image"
src="https://github.com/user-attachments/assets/81a21d58-c023-445a-a6e8-c9be22b53075"
/>

After:
<img width="451" height="1007" alt="image"
src="https://github.com/user-attachments/assets/18c781c0-4f52-4ca2-99e6-1fc34dc857e3"
/>
<img width="434" height="240" alt="image"
src="https://github.com/user-attachments/assets/13fbb3ad-ef3c-499d-a27e-26cfae89ae44"
/>


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

* **Refactor**
* Replaced legacy dropdowns with a unified Select component and
consistent form layout across payment method, org transfer,
foreign-key/column selectors, region selection, and other dropdowns.
* **Chores**
* Removed the legacy listbox implementation and its public exports from
the UI package.
* **Tests**
* Removed old listbox unit tests and updated e2e selectors to target the
new Select-based controls.
* **Style**
  * Deleted obsolete listbox-specific styles.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2026-04-28 14:30:49 +02: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 2d92563b57 fix(studio): add resume project flow to project settings (#45078)
## 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. Resolves DEPR-511.

## What is the current behavior?

Paused projects in `Project Settings > General > Project availability`
still present restart/pause maintenance controls, but no resume
affordance. That makes the resume path hard to discover from Settings
and pushes users back to the project dashboard to find the correct
action.

The paused state also keeps showing a redundant disabled `Pause project`
row, and the pause confirmation uses a more flexible modal than this
flow needs.

DEPR-519 already covered the unhealthy-project restart guard, but not
this paused-project discoverability path.

## What is the new behavior?

Project Settings is now paused-project aware. It shows a shared `Resume
project` action when the project can still be restored, falls back to
the project dashboard when the restore window has expired or pause
status cannot be confirmed, and reuses the same resume flow, permission
checks, and free-tier guardrails as the paused dashboard.

While a project is already paused, the redundant `Pause project` row is
hidden so the section stays focused on the real next action. For active
projects, the pause row remains in place, including the useful disabled
tooltip states for plans that cannot pause.

The pause confirmation now uses `AlertDialog` with shorter, more
accurate copy about the restore window, and the restart controls now
behave more consistently on smaller breakpoints. The Project Settings
command-menu entry is also searchable via `resume project`.

| Before | After |
| --- | --- |
| <img width="1602" height="566" alt="CleanShot 2026-04-24 at 18 05
25@2x"
src="https://github.com/user-attachments/assets/bd8f4095-0360-443c-a179-185da69eb9e8"
/> | <img width="1538" height="408" alt="CleanShot 2026-04-24 at 18 06
12@2x"
src="https://github.com/user-attachments/assets/7ac26529-4b54-460e-89c3-927891d873d8"
/> |
| <img width="1524" height="524" alt="CleanShot 2026-04-24 at 18 08
53@2x"
src="https://github.com/user-attachments/assets/f3c49c46-b389-4324-b982-f557b159623e"
/> | <img width="1528" height="550" alt="CleanShot 2026-04-24 at 18 08
30@2x"
src="https://github.com/user-attachments/assets/4021e2bb-f22f-40db-be43-de6d0fb571b3"
/> |
| <img width="896" height="558" alt="CleanShot 2026-04-24 at 17 41
40@2x"
src="https://github.com/user-attachments/assets/31569aec-89a6-4984-8011-39d8b102c90f"
/> | <img width="912" height="502" alt="CleanShot 2026-04-24 at 18 10
34@2x"
src="https://github.com/user-attachments/assets/f19dcd27-12e6-4a2f-8eed-ca709e77dfa1"
/> |

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

* **New Features**
* Added a tooltip-enabled "Resume project" button that handles
permissions, free-plan member gating, optional Postgres version
selection, and navigates to the project after restore.
* **UX**
* Pause confirmation migrated to an alert-style dialog with updated copy
and disabled controls during pausing.
* Restart controls updated for improved responsive layout and refreshed
button visuals.
* Project settings now show appropriate resume/dashboard actions based
on pause/restore eligibility.
* **Tests**
* Added tests for active, resumable-paused, and non-resumable-paused
states.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

---------

Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
2026-04-28 09:30:54 +00: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
Jordi Enric dfd3eec8e9 feat(studio): compute metrics on project diagram Primary Database card (#45274)
## Problem

The Primary Database card in the project homepage diagram showed region
and instance size, but no live health data. Users had no quick way to
spot a high-disk or high-CPU situation without navigating to the
database report.

## Fix

Added a clickable metrics row at the bottom of the Primary Database card
showing CPU, Disk, and RAM as percentages, plus active/max connections
when available. Each metric is color-coded (warning at 80%, destructive
at 90%). Clicking the row navigates to the database observability
report.

The metrics are powered by a new \`useComputeMetrics\` hook that wraps
the existing \`useInfraMonitoringAttributesQuery\` and
\`useMaxConnectionsQuery\`, reusing the parse utilities already used by
the database infrastructure section. The \`metricColor\` threshold logic
is extracted into a separate util with unit tests.

## How to test

- Open the project homepage for a running project
- The Primary Database card should show a new bottom row: "CPU X% · Disk
X% · RAM X% · Y/Z conns"
- Values above 80% should appear in amber, above 90% in red
- Click the metrics row and confirm it navigates to
\`/project/<ref>/observability/database\`
- While metrics are loading, a spinner should appear in the row
- If the infra monitoring API is unavailable, the row should show
"Metrics unavailable" instead of zeroes

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

## Summary by CodeRabbit

## Release Notes

* **New Features**
* Infrastructure configuration page now displays real-time compute
metrics (CPU, disk, memory usage) with color-coded usage indicators
based on thresholds.
  * Connection information is displayed when available.
  * Includes loading states and error handling for metric retrieval.

* **Tests**
  * Added test coverage for metric color-coding logic.

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

---------

Co-authored-by: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-04-27 14:15:11 +02:00
Joshen Lim 7f5865872a Enforce noUnusedLocals and noUnusedParameters in tsconfig.json + fix all related issues (#45264)
## Context

Enforce `noUnusedLocals` and `noUnusedParameters` in tsconfig.json + fix
all related issues
2026-04-27 17:42:34 +08: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
Ignacio Dobronich 07d75d4e79 feat: add TaxDisclaimer for addons (#45235)
## Summary

Adds a reusable `TaxDisclaimer` component ("Prices shown do not include
applicable taxes.") and places it on surfaces where users see a price
before confirming a billable action.

## Where it appears

- **Disk resize review
dialog** — `DiskManagementReviewAndSubmitDialog` (below the before/after
price comparison)
- **Add-on side panels** — PITR, Custom Domain, IPv4 (below the price
options)
- **Log drain destination form** — stacked under "See full pricing
breakdown here" in the footer
- **SMS MFA confirmation modal** — below the $75/$10 billing copy
- **Read replica pricing dialog** — at the end of the cost breakdown
- **Create branch modal** — below the disk/compute cost estimates

## Test plan

- [ ]  Open disk/compute resize review dialog — disclaimer appears below
the before/after panel
- [ ]  Open each add-on side panel (PITR / Custom Domain / IPv4) —
disclaimer appears below the price options
- [ ]  Open log drain destination sheet — disclaimer stacks under the
pricing breakdown link in the footer
- [ ]  Trigger SMS MFA confirmation — disclaimer appears below the
billing copy
- [ ]  Open read replica pricing dialog ("Learn more" from deploy
replica) — disclaimer at the bottom
- [ ]  Open create branch modal — disclaimer appears after the compute
cost block

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

## Summary by CodeRabbit

* **New Features**
* Added tax disclaimers across multiple billing and pricing interfaces
throughout the platform. Users will now see notices regarding applicable
taxes displayed in various authentication settings, branch creation
workflows, database disk management dialogs, database replica pricing
screens, log drain configuration panels, custom domain settings, IPv4
address configuration, and Point-in-Time Recovery options.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2026-04-24 16:58:23 -03:00
Gildas Garcia f0746dbea8 fix: restore pitr duration inputs label (#45223)
## Problem 

#45218 removed the PITR duration input label: _Choose the duration of
recovery_

## Solution

Restore it

## Screenshots

Before:
<img width="1534" height="1130" alt="image"
src="https://github.com/user-attachments/assets/f1f7fc5b-0fba-4356-b6d6-9bffcaa211bd"
/>

After:
<img width="760" height="734" alt="image"
src="https://github.com/user-attachments/assets/5df7a986-9c3b-48a3-84d7-4de151dd7f5f"
/>


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

## Summary by CodeRabbit

* **Style**
* Improved accessibility of the PITR (Point-In-Time Recovery) settings
control by adding proper label association for the recovery-duration
selection option.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2026-04-24 17:37:39 +02:00
Gildas Garcia 6e564c5929 Chore cleanup remove radio (#45218)
## Problem

We want to reduce the code we ship and maintain.

## Solution

Migrate old `<Radio />` usage to the new Shadcn component.

## Screenshots

### Database functions

Before:
<img width="587" height="228" alt="image"
src="https://github.com/user-attachments/assets/2b95fc36-f338-4a11-a537-c8956e13b38d"
/>

After:
<img width="576" height="195" alt="image"
src="https://github.com/user-attachments/assets/fb8a32e3-397e-4dc8-b7e2-c309800774ca"
/>

### Storage policies

Before:
<img width="1169" height="644" alt="image"
src="https://github.com/user-attachments/assets/06950f4b-9edc-457d-a7cc-fabe3ed573ba"
/>

After:
<img width="1171" height="647" alt="image"
src="https://github.com/user-attachments/assets/3445f38d-fb52-4ba7-8933-20005be25334"
/>

### Custom domain

Before:
<img width="668" height="350" alt="image"
src="https://github.com/user-attachments/assets/87f48b29-3b8f-466e-8db0-c9418aaee026"
/>

After:
<img width="669" height="339" alt="image"
src="https://github.com/user-attachments/assets/b66b432a-e4ac-4b80-b98e-47b2ba948df4"
/>

### PITR

Before:
<img width="767" height="659" alt="image"
src="https://github.com/user-attachments/assets/22508934-02f1-4600-93d9-ba77a955f450"
/>

After:
<img width="767" height="565" alt="image"
src="https://github.com/user-attachments/assets/bb4b88c0-bd81-4086-a4f4-715cee37f20e"
/>


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

* **Refactor**
* Replaced legacy radio controls across the app with modern card-style
and stacked selection components—radio options now render as selectable
cards or stacked items with richer label/content support, consistent
sizing, and cleaner selection behavior for a more polished, accessible
UI.
* Legacy radio styling and old radio module removed to consolidate the
updated control and theme.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2026-04-24 16:38: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
Danny White b37272cdd7 chore(studio + docs) improve project integrations (#45200)
## What kind of change does this PR introduce?

Docs update and UI copy improvement.

## What is the current behavior?

The GitHub integration working directory helper uses an inline tooltip
for examples. In the form layout, the tooltip alignment and inline code
wrapping can make the helper harder to scan.

The integration settings pages also mix markdown-rendered copy with JSX
copy, duplicate the integration cover image helper, and use slightly
different heading, spacing, and button copy patterns across GitHub,
Vercel, and AWS PrivateLink.

## What is the new behavior?

The GitHub working directory field now keeps the helper copy concise and
links to a dedicated docs section with examples for repository root and
nested `supabase/` directories.

The integration settings sections now use a more consistent JSX
structure and copy treatment across GitHub, Vercel, and AWS PrivateLink,
including shared cover imagery and matching explanatory section
hierarchy.

| Before | After |
| --- | --- |
| <img width="1838" height="696" alt="CleanShot 2026-04-24 at 14 35
32@2x"
src="https://github.com/user-attachments/assets/f9843018-fbf5-4c18-a0c3-1842b665f3fd"
/> | <img width="1842" height="700" alt="CleanShot 2026-04-24 at 14 30
21@2x-64E8726E-0B89-4C5A-8A47-CE1AA24F3D1A"
src="https://github.com/user-attachments/assets/bb017464-2b43-4dfe-94b8-a586aedea318"
/> |
| <img width="1884" height="1432" alt="CleanShot 2026-04-24 at 14 40
19@2x"
src="https://github.com/user-attachments/assets/b34e4573-cd7c-4588-83a0-0e1941019552"
/> | <img width="1844" height="1424" alt="CleanShot 2026-04-24 at 14 39
02@2x"
src="https://github.com/user-attachments/assets/4f82b01c-cb27-4f01-b2da-76b7f6e298a5"
/> |


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

* **Documentation**
* Clarified GitHub integration setup: provide a Working directory value,
how to compute it from the repo root (including "." for root), examples,
and updated “initialize” spelling.

* **Refactor**
* Simplified integration form descriptions (tooltips → inline text +
Learn more link).
* Reworked GitHub and Vercel integration content to use consistent
headings, layout, and shared image handling.
  * Reorganized integration settings rendering for clearer UI states.

* **Style**
  * Minor copy, casing, and button text/spacing adjustments.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2026-04-24 15:41:59 +08:00
Aaron Byrne 1035bd43ba fix(studio): example to deter users from inputting the wrong working directory (#45192)
## 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?

Wording change

## What is the current behavior?

Please link any relevant issues here.

## What is the new behavior?

Just provides an example of what to include
## Additional context

Add any other context or screenshots.


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

* **Documentation**
* Clarified the "Working directory" guidance in GitHub Integration
settings: must be a relative path to the directory that contains the
supabase/ folder (not the supabase folder itself). Added an
example-driven tooltip and updated the placeholder to "." to reflect the
expected format and reduce confusion. This improves clarity and prevents
setup errors for repository-based workflows.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

---------

Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
2026-04-24 11:47:08 +08:00
Andrew Valleteau 5caa75e0af fix(studio): suppress error toast when GitHub connection already exists (#44972)
<img width="3504" height="2226" alt="cleanshot_2026-02-09_at_08 54 44_2x
(1)"
src="https://github.com/user-attachments/assets/967f2dab-09a7-4c46-9849-0e9f524fba70"
/>


When enabling GitHub integration for a project that already has a
connection, the create-connection API returns "already exists" error
while the branch settings update succeeds, causing both an error and
success toast to stack. Handle this by suppressing the error toast for
"already exists" so only the branch success toast is shown.

Fixes DEVWF-1128

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

## Summary by CodeRabbit

* **Bug Fixes**
* Improved error handling for GitHub connection creation. Suppresses
redundant error notifications when a connection already exists and
displays clearer error messages for other failures.

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

Co-authored-by: Claude <noreply@anthropic.com>
2026-04-23 17:18:31 +02:00
Alaister Young 75e08577c1 chore(studio): remove tableEditorApiAccessToggle flag (#45081)
Cleans up the `tableEditorApiAccessToggle` PostHog flag now that the
gated UI is shipping to everyone. Follow-up to #45034 — the new
project-creation checkbox makes the management UI a prerequisite, so no
reason to keep it behind a flag.

**Removed:**
- `useDataApiGrantTogglesEnabled` hook
- Old schemas-only multi-selector branch in the Data API settings page
(the rich per-table / per-function toggles + default-privileges switch
become the only UI)
- Flag gate around the `<ApiAccessToggle>` section in the table editor
side panel
- Flag gates around `updateTableApiAccess` calls in the save pipeline
(create / duplicate / update)
- `tableEditorApiAccessToggleEnabled` telemetry property + stale JSDoc /
docs references

**Changed:**
- `createTableApiAccessHandlerParams` no longer takes an `enabled` param
— it was always `true` after removal

## To test

- Integrations → Data API settings page: exposed tables, exposed
functions, default-privileges toggle all render and save correctly
- Table editor: creating, duplicating, and editing a table all run the
expected Data API privilege updates
- Project creation flow still works end-to-end (unchanged, but the
submit telemetry no longer includes `tableEditorApiAccessToggleEnabled`)

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

## Summary by CodeRabbit

* **Improvements**
* API access configuration is now always available in the table editor
and PostgreSQL settings, removing previous conditional gating.
* Simplified the "Automatically expose new tables and functions"
interface by consolidating UI branches.

* **Documentation**
* Updated telemetry guidance and examples with current feature-flag
references.

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

Co-authored-by: Alaister Young <10985857+alaister@users.noreply.github.com>
2026-04-22 21:37:48 +08:00
Alaister Young d1a7d64e63 [FE-3023] feat(studio): default privileges toggle at project creation (#45034)
<img width="783" height="414" alt="Screenshot 2026-04-20 at 3 02 37 PM"
src="https://github.com/user-attachments/assets/a353c35a-3de5-4bfa-ab31-829c79c43165"
/>

Adds a "Default privileges for new entities" checkbox under "Enable Data
API" in both the main create flow and the Vercel deploy-button flow.
Default checked (current behaviour). When unchecked, runs
`buildDefaultPrivilegesSql('revoke')` after the base init script so new
entities in `public` aren't auto-granted to `anon` / `authenticated` /
`service_role`.

This PR decouples the two surfaces:

- **`tableEditorApiAccessToggle`** — unchanged; still gates only the
integrations → Data API settings UI.
- **`dataApiRevokeOnCreateDefault`** (new) — controls only the default
state of the new checkbox at project creation. `true` → checkbox
unchecked by default (revoke runs); `false`/absent → checkbox checked by
default (no behaviour change).

The new flag is already live in PostHog at **0% rollout, off for
everyone**, so shipping this PR changes nothing until the flag is
explicitly flipped.

## Added

- `apps/studio/hooks/misc/useDataApiRevokeOnCreateDefault.ts` — reads
the new PostHog flag. Returns `false` in `IS_TEST_ENV` so existing E2E
flows don't silently change default behaviour.
- Checkbox UI in `SecurityOptions.tsx` (main flow) and
`pages/integrations/vercel/[slug]/deploy-button/new-project.tsx` (Vercel
flow), with copy matching the integrations → Data API settings page.
- Tooltip + dimmed state for the main-flow checkbox when "Enable Data
API" is unchecked (can't configure default privileges if Data API is
off).
- Telemetry: `dataApiDefaultPrivilegesGranted` (raw checkbox value) and
`dataApiRevokeOnCreateDefaultEnabled` (raw flag, conditionally included
using the existing raw-flag pattern so undefined flag state → omitted
property, not `false`).
- Vitest unit tests for the new hook.

## Changed

- `pages/new/[slug].tsx`: removed the `false &&` rollback guard. Revoke
SQL now runs only when `dataApi && !dataApiDefaultPrivileges`. Dropped
the now-unused `useDataApiGrantTogglesEnabled` import.
- `pages/integrations/vercel/[slug]/deploy-button/new-project.tsx`: this
flow was **never rolled back** — it still ran revoke whenever
`tableEditorApiAccessToggle` was on for a user. Now correctly gated on
the new flag + checkbox state.
- `packages/common/telemetry-constants.ts`: added the two new properties
and corrected the `tableEditorApiAccessToggleEnabled` docstring (it no
longer claims to control project-creation revoke behaviour).

## Kill switch

Flipping `dataApiRevokeOnCreateDefault` to off in PostHog fully disables
the revoke SQL for new projects without needing a redeploy — the
checkbox just defaults to checked again.

## Follow-ups (not blockers)

- joshenlim's review comments on PR 43704: (1) Auth Policies table row
incorrectly showing "exposed via Data API" based on schema-level check
instead of table-level at
`apps/studio/components/interfaces/Auth/Policies/PolicyTableRow/index.tsx:64`;
(2) Data API integrations page showing zero exposed tables even after
exposing one. Both unrelated to this PR but will be more visible once
the checkbox lands.
- Once this flag fully rolls out, the old `tableEditorApiAccessToggle`
docstring/comments elsewhere should stop claiming it controls project
creation.

## To test

- **Flag off (default state, simulates post-merge):** create a project
with and without "Enable Data API" checked. The new "Default privileges
for new entities" checkbox should default to **checked**. Submitting
should produce an identical result to today — new tables in `public` are
reachable via the Data API.
- **Flag on (simulate rollout):** override the flag locally. The
checkbox should default to **unchecked**. Creating a project with it
unchecked should run the revoke SQL; create a new table in `public`
afterwards and confirm it's not reachable via the Data API until grants
are added.
- **Enable Data API off:** the new checkbox should render disabled +
dimmed with a tooltip reading "Enable the Data API to configure default
privileges." The revoke SQL should not run in this case regardless of
checkbox state.
- **Vercel flow:** repeat at
`/integrations/vercel/<slug>/deploy-button/new-project` — verify both
checkbox states.

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

* **New Features**
* Added an "Automatically expose new tables and functions" checkbox to
project creation and Vercel deploy flow; enabled only when Data API is
available (disabled with tooltip otherwise) and affects initial project
provisioning.

* **Telemetry**
* Tracks exposure of the default-privileges control and includes
checkbox state and feature-flag status on project-creation submissions.

* **Tests**
* Added tests for flag behavior, exposure tracking, deduplication, and
submission telemetry.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

---------

Co-authored-by: Alaister Young <10985857+alaister@users.noreply.github.com>
Co-authored-by: Sean Oliver <882952+seanoliver@users.noreply.github.com>
2026-04-21 13:15:40 +08:00
Laurence Isla 08e9cdde5e docs: data api docs functions (#44412)
## 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?

Replaces "stored procedures" with "functions" for everything related to
the Data API.

## Additional context

It's not accurate to call database functions "stored procedures". It may
have been that way before Postgres 11, but now it causes confusion
because PostgREST allows functions and not stored procedures.

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

* **Documentation**
* Standardized terminology across docs, SDK guides, CLI/config specs,
examples, UI, and config comments to use "database functions" instead of
"stored procedures".
* Updated API docs, CLI/config descriptions, Studio UI labels, help
text, empty-state and navigation copy, RPC documentation, and example
text for consistency.
* Adjusted explanatory text and error/help messages to reflect the
revised terminology.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2026-04-21 11:54:27 +10:00
Jordi Enric 21584fe512 feat(studio): add backup cli instructions (#44621)
## Problem

When a project is paused, in a failed state, or about to be deleted,
users have no obvious way to take a logical backup of their data before
proceeding. This is particularly risky at deletion time — once deleted,
data is gone.

## Solution

Introduce a new `LogicalBackupCliInstructions` component that surfaces
ready-to-run `supabase db dump` commands pre-filled with the project's
direct connection details.

### Where it appears

| State | How |
|---|---|
| Project paused (restorable) | Inline in `ProjectPausedState` with a
note to resume first |
| Pause failed | Dialog via "Download backup" button when no backup is
available |
| Restore failed | Dialog via "Download backup" button when no backup is
available |
| Delete project modal | Inline in `DeleteProjectModal` for all plans |

Not shown in `PauseDisabledState` (project paused 90+ days, compute
stopped — `pg_dump` would fail anyway).

### What the component does

- Fetches the project's direct connection settings via
`useProjectSettingsV2Query`
- Builds a connection URI with a `[YOUR-PASSWORD]` placeholder (password
is never stored or displayed)
- Shows three shell commands to dump roles, schema, and data separately
— mirroring the [logical backup
docs](https://supabase.com/docs/guides/platform/backups)
- Optionally shows a **Reset database password** button (gated on
`UPDATE projects` permission); shown in the paused state, hidden
elsewhere via `showResetPassword={false}`
- Includes inline guidance to percent-encode special characters in the
password

### Shell safety

The generated `--db-url` values are wrapped in single quotes to prevent
shell metacharacter expansion when users paste and run the commands.
`npx supabase login` is intentionally omitted — the `--db-url` flag
authenticates directly against Postgres and does not require a Supabase
account.

### Backup button behaviour in failed states

The "Download backup" button in `PauseFailedState` and
`RestoreFailedState` now always stays enabled:
- **Backup available** — downloads immediately (unchanged)
- **No backup / physical backups** — opens a dialog with CLI
instructions instead of silently failing

## How to test

**Delete project flow**
1. Open any project → Settings → General → Delete project
2. Verify the CLI backup section appears with the project's host, port,
user, and db name pre-filled
3. Verify no Reset database password button is shown

**Paused project**
1. Open a paused project (`ProjectPausedState`) — verify CLI
instructions appear with the "Your project must be resumed before
running these commands." note
2. Open a project paused for 90+ days (`PauseDisabledState`) — verify
CLI instructions do not appear

**Failed states**
1. Simulate a pause-failed or restore-failed state
2. If a downloadable backup exists — "Download backup" downloads it
directly
3. Block the backup API or use a project with physical backups —
"Download backup" should open the CLI instructions dialog

**Error state**
1. Block the project settings API call (DevTools → Network → block
request)
2. Verify an error message appears with a link to Database settings
3. Verify a loading skeleton shows while the request is in flight

---------

Co-authored-by: Claude Opus 4.6 <noreply@anthropic.com>
2026-04-15 16:39:32 +02:00
kemal.earth 5a66d00c5e feat(studio): update unhealthy project guards (#44855)
## 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?

This enables the user to restart an unhealthy project as opposed to
pausing and reactivating.

cc @GaryAustin1 


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

## Summary by CodeRabbit

* **New Features**
* Added detection and dedicated UI for unhealthy projects with restart
capability.
* Enabled automatic recovery monitoring that dismisses unhealthy state
once the project recovers.

* **Bug Fixes**
* Updated pause button to display appropriate message when project is
unhealthy.
  * Extended restart functionality to support unhealthy project states.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2026-04-15 13:41:33 +01:00
Gildas Garcia d95fdfd566 fix: input-group don't have the proper validation attributes (#44703)
## Problem

The input groups components introduced in #44282 don't have the
validation attributes when invalid. This hurts accessibility and also
break the design:
<img width="1730" height="324" alt="image"
src="https://github.com/user-attachments/assets/a3fb8d86-f3a8-46bb-aa53-d0599c11f056"
/>

## Solution

This is because the wrapper `<FormControl_Shadcn_>` passes the
validation props to its direct child.
The solution is to avoid applying them on the `<InputGroup>` and to
apply them manually on the inputs.

I also fixed a small accessibility issue by moving the addon texts after
the input so that screen readers announce them in the correct order. No
visual change for this

<img width="587" height="158" alt="image"
src="https://github.com/user-attachments/assets/1f8858ea-6659-45f9-964e-8c43a7fe14ba"
/>


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

* **Style**
* Unified numeric input layout by moving unit labels/suffixes (e.g.,
"seconds", "GB", "%", "connections", "digits", "IOPS", "MB/s", "rows")
to appear after their inputs for a consistent, predictable form
appearance.

* **Accessibility**
* Form controls now expose IDs and ARIA attributes from form context
when available, improving screen-reader descriptions and error
association.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

---------

Co-authored-by: Ivan Vasilov <vasilov.ivan@gmail.com>
2026-04-10 11:45:30 +10:00
Ivan Vasilov f55797fcda fix(studio): only redirect after project deletion if still on project page (#44633)
## 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?

After clicking delete on a project, the `onSuccess` callback
unconditionally redirects to `/org/{slug}` or `/organizations`. If the
user has already navigated away from the project page before the
deletion completes, this causes an unwanted redirect back to the
organizations page.

## What is the new behavior?

The redirect now only happens if the user is still viewing the deleted
project's page (`router.asPath.startsWith(/project/${projectRef})`). If
they've already navigated away, only the success toast is shown.

## Additional context

The Next.js pages router object is mutable, so `router.asPath` reflects
the current URL at callback execution time, not at closure creation
time.

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

## Summary by CodeRabbit

* **Bug Fixes**
* Fixed navigation behavior after project deletion to avoid unnecessary
redirects when you've already navigated away from the deleted project.

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

Co-authored-by: Claude Opus 4.6 <noreply@anthropic.com>
2026-04-08 19:40:56 +02:00
Ivan Vasilov 3f9765e2f8 refactor(studio): migrate all react-contexify usage to ContextMenu_Shadcn_ (#44520)
## 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?

Refactor

## What is the current behavior?

Studio uses `react-contexify` (an imperative, ID-based context menu
library) for right-click menus in the Table Editor grid, Log Table, and
Storage file explorer. This requires `createPortal` workarounds, a
separate CSS file, and has known bugs with fragment rendering.

## What is the new behavior?

All context menus now use the declarative `ContextMenu_Shadcn_`
(Radix-based) component that is already the standard across Studio. Each
context menu wraps its trigger element directly, removing the need for
imperative `show()` calls, portal hacks, and menu ID constants. The
`react-contexify` dependency and all associated styles are removed.

**Changes by area:**
- **Grid row context menu**: `RowRenderer` wraps each `<Row>` with
`ContextMenu_Shadcn_`. `RowContextMenu` refactored to accept `row`
directly as a prop instead of looking it up by index.
- **Log table**: Row renderer wraps each row with a context menu for
"Copy event message". Removes `cellPosition` state and `createPortal`.
- **Storage**: `FileExplorerRow` reuses its existing `rowOptions` array
for both the dropdown and context menu. `FileExplorerColumn` inlines the
column menu (new folder, select all, view/sort submenus). Three
standalone context menu files deleted.
- **Cleanup**: Removed `react-contexify` from `package.json`, deleted
`contextMenu.scss`, removed styles from `grid.scss`.

## Additional context

Net -370 lines. Follows the TODO comment in `CellContextMenuWrapper.tsx`
and the existing eslint ban on `react-contexify` imports.

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

* **Refactor**
* Replaced legacy right-click menus with a unified shadcn-style context
menu across grids, logs, and the storage explorer.
* Simplified row/column/item context menu behavior and copy actions;
menus now mount and trigger more reliably.

* **New Features**
* Added row-level context menu providers to ensure consistent triggering
and positioning for row actions.

* **Chores**
  * Removed legacy context-menu styles and deprecated menu components.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

---------

Co-authored-by: Claude Opus 4.6 <noreply@anthropic.com>
2026-04-07 13:46:29 +02:00
Ali Waseem 6be596ea34 feat: add user preference to enable queue operations (#44366)
## 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?

- Remove queue operations from feature preview into settings
- Refactor dashboard settings 
- Resolves DEPR-434

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

* **New Features**
* Dashboard settings panel in Account preferences with toggles for
Inline Editor and Queue Operations; “Dashboard” added to project
Configuration.

* **Removed**
* Old Inline Editor settings UI and the Queue Operations feature-preview
UI removed.

* **Refactor**
* Consolidated dashboard preferences into a single settings surface;
banners and actions now navigate to preferences; account/preferences
layouts and back-navigation behavior adjusted for platform vs
self-hosted.

* **Tests**
* Added tests for settings UI, menu generation, redirects, and
local-storage.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

---------

Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
Co-authored-by: Danny White <3104761+dnywh@users.noreply.github.com>
2026-04-06 13:52:53 +00: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
Alaister Young 7cf5df7b3e chore(studio): remove Fly.io integration code (#44336)
The Fly login/auth endpoints were removed from the management API
(supabase/platform#30987). This cleans up the associated studio code and
regenerates the API types.

Note: existing Fly projects are still running, so all `cloud_provider`
guards and Fly-specific UI (disk management, billing, pg_cron warnings,
etc.) are intentionally kept in place.

**Removed:**
- `sign-in-fly-tos.tsx` page
- `organization-by-fly-organization-id-mutation.ts`
- `project-by-fly-extension-id-mutation.ts`

**Other:**
- Regenerated API types to reflect removed endpoints
- Removed stale Fly-related comments in `InstanceConfiguration`,
`ObservabilityMenu`, `ReportsMenu`
- Fixed unrelated optional chaining bug in `SSOConfig.tsx`

## To test

- Check project creation flow still works
- Verify `/sign-in-fly-tos` no longer resolves

---------

Co-authored-by: Alaister Young <10985857+alaister@users.noreply.github.com>
Co-authored-by: Claude Sonnet 4.6 <noreply@anthropic.com>
Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>
2026-04-01 16:13:38 +08:00
Saxon Fletcher e21088144d Edge function overview (#44009)
<img width="1575" height="1134" alt="image"
src="https://github.com/user-attachments/assets/994b1113-717f-44a2-89a4-13bc0182db20"
/>

Attempts to improve our edge function overview pages to provide stronger
insights into the health of a function, including reliability (error
rates), performance (execution times) and usage (cpu and memory).

As part of this work it refactors existing charts to use our new chart
components.

main consideration is the collective performance of error queries
https://github.com/supabase/supabase/pull/44009/changes#diff-2a79cf61c5397a8ef363c333229fa7729a2efc90a4d8e0806e49c212d5aa97e7

## To test:
1. Create an edge function that errors out randomly across requests. You
can use cron to poll this function every second.
2. View the edge function and on the overview page confirm that errors
are showing and grouped correctly in recent failed invocations sections.

---------

Co-authored-by: Ali Waseem <waseema393@gmail.com>
2026-04-01 14:59:12 +10:00
Ali Waseem 636dcaa264 fix(studio): fix and filter Sentry issues (#44401)
## Summary

Fixes and filters several noisy Sentry issues affecting Studio.

### Code fixes
- **SUPABASE-APP-BG0** — `TypeError: Cannot read properties of undefined
(reading 'toString')` in JsonEditor. Guarded against `undefined`
`jsonStr` when `prettifyJSON` receives an undefined value.
- **SUPABASE-APP-BKM** — `TypeError: Cannot read properties of undefined
(reading 'join')` in UpgradeWarnings. Added fallback for
`error.dependents` being undefined from the API.
- **SUPABASE-APP-BVE** — `RangeError: Invalid time value` in filter date
picker. Validated date before passing to `Calendar` component.

### Sentry `ignoreErrors` filters
- **SUPABASE-APP-B1N / SUPABASE-APP-BMF / SUPABASE-APP-E4Q** — `cmdk`
`useSyncExternalStore` subscribe race condition (Chrome variant).
- **SUPABASE-APP-E5M** — Same `cmdk` subscribe error (Safari variant).
- **SUPABASE-APP-ASG** — Firefox `Node.removeChild` DOM manipulation
error (Chrome variant was already filtered).
- **SUPABASE-APP-AWE** — Non-Error object exceptions (`Object captured
as exception with keys:`).

### Ignored in Sentry (no code change)
- **SUPABASE-APP-ASG** — Resolved (now filtered in code).
- **SUPABASE-APP-FK9** — `SyntaxError: Invalid or unexpected token` from
`react-markdown` parser. Single user, one-off.
- **SUPABASE-APP-EV3** — React fiber error from DOM manipulation. Single
user, already archived.

## Test plan
- [ ] Verify JsonEditor opens correctly with valid and missing JSON
values
- [ ] Verify UpgradeWarnings renders when `dependents` is undefined
- [ ] Verify filter date picker handles invalid date strings gracefully
2026-03-31 12:21:09 -06:00
Gildas Garcia 62dbdeede8 fix: invalid react-hook-form usage (#44391)
## Problem

Some forms register their inputs incorrectly by calling
`control.register` and spreading the `field`.
This makes the form unusable.

## Screenshots

Design of the new analytics buckets table

Before:
<img width="554" height="564" alt="image"
src="https://github.com/user-attachments/assets/6ddf7ead-f576-44c4-b184-8102a52a22e2"
/>

After:
<img width="395" height="791" alt="image"
src="https://github.com/user-attachments/assets/ee85fcdd-b2a5-410d-9296-8bd6f1aa0b2f"
/>
2026-03-31 16:40:45 +02:00
Ivan Vasilov 8e10546305 chore: Clean up the flag for enabling Github integration on free plan (#44352) 2026-03-31 10:38:10 +02:00
Gildas Garcia 18e4ad227e chore: add shadcn input-group components (#44282)
## Screenshots

On a number input with units:
<img width="660" height="162" alt="image"
src="https://github.com/user-attachments/assets/1758a6d9-0836-4d41-80d1-97a03292db91"
/>

focused state:
<img width="651" height="71" alt="image"
src="https://github.com/user-attachments/assets/a92a5c39-2c7e-4c5f-9e4b-eb89810cc45c"
/>

On a textarea:
<img width="989" height="294" alt="image"
src="https://github.com/user-attachments/assets/cc696cb9-3671-4719-bdd8-daa1aea4f041"
/>
2026-03-31 09:14:56 +02:00
Ivan Vasilov 7bbd7060d3 fix: Set the default branch if it's not already set on Github integration (#44332)
Previously, the POST to `/v1/projects/{ref}/branches` didn't work on
free projects, which left some Supabase projects setup without a default
branch. Easy fix for those projects would be to disable/enable the whole
integration.

This PR fixes that so that when the user wants to setup a production
sync, the code checks if there's branches already setup and if not, sets
the selected branch as default.

---------

Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
2026-03-30 14:46:32 +02:00