mirror of
https://github.com/supabase/supabase.git
synced 2026-10-08 02:45:07 +03:00
effect
167
Commits
| Author | SHA1 | Message | Date | |
|---|---|---|---|---|
 Saxon Fletcher
|
9718eea593 |
refine role impersonation popover (#49467)
**Old** <img width="979" height="839" alt="image" src="https://github.com/user-attachments/assets/7239604f-a37f-483c-84eb-dbafabdeb73c" /> **New** <img width="1185" height="645" alt="image" src="https://github.com/user-attachments/assets/e699d75f-fd04-47dc-a8da-97f880e39796" /> ## 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? Studio UI refinement. This is PR 2 of 2 and depends on #49466. ## What is the current behavior? The Run SQL query as a role submenu uses the full role-impersonation card layout, making the nested popover substantially larger than the surrounding query controls. ## What is the new behavior? - Adds a compact role-impersonation presentation used only by the query submenu. - Uses horizontal FormItemLayout rows and base ToggleGroup, InputGroup, Input, and Button components. - Keeps role choices stacked while using tiny controls for user source, user lookup, external-user fields, and MFA level. - Keeps authenticated-user controls visible but disabled for Postgres and Anonymous roles. - Preserves project-user search, external-user claims, impersonation, and stop-impersonating behavior. - Leaves existing role selectors in GraphQL, Table Editor, Realtime, and other surfaces unchanged. ## Verification - Focused compact role-selector test - Studio, UI, and UI Patterns typechecks - Existing focused Toggle and MultiSelector tests - Studio ESLint - Local visual and interaction verification against the supplied prototype <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit ## Summary by CodeRabbit * **New Features** * Redesigned role impersonation with role-specific summaries and native role icons. * Added native and external user impersonation, including user-source switching and MFA controls. * Added user search, external user ID entry, and clearer active-user controls with accessible labels. * **Bug Fixes** * Improved role switching, impersonation clearing, pending selections, and error recovery. * **Tests** * Expanded coverage for role selection, user impersonation, MFA updates, state transitions, and error handling. <!-- end of auto-generated comment: release notes by coderabbit.ai --> --------- Co-authored-by: Joshen Lim <joshenlimek@gmail.com> |
||
|
Joshen Lim
|
097a105663 |
joshenlim/fe 4176 add role impersonation to explorerquerysourcemenu (#49101)
## Context Stacked off from https://github.com/supabase/supabase/pull/49098 - adds role impersonation for both Notebook Query cell + Explorer Query tab Note that this refactors the role impersonation state a little to decouple some stuffs to make this work, since the role impersonation state is global and we need a local state to support this UX Similarly to row limit, for query tab its intentional that for now that the role impersonation isn't scoped to the query draft atm as I wanna avoid making changes to explorer-query given there was a couple of PRs in flux that adjusts that file - will handle that separately <img width="1117" height="577" alt="image" src="https://github.com/user-attachments/assets/9bfd6287-efff-418b-a1c0-934ee2c840cb" /> <img width="1917" height="436" alt="image" src="https://github.com/user-attachments/assets/bfd1be82-8f77-4764-bd3a-4b9c63169b82" /> ## To test - [ ] Verify that role impersonation works in notebook query cell - [ ] Verify that role impersonation works in notebook query tab <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **New Features** * Added role impersonation support to SQL Explorer queries. * Users can select an impersonated role directly from database query menus. * Query execution now applies the selected role when configured. * Added local role selection state for individual query tabs and cells. * Improved reuse and consistency of role impersonation controls across the interface. * Role selections and impersonation details remain synchronized across supported query components. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
Joshen Lim
|
d61477085e |
Joshenlim/fe 4175 add row limit in explorerquerysourcemenu (#49098)
## Context Related to Explorer/Notebook - builds on the ExplorerQuerySourceMenu by adding an option for row limit in both Notebook Query cell + Query Tab ## Side note RE persistence of the selected row limit value Note that for QueryTab - its intentional that for now that the row limit isn't scoped to the query draft atm as I wanna avoid making changes to `explorer-query` atm as there's a couple of PRs in flux that touches that file. So will handle that separately ^ This means that switching between query tabs will not change nor persist the row limit <img width="931" height="335" alt="image" src="https://github.com/user-attachments/assets/d1d52ee7-7c1d-42aa-a6ae-1d7d99ab95c9" /> <img width="1381" height="486" alt="image" src="https://github.com/user-attachments/assets/689368c9-c0fc-4000-a09e-f59bfa7afa97" /> ## To test - [ ] Verify that row limit behaviour works in notebooks - [ ] Verify that row limit behaviour works in explorer query tab |
||
|
Charis
|
0ed49231b7 |
refactor(studio): unify CellSource and the SQL editor's QuerySource into QuerySourceBinding (#49072)
Third of a stack. **Stacked on #49070** (which is stacked on #49069) — review those first. Base retargets automatically as each merges. Mechanical throughout; no behavior change. ## The problem Three types described where a query runs, and no two agreed: | | shape | |---|---| | `CellSource` (registry) | `{ id, type, parameters: { … } }` — `id` and `type` always held the same literal | | `QuerySource` (SQL editor) | `{ type: 'database' } \| { type: 'logs', dateRange }` | | notebook cells | flat per-backend fields, neither of the above | Anything crossing between them needed a translation that dropped fields on the way — which is how a notebook cell's replica selection had nowhere to go. ## What changed One `QuerySourceBinding`: a backend `_tag` with that backend's parameters spread flat beside it, borrowed from the wire schema (#49069) so the binding and the persisted cell agree by construction. - **`QuerySource` is deleted.** `useRunSource` returns the shared binding, so `runSource.type`/`dateRange` become `_tag`/`time_range` across the SQL editor — that is most of the file count here. - **`getQuerySourceBinding`** projects a notebook cell onto a binding; **`toQuerySourceBinding`** does the same for any backend-tagged carrier. Both overloaded so an already-narrowed caller gets the matching binding back rather than the union, which keeps the result spreadable without re-narrowing. - **`ExplorerQuerySourceMenu`** drops its inline copy of the custom-range and upgrade-prompt logic in favor of `useLogsCustomRange`, which the SQL editor menu already used. The registry keeps only what is genuinely runtime: endpoints, labels, icons, availability, defaults. What a query *is* stays in the wire schema. ## Verification Typecheck, Prettier, and the lint ratchet clean. 405 tests pass across the notebook schema, query sources, the logs components, the SQL editor, and the Explorer surfaces. <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Improvements** * Updated query source handling across Explorer and SQL Editor for a more consistent selection experience. * Database and log sources now preserve identifiers and time ranges more reliably when switching or editing queries. * Source menus, labels, icons, validation, and query execution now reflect the selected source more accurately. * **Bug Fixes** * Invalid or outdated saved source settings now safely fall back to a database source. * Improved log-source detection and time-range handling throughout query editing and execution. <!-- end of auto-generated comment: release notes by coderabbit.ai --> --------- Co-authored-by: Joshen Lim <joshenlimek@gmail.com> |
||
|
Joshen Lim
|
67d4fed40d |
Joshenlim/fe 4157 explorer migrate results component into explorer (#49066)
## Context Related to Notebooks/Explorers - this one's just shifting files from the SQLEditor into more generic folders from a file organization POV, such that files under the Explorer folder have no dependency on files within the SQLEditor folder Mainly - UtilityTabResults.utils: `getSqlErrorLines` - Moved into `data/sql/utils.ts` - SQLEditor.utils: `applyAutoLimit`, `getSqlErrorLines`, `trimTrailingSemicolons` - Moved into `data/sql/utils.ts` - SQLEditor/UtilityPanel: `ResultCell`, `Results`, `CellDetailPanel` - Moved into `components/ui/DataGridResults` - Also shifted corresponding tests over here - Also addressed some `any` type casts ## To test - Just need to ensure that the SQL Editor still works as expected <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **New Features** * Standardized query results across the Studio with a shared data grid. * Improved result-table formatting, column sizing, clipboard handling, and large-value display. * Added safer automatic row limits for eligible SQL queries. * Centralized SQL error display and formatting utilities. * **Refactor** * Improved type safety for query rows and cell values. * **Tests** * Added comprehensive coverage for result-grid and SQL utility behavior. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
Saxon Fletcher
|
cc6fe2100a |
refactor(studio): centralize query sources (#49027)
## Summary - define application-owned database and logs source contracts, defaults, validation, labels, and execution endpoints - extract controlled database and logs parameter controls for reuse outside SQL snippets - adapt the SQL editor to the shared source model without changing snippet behavior - standardize source icons at 16px with a 2px stroke - keep relative logs ranges aligned with the existing date picker units ## To test 1. Open an existing query in the SQL Editor and run it against the database. 2. Switch the query source to Logs, change the time range, and confirm the query still runs as expected. ## Why Explorer queries and notebook query cells need to select an execution source without coupling that source to SQL snippets. This provides the shared registry and controlled UI foundation for those consumers. ## Impact Existing SQL snippets retain their current database/logs routing and session behavior. The registry documents the SQL editor legacy database-selector adapter while new consumers own their identifier inline. The shared Logs date picker remains unchanged; query ranges support its existing minute, hour, and day units. This PR does not add the Explorer query tab itself. ## Validation - pnpm --filter studio typecheck - focused Vitest coverage for the registry, canonical log-range utilities, SQL execution adapters, source filtering, retention locking, custom ranges, and preset selection - pnpm --filter studio run lint:ratchet Component and state tests cover this change per the Studio testing guidance; no E2E test is added. <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **New Features** * Added a unified query-source menu for database queries and logs. * Added custom log time-range selection with calendar support and retention-aware upgrade prompts. * Added consistent source icons and improved database selection handling. * Added support for relative and absolute log time ranges. * **Bug Fixes** * Improved log-range validation, defaults, and current-time handling. * Updated query execution to use the correct source-specific endpoints. * **Tests** * Expanded coverage for query sources, log ranges, menus, and retention behavior. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
Joshen Lim
|
77c5a0b9d9 |
Joshen/fe 4077 explorer query cells (#48989)
## Context Related to Explorer / Notebooks - adds a barebones query cell that minimally can run SQL queries + render results The intention is to migrate the components used in the SQL Editor into this new Query cell since all the functionality is very similar, but the SQL Editor component is tightly coupled to the SQL Editor valtio store. So we'll be duplicating a bit of UI for now - which will also make deprecating the SQL Editor eventually a bit easier by just deleting them Have deliberately omitted a lot of details for now just to keep the PRs small, so will be continuing to build out the QueryCell's functionality in subsequent PRs. This includes - Source selector - Data display (Table / Chart) - Autolimit logic Other changes also includes - Updating NotebookEditor to use the new Explorer UI components that Saxon introduced <img width="500" alt="image" src="https://github.com/user-attachments/assets/d709f6f1-f6cc-4e6a-babd-f5b68bba2a55" /> <img width="500" alt="image" src="https://github.com/user-attachments/assets/a286ceca-ac84-4fbd-afd5-b24f940e2e29" /> <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **New Features** * Added notebook database cells for writing, editing, and running SQL queries. * Added query result displays with loading, empty, error, row-limit, and result states. * Added editable notebook titles with save and cancel controls. * New notebooks can start with customizable Markdown and SQL cells. * Added helpful SQL error actions, including copying messages, database connection guidance, and AI Assistant support where available. * **Improvements** * Improved notebook spacing, section layout, toolbar tooltips, and empty-result presentation. * Markdown changes now save automatically through the notebook editor. * Improved drag-and-drop controls and query visibility management. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
Charis
|
2165746784 |
fix(studio): keep SQL editor source menu open when switching sources (#48715)
## I have read the [CONTRIBUTING.md](https://github.com/supabase/supabase/blob/master/CONTRIBUTING.md) file. YES ## What kind of change does this PR introduce? Bug fix ## What is the current behavior? Selecting Database/Logs in the SQL Editor's query-source dropdown closes the menu (Radix's default select behavior), so switching to Logs gives no visible indication that a Time range control just became available until the dropdown is reopened. ## What is the new behavior? Selecting a source keeps the dropdown open, so the newly-available source-specific controls (e.g. Time range for Logs) are immediately visible. ## Additional context Fixes FE-4036 <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Bug Fixes** * Improved source switching in the SQL editor so the selection menu remains open while changing between database and logs sources. * Ensured source-specific controls update correctly after switching. * **Tests** * Added coverage for source selection, menu behavior, and source-specific control updates. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
Charis
|
b9053794a0 |
fix(studio): add tooltip explaining why Prettify SQL is disabled (#48712)
## I have read the [CONTRIBUTING.md](https://github.com/supabase/supabase/blob/master/CONTRIBUTING.md) file. YES ## What kind of change does this PR introduce? Bug fix ## What is the current behavior? In the SQL Editor, the Prettify SQL action (both the "More actions" dropdown menu item and the toolbar button) is disabled for logs snippets, but gives no indication why. ## What is the new behavior? The disabled Prettify menu item now uses `DropdownMenuItemTooltip` and the disabled Prettify toolbar button uses `ButtonTooltip`, both showing "Can only prettify SQL queries" while disabled. Addresses review feedback from #48452 (Linear FE-4038). ## Additional context Resolves FE-4038 <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Improvements** * Updated SQL editor tooltips with clearer, consistent messaging. * Log-source users now see an explanation when SQL formatting is unavailable. * Regular users continue to see the SQL prettify keyboard shortcut. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
Charis
|
89010c1649 |
fix(studio): show selected custom time range in SQL editor time range menu (#48709)
## What Display the actual selected custom date range in the Time Range dropdown's secondary text, instead of the static "Custom range" label. The range is formatted as `DD MMM, HH:mm - DD MMM, HH:mm` to match the existing format in the Logs Explorer's date-picker trigger button, ensuring visual consistency across the Logs UI. Fixes FE-4035 ## Test plan - [x] Typecheck passes: `pnpm typecheck` - [x] Manually verify: Open SQL Editor with `sqlEditorLogsSource` flag enabled, open the Time Range dropdown menu, select a Custom range, and confirm the dropdown's secondary text now displays the selected date range instead of "Custom range" <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **New Features** * Custom time ranges now display formatted start and end timestamps for clearer time selection. * Preset time ranges continue to show their existing helper text. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
Charis
|
0791b04eb8 |
feat(sql-editor): roll out manual saving by default (#48706)
## 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 — progresses the SQL Editor manual saving rollout, and removes a fully rolled out feature flag. ## What is the current behavior? Manual saving (snippets save only on an explicit Save / Cmd+S rather than autosaving every edit) is opt-in. It requires both the `sqlEditorManualSave` ConfigCat flag and the user turning on the "Disable snippet auto-saving" feature preview themselves. That flag is now fully rolled out. ## What is the new behavior? - `sqlEditorManualSave` is removed, so the feature preview is listed for everyone. (Delete the flag in ConfigCat after a few months.) - New `sqlEditorManualSaveForced` flag progresses the rollout. It forces manual saving on regardless of what the user stored previously, including an explicit opt-out, via a new `isForced` field on `FeaturePreview` that `initializeFlags` resolves ahead of the localStorage lookup — so the feature preview modal reflects the forced state too, not just the save behavior. Turning the flag off reverts everyone who never opted in, so it remains a working kill switch. - Users the rollout switches over get a one-time dialog on their first SQL Editor route, explaining that snippets no longer autosave. Dismissal persists in `sql-editor-manual-save-notice-dismissed` (allowlisted, so it survives sign-out). - Users who opted into the preview themselves never see the dialog — it records their dismissal up front instead, since the notice needs to outlive the feature preview and once the preview is retired there's no stored opt-in left to recognize them by. - The preview keeps its switch so users who lose their local storage can opt in early, but once the rollout reaches them the "Disable feature" button is disabled with a tooltip explaining why. ### To test Turn on `sqlEditorManualSaveForced` on via the dev toolbar. - No `supabase-ui-sql-editor-manual-save` and no dismissal key → dialog appears on `/project/<ref>/sql`, toolbar shows the Save button. Dismiss, reload → no dialog. - `supabase-ui-sql-editor-manual-save` set to `false` (previously opted out) → still forced onto manual saving, and still gets the dialog. - `supabase-ui-sql-editor-manual-save` set to `true` → no dialog, and the dismissal key is written automatically. - Flag off, no opt-in → autosave, no dialog, and the "Disable autosave" power-off button still opens the preview modal. - Preview modal while forced → "Disable feature" is disabled with a tooltip; another preview (e.g. Column-level privileges) still disables normally. ## Additional context |
||
|
Hoon
|
ceace2e90b |
fix(studio): account for SQL result column headers (#48676)
## I have read the [CONTRIBUTING.md](https://github.com/supabase/supabase/blob/master/CONTRIBUTING.md) file. YES ## What kind of change does this PR introduce? Bug fix ## What is the current behavior? Fixes #48672. The SQL Editor results grid calculates each column's initial width from cell values only. When a long final column contains a short value such as `NULL`, scrolling to the end of a wide result set reveals a truncated header even though the full column name is needed to identify the result. ### Before <img width="760" height="370" alt="Before: final SQL result column header is truncated" src="https://github.com/user-attachments/assets/f73b7540-fc45-4ddf-91b6-996afe41807e" /> ## What is the new behavior? The initial width now accounts for both the column name and its cell values while preserving the existing minimum and maximum width constraints. ### After <img width="760" height="370" alt="After: full SQL result column header is visible" src="https://github.com/user-attachments/assets/b289ab86-4277-46fc-ae9a-35c3eac5442f" /> ## Additional context The width calculation was extracted into a utility and covered for: - short headers and values - headers longer than their values - values longer than their headers - empty result sets - maximum-width capping Verification: - `pnpm --filter studio exec vitest --run components/interfaces/SQLEditor/UtilityPanel/Results.utils.test.ts tests/components/SQLEditor/Results.test.tsx` - `pnpm --filter studio run typecheck` - `pnpm --filter studio run lint:ratchet` - `pnpm run test:prettier` - `SKIP_ASSET_UPLOAD=1 pnpm run build:studio` <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit - **Improvements** - SQL query results now automatically size columns based on their headers and content. - Column widths remain within practical minimum and maximum limits for improved readability and usability. - **Tests** - Added coverage for minimum and maximum widths, content-based sizing, and empty result sets. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
CharisandJoshen Lim
|
c16c7e94cc |
feat(studio): SQL editor logs source — toolbar UI + creation flow (#48452)
## What PR 6 of the SQL-editor "query source (Database vs Logs)" stack (builds on the merged PR 5, #48414). Adds the user-facing toolbar surface for the logs query source and consolidates the SQL-editor toolbar into a single **source menu**. Everything stays behind `sqlEditorLogsSource` + `otelLegacyLogs` (dual-flag gated); with the flags off the toolbar is unchanged. ## Changes - **Consolidated source menu** (`QuerySourceMenu`) — one `Database ▾` / `Logs ▾` dropdown that both labels the snippet's source and hosts the source-specific controls as flyout submenus: - Database: database selector (`Primary` / read replicas), `Run as` (role impersonation), and `Row limit`. - Logs: `Time range` — the same relative presets as the Logs Explorer plus a `Custom range…` calendar dialog. - **Source is immutable** — the Database/Logs rows aren't a toggle. An existing (materialized) snippet opens a *fresh* tab of the target source (never reinterpreting a query against the wrong backend); a blank new tab re-flavors in place. Extracted as the pure, unit-tested `resolveSourceSwitch`. - **New-snippet-with-source** threaded through `/sql/new?source=`, the nav "Create a new logs query" entry, and the duplicate flow. Logs snippets hide the (db-dialect) Export action. - **Run-affordance guard** — the Run button is disabled + annotated for a logs snippet on a non-ClickHouse org (sits above PR 5's execution short-circuit). - **Retention entitlement gating** — both preset and custom logs ranges past `log.retention_days` surface the upgrade prompt instead of applying silently. Prettify is disabled for logs (sql-formatter mangles ClickHouse). ## Tests - `querySource.test.ts` — `logDateRangesEqual` (structural relative/absolute matching, incl. the "Last hour" vs "Last 1 hour" label case). - `QuerySourceMenu.utils.test.ts` — `resolveSourceSwitch` push-vs-replace / no-op behavior. `pnpm --filter studio typecheck` · `lint:ratchet` · Prettier · SQL editor suite (307 tests) all green. ## For reviewers To test manually, enable the `sqlEditorLogsSource` feature flag for yourself on local/staging. There is no nav for Log SQL snippets currently (that is by design, this PR is big enough as-is), so to check an existing logs snippet, you can create one using the existing Logs Explorer, copy its UUID, and force navigate to that snippet in the SQL editor via URL. <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **New Features** * Added support for creating and switching between database and logs queries. * Added log time-range presets and custom date-range selection. * Added database, run-as role, and row-limit controls. * Added read-replica selection, including options to create a new replica when available. * **Improvements** * Added clearer explanations when query execution is unavailable. * Disabled SQL formatting and query export where unsupported for logs queries. <!-- end of auto-generated comment: release notes by coderabbit.ai --> --------- Co-authored-by: Joshen Lim <joshenlimek@gmail.com> |
||
|
Miranda Limonczenko
|
0d465e7b5f |
chore(ui): Remove 'tip' from Admonition (#48419)
Closes FE-3966 ## I have read the [CONTRIBUTING.md](https://github.com/supabase/supabase/blob/master/CONTRIBUTING.md) file. YES ## Problem - The admonition uses both 'tip' and 'note', but the visual distinction has long-ago collapsed. - 'Note' is used far more frequently than 'tip' - The two are very similar and it is confusing to know which one to use when they are visually identical ## Solution Collapse 'tip' and 'note' into one by removing all places where there is 'tip' and updating all references to 'tip' into 'note'. **Note:** This PR also resolves new broken links flagged by the E2E docs checker. It may move to another PR since E2Es keep erroring. ### Specific changes See below for an AI-generated list of changes: - **Type system** — removed `'tip'` from `AdmonitionType`, its `TYPE_TO_VARIANT`/`TYPE_LABEL` entries, and the test case in [`packages/ui-patterns/src/Admonition/](packages/ui-patterns/src/Admonition/) - **Remark plugin** — [remarkAdmonition.ts](apps/docs/lib/mdx/plugins/remarkAdmonition.ts) now maps mkdocs `tip` → `note` - **Lint allowlist** — `tip` dropped from `supa-mdx-lint.config.toml` - **Content migration** — all 109 files with `type="tip"` (across `apps/docs`, `apps/www`, `apps/studio`) converted to `type="note"`; zero remaining hits confirmed by repo-wide grep - **Style guide** — `CONTRIBUTING.md` and `contributing/content.mdx` updated to describe 4 admonition types instead of 5 ### Usage before implementation See the usage table that points toward 'note' as being dominant across all apps: Here's the usage table: | Location | `note` | `tip` | |---|---|---| | apps/docs | ~480 | ~143 | | apps/studio | 34 | 6 | | apps/www (blog) | 19 | 3 | | packages/ui-patterns (tests) | 3 | 1 (parametrized) | | design-system / ui-library / packages/ui / packages/common | 0–1 (test fixture only) | 0 | ## Preview links | App | Page | Search text (Ctrl+F) | Verify | |---|---|---|---| | docs | [/docs/guides/ai-tools/byo-mcp](https://docs-git-admonition-collapse-note-tip-supabase.vercel.app/docs/guides/ai-tools/byo-mcp) | official MCP TypeScript SDK | callout's aria-label="Note" | | docs | [/docs/guides/ai-tools/mcp](https://docs-git-admonition-collapse-note-tip-supabase.vercel.app/docs/guides/ai-tools/mcp) | MCP server is available at | callout's aria-label="Note" | | docs | [/docs/guides/ai/python-clients](https://docs-git-admonition-collapse-note-tip-supabase.vercel.app/docs/guides/ai/python-clients) | Click Connect at the top of any project page | callout's aria-label="Note" | | docs | [/docs/guides/auth/audit-logs](https://docs-git-admonition-collapse-note-tip-supabase.vercel.app/docs/guides/auth/audit-logs) | Disabling Postgres storage reduces your database storage costs | callout's aria-label="Note" | | docs | [/docs/guides/database/tables](https://docs-git-admonition-collapse-note-tip-supabase.vercel.app/docs/guides/database/tables) | access a custom schema through the Supabase Data API | callout's aria-label="Note" | | docs | [/docs/guides/troubleshooting/edge-function-404-error-response](https://docs-git-admonition-collapse-note-tip-supabase.vercel.app/docs/guides/troubleshooting/edge-function-404-error-response) | Always configure an appropriate time frame | callout's aria-label="Note" (was single-quoted type='tip') | | www | [blog: cli-v2-config-as-code](https://zone-www-dot-com-git-admonition-collapse-note-tip-supabase.vercel.app/blog/cli-v2-config-as-code) | Detecting config drift | callout's aria-label="Note" | | www | [blog: cli-v2-config-as-code](https://zone-www-dot-com-git-admonition-collapse-note-tip-supabase.vercel.app/blog/cli-v2-config-as-code) | Setting Edge Function secrets | callout's aria-label="Note" | | www | [blog: nosql-mongodb-compatibility-with-ferretdb-and-flydotio](https://zone-www-dot-com-git-admonition-collapse-note-tip-supabase.vercel.app/blog/nosql-mongodb-compatibility-with-ferretdb-and-flydotio) | If your network supports IPv6 connections | callout's aria-label="Note" | Note: the `www` rows use the `zone-www-dot-com` preview host, not the `docs` one you gave — since blog pages are served from the www app, not docs. ## Manual testing 1. Open preview links for affected pages. 2. Inspect. Open console. 3. Paste the following in and see there is no 'Tip' on the page: ``` document.querySelectorAll('[role="alert"]').forEach(el => console.log(el.getAttribute('aria-label'), el.textContent.slice(0,60))) ``` <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Documentation** * Standardized informational callouts across docs and tutorials from **“Tip”** to **“Note”**, updating multiple examples and guidance blocks. * Updated a few related doc references/links and conditional “Next steps” content. * **UI Updates** * Switched various in-app banners and notices to the **“Note”** style variant. * **Bug Fixes / Improvements** * Removed support for the retired **“Tip”** callout type and aligned docs linting, component behavior, and aria labeling to the remaining admonition types. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
Alaister YoungandAlaister Young
|
ca2b50a0a7 |
chore(ui-patterns): collapse the admonition shim into ui-patterns/Admonition (#48377)
Follow-up to #48344: collapses the two resolution paths for the Admonition module into one. `src/admonition.tsx` was a back-compat shim re-exporting `src/Admonition/`. Two ways to resolve one module is exactly what produced the macOS self-import bug fixed in #48344, and the local typecheck errors that #48374 worked around. This removes the shim and standardizes on the PascalCase subpath, matching every other export in the package. **Changed:** - Codemodded all 246 `ui-patterns/admonition` imports to `ui-patterns/Admonition` (240 `.tsx`, 5 `.mdx`, 1 `.ts` across studio, docs, www, design-system, and lite-studio) - Pointed the 5 internal `'../admonition'` imports back at the `'../Admonition'` directory **Removed:** - `packages/ui-patterns/src/admonition.tsx`, and its `./admonition` entry in the exports map (regenerated with `pnpm gen:exports`) ## To test - `grep -r "ui-patterns/admonition" --include='*.ts*'` → no hits - `pnpm test:case-hazards` → passes - `pnpm typecheck` → all 15 tasks green - `pnpm --filter studio run lint:ratchet` → passes - `pnpm --filter ui-patterns vitest run src/Admonition` → 11 tests pass <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Bug Fixes** * Standardized Admonition component imports across the application and documentation. * Improved compatibility with case-sensitive environments by using the canonical component path. * Removed the legacy Admonition import entry point. <!-- end of auto-generated comment: release notes by coderabbit.ai --> --------- Co-authored-by: Alaister Young <10985857+alaister@users.noreply.github.com> |
||
|
Charis
|
0bef8e7d90 |
test(sql-editor): e2e coverage + delete jsdom test + merge Results.utils tests (Steps 5-6) (#48217)
## Summary Steps 5 and 6 of the SQL editor test refactor plan (the final two steps). **Step 5** — extends `e2e/studio/features/sql-editor.spec.ts` (real browser, zero mocks) with cases that need the real Monaco editor / full app render: - destructive-query warning modal: confirm actually re-runs the forced query (previously only `Cancel` was exercised) - debug button opens the AI Assistant with the query error pre-filled Deletes `apps/studio/tests/components/SQLEditor/SQLEditor.test.tsx` — its logic-level cases are now covered mock-free by the Step 4 hook tests, and its integration cases by e2e. Deleting rather than narrowing is the honest consequence of "no mocking": every remaining assertion it could make in jsdom requires a Monaco mock. **Step 6** — merges `apps/studio/tests/components/SQLEditor/Results.utils.test.ts` (`formatClipboardValue`/`formatCellValue`) into the colocated `apps/studio/components/interfaces/SQLEditor/UtilityPanel/Results.utils.test.ts` (`formatResults`/`convertResultsToMarkdown`/`convertResultsToJSON`/`getResultsHeaders`/`isLargeValue`/`convertResultsToCSV`) — both tested disjoint exports of the same source file. Deletes the `tests/` copy. This is the last step in the plan. ## Test plan - [x] `pnpm --filter studio typecheck` — no new errors in changed files - [x] `npx prettier --check` on all changed files - [x] Ran the new/changed e2e cases locally end-to-end against a live local stack — both pass - [x] `cd apps/studio && npx vitest run components/interfaces/SQLEditor/UtilityPanel/Results.utils.test.ts` — 42/42 passing after the merge <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Tests** * Added end-to-end coverage for destructive SQL query warning modal flow before forced execution. * Added end-to-end coverage for the AI Assistant debug flow when SQL execution fails. * Expanded unit test coverage for SQL editor results formatting utilities (clipboard and cell value formatting). * Removed the prior SQLEditor unit test suite and the older results-formatting unit tests. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
Ali Waseem
|
b100272376 |
chore(sql-editor): remove Pretty Explain feature (#47981)
Removes the SQL Editor Pretty Explain feature — the Explain tab, the Run EXPLAIN ANALYZE action + shortcut, and its dead plumbing. It's been gated off behind the `DisablePrettyExplainOnSqlEditor` kill switch for weeks with no usage or complaints. `ExplainVisualizer` / `isExplainQuery` are kept — they're used independently by Query Insights, Query Performance, and the EditorPanel quick-runner. Manually-run `EXPLAIN` queries still render as raw rows in the Results tab. Typecheck, lint, and all affected unit tests pass. Closes FE-3930 <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Changes** * Removed the SQL editor’s EXPLAIN execution workflow, including its toolbar action, keyboard shortcut, utility tab, and visual query-plan display. * Simplified query execution to focus on standard results and charts. * Improved result clearing when switching databases and refined execution error handling. * Updated SQL editor state and tests to reflect the streamlined experience. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
Charis
|
3461d60aba |
feat(sql-editor): consolidate controls into a single top bar (#47792)
## I have read the [CONTRIBUTING.md](https://github.com/supabase/supabase/blob/master/CONTRIBUTING.md) file. YES ## What kind of change does this PR introduce? Refactor / UI improvement ## What is the current behavior? SQL editor controls are split across two rows: a bar between the editor and results (tabs, download, run/save/format/db-selector/role/favorite/intellisense) and a separate footer at the very bottom (row count + limit dropdown). ## What is the new behavior? All controls are consolidated into a single top bar above the editor (⋮ overflow menu, database selector, role impersonation, limit, save, run). The bar between the editor and results now holds only result-relevant information: the Results/Explain/Chart tabs, the row-count summary, and the Export button. The limit dropdown is now always visible as a persistent query setting. |
||
|
ChloeGarciaMillerandandGildas Garcia
|
59a82c52f8 |
Fix: improve accessibility for icon button (SQL Editor menu) (#47674)
## 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) ## What is the current behavior? Icon-only button (not visible on widescreen displays) does not have explicit accessible name for screen readers and tooltip. ## What is the new behavior? The icon-only button now has explicit accessible name using visually hidden text (sr-only), ensuring proper screen reader support. ## Additional context Tooltip text is added for visual users. No visual changes were introduced <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **UI Improvements** * Added a tooltip to the SQL editor’s “More actions” dropdown button, improving discoverability. * The tooltip now shows “More actions” when hovering over the trigger. <!-- end of auto-generated comment: release notes by coderabbit.ai --> Co-authored-by: Gildas Garcia <1122076+djhi@users.noreply.github.com> |
||
|
Charis
|
1987f19d0a |
feat(sql-editor): add manual save feature preview (#47745)
## What Adds an opt-in **SQL Editor manual save** feature preview that switches the SQL Editor from autosaving every edit to saving only on demand, and hardens the tab-close flow so unsaved edits are handled correctly. ## Changes **Feature preview** - New `sqlEditorManualSave` flag + `UI_PREVIEW_SQL_EDITOR_MANUAL_SAVE` local-storage toggle, wired into the Feature Preview modal with an explanatory panel. - `useIsSqlEditorManualSaveEnabled` gates behavior on both the flag and the user's preview opt-in. **Editor toolbar** - Save button (with `Cmd+S`) next to Run, plus an autosave status indicator showing dirty/saving/saved state and a shortcut to disable autosave (emits a `sql_editor_autosave_disable_clicked` telemetry event). **Discard on close** - Closing a snippet tab with unsaved edits prompts for confirmation and, on confirm, actually discards the local edits and evicts the cached server copy so the snippet reopens clean. **Decouple tab layout from SQL specifics** - Tabs store gains a generic per-type close-handler registry (`registerTabCloseHandler` / `getCloseConfirmation` / `closeTabs`). The SQL editor registers its discard + confirmation behavior from the save coordinator. - Low-level `removeTab`/`removeTabs` (rename/move re-keying, stale cleanup) intentionally do **not** trigger discard. - Adds `statusOnDiscard` lifecycle transition and `clearSnippetContent` store action. ## Testing - `pnpm --filter=studio typecheck` — clean. - Added unit tests for the close-handler registry (fires on single/multi close, skips re-keying/cleanup removals, respects tab type, selects confirmation copy, unregisters cleanly). <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **New Features** * Added a SQL editor manual-save preview with a “Save” button and `Cmd+S`, plus a modal option to disable manual-save/preview. * Added “unsaved changes” tab status indication when manual-save is enabled. * Introduced tab-type-specific close confirmations (shown only when needed). * **Bug Fixes** * In manual-save mode, closing a SQL tab with unsaved edits now clears local snippet content and refreshes it on reopen. * **Tests** * Added coverage for tab close handlers and confirmation behavior. * **Chores** * Added a persisted setting allowlist entry and tracked autosave-disable clicks via telemetry. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
Gildas Garcia
|
cabe14e5ca |
chore: remove _Shadcn_ suffix from ui tabs components (#47628)
## Problem Now that we migrated all usages of the deprecated `Tabs` component, we don't need the `_Shadcn_` suffix anymore. ## Solution Remove `_Shadcn_` suffix from `ui` tabs components. That's all this PR does, no visual nor functional changes <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **New Features** * Standardized tab components across the app so pages and dialogs now use the same consistent tab UI. * Improved tab-based views in design, docs, studio, learn, and website experiences for a more uniform interface. * **Chores** * Updated shared UI exports to expose tab components directly, simplifying future usage across the product. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
Charisandsupabase-autofix-bot
|
cdc2dc4e26 |
refactor(studio): import SQL editor store from source, delete facade + barrel (#47533)
## What Final PR of the SQL editor state re-layering stack. Removes the compatibility shims left in place during the migration: - Migrates all **23** consumers of the `@/state/sql-editor-v2` facade to import directly from `@/state/sql-editor/sql-editor-state`, where `useSqlEditorV2StateSnapshot`, `getSqlEditorV2StateSnapshot`, `useSnippets`, and `useSnippetFolders` actually live. - Deletes `state/sql-editor-v2.ts` (the facade) and `state/sql-editor/index.ts` (the barrel). Both re-exported the same symbols; nothing imports them after the migration. This collapses the two-layer re-export (`sql-editor-v2` → `index` → source) into direct source imports, matching the repo convention to avoid barrel re-export files. ## Notes - Pure import-path migration — no behavior change. All 23 consumers imported only value symbols that resolve to `sql-editor-state.ts`; none imported the `StateSnippet`/`StateSnippetFolder` types via the facade. - Symbol names keep their `V2` suffix for now — renaming `useSqlEditorV2StateSnapshot` etc. is a separate, larger churn best done on its own. - 25 files: 23 one-line import changes + 2 deletions (23 insertions / 39 deletions). ## Validation - `pnpm --filter studio typecheck` ✅ (confirms no dangling facade/barrel imports anywhere) - `pnpm exec vitest --run state/sql-editor/` ✅ (113 passed) - lint ✅ (0 errors; no ratcheted-rule regressions — a path swap can't add `any`/deps/nested-component violations, and no import-order rule is enforced) - grep confirms zero remaining `sql-editor-v2` references --------- Co-authored-by: supabase-autofix-bot <noreply@supabase.com> |
||
|
Ali WaseemandIvan Vasilov
|
3fcf980b0a |
fix(studio): batch of production Sentry crash fixes (array/null guards) (#47460)
Fixes a batch of production Studio crashes from Sentry (all caught by the global error boundary). Most are missing array/null guards where an endpoint typed as an array — or with a nested array field — returned a non-array body in production; a few are one-off render crashes. Resolves FE-3748. ## Issues fixed | Sentry | Error | Fix | | --- | --- | --- | | [J7R](https://supabase.sentry.io/issues/7492997940/) | Maximum update depth exceeded | Disable RadialBar animation in disk-cooldown countdown | | [JR5](https://supabase.sentry.io/issues/7548484681/) | resourceWarnings.find is not a function | Guard in ResourceExhaustionWarningBanner | | [JCJ](https://supabase.sentry.io/issues/7506024989/) | resourceWarnings.find is not a function | Guard in ProjectLayout + normalize query | | [K1Y](https://supabase.sentry.io/issues/7584792331/) | snippet.name on undefined | Optional-chain SQL editor download filename | | [B3K](https://supabase.sentry.io/issues/7141649636/) | pagination.count on undefined | Guard pagination in projects infinite query | | [JVP](https://supabase.sentry.io/issues/7560437621/) | schemas.some / extensions.find | Coerce pg-meta lists to arrays in useInstalledIntegrations | | [JR2](https://supabase.sentry.io/issues/7548339272/) | extensions.find is not a function | (same fix as JVP) | | [JQR](https://supabase.sentry.io/issues/7547163939/) | lints.filter is not a function | Normalize project lints query | | [JR3](https://supabase.sentry.io/issues/7548433501/) | entitlements.find is not a function | Guard call sites + normalize entitlements query | | [JQS](https://supabase.sentry.io/issues/7547557098/) | selected_addons.find is not a function | Normalize addons query arrays | <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Bug Fixes** * Improved stability across several Studio screens by handling missing or unexpected data more safely. * Downloads now use a fallback name when a snippet name isn’t available. * Project, entitlement, schema, addon, warning, and extension views are less likely to break when data is missing or not in the expected format. * Pagination and countdown visuals now behave more consistently, with reduced chance of runtime errors or animation-related glitches. <!-- end of auto-generated comment: release notes by coderabbit.ai --> --------- Co-authored-by: Ivan Vasilov <vasilov.ivan@gmail.com> |
||
|
CharisandJoshen Lim
|
d153bab849 |
refactor(studio): extract SQL editor session store from god store (#47349)
## What PR 6 of the SQL editor state re-layering stack. Moves ephemeral, never-persisted SQL editor state out of the snippet/folder "god store". **Session store** — `state/sql-editor/sql-editor-session-state.ts` holds per-snippet, read-by-many session state: - query `results` - `explainResults` - the row `limit` …with their mutators (`addResult`/`addResultError`/`resetResult`, `addExplainResult`/`addExplainResultError`/`resetExplainResult`, `resetResults`, `setLimit`). `removeSnippet` drops a snippet's session entries via `clearForSnippet(id)`. **Diff-request slice** — `state/sql-editor/sql-editor-diff-request.ts`. The Assistant's "Insert code" / "Replace code" diff is *not* per-snippet session state: it's a transient, fire-and-forget command produced outside the editor (e.g. query blocks / assistant) and consumed exactly once by whichever editor is active. It's modeled as a consume-once request (`requestDiff` / `consumeDiffRequest`) rather than durable state — the editor drains it on apply, so a stale diff can't leak into a later editor or session. (Previously this was `diffContent` in the god store: never cleared and triggered by object-reference identity.) Consumers read session state from `useSqlEditorSessionSnapshot` and the diff channel from `useSqlEditorDiffRequestSnapshot`, keeping `useSqlEditorV2StateSnapshot` only for snippets/folders. ### Why not the TanStack Query cache for results/explain? Editor execution is a **mutation**, not a keyed query — `mutation.data` is per-hook-instance and not keyed by snippet id, and there's no caching value to capture (re-running SQL must return *fresh* data, never a cached result). `EXPLAIN ANALYZE` actually executes the statement, so a declarative/auto-refetching `useQuery` is semantically wrong. Results/explain are imperative mutation outputs, scoped to the session, read by several decoupled consumers keyed by snippet id — exactly what a small in-memory keyed store models honestly. ## Consumers migrated - `SQLEditor.tsx` — results/explain/limit reads + `addResult`/`addResultError`/`addExplainResult`/`addExplainResultError`/`setLimit`; diff-apply effect now drains a consume-once request - `UtilityPanel.tsx`, `UtilityTabResults.tsx`, `UtilityTabExplain.tsx`, `UtilityActions.tsx` - `QueryBlock/EditQueryButton.tsx` — produces via `requestDiff` ## Notes - Result/explain types are kept verbatim from the god store (pre-existing `any` row/error types come along unchanged; tightening them is out of scope for this move). - `ref()` on result rows is preserved to avoid Valtio proxying large row sets. ## Tests - `sql-editor-session-state.test.ts` — result/explain mutators, `resetResults`, `clearForSnippet`, `limit` - `sql-editor-diff-request.test.ts` — `requestDiff`, `consumeDiffRequest` (drain + queue-of-one) Validation: - `pnpm --filter studio typecheck` ✅ - `pnpm exec vitest --run state/sql-editor/` ✅ (110 passed) - lint ✅ (no new errors) <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **New Features** * SQL editor query results, EXPLAIN output, and the “Limit results to” setting now persist more reliably across a session. * AI-assisted SQL insert/replace actions now use a pending diff workflow to apply updates more consistently. * **Bug Fixes** * Results/EXPLAIN rendering and downloads stay in sync with the latest executed data. * Switching databases/snippets now clears the correct temporary results. * Diff application is more resilient when an editor is still loading, including empty-vs-non-empty editor cases. * **Tests** * Added coverage for the session and diff-request state logic. <!-- end of auto-generated comment: release notes by coderabbit.ai --> --------- Co-authored-by: Joshen Lim <joshenlimek@gmail.com> |
||
|
Gildas Garcia
|
b30db91d71 |
chore: cleanup UI patterns exports (#47406)
## Problem We now export components under a subpath in ui-patterns to avoid barrel files as they slow down every tools (from IDE to linters, etc.) and may also affect bundles our users have to download. ## Solution - Remove the UI patterns index file - Fix invalid impors |
||
|
Seid Muhammed
|
affdcb35ff |
fix(studio): sum numeric-string columns in cumulative SQL charts (#47378)
Fixes: #47377 ## What is the current behavior? Enabling **Cumulative** on a results chart concatenates Y-axis values instead of summing them whenever the column is a `bigint`, `numeric`, `money`, or `count(*)` aggregate — which Postgres returns as JSON strings. For per-row values `10, 20, 30` the chart plots `10, 1020, 102030`. `getCumulativeResults` ran `(prev[yKey] || 0) + row[yKey]` on raw result rows. The Y-axis selector explicitly allows numeric-string columns, so this is a common, fully-supported path (e.g. any `count(*) ... group by`). ## What is the new behavior? Both operands are coerced with `Number()` before the addition, keeping the existing `|| 0` fallback for null/undefined/non-numeric values. The series now sums correctly: `10, 30, 60`. The cumulative logic was previously duplicated in `ChartConfig.tsx` and `QueryBlock.utils.ts` (which is how this bug slipped in twice). It is now a single shared, tested helper: `getCumulativeResults` lives in `QueryBlock.utils.ts`, and `ChartConfig.tsx` imports it instead of re-declaring its own copy. The shared helper's `ChartConfig` type import is `import type` to avoid a runtime circular dependency, and its signature accepts `readonly` rows so both call sites type-check. ## Additional context - Added regression tests for numeric-string inputs and for null/undefined/non-numeric fallback to `0`. The existing tests only covered literal `number` inputs, never the string form Postgres actually returns. - Verified the new tests fail against the old code (`y: '010'`, `'05undefined'`) and pass with the fix. Full `QueryBlock.utils.test.ts` suite: 18 passing. No migrations, no API changes, no infra changes. <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Bug Fixes** * Fixed cumulative chart calculations so numeric values are always added correctly, even when results arrive as strings. * Improved handling of empty or non-numeric values in cumulative totals so they are treated as zero instead of breaking the sum. * **Tests** * Added coverage for cumulative result calculations with numeric strings and missing values. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
Gildas Garcia
|
c6fc456910 |
chore: cleanup duplicate exports studio (#47387)
## Problem Knip reports many duplicate exports (both named and default). Besides, we're moving away from default exports and even have an eslint rule to enforce it on new code. ## Solution - Cleanup those exports - Update imports when necessary No functional changes. If it builds, it's fine |
||
|
ChloeGarciaMillerand
|
b1b29ad011 |
Fix: improve accessibility for icon buttons (#47214)
## 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) ## 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 or added for visual users. No visual changes were introduced. <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit ## Release Notes * **New Features** * Added hover tooltips across the database editor and SQL editor, including “More options” menus, table filter controls, and the “Create a new query” action. * **Accessibility** * Improved button accessibility by adding/expanding `aria-label`s for Intellisense, favorites (add/remove), and “Prettify SQL.” <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
Charis
|
5cb81123ae |
refactor(studio): move SQL editor save trigger into a scheduler + provider (5/9) (#47316)
## What
PR 5 of a stacked refactor. Moves *when to save* out of a module-load
`subscribe` and into an injectable **scheduler** armed by a headless
**provider**, splits the save queue, and adds an unsaved-close warning.
### Scheduler (`sql-editor-save-scheduler.ts`)
`createSaveScheduler({ state, saveMechanism, notify, getSaveMode })`
owns the save *policy*:
- **auto** mode drains the dirty snippet queue as edits land; **manual**
mode (the seam for a future opt-in; defaults to `auto`) leaves snippets
queued until `requestSave`. Folder saves always drain.
- `start()` returns an unsubscribe; `requestSave(id)` is the
explicit-save entry.
### Provider (`sql-editor-save-coordinator.tsx`)
Headless `SqlEditorSaveCoordinatorProvider` instantiates the mechanism
(invalidation via the **React Query client from context**, not the
global `getQueryClient`) + scheduler, `start()`s it in an effect
(start/stop with the provider), and exposes `requestSave` via
`useSqlEditorSaveCoordinator()`. Mounted in `ProjectContext` (under the
app's QueryClientProvider). Cmd+S and the SavingIndicator Retry now go
through `requestSave`.
### Queue split
`needsSaving` (snippets) and `pendingFolderSaves` (folders) are separate
queues, drained independently — the old snippet-vs-folder `if/else` is
gone.
### Unsaved-close warning
A `beforeunload` guard triggers the browser's native "Leave site?"
prompt while any snippet's `status !== 'saved'` (failed / in-flight /
never-saved).
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* Improved SQL editor saving with a centralized save flow, including
automatic/manual save handling and immediate “Save Query” requests.
* Added unsaved-change detection so the app can warn before closing or
reloading when edits are still pending.
* **Bug Fixes**
* Retry actions now use the updated save flow for more reliable
re-saving.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
|
||
|
Charis
|
d5653f1f92 |
refactor(studio): unify snippet save + persistence into SnippetStatus (3/9) (#47251)
## What PR 3 of a stacked refactor of the SQL editor snippet state. Replaces the two overlapping pieces of snippet lifecycle state — the `savingStates` map (`IDLE|UPDATING|UPDATING_FAILED`) and the `isNotSavedInDatabaseYet` boolean — with a single `SnippetStatus` enum. ## Status is attached at the data layer (never absent) - `SnippetStatus` + `SnippetWithContent` now live in `data/content`. The snippet queries attach `status: 'saved'` via a typed `withSavedStatus()` helper, and `upsertContent` returns `SnippetWithContent` so move/rename responses carry status too. - A SQL-typed `getSqlSnippetById`/`useSqlSnippetByIdQuery` returns `SnippetWithContent` (the generic `useContentIdQuery` stays for Reports, which use it). `[id].tsx` loads content with **no casting**. - `'new'` is attached on local creation (`createSqlSnippetSkeletonV2`). ## Behavior Behavior-preserving for the existing auto-save flow (faithful mapping of both old fields, including the replication-lag swallow). One incidental fix: the read-only/saving indicator now also covers a brand-new snippet's first save (previously only re-saves of persisted snippets had distinct saving/failed states in some paths). ## Tests New `sql-editor-lifecycle.test.ts` (29 tests) covering every predicate and transition; existing rules tests updated. `pnpm --filter studio typecheck` clean; 52 state/sql-editor unit tests pass. <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit ## Release Notes * **Refactor** * Restructured SQL snippet persistence tracking, replacing boolean flags with a comprehensive status system for clearer visibility into save progress. * Enhanced saving indicator UI to reflect accurate snippet save states. * **Tests** * Added test coverage for snippet persistence state transitions and lifecycle scenarios. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
Charis
|
e1e2498db0 |
refactor(studio): extract SQL editor domain rules into pure module (2/9) (#47204)
## What PR 2 of a stacked refactor of the SQL editor snippet state. **Stacked on #47203 (PR 1)** — review/merge that first. Extracts scattered business rules + the upsert-payload builder into a new **pure** module `apps/studio/state/sql-editor/sql-editor-rules.ts` (no Valtio, React, toast, or runtime data-layer imports): - `canEditSnippet` — read-only rule (shared snippet you don't own), was inline in `MonacoEditor` `disableEdit` - `isSnippetOwner` — owner check, was inline in `ReadOnlyBadge` / `SavingIndicator` - `validateMoveToFolder` — 'shared snippet cannot be within a folder', was a buried `toast.error` - `buildUpsertPayload` — the PUT /content payload, was an inline object literal (all `??` defaults preserved) - `isLoadedSnippet` — type guard (see below) ## Bug fix: no more empty-content saves (and no non-null assertion) The old payload builder used `{ ...content!, content_id: id }`. Tracing that `!` upstream surfaced a real bug: **favoriting a snippet from the sidebar that had never been opened** enqueued a save with no loaded content, producing a PUT with an empty content body (rejected by API). The requirement that a persisted snippet has loaded content is now enforced **at the type level** rather than by a runtime assertion or comment: - `buildUpsertPayload` accepts only a `LoadedSnippet` (content non-nullable) — the `!` is gone. - the save subscriber crosses that boundary via the `isLoadedSnippet` type guard. - the sidebar favorite toggle loads content first (mirroring `onSelectDuplicate` / the share modals), narrowing the fetched union content to the SQL variant via its discriminant — **no type cast**. <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Bug Fixes** * Improved consistency in read-only behavior and ownership checks across the SQL editor by centralizing permission logic. * Fixed favorite toggle to ensure snippet content is fully loaded before persisting changes. * **Refactor** * Centralized SQL snippet permission rules and validation logic into a dedicated helper module. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
Joshen Lim
|
f2e20eac34 |
Joshen/fe 3651 deprecate monacoeditor from grid folder to use codeeditor (#47179)
## Context Part of efforts to consolidate all the code editors that we have in the repository `CodeEditor` will serve as the base monaco editor file that all UIs should consume from It's aimed to be generic and just stores the common logic that will be generally used where-ever we need a code editor (editor options, base editor set up on mount, etc) The idea is that `CodeEditor` holds just 3 default actions (run queyr, format document and placeholder fill) If any editor needs specific behaviours (e.g SQL Editor), they can declare them in the `onMount` prop of `CodeEditor` which gives some flexibility ## Changes involved - Use `CodeEditor` component for SQL Editor's `MonacoEditor` - Shifted Cmd K behaviour into `CodeEditor` since that's probably needed everywhere that we render that UI - Deprecate `MonacoEditor` from the table editor's `grid` folder - All files that were using that component to use `CodeEditor` component instead <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit ## Release Notes * **Refactor** * Migrated the studio’s code editing UI (including JSON, text, and payload viewers) to a unified CodeEditor experience. * **New Features** * Added plaintext language support for read-only/truncated views. * **Behavior Changes** * Improved editor startup by setting cursor position consistently and deferring autofocus. * Streamlined editor context-menu actions to the core set (run query, format, placeholder fill). * Updated SQL editor wiring for more consistent command/menu and selection handling. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
Ali Waseem
|
bd537706f9 |
chore: add feature flag to pretty explain (#47052)
## 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? Put Pretty Explain behind a feature flag for experimentation purposes <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **New Features** * SQL Editor now supports optional feature controls to conditionally disable “Explain” functionality. When disabled via configuration, the “Explain” tab and its entry points are hidden, the EXPLAIN ANALYZE keyboard shortcut (Ctrl/Cmd+Shift+Enter) is disabled, and any automatic post-run switch to the Explain tab for EXPLAIN-like queries is prevented. This also reduces unnecessary mounting of Explain UI content when turned off. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
Gildas GarciaandIvan Vasilov
|
96d43099bb |
chore: refactor Button API so that it can be used a standard button (#46880)
## Problem Our `<Button>` component breaks the default `button` contract by redefining the `type` prop to set its variant (`primary`, `default`, etc) instead of the button type (`submit`, `button`, etc). This is confusing and forces to write more code when using it with shadcn components that expect/inject the standard button props. ## Solution - rename the `type` prop to `variant` - rename the `htmlType` prop to `type` - propagate the changes where necessary - format code ## How to test As this is just prop renaming, if it builds it's ok --------- Co-authored-by: Ivan Vasilov <vasilov.ivan@gmail.com> |
||
|
Alaister YoungandAlaister Young
|
b0d023bd04 |
fix(studio): remove default DataGrid borders across studio surfaces (#46448)
Follow-up to #46413, which fixed an unwanted top border on the Auth Users grid by upgrading `border-t-0` → `border-t-0!` so the Tailwind rule actually wins over react-data-grid's `.rdg { border: 1px solid var(--rdg-border-color); }` shorthand. The same issue exists on every other DataGrid in Studio — this applies the fix consistently. **Changed:** - `border-t-0! border-b-0!` applied to all `<DataGrid>` call sites in Studio (11 in total) Fixes this issue everywhere: <img width="609" height="223" alt="Screenshot 2026-05-28 at 3 40 02 PM" src="https://github.com/user-attachments/assets/f49d8849-dd58-4675-ade4-a2656aadb8f9" /> ## To test Spot-check that the top/bottom borders look right (no doubled border under the page chrome, no extra line at the bottom of the table) on each route below. Use any project ref for `[ref]`: - `/project/[ref]/observability/query-performance` — main grid + the WithStatements grid inside - `/project/[ref]/observability/query-insights` — both modes (explorer + triage) - `/project/[ref]/advisors/security` - `/project/[ref]/advisors/performance` - `/project/[ref]/integrations/cron/jobs` — jobs list - `/project/[ref]/integrations/cron/jobs/<jobName>` — previous runs tab - `/project/[ref]/integrations/queues/queues` — queues list - `/project/[ref]/integrations/queues/queues/<queueName>` — single queue messages - `/project/[ref]/integrations/vault/secrets` - `/project/[ref]/sql/new` — results pane at the bottom - `/project/[ref]/realtime/inspector` - `/project/[ref]/logs/explorer` — and the preview pages: `auth-logs`, `edge-logs`, `postgres-logs`, `cron-logs`, `pg-upgrade-logs`, `postgrest-logs`, `realtime-logs`, `replication-logs`, `pgcron-logs`, `storage-logs`, `edge-functions-logs`, `pooler-logs`, `dedicated-pooler-logs` - `/project/[ref]/functions/[functionSlug]/logs` and `/invocations` <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Style** * Refined border styling on data grids across multiple features including integrations, query tools, and logs for improved visual consistency. <!-- review_stack_entry_start --> [](https://app.coderabbit.ai/change-stack/supabase/supabase/pull/46448?utm_source=github_walkthrough&utm_medium=github&utm_campaign=change_stack) <!-- review_stack_entry_end --> <!-- end of auto-generated comment: release notes by coderabbit.ai --> Co-authored-by: Alaister Young <10985857+alaister@users.noreply.github.com> |
||
|
Pamela Chia
|
47c084e51d |
refactor(studio): migrate telemetry to useTrack (#46140)
## Summary
I migrated every `useSendEventMutation` call site in `apps/studio` to
`useTrack`, deleted the legacy hook, and added a lint guardrail so it
can't return. `useTrack` is the type-safe replacement: it auto-injects
`groups: { project, organization }` from the selected project/org and
types `action` + `properties` against `TelemetryEvent`. Existing call
sites built groups manually and were not type-checked at the action
level. The migration covers 81 files (60 trivial swaps, 9 org-only, 3
pre-auth, 5 bespoke, 4 test mocks).
## Changes
- Migrated trivial call sites across `pages/project/[ref]`,
`components/interfaces/*` (Reports, Storage, Realtime/Inspector,
SQLEditor, Functions, EdgeFunctions, Integrations, ProjectAPIDocs,
Branching/BranchManagement, TableGridEditor, Connect, Docs, Auth,
Support, Home, ProjectHome, App), `components/layouts/*`, and
`components/ui/*`.
- Migrated org-only sites (`Organization/Documents/*`,
`Organization/BillingSettings/Subscription/*`,
`Organization/SecuritySettings.tsx`,
`Account/Preferences/DashboardSettingsToggles.tsx`) by dropping the
manual `groups: { organization: ... }` and letting `useTrack`
auto-inject. Verified `useSelectedProjectQuery` is disabled on org
routes (gates on URL `[ref]`).
- Migrated pre-auth sites (`SignInForm.tsx`, `sign-in-mfa.tsx`,
`profile.tsx`) where neither project nor org is resolved.
- Bespoke handling:
- `execute-sql-mutation.ts` and `table-row-create-mutation.ts`: pass `{
project: projectRef }` via `groupOverrides` since the mutation can
target a non-selected project ref.
- `useStudioCommandMenuTelemetry.ts`: kept a direct `sendTelemetryEvent`
call because studio groups must override pre-built event groups
(opposite of `useTrack`'s override direction).
- `AIAssistantOption.tsx`: passes sentinel-aware `groupOverrides` so
`NO_PROJECT_MARKER`/`NO_ORG_MARKER` continue to suppress group emission.
- `SidePanelEditor.utils.tsx`: utility functions `createTable` and
`updateTable` now take a `track: Track` parameter (threaded from
`SidePanelEditor.tsx`); dropped the `organizationSlug` arg since groups
are no longer assembled manually.
- Branch-event attribution: preserved `parentProjectRef` overrides on
`branch_updated`, `branch_merge_completed`, `branch_merge_failed`,
`branch_merge_submitted`, `branch_delete_button_clicked`,
`branch_review_with_assistant_clicked`, and
`branch_*_merge_request_button_clicked`. Original code grouped these
under the parent (production) project, not the branch ref;
auto-injection would have shifted them onto the branch.
- Switched 4 test mocks from `@/data/telemetry/send-event-mutation` to
`@/lib/telemetry/track`. Removed obsolete tests around manual groups and
`try/catch` on telemetry rejection.
- Deleted `apps/studio/data/telemetry/send-event-mutation.ts`. The
deleted module is its own guardrail: any reintroduction of the import
fails at TypeScript module resolution before lint runs.
## Testing
Tested on preview deploy:
- [x] SQL editor `CREATE TABLE` fires `table_created` with method
`sql_editor` and `groups.project` set to the mutation's `projectRef`.
- [x] Table editor creates a table from the side panel; `table_created`
fires from `SidePanelEditor.utils` via threaded `track`.
- [x] Help button (`/project/[ref]/...`) fires `help_button_clicked`
with auto-injected project + org groups.
- [x] Sign-in form fires `sign_in` with empty groups (pre-auth,
expected).
- [x] Org documents page (`/org/[slug]/documents`) fires
`document_view_button_clicked` with org group only, no stale project
ref.
- [x] Command menu (`Cmd+K`) inside a project still fires
`command_menu_opened` with studio's project/org overriding any
event-supplied groups.
- [x] Support form "Ask the Assistant" without selected org fires
`ai_assistant_in_support_form_clicked` with no project/org groups
(sentinels suppress).
- [x] On a branch, "Update branch" / "Merge branch" / "Close merge
request" events fire with `groups.project` set to the parent project
ref, not the branch ref.
Local checks:
- [x] 22/22 tests pass across the 4 updated test files
(`SidePanelEditor.utils.createTable`, `EdgeFunctionRenderer`,
`LayoutSidebar`, `PlanUpdateSidePanel`).
- [x] `rg useSendEventMutation apps/studio` returns 0 hits.
## Linear
- fixes GROWTH-860
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Chores**
* Standardized telemetry across the Studio to a unified tracking system;
events now send simplified payloads with less contextual/grouping data.
* No user-facing flows changed; UI behavior, permissions, and
interactions remain the same.
* **Tests**
* Updated telemetry mocks and tests to align with the new tracking
approach.
<!-- review_stack_entry_start -->
[](https://app.coderabbit.ai/change-stack/supabase/supabase/pull/46140?utm_source=github_walkthrough&utm_medium=github&utm_campaign=change_stack)
<!-- review_stack_entry_end -->
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
|
||
|
Gildas Garcia
|
5d97339d41 |
chore: remove <Select> _Shadcn_ suffix (#45988)
## Problem The `_Shadcn_` suffix isn't needed anymore on `Select` components ## Solution Remove it. No other changes <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Refactor** * Updated internal component architecture to standardize and simplify the codebase. These changes improve code maintainability and consistency across the application without affecting existing functionality or user experience. <!-- review_stack_entry_start --> [](https://app.coderabbit.ai/change-stack/supabase/supabase/pull/45988) <!-- review_stack_entry_end --> <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
Gildas Garcia
|
8c6d5036ea |
chore: remove <Label> _Shadcn_ suffix (#45986)
## Problem The `_Shadcn_` suffix isn't needed anymore on label component ## Solution Remove it. No other changes <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Refactor** * Standardized Label usage across the codebase by removing the legacy alias and using the direct Label export from the UI package consistently. * **Documentation** * Updated component examples and docs to use the standardized Label component in usage snippets and demos. <!-- review_stack_entry_start --> [](https://app.coderabbit.ai/change-stack/supabase/supabase/pull/45986) <!-- review_stack_entry_end --> <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
Gildas Garcia
|
4e86c39ea1 |
chore: remove <ContextMenu> _Shadcn_ suffix (#45971)
## Problem The `_Shadcn_` suffix isn't needed anymore on `<ContextMenu_Shadcn_>` and related components ## Solution Remove it. No other changes <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Refactor** * Replaced legacy context-menu component variants with the unified UI context-menu components across the app for consistent rendering and imports; behavior and menu content remain unchanged. * **Tests** * Updated a test mock to track the unified context-menu component mount count. * **Chores** * Simplified UI package re-exports to expose the canonical context-menu symbols. <!-- review_stack_entry_start --> [](https://app.coderabbit.ai/change-stack/supabase/supabase/pull/45971) <!-- review_stack_entry_end --> <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
Ali Waseem
|
153f2619bc |
feat(studio): show expand affordance for large SQL result cells (#45589)
## Summary
- Adds a hover-revealed expand button to SQL result cells whose value is
unlikely to fit on one line (objects, arrays, strings >60 chars, or
strings with newlines). Clicking opens the existing `CellDetailPanel`
for that cell.
- Switches the expand state from a boolean tied to the selected cell to
a direct `{ column, value }` reference, so the context menu and the new
button both target the right-clicked / clicked cell.
- Extracts the per-cell renderer into its own `ResultCell` component to
keep `Results.tsx` digestible and the new affordance isolated.
- Covers the new logic with exhaustive `isLargeValue` unit tests and a
`ResultCell` component test (visibility, click, right-click).
Linear: [FE-3130](https://linear.app/supabase/issue/FE-3130)
## Test plan
- [x] Run a SQL query that returns mixed cell types (short strings, long
strings, JSON objects, arrays, nulls) and confirm the expand button
appears only on cells where content is likely truncated.
- [x] Hover a large cell and click the expand button — `CellDetailPanel`
opens with the correct column + value.
- [x] Right-click a large cell and choose "View cell content" — same
panel opens with the right cell.
- [x] Right-click a small cell and "Copy cell content" — clipboard
contains the raw value.
- [x] Resize a column wider than its content and confirm the button
still positions correctly.
- [x] `pnpm vitest` for `Results.utils.test.ts`, `Results.test.tsx`,
`ResultCell.test.tsx` — all green.
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* Enhanced SQL result cells with automatic detection and expansion
functionality for large values (exceeding 60 characters or containing
line breaks)
* Added expand button to view full cell content directly in results
* Integrated right-click context menu for cell content options
* Improved display of null values in query results
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
|
||
|
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 --> |
||
|
Joshen Lim
|
87e8c59405 |
Add view data as user in auth users + refactor UI for role impersonation (#45358)
## Context As part of RLS testing, adding @awaseem's idea for having "View data as user" CTAs in the Auth Users's table <img width="348" height="190" alt="image" src="https://github.com/user-attachments/assets/855c8f54-0aba-478c-982b-1d9d29e419bd" /> ## Other changes Similar from @awaseem's suggestions, am also refactoring the Role Impersonation UI a little, mainly from a copy writing POV to improve the clarity of the UI. - More action-oriented and contextual header for the role impersonation popover - e.g Table Editor -> "View data as a role", or SQL Editor -> "Run SQL query as a role" - Updated labels to be bit more intuitive from a builder's POV - The actual database role is still mentioned in the option's description (so we aren't obfuscating the actual postgres logic) - Add label descriptors to elaborate what each role implies - e.g Anon -> "Not logged in" - Add docs button which points to [here](https://supabase.com/docs/guides/database/postgres/row-level-security#authenticated-and-unauthenticated-roles) that explains which roles Supabase uses - (Nit) Refactor to use Card component ### Before <img width="647" height="277" alt="image" src="https://github.com/user-attachments/assets/9ebae084-38b7-4e21-886b-f609bd71976e" /> ### After <img width="604" height="309" alt="image" src="https://github.com/user-attachments/assets/4d797309-1b6b-4fd0-aab3-63d5e144c53c" /> <img width="630" height="297" alt="image" src="https://github.com/user-attachments/assets/ca748635-c5da-4426-a9c3-8cb5aeef47a6" /> <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **New Features** * Added "View data as user" and "Run SQL as user" actions to user rows to impersonate a user and jump to table or SQL views. * Impersonation now surfaces an identity card in new tabs showing the impersonated identity and a Stop button. * **UI/UX Improvements** * Impersonation panels accept customizable headers, show clearer role labels (Postgres), richer role descriptions, condensed RLS copy, in-panel docs link, simplified "Stop" labels, and adjusted typography/padding for consistent styling. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
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> |
||
|
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> |
||
|
Ali Waseem
|
42b431a270 |
feat(studio): add keyboard shortcuts to the table editor (#45178)
## 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 set of new keyboard shortcuts for the table editor, along with infrastructure to register, gate, and surface them. ## What is the current behavior? Clicking into the grid "traps" the keyboard: Escape doesn't pop out, there are no shortcuts for row selection / deletion / navigation, and the search-tables input grabs focus on page load. ## What is the new behavior? ### New shortcuts (all scoped to the table editor) | Keybind | Action | Surface | |---|---|---| | `Esc` | Exit grid selection — clears the highlighted cell and drops focus back to the page | hotkey | | `↑` / `↓` | Start grid navigation from the first cell when no cell is selected | hotkey | | `Shift+Space` | Toggle selection on the current row | hotkey + checkbox tooltip | | `Mod+A` | Toggle selection on all displayed rows (matches Excel) | hotkey + header-checkbox tooltip + Cmd+K | | `Mod+Shift+A` | Toggle selection on all rows in the table | hotkey + "Select all rows in table" button tooltip + Cmd+K | | `Mod+Backspace` | Delete selected rows | hotkey + delete-button tooltip + Cmd+K | ### Infrastructure - **Split registry** — table-editor shortcuts moved to `state/shortcuts/registry/table-editor.ts`, spread into `SHORTCUT_IDS`. Makes it easy to scope a runtime check to a specific surface. - **`eventMatchesAnyShortcut`** (`state/shortcuts/matchEvent.ts`) — queries the hotkey library's live `SequenceManager` so gated shortcuts (`enabled: false`) are correctly excluded. Covered by `matchEvent.test.ts`. - **`handleCellKeyDown`** now calls `event.preventGridDefault()` whenever the keystroke matches an active table-editor shortcut, so rdg's "start editing on key press" default doesn't compete with shortcut actions (e.g. typing `Shift+X` no longer opens edit mode with `X` as input). - **`<Shortcut>` / `<ShortcutTooltip>`** used on the header checkbox, the per-row checkbox, the "Select all rows in table" button, and the delete button — keybinds show up on hover (Linear-style) so users can discover them without reading docs. - **CSS** — `.rdg:not(:focus-within) .rdg-cell[aria-selected='true']` drops the selected-cell outline whenever focus leaves the grid, reinforcing the "you're out" feedback after `Esc`. - **`useShortcut`** wraps the Cmd+K-registered action to close the command menu after firing (previously menu stayed open after selecting an action). - **Search-tables input** no longer auto-focuses on load, so arrow shortcuts work immediately without clicking out first. ## Additional context Linear: FE-3057 ### Test plan - [x] Open any table → `↓` selects the first cell; subsequent arrows navigate rows - [x] `Esc` drops focus out of the grid and re-enables `↓` to re-enter - [x] Click a cell → `Shift+Space` toggles that row's selection (checkbox) - [x] `Mod+A` toggles all displayed rows - [x] With pagination + some rows selected → `Mod+Shift+A` toggles "Select all rows in table" - [x] With rows selected → `Mod+Backspace` deletes them (existing confirmation flow) - [x] Hover the header checkbox / per-row checkbox / delete button → keybind tooltip after ~500ms - [x] Cmd+K with selection → the relevant action shows up; selecting it closes the palette and runs <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **New Features** * Added table editor keyboard shortcuts for navigation, row selection, and cell actions, with command-menu integration and visible shortcut tooltips. * **Improvements** * Better keyboard handling in grid cells allowing external shortcuts to override default behavior. * Select-all/deselect-all toggle and improved select-row UX; selected-cell styling no longer shows when grid loses focus. * Command menu now reliably closes before executing shortcut actions. * Removed autofocus on the table editor search input for consistent focus behavior. * **Tests** * Added unit tests covering shortcut matching and command-menu shortcut behavior. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
Ivan Vasilov
|
308cd791a2 |
chore: Prep work for migrating to Tailwind v4 (#45285)
This PR preps the monorepo for a migration to Tailwind v4: - Bump all Tailwind dependencies and libraries to the latest possible version, while still compatible with Tailwind 3. - Cleans up obsolete Tailwind 3 specific options and configs. - Cleans up unused CSS files and fixes the CSS imports. - Migrates all `important` uses in `@apply` lines to using the `!` prefix. - Move `typography.css` to the `config` package and import it from the apps. - Migrated all occurrences of `flex-grow`, `flex-shrink`, `overflow-clip` and `overflow-ellipsis` since they're deprecated and will be removed in Tailwind 4. - Make the default theme object typesafe in the `ui` package. - Migrate all `bg-opacity`, `border-opacity`, `ring-opacity` and `divider-opacity` to the new format where they're declared as part of the property color. - Bump and unify all imports of `postcss` dependency. |
||
|
Joshen Lim
|
5f867e5f6c |
Feature Preview: RLS Tester (#45121)
## Context Resolves FE-3077 Related discussion: https://github.com/orgs/supabase/discussions/45233 Verifying the correctness of your RLS policies set up has always been a gap, as highlighted by a number of GitHub discussions like [here](https://github.com/orgs/supabase/discussions/12269) and [here](https://github.com/orgs/supabase/discussions/14401). As such, we're piloting a dedicated UI for RLS testing (using role impersonation as the base), in which you'll be able to - Run a SQL query as a user (not logged in / logged in - this is the role impersonation part) - See which RLS policies are being evaluated as part of the query - And hopefully be able to debug which policies are not set up correctly Changes are currently set as a feature preview - and we'll iterate as we get feedback from everyone 🙂 🙏 <img width="613" height="957" alt="image" src="https://github.com/user-attachments/assets/83c37f8a-28fc-43b3-b0ff-e28571d8710c" /> <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **New Features** * RLS Tester: run queries as anon or authenticated users, view inferred SQL, per-table policy summaries, and data previews of accessible rows. * UI preview: new RLS Tester preview card and modal with opt-in toggle; RLS Tester sheet with role/user selector and query editor. * SQLEditor: “Explain” tab is always visible. * **Chores** * Added supporting API endpoints, background checks for table RLS status, and a local-storage flag to persist the preview opt-in. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
Joshen Lim
|
7f5865872a |
Enforce noUnusedLocals and noUnusedParameters in tsconfig.json + fix all related issues (#45264)
## Context Enforce `noUnusedLocals` and `noUnusedParameters` in tsconfig.json + fix all related issues |
||
|
Gildas Garcia
|
416210d666 |
chore: remove _Shadcn_ suffix for Checkbox and Radio components (#45263)
## Problem With #45211 and #45218 merged, we don't need the `_Shadcn_` suffix anymore ## Solution - [x] Remove the `_Shadcn_` suffix - [x] Update exports and imports <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Refactor** * Standardized UI component exports by removing legacy naming conventions and providing direct imports for checkbox and radio group components throughout the design system. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
Alaister YoungandAlaister Young
|
45fc609471 |
[FE-3034] feat(studio): render multi-line SQL error HINTs (#45038)
Preserve `formattedError` through the `ResponseError` path and fall back to splitting `error.message` on newlines so enhanced permission-denied HINTs from supabase/postgres#2084 render as separate lines in the SQL editor — users can actually read the GRANT example now. **Context:** postgres#2084 adds a multi-line HINT to SQLSTATE 42501 errors, telling users exactly how to grant access per-table. Today the SQL editor rendered the whole thing on one line because `formattedError` was stripped by the fetchers' error handling and the `message` fallback didn't split on `\n`. This PR fixes both. Blocks [FE-3023](https://linear.app/supabase/issue/FE-3023) — the project-creation toggle that flips default privileges; without readable HINTs users land on RLS debugging rabbit holes when they hit a permission denied. **Changed:** - `ResponseError` now carries an optional `formattedError` field; `ConnectionTimeoutError` / `UnknownAPIResponseError` thread it through. - `handleError` in `data/fetchers.ts` extracts `formattedError` from the raw error body and forwards it to the thrown subclass. - `UtilityTabResults.tsx` uses a new `getSqlErrorLines` helper — prefers `formattedError`, falls back to splitting `message` on newlines when it's multi-line (defense in depth since the exact field pg-meta populates for the HINT depends on the path). Copy button now uses the same lines. **Added:** - `getSqlErrorLines` pure helper + 9 unit tests. - 5 new tests in `handleError.test.ts` covering `formattedError` preservation on classified and unclassified errors. ## To test 1. Pull the branch, run `pnpm dev:studio`, open any project's SQL editor. 2. Run a query that triggers the enhanced HINT (requires postgres#2084 deployed on the DB — currently staging-only). Example: `select * from some_table_you_cant_read;` as a role without grants. 3. Expect the ERROR line, HINT line, and the `GRANT ...` example to each render on their own `<pre>` line, plus the Copy button to copy the full multi-line text. 4. Sanity check existing single-line errors (e.g. `select * from nonexistent_table`) still render as `Error: relation "nonexistent_table" does not exist` in the `<p>` fallback. <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit ## Release Notes * **New Features** * Improved SQL error message formatting in the editor for better readability and clarity. * **Refactor** * Centralized error formatting logic for more consistent error presentation across the application. * **Tests** * Added comprehensive test coverage for SQL error message parsing and formatting. <!-- end of auto-generated comment: release notes by coderabbit.ai --> Co-authored-by: Alaister Young <10985857+alaister@users.noreply.github.com> |
