mirror of
https://github.com/supabase/supabase.git
synced 2026-10-06 18:05:11 +03:00
codex/fix-tanstack-e2e
277
Commits
| Author | SHA1 | Message | Date | |
|---|---|---|---|---|
 Saxon FletcherandClaude Opus 5
|
9b12165400 |
feat(studio): multi-select logs with click, shift, and keyboard ranges (#50689)
<img width="1454" height="786" alt="image" src="https://github.com/user-attachments/assets/995790b1-a242-4a61-a0a0-349de7234923" /> Stack 4/4 · previous: #50688 ## Problem Selecting several logs to copy or send to the Assistant meant using a separate checkbox column and a banner above the table. Clicking a row and checking a row were two different selections. ## Solution - Unified Logs uses `useTableRowSelection`, so a row click, Cmd/Ctrl-click, Shift-click, and the checkbox all act on one selection. The selection resets when the project or filters change, and a linked `?id=` still restores its log. - The level indicator and checkbox now share one column. The checkbox shows on hover, focus, or when the row is selected. - The detail panel shows every selected log: one log gets the tabs, and two or more show their combined JSON. Copy-as-JSON and "Explain with AI" move into the panel header (`LogSelectionActions`), replacing `RowSelectionHeader`. - New Shift+↑ / Shift+↓ shortcuts extend the selection, with a hint in the panel footer. Prev/next navigation follows display order and keeps the row in view. - `LogTypeIcon` no longer puts a nested button inside clickable rows. ## Review instructions 1. Click a log, then Shift-click another. The range should be selected and the panel should show the combined JSON. 2. Cmd-click to add or remove single logs. Use the copy button (or its shortcut) and "Explain with AI". 3. With the panel open, press Shift+↑ / Shift+↓ to grow and shrink the selection. 4. Change a filter. The selection should clear. ## Checklist - [ ] I have read [CONTRIBUTING.md](https://github.com/supabase/supabase/blob/master/CONTRIBUTING.md) <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit ## Summary * **New Features** * Added multi-row selection in Unified Logs, including additive, range, checkbox, and keyboard selection. * Added bulk JSON viewing and copying, plus AI-assisted actions for selected logs. * Added Shift+Arrow shortcuts to extend selections and improved row navigation. * **Accessibility** * Improved labels and focus behavior for log controls and log type indicators. * **Bug Fixes** * Kept single-log Overview and Raw JSON views available alongside multi-log selection. * Applied metadata visibility settings to selected-log actions and disabled actions for invalid log data. <!-- end of auto-generated comment: release notes by coderabbit.ai --> --------- Co-authored-by: Claude Opus 5 <noreply@anthropic.com> |
||
|
Alaister YoungandAlaister Young
|
89ae80073d |
[FE-4400] feat(studio): shift-click range selection in Unified Logs (#50462)
Shift-clicking a row checkbox in Unified Logs now selects every row between the last clicked row and the clicked one, following up on #50381. Per review, the legacy logs table now uses react-data-grid's native shift-click selection (the same mechanism as the table editor) instead of the custom anchor logic from #50381, and Unified Logs matches the grid's semantics. **Semantics (all three tables):** a shift-click applies the clicked checkbox's new state to every row between the last clicked row and the clicked one. The last clicked row itself is untouched. In Unified Logs a shift-click after the selection has been cleared is a plain toggle. **Changed:** - `LogTable` passes `selectedRows`, `onSelectedRowsChange`, and `rowKeyGetter` to the grid and renders the checkbox through a small `LogSelectCell` component using `useRowSelection`. The custom anchor ref, its resets, and the inline toggle are gone. Checking a row still closes the single-row side panel. - `getShiftClickSelection` moved from the Logs utils to `apps/studio/lib/shift-click-selection.ts` and rewritten to the grid's rule. Only Unified Logs uses it now, via a `getShiftClickRowSelection` adapter for TanStack Table's `RowSelectionState`. Tests cover both. - Unified Logs owns a selection anchor ref and passes it into the column generator. The checkbox cell handles `onClick` with the shift key, computes the range over the table's displayed row model (so it spans sort order and infinite-scrolled pages), and writes back through the table's own selection setter. Shift mousedown is prevented so no text selection spans rows. - The `LogTable` test mock of react-data-grid now implements the grid's row selection so the component tests exercise the native path. ## To test - Postgres logs: click one checkbox, then shift-click a checkbox further down. Every row in between should be checked and the action bar shows the count. Repeat upward. - Shift-click an already-checked row: it and the rows back to the last clicked row uncheck, the last clicked row stays as it was. - Checking a box closes the single-row side panel. Clicking a row body clears the selection and opens the panel. - Tab to a checkbox and press Space: it still toggles. Arrow keys plus Shift+Space still toggle the focused row. - Unified Logs: same shift-click behavior. Clear the selection or change a filter, then shift-click: only that one row toggles. Scroll to load more rows and shift-click across the boundary. - Copy as JSON/Markdown and Explain with AI still use the selected rows in both tables. <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit - **New Features** - Improved row selection in Settings Logs and Unified Logs. - Shift-click now selects or deselects the range between the anchor row and clicked row. - Clicking an already selected row clears the relevant selection while preserving the anchor row. - Added more consistent checkbox, keyboard, and range-selection behavior across log tables. - Selecting a checkbox no longer opens the corresponding log, while clicking the row continues to open it. <!-- end of auto-generated comment: release notes by coderabbit.ai --> --------- Co-authored-by: Alaister Young <10985857+alaister@users.noreply.github.com> |
||
|
Jordi Enric
|
881c124301 |
fix(studio): prevent API Gateway report tab crash (#50847)
## Problem The API Gateway report initializes its request range with the Logs Explorer helper, which leaves `iso_timestamp_end` empty. When an OTEL chart returns sparse microsecond timestamps, the time series filler can interpret them as milliseconds while deriving the end of the range and attempt an unbounded fill, freezing or crashing the browser tab. ## Fix Initialize the report with its date range helper so both request bounds are present. Normalize microsecond timestamps before deriving fill bounds, including the single point case. Add regression tests for sparse OTEL data with both empty and explicit end dates. ## How to test - Open Observability → API Gateway on a project with requests spanning two hourly buckets. The page should render without a tab crash, and the analytics requests should include a nonempty `iso_timestamp_end`. - Run `pnpm --filter studio exec vitest run tests/features/logs/Logs.utils.test.ts` and confirm the microsecond timestamp cases pass. - Run the Studio typecheck and lint checks. The Vitest, typecheck, and lint commands could not run in this worktree because Studio dependencies are not installed. The source diff passed `git diff --check` and received a focused code review. |
||
|
Danny White
|
d067e81a69 |
fix(ui): align primary colours across text, buttons, and controls (#50697)
## Problem Primary colour serves readable text and selected controls, but those uses need different shades. Light mode needs darker text, while dark mode needs a deeper button fill. Fixed brand green on interactive chrome also prevents a custom primary hue from carrying through the interface. Some slider tracks and selected text are hard to read. ## Solution - Keep `--primary` for accessible text and small selected indicators. Use `--primary-solid` for button fills, which need a deeper shade in dark mode. - Add `--primary-bright` for focus rings, selected control chrome, chart accents, and other interactive highlights. It follows `--primary-hue`; `brand-*` stays fixed for Supabase identity. - Make slider troughs clearer and text selection translucent with theme foreground text. - Document the split in the design-system colour guide. | Before | After | | --- | --- | | <img width="980" height="244" alt="Before: light mode primary controls" src="https://github.com/user-attachments/assets/dfae325d-0dfe-4231-8bcd-3f89c4b9d793" /> | <img width="982" height="204" alt="After: light mode primary controls" src="https://github.com/user-attachments/assets/5fdcb531-a6e3-4549-8a13-9d9a5ebe6e20" /> | | <img width="610" height="120" alt="Before: slider track" src="https://github.com/user-attachments/assets/04f768e0-51e8-4d06-9b97-c52f4a34f122" /> | <img width="622" height="126" alt="After: slider track" src="https://github.com/user-attachments/assets/95127f4e-13dc-4f0f-b63c-cf5d70a28b42" /> | | <img width="652" height="512" alt="Before: dark mode controls" src="https://github.com/user-attachments/assets/3f88de66-90cc-40ee-8cf1-b5f4eb87b09a" /> | <img width="658" height="498" alt="After: dark mode controls" src="https://github.com/user-attachments/assets/906bec30-6ca1-4614-9fb3-6cf5e5feec22" /> | ## Review instructions 1. Compare light and dark mode in the [colour usage guide](https://design-system-git-dnywh-fix-bright-brand-chrome-supabase.vercel.app/design-system/docs/color-usage#primary-and-brand-colors). Check primary ink, primary-solid, primary-bright, and fixed brand swatches. 2. In Studio, open the ‘new table’ sheet in [Table Editor](https://studio-staging-git-dnywh-fix-bright-brand-chrome-supabase.vercel.app/dashboard/project/_/editor). Tab through the new table sheet's fields and toggles. Check the focus rings, selected controls, and the sheet's edges in both themes. You do not need to save a table. 3. Select text in Studio in both themes, including a link or primary-coloured label. The selection and text should remain legible. 4. Check the [Field](https://design-system-git-dnywh-fix-bright-brand-chrome-supabase.vercel.app/design-system/docs/components/field) Price Range slider: the unused track should remain visible in both themes. The selected field card border should follow primary-bright. 5. Check the [Button](https://design-system-git-dnywh-fix-bright-brand-chrome-supabase.vercel.app/design-system/docs/components/button) and [Radio Group](https://design-system-git-dnywh-fix-bright-brand-chrome-supabase.vercel.app/design-system/docs/components/radio-group) previews. In dark mode, `primary` button fill should be deeper than primary [text](https://design-system-git-dnywh-fix-bright-brand-chrome-supabase.vercel.app/design-system/docs/color-usage#text); selected radios should remain readable. |
||
|
Saxon FletcherandJoshen Lim
|
76c4f2b739 |
feat(studio): add time range to project logs filter bar (#50685)
<img width="1079" height="566" alt="image" src="https://github.com/user-attachments/assets/b6f360e9-dfcf-4717-86db-1fc9acc4ae6a" /> ## Problem Project logs only exposed time-range selection through the sidebar. ## Solution Add a Time range property to the filter bar using the sidebar’s picker, preset labels, and date formatting. Keep it synchronized with the sidebar and timeline, including retention checks. ## Review instructions 1. Open Project Logs and select **Time range** in the filter bar. Choose a preset and confirm the sidebar and logs update. 2. Select a custom range and confirm its label matches the sidebar’s date formatting. 3. Change the range in the sidebar or timeline and confirm the filter bar updates. Remove the time-range pill and confirm the range resets without removing other filters. 4. Select a range beyond the plan’s log retention and confirm the upgrade prompt appears. Validation: 67 focused tests passed, Studio typecheck passed, and changed Studio files passed lint. ## Checklist - [x] I have read [CONTRIBUTING.md](https://github.com/supabase/supabase/blob/master/CONTRIBUTING.md) - [ ] Docs authoring skills (not applicable: no docs-site topic changes) <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **New Features** * Added human-readable filter value labels while preserving the underlying selections. * Added dedicated log time-range filters with preset and custom ranges. * Added inline date-range picker support for flexible layouts. * Added controls to show or hide filter properties based on availability. * Added consistent date-range formatting and custom range support. * **Bug Fixes** * Invalid or incomplete time-range filters are no longer applied. * Time-range filters remain separate from standard column filters. * Clipboard interactions are limited to the popover date-picker variant. <!-- end of auto-generated comment: release notes by coderabbit.ai --> --------- Co-authored-by: Joshen Lim <joshenlimek@gmail.com> |
||
|
Danny White
|
ec53175b8a |
refactor(ui): rename text-brand to text-primary (#50564)
## What kind of change does this PR introduce? Refactor. Follow-up to #49871. ## What is the current behavior? Branded (green) text still uses the `text-brand` classname while the colour comes from `--primary`. ## What is the new behavior? **Rename-only:** `text-brand` → `text-primary` across callsites and docs. Leftover `bg-brand` / `border-brand` alias to `brand-default`. No intentional colour changes in this PR. This better matches how we treat our green in other components and props, like `variant="primary"` for green buttons. ## To test On light mode: smoke-test that branded text still looks like #49871 (readable green, not the bright fill). - [Homepage](https://zone-www-dot-com-git-dnywh-depr-316-text-brand-de2380-supabase.vercel.app/): “Scale to millions” uses `text-primary` - [Docs homepage](https://docs-git-dnywh-depr-316-text-brand-to-primary-supabase.vercel.app/docs): branded links like “More on self-hosting” are still readable - [Typography docs](https://design-system-git-dnywh-depr-316-text-brand-to-primary-supabase.vercel.app/design-system/docs/typography): documents `text-primary` - [Colour usage](https://design-system-git-dnywh-depr-316-text-brand-to-primary-supabase.vercel.app/design-system/docs/color-usage): `text-primary` is visibly darker than `bg-brand-default` _on light mode_ - [Studio auth providers](https://studio-staging-git-dnywh-depr-316-text-brand-to-60fa6c-supabase.vercel.app/dashboard/project/_/auth/providers): enabled provider badge text readable; status dot stays bright green <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Style** * Updated branded text, link hover states, icons, badges, indicators, and highlighted content across the Design System, Docs, Studio, Learn, UI Library, and marketing experiences to use the primary theme color. * Updated syntax highlighting and table-of-contents styling for consistent primary-color presentation. * Refined brand color fallback behavior for bright fills and borders. * **Documentation** * Updated color-usage and typography guidance to recommend the primary text utility. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
Danny WhiteandJoshen Lim
|
a31ca2bad0 |
fix(ui): make brand text readable across themes (#49871)
## What kind of change does this PR introduce? Bug fix and design-system update. Resolves DEPR-316. Follow-up rename (`text-brand` → `text-primary`) is in a dedicated PR (https://github.com/supabase/supabase/pull/50564) stacked on this one. ## What is the current behavior? `text-brand` resolves to the canonical bright brand green in places that need readable text, which fails WCAG AA on light surfaces. A separate `text-brand-display` token adds another green for large type. ## What is the new behavior? - `text-brand` maps to accessible `--primary` (light mode darkened to meet ~4.5:1 AA) - `--hue` / `--primary-hue` aligned to 157.5 - `text-brand-display` removed; former display callsites use `text-brand` - Bright fills/borders stay on `brand-default` - Design-system colour and typography docs updated | Before | After | | --- | --- | | <img width="514" height="112" alt="CleanShot 2026-09-02 at 11 13 09@2x" src="https://github.com/user-attachments/assets/4e0138a9-a32d-4e4c-a426-90736706e1e7" /> | <img width="512" height="138" alt="CleanShot 2026-09-21 at 11 42 05@2x" src="https://github.com/user-attachments/assets/164cc5b1-a0c5-4e93-95f1-80016641a114" /> | | <img width="864" height="266" alt="CleanShot 2026-09-02 at 11 13 53@2x" src="https://github.com/user-attachments/assets/3c1ca53f-bf9e-431e-bc15-816b4a275b8e" /> | <img width="882" height="248" alt="CleanShot 2026-09-21 at 11 41 37@2x" src="https://github.com/user-attachments/assets/24828e7b-ed6b-44cb-b9dc-becc3398bdfc" /> | | <img width="782" height="692" alt="CleanShot 2026-09-02 at 11 16 30@2x" src="https://github.com/user-attachments/assets/fc871977-77bc-47fb-9e0e-9284e0ecd5cc" /> | <img width="730" height="690" alt="CleanShot 2026-09-21 at 11 42 52@2x" src="https://github.com/user-attachments/assets/bf479515-d5f9-471e-b82d-f097c0f4b56c" /> | | <img width="480" height="306" alt="CleanShot 2026-09-02 at 11 18 53@2x" src="https://github.com/user-attachments/assets/03f341f4-f02e-44f8-a2b2-8c31670d0427" /> | <img width="470" height="300" alt="CleanShot 2026-09-21 at 11 43 19@2x" src="https://github.com/user-attachments/assets/9df18217-d5e6-48b8-ba0b-579d2664b94b" /> | | <img width="960" height="300" alt="CleanShot 2026-09-02 at 11 32 04@2x" src="https://github.com/user-attachments/assets/6b1d9373-7a71-4247-81ff-26441604b09d" /> | <img width="980" height="306" alt="CleanShot 2026-09-21 at 11 44 13@2x" src="https://github.com/user-attachments/assets/41ad4784-02ec-4b29-b860-32af9fa79aa8" /> | | <img width="924" height="214" alt="CleanShot 2026-09-02 at 11 34 44@2x" src="https://github.com/user-attachments/assets/1de661fe-c7b6-499b-a94f-e4737436ec79" /> | <img width="752" height="162" alt="CleanShot 2026-09-21 at 11 44 56@2x" src="https://github.com/user-attachments/assets/1811890f-0660-4445-84e9-447720954fa1" /> | ## To test Test each callsite **in light mode** (dark mode is largely unchanged). ### WWW - [Homepage](https://zone-www-dot-com-git-dnywh-depr-316-brand-text-tokens-supabase.vercel.app/): “Scale to millions” uses readable brand text (display token is gone) - [Careers](https://zone-www-dot-com-git-dnywh-depr-316-brand-text-tokens-supabase.vercel.app/careers): small “Careers” eyebrow readable; green dividers stay bright `brand-default` - [Contact](https://zone-www-dot-com-git-dnywh-depr-316-brand-text-tokens-supabase.vercel.app/contact-us): email / policy links use readable brand text - [Regions](https://zone-www-dot-com-git-dnywh-depr-316-brand-text-tokens-supabase.vercel.app/regions): “Ask about early access to BYOC” readable ### Docs - [Docs homepage](https://docs-git-dnywh-depr-316-brand-text-tokens-supabase.vercel.app/docs): “DOCS” wordmark and resource links readable - [Database overview](https://docs-git-dnywh-depr-316-brand-text-tokens-supabase.vercel.app/docs/guides/database/overview): nav / footer brand links readable - [JavaScript reference](https://docs-git-dnywh-depr-316-brand-text-tokens-supabase.vercel.app/docs/reference/javascript/introduction): active sidebar treatment readable ### Design system - [Typography](https://design-system-git-dnywh-depr-316-brand-text-tokens-supabase.vercel.app/docs/typography): documents `text-brand` only (no display) - [Colour usage](https://design-system-git-dnywh-depr-316-brand-text-tokens-supabase.vercel.app/docs/color-usage): `text-brand` vs `bg-brand-default` - [Design-system homepage](https://design-system-git-dnywh-depr-316-brand-text-tokens-supabase.vercel.app/): brand text examples across themes ### Studio - [Auth providers](https://studio-staging-git-dnywh-depr-316-brand-text-tokens-supabase.vercel.app/dashboard/project/_/auth/providers): enabled provider badge text readable; status dot stays bright - [Database policies](https://studio-staging-git-dnywh-depr-316-brand-text-tokens-supabase.vercel.app/dashboard/project/_/database/policies?new=true): template hover text more legible - [Database connections](https://studio-staging-git-dnywh-depr-316-brand-text-tokens-supabase.vercel.app/dashboard/project/_/observability/connections): “Live” status readable; animated dot stays bright green --------- Co-authored-by: Joshen Lim <joshenlimek@gmail.com> |
||
|
Ali WaseemandJoshen Lim
|
d72a29852c |
fix(studio): reject custom log time ranges outside the Date range (#50539)
Typing a 9-digit amount into the logs date picker's custom field built a "Last N days" helper that subtracted past the representable `Date` range, so `toISOString()` threw `RangeError: Invalid time value` while rendering the helper list — crashing both Unified Logs and Logs Explorer. `parseCustomInput` now rejects those amounts, so oversized input behaves like any other invalid input (empty helper list) instead of producing a helper that throws. Fixes FE-4426 <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit - **Bug Fixes** - Logs date filters now reject excessively large day values outside the supported date range. - Invalid date inputs no longer generate unusable date filter options. - The date picker now displays guidance when an invalid custom format produces no matching options. - **Tests** - Added coverage for out-of-range values and confirmed valid large date ranges continue to work correctly. <!-- end of auto-generated comment: release notes by coderabbit.ai --> --------- Co-authored-by: Joshen Lim <joshenlimek@gmail.com> |
||
|
Joshen Lim
|
cdbe2963fa |
Add DownloadResultsButton to explorer query editor (#50563)
## Context Adds the `DownloadResultsButton` component to the footer of the explorer's query editor - will show up in notebook + query tab <img width="1147" height="907" alt="image" src="https://github.com/user-attachments/assets/141278a8-1e00-424e-84ec-8ddb7cf0a96b" /> <img width="1152" height="913" alt="image" src="https://github.com/user-attachments/assets/0e4a48b0-ebc3-473e-8bc0-19ab633e1904" /> <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit - **New Features** - Added a results footer displaying row counts and optional row limits. - Added download and export actions when query results are available. - Standardized the results footer across query and notebook previews. - Added keyboard shortcut hints to export options when shortcuts are enabled. - **Improvements** - Export actions now support read-only result sets without changing displayed output. - Export menu sizing and shortcut labels adapt to the enabled shortcut configuration. - Improved accessibility with a label for refreshing logs. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
Alaister YoungandAlaister Young
|
240bfce7f6 |
[FE-4198] feat(studio): select a range of logs with shift-click (#50381)
Shift-clicking a log row checkbox now selects every row between the last clicked row and the clicked one, so you can grab a consecutive block of logs to copy without checking each one. Applies everywhere the shared `LogTable` renders: Postgres/API/Auth/Edge Functions logs and the Logs Explorer. **Added:** - `getShiftClickSelection` in `Logs.utils.ts`: pure helper that computes the next selection from the ordered row keys, the current selection, the anchor row, and the clicked row. Adds the inclusive range in either direction. If the whole range is already selected it deselects the range instead. Falls back to a plain toggle when there's no usable anchor. Covered by unit tests, plus `LogTable` component tests for range select, the no-anchor fallback, anchor clearing, and range deselect. **Changed:** - `LogTable` tracks the last toggled row as the range anchor (a ref, since it's only read in handlers). The anchor is set by plain clicks, shift-clicks, and the Shift+Space row toggle, and cleared whenever the selection becomes empty (toggling off the last row, plain row click, Escape, action bar clear, select-all then deselect-all, or a new query loading). - The checkbox cell handles `onClick` instead of `onCheckedChange` so the shift key is available. Keyboard Space on a focused checkbox still toggles it, since Radix dispatches a click for it. - A shift mousedown on the checkbox cell is prevented so the browser doesn't start a text selection across rows. Unified Logs has its own row selection (TanStack Table) and is not changed here. ## To test - Open any log page with a decent number of rows, e.g. Postgres logs. Click one checkbox, then shift-click a checkbox several rows below. Every row in between should be checked and the action bar should show the count. Repeat upward. - Shift-click a range that's already fully selected: the range should clear, and rows outside it stay as they were. - Plain-click a row's message text (not the checkbox): side panel opens and the selection clears. A following shift-click should just toggle that one row. - Press Escape or the action bar's clear button, then shift-click: also just a single toggle. - Focus a row with the arrow keys, press Shift+Space, then shift-click a lower checkbox: the range should extend from the keyboard-toggled row. - Tab to a checkbox and press Space: it should still toggle. - After a shift-click, confirm no text is highlighted across the rows. - Copy as JSON/Markdown/CSV still copies the selected rows in display order. <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit - **New Features** - Added shift-click range selection to the logs table for selecting or deselecting consecutive rows. - Preserved single-row selection when range selection is unavailable. - Improved selection behavior when clearing selections or changing log queries, preventing stale range anchors. - **Tests** - Added coverage for forward and reverse range selection, deselection, partial selections, fallback behavior, and input immutability. <!-- end of auto-generated comment: release notes by coderabbit.ai --> --------- Co-authored-by: Alaister Young <10985857+alaister@users.noreply.github.com> |
||
|
Jordi Enric
|
24f8549e41 |
fix(studio): open edge function logs from chart clicks FE-3922 (#50364)
## Problem Clicking an invocation bar on the Edge Function overview did not preserve the selected chart segment, so the destination could not open a focused investigation window. ## Fix Forward the clicked bar timestamp and navigate to Logs or Invocations with an encoded, focused time range. Share the existing chart range calculation and add real Recharts interaction coverage. ## How to test - Open an Edge Function Overview page with invocation data. - Click a populated bar in the Total Invocations chart. - Expected result: Logs or Invocations opens with its and ite query parameters centered on the clicked bar. - Repeat with unified logs enabled and disabled to verify both destinations. <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit - **New Features** - Clicking a bar in the Edge Function invocations chart now opens the relevant logs or invocations view. - The destination is focused on a time window surrounding the selected invocation, making investigation faster. - Chart bars now provide a pointer cursor to indicate they are interactive. - **Bug Fixes** - Chart clicks without valid invocation data no longer trigger incorrect navigation. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
Danny White
|
476d4a5851 |
refactor(ui): drop redundant Button variant="default" props (#50161)
## What kind of change does this PR introduce? Mechanical cleanup on top of the Button default-variant change (#50160). ## What is the current behavior? Many callsites still pass `variant="default"` even though that is now the component default. ## What is the new behavior? Removes redundant static `variant="default"` from legacy `Button` and `ButtonTooltip` callsites. Keeps explicit defaults where they document the API: - `button-default.tsx` and `button-sizes.tsx` demos - `DocsButton`, which pins neutral styling at the wrapper boundary ## To test Studio: - [Auth → Rate Limits](https://studio-staging-2s957kwc4-supabase.vercel.app/dashboard/project/_/auth/rate-limits): dirty the form so Cancel appears; Cancel stays neutral, Save stays green - [Project Settings → API Keys](https://studio-staging-2s957kwc4-supabase.vercel.app/dashboard/project/_/settings/api-keys): `DocsButton` in the header actions stays neutral Design system: - [Design system → Button](https://design-system-git-dnywh-dc924ac1-supabase.vercel.app/design-system/docs/components/button): `button-default` / `button-sizes` still show explicit default styling; Primary (green) is restricted to the Primary section (and `asChild`) WWW: - [www → Brand assets](https://zone-www-dot-com-git-dnywh-dc924ac1-supabase.vercel.app/brand-assets): Download logo kit / Download button kit stay neutral |
||
|
Gildas GarciaandAlaister Young
|
737b8595f2 |
Update API types (#50234)
## Problem platform, v1 and v2 have been already completely migrated and introduced some changes. Some types have been renamed, some outputs and inputs updated. ## Solution - Update the API types - Fix the TS errors ## Update Taking this over to unblock #50134, which needs the new scoped token permission ids from the regenerated types. - Merged `master`. - Regenerated `api-v2.d.ts` from the production spec. The previous files came from a local API that exposed a webhook events endpoint production doesn't have yet. Production has since added standardized 400 error responses on the v2 organization endpoints. `api-v1.d.ts` and `platform.d.ts` already matched production. - Fixed `verify-production-types`. It formatted the regenerated files in a temp directory outside the repository, so Prettier fell back to its defaults and the comparison could never match the committed files. It now passes the repository config explicitly. `pnpm api:verify-types` passes on this branch. - Verified locally: `pnpm typecheck`, `pnpm api:verify-types`, Studio unit tests. <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Bug Fixes** * Preserved descriptions when saving, sharing, moving, or unsharing notebooks, reports, SQL snippets, and saved queries. * Improved handling of empty or null values across notebook descriptions, billing usage, pooler settings, and infrastructure fields. * Improved read-replica connection handling, including read-only connection strings. * Updated storage configuration and capability handling to match current settings. * **API and Compatibility** * Updated organization, project, storage, OAuth, billing, and infrastructure data handling to match current API responses. * OAuth app creation and updates now require scopes. <!-- end of auto-generated comment: release notes by coderabbit.ai --> --------- Co-authored-by: Alaister Young <10985857+alaister@users.noreply.github.com> |
||
|
Francesco Sansalvadore
|
0bf22ee6fc |
chore(studio): update product naming (#50208)
workers -> compute <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit - **New Features** - Added the Compute experience for deploying, viewing, managing, and monitoring compute instances. - Added Compute navigation, instance detail pages, secrets, logs, deployment dialogs, generated snippets, and CLI commands. - Added filtering, status, availability, and data-loading support for compute instances. - **Updates** - Updated labels, icons, links, feature controls, unified logs, and secret-deletion messaging to use Compute terminology. - Compute routes now replace the previous Workers routes and pages. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
Danny White
|
1131e3e2ce |
fix(ui): default Button variant to default instead of primary (#50160)
## What kind of change does this PR introduce? Bug fix / design-system alignment for the legacy `Button` from `ui`. ## What is the current behavior? Omitting `variant` on the legacy `Button` falls back to brand-green `primary`. That makes accidental greens easy, and it is hard to spot the real main action on busy pages. ## What is the new behavior? - Legacy `Button` now defaults to neutral `default` - Intentional primary CTAs (create, save, submit, marketing CTAs, and matching `ButtonTooltip` usages) now set `variant="primary"` so their appearance is unchanged - Neutral actions that previously relied on the old fallback (cancel, close, back, dashboard nav, and similar) become grey/white - Design-system docs updated; regression tests cover the new default `Button_Shadcn_` is unchanged. It already uses its own CVA default. This is PR 1 of 2 in a stack. PR 2 drops now-redundant `variant="default"` props. ## To test Studio (http://localhost:8082): - `/sign-in`: Sign in stays green - Open a project → Database → Tables: New table stays green - Auth → Users → Invite: Invite user stays green; Cancel / dismiss controls stay neutral - Project Settings → General: edit a field so Cancel and Save appear. Cancel is neutral, Save is green Design system (http://localhost:3003): - Components → Button: default demo is neutral; primary demo is green; featured preview is the default variant Marketing (optional): - www header: Start your project stays green; logged-in Dashboard is neutral <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit - **Style** - Buttons now default to a neutral style, while primary actions across Studio, documentation, marketing pages, forms, dialogs, and error states use prominent primary styling. - Updated button examples and previews clarify the distinction between default and primary variants. - Event registration now includes a directional arrow icon. - **Tests** - Added coverage confirming default button styling and explicit primary styling behave as expected. - Updated related test fixtures to use primary styling where appropriate. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
Ivan Vasilov
|
02cf09212e |
chore: Remove tsconfig paths (#49770)
This PR removes all `paths` in `tsconfig.json` for all apps and packages. They were added previosly because some of the components had a `_Shadcn` suffix because of an ongoing migration. How that the migration is done, the paths can be removed. <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Refactor** * Standardized shared UI component, utility, and icon imports across design-system examples and application screens. * Simplified shared component access and project configuration. * Added shared access to anchor-link helpers and animation styles. * **Compatibility** * Updated component exports and imports without changing existing behavior. * No changes to user-facing workflows, screens, or functionality. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
Jordi Enric
|
5fd2023708 |
feat(studio): worker detail page (FE-4189, FE-4197) (#49195)
## What
The worker detail page at `/project/[ref]/workers/[name]`, reading `GET
/v2/projects/{ref}/workers/{name}`. Base: #49194.
## How to test
Only on the **Mockamaster** project in staging — it is the one project
in the alpha allow-list.
1. Staging dashboard → Mockamaster → **Workers** → click
`dashboard-test`
2. Overview: instances read 1 declared / 1 live / 1 ready / 0 stale, no
error alerts
3. Settings: Deno 2, `denoland/deno:latest`, 2 GB · 1 vCPU, private, US
West (locked)
4. **How to call** in the header → the snippets name the real worker URL
No write actions. Delete (FE-4190) is deliberately out.
Closes FE-4189
Closes FE-4197
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* Added worker detail pages with overview, requests, logs, builds, and
settings tabs.
* Added worker metadata, runtime details, invocation examples, and local
development commands.
* Added worker log streams with refresh, row selection, loading, empty,
and error states.
* Added worker-specific log formatting and clearer instance status
information.
* **Documentation**
* Updated migration tracking to mark the worker route as complete.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
|
||
|
Joshen LimandAli Waseem
|
ce2ed77c02 |
Add clickhouse migration banner to QueryEditor (#49184)
## Context Adds the clickhouse migration banner into the QueryEditor for explorer if the source selected is logs - will apply for both the notebook query cells and query tab JFYI i've omitted out the diffing view for now, like what've currently got for the SQL Editor Got a separate ticket to look into that, but was thinking of waiting for [this PR](https://github.com/supabase/supabase/pull/49112) from Charis to go in first <img width="1391" height="369" alt="image" src="https://github.com/user-attachments/assets/5880df99-44b5-4a9f-8ff7-c9d7af3bcb93" /> <img width="1054" height="474" alt="image" src="https://github.com/user-attachments/assets/ef5d225b-3b53-4d6d-ab6c-19804e3358e6" /> <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **New Features** * Added guidance in SQL editors to identify and rewrite legacy logs queries. * Integrated rewrite suggestions into the query editor’s existing SQL diff workflow. * Increased the height of embedded query editors for improved usability. * Kept rewrite guidance available when no rewrite is needed or an attempt is unsuccessful. * **Bug Fixes** * Improved spacing for empty query-result messages. * **Tests** * Added coverage for rewrite visibility, acceptance, dismissal, and no-change outcomes. <!-- end of auto-generated comment: release notes by coderabbit.ai --> --------- Co-authored-by: Ali Waseem <waseema393@gmail.com> |
||
|
Charis
|
5986fecc89 |
fix(studio): use table + card component in log retention upgrade prompt (#48713)
## Summary - Refactor the SQL Editor / Logs "Log retention" upgrade-prompt dialog to use the design system's `Card` + `Table` components instead of a custom flexbox-div table, matching the pattern in `apps/design-system/registry/default/example/table-demo.tsx` - No behavior or data change Fixes FE-4034 Non-blocking review nit from #48452 (comment: https://github.com/supabase/supabase/pull/48452#issuecomment-5128918096) ## Test plan - [x] `pnpm --filter studio typecheck` passes - [x] `pnpm --filter studio run lint:ratchet` passes (no new warnings) - [x] Prettier check passes <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Style** * Updated the upgrade prompt with a more consistent card and table layout. * Preserved existing plan names and log retention details. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
Charis
|
8b38e0d1ed |
feat(studio): ClickHouse dialect for logs snippet AI + rewrite to ClickHouse (#48501)
## 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, plus a refactor of the shared logs-rewrite flow. PR 8 of the SQL editor query-source series. Stacked on #48457 — review that one first, and merge this after it. ## What is the current behavior? A `log_sql` snippet runs against the ClickHouse-backed analytics endpoint, but the SQL editor's AI still writes Postgres: inline edits get Postgres system prompts, and the result is run through `sql-formatter`, which mangles ClickHouse backticks and `log_attributes` map lookups. Legacy Logs Explorer saved queries open in the editor as `log_sql` snippets. Those are BigQuery dialect and error against the ClickHouse endpoint the editor runs them on, with no in-editor way out — only the Logs Explorer offered a rewrite. The completion route was also asymmetric. It assembled a schema/code/instruction message for Postgres but forwarded `prompt` verbatim for ClickHouse, so a client wanting ClickHouse had to hand-build the equivalent string. ## What is the new behavior? **Inline AI speaks ClickHouse for logs snippets.** `sqlSourceToDialect` maps a snippet's source to `postgres`/`clickhouse` and `buildCompletionRequestBody` threads it through. For ClickHouse, `useSqlEditorAi` strips code fences from the response and skips `formatSql`. Execution and dialect both follow the snippet type, so a snippet's valid dialect never flips. **Rewrite to ClickHouse in the editor.** A banner offers the rewrite for a logs snippet whose text trips `looksLikeLegacyLogsQuery`, and proposes the result through the editor's existing AI diff view rather than replacing the snippet, so it's accepted or discarded like any other AI edit. Gated on `otelLegacyLogs`: on a non-migrated org the BigQuery text is still correct, so rewriting it would break a working query. The offer is a state machine (`offered` / `rewriting` / `failed` / `noRewriteNeeded` / `dismissed`) with a declarative table of valid transitions, so the states are mutually exclusive by construction and dismissal is terminal. A failure keeps its message and offers a retry; a response identical to the input is reported rather than opening an empty diff. **One place assembles completion prompts.** The route now uses a single template for both dialects, branching only the schema section and — for `intent: 'rewrite'` — the instruction. `lib/ai/clickhouse-logs.ts` is the single home for ClickHouse-logs prompt content, replacing two independently maintained descriptions of the same table. Clients carry no prompt text. **The rewrite flow is shared with the Logs Explorer.** Both surfaces previously hand-rolled the same sequence and had drifted: only one detected a no-op rewrite, they sourced `log_attributes` keys differently, and the Explorer formatted errors with an `as Error` cast. Both now use `useLegacyLogsRewrite` and the same state-driven banner, so the Explorer picks up no-op detection and typed error extraction. **Attribute keys are fetched on submit, not while typing.** The detected source would otherwise feed a reactive query key, making every edit that changed it cost another network call. `useLogsAttributeKeys` is imperative and goes through `queryClient.fetchQuery`, so a source already cached — including by the Explorer header and query panel, which subscribe reactively — is reused. This also closes a gap where inline edits never received keys at all, unlike full rewrites. `getErrorMessage` gains an optional typed fallback and no longer stringifies a bare object into `'[object Object]'`; every existing caller already hand-rolled a fallback, except `QueueSettings`, which interpolated the raw result and now passes one. Nothing here is user-visible until the `sqlEditorLogsSource` flag is enabled. Tests: dialect selection and request-body shape, the ClickHouse prompt content (including that the schema section does not restate the dialect rules), the reducer's valid and invalid transitions, `shouldOfferLegacyLogsRewrite`, on-submit key discovery with cache reuse, and `getErrorMessage`. ## Additional context <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **New Features** * Added an Assistant banner to help rewrite legacy BigQuery-style logs queries into ClickHouse SQL. * SQL assistance now adapts to the selected query type, including relevant log attribute context. * Rewrite suggestions can be reviewed as editor diffs before being applied. * **Bug Fixes** * Improved rewrite failure handling, retry options, dismissal behavior, and “no rewrite needed” messaging. * Error notifications now provide a clearer fallback message when details are unavailable. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
hallidayo
|
6a6ebf8702 |
feat: logs sticky header (#44020)
## 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? [Supabase Studio > Logs](<https://supabase.com/dashboard/project/_/logs/edge-logs>) ## What is the current behavior? When you click on an log row and you scroll the header disappears so you can not close the log straight away you have to scroll back up. ## What is the new behavior? https://github.com/user-attachments/assets/8cac74d8-e3ce-429c-a9ca-393779d1efd9 ## Additional context ## Summary by CodeRabbit * **UI Improvements** * The log selection tabs now stay visible while scrolling, with a fixed header style, better layering, and a solid background for improved readability. |
||
|
Charis
|
d5436ae826 |
feat(studio): log date range domain + session logRange state (#48401)
## 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 small refactor and a docs/convention note). PR 4 of the stacked SQL-editor query-source series (Database vs Logs). ## What is the current behavior? The SQL editor has no representation of a logs query's time range: `querySource.ts` only knows how to map a snippet type to a source (`getSnippetSource`), and session state (`sql-editor-session-state.ts`) tracks results and the row limit but not a per-snippet time range. The Logs date picker's pure range helpers (`parseCustomInput`, `generateDynamicHelper`, the `Unit` type) are trapped inside the `Logs.DatePickers.tsx` React component. ## What is the new behavior? - **Logs time-range domain** in `querySource.ts`: branded `IsoDateTimeString` + `isoDateTimeString()`, `RelativeTimeUnit`, a `LogDateRange` discriminated union (relative/absolute), `DEFAULT_LOG_DATE_RANGE`, a single date-picker parser (`datePickerValueToLogDateRange` / `logDateRangeToDatePickerValue` — handles the five presets *and* dynamic `2h`/`30m` helpers; `calcTo === ''` means "now"; unparseable helpers degrade to absolute), and `resolveLogRunRange` which re-resolves relative ranges against `now` at run time (reusing the existing `ResolvedLogDateRange` shape). - **Session state**: per-snippet `logRange` + `setLogRange` — session-only, never written to snippet content, so it works on read-only shared snippets and is cleaned up in `clearForSnippet`. - **Refactor**: extracted the picker's framework-free helpers into a new pure `Logs.datePickerHelpers.ts`; the logs domain now shares the `Unit` type and reuses `generateDynamicHelper` instead of duplicating them. Importers point at the new module directly (no re-export shim). Hardened the amount parse against `NaN`. - **Full unit coverage** in `querySource.test.ts`. Recorded the no-shim refactoring convention in the `studio-best-practices` skill. Verification: `pnpm typecheck` clean, lint ratchet improved, 43 tests pass (querySource + Logs.Datepickers), Prettier clean. ## Additional context <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit - **New Features** - Added robust Logs date-range modeling with support for relative (e.g., last N units) and absolute time periods. - SQL Editor sessions now remember log date ranges per snippet. - **Bug Fixes** - Safer handling of invalid or missing date inputs, with sensible fallback to default/current time. - **Tests** - Added/expanded automated coverage for date-range conversion, helper parsing, and resolution behavior. - **Refactor** - Centralized date-picker helper utilities for reuse across the Logs and SQL query experience. <!-- 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
|
7743fee3ab |
feat(studio): log_sql content shape + remap content.sql to unchecked_sql (#48305)
## What PR **2 of 9** in the SQL-editor query-source (Database vs Logs) stack. **Base:** `charislam/snippet-source-typing` (#48301) — this is a stacked PR; review/merge that one first. Client-side rename only — **the wire format is unchanged** (the platform API still stores and returns `content.sql`). This moves the frontend `LogSqlSnippets.Content` field to the branded `unchecked_sql`, matching `SqlSnippets.Content`, and hardens the remap boundary so the rename can't silently drop saved query text. ## Changes - **`types/userContent.ts`** — `LogSqlSnippets.Content`'s plain `sql: string` becomes `unchecked_sql: UntrustedLogSqlFragment` (the brand added in PR 1). Shape kept minimal: `{ content_id, unchecked_sql, schema_version }`. - **`data/content/content-remap.ts`** — extend `remapSqlContentField`/`unmapSqlContentField` to `log_sql`, branding **per type** (`untrustedLogSql` for logs, `untrustedSql` for database) and never mixing brands. **Defensive unmap**: content missing `unchecked_sql` is never clobbered with `sql: undefined`; a residual raw `sql` field (a missed save-path rename) throws in development to surface the bug loudly, while production no-ops safely. - **Legacy Logs Explorer consumers** updated to the branded field: the explorer save/update paths, `SavedQueriesItem`, `RecentQueriesItem`, and the recent-queries page. - **Two db-only write sites** that leaned on `LogSqlSnippets.Content.sql`: `EditorPanel` now saves `unchecked_sql`, and `MoveQueryModal` switches to the SQL-editor-specific `getSqlSnippetById` so its content is typed as `SqlSnippets.Content` — no narrowing or casting. ## Tests - **content-remap**: `log_sql` remap/unmap round-trip with the logs brand; the defensive-unmap no-op (prod) and dev throw. - **content-upsert-mutation**: a `log_sql` payload reaches the wire as a plain `content.sql` and the response remaps back to `unchecked_sql` (the data-loss-critical round-trip shared by both explorer save-new and `SavedQueriesItem` update). ## Verification - `pnpm --filter studio run typecheck` ✓ - `pnpm --filter studio run lint:ratchet` ✓ (no new warnings) - `pnpm test:studio` for `data/content` + `Settings/Logs` — 139 passing ✓ - Prettier ✓ Nothing is user-visible yet — logs snippet entry points arrive later in the stack behind the `sqlEditorLogsSource` flag. <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit - **Bug Fixes** - Improved handling of saved and recent log queries across the SQL editor and Logs Explorer. - Log SQL now uses `unchecked_sql` (branded as untrusted) consistently when creating, editing, moving, and reopening queries, with correct remapping to/from the API boundary. - Fixed saved-query update payloads to preserve the right query content and omit legacy fields. - **Tests** - Added/expanded Vitest coverage for saved log query editing, recent-log normalization, and `log_sql` remap/upsert request/response behavior. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
Danny White
|
50e9fedb20 |
feat(studio): finesse logs date picker range colours (#48019)
## What kind of change does this PR introduce? UI polish / bug fix for the shared Calendar range selection and Logs date picker. ## What is the current behavior? - Selected date ranges use opaque `brand-400` / `brand-500` fills that read too loud in light mode, with black text that is hard to read on darker endpoints. - Start/end days are squared off on the connecting edge without intentional outer rounding. - Outside days in a selected range are dimmed with `opacity-50`, which can tint the range wash incorrectly when a range starts in the prior month. - The large-range warning in `LogsDatePicker` is a full-bleed yellow banner that feels too heavy for the popover. - Time inputs show a clock icon that adds visual noise. ## What is the new behavior? - Range middle uses a softer `brand-200` wash; start/end stay on stronger brand fills with readable foreground text. - Start days round on the left (`rounded-l-md`), end days on the right (`rounded-r-md`); day hover keeps `rounded-md`. - Selected outside days and “today” no longer fight the range wash colours. - Large-range warning is quiet inline `text-warning` copy that wraps to the calendar column width. - Clock icon removed from `TimeSplitInput`. | Before | After | | --- | --- | | <img width="1096" height="1076" alt="CleanShot 2026-07-16 at 17 59 21@2x" src="https://github.com/user-attachments/assets/eac38022-ed92-4dbe-9932-55f7bf0af934" /> | <img width="988" height="1064" alt="CleanShot 2026-07-16 at 17 59 34@2x" src="https://github.com/user-attachments/assets/3dce30dd-9fd8-4da4-82b3-5663250a4ddc" /> | ## Additional context Shared `Calendar` changes apply anywhere range mode is used, not only logs. <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit - **Style** - Refined the date-picker popover layout for start/end controls with better fit and max-width handling. - Updated calendar day and range visuals (selection, outside states, rounding, and hover behavior) to reduce “ghost” styling and improve consistency. - Restyled the large-range warning to improve spacing and alignment. - Simplified the time-splitting input UI by removing the leading clock icon. - Adjusted the “Copy range” button feedback color for copied/pasted states. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
Jordi Enric
|
9069e8d21e |
fix(reports): chart click selects bucket range, fix logs datepicker crash (#48009)
## Problem In a database report, dragging over a chart to open logs had two bugs. Clicking a bar instead of dragging produced a zero-width selection (its === ite), so the logs view showed no results. Separately, the logs datepicker crashed with "Invalid time value" because the chart put raw epoch-ms values into the its/ite URL params, which get parsed with new Date(string) and yield an Invalid Date that react-day-picker cannot format. ## Fix The chart now emits ISO timestamps in the logs URL so its/ite match the format every other logs consumer already uses, and the datepicker guards against unparseable values from any source (such as old bookmarked links). A single click now expands the highlight to the clicked bucket, from the bar's start to the next bar's start, so the selection, popover, and logs range all cover the bar the user picked. ## How to test 1. Open a database report with a chart (for example Postgres, project logs). 2. Drag across the chart, choose "Open in Postgres Logs", then open the timepicker. Expected: it opens without crashing and shows the selected range. 3. Go back and single-click one bar instead of dragging. Expected: that bar's bucket is selected and "Open in Postgres Logs" loads logs for a real, non-empty range. 4. Run the chart tests, expected all pass: pnpm --filter studio exec vitest --run components/ui/Charts <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Bug Fixes** * Prevented invalid log date inputs from creating invalid date selections. * Improved chart “open logs” links by normalizing the selected time bounds (now consistently sent as ISO timestamps). * Refined chart highlight behavior for click-to-advance and more accurate left/right range selection, supporting both numeric and string coordinate values. * Updated the chart highlight dropdown display for clearer formatting of numeric vs non-numeric dates. * **Tests** * Added Vitest coverage for chart highlight click, drag, and left/right ordering scenarios. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
Jordi Enric
|
bac4814123 |
fix(logs): color regressions from design system update (#47676)
## Summary - Fix unreadable "Large ranges may result in memory errors" warning text in the Logs date picker — a stray `text-warning-foreground` class (dark ink) was winning over `text-warning` on the dark `bg-warning-300` fill. - Fix "Search collections..." sidebar wrapper background mismatch — `bg-background-200` now resolves to the elevated `--card` surface instead of `--background`, so it no longer matches the sidebar's `bg-dash-sidebar`. - Fix the Unified Logs "Live" toggle button rendering blue text instead of white when active — a leftover `border-info text-info` override was fighting the `primary` variant's own text color, now that `--info` resolves to a more distinct blue. All three are contrast/color regressions surfaced by the recent design-system color token changes. ## Test plan - [ ] Open a project's Logs Explorer, pick a large date range, confirm the warning text is readable - [ ] Check the Logs sidebar "Search collections..." box background matches the rest of the sidebar in both light and dark mode - [ ] Toggle "Live" mode in Unified Logs and confirm the button text is white/legible on the green background <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Style** * Updated the large-range warning banner appearance in Logs settings. * Refined the Logs sidebar header background styling for a more consistent look. * Simplified the DataTable live button styling behavior by removing conditional class composition while preserving the existing live-mode visuals. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
Jordi EnricandClaude Opus 4.8
|
ceff7b99bf |
fix(logs): guard chart query against unparseable timestamp params (#47485)
## Problem The per-service logs pages (e.g. `/project/[ref]/logs/auth-logs`) crashed with `RangeError: Invalid time value` (Sentry issue 7580074952). `calcChartStart` guarded `iso_timestamp_start` only against falsy values, so a truthy-but-unparseable timestamp (a malformed value in the URL query params) produced an Invalid Date, which propagated through `.add()` and threw when `startOffset.toISOString()` was called. The bug is on the legacy (non-OTEL) chart query path. The OTEL bucket helper had the same unguarded pattern; it did not crash but could skew the chart bucket size. ## Fix Validate parsed timestamps with `dayjs().isValid()` and fall back to now, matching the existing empty-param behavior. Applied to both `calcChartStart` (legacy) and `otelChartTruncFn` (OTEL). - Valid params produce identical output (existing tests unaffected) - Empty params still fall back to now - Malformed input no longer throws Added regression tests to `Logs.utils.test.ts` and `Logs.utils.otel.test.ts`. ## How to test - Run the logs unit tests: `pnpm test:studio` (or target `Logs.utils.test.ts` and `Logs.utils.otel.test.ts`) - In the dashboard, open a service logs page with a malformed timestamp in the URL, e.g. `/project/<ref>/logs/auth-logs?its=not-a-date` - Expected result: the page renders without crashing and the chart falls back to the default (now-based) time range <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Bug Fixes** * Improved log chart time-range handling by safely resolving missing or invalid ISO timestamps via a shared timestamp resolver. * Updated chart bucketing and timestamp conflict logic to use the resolved endpoints, preventing errors and ensuring correct fallback granularity (including minute-level bucketing when needed). * **Tests** * Added regression coverage to confirm chart query generation (including OTEL queries) does not throw for unparseable start/end timestamps. * Verified fallback behavior to minute-level bucketing and non-throwing behavior for timestamp conflict handling. <!-- end of auto-generated comment: release notes by coderabbit.ai --> --------- Co-authored-by: Claude Opus 4.8 <noreply@anthropic.com> |
||
|
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 --> |
||
|
Jordi EnricandClaude Opus 4.8
|
27c1850a9a |
feat(logs): enforce a LIMIT clause in the log explorer (#47630)
## What Enforces a `LIMIT` clause on Logs Explorer queries, replacing the previous soft warning. - Queries without a `LIMIT <n>` can no longer be run. - Instead of the warning badge, the results box shows a clear "Add a LIMIT to your query" message. - The error clears as soon as a valid `LIMIT` is added. ## Why Unbounded queries can scan very large amounts of data. This adds a UI guardrail so a bounded result set is always requested. ## Notes - New `checkForLimitClause` util detects `LIMIT <n>` outside of string literals and comments (mirrors the existing WITH/ILIKE checks), with unit tests. - The missing-limit message reuses the existing error-rendering path via a `missingLimit` reason, alongside `resourcesExceeded`. 🤖 Generated with [Claude Code](https://claude.com/claude-code) <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **New Features** * Log queries now require a `LIMIT` clause before they can run. * A new on-screen message guides users to add a `LIMIT` when it’s missing. * **Bug Fixes** * Improved log query validation to better detect valid `LIMIT` usage, including mixed case, multiline queries, and avoidance of false matches in comments, strings, or column names. * Existing error messages continue to appear for other query limits and failures. <!-- end of auto-generated comment: release notes by coderabbit.ai --> --------- Co-authored-by: Claude Opus 4.8 <noreply@anthropic.com> |
||
|
Jordi Enric
|
b9f76d95f7 | feat(studio): load ClickHouse query templates when OTEL logs are on (#47390) | ||
|
Jordi EnricandClaude Opus 4.6
|
ebafe8dd05 |
fix(logs): quote numeric pipeline_id in otel etl logs filter (#47436)
## Problem
Opening replication/ETL logs via the "View logs" button on a pipeline
details view fails with "Error executing ClickHouse query" on the OTEL
logs path.
The button links to `/logs/replication-logs?f={"pipeline_id": <id>}`,
and `pipelineId` is a number (`Number(_pipelineId)` in
ReplicationPipelineStatus, typed `number` in PipelineStatus). The OTEL
ETL filter emitted that value as an unquoted numeric literal:
```sql
WHERE source = 'etl_replication_logs' AND (log_attributes['pipeline_id'] = 123)
```
`log_attributes` is a `Map(String, String)`, so comparing its string
value to a number is a type error in ClickHouse, which surfaces as the
generic "Error executing ClickHouse query".
## Fix
Coerce the value to a string in the OTEL ETL `pipeline_id` filter so it
always compares string-to-string:
```sql
WHERE source = 'etl_replication_logs' AND (log_attributes['pipeline_id'] = '123')
```
- OTEL-only change. The legacy BigQuery path (a numeric `pipeline_id`
column) is left untouched and still compares as a number.
- The existing unit test only passed a string `'42'`, which hid the bug.
Added a numeric `42` case that would emit the unquoted literal without
the fix.
## How to test
- Open a project with an ETL/replication destination, go to the pipeline
details view, and click "View logs".
- Expected result: the logs load instead of showing "Error executing
ClickHouse query".
- Run the unit tests: `pnpm test:studio` (or target
`Logs.utils.otel.test.ts`).
- Expected result: the new test "quotes a numeric etl pipeline_id so it
compares as a string" passes, asserting `log_attributes['pipeline_id'] =
'42'`.
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Bug Fixes**
* Fixed filtering for ETL logs so `pipeline_id` values are consistently
treated as text, including numeric inputs.
* Improved matching behavior when using the pipeline filter, helping
ensure results appear as expected.
* **Tests**
* Updated and expanded test coverage for pipeline ID filtering to verify
the corrected SQL output.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
---------
Co-authored-by: Claude Opus 4.6 <noreply@anthropic.com>
|
||
|
Jordi EnricandClaude Opus 4.6
|
25f1648e3a |
fix(logs): map metadata.function_id override to otel attribute key (#47434)
## Problem Individual edge function logs are broken on the OTEL logs path. The logs chart for a single function filters by the `metadata.function_id` override key passed from the function logs page. On the OTEL path this key has no filter template, so it falls through to the unknown-clause resolver and is emitted verbatim as `log_attributes['metadata.function_id']`. OTEL drops the `metadata` root, so the live attribute key is just `function_id`. The filter matched nothing and the chart came back empty. Generated before: ```sql WHERE source = 'function_logs' AND (log_attributes['metadata.function_id'] = '...') ``` ## Fix Strip a leading `metadata.` prefix in the OTEL unknown-clause resolver (`resolveUnknownOtelClause`). The same BigQuery-style override key now resolves to `log_attributes['function_id']`, matching the working invocations query. This is the documented OTEL convention (the `metadata` root is always dropped), so it also covers any other `metadata.*` override keys. Generated after: ```sql WHERE source = 'function_logs' AND (log_attributes['function_id'] = '...') ``` ## How to test - Enable the OTEL logs path and open an edge function's Logs tab for a project with recent invocations. - Confirm the logs chart renders ok/warning/error buckets instead of an empty chart. - Run the unit tests: `pnpm test:studio` (or target `Logs.utils.otel.test.ts`). - Expected result: the new test "drops the metadata root from an override key for function logs" passes, asserting the generated SQL uses `log_attributes['function_id']`. <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Bug Fixes** * Fixed OTEL filter handling so keys that include the `metadata.` prefix are translated correctly for log searches. * Filters like `metadata.function_id` now generate the expected log-attribute predicates, improving Function logs matching. * **Tests** * Added/updated inline snapshot coverage to verify SQL generation for metadata-based log filter overrides in both chart and preview queries. <!-- end of auto-generated comment: release notes by coderabbit.ai --> --------- Co-authored-by: Claude Opus 4.6 <noreply@anthropic.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 |
||
|
|
2aa1b52234 |
feat(studio): add feature to rewrite queries DEBUG-145 (#47266)
## Problem Moving the Logs Explorer to ClickHouse means users' saved BigQuery queries no longer run. <img width="2430" height="1010" alt="CleanShot 2026-06-29 at 11 36 04@2x" src="https://github.com/user-attachments/assets/ae0ab155-7d3d-4ae9-81c3-22bf3a88cf8c" /> ## Fix Rewrite the query with AI instead of a SQL transpiler. AI handles the long tail of nested fields and dialect differences far better than a rule-based rewriter, and it needs no extra runtime dependency. - `rewriteLogsSqlWithAI` posts the current query to `/api/ai/code/complete` with `dialect: 'clickhouse'`. The endpoint skips the Postgres schema and best-practices for that dialect and uses logs-specific instructions and model so the output is ClickHouse logs SQL (FROM `logs` + `source` filter, no `unnest` joins, nested fields read from `log_attributes['...']`). - The query's `source` is detected and its real `log_attributes` keys are fetched and passed to the model, so it maps to exact paths instead of guessing. - The rewrite runs in the background and is proposed as a side-by-side accept/discard diff in the editor. The AI Assistant panel is not opened. - Entry points: a banner shown only for legacy-looking queries (dismissal persisted), and a "Fix Query" button next to Field Reference. - The Field Reference drawers discover `log_attributes` keys from real data so the listed fields match what the source actually emits. ## Dependencies Built on top of #47265 (Logs Explorer -> OTEL endpoint) — that is the base branch of this PR. Merge #47265 first. Behind `otelLegacyLogs` (off by default). Part of DEBUG-145 (split from #47087). ## How to test - Open the Logs Explorer with a BigQuery logs query (the templates have some), click "Fix Query", and confirm the diff shows valid ClickHouse SQL. Accept it and confirm the applied query runs. <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **New Features** * Added an OTEL legacy logs workflow (behind a feature flag) with an interactive banner and a “Fix Query” ClickHouse rewrite action, including an accept/discard diff review overlay. * Introduced OTEL-aware field reference rendering with dynamic discovery of `log_attributes` keys and updated OTEL source insertion behavior. * Enabled dialect-aware SQL completion for ClickHouse logs, using logs-specific instructions and output constraints. * **Bug Fixes** * Improved rewrite flow validation and handling, including log source detection and cleanup of AI-generated SQL formatting. * **Tests** * Added Vitest coverage for rewrite prompt generation, detection/classification utilities, SQL fence stripping, OTEL field mapping, and OTEL log attribute key discovery. <!-- end of auto-generated comment: release notes by coderabbit.ai --> --------- Co-authored-by: Claude Opus 4.8 (1M context) <noreply@anthropic.com> Co-authored-by: Joshen Lim <joshenlimek@gmail.com> |
||
|
Joshen Lim
|
e938016141 |
Chore/minor logs explorer nudges (#47391)
## Context Just minor nits i noticed with the logs explorer ## Changes involved - Add a tooltip to the + button here - wasn't clear what this was doing <img width="306" height="90" alt="image" src="https://github.com/user-attachments/assets/8fa18544-9ed3-413f-9816-1e8e760cc0c2" /> - Clear query params when deleting a saved query that you're currently on (reset back to default state) - Saving a logs query should use the value that's in the monaco editor <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **New Features** * Added a tooltip-enhanced “New query” action in the logs sidebar to make navigation to the query explorer clearer. * **Bug Fixes** * After deleting a saved query, the logs page now clears the related URL query parameters when the deleted item is currently open. * Saving an existing query now uses the latest SQL from the editor, ensuring the stored query text is up to date. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
Jordi EnricandClaude Opus 4.8
|
d5bceb8db8 |
feat(studio): route Logs Explorer to OTEL endpoint via flag DEBUG-145 (#47265)
## Problem The Logs Explorer (SQL editor) queries the BigQuery-backed `logs.all` endpoint and exposed a manual "OTEL endpoint" toggle behind a separate flag. ## Fix - Drive the explorer endpoint purely from the `otelLegacyLogs` flag: on -> `logs.all.otel`, off -> `logs.all`. - Remove the manual toggle from `LogsQueryPanel` (and its `showChToggleInLogExplorer` gate). ## Dependencies None. Standalone, behind `otelLegacyLogs` (off by default), so no user-facing change. Part of DEBUG-145 (split from #47087). Note: PR for the deterministic BigQuery->ClickHouse rewrite + banner builds on top of this one. ## How to test - Enable `otelLegacyLogs`, open `/project/[ref]/logs/explorer`, confirm queries hit the OTEL endpoint and run. Toggle off, confirm BigQuery path unchanged. Confirm the old manual OTEL switch is gone. <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Bug Fixes** * Simplified the Logs Explorer experience by removing the OTEL endpoint toggle from query settings. * OTEL behavior now follows the configured feature flag, driving the editor’s initial placeholder/query shape. * On first load, the editor automatically switches to the OTEL placeholder only if the content is still the untouched default (not after user navigation or custom edits). <!-- end of auto-generated comment: release notes by coderabbit.ai --> --------- Co-authored-by: Claude Opus 4.8 (1M context) <noreply@anthropic.com> |
||
|
Jordi EnricandClaude Opus 4.8
|
e0ba04caf4 |
feat(studio): migrate per-service log pages to OTEL endpoint behind a flag DEBUG-145 (#47264)
## Problem The legacy per-service log pages (postgres, auth, api, edge functions, storage, realtime, cron, etc.) and the single-log detail panel query the BigQuery-backed `logs.all` analytics endpoint. We are moving these reads onto the OTEL ClickHouse endpoint (`logs.all.otel`). ## Fix - Add `Logs.utils.otel.ts`: ClickHouse query builders (rows/count/chart/single) + row mappers that target the single `logs` table keyed by `source`, reading fields from the `log_attributes` map and aliasing columns to the leaf names the renderers expect. - Parameterize `buildWhereClauses` / `genWhereStatement` in `Logs.utils.ts` so the OTEL builders reuse the shared nested AND/OR filter grouping. Defaults keep the BigQuery behavior unchanged. - Gate `useLogsPreview` (rows, count, chart) and `useSingleLog` (detail) on the new `otelLegacyLogs` flag. BigQuery stays the default when the flag is off. - Extract the OTEL timestamp parser into `parseOtelTimestamp` (`otel-inspection.utils.ts`) and reuse it in `unified-logs-infinite-query.ts` (replaces an inline copy of the same logic; no behavior change). ## Dependencies None. Standalone, safe to merge on its own. Behind `otelLegacyLogs` (off by default), so no user-facing change. Part of DEBUG-145 (split from #47087). ## How to test - In staging, go to Legacy Logs. - All logs pages should work the same as before. <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **New Features** * Added OTEL-backed logs support for preview, count, chart, and single-log details when enabled. * **Bug Fixes** * Improved timestamp parsing/normalization for OTEL data to ensure correct display and pagination. * Enhanced filtering behavior, including safer handling of unknown filter keys and invalid values across OTEL queries. * Improved single-log result shaping to preserve expected API/database metadata in OTEL mode. <!-- end of auto-generated comment: release notes by coderabbit.ai --> --------- Co-authored-by: Claude Opus 4.8 (1M context) <noreply@anthropic.com> |
||
|
Gildas Garcia
|
f34aa108d5 |
chore: dead code cleanup (#47294)
## Problem There's still more unused code in the repository which slows down everything: - checkouts - tooling - probably builds (not sure how good turbopack is at handling this) ## Solution - remove old unused code - remove more recent code after checking git history to ensure it's not unfinished/ongoing work <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Chores** * Removed several unused interface, onboarding, and helper components from the studio app. * Cleaned up outdated branching, integrations, query performance, support, and table/grid UI elements. * Removed a few unused utility hooks and key-mapping logic. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
Gildas Garcia
|
a6e79ebacb |
chore: delete Button alternative deprecated variant (#47260)
## Problem The `alternative` variant for `<Button>` has been deprecated but is still used in a few places. ## Solution - Migrate usages to the recommended `primary` variant - Delete the `alternative` variant <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Style** * Updated several buttons across forms, logs, recent queries, and release headers to use the primary visual style. * Button styling is now more consistent throughout the app, with a cleaner default emphasis for key actions. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
Gildas Garcia
|
7f1298e35e |
chore: dead code cleanup (#47129)
## Problem We have many unused files, left overs from features refactoring ## Solution - Remove unused files - Move some files closer to their usage <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Refactor** * Removed multiple legacy Studio UI components and placeholders to streamline the interface (including onboarding panels, navigation elements, docs layout helpers, and various UI building blocks). * **UI Updates** * Updated the layout’s API keys section to use the Project-specific presentation. * **Maintenance** * Adjusted internal sourcing for documentation tab menu logic without changing visible behavior. <!-- 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> |
||
|
kemal.earth
|
5662a72ef5 |
fix(studio): save button alignment on logs (#46881)
## 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? Simple one. | Before | After | |--------|--------| | <img width="186" height="114" alt="Screenshot 2026-06-12 at 15 29 18" src="https://github.com/user-attachments/assets/6e83af04-f97a-4cc9-b82b-b5eb86959e0d" /> | <img width="243" height="119" alt="Screenshot 2026-06-12 at 15 29 26" src="https://github.com/user-attachments/assets/2bfb522f-dec2-4205-967f-89223978bcd4" /> | <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Style** * Improved spacing and alignment of action buttons in the logs table header for better visual consistency. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
Jordi Enric
|
0367047d31 | fix(studio): classify auth log 4xx as warning, 5xx as error (#46851) | ||
|
Ali Waseem
|
1c2d28d5b3 |
chore: wrap local storage into helper methods that are safer (#46628)
## 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? - Noticing our code we have many patterns of calling localstorage and handling those errors - We should add those in a single well tested file - Handle those errors in the singleton which makes it easier for us to debug customer issues. Logger is outputing local storage warnings for feature we expose - Side effect of this is random crashes on studio when local storage isn't available or handled correctly <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Refactor** * Improved browser storage handling across the app for more reliable persistence and graceful behavior in restricted or non-browser environments (settings, previews, charts, tabs, sign-in/session flows, integrations, and UI state). * **New Features** * Introduced a safe storage layer to standardize and harden local/session persistence. * **Tests** * Added comprehensive tests covering the new safe storage behavior. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
Jordi EnricandClaude Opus 4.7
|
a7dda67549 |
feat(studio): add Multigres logs collection for HA projects (#46499)
## Problem High availability (Multigres) projects don't expose Multigres service logs in the Studio logs UI, so users on HA projects have no entry point to inspect them. ## Fix Add a `Multigres` logs collection, gated behind the `multigresLogs` ConfigCat flag **and** the project's `high_availability` flag (`useShowMultigresLogs`): - New `Multigres` entry in the logs sidebar `Collections`, linking to a new `multigres-logs` page that queries the `multigres_logs` table. - Wire `multigres_logs` through the logs constants, types, table SQL, query type, and service labels. - Row formatting: parse the JSON `event_message` and render `level` through `SeverityFormatter` and `msg` through `TextFormatter`, matching the other service collections (instead of dumping raw JSON). - `WARN` severity is now styled like `WARNING` (amber), since Multigres emits `level: WARN`. - Log detail drawer: parse the JSON `event_message` and spread its keys onto the log so each field (level, msg, query, error, connection_id, etc.) renders as its own collapsible row. - Single-log query omits the `metadata` column for `multigres_logs` (the table has no such column), fixing an `INVALID_ARGUMENT` error when opening the detail drawer. - Event chart: parse the level out of `event_message` via `JSON_VALUE` so error/warning bars are counted (the table has no top-level level column). - Add the `multigres_logs` source schema to the Field Reference drawer, same gating. ## Why a feature flag `high_availability` is an existing product feature that predates Multigres, so existing HA projects could otherwise see a broken collection querying a `multigres_logs` table they don't have. Requiring the `multigresLogs` flag ships the feature dark and decouples rollout from HA status. The flag must be created in ConfigCat before enabling; until then `useFlag` returns false and the feature stays hidden. ## How to test - Enable the `multigresLogs` flag (or override locally) and open a project where `high_availability` is `true`. - Navigate to `Logs`. Confirm a `Multigres` entry appears under `Collections` (after `Replication`). - Open it: the page loads at `/project/<ref>/logs/multigres-logs` and queries `multigres_logs`. - Confirm rows show a colored severity pill (including amber `WARN`) and a readable message rather than raw JSON. - Confirm the chart counts error/warning bars correctly. - Click a row: the detail drawer shows each parsed field as its own row, with no error. - Open the Field Reference drawer and confirm `Multigres` is listed as a source. - With the flag off, or on a non-HA project, confirm the collection and Field Reference source are both hidden. <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **New Features** * Multigres added as a dedicated log source with its own Logs page, sidebar entry, and query type. * Log list and preview now parse Multigres payloads to surface timestamp, severity, and formatted message. * Multigres integrated into charting, prompt labels, and field-reference UI (hidden unless enabled). * New hook controls showing Multigres UI only when feature flag + HA project condition are met. * **Bug Fixes** * Severity rendering treats "WARN" the same as "WARNING". * **Tests** * Unit tests added for Multigres parsing and the show-Multigres hook. <!-- end of auto-generated comment: release notes by coderabbit.ai --> --------- Co-authored-by: Claude Opus 4.7 <noreply@anthropic.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> |
||
|
Vaibhav
|
ec1b778ed8 |
fix: close log details (#46345)
- closes https://github.com/supabase/supabase/issues/46343 <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Bug Fixes** * Fixed logs explorer to clear previously selected logs when running new queries, changing date ranges, or clicking chart elements, ensuring the selected log remains synchronized with the current search context. <!-- review_stack_entry_start --> [](https://app.coderabbit.ai/change-stack/supabase/supabase/pull/46345?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 --> |
||
|
Charis
|
a7d51cdf52 |
feat(logs): brand legacy analytics SQL stack with SafeLogSqlFragment (#46351)
## 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 / type safety improvement ## What is the current behavior? The legacy log query stack (`genDefaultQuery`, `genCountQuery`, `genChartQuery`, `genWhereStatement`, `useLogsPreview`, `useSingleLog`) builds SQL from raw strings with no type-level guarantee that values are safely interpolated. Identifier helpers (`bqIdent`, `bqDottedIdent`, `clickhouseIdent`, `clickhouseDottedIdent`) are duplicated across BigQuery and ClickHouse variants, and `bqDottedIdent` wraps the entire dotted path in one backtick pair (`` `request.pathname` ``), which BigQuery treats as a literal column name rather than a UNNEST alias field — causing runtime query failures on dotted filter keys. ## What is the new behavior? - All gen functions return `SafeLogSqlFragment` and all callers route through `executeAnalyticsSql`, enforcing compile-time SQL provenance tracking across the legacy stack. - `bqIdent` / `bqDottedIdent` / `clickhouseIdent` / `clickhouseDottedIdent` are replaced by a single `quotedIdent` function that backtick-quotes each segment individually (e.g. `` `request`.`pathname` ``). ClickHouse natively accepts backticks, so one function serves both engines and the dotted-path quoting bug is fixed. - `SQL_FILTER_TEMPLATES` entries are converted to `SafeLogSqlFragment` (static via `safeSql`, dynamic via `safeSql` + `analyticsLiteral`). - `buildWhereClauses` is extracted as a private helper returning `SafeLogSqlFragment[]` so the pg_cron path can merge clauses without unsafe slice-and-cast. ## Additional context <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Refactor** * Logs query generation migrated to safer, engine-agnostic SQL fragments, typed filter templates, and unified identifier quoting for stronger injection protection and more consistent queries. * Logs preview and single-log retrieval now execute analytics SQL end-to-end using the unified executor. * **New Features** * Analytics SQL executor can call the backend via GET or POST and accepts method selection. * **Tests** * Updated tests to validate unified identifier quoting and safe-SQL helper behavior. <!-- review_stack_entry_start --> [](https://app.coderabbit.ai/change-stack/supabase/supabase/pull/46351?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 --> |
||
|
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 --> [](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 --> |
