dima/supabase
1
0 Fork 0
mirror of https://github.com/supabase/supabase.git synced 2026-10-10 20:05:06 +03:00
Code Issues Packages Projects Releases Wiki Activity
36,289 Commits 1,799 Branches 62 Tags
restructure-migration-docs
Commit Graph
805 Commits
Author SHA1 Message Date
Joshen Lim 88c43b31b9 Support optionally remove custom domain addon when deleting custom domain after activated (#45880) 
## Context

Related BE PR: https://github.com/supabase/platform/pull/32693

Add support to remove the custom domain add-on when deleting a custom
domain after the custom domain is activated.

<img width="411" height="310" alt="image"
src="https://github.com/user-attachments/assets/23d57fc0-f760-42d4-8383-480ff2b2ec5a"
/>

We previously had this behaviour by default to address some customer
feedback RE confusion that they were still being charged for custom
domain add-on despite deleting the custom domain, but not removing the
add-on.

However this was a bit of confusing UX (RE deleting the add-on
implicitly), so this makes the deleting of the custom domain add-on an
explicit action instead.

## To test

- [ ] Set up custom domain on a project
- [ ] Trying deleting the custom domain after activating _without_
removing the add-on
- [ ] Trying deleting the custom domain after activating _with_ removing
the add-on
 2026-05-15 16:41:58 +08:00
Joshen Lim ebfec0df36 Improve click targets on property actions (#45936) 
## Context

When opening the logs detail panel, some of the fields can be clicked to
add them as a filter. However the existing UX is that the clickable part
is just the text which makes it target small
<img width="233" height="127" alt="image"
src="https://github.com/user-attachments/assets/1d876bcc-05cf-464c-bdbe-907229be0586"
/>

Am opting the following:
- Make the whole row clickable
- Make all rows clickable with the main action being "Copy {column}"
- Only filterable columns will have the option to "Add as filter"

### After
<img width="483" height="153" alt="image"
src="https://github.com/user-attachments/assets/9d6e5479-fdbb-4609-839c-2bb7ad571b57"
/>
<img width="473" height="152" alt="image"
src="https://github.com/user-attachments/assets/f22197df-fa59-4e01-be00-2557260374f8"
/>


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

* **New Features**
* Row actions now consistently wrap rows and show a filter icon next to
the label when a resolved filter is available; copy menu displays "Copy
{label}".

* **Style**
* Standardized icon sizes and adjusted dropdown/row spacing; simplified
text wrap/truncate behavior for field values; minor status text color
refinement.

* **Bug Fixes**
* Dropdown row-action rendering made more robust to ensure menu wrappers
render reliably.

<!-- review_stack_entry_start -->

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

<!-- review_stack_entry_end -->
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
 2026-05-14 22:31:40 +08:00
Joshen Lim eb915e99f8 Joshen/debug 76 fix sticky hover state on log rows (#45933) 
## Context

The original problem was that some log rows remain in the hover state
after the cursor moves away

I was just cleaning up some of the styles and noticed that it doesn't
seem to happen anymore so thinking this might have fixed it haha 😅

## Changes involved
- Remove `group-hover` background color change behaviour in `TableCell`
in `ui`
- `TableRow` should handle the background color instead, hence the
changes in `UnifiedLogs.utils` too
- Remove unnecessary `renderLiveRows` in `DataTableInfinite` -> the prop
isn't being passed anywhere

## To test
- [ ] The sticky hover state happens when you hover over the rows very
quickly, so just make sure there's no "stale" hover state in any row eg:
<img width="400" alt="image"
src="https://github.com/user-attachments/assets/b4a91bc6-d269-4ee6-b222-b0476b9feffa"
/>


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

* **Refactor**
* Standardized hover styling for log rows and table cells to use direct
hover rules for more consistent visual feedback.
* Adjusted table cell hover/transition behavior to simplify styling
while preserving layout and checkbox spacing.
* Streamlined the data table API by removing the custom live-row
rendering override.
* Made the resizable panel’s minimum size dynamic based on dock
position.

<!-- review_stack_entry_start -->

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

<!-- review_stack_entry_end -->
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
 2026-05-14 22:00:04 +08:00
Joshen Lim cf49bc74ef Update copy for adding filter from log details (#45918) 
## Context

Just updates the copy for adding filters from the log details in unified
logs. "Include" was vague so opting for something more clearer, "Add as
filter for {column}"

### Before
<img width="199" height="130" alt="image"
src="https://github.com/user-attachments/assets/b5e0231c-99de-42a3-9cf2-66e0d9558379"
/>


### After
<img width="262" height="140" alt="image"
src="https://github.com/user-attachments/assets/8e8e3889-443c-4566-b118-7a13eb60f3b1"
/>

<img width="235" height="146" alt="image"
src="https://github.com/user-attachments/assets/e23b15ff-dd35-4e47-9d17-a82c8b898534"
/>


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

## Summary by CodeRabbit

* **Bug Fixes**
* Improved data table filter dropdown UI with clearer action labels and
properly sized icons for checkbox and input filter types.
* Expanded filter dropdown menu width for better visual clarity and
usability.

<!-- review_stack_entry_start -->

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

<!-- review_stack_entry_end -->

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
 2026-05-14 20:45:21 +08:00
Joshen Lim 597ad2ba56 Fix width of unified logs table to fit viewport, which fixes centering of load more button (#45914) 
## Context

Load more button in unified logs was off center because the `table`
element was exceeded the viewport width.
The fix needed was hence to adjust the width of the `table` to only take
up the remaining width of the viewport which then fixes the positioning
of the load more button.


### Before
<img width="1446" height="204" alt="image"
src="https://github.com/user-attachments/assets/fcd99e18-ede8-4454-b612-91b4384fb3e1"
/>


### After
<img width="1450" height="274" alt="image"
src="https://github.com/user-attachments/assets/d5f56383-bdb0-4418-a36f-242e72fe3a5b"
/>


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

## Summary by CodeRabbit

* **Style**
* Updated table container styling and layout properties for improved
rendering.
* Enhanced table header cell structure with improved styling attributes.

<!-- review_stack_entry_start -->

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

<!-- review_stack_entry_end -->

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
 2026-05-14 20:44:17 +08:00
Joshen Lim 59c550ac49 Improve loading state for unified logs (#45913) 
## Context

Improves loading state for unified logs

### Before
<img width="1451" height="957" alt="image"
src="https://github.com/user-attachments/assets/97280982-1358-4234-bcf4-d3e6590040b9"
/>


### After
<img width="1451" height="956" alt="image"
src="https://github.com/user-attachments/assets/b28eb3a8-e7eb-4fc9-bd0d-d0c8d40933ec"
/>


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

## Summary by CodeRabbit

* **UI Improvements**
  * Organization slug field now displays as read-only.
* Data table loading states now show skeleton rows with shimmer effect
instead of spinner.
  * Empty state displays simplified "No results found" message.

<!-- review_stack_entry_start -->

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

<!-- review_stack_entry_end -->

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
 2026-05-14 20:35:22 +08:00
Charis 2d2cc95caa studio: add SafeSql foundation utilities (1/7) (#45897) 
## Summary

First in a stack of seven PRs migrating the remaining `executeSql` call
sites to `SafeSqlFragment`. This PR lands pure additions — shared types
and helpers that later PRs import.

- `apps/studio/lib/postgres-types.ts` — `SafePostgresColumn` /
`SafePostgresTable` wrappers over `PGColumn` / `PGTable` that brand
`check` as `SafeSqlFragment` and add the optional `format_schema` field
- `apps/studio/lib/sql.ts` — `trimSafeSqlFragment` overload set that
preserves the brand through `.trim()`
- `apps/studio/lib/type-helpers.ts` — refine `DeepReadonly` so
primitives pass through unchanged
- `apps/studio/components/ui/SafeSqlInput.tsx` — `<Input>` wrapper that
emits `SafeSqlFragment` via `rawSql`

No consumers in this PR. The next PRs in the stack pick these up.

## Stack

This is PR 1 of 7. The full sequence:

1. **This PR** — Foundation utilities
2. `charis/safe-sql-last/2` — pg-meta columns + ColumnTypeRef cascade
3. `charis/safe-sql-last/3` — pg-meta non-column SafeSql
(functions/policies/triggers)
4. `charis/safe-sql-last/4` — Studio reports / query performance /
privileges
5. `charis/safe-sql-last/6` — Stragglers + remaining tests
6. `charis/safe-sql-last/7` — Flip `executeSql` signature from `string`
to `SafeSqlFragment`

## Test plan

- [x] `pnpm typecheck` passes for the Studio target on this branch
- [x] No runtime behavior changes — only type-level additions and a new
unused component

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

## Summary by CodeRabbit

## Release Notes

* **New Features**
* Introduced SafeSqlInput component providing secure and validated SQL
query input handling with built-in constraints and error prevention.

* **Refactor**
* Enhanced internal type definitions and utilities for Postgres metadata
handling and SQL operations to improve code reliability and
maintainability.

<!-- review_stack_entry_start -->

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

<!-- review_stack_entry_end -->

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
 2026-05-13 14:57:08 -04:00
Ali WaseemandDanny White 712cf7e60b feat(storage): add keyboard shortcuts for storage screens (#45837) 
## Summary

Adds keyboard shortcuts to the Storage section, mirroring the
conventions already established for Auth Users and Database pages:

- **Storage navigation chords** (`S, F` / `S, A` / `S, V` / `S, 3`)
active only inside `StorageLayout`.
- **Files (bucket list) page** shortcuts for search, create, refresh,
reset filters, reset sort.
- **Storage Explorer** shortcuts for upload, new folder, view toggle,
refresh, search, multi-select download/move/delete, and an Escape
ladder.
- `ShortcutTooltip` wired into the relevant buttons so users can
discover keybinds on hover.
- Reload spinner is now driven by a shared store flag, so it shows
whether you click the button or fire the shortcut.

## Test plan

### Storage navigation chords
Active anywhere under `/project/<ref>/storage/*`.

| Keybind | Action |
|---------|--------|
| `S` then `F` | Go to Files |
| `S` then `A` | Go to Analytics buckets (platform + feature-flagged) |
| `S` then `V` | Go to Vector buckets (platform + feature-flagged) |
| `S` then `3` | Go to S3 settings (platform only) |

### Files (bucket list) page
At `/project/<ref>/storage/files`.

| Keybind | Action | Notes |
|---------|--------|-------|
| `Shift+F` | Focus search ("Search buckets") | Selects existing text |
| `Shift+N` | Create new bucket | Opens the create-bucket modal |
| `F` then `C` | Reset filters | Clears the search string |
| `Shift+R` | Refresh buckets | Refetches the bucket list |
| `S` then `C` | Reset bucket sort | Only fires when sort ≠ default
(Created at) |

### Storage Explorer (inside a bucket)
At `/project/<ref>/storage/files/buckets/<bucketId>`.

| Keybind | Action | Notes |
|---------|--------|-------|
| `Shift+F` | Focus search ("Search files") | Opens the search input if
hidden, then focuses |
| `Shift+R` | Refresh | Refetches all opened folders; spinner reflects
state |
| `I` then `F` | Upload files | Disabled w/o ` STORAGE_WRITE ` or at
bucket root with no folder |
| `I` then `N` | Create folder | Same permission gates as Upload |
| `V` then `C` | View as columns | |
| `V` then `L` | View as list | |
| `Shift+D` | Download selected | Only fires when ≥1 item selected;
single vs many handled |
| `Shift+M` | Move selected | Only fires when ≥1 item selected AND `
STORAGE_WRITE ` granted |
| `Mod+Backspace` | Delete selected | Only fires when ≥1 item selected
(` Mod ` = ⌘ on macOS / ` Ctrl ` on Win/Linux) |
| `Escape` | Clear selection | If ≥1 item selected |
| `Escape` | Close file preview | If no selection and preview pane open
|
| `Escape` | Close search | If no selection, no preview, and search is
open |

### Tips while testing
- [x] Chords (two-key sequences): press the first key, release, then
press the second key within ~1s
- [x] Hover any wired button (search, Refresh, Upload, Create folder,
View, Download, Move, Delete, the bucket Create button, sidebar items)
to see the keybind in a tooltip
- [x] Most actions also appear under "Shortcuts" in `Cmd+P`
- [x] Chords starting with a plain letter (` S, F ` / ` I, F ` / ` V, C
` / ` F, C ` / ` S, C `) won't fire while typing in an input — click out
first
- [x] `Escape` does fire from inside the search field (closes the
search)
- [x] `Cmd+/` opens the full shortcuts reference

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

* **New Features**
* Keyboard shortcuts added across Storage: buckets (refresh, clear sort,
create, search), explorer (upload, create folder, refresh, download,
move, delete, clear search), and navigation shortcuts for
Files/Analytics/Vectors/S3.
* **UI**
* Shortcut keytips/tooltips added to relevant buttons and menu items for
discoverability.
* **Documentation/Tests**
  * Shortcut reference sheet labels updated and covered by a new test.

[![Review Change
Stack](https://storage.googleapis.com/coderabbit_public_assets/review-stack-in-coderabbit-ui.svg)](https://app.coderabbit.ai/change-stack/supabase/supabase/pull/45837)
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

---------

Co-authored-by: Danny White <3104761+dnywh@users.noreply.github.com>
 2026-05-13 08:26:04 -06:00
kemal.earth 8459c34202 fix(studio): export metric banner logos overflow (#45879) 
## 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?

These logos began to overflow the more log drains we've added. Imported
the animated logos from the empty state of log drains settings on free
accounts.

| Before | After |
|--------|--------|
| <img width="317" height="256" alt="Screenshot 2026-05-13 at 13 38 11"
src="https://github.com/user-attachments/assets/46f04abc-fe33-48f2-8c1f-7d543c85b5a8"
/> | <img width="638" height="540" alt="CleanShot 2026-05-13 at 13 47
11"
src="https://github.com/user-attachments/assets/e49a9123-f486-45d8-9714-ef41402762d6"
/> |





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

## Summary by CodeRabbit

## Release Notes

* **New Features**
* Expanded support for additional telemetry and service integrations
including OTLP, Amazon S3, Axiom, Last9, and Syslog in the Log Drains
interface.

* **Refactor**
* Updated animated logo component to support flexible sizing and styling
options, improving layout consistency across the metrics API banner.

<!-- review_stack_entry_start -->

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

<!-- review_stack_entry_end -->

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
 2026-05-13 14:35:30 +01:00
Ivan Vasilov 0abe792889 chore: Migrate the main Tailwind JS config to CSS (#45686) 
This PR migrates the JS config for Tailwind into a CSS config. As such,
all variables have been defined as CSS variables and they're using the
specialized Tailwind syntax for generating utility classes.

Beside the migration, these changes were also added:
- Added `tailwind.config.css` to few packages to make the Tailwind
Intellisense work.
- Migrated away from Radix style color classes to our defined classes,
the values will remain the same.
- Most of the CSS is generated by scripts, they'll be removed in next
PRs.
* Removed redundant `border-light` classes from several components since
it was undefined.
* Removed redundant `text-strong` classes from several components since
it was undefined.

How to test:
- Open all apps, compare the UI (mainly colors) to builds from #45417
and try to find a difference.


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

* **Style**
* Harmonized color variable usages and updated UI color references
(affects palettes, charts, gradients, hero illustrations, and
scrollbars).
  * Tweaked border, tab, and selection visuals across components.

* **New Features**
* Added a suite of theme animations and refined typography presets used
by site prose and docs.

* **Refactor**
* Overhauled Tailwind/theme configuration and color token generation for
more consistent theming.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
 2026-05-13 13:14:58 +02:00
Gildas GarciaandAli Waseem bcfc666284 chore: migrate remaining old input usages (#45791) 
## Problem

We still use our old `Input` in some places. This means multiple
components are bundled for the same use cases and we have some design
differences across the application.

## Solution

- [x] Migrate to the new ShadCN inputs
- [x] Fix `<InputGroupButton>` cannot be used with components that
triggers modal, popovers, dropdowns
- [x] Fix `<FormLayout>` does not display errors for inputs that are not
inside a React Hook Form
- [x] Fix `InputGroup` invalid design 

## Screenshots

### Table Editor - table edition sidepanel

Before:
<img width="758" height="1206" alt="image"
src="https://github.com/user-attachments/assets/d4da4af0-a9d3-4967-935f-554233d7896b"
/>

After:
<img width="747" height="1209" alt="image"
src="https://github.com/user-attachments/assets/6286e6a0-317f-486c-a8b4-0e233706ba0f"
/>

### Table Editor - row edition sidepanel
Before:
<img width="675" height="710" alt="image"
src="https://github.com/user-attachments/assets/9fdfe819-6d62-40c8-bdc8-fa6051dab834"
/>

After: (I placed the TextArea button at the bottom because ShadCN
reserves a full line space for it. It was weird at the top.
<img width="674" height="714" alt="image"
src="https://github.com/user-attachments/assets/611d5f8d-de12-4c16-ac38-bd9192cd6d73"
/>

### Database settings - password reset modal
Before:
<img width="773" height="548" alt="image"
src="https://github.com/user-attachments/assets/17f679a7-3aed-4cf9-8245-194a8a16823f"
/>

After:
<img width="563" height="311" alt="image"
src="https://github.com/user-attachments/assets/08888471-4cc8-4a3c-bf1e-8dce364f1aa6"
/>

### Database - Event triggers
Before:
<img width="1134" height="453" alt="image"
src="https://github.com/user-attachments/assets/e9d06d58-782c-4ccb-93c0-2ce1ca8c5748"
/>

After:
<img width="1115" height="451" alt="image"
src="https://github.com/user-attachments/assets/c437acb0-c602-4dd2-b249-66c7a7e739d6"
/>


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

* **New Features**
* Copy action now shows confirmation state (“Copy” → “Copied”) when
copying error details.

* **UI Improvements**
* Unified form-field layouts and input-group composition across editors,
settings, and integration forms for a more consistent experience.
* Password-strength feedback moved into field layout for clearer
messaging.
* Improved inline input/button/dropdown behaviors and non-React-form
error display.

* **Removed**
  * Display configuration settings component.

[![Review Change
Stack](https://storage.googleapis.com/coderabbit_public_assets/review-stack-in-coderabbit-ui.svg)](https://app.coderabbit.ai/change-stack/supabase/supabase/pull/45791)
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

---------

Co-authored-by: Ali Waseem <waseema393@gmail.com>
 2026-05-13 09:40:00 +02:00
Gildas Garcia 35571d242e chore: migrate <Collapsible> to shadcn <Collapsible> (#45819) 
## Problem

We have multiple `Collapsible` components.

## Solution

Reduce their number by using only the one from shadcn.
I haven't noticed any visual nor functional changes.

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

* **Refactor**
* Migrated expandable/collapsible UI to a unified shadcn-based
implementation for more consistent expand/collapse behavior across the
app.

* **Style**
* Updated listbox check icon sizing and removed obsolete collapsible
open/close animations.

* **Chores**
* Removed deprecated collapsible variants and consolidated UI component
surface for simpler maintenance.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
 2026-05-13 09:39:48 +02:00
Danny White 205ab69061 feat(studio): move CLI login to connect interstitial (#45814) 
## What kind of change does this PR introduce?

Feature / UI refactor

## What is the current behaviour?

The CLI browser login route still uses the older API authorisation
layout and redirects missing or failed sign-in session states to generic
404/500 pages.

## What is the new behaviour?

Moves `/cli/login` onto the shared connect interstitial layout as the
next small stacked slice after the organisation invite work.

This keeps the real CLI login contract intact while updating the
surface:
- creates the CLI login session from `session_id`, `public_key`, and
optional `token_name`
- redirects to the generated `device_code`
- renders missing-parameter and session-creation failures in-card
instead of redirecting away
- keeps the 8-character verification code selectable and copyable as a
single string
- uses a full-width primary `Copy code` action

This also adds the small shared interstitial helpers needed by this
surface and adjusts `CopyButton` so the copied check icon inherits the
primary button colour instead of turning green.

This also removes the CLI version admonition:

> Browser login flow requires Supabase CLI version 1.219.0 and above.

I checked with our stats and the CLI team. The vast majority of users
are on a newer version.

| Before | After |
| --- | --- |
| <img width="1024" height="759" alt="Authorize API access
Supabase-D1E3CF26-BD59-4BB2-B457-B552EE47E3DA"
src="https://github.com/user-attachments/assets/c89b8b13-fa98-41b7-8093-e59d15b2aa9e"
/> | <img width="1024" height="759" alt="Authorize CLI
Supabase-C9977F21-88B8-441B-8A2C-09A9515935B0"
src="https://github.com/user-attachments/assets/ca13b65a-3875-425c-b73b-8f2101c1e406"
/> |
| <img width="1024" height="759"
alt="Supabase-F42FBEAF-F74D-4920-8A51-7C25004F66D5"
src="https://github.com/user-attachments/assets/51adb1e6-a2fb-41fb-b36f-0ae466fe60e2"
/> | <img width="1024" height="759" alt="Authorize CLI
Supabase-8159A1B1-2594-4183-AC35-FEF1EFD4EA37"
src="https://github.com/user-attachments/assets/6f143218-795d-41c9-a8e1-52e529a6b988"
/>
| <img width="1024" height="759"
alt="Supabase-2506E468-9F42-44B9-A5B7-BC4D3777F552"
src="https://github.com/user-attachments/assets/a304fca5-cf26-4ae7-abe9-77cdbc21fba5"
/> | <img width="1024" height="759" alt="Authorize CLI
Supabase-A0EE1239-A345-427C-9CF7-997037A8FC0E"
src="https://github.com/user-attachments/assets/33118777-35f3-49d6-bc1e-30e7124b3677"
/> |
| <img width="1024" height="759" alt="Authorize API access
Supabase-A7B84CA6-D230-4C3E-9227-DE21CE35375C"
src="https://github.com/user-attachments/assets/78eb6296-035a-4201-b254-b97eda44443c"
/> | <img width="1024" height="759" alt="Authorize CLI
Supabase-F55E26B2-609B-449C-9C64-08AA90AE3D1E"
src="https://github.com/user-attachments/assets/ff7b3b4e-729c-4681-844d-2d5d94bfc084"
/> |

## Testing instructions

Use the Vercel preview URL for this PR once it is available. The
examples below use `<preview-origin>` as a placeholder, for example
`https://studio-git-dnywh-feat-cli-login-interstitial-supabase.vercel.app`.

You need to be signed in to Studio to see these states because
`/cli/login` is still behind `withAuth`.

Ready state:
- Open `<preview-origin>/cli/login?device_code=ABCD1234`
- Check the page title is `Authorize CLI | Supabase`
- Check the card title is `Authorize Supabase CLI`
- Check the code fills the width, uses the normal sans font, and can be
selected
- Drag-select the code and copy it; the clipboard should contain
`ABCD1234`, not one character per line
- Click `Copy code`; the button should show the usual copied success
state without a green check icon on the primary button

Missing parameters state:
- Open `<preview-origin>/cli/login`
- Check the card says `Missing sign-in parameters` and names the missing
`session_id` and `public_key` parameters
- Open `<preview-origin>/cli/login?session_id=session-test`
- Check it still stays in-card and names the missing `public_key`
parameter instead of redirecting to `/404`

Creation error state:
- Open
`<preview-origin>/cli/login?session_id=not-real&public_key=not-real&token_name=local-dev`
- Check it stays in-card with `Unable to create CLI sign-in` instead of
redirecting to `/500`
- The exact error detail can vary by environment; the important bit is
that the failure is shown inside the interstitial card

Loading state:
- This is transient because there are no production mocks in this slice
- To inspect it manually, throttle the browser network before opening a
session-creation URL such as
`<preview-origin>/cli/login?session_id=not-real&public_key=not-real`

Real CLI flow:
- Run the browser login flow from Supabase CLI as usual
- When the CLI opens a Studio URL, keep the path and query string but
replace the origin with the PR preview origin
- The page should create the login session and then route to
`/cli/login?device_code=<8 character code>`
- Enter that 8-character code back in the CLI prompt


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

* **New Features**
* Redesigned CLI login flow with clearer state-driven screens and
improved verification UI.
* Added a small paired-logo component for centered logo pairs with a
connector icon.

* **Improvements**
* Copy button behavior and styling refined for consistent visual
feedback across variants.

* **Tests**
* New unit tests covering copy-button behavior and multiple CLI login UI
flows.

[![Review Change
Stack](https://storage.googleapis.com/coderabbit_public_assets/review-stack-in-coderabbit-ui.svg)](https://app.coderabbit.ai/change-stack/supabase/supabase/pull/45814)
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
 2026-05-13 11:14:38 +10:00
Matt Rossman d143571586 feat(assistant): trace-level scorers + server-side tool execution with needsApproval (#45654) 
## Motivation

When Assistant runs a potentially destructive tool like `execute_sql`,
it stops the LLM request and prompts for client-side approval and
execution of the tool. After approval, a second request kicks off under
a separate trace. This has made scoring and
[Topics](https://www.braintrust.dev/blog/topics) classification
challenging, as the generated `output` is split across stateless
requests. The [span-level
scoring](https://www.braintrust.dev/docs/evaluate/custom-code#score-spans)
approach we've used thusfar (after the LLM call, we massage the result
into an `output` payload that's stuck onto the root span) has been
cumbersome and led to invalid scores / topics where only part of the
assistant response is considered. It's also inefficient, as we're
duplicating potentially large info (like the `search_docs` output) that
already exists within the trace.

An alternative to scoring spans is to [score
traces](https://www.braintrust.dev/docs/evaluate/custom-code#score-traces).
Braintrust [best
practices](https://www.braintrust.dev/docs/evaluate/score-online#best-practices)
advise:

> Use span scope for evaluating individual operations or outputs. Use
trace scope for evaluating multi-turn conversations, overall workflow
completion, or when your scorer needs access to the full execution
context.

We've also received [direct
guidance](https://supabase.slack.com/archives/C05QYJBLX89/p1777925770927149?thread_ts=1777905716.911979&cid=C05QYJBLX89)
from their team to use this approach.

## Changes

Migrates eval scorers from custom `AssistantEvalOutput` shape to
trace-level scoring via `trace.getThread()` / `trace.getSpans()`, with
thread parsing that scores the full latest Assistant turn and passes
prior conversation separately where relevant.

Moves `execute_sql` and `deploy_edge_function` from client-side
execution after approval to AI SDK `needsApproval` + server-side
`execute()`. SQL results returned to the model are gated by AI opt-in
level, so row data is only included with `schema_and_log_and_data`;
otherwise the tool returns the no-data-permissions sentinel.

Adds `metadata.isFinalStep` to disambiguate multiple LLM requests within
an "assistant" turn due to tool call requests/responses. For online
evals, this means we should configure automations to only score traces
with `metadata.isFinalStep = true` to ensure we're judging the complete
generated response.

Other minor kaizen changes:
- Renamed `promptProviderOptions` to `systemProviderOptions` to clarify
that this is associated with the "system" message and disambiguate from
the root `providerOptions`
- Adds `evals/trace-utils.ts` to handle Zod validation of the `unknown`
span shapes from Braintrust, to more easily access typed inputs/output
on tool spans.
- Bumps AI SDK floor version `^6.0.116` → `^6.0.174`
- Tweaked the "Conciseness" scorer to not unfairly dock points for the
new `[called tool_name]` labels in serialized assistant response

## Verification

In the studio staging build, I asked Assistant to create a todos table
with 3 sample todos. I manually approved the `execute_sql` call and saw
Assistant generate text before & after the call.

In Braintrust I verified two traces were produced (see [filtered
logs](https://www.braintrust.dev/app/supabase.io/p/Assistant/logs?v=Staging&tvt=trace&search={%22filter%22:[{%22text%22:%22metadata.environment%2520%253D%2520%27staging%27%22,%22label%22:%22metadata.environment%2520%253D%2520%27staging%27%22,%22originType%22:%22btql%22},{%22text%22:%22%2560Chat%2520ID%2560%2520%253D%2520%25221cb2ac45-e5e7-458c-9da4-3bf6863b8842%2522%22,%22label%22:%22Chat%2520ID%2520equals%25201cb2ac45-e5e7-458c-9da4-3bf6863b8842%22,%22originType%22:%22form%22}]})),
the first with `metadata.isFinalStep = false` and the second with
`metadata.isFinalStep = true`.

In the Braintrust staging scorers, I ran the preview Completeness scorer
on the second trace and verified it sees the complete Assistant response
including markers for tool calls ([link to
trace](https://www.braintrust.dev/app/supabase.io/p/Assistant%20(Staging%20Scorers)/trace?object_type=project_logs&object_id=b5214b62-ad1e-4929-9d5b-40b1daebe948&r=0ed0a4f8-8aff-4a34-bb1d-1df1d88a5070&s=ff9015f8-6bf7-4ab3-83a9-ca4e69e27e82))

<img width="1193" height="960" alt="CleanShot 2026-05-07 at 11 27 10@2x"
src="https://github.com/user-attachments/assets/509d4858-c3a1-4068-986d-3aa4d5617d1a"
/>

I also tested the `deploy_edge_function` workflow and verified it still
prompts for permission and warns on deployment of existing functions.

**References**
- https://www.braintrust.dev/docs/evaluate/custom-code#score-traces
-
https://ai-sdk.dev/docs/ai-sdk-core/tools-and-tool-calling#tool-execution-approval

Supercedes https://github.com/supabase/supabase/pull/45556 and
https://github.com/supabase/supabase/pull/45339

Closes AI-473

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

* **New Features**
* Tool actions (SQL execution, edge-function deploy) now require
explicit user Approve/Deny before proceeding.

* **Improvements**
* Assistant pauses for approval responses before sending follow-ups,
giving clearer control over risky actions.
  * Deploy/replace flows show confirmation and clearer replace warnings.
* Evaluation/scoring updated to use richer trace data for more accurate
assistant performance signals.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
 2026-05-12 15:24:21 -04:00
Jordi EnricandClaude Opus 4.7 90d383f182 feat(studio): cross-link disk IO usage to observability charts (#45376) 
## Problem

Users on the Infrastructure activity tab see a Disk IO Bandwidth chart
that plots burst budget percentage rather than real disk activity. The
more granular IOPS and throughput charts live in Observability, but
there is no path between the two pages — users either dismiss real
warnings or file support tickets.

Reported in [Linear
DEBUG-64](https://linear.app/supabase/issue/DEBUG-64).

## Fix

Two cross-links into Observability/Database:

1. **Below the Disk IO Bandwidth chart**
([InfrastructureActivity.tsx](apps/studio/components/interfaces/Settings/Infrastructure/InfrastructureActivity.tsx))
an Admonition with a "View detailed IOPS and throughput" button. Only
shown for the disk IO section, not CPU/RAM.
2. **In the disk IO exhaustion banner's Troubleshoot dropdown**
([ResourceExhaustionWarningBanner.tsx](apps/studio/components/ui/ResourceExhaustionWarningBanner/ResourceExhaustionWarningBanner.tsx))
a "View metrics" item alongside Documentation and Ask AI Assistant.

The banner part is wired via a new optional `metricsHref` on
`ResourceWarningMessage`, so CPU/RAM warnings can opt in later by adding
their own observability path.

## Test plan

- [ ] Visit `/project/{ref}/settings/infrastructure` on a project that
does not have dedicated I/O resources. Confirm the new Admonition
appears under the Disk IO chart and the button navigates to
`/project/{ref}/observability/database`.
- [ ] On a project with dedicated I/O resources, confirm only the
existing "dedicated I/O" Admonition shows (no double-Admonition).
- [ ] Trigger (or mock) a `disk_io` resource warning; confirm the
banner's Troubleshoot dropdown shows "View metrics" first and links to
Observability.
- [ ] Trigger a `cpu` or `ram` warning; confirm the dropdown does NOT
show the new item.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

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

* **New Features**
* Clarifies that the disk IO consumption chart shows remaining burst
budget, not real throughput.
* Adds a quick-access button to jump to the Database Observability page
for detailed read/write IOPS and throughput.
* Adds a "View metrics" link in resource exhaustion warnings for disk IO
issues (shown when a single warning is active).
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

---------

Co-authored-by: Claude Opus 4.7 <noreply@anthropic.com>
 2026-05-12 16:08:14 +00:00
Jordi EnricandClaude Opus 4.7 420d4d0b5a feat(studio): add Disk IO Burst Balance chart to DB Report (#45516) 
## Problem

When users hit a disk IO exhaustion notification, they open the Database
Observability report and find IOPS and throughput charts, but no view of
the metric that actually fired the warning: the EBS burst credit
balance. That signal is currently only available behind Custom Reports,
so the warning feels disconnected from the visible data.

> "The Dashboard actually shows them their burst budget, not their
normal disk usage. It leads to a lot of confusion." — support
> "Customers may receive an 'exhausting multiple resources' warning and
it's confusing because all the charts are 'fine', but it's the burst
credits exhaustion that fails them." — Maksym

Reported in [Linear
DEBUG-60](https://linear.app/supabase/issue/DEBUG-60).

## Fix

Add a clearly-labeled "Disk IO Burst Balance" chart to
[getReportAttributesV2](apps/studio/data/reports/database-charts.ts)
plotting `disk_io_budget` (% remaining) on a 0-100 axis. Tooltip and
titleTooltip explain the 5 MB/s throttle floor so users can correlate
this chart with the exhaustion banner copy (also being updated in
[supabase#45514](https://github.com/supabase/supabase/pull/45514)).

The chart is hidden for compute variants that have dedicated I/O
resources (4XL and above) since the burst credit pool does not apply
there. Burstable variants (nano through 2XL) see the chart inline next
to the existing IOPS and throughput charts.

DEBUG-61 ("replace Disk IO Usage % chart with disk throughput") was
already addressed in the V2 migration (the report only renders
`disk-iops` and `disk-throughput`; the old burst-percentage chart is
gone). I'll close that issue as completed once this lands.

## Test plan

- [ ] Visit `/project/{ref}/observability/database` on a project running
`nano`/`micro`/`small`/`medium`/`large`/`xlarge`/`2xlarge` compute.
Confirm the new "Disk IO Burst Balance" chart appears between throughput
and connections.
- [ ] On a project running `4xlarge` or larger compute, confirm the
chart is hidden (chart is omitted by `hide: !hasBurstableIO`).
- [ ] Hover the chart and a data point. Confirm the title tooltip and
inline attribute tooltip both surface the 5 MB/s throttle behaviour.
- [ ] Series renders 0-100 on the Y-axis.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

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

* **New Features**
* Added a Disk IO Burst Balance chart to monitor remaining burst
credits; displays percentage (0–100%) with tooltip referencing baseline
throughput. Shown only for supported compute variants and when the
feature flag is enabled.

* **Bug Fixes / UI Improvements**
* Improved chart header tooltip presentation: uses a unified tooltip,
includes inline docs links when available, and avoids duplicate docs
icons.

[![Review Change
Stack](https://storage.googleapis.com/coderabbit_public_assets/review-stack-in-coderabbit-ui.svg)](https://app.coderabbit.ai/change-stack/supabase/supabase/pull/45516)
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

---------

Co-authored-by: Claude Opus 4.7 <noreply@anthropic.com>
 2026-05-12 18:02:55 +02:00
Jordi EnricandClaude Opus 4.7 11dbb8d7d1 fix(studio): use per-tier baseline throughput in disk IO banner copy (#45833) 
## Problem

The disk IO exhaustion banner copy added in #45514 hardcoded the
throttle floor as **5 MB/s**, but that's only correct for nano. Every
burstable compute tier has its own baseline, since
`baselineThroughputMBps` in
[`packages/shared-data/compute-disk-limits.ts`](packages/shared-data/compute-disk-limits.ts)
is `toMBps(43)` for nano (which rounds to 5), `toMBps(87) = 11` for
micro, and so on:

| Tier | Throttle floor |
|------|---------------|
| nano | 5 MB/s |
| micro | 11 MB/s |
| small | 22 MB/s |
| medium | 43 MB/s |
| large | 79 MB/s |
| xlarge | 148 MB/s |
| 2xlarge | 297 MB/s |

Caught during review of the equivalent change in #45516.

## Fix

- Replace the hardcoded `5 MB/s` in
`ResourceExhaustionWarningBanner.constants.ts` with a `{baseline}`
placeholder in the `disk_io_exhaustion` banner copy.
- In `ResourceExhaustionWarningBanner.tsx`, read the selected project's
compute variant, look up `baselineThroughputMBps` in `COMPUTE_DISK`, and
substitute the placeholder in both the title and description. Falls back
to `'its baseline'` if the variant isn't in the map.

`cardContent` for `disk_io_exhaustion` doesn't mention the floor, so no
changes there.

## Test plan

- [ ] use dev toolbar to toggle the disk io banner, should see different
throttle floors based on instance
- [ ] on micro: "...throttled to 11 MB/s..."
- [ ] on medium: "...throttled to 43 MB/s..."

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

* **Enhancements**
* Disk I/O exhaustion warnings now display dynamic baseline values
tailored to each project's configuration instead of a fixed threshold.
* Warning and critical messages have been updated to reference the
project-specific baseline and clarify that throughput returns to that
baseline until the budget resets, improving clarity about throttling
behavior and its duration.

[![Review Change
Stack](https://storage.googleapis.com/coderabbit_public_assets/review-stack-in-coderabbit-ui.svg)](https://app.coderabbit.ai/change-stack/supabase/supabase/pull/45833)
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

---------

Co-authored-by: Claude Opus 4.7 <noreply@anthropic.com>
 2026-05-12 18:02:42 +02:00
ChloeGarciaMillerandandGildas Garcia 2c48c6a002 fix: improve accessibility for icon buttons in LayoutHeader (#45790) 
## 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 (accessibility improvement in LayoutHeader)

## What is the current behavior?

Icon-only buttons do not have explicit accessible names for screen
readers.

## What is the new behavior?

All icon-only buttons now have explicit accessible names using visually
hidden text (sr-only), ensuring proper screen reader support.

## Additional context

Tooltip text is preserved for visual users.
No visual changes were introduced.


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

* **Accessibility**
* Added hidden screen-reader labels to multiple toolbar and menu buttons
(Settings, Advisor Center, AI Assistant, SQL Editor, Help) so icons are
announced by assistive technologies, improving navigation and
discoverability across the studio interface.

[![Review Change
Stack](https://storage.googleapis.com/coderabbit_public_assets/review-stack-in-coderabbit-ui.svg)](https://app.coderabbit.ai/change-stack/supabase/supabase/pull/45790)
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

---------

Co-authored-by: Gildas Garcia <1122076+djhi@users.noreply.github.com>
 2026-05-11 17:30:16 +02:00
Jordi EnricClaude Sonnet 4.6Ali Waseem
 		b934e148a3 fix(reports): replace explicit any with number in tickFormatter callbacks (#45794) 
## Problem

Recent database report PRs introduced `(value: any)` type annotations in
recharts `tickFormatter` callbacks, pushing the
`@typescript-eslint/no-explicit-any` ESLint ratchet from baseline 1014
to 1017 and blocking all PR merges.

## Fix

Replace `(value: any)` with `(value: number)` in all affected
`tickFormatter` callbacks across the three flagged files. Recharts
always passes a number to tick formatters, so this is a safe and
accurate type.

## How to test

- Run `pnpm lint --filter=studio` and confirm no new
`@typescript-eslint/no-explicit-any` violations appear in the three
changed files
- Check the ESLint ratchet count is back at or below baseline 1014

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

* **Refactor**
* Improved type safety for Y‑axis tick formatters across observability
charts (Memory, Swap, Network throughput, Disk IOPS/throughput/usage,
Replication Lag), ensuring tick values are treated as numeric for more
consistent chart rendering and reliability.

[![Review Change
Stack](https://storage.googleapis.com/coderabbit_public_assets/review-stack-in-coderabbit-ui.svg)](https://app.coderabbit.ai/change-stack/supabase/supabase/pull/45794)
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

---------

Co-authored-by: Claude Sonnet 4.6 <noreply@anthropic.com>
Co-authored-by: Ali Waseem <waseema393@gmail.com>
 2026-05-11 14:41:14 +00:00
Jordi Enric f38872c7a6 refactor(reports): use LazyComposedChartHandler for replication lag (#45748) 2026-05-11 15:36:55 +02:00
Ali WaseemandDanny White 0278672102 feat(studio): add Auth sub-page navigation chords (#45696) 
## Summary
- Adds contextual `A + <letter>` chord shortcuts for jumping between
Authentication sub-pages while `AuthLayout` is mounted, mirroring the
existing database-nav chord pattern.
- Wires the shared `LIST_PAGE_*` shortcuts (focus search, create new,
reset filters, schema selector) onto the Auth list pages so they behave
like the Database list pages.
- Fills in the previously-missing `A + U` chord for the **Users** page
so every entry in the Auth menu has a chord.

Resolves
[FE-3187](https://linear.app/supabase/issue/FE-3187/add-a-u-keyboard-shortcut-for-auth-users-page).

## Auth navigation chords

Active anywhere under `/project/<ref>/auth/*`. Press `A` then the listed
letter.

| Page | Chord |
| --- | --- |
| Overview | `A` `O` |
| Users | `A` `U` |
| OAuth Apps | `A` `A` |
| Email | `A` `E` |
| Policies | `A` `P` |
| Sign In / Providers | `A` `I` |
| Passkeys | `A` `K` |
| OAuth Server | `A` `V` |
| Sessions | `A` `S` |
| Rate Limits | `A` `R` |
| Multi-Factor | `A` `M` |
| URL Configuration | `A` `L` |
| Attack Protection | `A` `T` |
| Auth Hooks | `A` `H` |
| Audit Logs | `A` `G` |
| Performance | `A` `F` |

## Auth list-page shortcuts

Each Auth list page opts into the shared `LIST_PAGE_*` registry — same
chords as the Database list pages (`Shift+F`, `Shift+N`, `F` `C`, `O`
`S`). Coverage matches the controls each page actually exposes:

| List page | Search (`Shift+F`) | New (`Shift+N`) | Reset filters (`F`
`C`) | Schema selector (`O` `S`) |
| --- | :---: | :---: | :---: | :---: |
| Custom Auth Providers | ✓ | ✓ | ✓ | — |
| OAuth Apps | ✓ | ✓ | ✓ | — |
| Policies | ✓ | — | ✓ | ✓ |
| Auth Hooks | — | ✓ | — | — |
| Redirect URLs | — | ✓ | — | — |
| Third-Party Auth | — | ✓ | — | — |

## Test plan
- [x] While anywhere under `/project/<ref>/auth/*`, every chord in the
navigation table jumps to the corresponding page.
- [x] On each list page in the second table, the marked shortcuts focus
the search input / open the create flow / reset filters / open the
schema picker as expected.
- [x] Chords are not active outside of `/project/<ref>/auth/*` and do
not trigger while typing in inputs (where `ignoreInputs` applies).

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

* **New Features**
* Global keyboard shortcuts for Auth pages: navigate auth sections,
focus/search inputs, reset filters, and open "Add" flows (providers,
OAuth apps, hooks, URLs, policies).
* "Add" controls in lists respond to shortcuts and show appropriate
disabled/tooltip states when unavailable.
* Product menu and shortcuts reference now include an "Auth Navigation"
section and per-item shortcut hints.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

---------

Co-authored-by: Danny White <3104761+dnywh@users.noreply.github.com>
 2026-05-08 07:13:25 -06:00
Saxon FletcherandGildas Garcia 4452e0ac2e Support form sidebar (#45203) 
Refactors our help sidebar within Studio to include the actual support
form itself when contact is selected. This PR also cleans up the initial
state of the sidebar and the options within.

## To test:
- Open an org and click the help icon top right
- Click contact support
- Submit a support ticket
- Click done to return to support sidebar state

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

* **New Features**
* Support form V3 and support sidebar with status button; direct-email
helper and URL prefill
* Success screen supports onFinish callback and customizable finish
label
* AI Assistant and Help options accept optional click callbacks;
resource items gain keyboard/accessibility support

* **Refactor**
  * Help panel split into home/support views with back navigation
* Support components accept flexible align/className props and
layout/styling tweaks
  * Initial URL params loader added for support form

* **Tests**
* New/updated tests for support flows, success screen, and help options
interactions
<!-- 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:51:49 +10:00
Danny WhiteandAli Waseem f32977f04d chore(studio): show active shortcuts in reference sheet (#45614) 
## What kind of change does this PR introduce?

UI chore.

## What is the current behavior?

The Keyboard shortcuts sheet renders shortcut definitions from the
static registry, so contextual Database navigation shortcuts appear in
the sheet even when `DatabaseLayout` is not active. This makes the
Navigation section noisy as more product-specific navigation shortcuts
are added.

## What is the new behavior?

The shortcuts sheet now reads the mounted, enabled shortcut set at
runtime. Global navigation remains under Navigation when it is the only
navigation scope, and splits into _**Global** Navigation_ plus
_**Database** Navigation_ when contextual database shortcuts are active.

This also replaces the one-off `DatabaseNavShortcuts` component with a
reusable `ProductMenuShortcuts` registrar so future product layouts can
register scoped navigation shortcuts from their product menu model.



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

* **New Features**
* Added keyboard shortcut support for product menu navigation items with
router integration

* **Improvements**
* Keyboard shortcuts are now organized into logical groups (Global
Navigation and Database Navigation)
* Shortcut reference dynamically displays only active shortcuts instead
of static definitions
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

---------

Co-authored-by: Ali Waseem <waseema393@gmail.com>
 2026-05-08 10:49:50 +10:00
Jordi Enric bef828ae48 feat(studio): apply timezone picker to observability/reports charts (#45667) 
## Problem

The dashboard's timezone picker (#45517) propagates to log timestamps
and the shared TimestampInfo component, but observability and reports
charts still render their X-axis labels, range labels, and tooltip
headers in the browser's local timezone. The result is jarring once a
user picks a non-local timezone: hover a chart and you get one tz, hover
a log row and you get another.

## Fix

Routes all display-side timestamp formatting in the chart layer through
the existing picker-aware helpers (\`useFormatDateTime\` /
\`formatDateTime\`) so chart UI matches the rest of the dashboard.

- **ComposedChart.utils** \`CustomTooltip\` (the hotspot — drives every
observability dashboard tooltip): reads the active timezone via
\`useTimezone\` for both the header label and the formatted timestamp.
- **AreaChart** / **BarChart**: introduce a \`formatChartDate\` helper
that honours each component's existing \`displayDateInUtc\` prop,
otherwise routes through the picker.
- **ChartBlock**: the two recharts \`labelFormatter\` arrows now close
over \`useFormatDateTime\`.
- **ChartHighlightActions**: range labels in the zoom dropdown migrated
to the same hook.

Intentionally untouched (must stay UTC):
- \`ChartHandler\` / \`ChartBlock\` \`startDate\`/\`endDate\` (API range
params, day boundary).
- \`ChartBlock.tsx:166\` explicit \`.utc()\` data-key normalisation.
- \`useFillTimeseriesSorted\` and friends (range math, no display).

## How to test

- Sign in. Open the avatar dropdown, pick a timezone different from your
browser local (e.g. Asia/Tokyo).
- Visit any project, then \`/project/<ref>/reports/database\` (or any
\`/observability/...\` page).
- Hover any chart series — the tooltip header should display the chosen
IANA name and times in that timezone.
- Click-drag a range on a chart to open the zoom dropdown — start/end
labels in the menu should also be in the chosen timezone.
- Switch back to "Auto detect" and confirm everything reverts to
browser-local.
- For an AreaChart/BarChart that uses \`displayDateInUtc\` (e.g. some
legacy reports), confirm those still render in UTC regardless of picker.

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

* **Refactor**
* Standardized date/time formatting across charts, tooltips, axis
labels, header/footer labels, and highlight range labels in Reports and
chart components.
* Switched to a shared, timezone-aware formatter that respects UTC
display mode or the selected picker/timezone, ensuring consistent,
human-readable timestamps throughout the UI.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
 2026-05-07 19:31:59 +02:00
kemal.earth 3864f25336 fix(studio): unified logs ui quriks (#45648) 
## 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?

Spotted a couple of Tailwind 4 migration UI quirks. This PR should fix
them.

#### 1. Outline around table body
| Before | After |
|--------|--------|
| <img width="1036" height="240" alt="Screenshot 2026-05-06 at 16 37 17"
src="https://github.com/user-attachments/assets/fc16a530-8457-4b4e-892c-19f5027e4d58"
/> | <img width="976" height="270" alt="Screenshot 2026-05-06 at 16 54
11"
src="https://github.com/user-attachments/assets/72d8eddc-6b3f-40ba-a211-e8939a104c36"
/> |

#### 2. Gap between header buttons
| Before | After |
|--------|--------|
| <img width="236" height="81" alt="Screenshot 2026-05-06 at 16 47 34"
src="https://github.com/user-attachments/assets/5daaef6e-c7f1-46e7-81e1-3e1fd3290825"
/> | <img width="187" height="51" alt="Screenshot 2026-05-06 at 16 54
15"
src="https://github.com/user-attachments/assets/017f8399-4f5d-4ae6-b2ff-7ffbdbee3f8b"
/> |



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

## Summary by CodeRabbit

* **Style**
* Refined spacing in action controls layout for improved visual
hierarchy
* Updated focus outline styling to enhance keyboard navigation
accessibility

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
 2026-05-06 17:13:51 +01:00
Ivan Vasilov ea0523ce02 Fix the Connect button to show the text. (#45646) 
The connect button was missing its text
Before:
<img width="833" height="244" alt="Screenshot 2026-05-06 at 17 46 23"
src="https://github.com/user-attachments/assets/c03e972f-bef6-4bd7-8819-dd51509c58eb"
/>

After:
<img width="678" height="208" alt="Screenshot 2026-05-06 at 17 46 58"
src="https://github.com/user-attachments/assets/5b020017-133e-47c3-8138-925c27299665"
/>


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

## Summary by CodeRabbit

* **Bug Fixes**
* Improved screen reader accessibility in the Connect button by refining
how text visibility is handled based on button display mode.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
 2026-05-06 16:04:54 +00:00
kemal.earthandAli Waseem b2e5476146 feat(studio): tidy up bottom tray in logs interface (#45371) 
## 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?

Tidying up the bottom panel in unified logs. Taking care of some visual
quirks etc. Also preparing this area to house some other future concepts
via tabs.

| Before | After |
|--------|--------|
| <img width="828" height="384" alt="Screenshot 2026-04-30 at 11 24 09"
src="https://github.com/user-attachments/assets/804bdf1c-7cdb-4dd8-bf1e-31c434ef1436"
/> | <img width="830" height="407" alt="Screenshot 2026-04-30 at 11 22
53"
src="https://github.com/user-attachments/assets/28555efe-f893-4bae-bcb0-284e6db733e6"
/> |




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

* **New Features**
  * Redesigned service flow panel with Overview and Raw JSON tabs
* Added Previous/Next navigation controls with Arrow Up/Down keyboard
support
* New detail components and section headers with icons for clearer
organization
  * Improved Postgres detail view and message/session display

* **Bug Fixes / Changes**
  * Removed legacy header UI and related controls

* **UI / Style**
  * Enhanced copy-to-clipboard feedback animation
  * Updated "Load more" button styling
  * Adjusted panel sizing for improved resizing behavior
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

---------

Co-authored-by: Ali Waseem <waseema393@gmail.com>
 2026-05-06 16:32:31 +01:00
Charis 465121894d studio: add sql provenance tracking to ai assistant + reports (#45608) 2026-05-06 09:14:45 -04:00
Jordi Enric d859176eac fix(studio): restore readable warning banner and toast close button after Tailwind v4 (#45585) 
## Problem

Two visual regressions surfaced after the Tailwind v4 migration
(#45318):

1. The Postgres upgrade-failed banner used the deprecated `Alert`
component, whose `warning` variant relies on custom `amber-1100` /
`amber-1200` color tokens that no longer resolve. The title rendered as
near-white on the yellow background.
2. The sonner toast close button forced `bg-transparent!
hover:bg-transparent!`, letting the library's default translucent circle
bleed through against the toast's overlay background on hover.

## Fix

- Migrate `ProjectUpgradeFailedBanner` to `Admonition` (the recommended
replacement per the deprecation note on `Alert`), which uses semantic
`warning-*` tokens defined in the theme.
- Drop the transparent-bg overrides on the sonner close button and give
it a proper `hover:bg-surface-200` with a fixed `size-6` hit area so the
X has a clean hover target.

## Before
<img width="2940" height="338" alt="image"
src="https://github.com/user-attachments/assets/2cf2cf52-cdf2-429d-b50c-5dc4e5b9c84b"
/>

## After
<img width="1642" height="506" alt="CleanShot 2026-05-06 at 11 14 03@2x"
src="https://github.com/user-attachments/assets/b6c9b3e2-9d3e-437d-92a6-95d12730e842"
/>


## Testing

- [ ] Trigger a failed Postgres upgrade state and confirm the banner
title/description/actions are all readable on the amber background.
- [ ] Fire a toast and hover the close button — the hover should show a
subtle square background, not a translucent circle.

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

* **Bug Fix**
* Project upgrade failure banner now only appears when an upgrade has
failed and no longer supports dismissing.

* **Style**
* Replaced the warning banner UI with a streamlined admonition that
shows only a “Contact support” action.
* Improved toast close-button styling for clearer sizing, color, and
interaction states.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
 2026-05-06 06:43:07 -06:00
Danny White 000d0c73bd fix(studio): align child sidebar hover states (#45613) 
## What kind of change does this PR introduce?

UI polish.

## What is the current behavior?

- A few product sidebar areas render menu rows outside the shared
ProductMenu/Menu.Item styling path, so their hover and selected states
differ from the rest of Studio.
- Database product menu shortcut tooltips are also scoped to the text
label instead of the full hoverable row.

## What is the new behavior?

- Integrations Explore/Installed, Observability, and Reports sidebar
rows now use the shared ProductMenu or Menu.Item pill styling.
- Observability spacing is tightened after the ProductMenu conversion. 
- Product menu shortcut tooltips now wrap the full row trigger, so the
entire Database sidebar row opens the tooltip.



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

## Summary by CodeRabbit

* **Refactor**
* Enhanced navigation menu components with improved loading and error
state handling across the dashboard.
* Streamlined menu structure and styling consistency for integrations,
reports, and observability sections.
  * Added enhanced tooltip support for navigation items.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
 2026-05-06 15:10:25 +08:00
Joshen LimandGildas Garcia f7ea722b35 Consolidate grid header actions in table editor into a single row (#45504) 
## Consolidate Table Editor grid header actions into a single row


https://github.com/user-attachments/assets/1020c385-8fa9-4ef1-b5e7-03983111508b

## Changes involved
- Index advisor, Realtime, and API docs are now behind a dropdown menu
button (Treated as secondary actions)
- Grid header actions shifted into the same row as filter bar (more
space for data grid)
- Header actions will hide while filter bar is in focus (remove
distractions, more space for filter bar)

## Changes to filter bar
- Filter bar will refocus when deleting a filter
- Clicking on the search icon will focus on the free form input of the
filter bar

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

* **New Features**
* Added a “More” dropdown in grid actions to access Realtime, API docs,
and Index Advisor.
* New dialogs for enabling Index Advisor and toggling Realtime are now
consistently managed.

* **Improvements**
* Improved filter focus handling with auto-refocus when conditions
change and responsive header behavior.
* Adjusted popover alignment, separator visuals,
header/footer/pagination layout and sizing.
* Filter bar now supports programmatic focus; Connect button supports
icon-only mode.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

---------

Co-authored-by: Gildas Garcia <1122076+djhi@users.noreply.github.com>
 2026-05-06 10:53:49 +08:00
Ali Waseem 2e904abebf feat(studio): add D + letter shortcuts for Database sub-pages (#45546) 
## Summary

Adds a contextual `D + <letter>` chord pattern for jumping between
Database sub-pages, mounted only while `DatabaseLayout` is active.
Establishes the pattern we can repeat for other sections (Auth, Storage,
Functions, etc.).

Linear:
[FE-3140](https://linear.app/supabase/issue/FE-3140/define-subnavigation-pattern-for-database-management-page)

## Pattern

- Chords are 2-key sequences (`D`, `<letter>`) — no global leader, no
`G` prefix.
- Registration is contextual: `<DatabaseNavShortcuts />` lives inside
`DatabaseLayout`, so the leading `D` is only "owned" while the user is
under `/project/<ref>/database/*`. Doesn't burn a global key.
- Hover tooltips on each sub-menu item show the chord, anchored to the
label text (Linear-style). Powered by `<ShortcutTooltip>` already used
in the main nav.
- Items hidden by feature flags (Roles, Column Privileges, Replication)
auto-disable the chord — no muscle-memory navigating to a 404.

## Shortcuts added

| Sub-page | Chord | Notes |
|---|---|---|
| Tables | `D T` | |
| Functions | `D F` | |
| Triggers | `D R` | t**R**iggers — `T` taken by Tables |
| Indexes | `D I` | |
| Extensions | `D X` | e**X**tensions |
| Schema Visualizer | `D V` | |
| Enumerated Types | `D E` | |
| Publications | `D U` | p**U**blications — avoids collision with Schema
Visualizer's `D P` (Download as PNG) |
| Column Privileges | `D C` | flag-gated |
| Settings | `D ,` | mirrors global `G ,` for project settings — avoids
collision with Schema Visualizer's `D S` (Download as SVG) |
| Replication | `D L` | rep**L**ication — flag-gated |
| Roles | `D O` | r**O**les — flag-gated |
| Backups | `D B` | platform-only |
| Migrations | `D M` | |

External-link sub-menu items (Policies, Wrappers, Webhooks, Security
Advisor, Performance Advisor, Query Performance) are intentionally not
chorded — they route out of `/database/*` and don't belong to the
section's namespace.

## Collision audit

Other shortcuts active on database pages (table-list, schema-visualizer)
were checked against the new chords:

- **Schema Visualizer** (`/database/schemas`): `D P` (Download PNG), `D
S` (Download SVG), `O A`, `O S`. Publications and Settings were remapped
to `D U` and `D ,` to avoid the `D P` / `D S` clashes.
- **List pages** (`/database/tables`, etc.): `Shift+F`, `Shift+N`, `O
S`, `F C` — no overlap with `D + <letter>`.

## Files

- `state/shortcuts/registry/database-nav.ts` — new registry module with
the 14 chord definitions.
- `state/shortcuts/registry.ts` — spreads the new IDs/definitions into
the canonical registry.
- `components/interfaces/DatabaseNavShortcuts.tsx` — null-rendering hook
component that wires `useShortcut` for each chord, keyed off
`useGenerateDatabaseMenu` so URLs and feature gating stay in sync with
the sidebar.
- `components/layouts/DatabaseLayout/DatabaseLayout.tsx` — mounts the
component.
- `components/layouts/DatabaseLayout/DatabaseMenu.utils.tsx` — tags each
menu item with its `shortcutId`.
- `components/ui/ProductMenu/ProductMenu.types.ts` — adds optional
`shortcutId?: ShortcutId` field.
- `components/ui/ProductMenu/ProductMenuItem.tsx` — renders the hover
tooltip when an item has a `shortcutId`, anchored to the label span.

## Test plan

- [ ] On `/project/<ref>/database/tables`, press `D F` — navigates to
`/database/functions`.
- [ ] On `/project/<ref>/database/schemas`, press `D P` — downloads the
PNG (Schema Visualizer wins, no nav conflict).
- [ ] On `/project/<ref>/database/schemas`, press `D U` — navigates to
`/database/publications`.
- [ ] On `/project/<ref>/database/tables`, press `D ,` — navigates to
`/database/settings`.
- [ ] Hover any sub-menu item with a chord — pill appears next to the
label after ~1s.
- [ ] On a project with the Replication flag off — `D L` does nothing.
- [ ] Navigate to `/auth` — pressing `D F` does nothing (chord unmounts
with the layout).
- [ ] Type `D` then `F` slowly inside an input — does not navigate
(input-focus guard).
 2026-05-05 09:57:25 -06: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
Ali Waseem 618c902e1a feat(studio): add keyboard shortcuts to Database listing pages (#45467) 
## Summary

Adds the `O→S` / `Shift+F` / `Shift+N` / `F→C` shortcut set across every
Database listing page, on top of the schema-visualizer pattern from
#45386. Fixes [FE-3131](https://linear.app/supabase/issue/FE-3131).

A shared `list-page.*` registry replaces what would have been a per-page
registry file for each route, and `useShortcut`/`Shortcut` gain a
`label` override so a single ID renders contextually in Cmd+K and hover
tooltips.

## Pages and shortcuts

| Page | `O→S` | `Shift+F` | `Shift+N` | `F→C` |
| --- | --- | --- | --- | --- |
| Tables | Open schema selector | Search tables | Create new table |
Clears search + entity-type filter |
| Functions | Open schema selector | Search functions | Create new
function | Clears search + Return Type + Security |
| Triggers — data | Open schema selector | Search triggers | Create new
trigger | Clears search + Table filter |
| Triggers — event | — | Search event triggers | Create new event
trigger | Clears search + Owner filter |
| Enumerated Types | Open schema selector | Search enumerated types |
Create new enumerated type | Clears search |
| Indexes | Open schema selector | Search indexes | Create new index |
Clears search |
| Roles | — | Search roles | Add new role | Clears search + filter type
→ 'all' |
| Publications | — | Search publications | — | Clears search |
| Extensions | — | Search extensions | — | Clears search |

`Shift+N` only fires when the page-specific gate allows it (permission +
unlocked schema + any other prerequisite like `hasTables` for triggers).

## Test plan

- [ ] On each of the 9 pages, all four shortcuts behave as listed in the
table above
- [ ] Hover the wrapped controls — tooltip shows the page-specific label
and the right keybind badge
- [ ] Open the schema selector via `O→S` — the hover tooltip is
suppressed while the popover is open
- [ ] `Shift+N` is a no-op on locked schemas / when permission is
missing / when a prereq fails (e.g. no tables on Triggers data)
- [ ] `Shift+F` focuses the search input; while focused, Escape clears
(with text) → Escape blurs (when empty)
- [ ] `Cmd+K` shows the page-specific shortcut name while on each page;
the entry goes away on navigation
- [ ] `Mod+/` reference sheet shows one "List pages" group with 4
generic entries
- [ ] No regression to existing schema-visualizer / table-editor /
SQL-editor shortcut behavior

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

* **New Features**
* Added a dedicated list-page shortcut group in the shortcuts reference.

* **Improvements**
* Keyboard shortcuts across database list pages: focus & select search,
reset filters, and create-new-item shortcuts.
* Escape now clears/searches or blurs inputs to avoid accidental popover
closes.
* Create/new buttons respond to shortcuts when allowed; disabled actions
keep permission tooltips for clarity.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
 2026-05-04 07:08:35 -06:00
Jordi EnricandClaude Opus 4.7 6391246fe9 fix(studio): name the 5 MB/s throttle floor in disk IO banner (#45514) 
## Problem

The disk IO exhaustion banner currently warns that the project "may
become unresponsive". That phrasing is vague and non-actionable. The
actual behaviour when EBS burst credits hit zero is deterministic:
sustained throughput is throttled to 5 MB/s until the budget resets.
Users either ignore the warning or wait too long because they cannot
picture what is about to happen.

Reported in [Linear
DEBUG-62](https://linear.app/supabase/issue/DEBUG-62).

## Fix

Rewrite the `disk_io_exhaustion` banner copy in
[ResourceExhaustionWarningBanner.constants.ts](apps/studio/components/ui/ResourceExhaustionWarningBanner/ResourceExhaustionWarningBanner.constants.ts)
to name the throttle floor explicitly:

- **Warning** (about to deplete): "Once exhausted, disk throughput will
be throttled to 5 MB/s until the budget resets."
- **Critical** (depleted): title now reads "Disk throughput is throttled
to 5 MB/s"; description explains the throttle stays until the budget
resets and that upgrading restores full performance.

Card copy on the project list (the compact summary) is unchanged so the
home page does not get noisy.

The banner already renders an "Upgrade compute" primary CTA (via
`correctionUrlVariants.disk_io`), so no button changes are needed.

## Test plan

- [ ] Mock or trigger a `disk_io` warning at the warning level; confirm
new copy renders correctly.
- [ ] Same at critical level; confirm both title and description are
updated.
- [ ] Verify the project list card on the home page still shows the
existing short summary.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

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

## Summary by CodeRabbit

* **Updates**
* Improved disk I/O exhaustion warning messages to clearly communicate
that disk throughput will be throttled to 5 MB/s and explain when
throttling will be lifted. Guidance on upgrading compute or optimizing
disk-intensive queries remains available.

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

Co-authored-by: Claude Opus 4.7 <noreply@anthropic.com>
 2026-05-04 12:45:50 +02:00
Ali Waseem e6f779ea30 feat(studio): add keyboard shortcuts to the schema visualizer (#45386) 
## Summary

Adds the first batch of keyboard shortcuts for the Database → Schema
Visualizer page, following the registry pattern established for the SQL
editor and table editor.

Fixes [FE-3115](https://linear.app/supabase/issue/FE-3115).

## Shortcuts

| Shortcut | Action |
| --- | --- |
| `Mod+Shift+C` | Copy schema as SQL |
| `Mod+Shift+M` | Copy schema as Markdown |
| `D` then `P` | Download schema as PNG |
| `D` then `S` | Download schema as SVG |
| `O` then `A` | Open the auto-layout confirmation dialog |
| `O` then `S` | Open the schema selector |

All six entries appear in the Cmd+K command menu under "Shortcuts" and
in the global shortcuts sheet (`Mod+/`) under a new "Schema Visualizer"
group while the page is mounted. None are surfaced in Account →
Preferences yet (`showInSettings: false`), matching how the SQL/table
editor batches shipped.

The schema selector and auto-layout button are wrapped in the unified
`Shortcut` component so the keybind is shown on hover (Linear-style).
The dropdown items for copy/download don't get hover hints since
tooltips on dropdown items don't make sense — they're discoverable via
Cmd+K instead.

## Toasts

Each user-visible action now confirms via a sonner toast:

- `Successfully copied as SQL` — fires on Copy as SQL (button or
`Mod+Shift+C`).
- `Successfully copied as Markdown` — fires on Copy as Markdown
(dropdown or `Mod+Shift+M`).
- `Successfully downloaded as PNG` / `Successfully downloaded as SVG` —
already present in `useExportSchemaToImage`; fires on click or `D → P` /
`D → S`.
- `Failed to download current view: …` — error toast on download failure
(also pre-existing).

## Notes

- `Mod+Shift+C` and `Mod+Shift+M` collide with the SQL editor's
`results.copy-csv` / `results.copy-markdown` shortcuts. They coexist
cleanly because `useShortcut` only fires while the hook is mounted, and
the two pages live on different routes. Both labels appear in the global
shortcuts sheet honestly scoped per surface.
- `SchemaSelector` was promoted to a `forwardRef` component that spreads
extra props onto its outer `<div>`. This was needed for `<TooltipTrigger
asChild>` to attach event handlers and the ref properly — previously
they were silently dropped and the hover tooltip didn't render.
- `SchemaSelector` and the auto-layout `AlertDialog` accept controlled
`open` props now so the shortcuts can drive them and the tooltip can be
suppressed while the popover/dialog is open (`Shortcut` gained a
`tooltipOpen` passthrough for this).
- Auto-layout still pops the existing confirmation dialog rather than
running directly — destructive enough to keep the guardrail.

## Test plan

- [x] On the Schema Visualizer page, each of the six shortcuts fires the
corresponding action.
- [x] Hover the schema selector and the Auto layout button — tooltip
shows the action label and keybind badge.
- [x] Open the schema selector popover (click or `O → S`) — hover
tooltip is suppressed while open.
- [x] Open the auto-layout confirm dialog (click or `O → A`) — hover
tooltip is suppressed while open.
- [x] Cmd+K shows all six entries under "Shortcuts" while on the page;
navigating away unregisters them.
- [x] `Mod+/` shortcuts sheet has a "Schema Visualizer" group listing
all six.
- [x] Copy as SQL / Markdown each fire a confirmation toast; PNG / SVG
downloads each fire a confirmation toast.
- [x] On the SQL editor results page, `Mod+Shift+M` / `Mod+Shift+C`
still copy results (no regression from the duplicate keybinds).
- [x] The download dropdown items still work via click; PNG/SVG
downloads succeed.
- [x] All other consumers of `SchemaSelector` (~15 callsites) render
unchanged after the `forwardRef` promotion.

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

* **New Features**
* Keyboard shortcuts for schema visualizer: copy as SQL/Markdown,
download PNG/SVG, auto-layout, and focus selector
  * Success toasts when copying content to clipboard

* **Improvements**
* Schema selector and auto-layout dialog can be opened/closed via
keyboard and programmatically
* Shortcut tooltips can be suppressed when related overlays/dialogs are
open
  * Schema Visualizer added to the shortcuts reference sheet

* **Tests**
  * E2E tests dismiss transient toasts to avoid UI interference
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
 2026-05-01 07:13:37 -06:00
Joshen Lim 7f8ae81d64 Clean up table editor header (#45452) 
## Context

Resolves FE-3126

Just cleaning up the table editor header with a bit of refactors
(pre-req to investigating collapsing filter bar and table editor header
actions into a single row)

## Non-visual changes involved
- Break down components within `GridHeaderActions` into smaller ones
  - `IndexAdvisorPopover`
  - `SecurityDefinerViewPopover`
  - `RealtimeToggle`
- Deprecate use of `useUrlState` in `GridHeaderActions` to use
`useQueryState` instead
- Improve types for `TwoOptionToggle`

## Visual changes involved
- Collapse realtime button toggle into a button icon, with no text (just
tooltip)
- Adjust layout of buttons a little

### Before
<img width="796" height="118" alt="image"
src="https://github.com/user-attachments/assets/436bca94-4d91-471a-a184-487c6f78dc04"
/>

### After
<img width="731" height="132" alt="image"
src="https://github.com/user-attachments/assets/5fd30982-a1fc-4f92-a590-146d1e69d52a"
/>


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

* **New Features**
  * Index Advisor popover with recommendations.
  * Realtime toggle to manage realtime table publication.
  * Security Definer view popover with optional autofix.
  * Insert menu for adding rows/columns and CSV import.

* **Bug Fixes**
  * Adjusted filter bar input sizing for improved readability.

* **Refactor**
* Header layout updated and insert/import actions moved into dedicated
components.

* **Tests**
  * Updated end-to-end selectors for the Insert row menu item.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
 2026-05-01 18:45:21 +08:00
Joshen Lim 09be492bbf Shift auto enable rls to a minimisable banner instead (#45410) 
## Context

Continuing off from this PR:
https://github.com/supabase/supabase/pull/45407

Shifting the "Auto enable RLS" toast into a banner that's dismissible,
only can be minimised until action is taken
Given that this is a security measure that we highly advise - otherwise
there's no way for users to revisit this after dismissing

We'll use the existing local storage key so it doesn't affect the
behaviour for users who already dismissed the banner

Starting state: (Not dismissed / not minimised)
<img width="1450" height="424" alt="1"
src="https://github.com/user-attachments/assets/de419812-69f5-4370-a553-88a83f27a6f7"
/>

If dismissed already / minimised: Shift CTA into a button tooltip
<img width="1449" height="402" alt="2"
src="https://github.com/user-attachments/assets/c404f39d-021f-43ba-b855-f83aea858162"
/>

Button will disappear entirely once the trigger is created

Also added this to the database tables page
<img width="1913" height="534" alt="image"
src="https://github.com/user-attachments/assets/a0c65986-6e23-4795-8720-a33ec6eec3c1"
/>


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

## Summary by CodeRabbit

* **New Features**
* Redesigned the Row Level Security (RLS) notice with a new card-based
layout and minimize button to reduce visual clutter while keeping the
feature accessible.
* Added a compact icon-only mode for the RLS notice in page headers,
with tooltip descriptions for clarity.
* RLS notice minimization state is now persisted locally per project,
improving user experience across page navigation.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
 2026-05-01 14:05:42 +08:00
Danny White 61c6c51b81 feat(studio): improve keyboard shortcuts reference (#45352) 
## What kind of change does this PR introduce?

Feature improvement to the Studio keyboard shortcuts reference and
command palette behaviour.

## What is the current behavior?

The keyboard shortcuts sheet does not support filtering, some shortcut
labels are harder to scan at a glance, and the command palette shows
"Show all keyboard shortcuts" before the more contextual shortcuts in
the `Shortcuts` section.

## What is the new behavior?

Adds live filtering to the keyboard shortcuts sheet, keeps the sheet
width stable on small breakpoints, renders arrow-based shortcuts more
compactly, and moves "Show all keyboard shortcuts" to the end of the
`Shortcuts` section so contextual actions appear first.


https://github.com/user-attachments/assets/315a1a36-0cfb-4a0d-b6de-ef3c86aa9a05


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

* **New Features**
* Added search for keyboard shortcuts with live filtering, group-aware
results, clear-search action, and empty-state handling
  * Added arrow key symbols for clearer shortcut visuals

* **Improvements**
* Updated shortcut visuals and typography for a tighter, pill-style
presentation
* Improved command menu ordering so shortcut-related entries appear in a
logical sequence

* **Tests**
* Added tests covering shortcut search behavior, display formatting, and
platform-specific key rendering
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
 2026-05-01 04:56:19 +00:00
Joshen Lim 66a99dce81 Auto enable RLS trigger shift into confirmation dialog (#45407) 
## Context

Shifts the "auto enable RLS" banner in the auth policies page into a
dialog for transparency on what SQL will be run as a result of creating
the `ensure_rls` database trigger

<img width="320" height="239" alt="image"
src="https://github.com/user-attachments/assets/9d1dd071-697d-4b40-aaa3-63f4147899b3"
/>

<img width="606" height="536" alt="image"
src="https://github.com/user-attachments/assets/68765278-b2f2-489b-89a7-2383d37ffe9f"
/>


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

## Summary by CodeRabbit

* **Improvements**
* Redesigned RLS trigger creation with a dialog-driven flow for better
user guidance
* Added permission-based access controls with informational tooltips
when unavailable
  * Display of trigger SQL code for transparency
  * Enhanced success notifications on completion

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
 2026-05-01 10:51:47 +08: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
Ali WaseemandJoshen Lim 2f5f6ffa79 chore: help users navigate graphql lints for anon and authenticated roles (#45295) 
## 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, feature, docs update, ...

- Hide lints when exposed within local storage 
- Revoke on roles 


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

* **New Features**
* Added a GraphQL-exposure action in linter items that shows a
confirmation modal with the exact SQL, lets you revoke GraphQL access,
executes the operation, shows success/error toasts, and refreshes lint
results.
* Added an informational callout linking to database integration
settings when GraphQL exposure is detected.
* Lint actions now close the side panel and return the UI to the list
after completion.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

---------

Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
 2026-04-30 07:16:06 -06:00
Ali WaseemandJoshen Lim 9cd688528f feat(studio): change SQL editor assistant shortcut to Cmd+Shift+K (#45380) 
## Summary

Closes
[FE-3109](https://linear.app/supabase/issue/FE-3109/change-sql-editor-assistant-shortcut-to-cmdshiftk).

The SQL editor's "Generate SQL" Monaco action was bound to `Cmd+K`,
which conflicted with the global command menu shortcut while the editor
was focused. This PR moves the assistant shortcut to `Cmd+Shift+K` and
makes `Cmd+K` open the global command menu from inside the editor.

## Changes

- `MonacoEditor.tsx` — rebind `generate-sql` to `Cmd+Shift+K`. Add an
`editor.addCommand` for `Cmd+K` that opens the global command menu
(gated on the user's `COMMAND_MENU_OPEN` shortcut preference). Without
this, Monaco swallows `Cmd+K` as a chord prefix and the global hotkey
never fires inside the editor.
- `SQLEditor.tsx` — update the empty-editor placeholder text from
`CMD+K` to `CMD+SHIFT+K`.

## Notes

- Monaco's standalone defaults bind `Cmd+Shift+K` to "Delete Line";
registering an `editor.addAction` with the same keybinding overrides it.
- The same `Cmd+K` binding still exists in
`apps/studio/components/ui/AIEditor/index.tsx` (used by the inline
editor panel and edge functions). Out of scope for FE-3109 — happy to
file a follow-up.

## Test plan

- [x] Focus the SQL editor, press `Cmd+K` → global command menu opens.
- [x] Focus the SQL editor, press `Cmd+Shift+K` → Generate SQL widget
opens (or "Make an edit" if a diff is already visible).
- [x] Disable the command menu shortcut in Account → Preferences →
Keyboard shortcuts and confirm `Cmd+K` no longer opens the menu from
inside the editor.
- [x] Empty SQL snippet placeholder reads "Hit CMD+SHIFT+K to generate
query…".

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

* **Improvements**
  * Reorganized SQL editor keyboard shortcuts for clearer access
* "Generate SQL" shortcut changed to Ctrl/Cmd + Shift + K (was Ctrl/Cmd
+ K)
  * Command menu can now be opened with Ctrl/Cmd + K when enabled
  * Editor UI shortcut hints updated to reflect the new bindings
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

---------

Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
 2026-04-30 07:09:58 -06:00
Ivan VasilovandJordi Enric 56de26fe22 chore: Migrate the monorepo to use Tailwind v4 (#45318) 
This PR migrates the whole monorepo to use Tailwind v4:
- Removed `@tailwindcss/container-queries` plugin since it's included by
default in v4,
- Bump all instances of Tailwind to v4. Made minimal changes to the
shared config to remove non-supported features (`alpha` mentions),
- Migrate all apps to be compatible with v4 configs,
- Fix the `typography.css` import in 3 apps,
- Add missing rules which were included by default in v3,
- Run `pnpm dlx @tailwindcss/upgrade` on all apps, which renames a lot
of classes
- Rename all misnamed classes according to
https://tailwindcss.com/docs/upgrade-guide#renamed-utilities in all
apps.

---------

Co-authored-by: Jordi Enric <jordi.err@gmail.com>
 2026-04-30 10:53:24 +00:00
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
Ali WaseemandDanny White fa8f49b261 feat(studio): add keyboard shortcuts to the SQL editor (#45335) 
## Summary

Adds the first batch of keyboard shortcuts for the SQL editor, following
the registry pattern established for the table editor.

## Shortcuts

| Shortcut | Action | Notes |
| --- | --- | --- |
| `Esc` | Blur the SQL editor | Registered as a Monaco command with a
context-key precondition so inline widgets keep owning `Esc` (suggest,
find, parameter hints, snippet/rename mode, accessibility help, inline
suggestions, and selection cancellation). |
| `Shift+E` | Focus the SQL editor | Pairs with `Esc` for mouse-free
round-trip. |
| `Alt+Shift+F` | Prettify SQL | Now wired through the registry; the
tooltip and dropdown badge in `UtilityActions` read the keybind from the
same source of truth. Works from inside the editor (Monaco action) and
from anywhere on the page (`useShortcut`). |
| `Mod+Shift+Enter` | Run EXPLAIN ANALYZE | Routes results into the
Explain tab. Surfaces in the Monaco context menu next to "Run Query". |
| `Shift+N` | Open a new SQL snippet | Navigates to `/sql/new?skip=true`
to avoid the redirect-to-last-visited effect that fires on plain
`/sql/new`. |

All entries appear in the command menu (`Mod+P`) under "Shortcuts" while
their host components are mounted. None are surfaced in Account →
Preferences → Keyboard shortcuts yet (`showInSettings: false`), matching
how the table editor shortcuts shipped.

## Notes

- The blur shortcut intentionally lives on the Monaco instance rather
than the document-level hotkey listener — the document listener can't
preempt Monaco's own `Esc` handling. Other shortcuts that need to fire
while the editor has focus (run, save, format, explain) are registered
as Monaco actions; everything else uses `useShortcut`.
- Format and explain are double-registered (Monaco action +
`useShortcut`) so they fire whether the editor is focused or not. The
Monaco actions don't read the user's enable/disable preference yet —
same asymmetry as the existing run/save actions.
- `Shift+N` is scoped to the SQL editor route. To make it work globally
we'd register it at a higher layout level.

## Test plan

- [x] Inside editor: `Esc` blurs; suggest/find/parameter hints still
close on `Esc`; multi-cursor selection collapses on first `Esc`, blurs
on second.
- [x] Outside editor: `Shift+E` returns focus to the editor.
- [x] `Alt+Shift+F` formats from inside and outside the editor; tooltip
+ dropdown badge show the correct keybind.
- [x] `Mod+Shift+Enter` runs EXPLAIN ANALYZE and switches to the Explain
tab.
- [x] `Shift+N` opens a fresh snippet without bouncing back to the
previous one.
- [x] All five shortcuts appear in `Mod+P` with the right badges.

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

* **New Features**
* Keyboard shortcuts for SQL editor: format SQL, run EXPLAIN ANALYZE,
focus/blur editor, and open a new SQL snippet.
* Added "Prettify SQL" and "Run EXPLAIN ANALYZE" actions to the editor
context menu with shortcuts.
* Centralized registration of SQL editor shortcuts so they appear across
the app.

* **UX Improvements**
* Escape key blurs editor focus when appropriate to allow easy exit
without disrupting editor widgets.

* **Style**
  * Adjusted success toast capitalization for copied Markdown.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

---------

Co-authored-by: Danny White <3104761+dnywh@users.noreply.github.com>
 2026-04-29 06:45:31 -06:00
Saxon FletcherandJoshen Lim 3b756e4d9f Chore/project secure (#45108) 
<img width="2652" height="830" alt="image"
src="https://github.com/user-attachments/assets/3c3921e7-c255-4e59-a9c3-c5f97da87788"
/>

Adds a full screen alert behind a feature flag `projectNeedsSecuring`
that prompts for fixing RLS issues.

Adjusts a few other small styles to add more prominence to critical
advisor issues.

To test:

- Enable the flag
- Make sure you have a table with RLS disabled
- Open project home and note the fade in of full page review
- Click "copy prompt" or "fix" and note the prompt
- Click skip to home and refresh the page, note it doesn't appear
anymore


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

* **New Features**
* Project-level security gate on project home with AI assistant prompts,
table details, per-project dismissible notice, and a new telemetry event
for CTA interactions.

* **Improvements**
* Stronger visual treatment for critical advisor items and advisor CTA
when critical issues exist.
* Assistant dropdown supports a copy-prompt callback; added
local-storage key and utilities/types to support project security
workflows.

* **Tests**
  * Added tests covering gate behavior, navigation, and dismissal logic.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

---------

Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
 2026-04-29 04:08:09 +00:00
Ali Waseem 6fe0ad442b fix(studio): drive compute card cores/memory from infra_compute_size (#45334) 
## Summary

Fixes
[FE-3095](https://linear.app/supabase/issue/FE-3095/compute-size-hover-card-shows-badge-and-cpumemory-from-out-of-sync).

The compute size hover card on the project home dashboard was sourcing
its badge and its CPU/memory rows from two different cached responses,
which can disagree:

| Field shown | Previous source |
|---|---|
| Badge ("XLARGE") | `project.infra_compute_size` (project-detail query)
|
| Cores / memory | `selected_addons[compute_instance].variant.meta`
(project-addons query) |

A customer reported seeing an **XLARGE** badge next to **2-core ARM
(Shared) / 1 GB** — the micro-tier specs — and asked whether their
upgrade had actually been applied. The upgrade was applied; only the
rendered card was contradictory.

## Fix

Source both the badge and the CPU/memory rows from the same logical
fact: look up the variant in `available_addons` whose identifier matches
`ci_${infra_compute_size}` and read its `meta`. `available_addons` is
essentially a static catalog of variant specs, so once it's loaded the
card cannot show specs that disagree with the badge.

This also collapses the special-cased `INSTANCE_MICRO_SPECS` fallback
into the existing `getAvailableComputeOptions` helper (which already
provides micro/nano fallbacks). The nano UX text ("Shared / Up to 0.5
GB") is preserved by switching that JSX branch to key on `computeSize
=== 'nano'`.

## Out of scope

- `useProjectAddonUpdateMutation` does not invalidate
`projectKeys.detail`. That's hygiene worth doing later, but
project-detail has a 30s `staleTime` and the resize already drives 5s
polling via the `RESIZING` status path, so the badge refreshes naturally
and this fix doesn't depend on it.

## Test plan

- [ ] Hover the compute badge on a project at each compute size (nano,
micro, small, ..., 16xlarge) and confirm CPU and memory rows match the
badge.
- [ ] Resize a project from micro → large; on completion, confirm the
hover card shows large specs (no transient micro values).
- [ ] Open the dashboard for a free-tier project on micro that has no
`compute_instance` entry in `selected_addons` and confirm the card still
shows micro specs (i.e. `getAvailableComputeOptions` micro fallback is
engaged).
- [ ] Confirm the "Unlock more compute" CTA still appears for
non-highest sizes and disappears at the highest size.
 2026-04-28 17:55:19 +00:00
Ali Waseem e7c33bf580 feat(studio): add insert, filter, sort, refresh shortcuts to the table editor (#45191) 
## I have read the
[CONTRIBUTING.md](https://github.com/supabase/supabase/blob/master/CONTRIBUTING.md)
file.

YES

## What kind of change does this PR introduce?

Feature — a second batch of table editor shortcuts, stacked on top of
#45178.

## What is the current behavior?

Inserts / filters / sort / refresh are all mouse-only. No keyboard
access, and no affordance for discovering what keybinds might exist.

## What is the new behavior?

### New shortcuts

| Keybind | Action | Surface |
|---|---|---|
| `I` then `R` | Insert row | hotkey + Cmd+K + inline keybind in Insert
dropdown |
| `I` then `C` | Insert column | hotkey + Cmd+K + inline keybind in
Insert dropdown |
| `I` then `U` | Import data from CSV | hotkey + Cmd+K + inline keybind
in Insert dropdown |
| `Shift+F` | Focus filters | hotkey + Cmd+K — focuses the new filter
bar's freeform input |
| `F` then `C` | Clear filters | hotkey + Cmd+K — gated on
`filters.length > 0` |
| `S` then `C` | Clear sort | hotkey + Cmd+K — gated on `sorts.length >
0` |
| `Shift+R` | Refresh table | hotkey + Cmd+K + hover tooltip on the
Refresh button |

All are `ignoreInputs: true` so they don't fire while typing. The insert
/ clear-filters / clear-sort shortcuts use two-step chords so they don't
clobber single-letter keys users might reach for elsewhere; Focus
filters and Refresh keep their Shift-prefixed single-step bindings.

### Infrastructure

- **New `<ShortcutBadge>`** (`components/ui/ShortcutBadge.tsx`) — inline
keybind display. Reads the sequence straight from the registry, so the
ID is the single source of truth. Renders multi-step chords with a
"then" separator between steps. Defaults to `variant="inline"` (the flat
`text-foreground/40` style used across the app in `RunButton`,
`ActionBar`, `OperationQueueSidePanel`, etc.) with `variant="pill"`
available if someone needs the boxed style.
- **Insert dropdown restyled** — each `DropdownMenuItem` in
`HeaderNew`'s Insert menu now shows its keybind inline on the right
(centered vertically, with `pr-4` + `shrink-0` so long table names in
the description never crowd the badge).
- **`RefreshButton`** swapped from `ButtonTooltip` to `<Shortcut>` so
the keybind tooltip renders automatically from the registry.
- **`FilterPopoverPrimitive` untouched** — the old filter bar is being
deleted, so Shift+F is scoped to the new filter bar only. The handler
focuses `[data-testid="filter-bar-freeform-input"]` (the existing
freeform input in the ui-patterns `FilterBar` → `FilterGroup`).

## Additional context

Stacked on #45178 (FE-3057 — initial table editor shortcuts). Rebase
after that one merges.

### Test plan

- [x] Open a table → Insert dropdown shows keybind to the right of each
item, no wrap encroachment even with long table names
- [x] `I` then `R` opens the Row editor; `I` then `C` opens the Column
editor; `I` then `U` opens the CSV import flow
- [x] `Shift+F` focuses the new filter bar's freeform input
- [x] Add a filter → `F` then `C` clears it; shortcut disabled in Cmd+K
when no filters are applied
- [x] Sort a column → `S` then `C` clears sort; shortcut disabled when
no sorts
- [x] `Shift+R` refreshes the table (spinner shows on the Refresh
button); hover the button → keybind tooltip
- [x] All seven new entries show up in Cmd+K when their gates are
satisfied

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

* **New Features**
* Added keyboard shortcuts for table actions: insert row, insert column,
import CSV, refresh, focus filters, clear filters, and clear sorts.
* Shortcuts are available in the command menu and show visual keyboard
hints.

* **UI**
  * Menu entries now display shortcut badges.
* Refined dropdown spacing/layout and updated the refresh control to
surface its shortcut.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
 2026-04-28 09:09:59 -06:00
kemal.earth 65365213af feat(studio): logs header improvements (#45275) 
## 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?

A little bit of tidy up here so the header area of unified logs isn't so
dominant. Moved actions to the same line as search bar and made other
parts a little more subtle, so the focus reamains on the logs
themselves.

| Before | After |
|--------|--------|
| <img width="980" height="213" alt="Screenshot 2026-04-27 at 11 47 37"
src="https://github.com/user-attachments/assets/ae22e7dd-272f-4433-a270-67b550a00536"
/> | <img width="893" height="153" alt="Screenshot 2026-04-27 at 12 27
17"
src="https://github.com/user-attachments/assets/87b8cfc9-66a4-4634-a3c6-c45e4b8fc486"
/> |






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

* **New Features**
  * Keyboard shortcut to toggle filter visibility in logs.
* Consolidated top bar with refresh, view options, download, and live
controls—desktop and mobile optimized.

* **Style**
* More compact, organized header with tooltips showing live status and
shortcut hints.
* Reduced filter input typography and streamlined mobile filter trigger.

* **Other**
* Side panel sizing and logs area layout refined for clearer visuals and
consistent header/body styling.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
 2026-04-28 11:51:00 +01:00