Refactor
## What is the current behavior?
Many utility functions are in the Valtio object which is overly large
and complex.
## What is the new behavior?
Some utility functions are moved out and tested. No behaviour has been
changed, they've just been moved with any necessary changes to
arguments.
- Deleted SQL Snippets leave a hanging block that loads forever in
custom reports, and its not possible to delete them.
- Now you can delete blocks if they get stuck loading
- Also shows correct error state when a block couldn't load because the
sql snippet was removed
## before
- stuck forever
<img width="1296" height="936" alt="CleanShot 2026-02-26 at 13 23 25@2x"
src="https://github.com/user-attachments/assets/bb65cc5f-c2a4-4027-876e-db9682ec6f3c"
/>
## after
- show error state
- allow user to delete snippet
<img width="1388" height="862" alt="CleanShot 2026-02-26 at 13 23 45@2x"
src="https://github.com/user-attachments/assets/c5d6c114-071b-4e4d-a913-25b3c788db95"
/>
---------
Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
## What kind of change does this PR introduce?
UI update
## What is the current behavior?
- Database settings uses an older, much wider, layout
- This will become problematic later on as more complex elements are
added to the page
- Titles and descriptions are inconsistently formatted
## What is the new behavior?
| Before | After |
| --- | --- |
| <img width="1728" height="994" alt="Oldie 2 Toolshed
Supabase-EE998752-3696-45E4-A842-9666049153D8"
src="https://github.com/user-attachments/assets/8f0004cf-3bb4-4b00-900a-b116b80371a6"
/> | <img width="1728" height="994" alt="Oldie 2 Toolshed
Supabase-7E86FD58-35BB-4912-8B2F-8C7AAA03B462"
src="https://github.com/user-attachments/assets/606b51b4-21a0-4b7b-870b-ac92ed363f3c"
/> |
## Context
With the new home page, we have a stat to show the overall status of the
project + individual service health, both of which data is pulled from
an endpoint
<img width="283" height="400" alt="image"
src="https://github.com/user-attachments/assets/c7cbfdc6-b46b-41ce-9a89-59a3df98b586"
/>
At the time of project creation, some of the services start of as
UNHEALTHY, which results in the status stat here showing a label of
"Unhealthy" (while accurate in the sense that we're showing what's
coming from the API, its inaccurate as the services are still spinning
up)
## Changes involved
For each service, am opting to show their status as "COMING_UP" if the
service status is UNHEALTHY + the project's status is COMING_UP or
UNKNOWN. The overall status label should also show "Coming up" if the
project's status is COMING_UP or UNKNOWN as well
## What kind of change does this PR introduce?
- Feature
- Resolves DEPR-355
## What is the current behavior?
Only one email address can be invited to an organization at a time.
## What is the new behavior?
- Multiple email addresses can be invited (at a single scope) to an
organization at one time
- List of email addresses detected via comma-separation
- Pluralization on fields and labels
- Table and copywriting cleanup
| Before | After |
| --- | --- |
| <img width="808" height="691" alt="Supabase"
src="https://github.com/user-attachments/assets/f6450c26-968c-4ee8-bb7c-d6f6a3af1209"
/> | <img width="808" height="691" alt="8298"
src="https://github.com/user-attachments/assets/2d7e3869-b9d4-4a4f-89aa-ae55d67e794b"
/> |
| <img width="1024" height="560" alt="Supabase"
src="https://github.com/user-attachments/assets/9a255167-fcd3-4294-ba3a-9160bd500cff"
/> | <img width="1024" height="560" alt="Supabase"
src="https://github.com/user-attachments/assets/daba5bb8-eb12-43dc-86de-217e9baf0b72"
/> |
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* Added support for inviting multiple team members simultaneously via
comma-separated emails.
* **Improvements**
* Enhanced member management interface with clearer status indicators
(You, Invited, SSO, MFA enabled/disabled).
* Improved feedback messages for invitation outcomes and member status
changes.
* Updated member table layout with summary footer displaying member
count.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## Context
In the new project home page, we have a stat for "Last migration" which
we're showing _when_ the last migration was applied. However:
- The timestamp for the migration is derived from the "version" column
of the migration (in the `supabase_migrations` table) which afaik is
derived from the migration's file name
- It'll be alright if the migration was generated via the CLI, but we
can't really enforce the name of the migration file if say they were
generated via AI, so this is technically a point of flakiness
- Reckon that it's more value to show _what_ was the last migration
rather than _when_ so opting to change the value here to show the name
of the last migration instead
### Before
<img width="620" height="311" alt="image"
src="https://github.com/user-attachments/assets/6876acb6-91d2-4ae3-8ce8-98375658c12c"
/>
### After
<img width="582" height="322" alt="image"
src="https://github.com/user-attachments/assets/a40f6635-2068-4edb-a91a-ccf03d8e4d3c"
/>
- Add a warning about spend cap not applied on brahching when enabling
github integration
- Reduce default concurrent branches to avoid extra costs incurring
<img width="1247" height="833" alt="Screenshot 2026-02-16 at 18 58 14"
src="https://github.com/user-attachments/assets/9e93161d-7d80-4e6b-a102-3791b309c897"
/>
Fixes: DEVWF-1144
## What kind of change does this PR introduce?
UI update
## What is the current behavior?
- The vast majority of projects now have physical backups, not logical
- Physical backups are not downloadable
- But we show a disabled `Download` button for each physical backup
- This button has confusing multi-step instructions about `pg_dump` that
are
[inaccurate](https://supabase.slack.com/archives/C02BJ2239GA/p1771979586829419?thread_ts=1771887878.203199&cid=C02BJ2239GA)
## What is the new behavior?
- We only show the (enabled) `Download` button for logical backups
| Before | After |
| --- | --- |
| <img width="1024" height="563" alt="AWS Healthy Toolshed
Supabase-6FE7C23F-29D6-47B6-819A-84BC49927F3A"
src="https://github.com/user-attachments/assets/167441bf-3ead-4c86-89df-60ab89ce8b98"
/> | <img width="1024" height="563" alt="AWS Healthy Toolshed
Supabase-C9E763B7-B447-468E-B928-BB9AD5ABC588"
src="https://github.com/user-attachments/assets/3fccdf12-ba4e-424a-87ae-2294f1a3b7b1"
/> |
## Additional context
Support believes removing the button entirely will have less of a burden
than a better tooltip explanation.
## What kind of change does this PR introduce?
UI improvement
## What is the current behavior?
The session expired dialog is quite hard to parse when, for most people,
the ask is simple.
## What is the new behavior?
Improved session expired dialog:
- Refactored to use AlertDialog
- Clarified copywriting
- Uses the new AlertCollapsible to hide all the complicated debugging
steps under a toggle
- This component is documented in the design-system
| Before | After |
| --- | --- |
| <img width="1024" height="563"
alt="Supabase-B1728A05-DDD2-4A50-AED4-D62EAA2E7D7C"
src="https://github.com/user-attachments/assets/771f85d8-21ea-42b5-99f5-b9b05f5617dd"
/> | <img width="1024" height="563" alt="Storage Supabase"
src="https://github.com/user-attachments/assets/b2fcab68-fb29-4cb9-bd42-aecc57b9fa32"
/> |
| <img width="1024" height="563"
alt="Supabase-B1728A05-DDD2-4A50-AED4-D62EAA2E7D7C"
src="https://github.com/user-attachments/assets/771f85d8-21ea-42b5-99f5-b9b05f5617dd"
/> | <img width="1024" height="563" alt="Storage Supabase"
src="https://github.com/user-attachments/assets/babd3711-5fdf-43b9-be06-d96268a191fd"
/> |
## To test
In apps/studio/hooks/misc/withAuth.tsx:
```diff
- const [isSessionTimeoutModalOpen, setIsSessionTimeoutModalOpen] = useState(false)
+ const [isSessionTimeoutModalOpen, setIsSessionTimeoutModalOpen] = useState(true) // Mocked as true for UI testing
```
---------
Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
## Problem
Finding a specific edge function is cumbersome when you have many of
then.
## Solution
Use a combobox instead of a select to allow filtering
## How to test
- Enable the cron extension
- Enable the pg_net extension
- Create a few edge functions
- Create a new cron job and select _Supabase edge functions_
You should be able to:
- select/unselect an edge function
- filter the list to reduce the number of edge functions displayed
## What kind of change does this PR introduce?
Feature. Resolves DEPR-390
## What is the current behavior?
Projects aren’t sortable in either the card or table view.
## What is the new behavior?
Projects are sortable in both:
- Card view: sort dropdown
- Table view: sort dropdown or table column headers
| Before | After |
| --- | --- |
| <img width="1382" height="797"
alt="Supabase-4D1BFE40-875D-494C-8F17-A68D92826458"
src="https://github.com/user-attachments/assets/c4f17b77-bc90-447f-90cd-78a11c2e4129"
/> | <img width="1382" height="797"
alt="Supabase-D8C0AC7C-A28D-4AA6-BA7C-0FCD61DB5D11"
src="https://github.com/user-attachments/assets/d926d03d-2702-48e5-9d1f-0e09d163079d"
/> |
| <img width="1382" height="797"
alt="Supabase-0A545C5C-40B5-47F7-9ACD-2200879BB95E"
src="https://github.com/user-attachments/assets/f2103c32-a150-4db7-a78a-8bd610e2a028"
/> | <img width="1382" height="797"
alt="Supabase-0F7AB608-2E86-4F0C-BB60-C85D9B7F3D57"
src="https://github.com/user-attachments/assets/baa63f14-4059-483d-a9d6-33663e5cff43"
/> |
## Additional context
I wonder if this is overkill given most folks only have 1–2 projects.
Some ideas:
- Only sortable in table view via column headers
- Conditional rendering for folks with 2+ projects
- Opt-in feature
- Feature-flag
I’ve opted to make it global and synced for now.
---------
Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
Currently `/org/_` redirects to `/general` (org settings) after picking
an org, this makes it redirect to the project list
## to test
- go to /dashboard/org/_
- select org
- redirects to project picker
## test 2
- go to /dashboard/org/_/general
- select org
- redirects to /org/whatever/general (settings)
## What kind of change does this PR introduce?
Component improvement
## What is the current behavior?
[Admonition](https://supabase.com/design-system/docs/fragments/admonition)
often passes `actions`, often Button(s). These either are stacked via
the `layout` prop `horizontal` or `vertical`. That binary choice often
means, given layout flex, awkward text wrapping.
## What is the new behavior?
Admonition now has a `"responsive"` value for the `layout` prop. When
`layout="responsive"`, the Alert root gets `@container` so the
Admonition is the container-query context. The Admonition stays
`vertical` when it’s narrow and switches to `horizontal` when its own
width reaches the `@md` container breakpoint, independent of page width.
## Additional context
See the _Disk Management_ section of Database Settings to see the single
in-situ example.
Video demo:
https://github.com/user-attachments/assets/318a4530-5ae4-43f3-99cf-b75967659ed3
Enable the install/uninstall integration button on the stripe sync
engine only if the user has permissions to create/delete edge function
secrets. This fixes a problem when non-admin/non-owner users try to
install the integration but it fails due to lack of permissions. For a
user without appropriate permissions a tool tip will be shown:
<img width="1344" height="977" alt="image"
src="https://github.com/user-attachments/assets/49c950cc-d76b-40b4-ab6e-cb8f193561cc"
/>
---------
Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
This pull request standardizes the usage of props and value types for
the `ResizablePanelGroup` and `ResizablePanel` components across
multiple files in the codebase. Specifically, it replaces the deprecated
`direction` prop with `orientation`, and updates numeric prop values
(such as `defaultSize`, `minSize`, and `maxSize`) to be passed as
strings. This ensures consistency with the updated component API and
improves type safety.
**Component API Updates:**
* Replaced the `direction` prop with `orientation` for all usages of
`ResizablePanelGroup`
* Updated all `ResizablePanel` props (`defaultSize`, `minSize`,
`maxSize`) to be passed as strings instead of numbers, ensuring
compatibility with the latest API requirements.
* Removed deprecated or unnecessary props such as `order` from
`ResizablePanel` components, and ensured all size-related props are
consistently formatted as strings.
- adds option to create snippets from inline sql editor
- removes the date range from the header, its noisy
## to test
- go to custom report
- add block → snippets → add snippet
- create a new snippet in the inline SQL Editor
- back to add block → snippets → select your snippet
- your snippet should show in the report
- now try updating the snippet in the inline SQL Editor
- the chart/block should auto update
- amazing!
- EditorPanel can now load, save, and rename SQL snippets inline
- New SaveSnippetDialog component for saving snippets with AI-generated
titles
- EditorPanel state tracks active snippet ID and pending reset
- EditQueryButton opens the inline editor panel instead of navigating to
SQL editor page
- AIEditor exposes onMount callback for editor instance access
- SnippetDropdown label updated to "Create snippet"
## TO TEST
### Normal CRUD
- open inline SQL Editor
- try creating a new snippet
- try editing an existing snippet
### Homepage V2 Report
- Try adding a new block → create snippet
- create the snippet in inline sql editor
- select the snippet in the report block section
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Bug Fixes**
* Tightened detection of database function calls to require explicit
schema-qualified names; commands without a schema prefix are now treated
as SQL snippets, improving classification accuracy.
* **Tests**
* Added tests covering schema-qualified function calls, functions with
underscores, use of search-path functions, and various edge-case snippet
forms to validate parsing behavior.
<sub>✏️ Tip: You can customize this high-level summary in your review
settings.</sub>
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
This pull request updates the `react-data-grid` dependency and refactors
code throughout the codebase to use the new import structure and updated
APIs. The changes improve compatibility with the latest version of
`react-data-grid`, simplify imports, and update row selection logic to
match new hook signatures. Additionally, some code is reorganized to use
absolute imports for internal components.
---------
Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
This PR makes the following changes:
* Refactors the Stripe sync engine integration so that impossible states
are unrepresentable in the code.
* Factors out common code and functions into a single location to avoid
duplication.
* Factors out code to fetch installation/uninstallation and sync status
into a separate hook to make the code more readable.
* Shows uninstall progress when the user uninstalls the integration.
* Moves the **Uninstall integration** button from the **Settings** page
to the **Overview** page. This is done to avoid us having to track the
uninstallation progress via the url query params when the user is
redirected to the **Overview** page during uninstallation. Also it makes
sense for installation/uninstallation to be available on the same
location.
Note that even with the above changes there are some limitations to how
the uninstallation progress is shown. In particular, if the user
refreshes the page, the uninstallation status is lost because the
background uninstallation procedure currently doesn't update the comment
on the stripe schema during uninstallation. We are making a change in
the stripe sync engine code for that here:
https://github.com/stripe-experiments/sync-engine/pull/113
---------
Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
Add entitlement check for storage image transformations to properly
control access based on organization's plan.
### Changes
- Add `storage.image_transformations` entitlement check to Storage
Settings
- Add `storage.max_file_size.configurable` entitlement check to Storage
Settings
- Disable image transformation toggle based on entitlement instead of
just free tier check
- Wait for entitlement loading before initializing form values
- Use entitlement value as fallback when setting default
imageTransformationEnabled state
- Consolidate all loading states into a single isLoading variable for
cleaner code
### Testing
- Head to `/project/_/storage/files/settings` with an Org on the Free
Plan
- Assert that the Image Transformations toggle is disabled
- Head to `/project/_/storage/files/settings` with an Org on the Free
Plan
- Assert that the Image Transformations toggle is enabled
- Toggle it, save and refresh the page to assert that your changes were
correctly saved
This pull request upgrades the `react-resizable-panels` dependency from
version 2.x to 3.x. It also includes some minor improvements to
component props and key usage for React elements.
**Dependency upgrade:**
* Upgraded `react-resizable-panels` from version 2.1.4 to 3.0.0.
**Component improvements:**
* Added a `key` prop to the `ResizablePanelGroup` in `LogTable.tsx` and
to action buttons in `UnifiedLogs.tsx` to help React identify elements
more efficiently.
* Ensured unique `key` props for icons rendered in a map in
`FilterSideBar.tsx` to prevent React warnings.
## What kind of change does this PR introduce?
Grammar corrections across documentation and test descriptions.
## What is the current behavior?
Multiple docs and test files use "a" before acronyms that start with a
vowel sound when pronounced:
- "a HTTP" (pronounced "aitch-tee-tee-pee") should be "an HTTP"
- "a API" (pronounced "ay-pee-eye") should be "an API"
- "a RLS" (pronounced "arr-ell-ess") should be "an RLS"
- "the all users" is redundant (should be "all users")
## What is the new behavior?
All instances corrected to use proper English indefinite articles:
### Docs files (11 files):
- `firebase-auth.mdx` — "the all users" -> "all users" (2 occurrences)
- `log-drains.mdx` — "a HTTP drain" -> "an HTTP drain"
- `securing-your-api.mdx` — "a HTTP 402" and "a HTTP 420" -> "an HTTP"
- `scan-error-*.mdx` — "a HTTP 500" -> "an HTTP 500"
- `roboflow.mdx` — "a HTTP interface" -> "an HTTP interface"
- `auth-hooks.mdx` — "A HTTP Hook" -> "An HTTP Hook", "a HTTP hook" ->
"an HTTP hook", "a HTTP error" -> "an HTTP error"
- `auth-mfa.mdx` — "a HTTP 401" -> "an HTTP 401"
- `password-verification-hook.mdx` — "a HTTP request" -> "an HTTP
request"
- `before-user-created-hook.mdx` — "a HTTP implementation" -> "an HTTP
implementation"
- `pgtap-extended.mdx` — "a API exposed schema" -> "an API exposed
schema"
- `error-codes.mdx` — "a RLS policy" -> "an RLS policy"
- `broadcast.mdx` — "a RLS" -> "an RLS"
### Studio files (1 file):
- `CronJobs.utils.test.ts` — "a HTTP request" -> "an HTTP request" (9
test descriptions) + "notationa" typo -> "notation"
## Additional context
The rule: use "an" before acronyms pronounced with a leading vowel
sound. "HTTP" starts with "aitch" (vowel sound), "API" starts with "ay"
(vowel sound), and "RLS" starts with "arr" (vowel sound).
## What kind of change does this PR introduce?
Documentation and copy corrections.
## What is the current behavior?
Several docs and one Studio file contain grammar, spelling, and
capitalization issues:
- JS v1 upgrade guide: "we'll continuing" (should be "we'll continue"),
"Some the [PR]" (should be "See the [PR]"), extra space before comma
- Realtime docs: "PostgresSQL" (should be "PostgreSQL") in 2 files
- Kotlin SDK installing docs: "Websockets" (should be "WebSockets"),
"Checkout the" (should be "Check out the")
- Broadcast guide: "Websockets" (should be "WebSockets") in code
comments (5 occurrences)
- Prisma troubleshooting: "Checkout this" (should be "Check out this")
- Edge function template: "Websocket Server Example" (should be
"WebSocket Server Example")
## What is the new behavior?
All grammar, spelling, and capitalization issues are corrected:
- **Grammar**: "we'll continue" (verb tense), "See the [PR]" (correct
word), removed extra space
- **Spelling**: "PostgreSQL" (correct product name)
- **Capitalization**: "WebSocket" / "WebSockets" follows the official
W3C/IETF naming convention
- **Word splitting**: "Check out" as a phrasal verb (two words), vs
"checkout" the noun
## Files changed (8)
- `apps/docs/docs/ref/javascript/v1/upgrade-guide.mdx` — grammar fixes
(3 issues)
- `apps/docs/docs/ref/self-hosting-realtime/introduction.mdx` —
PostgresSQL -> PostgreSQL
- `apps/docs/docs/ref/realtime/realtime.mdx` — PostgresSQL -> PostgreSQL
- `apps/docs/docs/ref/kotlin/v2/installing.mdx` — WebSockets + Check out
- `apps/docs/docs/ref/kotlin/installing.mdx` — WebSockets + Check out (2
occurrences)
- `apps/docs/content/guides/realtime/broadcast.mdx` — Websockets ->
WebSockets (5 occurrences)
- `apps/docs/content/troubleshooting/prisma-error-management-Cm5P_o.mdx`
— Check out
- `apps/studio/components/interfaces/Functions/Functions.templates.ts` —
WebSocket template name
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Bug Fixes**
* Fixed timestamp display in request logs to ensure accurate time
representation.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
