dima/supabase
1
0 Fork 0
mirror of https://github.com/supabase/supabase.git synced 2026-10-07 02:15:05 +03:00
Code Issues Packages Projects Releases Wiki Activity
38,162 Commits 1,784 Branches 62 Tags
cli/ref-doc
Commit Graph
214 Commits
Author SHA1 Message Date
Saxon FletcherCursorClaude Opus 5
 		bd76d7fc34 feat(studio): wrap assistant Edge Function approval in a Confirm card (#49168) 
<img width="1512" height="862" alt="image"
src="https://github.com/user-attachments/assets/79a6d4dc-dcd2-489f-97d7-3ee7a0196b7d"
/>


## 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 / UI refactor.

## What is the current behavior?

Assistant Edge Function approval nests `ConfirmFooter` under the
function block. `addToolApprovalResponse` is wired whenever state is
`approval-requested`, including automatic approvals.

## What is the new behavior?

Introduces a `Confirm` card that owns the frame, with the footer
attached below the body. Edge Function approval uses that card.
Interactive Approve/Deny only runs for manual `approval-requested` parts
(`!approval.isAutomatic`), matching the [AI SDK tool-approvals `useChat`
guidelines](https://ai-sdk.dev/docs/agents/tool-approvals).

SQL still uses `DisplayBlockRenderer` until #49170. `ConfirmFooter` is
inlined into `Confirm` so SQL can keep importing the named footer until
that PR.

## Additional context

Part of stack #49171. Base: `chore/ai-sdk-7` (#49167).

Notebook proposal Confirm wrapping is **not** in this stack — that file
lives on [#49159](https://github.com/supabase/supabase/pull/49159).
Follow up after that stack merges.

## Test plan

- [ ] Deploy-edge-function tool part shows Confirm with Skip / Deploy
- [ ] Existing-function replace warning still requires the second
confirm
- [ ] After approve, footer morphs to loading and buttons disable
- [ ] `Confirm.utils.test.ts` and `EdgeFunctionRenderer.test.tsx` pass

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

* **New Features**
* Added confirmation cards for AI-assisted actions, including approve
and cancel controls.
* Improved handling of manual approval requests for SQL execution,
notebook changes, and Edge Function deployment.
* Added support for customizing report and Edge Function block styling.

* **Bug Fixes**
* Automatic approvals no longer appear as pending manual confirmations.
  * Skipped SQL actions now provide clearer messaging.

* **Tests**
* Expanded coverage for approval states, confirmation controls, and
automatic decisions.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

---------

Co-authored-by: Cursor <cursoragent@cursor.com>
Co-authored-by: Claude Opus 5 <noreply@anthropic.com>
 2026-08-20 11:35:34 +10:00
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 -->
 2026-08-14 11:29:39 +07:00
CharisandJoshen Lim 957e9fec67 feat(studio): notebook content at the API boundary (#48815) 
## Summary

Stacked on #48813 (1.2: notebook content schema). Part of
[FE-4109](https://linear.app/supabase/issue/FE-4109/notebooks-data-model)
— see that issue for the rest of the notebooks data-model stack.

- Teach `content-remap.ts`'s wire↔domain dispatcher about the `notebook`
content type, branding each cell's `sql` per `_tag` via the notebook
schemas added in 1.2 (parses through `notebookDomainSchema` on the way
in, unbrands per cell on the way out).
- Add `{ type: 'notebook'; content: Notebooks.Content }` to the
`Content` union in `content-query.ts`, plus a `ContentOfType<T>` helper
for narrowing it.
- Fix the resulting narrowing fallout at call sites that assumed
`Content` only ever meant `sql`/`report`/`log_sql`: two
generated-query-param casts, and four report/logs call sites now
narrowed via `ContentOfType<'report'>` / `ContentOfType<'log_sql'>`.

## Test plan

- [x] `pnpm --filter studio vitest run data/content/` — 35 tests pass,
including new notebook coverage in `content-remap.test.ts` (per-cell
brand separation, missing-field throw, remap↔unmap round-trip)
- [x] `pnpm typecheck` — clean (pre-existing unrelated `ui-patterns`
error aside)
- [x] `pnpm --filter studio lint` — no new warnings/errors on changed
files
- [x] `pnpm format` — clean

---------

Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
 2026-08-10 10:15:24 -04:00
Charis 21511042a3 feat(studio): assistant logs context and reports guard (#48514) 
## 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 — final PR (9/9) of the SQL editor logs-source stack.

**Base branch:** `charislam/sql-editor-inline-ai-clickhouse-dialect` (PR
8). Nothing here is user-visible: entry points stay behind
`sqlEditorLogsSource` + `otelLegacyLogs`, and flag rollout happens after
the whole stack merges.

## What is the current behavior?

- The Assistant has no idea a SQL editor snippet targets the logs
backend. Ask it about a logs snippet and it answers in Postgres, because
the attached query is fenced as ` ```sql ` and nothing tells the model
otherwise.
- Because the `sql` fence is what `MessageMarkdown` treats as runnable
Postgres, an attached ClickHouse query is rendered with a
Run-against-Postgres affordance and branded with `untrustedSql`.
- "Debug with Assistant" on a failed logs query produces a dialect-less
prompt, so both the in-app assistant and the copyable version get
debugged as Postgres.
- A report referencing a `log_sql` snippet runs its ClickHouse SQL
against the user's Postgres database and surfaces the resulting error.

## What is the new behavior?

**Assistant panel.** The "Current Query" chip records which backend the
attached query targets. That reaches the model two ways: each attachment
is fenced with its own dialect (` ```clickhouse ` vs ` ```sql `), and a
`containsLogsSnippets` flag rides on the user message as AI SDK
`metadata`. The server reads the flag off the conversation and prepends
the ClickHouse dialect rules plus the logs schema reference as a
non-cached context message.

Two design points worth calling out in review:

- The flag lives on the **message**, not the request body, so Retry and
the tool-approval continuation reproduce the context a message was
originally asked in — neither of those passes a per-call body.
- It's derived from **what's actually attached**, so detaching the chip
drops the claim rather than leaving the two able to disagree.

The `clickhouse` fence also keeps a logs query out of
`MessageMarkdown`'s `sql` branch, so it's no longer offered as runnable
Postgres or branded with `untrustedSql` — a boundary this stack's
distinct brands exist to prevent crossing.

**Debug flow.** `buildDebugChatArgs` attaches its query with a source
for the same reason, and names the dialect in the prompt text so the
copyable version stands on its own outside the app.

**Reports.** A report only stores a snippet id, so whether it queries
the logs backend is only knowable once the content loads. `ReportBlock`
guards on the fetched type and renders a `LogsSnippetReportBlock`
placeholder instead of executing. Double-guarded: no `sql` for a logs
snippet (so it's out of the query key and `queryFn` short-circuits even
on an explicit `refetch`) and `enabled` excludes it.

**Incidental cleanups.** `buildAssistantContextMessages` extracted out
of `generate-assistant-response`; a schema-access sentinel that was
duplicated as a string literal across two files (and compared against)
replaced with one exported constant; `SqlSnippet` deduplicated to a
single declaration; `resolveSnippetSource` / `isLogsSource` shared
instead of re-implemented per surface.

**Tests.** 4 new/extended suites. Notable cases pinned: a message with
no metadata must validate (`safeValidateUIMessages` applies
`metadataSchema` to *every* message, so a required schema would 400
every existing conversation); only *user* messages count, so a model
reply can't talk the server into a different dialect; a mixed-attachment
message is flagged without overclaiming a single source; and
`ReportBlock` registers no pg-meta mock for the logs cases, so an
unhandled request failing the test *is* the assertion that logs SQL
never reaches Postgres.

Verified: `pnpm typecheck`, `lint:ratchet` (no regression), Prettier,
and the full Studio suite (459 files / 4969 tests).

## Additional context

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

## Summary by CodeRabbit

- **New Features**
- Added support for recognizing log snippets in reports, with clear
guidance to open them in the SQL editor or remove them.
- AI Assistant now understands log snippets and provides
ClickHouse-specific context, formatting, and troubleshooting guidance.
- Snippets retain their source information when shared with the AI
Assistant.

- **Bug Fixes**
- Prevented unsupported log snippets from being executed as regular
database queries.
  - Improved source detection when opening snippets directly from links.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
 2026-08-04 09:02:40 -04:00
Danny White 73c9dbfa52 fix(studio): standardise custom icon weight (#48478) 
## What kind of change does this PR introduce?

Bug fix and internal tooling update. Resolves FE-3472.

## What is the current behavior?

Custom Studio icons use inconsistent source stroke widths, and some
child-level styling prevents component props from overriding them. Mixed
custom and Lucide icon sets can therefore appear uneven.

## What is the new behavior?

Custom stroke icons use a root-level `stroke-width="1.5"`; fill-only
logos use `stroke="none"`. The build validates that contract and
regenerated components preserve existing exports and props.

Studio applies the same `1.5` weight across Reports categories and uses
one shared destination icon mapping in the replication selector,
destination rows and diagram.

| Before | After |
| --- | --- |
| <img width="418" height="516" alt="56398"
src="https://github.com/user-attachments/assets/6afa7042-e6be-40e7-9911-af2f61238c9d"
/> | <img width="390" height="550" alt="CleanShot 2026-07-30 at 17 12
37@2x"
src="https://github.com/user-attachments/assets/870f49cf-c8fa-40db-8be8-2eb5f264ff4a"
/> |
| <img width="510" height="734" alt="CleanShot 2026-07-30 at 17 19
28@2x"
src="https://github.com/user-attachments/assets/a5b2c088-dcd2-4907-976b-5820794d06e3"
/> | <img width="554" height="742" alt="CleanShot 2026-07-30 at 17 16
06@2x"
src="https://github.com/user-attachments/assets/ed3a77c4-5d94-4ca7-b9e4-1403b725a981"
/> |


## Testing

At 100% zoom, compare custom and Lucide icon weight in:

- Reports: **Add your first chart** and **Add block**
- Database > Replication: the destination selector, destination rows and
replication diagram
- Command menu (`⌘K`): **Search Database Tables**, **Search RLS
Policies**, **Search Edge Functions** and **Search Storage**
- Authentication > Users: right-click a user row and compare the
context-menu icons
- Database > Schema Visualizer: open a table node overflow menu
- A paused project: **Export your data > Download backups**

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

* **New Features**
* Added consistent destination icons across replication panels, rows,
and diagrams.
  * Updated instance health and metric icons for clearer identification.
* Standardized icon stroke weight and reduced default icon stroke
thickness.

* **Documentation**
* Clarified custom icon requirements, default properties, and validation
guidance.

* **Bug Fixes**
* Improved consistency of icon rendering across replication destinations
and reports.

* **Tests**
* Added coverage for icon SVG validation and replication destination
icon rendering.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
 2026-08-03 17:48:50 +10:00
Joshen Lim cf7da58eb3 Add overview section for database connections (#48147) 
## Context

Building on top of "Database Connections" - this adds a top summary
section, again from `pg_stat_activity`
<img width="948" height="324" alt="image"
src="https://github.com/user-attachments/assets/f4968193-0a5f-4754-a630-40685b747999"
/>

Each block comes with a tooltip in hopes to educate the significance of
each metric
- Connections: Spread of connections per database role
<img width="313" height="164" alt="image"
src="https://github.com/user-attachments/assets/8ceeab5d-b960-4be3-9a5b-8600bd5cf303"
/>
- Active queries: Rough representative of activity
<img width="350" height="196" alt="image"
src="https://github.com/user-attachments/assets/f9705ff1-a869-409a-86b6-50170a169674"
/>
- Idle in transaction: Important to identify as this indicates locks
(Suggests root cause)
<img width="350" height="196" alt="image"
src="https://github.com/user-attachments/assets/f9705ff1-a869-409a-86b6-50170a169674"
/>
- Blocked queries: Also important to identify stuck queries
<img width="335" height="183" alt="image"
src="https://github.com/user-attachments/assets/57255fb8-24f6-4ddd-aa54-850a77173b5c"
/>
- Longest running query: Might be useful to identify unusually long
queries
- Will be `text-warning` if exceeds 30 seconds for active queries,
`text-destructive` if exceeds 10 seconds for queries idle in transaction
<img width="342" height="119" alt="image"
src="https://github.com/user-attachments/assets/f6783b43-058a-4a32-a40c-0bc64f23d2ce"
/>

"Summarize activity" CTA leverages on the Assistant to give a quick
overview - highlights any potential issues for quick reference
<img width="1918" height="958" alt="image"
src="https://github.com/user-attachments/assets/340121fe-3186-48a5-8023-fbac2a93397a"
/>

## Other changes
- Hides "View running queries" in SQL Editor if `topForPostgres` feature
flag is enabled (since this UI is meant to replace that)

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

* **New Features**
* Added a Database Connections observability overview with metric cards
(connections, longest-running, active, blocked, idle-in-transaction) and
an interactive “Longest running” PID selector.
* Added a “Summarize activity” AI assistant dropdown that starts a
timestamped, activity-aware summary chat.
* **Improvements**
* Enhanced live activity refresh (including window-focus updates) and
standardized duration warning thresholds for active and
idle-in-transaction sessions.
* Improved hover details for query previews and allowed richer tooltip
content for metric labels.
* **Feature Changes**
  * Gated the “View running queries” bottom panel behind a feature flag.
* **Bug Fixes**
* Refined running-too-long badge and warning styling for
idle-in-transaction cases.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
 2026-07-22 17:25:56 +08:00
Joshen Lim c7803b8b9b Chore/add sessions database connections (#48094) 
## Context

Initial work for Top for Postgres - adds a "Sessions" section under a
new Observability segment "Database Connections"
NOTE: All the copywriting and naming might change - not sure what's an
ideal title for this
We'll also be iteratively building on top of this UI, adding more
actionable signals instead of just information
Changes are featured flagged, off for public

- This would essentially replace the "View ongoing queries" in the SQL
Editor by providing a dedicated UI
  - It checks against `pg_stat_activity` as per the ongoing queries UI
- We'll also subsequently deprecate the "Ongoing queries" UI in the SQL
editor
- Defaults into a "live mode" where the data is refreshed every 3
seconds via long-polling
<img width="983" height="474" alt="image"
src="https://github.com/user-attachments/assets/16402fe4-0b53-4f9e-9342-cdda26e3778a"
/>
- Supports filtering by state  
<img width="374" height="282" alt="image"
src="https://github.com/user-attachments/assets/562f8fbe-2dc6-48e7-8ec0-de7ffb8348d1"
/>
- Users can also terminate queries through here
<img width="247" height="164" alt="image"
src="https://github.com/user-attachments/assets/23a639dc-8f96-473a-a823-605b0bab02ee"
/>





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

# Release Notes

* **New Features**
* Added an Observability **Database Connections** page with a live
**Sessions** activity table (state/roles filtering, blocked-by details,
session duration, and per-session termination with confirmation).
* Included a **Live/Pause** toggle to control automatic refresh (~3
seconds).

* **Enhancements**
* Improved Reports selection filtering: supports optional option
quantities, better popover styling, sorted apply behavior, and shows
quantity inline.
* Query performance duration formatting now supports configurable
decimal precision.
  * Tooltips can now render richer content (string or React node).
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
 2026-07-21 16:52:03 +08:00
Jordi Enric fc72a6b259 fix(studio): preserve API report filter value casing so method filters match (#48056) 2026-07-18 18:07:41 +02:00
Charis 1c827c5cbb refactor(sql-editor): extract title-gen/execute-params + merge auto-limit functions (#48013) 
## Summary
Part 2/6 of the SQL Editor testability follow-up, stacked on #47980 (the
analyzeQueryIssues/resolveConnectionString PR).

- Extracts `shouldAutoGenerateTitle` and `buildExecuteParams` out of
`useSqlEditorExecution`'s inline logic into `SQLEditor.utils.ts`.
- Merges `checkIfAppendLimitRequired` and `suffixWithLimit` into a
single `applyAutoLimit` function — the two were only ever called
together and re-parsed the same query twice at every call site.
`applyAutoLimit` only accepts `SafeSqlFragment` (never a plain string)
and composes the `LIMIT` suffix through `safeSql`/`literal` rather than
raw template concatenation, so the only place in the file that reasserts
the `SafeSqlFragment` brand on a derived string is the small, dedicated
`trimTrailingSemicolons` helper — removing existing terminators can't
introduce unsafe content, unlike gluing new text onto the fragment.
- Updates the two other `checkIfAppendLimitRequired`/`suffixWithLimit`
call sites (`EditorPanel.tsx`, `ReportBlock.tsx`) accordingly;
`ReportBlock` now promotes its report SQL once and reuses the result for
both its display-only auto-limit hint and its execution, instead of
promoting twice.

## Test plan
- [x] `pnpm --filter studio typecheck`
- [x] `pnpm test:studio -- SQLEditor ReportBlock EditorPanel` (239 tests
passing)
 2026-07-16 17:08:26 -04:00
Joshen Lim 944c5862f3 Chore/small refactors (#47740) 
## Context

Just extracting the fixes which I think are applicable from this
[PR](https://github.com/supabase/supabase/pull/47695)

Main files are
- `apps/studio/hooks/analytics/useLogsQuery.tsx`
- `packages/common/auth.tsx`
- `packages/common/feature-flags.tsx`

## Changes involved
- Adjust `useLogsQuery` to accept an object as prop, rather than 4
individual params
- This one doesn't address any Sentry issues, but is just a improvement
to the function's API imo, more readable
- Adjust how user email is retrieved in `feature-flags`
- Related Sentry issue
[here](https://supabase.sentry.io/issues/7592718607/?project=5459134)
- The error is a bit vague, but Claude's attempt to fix looks alright in
general IMO
  - Minimally verified that feature flags are loading as expected still

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

## Summary by CodeRabbit

* **Bug Fixes**
* Improved log-related screens and queries for more reliable loading and
filtering across the app.
* Fixed profile and account data handling so identity details are
retrieved more consistently.
* Improved authentication handling to better recognize missing user data
and keep the app stable.
* Updated feature flag personalization to use more accurate account
information.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
 2026-07-08 23:21:48 +08:00
Gildas Garcia e144628515 fix: studio observability sticky nav background is wrong (#47574) 
## Problem
Only in dark mode

<img width="1003" height="324" alt="image"
src="https://github.com/user-attachments/assets/e131fd07-1327-4a0b-bb27-eccf1f5d7f93"
/>

## Solution
<img width="943" height="230" alt="image"
src="https://github.com/user-attachments/assets/bcbee6e6-d303-45c6-b612-eb0f0423d458"
/>
 2026-07-03 14:09:38 +00:00
Gildas Garcia 6134e67693 fix: limit command menu height in auth observability filter (#47572) 
## Problem

We don't limit command menu height by default because we usually don't
have that many options. It's an issue here as shown in the screenshot
because it hides the _Apply_ button

## Solution

Add a max height to the list of options

Before:
<img width="1331" height="1019" alt="image"
src="https://github.com/user-attachments/assets/512b26ca-c08b-44c5-8bed-c89d5ab87da3"
/>

After:
<img width="1217" height="828" alt="image"
src="https://github.com/user-attachments/assets/43a4066d-7b20-4615-81ec-cebdb8539ec1"
/>


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

## Summary by CodeRabbit

* **Style**
* Adjusted the reports filter dropdown to limit its height, making long
lists easier to browse and preventing the menu from growing too large on
screen.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
 2026-07-03 14:53:14 +02:00
Saxon FletcherandClaude Opus 4.8 fb02182e86 Color system (#47288) 
## I have read the
[CONTRIBUTING.md](https://github.com/supabase/supabase/blob/master/CONTRIBUTING.md)
file.

YES/NO

## What kind of change does this PR introduce?

Bug fix, feature, docs update, ...

## What is the current behavior?

Please link any relevant issues here.

## What is the new behavior?

Feel free to include screenshots if it includes visual changes.

## Additional context

Add any other context or screenshots.


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

* **New Features**
* Refreshed theming across the UI to use modern color expressions and
shared theme variables (including OKLCH-based gradients), improving
consistency for charts, code blocks, overlays, icons, and decorative
backgrounds.
* **Bug Fixes**
* Improved light/dark color and gradient consistency across axis/grid
styling, reference lines, buttons/badges, sidebar accents, loaders, and
other visual components.
* **Documentation**
* Updated styling/theming guidance to align with the revised semantic
token system and the updated theme variable usage patterns.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

---------

Co-authored-by: Claude Opus 4.8 <noreply@anthropic.com>
 2026-07-03 15:00:43 +10:00
Gildas Garcia c6fc456910 chore: cleanup duplicate exports studio (#47387) 
## Problem

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

## Solution

- Cleanup those exports
- Update imports when necessary

No functional changes. If it builds, it's fine
 2026-06-29 15:46:16 +02:00
Miranda Limonczenko 5fc0c86007 feat(studio) Link observability pages to relevant docs (#47351) 
Closes DOCS-488

<img width="1266" height="353" alt="Screenshot 2026-06-26 at 11 02
57 AM"
src="https://github.com/user-attachments/assets/67b5d47b-249e-4e53-9230-2bbcb7f037b7"
/>


## I have read the
[CONTRIBUTING.md](https://github.com/supabase/supabase/blob/master/CONTRIBUTING.md)
file.

YES

## Problem

We have helpful documentation that delves into each observability
metric, but it is not easily findable in the moment it is needed while
viewing the dashboards.

## Solution

Solution includes:
- Add a docs link in Studio in every relevant place with the
`DocsButton` component
- Add aria-hidden on the `DocsButton` icon
- An added `constants.ts` to see all of the docs links in one place
- A contextual aria-label for the docs so that screenreader users know
where they're going


| Page | Docs link |
|------|-----------|
| Overview | `/guides/telemetry/reports` |
| Query Performance / Query Insights |
`/guides/platform/performance#examining-query-performance` |
| API Gateway | `/guides/telemetry/reports#api-gateway` |
| Database | `/guides/telemetry/reports#database` |
| Data API | `/guides/telemetry/reports#postgrest` |
| Auth | `/guides/telemetry/reports#auth` |
| Edge Functions | `/guides/telemetry/reports#edge-functions` |
| Storage | `/guides/telemetry/reports#storage` |
| Realtime | `/guides/realtime/reports` |
| Custom reports | `/guides/telemetry/reports#using-reports` |

Query Performance and Query Insights already had the button in their
custom headers. They now use the shared constants.

## Tophatting

1. Go to a project `/observability`.
2. Click into each of the panels and see a **Docs** link in the top
right.

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

## Summary by CodeRabbit

* **New Features**
* Added direct documentation links across observability report pages,
making it easier to open relevant help content from each view.
* Added clearer, page-specific labels for observability headers and docs
links.
* **Bug Fixes**
* Improved accessibility for icon buttons so icons are hidden from
assistive technologies while button labels remain clear.
* Adjusted report navigation layouts to keep controls aligned with the
new docs buttons.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
 2026-06-26 12:11:19 -07:00
Gildas Garcia 968fa3f052 chore: remove old Input component (#47259) 
## Problem

Every inputs and textarea have been migrated to the new shadcn
components. This `Input` is no longer needed

## Solution

- Delete it
- Clean up the `defaultTheme` accordingly

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

* **Breaking Changes**
* Removed the built-in Input component from the UI library, including
its attached TextArea export.
* Removed input styling support from the default theme (standard/error
variants and related icon/action/textarea spacing).
* Cleared the Input module styles, so prior textarea action UI styling
is no longer available.
* Removed the Reports filtering UI in Studio (including the popover
component and the associated report-filter hook), which may affect
report filtering screens.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
 2026-06-25 18:25:08 +02:00
Joshen Lim 42ec3c4960 Joshen/fe 3624 queryblock causes client side crash if rendering many rows (#47021) 
## Context

Having a custom report block on the project home page with a SQL that
returns a large set of results (e.g > 100k rows) causes a client side
crash with "Maximum call stack size exceeded"
<img width="400" alt="image"
src="https://github.com/user-attachments/assets/e4bb5b73-e114-4687-9d0b-a7bff328167c"
/>

This is happening due to an array spread in `computeYAxisWidth` in
`Math.max` - which am hence opting to use a `reduce` instead to mitigate
the problem.

Am also opting to apply the same autolimit logic in the SQL editor into
the `QueryBlock` here, so that we don't unnecessarily fetch a large
dataset in this UI. Added a UI indicator as well if auto limit has been
applied (So this also overlaps into dashboard scalability too)
<img width="1383" height="465" alt="image"
src="https://github.com/user-attachments/assets/08b66398-f3b8-49ce-b4a4-23c91510bd54"
/>



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

## Summary by CodeRabbit

* **New Features**
* Report query blocks now feature automatic SQL limiting functionality,
which restricts query results to a maximum of 100 rows when enabled
* When active, query result blocks display an informational notice to
users, clearly indicating the row restriction that has been applied

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
 2026-06-17 17:52:03 +08:00
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>
 2026-06-16 23:59:58 +02:00
Joshen Lim 1baaded0bb Consolidate execute-sql-query into execute-sql-mutation (#46944) 
## Context

Just some clean up as I was going through stuff
- `useExecuteSqlQuery` is deprecated and not used at all
- As such `execute-sql-query` is technically irrelevant, the more
relevant file is `execute-sql-mutation`
- Hence opting to consolidate `execute-sql-query` into
`execute-sql-mutation`
- Also removing `ExecuteSqlError` since its just re-exporting the
`ResponseError` type

There's a lot of file changes but its essentially just updating the
importing statements across the files
 2026-06-16 00:07:16 +08:00
kemal.earth 22c02a1304 fix(studio): custom report tooltips overflow (#46772) 
## 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?

Previously the `overflow-hidden` on the custom report charts container
was cutting off the tooltip within the card bounds. This PR introduces
`PortalChartTooltip` here so the tooltip is able to appear outside of
the bounding area. It is still directionally aware, just relative to the
page viewport as opposed to bounding box.

| Before | After |
|--------|--------|
| <img width="376" height="341" alt="image"
src="https://github.com/user-attachments/assets/4a85901c-6b68-4f02-a13f-d2e261267348"
/> | <img width="466" height="324" alt="Screenshot 2026-06-09 at 11 45
38"
src="https://github.com/user-attachments/assets/0071c670-ef12-4df5-90fc-79df19ce98ca"
/> |

If you want to test quickly but have no data, you can ask Claude to
generate you a dummy custom report chart and then move it around, test
the long tooltips.


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

* **New Features**
* Tooltips can now render in a dedicated layer to improve visibility and
avoid clipping.
* Option added to enable portal-rendered tooltips in condensed/snippet
views.

* **Bug Fixes**
* Improved tooltip positioning to prevent overflow outside the viewport.
  * Corrected percentage label suffixes in chart tooltips.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
 2026-06-10 17:58:11 +01:00
Gildas Garcia ff34a6753c chore: remove unnecessary <PreventNavigationOnUnsavedChanges> (#46763) 
## Problem

Since the refactor done in #43900, the
`<PreventNavigationOnUnsavedChanges>` does not bring much value.

## Solution

Remove `PreventNavigationOnUnsavedChanges` and update consumers to
leverage `usePreventNavigationOnUnsavedChanges` and
`DiscardChangesConfirmationDialog`

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

## Summary by CodeRabbit

* **Refactor**
* Improved the architecture of unsaved-changes navigation handling
across multiple features. Components now use a more modular hook-based
approach for better code organization and consistency.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
 2026-06-09 15:30:18 +02:00
Jordi EnricandClaude Opus 4.8 faa6d46e8b fix(reports): guard against malformed URI in route renderer (#46729) 
## Problem

The PostgREST observability page crashes for some projects with
`URIError: URI malformed`. The route renderer calls `decodeURIComponent`
directly on the request query string, which is user-controlled. A
malformed percent-sequence (for example a literal `%` in
`?discount=100%`) makes `decodeURIComponent` throw during render, taking
down the whole page via the global error boundary.

Tracked in Sentry issue 7536581822.

## Fix

Add a `safeDecodeURIComponent` helper that wraps `decodeURIComponent` in
a try/catch and falls back to the raw string on failure. Use it in the
route renderer. The sibling `queryParamsToObject` call is unaffected
since `URLSearchParams` already tolerates malformed escapes.

## How to test

- Open a project's PostgREST observability report
(`/project/[ref]/observability/postgrest`).
- Ensure a request with a malformed query string (e.g. a path containing
a bare `%`) appears in the data.
- Expected result: the row renders with the raw search string instead of
crashing the page.
- Unit tests for `safeDecodeURIComponent` cover valid decode, malformed
input, and empty string.

---------

Co-authored-by: Claude Opus 4.8 <noreply@anthropic.com>
 2026-06-08 11:11:32 +00:00
Charis edf946ac06 refactor(logs): rename Reports logs sql field to safeSql (#46469) 
## 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 (naming consistency cleanup).

## What is the current behavior?

`ReportQueryLogs` exposed its SQL builder under a `sql:` field while
`ReportQueryDb` used `safeSql:`. Both already returned branded fragments
(`SafeLogSqlFragment` / `SafeSqlFragment`), so should consolidate on
`safeSql`.

## What is the new behavior?

Renames `sql:` → `safeSql:` on `ReportQueryLogs` so the two report-query
shapes use the same field name. Updates every Logs preset under
`PRESET_CONFIG[API|STORAGE]`, every entry and call site in
`SharedAPIReport.constants.ts`, and `getLogsSql` in `Reports.utils.tsx`.

Part of the analytics SQL safety series; PRs 10 (remaining analytics
callers) and 11 (ESLint rules) still to follow.

## Additional context

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

## Summary by CodeRabbit

* **Refactor**
* Enhanced query handling across API analytics reports (requests, top
routes, errors, performance metrics) and Storage analytics reports
(cache metrics) for improved consistency in query processing.

<!-- review_stack_entry_start -->

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

<!-- review_stack_entry_end -->

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
 2026-05-28 12:12:18 -04:00
Charis 9bdb757b6a feat(logs): brand Observability/EdgeFunctions SQL with SafeLogSqlFragment (#8) (#46466) 
## 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 / security hardening — continues the analytics SQL
provenance-tracking series (PR 8).

## What is the current behavior?

- `generateRegexpWhere` (unsafe: interpolates user-controlled filter
keys/values without escaping) still exists alongside
`generateRegexpWhereSafe` and its tests only cover the old function.
- `usePostgrestOverviewMetrics` builds a SQL query string with plain
string interpolation and calls the analytics endpoint directly via
`get()`.
- `edge-functions-last-hour-stats-query` builds a SQL query with
`functionIds` escaped via Postgres-only `quoteLiteral` and calls the
analytics endpoint directly via `post()`.
- `executeAnalyticsSql` has no way to pass a `key` query-string param
for network-tool identification.
- `rawSql('minute')` / `rawSql('hour')` / `rawSql('day')` and
`rawSql(value ? 'true' : 'false')` are used for static strings that
could be expressed with the `safeSql` template tag.

## What is the new behavior?

- `generateRegexpWhere` is deleted; its tests are replaced with
`generateRegexpWhereSafe` coverage including injection-attempt cases
(`level OR id IS NOT NULL`, `request.method); DROP TABLE edge_logs; --`)
that verify predicates are silently dropped rather than emitted.
- `usePostgrestOverviewMetrics` returns `SafeLogSqlFragment` from its
SQL builder and routes through `executeAnalyticsSql`.
- `edge-functions-last-hour-stats-query` uses `analyticsLiteral`
(BigQuery/ClickHouse-correct escaping) instead of `quoteLiteral`
(Postgres-only) and routes through `executeAnalyticsSql`.
- `executeAnalyticsSql` accepts an optional `key?: string` forwarded as
a query-string param on both GET and POST requests; `key:
'last-hour-stats'` is restored on the edge-functions query.
- Static `rawSql('...')` calls replaced with `safeSql\`...\`` template
literals throughout.

## Additional context

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

## Summary by CodeRabbit

## Bug Fixes
- Removed legacy unsafe SQL-filter utility from Reports

## Chores
- Enhanced analytics SQL execution infrastructure with improved error
handling
- Added optional request identification parameter to analytics query
execution
- Refined SQL filtering mechanisms in reporting features

<!-- review_stack_entry_start -->

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

<!-- review_stack_entry_end -->

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
 2026-05-28 10:30:57 -04:00
Charis 42f1f19fdd feat(logs): brand SharedAPIReport SQL with SafeLogSqlFragment (#46405) 
## 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?

Security / refactor — migrates `SharedAPIReport.constants.ts` to the
proven-authorship model (`SafeLogSqlFragment`).

## What is the current behavior?

All seven SQL builders in `SHARED_API_REPORT_SQL` return plain `string`
and interpolate filter values via `generateRegexpWhere`, which performs
manual quoting without sanitization. The source table name (`edge_logs`
/ `function_edge_logs`) is also interpolated as a raw string. Queries
are executed via a local `fetchLogs` function that calls `get()`
directly, bypassing the `executeAnalyticsSql` wire boundary.

## What is the new behavior?

- Each SQL builder is rewritten with the `safeLogSql` template tag and
returns `SafeLogSqlFragment`.
- Filter keys route through `quotedIdent` (predicates with invalid
identifiers are dropped); values route through `analyticsLiteral`
(single quotes and backslashes are escaped).
- A `SOURCE_TABLE` branded map covers the two possible source tables;
`sourceTable()` looks up the branded fragment instead of interpolating a
raw string.
- `fetchLogs` is removed; `useQueries` calls `executeAnalyticsSql`
directly with `method: 'get'`, routing through the shared wire boundary.
- The `queryFn` wraps the call in a try/catch that also checks
`data?.error`, preserving the original Sentry capture behaviour
(`'Shared API Report Error'`) for both network and API-level errors.

## Additional context
 2026-05-27 17:22:42 +00:00
Charis 0ab0106758 feat(logs): brand Reports logs presets with SafeLogSqlFragment (#46403) 
## 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 / security hardening (part of a stacked series applying
compile-time SQL provenance tracking to analytics call sites).

## What is the current behavior?

The `queryType: 'logs'` presets in `PRESET_CONFIG` (API ×8, Storage ×2)
build BigQuery SQL by splicing filter keys and values via plain string
interpolation through `generateRegexpWhere`, with no compile-time
guarantee that the output is injection-safe. `ReportQueryLogs.sql`
returns `string` and `getLogsSql` returns `string`.

## What is the new behavior?

- `generateRegexpWhereSafe` added to `Reports.constants.ts`: routes
filter keys through `quotedIdent` (dropping predicates whose identifier
fails the `[A-Za-z_][A-Za-z0-9_]*` regex) and values through
`analyticsLiteral`. Values must be raw/unquoted — the function handles
all quoting and escaping itself.
- All ten `queryType: 'logs'` presets migrated to use the `safeLogSql`
template tag and `generateRegexpWhereSafe`.
- `ReportQueryLogs.sql` return type tightened from `string` to
`SafeLogSqlFragment`; `getLogsSql` return type updated to match.
- Manual pre-quoting of the `identifier` filter removed in
`useApiReport` and `useStorageReport` (`value: \`'${identifier}'\`` →
`value: identifier`), since `analyticsLiteral` now handles quoting.

## Additional context

Smoke test: `/observability/api-overview`, `/observability/storage`. To
exercise the replica `identifier` filter, select a replica on
`/observability/database` first, then navigate to those pages.
 2026-05-27 13:11:39 -04:00
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 -->

[![Review Change
Stack](https://storage.googleapis.com/coderabbit_public_assets/review-stack-in-coderabbit-ui.svg)](https://app.coderabbit.ai/change-stack/supabase/supabase/pull/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 -->
 2026-05-27 15:19:54 +08:00
Jordi Enric 4a7a540268 fix(studio): hide disk IO burst balance charts on 4XL+ compute (#46327) 
## Problem

On 4XL and larger compute sizes, Supabase disk IO is sustained rather
than burst-budget based. Baseline equals max, so there is no extra burst
balance to track (the instance can still be throttled if it hits its
configured IOPS or throughput limit, but that is unrelated to a burst
credit pool). The "Disk IO Burst Balance" / "Disk IO % Remaining" /
"Disk IO % Consumed" charts in custom reports are therefore meaningless
on 4XL+, yet they are currently still offered in the picker and rendered
as empty/misleading charts.

Custom reports persist their layout, so a report created when a project
was on a smaller compute and later upgraded to 4XL+ can still contain a
saved burst chart that we need to handle gracefully.

## Fix

- Add a shared \`hasBurstableIO(infra_compute_size)\` helper in
\`DiskManagement.utils.ts\` (replaces the local
\`BURSTABLE_IO_VARIANTS\` set previously defined inline in
\`database-charts.ts\`).
- Filter \`disk_io_budget\` and \`disk_io_consumption\` out of the
custom report chart picker (\`MetricOptions\`) when the project is on a
non-burstable compute size.
- In \`ReportBlock\`, detect saved burst charts on a 4XL+ project and
render a new \`UnavailableChartBlock\` that explains the chart no longer
applies and can be removed.
- The database observability burst balance chart already gated on
\`hasBurstableIO\`; updated to use the shared helper.
- Infrastructure activity page already has equivalent handling via the
dedicated-IO admonition, so no change needed there.

Linear: FDBKPRI-1404

## Test plan

- [ ] On a project below 4XL, the custom report picker still lists "Disk
IO % Remaining" and "Disk IO % Consumed", and they render normally
- [ ] On a 4XL+ project, neither metric appears in the picker
- [ ] Open an existing custom report that contains a saved burst balance
chart on a 4XL+ project, and confirm the placeholder block renders with
a clear explanation and a remove action
- [ ] Database observability page on 4XL+: the burst balance chart
remains hidden, all other charts render

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

* **New Features**
* Disk IO metrics are now filtered based on your project’s compute size
so only relevant charts appear.
* Metrics tied to burstable IO are hidden when the current instance does
not support burstable IO; deprecated metrics remain excluded.
* When a disk IO chart isn’t available for your instance, the UI shows
an explanatory unavailable-chart block with text about burst-balance
limits for very large instances and optional actions to remove the
unavailable chart.

<!-- review_stack_entry_start -->

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

<!-- review_stack_entry_end -->
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
 2026-05-26 11:07:38 +02:00
Ali Waseem 42c0cb7171 feat(studio): keyboard shortcuts for observability pages (#46277) 
## Summary

Wires Linear-style keyboard shortcuts across all observability pages —
refresh, time picker, filters, and sub-page navigation — with hover
tooltips surfacing each binding.

| Page | Shortcut | Action |
| --- | --- | --- |
| Overview | `Shift+R` | Refresh report |
| Overview | `Shift+P` | Open time picker |
| Query Performance | `Shift+R` | Refresh report |
| Query Performance | `R` then `C` | Reset report
(`pg_stat_statements_reset`) |
| Query Performance | `Shift+F` | Search queries |
| Query Performance | `F` then `C` | Reset filters |
| API Gateway | `Shift+R` | Refresh report |
| API Gateway | `Shift+P` | Open time picker |
| API Gateway | `Shift+F` | Add filter |
| API Gateway | `F` then `C` | Reset filters |
| API Gateway | `Shift+S` | Filter requests by service |
| Database | `Shift+R` | Refresh report |
| Database | `Shift+P` | Open time picker |
| Auth | `Shift+R` | Refresh report |
| Auth | `Shift+P` | Open time picker |
| Data API | `Shift+R` | Refresh report |
| Data API | `Shift+P` | Open time picker |
| Storage | `Shift+R` | Refresh report |
| Storage | `Shift+P` | Open time picker |
| Realtime | `Shift+R` | Refresh report |
| Realtime | `Shift+P` | Open time picker |
| Edge Functions | `Shift+R` | Refresh report |
| Edge Functions | `Shift+P` | Open time picker |
| All observability pages | `U` then `O/Q/G/D/P/A/F/S/L` | Jump to
sub-page |

## Test plan

- [ ] Each shortcut fires on its page; tooltip on hover shows the
binding
- [ ] Picker shortcut toggles the popover open/closed without leaving
the tooltip visible
- [ ] Reset-report on Query Performance opens the confirm modal
- [ ] `Escape` on the query search clears the value, then blurs
- [ ] No "Shift+R already registered" / Tooltip controlled-uncontrolled
warnings in the console

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

* **New Features**
* Keyboard shortcuts to navigate Observability pages and perform common
actions (refresh, toggle date picker/interval, focus search, reset
filters, create reports).
* Shortcut hints shown on relevant buttons and controls; date pickers
and interval dropdowns can be controlled via shortcuts.
* Global shortcut groups/registries added for Observability navigation
and page actions.

<!-- review_stack_entry_start -->

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

<!-- review_stack_entry_end -->
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
 2026-05-25 07:37:16 -06:00
Gildas Garcia 4668496c61 chore: migrate observability Modal to Dialog (#46281) 
## Problem

Observability still uses the deprecated `Modal` for:
- creating a new report
- updating a report

## Solution

- use `Dialog` instead

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

## Summary by CodeRabbit

* **Style**
* Updated report creation and editing dialogs with refreshed component
styling.

<!-- review_stack_entry_start -->

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

<!-- review_stack_entry_end -->

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
 2026-05-22 18:16:41 +02:00
Gildas Garcia 243e079a2c chore: remove _Shadcn_ suffix from Command components (#46153) 
## Problem

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

## Solution

- Remove the `_Shadcn_` suffix
- Simplify UI package exports
- Apply prettier

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

## Summary by CodeRabbit

* **Refactor**
* Simplified command component imports and exports across the UI library
by removing internal naming aliases and adopting direct component
references. Updated the public UI package barrel export to use wildcard
re-exports for cleaner API surface.

<!-- review_stack_entry_start -->

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

<!-- review_stack_entry_end -->

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
 2026-05-20 15:45:32 +02:00
Charis 2d4e87f579 studio: SafeSql for reports, query performance, privileges (4/7) (#45998) 
## Summary

Part 4 of the SafeSql migration stack
([#45897](https://github.com/supabase/supabase/pull/45897),
[#45903](https://github.com/supabase/supabase/pull/45903),
[#45990](https://github.com/supabase/supabase/pull/45990), this PR, …).

Converts the remaining reports, query performance, observability, index
advisor, and privileges call sites of `executeSql` to produce
`SafeSqlFragment` values. The `ReportQuery.sql` field flips from
`string` to `SafeSqlFragment`, which cascades into every consumer —
landed here atomically so each branch typechecks cleanly.

Touched areas:

- `interfaces/Reports/*` — `ReportQuery.sql: SafeSqlFragment`, plus all
report definitions/utilities updated
- `interfaces/QueryPerformance/useQueryPerformanceQuery.ts`
- `interfaces/Database/IndexAdvisor/*` and
`data/database/{table-index-advisor,retrieve-index-advisor-result}-query.ts`
-
`data/privileges/{table-api-access,update-exposed-entities}-mutation.ts`
- `interfaces/Storage/StoragePolicies/StoragePolicies.tsx`
- `hooks/analytics/useDbQuery.tsx`
- `Observability/useSlowQueriesCount.ts` +
`useQueryInsightsIssues.utils.test.ts`

## Test plan

- [x] `pnpm typecheck` passes
- [x] `useQueryInsightsIssues.utils.test.ts` passes
- [x] Dev-server smoke test: reports pages, query performance, index
advisor, storage policies

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

* **Refactor**
* Reworked SQL construction and typings across reporting, query
performance, index advisor, and privilege features to use safer SQL
fragments, improving reliability and preventing query composition
issues.
* **Types**
* Reporting query types were split to distinguish database vs. logs
queries, enabling correct handling and validation.
* **Docs/Utils**
  * Added a helper to consistently generate logs SQL for report hooks.
* **Tests**
  * Updated tests to exercise the new SQL-building API.

<!-- review_stack_entry_start -->

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

<!-- review_stack_entry_end -->
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
 2026-05-15 14:50:38 -04:00
Gildas Garcia 5d97339d41 chore: remove <Select> _Shadcn_ suffix (#45988) 
## Problem

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

## Solution

Remove it. No other changes

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

## Summary by CodeRabbit

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

<!-- review_stack_entry_start -->

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

<!-- review_stack_entry_end -->

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
 2026-05-15 16:39:57 +02:00
Gildas Garcia d0fd4478c0 chore: migrate Popover usages to Shadcn components (#45980) 
## Problem

We have multiple Popover components

## Solution

- [x] migrate Popover usages to Shadcn components
- Migrated JSON and text editor in the `TableEditor` (inline row
edition)
  - Migrated the template popover in the logs explorer templates page
- [x] remove `_Shadcn_` suffix from Popover components (renaming +
prettier)

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

* **Refactor**
* Unified popover implementation across the app and design system;
dropdowns, calendars, menus and tooltips now use a consistent popover
API with no visual or interaction changes.

* **Chores**
* Minor prop typing update for the logs date-picker to align with the
consolidated popover content type.

<!-- review_stack_entry_start -->

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

<!-- review_stack_entry_end -->
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
 2026-05-15 15:20:28 +02:00
Gildas Garcia 0713a1efc1 chore: remove shadcn suffix for Input, Textarea, Alert and Collapsible (#45867) 
## Problem

Now that we migrated old components to their new shadcn alternatives, we
don't need the `_Shadcn_` suffix anymore.

## Solution

Remove it

<img width="659" height="609" alt="image"
src="https://github.com/user-attachments/assets/2d7271a9-066a-4dcc-92fe-729b106d2c2f"
/>
 2026-05-15 14:55:37 +02:00
Vaibhav b56ba64d2e fix: tooltip dates (#45922) 
## TL;DR

fixes one day off observability tooltip 

## before:
<img width="227" height="159" alt="image"
src="https://github.com/user-attachments/assets/6cc8653f-2304-4d63-bf53-af01425c0d96"
/>

## after:
 
<img width="288" height="200" alt="image"
src="https://github.com/user-attachments/assets/9aa35e63-2fbc-42aa-82c8-1a3b158e6f40"
/>


## ref:

- closes https://github.com/supabase/supabase/issues/45921
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit

* **Bug Fixes**
* Improved chart tooltip date label formatting: tooltips now detect
ISO-like date strings and format them consistently, while preserving
previous formatting for other values. This change ensures correct,
readable dates in both bar and line chart tooltips within reports.

<!-- review_stack_entry_start -->

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

<!-- review_stack_entry_end -->

<!-- review_stack_entry_start -->

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

<!-- review_stack_entry_end -->
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
 2026-05-14 15:28:49 +02:00
kemal.earth 8ca04989c8 fix(studio): reports table footer overflow (#45885) 
## I have read the
[CONTRIBUTING.md](https://github.com/supabase/supabase/blob/master/CONTRIBUTING.md)
file.

YES

## What kind of change does this PR introduce?

A small bug that was causing the overflow of chart table footers to
break on smaller viewports. Now fixed along with cell horizontal
spacing.


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

## Summary by CodeRabbit

* **Improvements**
* Enhanced table layouts in the Reports section by enabling horizontal
scrolling for API Routes and Cache Misses tables, ensuring all data is
visible on various screen sizes.

<!-- review_stack_entry_start -->

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

<!-- review_stack_entry_end -->

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
 2026-05-13 08:09:18 -06:00
Gildas Garcia 35571d242e chore: migrate <Collapsible> to shadcn <Collapsible> (#45819) 
## Problem

We have multiple `Collapsible` components.

## Solution

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

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

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

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

* **Chores**
* Removed deprecated collapsible variants and consolidated UI component
surface for simpler maintenance.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
 2026-05-13 09:39:48 +02:00
Jordi Enric bef828ae48 feat(studio): apply timezone picker to observability/reports charts (#45667) 
## Problem

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

## Fix

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

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

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

## How to test

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

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

* **Refactor**
* Standardized date/time formatting across charts, tooltips, axis
labels, header/footer labels, and highlight range labels in Reports and
chart components.
* Switched to a shared, timezone-aware formatter that respects UTC
display mode or the selected picker/timezone, ensuring consistent,
human-readable timestamps throughout the UI.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
 2026-05-07 19:31:59 +02:00
Gildas Garcia 678aec3845 chore: migrate Input usages to Shadcn component in various screens/components (#45604) 
## Screenshots

### Table editor: foreign record selector
Before:
<img width="802" height="213" alt="image"
src="https://github.com/user-attachments/assets/82ee3ce6-ac72-4b49-b1b0-2e635688cbb1"
/>

After:
<img width="609" height="194" alt="image"
src="https://github.com/user-attachments/assets/e9cc09c1-1c6b-4099-8cae-abe08f50fda9"
/>


### Account - Add TOTP
Before:
<img width="527" height="679" alt="image"
src="https://github.com/user-attachments/assets/b9f4a626-e24b-46e3-8385-700ef181308b"
/>

After:
<img width="531" height="684" alt="image"
src="https://github.com/user-attachments/assets/549745a7-9655-4a7d-9e0e-51f75b6a1c61"
/>

### Organisation Audit Logs Details
Before:
<img width="673" height="1321" alt="image"
src="https://github.com/user-attachments/assets/0bb360cf-6f27-4574-b9af-485a3836b17b"
/>

After:
<img width="669" height="1273" alt="image"
src="https://github.com/user-attachments/assets/0382c662-e270-41fd-a8ee-08528dedfce3"
/>

### Data API Integration Docs
Before:
<img width="1115" height="891" alt="image"
src="https://github.com/user-attachments/assets/db0c7698-53b7-4422-aac3-5e674b0bf151"
/>

After:
<img width="1193" height="1272" alt="image"
src="https://github.com/user-attachments/assets/927e5c43-413b-49c1-9b71-8ab628179c70"
/>

### Edge Function Edit Secret
Before:
<img width="599" height="255" alt="image"
src="https://github.com/user-attachments/assets/d6aa2f87-e247-4724-9e43-02b71933241c"
/>

After:
<img width="596" height="261" alt="image"
src="https://github.com/user-attachments/assets/d94acb41-07e1-497f-9697-830390526f4a"
/>

### JWT Key Details
Before:
<img width="536" height="549" alt="image"
src="https://github.com/user-attachments/assets/43672adc-dc0e-4e65-b7d4-b4537d22f6ea"
/>

After:
<img width="523" height="517" alt="image"
src="https://github.com/user-attachments/assets/e501e8a8-7f41-46a0-bb69-d240cea594f0"
/>

### Realtime Filter Popover
Before:
<img width="403" height="576" alt="image"
src="https://github.com/user-attachments/assets/73842450-ba87-456b-98fc-625b99149449"
/>

After:
<img width="387" height="564" alt="image"
src="https://github.com/user-attachments/assets/f2b35035-947c-4342-84dd-3548f9bd5e9f"
/>

### Realtime broadcast message dialog
Before:
<img width="520" height="393" alt="image"
src="https://github.com/user-attachments/assets/4f4a1a93-e0cf-4268-ae4e-baf8b8a62e74"
/>

After:
<img width="525" height="392" alt="image"
src="https://github.com/user-attachments/assets/e1c1934a-1812-4013-8606-9b846dc2498d"
/>

### Impersonation Popover
Before:
<img width="604" height="501" alt="image"
src="https://github.com/user-attachments/assets/9abdc604-94f8-4ed4-9a95-4688e6504e76"
/>
<img width="587" height="599" alt="image"
src="https://github.com/user-attachments/assets/5293c80c-9abd-43eb-899f-da759c83b598"
/>

After:
<img width="594" height="585" alt="image"
src="https://github.com/user-attachments/assets/5eaf2162-2d7f-444c-9052-c9afb00080f6"
/>
<img width="590" height="597" alt="image"
src="https://github.com/user-attachments/assets/149dc7c1-689c-4e0f-a884-c6f5b0228ebc"
/>

### Storage move item
Before:
<img width="521" height="285" alt="image"
src="https://github.com/user-attachments/assets/7d0f945f-add5-412b-813a-9325b260ab28"
/>

After:
<img width="529" height="274" alt="image"
src="https://github.com/user-attachments/assets/ab0891a1-b31b-40b6-be53-92afc95095ea"
/>

### Table Editor - Spreadsheet import
Before:
<img width="673" height="506" alt="image"
src="https://github.com/user-attachments/assets/7a722908-10c2-4c04-95fb-b12d3c23557c"
/>

After:
<img width="671" height="638" alt="image"
src="https://github.com/user-attachments/assets/689b1fb6-031c-4a02-9e7f-739356c1453d"
/>

### Org Billing downgrade survey
Before:
<img width="788" height="655" alt="image"
src="https://github.com/user-attachments/assets/c7a0d4c6-e9b9-4c6c-9cf1-e7d05016233f"
/>

After:
<img width="1630" height="1354" alt="image"
src="https://github.com/user-attachments/assets/e3f5473b-db9a-42b1-9242-40480c25fc02"
/>

### Project API Docs
Before:
<img width="1030" height="396" alt="image"
src="https://github.com/user-attachments/assets/95643b21-811a-4ba7-918a-5e655c262ac1"
/>

After:
<img width="1012" height="457" alt="image"
src="https://github.com/user-attachments/assets/d5559646-bb89-43b6-ad62-c5684b54b3fb"
/>


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

* **Refactor**
* Standardized form field layouts across panels, dialogs, and modals for
a more consistent editing and reading experience.
* Replaced several Input-based textareas with dedicated
TextArea/ExpandingTextArea controls and aligned labels with wrapper
layouts for clearer accessibility.
* Introduced grouped/composable input controls, added additional
read-only detail fields and labeled value/copy blocks, and tightened
header/layout spacing and control alignment.
  * Swapped notice styles for improved warning/admonition presentation.

* **Chores**
  * Removed a deprecated AutoTextArea component.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
 2026-05-07 17:07:11 +02:00
Vaibhav 7e405cbe6d fix: observability expand (#45644) 
## before 
<img width="1545" height="548" alt="image"
src="https://github.com/user-attachments/assets/c6d84d77-1c66-4316-9c04-f3b343f6b9c3"
/>


## after

<img width="1524" height="882" alt="image"
src="https://github.com/user-attachments/assets/c2e0e40e-2f12-4d82-97b6-a5021b6bd59c"
/>

## ref:
- closes https://github.com/supabase/supabase/issues/45557


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

## Summary by CodeRabbit

* **Bug Fixes**
* Improved text wrapping for query parameters in reports to prevent
content overflow and enhance readability.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
 2026-05-07 08:35:38 -06:00
Charis 465121894d studio: add sql provenance tracking to ai assistant + reports (#45608) 2026-05-06 09:14:45 -04:00
Charis 0433eeb5f5 feat(studio): mark sql provenance for safety (#45336) 
Mark provenance of SQL via the branded types SafeSqlFragment and
UntrustedSqlFragment. Only SafeSqlFragment should be executed;
UntrustedSqlFragments require some kind of implicit user approval (show
on screen + user has to click something) before they are promoted to
SafeSqlFragment.

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

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

* **Refactor**
* Platform-wide SQL handling tightened: snippets and AI-generated SQL
are treated as untrusted/display-only until promoted, improving safety
and consistency.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
 2026-05-04 13:08:06 -04:00
Ivan VasilovandJordi Enric 56de26fe22 chore: Migrate the monorepo to use Tailwind v4 (#45318) 
This PR migrates the whole monorepo to use Tailwind v4:
- Removed `@tailwindcss/container-queries` plugin since it's included by
default in v4,
- Bump all instances of Tailwind to v4. Made minimal changes to the
shared config to remove non-supported features (`alpha` mentions),
- Migrate all apps to be compatible with v4 configs,
- Fix the `typography.css` import in 3 apps,
- Add missing rules which were included by default in v3,
- Run `pnpm dlx @tailwindcss/upgrade` on all apps, which renames a lot
of classes
- Rename all misnamed classes according to
https://tailwindcss.com/docs/upgrade-guide#renamed-utilities in all
apps.

---------

Co-authored-by: Jordi Enric <jordi.err@gmail.com>
 2026-04-30 10:53:24 +00:00
Ivan Vasilov 308cd791a2 chore: Prep work for migrating to Tailwind v4 (#45285) 
This PR preps the monorepo for a migration to Tailwind v4:
- Bump all Tailwind dependencies and libraries to the latest possible
version, while still compatible with Tailwind 3.
- Cleans up obsolete Tailwind 3 specific options and configs.
- Cleans up unused CSS files and fixes the CSS imports.
- Migrates all `important` uses in `@apply` lines to using the `!`
prefix.
- Move `typography.css` to the `config` package and import it from the
apps.
- Migrated all occurrences of `flex-grow`, `flex-shrink`,
`overflow-clip` and `overflow-ellipsis` since they're deprecated and
will be removed in Tailwind 4.
- Make the default theme object typesafe in the `ui` package.
- Migrate all `bg-opacity`, `border-opacity`, `ring-opacity` and
`divider-opacity` to the new format where they're declared as part of
the property color.
- Bump and unify all imports of `postcss` dependency.
 2026-04-28 11:33:53 +02:00
Gildas Garcia 049909632e fix: remove unused import (#45281) 
#45232 reintroduced an unused variable

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

## Summary by CodeRabbit

* **Chores**
* Cleaned up unused code dependencies to improve code quality and
maintainability.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
 2026-04-27 16:20:19 +02:00
Gildas Garcia bc3dc73240 chore: migrate old <Select /> usage to the new Shadcn component (#45232) 
## Problem

We want to reduce the code we ship and maintain.

## Solution

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

## Screenshots

### `www` Pricing 

Before:
<img width="637" height="697" alt="image"
src="https://github.com/user-attachments/assets/b6f261de-e587-411b-9408-faf94d709f1c"
/>

After:
<img width="644" height="756" alt="image"
src="https://github.com/user-attachments/assets/8cc4894c-64da-4e6a-960c-77cd162ac71d"
/>

### Observability

Before:
<img width="1015" height="452" alt="image"
src="https://github.com/user-attachments/assets/3d7e8613-e7a6-461d-a50d-e66c7c85fef1"
/>

After:
<img width="833" height="467" alt="image"
src="https://github.com/user-attachments/assets/98ace34f-25ec-48b5-aad3-fe812307b01d"
/>

### Docs Realtime

Used in pages:
- https://supabase.com/docs/guides/realtime/postgres-changes
- https://supabase.com/docs/guides/realtime/benchmarks

Before:
<img width="578" height="437" alt="image"
src="https://github.com/user-attachments/assets/22fa0048-be07-42e0-9153-65171fa3ccb9"
/>

After:
<img width="571" height="423" alt="image"
src="https://github.com/user-attachments/assets/e0adbde9-0c6f-48da-b377-516392185fb0"
/>

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

* **Refactor**
* Updated dropdown/select controls across the app to a consistent,
composable implementation
* Replaced advanced JWT generator in docs with a simplified JWT
generator component

* **Chores**
  * Removed legacy select component, associated styles and exports
  * Updated theme and tests to align with the new select implementation
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
 2026-04-27 15:35:50 +02:00
Joshen Lim 7f5865872a Enforce noUnusedLocals and noUnusedParameters in tsconfig.json + fix all related issues (#45264) 
## Context

Enforce `noUnusedLocals` and `noUnusedParameters` in tsconfig.json + fix
all related issues
 2026-04-27 17:42:34 +08:00
Gildas Garcia 0facd341a6 chore: remove UI form components _Shadcn_ suffix (#45212) 
## Problem

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

## Solution

- Remove the suffix
- Update all usages
 2026-04-24 12:14:15 +02:00
Gildas Garcia c3119ea1ea chore: types cleanup for react 19 (#44941) 
## Problem

While trying to update `react` to version `19`, I noticed type related
errors that can be fixed in version `18`, mostly usage of `JSX.Element`
instead of `ReactNode`.

## Solution

- Use `ReactNode` instead of `JSX.Element`
- Fix some invalid usage of `rechart`

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

## Summary by CodeRabbit

## Release Notes

* **Refactor**
* Standardized React component type annotations across the codebase for
improved type consistency and flexibility.
* Updated component prop types to accept a broader range of renderable
content.

* **Bug Fixes**
  * Adjusted chart layout positioning to improve visual alignment.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
 2026-04-16 15:31:04 +02:00