mirror of
https://github.com/supabase/supabase.git
synced 2026-10-06 09:55:06 +03:00
2cd9b42e803277edefaa02e8aa5e4cdc27c19bb2
89
Commits
| Author | SHA1 | Message | Date | |
|---|---|---|---|---|
|
|
32f17f994d |
fix(studio): key query chart series by position, not column name (#50270)
## I have read the [CONTRIBUTING.md](https://github.com/supabase/supabase/blob/master/CONTRIBUTING.md) file. YES ## What kind of change does this PR introduce? Bug fix. Hardening ahead of any decision to enable session replay. ### What's inside - ~47 lines of logic: positional series keys, the X-key collision guard, and the rewiring of rows, cumulative results and axis width ([QueryResultChart.tsx](https://github.com/supabase/supabase/pull/50270/changes#diff-dae994728613498678bcc06a3ea5176b36708e06b531cfc7eddae3e588fff528)) - ~123 lines of tests, one case per chart type, cumulative setting and edge case ([QueryResultChart.test.tsx](https://github.com/supabase/supabase/pull/50270/changes#diff-6e1c92ad725bac0324db4d079f3d0cd061b8f6e2aecdc21bcdc5969c90dc3c59)) ## What is the current behavior? Session replay is disabled in every environment, and no recordings exist. This is about what a recording *would* contain if it were ever switched on: charting a query result would put the customer's own column names into it. `ChartContainer` writes every chart config key into a `<style>` element as `--color-<key>`. rrweb records `<style>` text verbatim: ```js u = "STYLE" === parentTagName || void 0 h = "SCRIPT" === parentTagName || void 0 !u && !h && o && r && (o = maskTextFn ? maskTextFn(o, parent) : o.replace(/\S/g, "*")) ``` The `!u` guard means `maskTextFn` never sees stylesheet text. It is a text node, so `maskAttributeFn` does not see it either. CSS written into the DOM is a channel no masking hook reaches. `QueryResultChart` keyed its config by the column names picked for the Y axis, which come from the customer's own SQL results. With recording enabled, a query charting a column named `customer_email` would produce `--color-customer_email` in the captured DOM. Linear [GROWTH-1229](https://linear.app/supabase/issue/GROWTH-1229). #48818 masks the attribute channel. This channel is text, so that PR does not reach it. ## What is the new behavior? Y series are keyed by position (`series_0`, `series_1`), so no customer string reaches the config keys. The column name still goes through as `config[key].label`, which `chart.tsx` renders into the tooltip and legend as text. Text nodes outside `<style>` are masked by `maskReplayText`, so the name is safe there and the chart stays readable. The X column keeps its own name. Only config keys reach the `<style>` and the X column is never one, so renaming it would buy nothing, and it would cost the `timestamp` handling: `ChartBar` and `ChartLine` branch on `xKey === 'timestamp'` to format tooltip dates and render the date-range footer. Keeping the original name needs one guard, since an X column literally named `series_0` would share a row key with the first Y series. `xKeyFor` appends underscores until the two are distinct. ## Additional context ### Testing Eleven tests. They assert the rendered `<style>` contains `--color-series_0` and does not contain the column name, across both chart types and both cumulative settings, plus the two-series case, the `timestamp` column and the collision guard. Three are verified to catch the defect they cover: the style-key assertion fails against the unfixed component, the `timestamp` assertion fails when the X key is pinned to a constant, and the `xKeyFor` cases fail when the guard's body is removed. `vitest run components/interfaces/Explorer` passes: 170 tests across 16 files. The tooltip and legend path isn't asserted, because recharts doesn't render either one at the 0x0 size jsdom gives the container. That the label is what renders there comes from reading `chart.tsx`. It is unverified at runtime. ### Remaining exposure Every other `ChartContainer` caller passes literal keys (`--color-error`, `--color-ok_count`), and `UnifiedLogs` filters a static config by a fixed level set, so this was the only caller feeding it customer strings. `chart-bar.tsx:119-124` and `chart-line.tsx` still fall back to building a config from whatever `dataKeys` they're given, so a future caller can reintroduce this without touching `QueryResultChart`. A general guard would have to live in `ChartContainer` or in the replay config. CSSOM writes (`insertRule`, `replace`, `replaceSync`, adopted stylesheets) also emit CSS outside both masking hooks. This PR does not close that path. <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit - **Bug Fixes** - Improved query result charts to preserve the source column name used for the X-axis. - Prevented X-axis names from conflicting with generated series identifiers. - Ensured bar and line charts consistently bind data to the correct X-axis and series. - Preserved timestamp-based chart behavior, including the date-range footer. - Chart series styling now uses stable positional identifiers, ensuring colors remain correctly assigned across configured series. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
|
66c6da82fe |
fix(studio): refine Explorer query surfaces and tab styling (#50249)
Explorer query surfaces now use `bg-card` in light mode and `bg-muted` in dark mode, including embedded notebook/chat queries and query tab toolbars. Notebook Run buttons match query tabs, with `ml-1` spacing on both. Fix doubled tab separators by applying the leading border only to the first tab. ### How to test 1. Open Explorer with multiple query, notebook, and chat tabs. Switch, reorder, and close tabs; confirm each separator stays one pixel wide. 2. In light and dark mode, inspect query tabs and embedded notebook/chat queries: backgrounds should be card in light mode and muted in dark mode, including their toolbars. 3. Compare notebook and query Run buttons: matching default styling and spacing. Run a read-only query such as `select 1` in both and check loading and results. 4. Check SQL Editor and Table Editor tab separators, since the tab component is shared. Validation: Prettier passed for all four changed files. Manual checks above have not been run. <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit - **Style** - Refined notebook and query run button styling, including spacing and tooltip placement. - Improved query editor panel backgrounds across light and dark themes. - Updated tab border rendering for more consistent visual alignment. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
|
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 |
||
|
|
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> |
||
|
|
8ac64a4349 |
Add copy notebook as markdown action (#50200)
## Context Adds a "Copy as Markdown" CTA for notebooks <img width="265" height="198" alt="image" src="https://github.com/user-attachments/assets/5eccf36e-24ea-4d2f-b1cf-72d5353b70a2" /> Query cell titles will be rendered as h3 tags and labelled either Postgres or Logs - Clickhouse (with time range) The query content will then be rendered as triple backticks with `sql` e.g ` ```sql...``` ` Query results will be copied to markdown if the query has been run, will otherwise be omitted Also, if the query was updated (e.g content, source, etc) after it was run (as the result is hence stale), result will also be omitted e.g: | Notebook | Markdown | | --- | --- | | <img width="1291" height="630" alt="image" src="https://github.com/user-attachments/assets/c49f23e5-c70b-46dd-a298-6e1a90cd30d7" /> | <img width="731" height="536" alt="image" src="https://github.com/user-attachments/assets/4bbe3041-bd8e-42d3-86d2-1691e7a6bc7b" /> | | <img width="1220" height="832" alt="image" src="https://github.com/user-attachments/assets/67de523a-18f7-4f1b-b764-7f0f3152f9e7" /> | <img width="757" height="803" alt="image" src="https://github.com/user-attachments/assets/d217504b-bee6-4088-9049-87ff647b9bc7" /> | <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **New Features** * Added Markdown export for notebook queries, results, errors, and time ranges. * Added error notifications when copying notebook content fails. * **Bug Fixes** * Prevented stale query results after relevant source or time-range changes. * Improved Markdown export for queries containing backticks. * Escaped backslashes, pipes, and line breaks in Markdown tables. * **Style** * Adjusted spacing for empty query-result messages. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
|
7c681da0d2 |
Explorer home to run query in query tab if input in chat form is a sql query (#50204)
### Context As per PR title - figured this might be a nice convenience. Submitting a SQL query in the chat form on the explorer home page will open the query in a query tab and run it <img width="854" height="632" alt="image" src="https://github.com/user-attachments/assets/57dc7538-74b5-4801-a7ed-83c1cfaf123f" /> <img width="872" height="519" alt="image" src="https://github.com/user-attachments/assets/597ce0eb-76d4-4f12-83db-20b628c03904" /> ### To test - [ ] Run a couple of SQL statements in the home tab - should open it in query tab and run it - [ ] Run a couple of non-SQL statements in the home tab, should default to opening in a chat tab <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit ## Summary by CodeRabbit - **New Features** - SQL statements submitted from the Explorer home screen now open in a query tab and run automatically. - Natural-language prompts continue to open in the chat experience. - Queries restored from drafts can automatically run once the editor is ready. - **Bug Fixes** - Improved recognition of SQL with leading whitespace, comments, and common statement formats while avoiding misclassification of conversational prompts. - Draft-based auto-run behavior now waits until the query editor is ready. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
|
e57aae3c83 |
feat(design-system): document disabled controls and add focusableWhenDisabled (#50068)
## What kind of change does this PR introduce? Docs update, with supporting `ui` and Studio changes. ## What is the current behaviour? Disabled buttons with tooltips use native `disabled`, which removes them from the tab order. Keyboard users cannot focus the control or read the tooltip explaining why an action is blocked. The design system also lacked guidance on keeping disabled actions discoverable and explaining why they are unavailable. ## What is the new behaviour? - Adds a **Disabled controls** section to the accessibility docs, with live examples for a focusable disabled button and visible page-level context - Adds `focusableWhenDisabled` to `Button`, keeping `disabled` as the semantic state while using `aria-disabled`, retaining keyboard focus, and guarding click handlers - Updates Studio's `ButtonTooltip` to make disabled buttons with tooltip text focusable automatically Also includes earlier design-system fixes on this branch: - Centralises `BASE_PATH` with a `/design-system` fallback so asset URLs work without a local `.env` file - Fixes sidebar hover and active tokens in design-system and ui-library, aligned with Studio's `InnerSideMenuItem` ## To test **Design system** 1. Open the [accessibility preview](https://design-system-git-fix-design-system-docs-and-nav-fixes-supabase.vercel.app/design-system/docs/accessibility) 2. Scroll to **Disabled controls** 3. Tab to the **disabled-focusable** example. Confirm the button remains focusable, looks disabled, and shows its tooltip on focus 4. Confirm the **disabled-unavailable-with-notice** example shows the admonition and focusable disabled button pattern **Studio (optional, requires a High Availability project)** 5. Go to Settings → General → **Pause project**. Tab to the button and confirm it remains focusable, looks disabled, and shows the HA tooltip on focus 6. Go to Database → Backups and find **Restore** on a scheduled backup row. Confirm the same behaviour |
||
|
|
1966209483 |
chore(deps): upgrade vitest to v5 (#49994)
Upgrades Vitest from 4.1.4 to 5.0.0 across the monorepo, fixes the handful of things v5 turned into hard errors, and drops the `vi.clearAllMocks()` boilerplate that v5's `clearMocks` default makes redundant. **Changed:** - `vitest`, `@vitest/ui`, `@vitest/coverage-v8` 4.1.4 → 5.0.0 (catalog) - `vi.mock` calls that lived inside `beforeAll`/`beforeEach`/test bodies moved to module scope (v5 throws on nested calls). Affects the Studio and docs setup files and four Studio tests. - `detectBrowser` test restores `navigator` via `vi.unstubAllGlobals()` instead of assigning `global.navigator`, which now reaches jsdom's getter-only property. - `RowEditor.utils.test.ts` restores its `JSON.stringify` spy. It used to leak a throwing mock for the rest of the file, which v5's coverage provider now trips over. A later test in the same file had been asserting the leak's side effect (valid JSON reported as invalid) and now asserts the correct behavior. - `@testing-library/jest-dom` 6.6 → 7.0.1. Its vitest type augmentation resolves through a peer now, so it lands on each package's own `vitest` instead of whichever copy pnpm hoisted. Fixes `toBeInTheDocument` type errors in dev-tools after the reshuffle. - `@testing-library/react` 16.0.0 → 16.3.3 for the React 19 peer range. - `vite: catalog:` added to dev-tools, www, and common. Without it they resolved a newer vite than the catalog pin, which forked a second vitest instance in the lockfile. There's now one. - ai-commands custom matcher types use v5's `Matchers<R, T>` form. - 110 test files: `vi.clearAllMocks()` removed from `beforeEach`/`afterEach` hooks, along with hooks that only did that and the imports they left unused. Calls that also reset/restore mocks are untouched. Second commit, mechanical. **Added:** - `.vitest/` to the root gitignore (v5 writes JSON/JUnit/HTML reporter output there) **Removed:** - `vite-tsconfig-paths` catalog entry and deps. Vitest 5 resolves tsconfig paths itself. Release-age note: this sat in draft with a temporary `minimumReleaseAgeExclude` entry for `vitest` and `@vitest/*` while 5.0.0 was inside the workspace's 3-day `minimumReleaseAge` window. That window has closed, so the exclusion is gone and nothing bypasses the release-age gate. **Perf** (local, medians of 3 runs, same machine): | Suite | v4.1.4 | v5.0.0 | |---|---|---| | studio | 144.1s | 141.7s (-2%) | | studio `--coverage` | 156.9s | 146.4s (-7%) | | ui-patterns | 6.27s | 5.07s (-19%) | | ui `--coverage` | 3.35s | 2.14s (-36%) | | www | 0.89s | 0.47s (-47%) | Studio is dominated by jsdom environment setup per file, which v5 doesn't change. `vitest doctor` recommends keeping the current pool config: the vm pools and `isolate: false` all break tests. ## To test - `pnpm install --frozen-lockfile` succeeds with no `minimumReleaseAgeExclude` entry for vitest. - CI: Studio unit tests, ui, ui-patterns, www, docs, and typecheck/lint should all be green. The lint ratchet was checked locally: warning counts on touched Studio files are identical to master. - `pnpm test:studio` locally passes with coverage (588 files, 6240 tests). - Open a Studio test that uses `toBeInTheDocument` in your editor and confirm no type errors on jest-dom matchers, in Studio and in `packages/dev-tools`. - Known pre-existing failures unrelated to this PR: one dev-tools test (`getEventCountBadge` capped pill) fails on master too. <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit ## Tests - Improved test coverage for JSON validation and mobile navigation behavior. - Updated test setup, cleanup, environment configuration, and matcher support across application and shared package suites. - Removed obsolete coverage for alternate MCP transport selection. ## Chores - Streamlined TypeScript path resolution and Vitest reporter output handling. - Updated testing libraries and Vitest tooling across documentation, Studio, website, and shared packages. - Added Vitest reporter output to ignored files. <!-- end of auto-generated comment: release notes by coderabbit.ai --> --------- Co-authored-by: Alaister Young <10985857+alaister@users.noreply.github.com> Co-authored-by: Ivan Vasilov <vasilov.ivan@gmail.com> |
||
|
|
d9742d707f |
chore(studio): refine Explorer sidebar breadcrumbs (#50188)
Moves Explorer’s back navigation and create actions into a reusable sidebar breadcrumb header. Reduces product-menu headings globally to `text-sm` and keeps breadcrumb links free of padding, borders, and backgrounds. ### How to test 1. Open `/project/<ref>/explorer` and confirm the header shows Explorer and the SQL Editor switch action. 2. Open Notebooks and Chats. Confirm the header shows `Explorer > Notebooks/Chats` and the corresponding create action works. 3. Return using the Explorer breadcrumb with a click or Tab + Enter. Check that the label stays aligned and has no hover background. 4. Open another product, such as Database, and confirm its sidebar heading uses the smaller font size. 5. At a mobile viewport, open the menu and repeat the notebook/chat actions and back navigation without closing the sheet. Confirm the header stays current and disappears when returning to the main menu or opening another product. Validation: 18 focused tests, typecheck, formatting, and lint ratchet passed. <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit - **New Features** - Added a shared Explorer sidebar header with breadcrumbs and contextual actions for creating notebooks and chats. - Added keyboard-accessible navigation between the Explorer overview and notebook or chat sections. - Added support for customized product menu headers across project layouts. - **Improvements** - Centralized Explorer navigation and actions in the shared sidebar layout. - Improved mobile menu updates when navigating between Explorer resources. - Refined Explorer home layout and drag-handle behavior across screen sizes. <!-- end of auto-generated comment: release notes by coderabbit.ai --> --------- Co-authored-by: Joshen Lim <joshenlimek@gmail.com> |
||
|
|
c33d255eba |
chore(studio): refine assistant empty states (#50191)
<img width="1062" height="712" alt="image" src="https://github.com/user-attachments/assets/44c82e00-94b4-405a-b2ef-cbc08401c4db" /> <img width="1583" height="962" alt="image" src="https://github.com/user-attachments/assets/b19b9fd8-24b1-48d6-8b31-11fba9911b9a" /> ## What kind of change does this PR introduce? UI refinement. ## What is the current behavior? The assistant sidebar and Explorer chat use different empty states. ## What is the new behavior? Share a centered empty state with chat-focused prompts, use-case icons, and a “Use your own agent” footer. Simplify prompt cards and align Explorer Home styling. ## Additional context Studio typecheck, targeted ESLint, and Prettier pass. E2E selectors updated; browser verification pending. Local build stopped after showing no progress during compilation. I have read CONTRIBUTING.md. <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **New Features** * Redesigned Explorer and AI Assistant onboarding with project-focused chat prompts. * Added personalized chat template icons and updated suggested actions. * Added an option to connect and use an external agent through Claude, OpenAI, or Cursor. * Improved chat composer placement and empty-chat guidance. * **Style** * Action cards now support layouts without descriptions and adjust alignment automatically. * **Tests** * Updated end-to-end coverage for the revised assistant interface. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
|
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 --> |
||
|
|
246bd9acbf |
Adjust vertical space for explorer notebook query cells (#50169)
## Context As per PR title - just adjusts the vertical height for a couple of empty states in QueryCells for Notebooks ### Query not run yet | Before | After | | -------- | -------- | | <img width="1072" height="350" alt="image" src="https://github.com/user-attachments/assets/cbf14619-ac01-4082-9732-41737a028c40" /> | <img width="1083" height="313" alt="image" src="https://github.com/user-attachments/assets/1144eebf-7293-4be4-adaf-af2dc21bc40f" /> | | <img width="1083" height="292" alt="image" src="https://github.com/user-attachments/assets/511754f8-5128-41b7-a4c8-542fb93b77e5" /> | <img width="1100" height="163" alt="image" src="https://github.com/user-attachments/assets/53de5b4a-8284-406a-a8ae-4602f61f3ca3" /> | ### Chart empty state | Before | After | | -------- | -------- | | <img width="1079" height="291" alt="image" src="https://github.com/user-attachments/assets/068fe573-1f65-4efc-831c-db2ddda2be1a" /> | <img width="1078" height="225" alt="image" src="https://github.com/user-attachments/assets/b9d58d8f-162d-463d-90e2-fbf3470c6db8" /> | <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit - **Style** - Improved query editor layout by reducing unnecessary spacing and ensuring result areas fit more consistently within available space. - Refined chart empty states with cleaner borders, compact spacing, and improved vertical sizing. - Updated query error presentation with more compact padding. - Simplified result panel sizing for a more consistent viewing experience. - **User Experience** - Added a play icon alongside the “Run the query to see results” prompt when no results are available. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
|
e267b05ee9 |
Add horizontal padding for notebook home tab (#50168)
## Context Theres no padding on smaller viewports - so the main content looks squished ### Before <img width="1674" height="1882" alt="image" src="https://github.com/user-attachments/assets/e0b1fb05-d853-40db-8e06-51dec9a9376a" /> ### After <img width="947" height="981" alt="image" src="https://github.com/user-attachments/assets/28c6dab4-0c12-4851-aa40-c65d60797463" /> <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Style** * Improved horizontal spacing on the Explorer home screen for a more balanced layout. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
|
86f7d245f8 |
Use green for notebook status indicator if new (#50167)
### Context As per PR title - just a tiny adjustment to use green for the status indicator if the notebook is new and yet to persist in the DB to make it visually different for notebooks that are already in the DB but have unsaved changes <img width="372" height="80" alt="image" src="https://github.com/user-attachments/assets/5ef863b1-0e7a-4b00-baab-dc76b3cf9b47" /> <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit - **Bug Fixes** - Updated the notebook status indicator to use the brand color for new notebooks. - Improved visual distinction between new notebook states and warning-related statuses. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
|
a1686025b6 |
Joshenlim/fe 4291 keep unsaved notebooks accessible after page refresh (#49673)
## Context Changes here adds a "Draft" state for notebooks with a new `notebook-drafts` store - similar to how we handle query tabs in the explorer. This implies that if a user refreshes the tab while there's unsaved changes to notebooks, the changes can be persisted locally and the user will be able to continue from where they left off. This also implies that If you create a new notebook (OR open an existing notebook and make some changes) and refresh the browser, we no longer show the native browser confirmation dialog about discarding changes. We also reuse the existing confirmation dialog when saving a notebook if its draft has diverged from the server side content - just updated the language to be more generic rather than saying that the Assistant made changes <img width="429" height="238" alt="image" src="https://github.com/user-attachments/assets/5c392aed-1633-4428-8060-28f495a01f04" /> Also fixes an unrelated issue - renaming a notebook should mark the notebook as having unsaved changes (with the orange indicator) <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit ## Summary by CodeRabbit * **New Features** * Unsaved notebook edits are saved locally and restored when reopening Studio. * Drafts are scoped by project and protected from server changes through conflict detection. * Notebook tabs indicate unsaved changes, including drafts from unsaved notebooks. * **Bug Fixes** * Closing a tab with local edits prompts for confirmation and removes its saved draft. * Notebook save state reflects the server-confirmed update time. * Conflict messages clearly describe changes made on the server. * **Style** * Improved keyboard focus behavior for tab controls. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
|
c365549ab8 |
feat(studio): resizable query/results split in the Explorer query editor (#49984)
## What's changed Stack 1/2 (next: https://github.com/supabase/supabase/pull/49985). - `QueryEditor` (`viewport` variant, e.g. Explorer query tabs and assistant query cells) now renders the SQL editor and results in a vertical `ResizablePanelGroup` instead of a fixed `h-[45%]` editor. The split is persisted under `LOCAL_STORAGE_KEYS.EXPLORER_QUERY_SPLIT_SIZE`. The `embedded` variant (notebooks) is unchanged. - Editor and results JSX are extracted into `querySql` / `queryResults` so the two layouts share one definition. - `isRunDisabled` now hides the toolbar run button instead of rendering it disabled (editor shortcuts are still disabled). `AssistantQueryCell` only sets it while an approval is pending, so the run button comes back once the tool call has resolved. - `QueryRunButton`: "Run selected" → "Run selected SQL", plain `DropdownMenuItem` instead of `DropdownMenuItemTooltip`. - `QueryResultError` no longer paints its own table-header background. ## How to test 1. Explorer → open a query tab. Drag the handle between the editor and results; reload — the split size is restored. 2. Toggle "Hide query" / "Show query" — results fill the tab when the editor is hidden. 3. Open a notebook — cells still render with the fixed-height editor (no resizable handle). 4. In the AI Assistant, ask for a query that needs approval. While the approval footer is shown there is no run button in the cell toolbar; after "Run query" / "Skip", the run button appears and works. 5. `pnpm --filter studio exec vitest --run components/interfaces/Explorer` passes. <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit - **User Interface** - Query results now appear in a resizable vertical split view, allowing users to adjust the space allocated to the editor and results. - Updated query result styling provides a cleaner background presentation. - Query result panels are better centered when appropriate. - **Query Execution** - The menu option is now labeled **“Run selected SQL.”** - The run button is hidden when query execution is unavailable. - **AI Assistant** - Query execution is disabled only during the relevant confirmation states. - Assistant query panels now use a wider, full-width layout. - Debugging a query now updates the assistant’s initial input. <!-- end of auto-generated comment: release notes by coderabbit.ai --> --------- Co-authored-by: Cursor <cursoragent@cursor.com> |
||
|
|
a4d925c230 |
fix(studio): write debug prompt into current chat when assistant is already open (#49911)
## Summary * Query blocks embedded inside an active assistant conversation (`AssistantQueryCell`) reused the same "Debug with Assistant" handler as standalone query blocks (Explorer Query tab, notebook cells), which always opens a brand-new chat and navigates away. * Clicking Debug on a block that's already part of the open conversation silently abandoned it for an unrelated new chat, which read as the button doing nothing. * Added an optional `onDebug` override threaded through `QueryEditor` → `QueryResultRenderer` → `QueryResultError`; `AssistantQueryCell` now uses it to write the debug prompt into the currently active chat's composer (`ai-assistant-state`'s new `setInitialInput`) instead of creating a new chat. Standalone query blocks keep the existing "open a new chat" behavior since no `onDebug` override is passed there. * `ExplorerChatTab` now wires `composerContext` into `AssistantChat` (it wasn't before), so the pre-filled prompt actually reaches the visible textarea on the Explorer chat route. Fixes [FE-4319](https://linear.app/supabase/issue/FE-4319/debug-with-ai-assistant-does-seemingly-nothing-if-query-is-already). ## Test plan - [X] `pnpm vitest run` on `QueryResultError.test.tsx` / `QueryResultError.selfhosted.test.tsx` / `ExplorerChatTab.test.tsx` / `AssistantQueryCell.utils.test.ts` — all pass, including new test asserting `onDebug` is called instead of `createChat`. - [X] `pnpm exec eslint` on touched files — clean (only pre-existing unrelated warnings). - [X] Manual check: run a query inside an assistant chat that errors, click "Debug with Assistant" on that block, confirm the debug prompt appears in the current chat's composer rather than opening a new chat. <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **New Features** * Added a “Debug with Assistant” workflow that sends SQL error details to the AI Assistant as its initial input. * Preserved the existing behavior of opening a new debug chat when the Assistant panel is unavailable. * **Tests** * Added coverage confirming that debugging invokes the Assistant callback without creating an additional chat. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
|
4ee43f3585 |
chore(studio): refine Explorer query UI (#49895)
## 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? UI refinements for Explorer query surfaces. ## What is the current behavior? - The assistant chat textarea uses a tighter radius than the Run SQL / Create a notebook cards on Explorer home. - Chart results sit unevenly in the results pane because axis gutters stack on card padding, and long Y labels can clip. - Selecting SQL in the editor changes the primary Run button to Run selected, which is easy to trigger by accident. - The Prettify SQL icon in notebook query cells uses Lucide's default size, so it doesn't match other toolbar actions. ## What is the new behavior? - Assistant chat form uses `rounded-lg` so it matches the home action cards everywhere the form is used. - Query result charts collapse unused axis space, add a little padding when labels are on, and size the Y axis from formatted ticks so longer labels fit. - Run is a default split button that always executes the full query. Run selected is a secondary menu item, disabled until SQL is selected. - Notebook cell Prettify SQL icons use `size={16}` and `strokeWidth={2}` like the rest of the Explorer toolbar. ## Additional context Cmd+Enter in the editor still runs the current selection when there is one. ## Test plan - [ ] Open Explorer home and confirm the assistant chat radius matches the Run SQL and Create a notebook cards. - [ ] Run a query, switch to chart view, and check spacing with labels off and on, including large Y values. - [ ] With no selection, click Run and confirm the full query runs. Open the split menu and confirm Run selected is disabled. - [ ] Select SQL, click Run, and confirm the full query still runs. Use Run selected from the menu to run only the selection. - [ ] In a notebook query cell, confirm Prettify SQL matches the size and stroke of nearby toolbar icons. Made with [Cursor](https://cursor.com) <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit - **New Features** - Added a split Run control in the query editor, with separate actions for running all content or only selected text. - Added support for customizing chart X-axis display settings. - Improved chart Y-axis sizing, scaling, and tick formatting for clearer results. - **Bug Fixes** - The “Run selected” action is unavailable when no text is selected. - **Style** - Updated toolbar icon sizing and added rounded corners to the assistant chat input. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
|
9b17ce8f2c |
chore(studio): default assistant to GPT-5.6 Luna (#49749)
## 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 / chore: hide assistant model selection in the UI and default chats to GPT-5.6 Luna. ## What is the current behavior? The assistant composer exposes a model picker. Paid orgs default to `gpt-5.3-codex`; everyone else defaults to `gpt-5.4-nano`. ## What is the new behavior? - The model picker is hidden in the assistant composer and Explorer home. - Chats default to `gpt-5.6-luna` with `reasoningEffort: medium`. - Model selection plumbing is kept (registry, entitlements, `setModel`, generate-v4 request body) so a requested model can still be honored when provided. - Other completion endpoints still use `gpt-5.4-nano`. ## Additional context Model selector UI can be re-enabled by passing `selectedModel` / `onSelectModel` to `AssistantChatForm`. <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **New Features** * Added support for the GPT-5.6 Luna model with medium reasoning capability. * Made GPT-5.6 Luna the default assistant model. * **Improvements** * Simplified assistant chat by removing model selection from the primary chat experience. * Updated model fallback behavior to use the standard assistant model. * Chat forms can now optionally display model selection when configured. * **Tests** * Updated model coverage and assistant chat tests for the new defaults and behavior. <!-- end of auto-generated comment: release notes by coderabbit.ai --> --------- Co-authored-by: Cursor <cursoragent@cursor.com> |
||
|
|
17d15ee1e2 |
fix(studio): confirm destructive notebook queries (#49658)
## What - add a second notebook-level confirmation for destructive SQL before forced batch execution - reuse the shared SQL safety detector for stored and live cell SQL - cover destructive confirmation, cancellation, non-destructive mutations, and live SQL ## Testing - pnpm --filter studio exec vitest run components/interfaces/Explorer/ExplorerNotebookTab.utils.test.ts components/interfaces/Explorer/__tests__/ExplorerNotebookTab.test.tsx --coverage.enabled=false - pnpm --filter studio exec eslint components/interfaces/Explorer/ExplorerNotebookTab.tsx components/interfaces/Explorer/ExplorerNotebookTab.utils.ts apps/studio/components/interfaces/Explorer/ExplorerNotebookTab.utils.test.ts apps/studio/components/interfaces/Explorer/__tests__/ExplorerNotebookTab.test.tsx Closes FE-4284 <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Improvements** * Simplified notebook execution into a single confirmation step for mutating queries. * Destructive queries, including operations such as `DROP` or `TRUNCATE`, are clearly marked with a **Destructive** badge. * The confirmation dialog lists affected queries and lets you proceed or cancel. * Detection uses the latest SQL from the editor and ignores destructive keywords in comments. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
|
8db7368ccf |
feat(studio): clarify quick query as temporary space (#49695)
## 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 ## What is the current behavior? Standalone queries in the Explorer "Quick Query" surface have editable titles (defaulting to "Untitled query") without clear indication that they are temporary and not saved, similar to the old SQL Editor snippet model. ## What is the new behavior? The Quick Query tab now clearly indicates that standalone queries are temporary. The title is no longer editable and displays "Temporary space for one-off queries" as static muted italic text. The default query name has been changed from "Untitled query" to "Quick query" for clarity. ## Additional context Resolves FE-4297. Notebook cells (variant === 'embedded') remain unchanged with editable titles. <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **UI Improvements** * Renamed new one-off queries from **“Quick query”** to **“Run SQL”** when no title is provided. * Updated viewport query editor toolbars to display the fixed **“Run SQL”** label. * Preserved editable titles for embedded query editors. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
|
b278b1ec8a |
fix(studio): Debug with Assistant and Copy prompt work (#49690)
## Summary
* Resolved hanging buttons in Explorer's QueryResultError panel that
were wired to stub no-ops (`buildPrompt={() => ''}`,
`onOpenAssistant={() => {}}`).
* "Debug with Assistant" now opens a new chat seeded with a real prompt
combining the SQL query and error context using existing
`buildDebugPromptText` util and `useCreateChat` hook.
* "Copy prompt" now copies the same real debug prompt text to clipboard.
* Threaded `sql` and query `source` props down through `QueryEditor` →
`QueryResultRenderer` → `QueryResultError` while keeping them optional
for backward compatibility with other callers like
`AssistantNotebookPreviewCell`.
## Test plan
- [X] Run `pnpm typecheck` — passes
- [X] Run `pnpm lint --filter=studio` — passes
- [X] Run `pnpm test:studio --run
apps/studio/components/interfaces/Explorer/QueryEditor` — Explorer
vitest suite (99 tests across 13 files) passes with no regressions
- [X] Manually verify in Explorer: trigger an ad-hoc SQL query that
fails, confirm "Debug with Assistant" opens a new chat with the error
prompt seeded, and "Copy prompt" copies the prompt to clipboard
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
- **New Features**
- Added “Debug with Assistant” to query errors using the submitted SQL
and error details.
- Added an option to copy the debugging prompt for easier
troubleshooting.
- Assistant actions are hidden when query details are unavailable or
restricted.
- **Bug Fixes**
- Ensured query errors reference the SQL that produced them, rather than
later editor changes.
- **Tests**
- Added coverage for assistant debugging, prompt copying, conditional
visibility, and self-hosted behavior.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
|
||
|
|
c0409b38b4 |
joshenlim/fe 4285 explorer missing prettify in query toolbar actions (#49675)
## Context Adds the prettify SQL CTA to Explorer Notebook and Query Tab Query tab: Prettify CTA is within the dropdown menu here <img width="1092" height="272" alt="image" src="https://github.com/user-attachments/assets/3b4f3514-69cc-4c24-a127-da1555ee905e" /> Query cell: Prettify CTA sits between the buttons in the toolbar <img width="1085" height="306" alt="image" src="https://github.com/user-attachments/assets/e503ad6c-5dda-4c2b-a824-8c1049d5e9fb" /> Also added shortcut tooltip for the run button <img width="183" height="103" alt="image" src="https://github.com/user-attachments/assets/729055b8-8e2c-4cf7-8f2e-c5726e828644" /> <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **New Features** * Added SQL prettification to Explorer query editors through the overflow menu, query toolbar, editor action, and keyboard shortcut. * Displays the configured formatting shortcut alongside the prettify action. * Prevents formatting while an AI proposal is pending. * Added a keyboard shortcut hint to the query run action. * Enhanced toolbar tooltips to support richer formatted content. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
|
78bd0e066b |
chore(studio): align query results grid typography with table editor (#49752)
## Summary - Match Explorer/SQL query results table typography to Table Editor: sans cells at `text-grid`, headers at `text-xs` / `text-foreground` - Reuse Table Editor `NullValue` for null cells so empty results read the same way - When the Explorer feature preview is on, the inline editor "expand" action opens a new Explorer query tab (same pattern as the assistant) instead of the SQL Editor ## Test plan - [ ] Run a query in Explorer and confirm header/cell font, size, and color match Table Editor - [ ] Confirm `NULL` cells use the same faded treatment as Table Editor - [ ] Check the SQL Editor results pane (shared `DataGridResults`) still looks correct - [ ] With Explorer feature preview on, expand the inline editor and confirm it creates an Explorer query tab with the current SQL, then closes the panel - [ ] With Explorer feature preview off, expand the inline editor and confirm it still opens a SQL Editor snippet <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit ## New Features - Added the ability to open SQL directly in Explorer from the editor panel. - Run SQL actions now create a query draft and navigate to the query tab. ## Style - Improved data grid readability with clearer text, left-aligned headers, truncated labels, and selectable content. - Added dedicated styling for null values. - Updated empty-results messaging with standard sans-serif text. <!-- end of auto-generated comment: release notes by coderabbit.ai --> --------- Co-authored-by: Cursor <cursoragent@cursor.com> |
||
|
|
516ef0320f |
chore(studio): refine Explorer toolbar, chat, and home actions (#49748)
## Summary - Unify Explorer toolbar actions: 16px / 2px Lucide icons, `text-tertiary-foreground` that becomes `text-foreground` on hover (Analyze icon goes brand on hover). - Soften chat scroll edges with top/bottom fades, and align the composer width with the conversation content (`px-7` + `max-w-3xl`). - Put **Run SQL** first on Explorer home, and rename the tab-bar new-tab item from “New query” to **Run SQL** so it matches. ## Test plan - [ ] Open Explorer and check query, notebook, and chat toolbars: icons are 16px, muted by default, and go to foreground on hover. Analyze on a notebook with cells: icon goes brand on hover; empty notebook still disables Analyze. - [ ] Open a query tab: source menu, result settings, save, and more-options all look like the other toolbar actions (including while the dropdown is open). - [ ] Open Explorer chat: scroll a long thread and confirm top/bottom fades sit on the chat surface. Composer lines up with message width (not inset extra). - [ ] On Explorer home, **Run SQL** is the first card; clicking it still opens a SQL tab. - [ ] From the tab bar **+** menu, the first item is **Run SQL** (not “New query”); it still creates a SQL tab. **New notebook** and **New chat** still work. Made with [Cursor](https://cursor.com) <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **UI Improvements** * Standardized Explorer toolbar icons for consistent sizing and visual weight. * Updated toolbar action colors, hover states, and keyboard-focus visibility. * Reordered Explorer home actions so “Run SQL” appears first. * Renamed “New query” to “Run SQL” in the new-tab menu. * Improved query source and settings toolbar controls. * Refined AI assistant chat layout with centered content, decorative gradients, and improved focus styling. * Added hover styling for the notebook Analyze action. <!-- end of auto-generated comment: release notes by coderabbit.ai --> --------- Co-authored-by: Cursor <cursoragent@cursor.com> |
||
|
|
f1e0808223 |
Disable analyze button for notebooks if notebook is empty (#49674)
## Context As per PR title - just disables the analyze button if the notebook is empty <img width="1077" height="323" alt="image" src="https://github.com/user-attachments/assets/f8da8bd4-eb0c-43ae-85c7-b60c1c7dcfed" /> <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Bug Fixes** * Disabled the Analyze action for empty notebooks. * Added guidance prompting users to add a cell before starting analysis. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
|
c4fe153fd8 |
Joshenlim/fe 4290 add save to notebook button in query tabs (#49667)
## Context Adds a "Save" action for query tabs in the explorer, which opts for 2 options to either add to an existing notebook, or create a new notebook. Both of these actions just opens the notebook in a new tab with unsaved changes - the changes will only be persisted in the DB when the user hits "Save" on the notebook. For adding to an existing notebook, the snippet will be appended to the bottom of the notebook - UI will scroll to the bottom after navigating to the notebook. <img width="469" height="368" alt="image" src="https://github.com/user-attachments/assets/19d16940-89e2-4d10-b71e-8d501f749668" /> |
||
|
|
8d59e69da4 |
Add support for running only selected query in QueryEditor (#49651)
## Context As per PR title - this behaviour currently exists in the SQL Editor so just bringing it over to the Explorer, applies to both QueryTab and QueryCell since they use the same QueryEditor component "Run" button also updates to "Run selected" for clarity when a specific portion of the code editor is selected <img width="1387" height="958" alt="image" src="https://github.com/user-attachments/assets/7e652951-3c07-4f8d-851b-bb9219d0c1f2" /> <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **New Features** * Run only the selected SQL when text is highlighted in the query editor. * Run the full query when no text is selected. * Updated the run button label and tooltip to reflect the action. * **Bug Fixes** * Improved query execution for empty or collapsed selections. * Corrected selection state when reopening the query editor. * **Tests** * Added coverage for selected-text, full-query, and editor reopening scenarios. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
|
eabb87564b |
fix(studio): resolve dirty notebook save conflicts (#49540)
## Summary - require an explicit choice before saving a notebook that diverged while dirty - let users save over assistant changes or discard their local edits, with deleted notebooks recreating safely - keep dismissals side-effect free and close deleted notebook tabs when edits are discarded ## Testing - pnpm --filter studio exec vitest run components/interfaces/Explorer/__tests__/ExplorerNotebookTab.assistant-cache-invalidation.test.tsx data/content/notebooks/notebook-cache.test.ts --reporter=dot - pnpm --filter studio typecheck <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit - **New Features** - Added conflict handling when server-side notebook changes overlap with local edits. - Users can overwrite, recreate, discard, or dismiss changes through a confirmation dialog. - Deleted notebooks can be recreated when saved, while discarded deleted notebooks are automatically removed from open tabs. - Conflict dialogs remain open while an action is in progress. - **Bug Fixes** - Improved notebook cache cleanup to remove stale and unsaved notebook data reliably. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
|
2759b13efc |
refine display settings ui (#49466)
<img width="392" height="343" alt="image" src="https://github.com/user-attachments/assets/4a17e3ad-364d-45c6-9770-0f937ad18418" /> ## I have read the [CONTRIBUTING.md](https://github.com/supabase/supabase/blob/master/CONTRIBUTING.md) file. YES ## What kind of change does this PR introduce? Studio UI refinement. ## What is the current behavior? The Explorer result settings popover uses a spacious vertical layout with mixed control heights and local active-state overrides. ## What is the new behavior? - Condenses the result settings into the horizontal form layout used by compact settings surfaces. - Uses base ToggleGroup, Select, MultiSelector, and Switch component variants. - Adds shared tiny Toggle and MultiSelector sizes so the compact controls render at 26px. - Uses the accent token for shared toggle active states. - Keeps the chart configuration behavior and disabled states intact. ## Verification - UI and UI Patterns focused tests - UI, UI Patterns, and Studio typechecks - Studio ESLint - Local visual verification against the supplied prototype <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Improvements** * Chart-specific configuration options now appear only when chart view is selected, keeping display settings focused and relevant. * Updated chart controls provide clearer options for scale, cumulative values, and labels. * Added compact sizing for multi-select fields and toggles to improve alignment with other form controls. * Refined toggle styling and adjusted small-size dimensions for a more consistent interface. * **Tests** * Added coverage for compact multi-select and toggle sizes. <!-- end of auto-generated comment: release notes by coderabbit.ai --> --------- Co-authored-by: Cursor Agent <cursoragent@cursor.com> Co-authored-by: Saxon Fletcher <SaxonF@users.noreply.github.com> |
||
|
|
40d9a2e929 |
fix(studio): invalidate notebook cache after assistant delete (#49496)
Stacked on supabase/supabase#49415. ## Summary - collect completed assistant delete_notebook tool calls as deleted cache effects - evict deleted notebooks from the React Query cache and notebook state - cover collector, cache eviction, and the open-tab Notebook not found state ## Verification - pnpm test:studio -- notebook-cache-invalidation ExplorerNotebookTab.assistant-cache-invalidation - pnpm --filter studio typecheck - touched-file ESLint and Prettier checks <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Bug Fixes** * Improved notebook deletion handling so removed notebooks no longer remain visible after deletion. * Navigation and cached notebook data now update promptly when a notebook is deleted. * Attempting to access a deleted notebook now displays a clear “Notebook not found” message. * **Tests** * Added coverage for notebook deletion, cache invalidation, navigation updates, and the resulting not-found state. <!-- end of auto-generated comment: release notes by coderabbit.ai --> --------- Co-authored-by: Joshen Lim <joshenlimek@gmail.com> |
||
|
|
de3a8799d6 |
fix(studio): invalidate notebook caches after assistant create/update (#49415)
## Summary - The assistant's `create_notebook`/`update_notebook` tools run entirely server-side, so an open notebook tab's React Query cache and Valtio store never learn a write happened — the tab keeps showing stale content until a manual reload. - Adds `collectNotebookCacheEffects`/`applyNotebookCacheEffects` (`apps/studio/lib/ai/notebook-cache-invalidation.ts`), which scan finished assistant messages for completed `create_notebook`/`update_notebook` tool calls and evict the affected notebook via `evictNotebookFromCaches` (`apps/studio/data/content/notebooks/notebook-cache.ts`), plus invalidate the nav list. - Wired into `createChatInstance`'s `onFinish` in `state/ai-assistant-state.tsx`, with per-chat dedupe so replayed history isn't reprocessed. - Removes the cache entry outright rather than invalidating it, since a remounting `useNotebookQuery` would otherwise read the stale cached value synchronously before its refetch lands. - Explicitly skips eviction when the open tab has unsaved local edits, so an assistant write can't silently discard them. Related: [FE-4235](https://linear.app/supabase/issue/FE-4235) **Out of scope:** this only protects the client-side cache/store from being clobbered after the fact. Preventing the assistant's `update_notebook` tool call itself from overwriting a user's unsaved edits (a data-layer conflict, not a cache-freshness one) is tracked separately in [FE-4255](https://linear.app/supabase/issue/FE-4255). ## Test plan - [x] `pnpm test:studio -- notebook-cache notebook-cache-invalidation ai-assistant-state.notebook-cache-invalidation ExplorerNotebookTab.assistant-cache-invalidation ExplorerNotebookTabCoordinator` — all passing - [x] Reproduction-first component test (`ExplorerNotebookTab.assistant-cache-invalidation.test.tsx`) — verified it fails without the fix (stale content persists) and passes with it - [x] Regression test for the dirty-notebook guard (an edited, unsaved notebook is left untouched by an assistant write) - [x] `pnpm typecheck --filter=studio` / `pnpm lint --filter=studio` clean <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Bug Fixes** * Notebook changes made through the AI assistant now appear correctly in open notebook tabs and after reopening them. * Saved notebook caches are refreshed after completed create or update actions, preventing stale content from being displayed. * Unsaved notebook changes are preserved during cache cleanup. * Closing a notebook tab now consistently removes its cached content. * **Tests** * Added coverage for assistant-driven updates, remounts, duplicate actions, project context changes, and cache behavior. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
|
3490a63a7c |
Hook up analyze button in notebook (#49463)
## Context Hooks up the "Analyze" CTA on a notebook which runs a prompt in the Assistant to run the notebook and summarize findings <img width="230" height="63" alt="image" src="https://github.com/user-attachments/assets/fd30f301-1c52-4e9b-810c-74820cf52720" /> Note: running notebooks have not been hooked up yet on the Assistant side of things <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **New Features** * Added an Analyze action to notebook tabs. * Notebook changes must be saved before analysis can begin, with a confirmation prompt to save. * Analysis starts automatically after a successful save. * The Analyze action now shows a loading state while analysis is being created. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
|
f1526d2d1b |
Fix running queyr cell marks notebook tab with unsaved change indicator (#49464)
## Context Fixes a small bug whereby running any query cell within a notebook will mark the notebook tab with the unsaved changes status indicator `handleSqlCommit` gets called when we run the query, and it flips the notebook's status to "unsaved" hence why its happening. Hence opting to skip committing the changes in `handleSqlCommit` if there's no change to the SQL content <img width="224" height="69" alt="image" src="https://github.com/user-attachments/assets/7015b527-b249-4f2e-bcf1-948b5fe3f5a9" /> <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit - **Bug Fixes** - Prevented unnecessary notebook updates when committed SQL is unchanged. - Continued saving SQL changes as expected. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
|
63a6e27142 |
Trigger native browser confirmation when exiting session if there's unsaved changes (#49465)
## Context As per PR title - triggers the native browser discard confirmation dialog while in the explorer UI if exiting the session (e.g by refreshing or closing the tab) and there's any tabs with unsaved changes <img width="593" height="431" alt="image" src="https://github.com/user-attachments/assets/85b50c3e-ee69-4d27-8819-12151e6fc9f7" /> <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Bug Fixes** * Added a warning when attempting to leave or close the page while a notebook has unsaved changes. * Prevented unnecessary warnings when no discardable changes are present. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
|
de2a7d8d9e |
Add view options to Query (#49447)
Currently Query tabs in explorer do not support view options e.g. table vs chart. This adds display state to query tabs to match the behaviour of Notebooks ## To test - create a query in explorer - Run a query - Set the display options via toolbar <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **New Features** * Query results can now be displayed as either a table or chart. * Chart settings are saved with each query draft and restored when reopened. * Display preferences are maintained independently across query drafts. * Editing a preview query now converts it into a permanent tab. * **Bug Fixes** * Invalid or legacy display settings safely fall back to the table view without removing saved drafts. * Charts and empty states now use the available editor space more effectively. <!-- end of auto-generated comment: release notes by coderabbit.ai --> --------- Co-authored-by: Joshen Lim <joshenlimek@gmail.com> |
||
|
|
48cc37f0d2 |
refactor(studio): extract notebook cache eviction helper (#49414)
## Summary Part 1 of the FE-4247 stack ([FE-4247](https://linear.app/supabase/issue/FE-4247/assistant-invalidate-cache-after-notebook-editdeletion)). Pure refactor, no behavior change — extracts the notebook cache eviction logic that `ExplorerNotebookTabCoordinator` had open-coded into a shared helper, so the upcoming assistant create/update/delete cache invalidation (PR 2/3 in the stack) can reuse it instead of duplicating the two-cache-layer eviction dance. - New `evictNotebookFromCaches({ queryClient, projectRef, id, mode })` in `apps/studio/data/content/notebooks/notebook-cache.ts`. `mode: 'refresh' | 'remove'` selects `invalidateQueries` vs `removeQueries` on `contentKeys.resource`. Drops the notebook from `notebooksState` only when its status is `'saved'`, matching the original open-coded guard exactly. Returns whether it evicted, so callers can branch. - `ExplorerNotebookTabCoordinator` now calls the helper with `mode: 'remove'` instead of inlining the logic. ## Test plan - [x] `pnpm test:studio -- notebook-cache ExplorerNotebookTabCoordinator` — new helper tests (refresh/remove/dirty-guard/unknown-id) and existing coordinator tests all pass - [x] `pnpm typecheck --filter=studio` - [x] `pnpm lint --filter=studio` — 0 errors, no new warnings <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit - **Bug Fixes** - Improved detection of unsaved notebook changes for tab indicators and close confirmations. - Empty, never-saved notebooks are no longer included in discard prompts. - Improved cache cleanup when closing saved notebooks while preserving unsaved work. - Added safeguards for missing notebook records. - **Tests** - Added coverage for notebook cache refresh, removal, preservation, and no-op scenarios. <!-- end of auto-generated comment: release notes by coderabbit.ai --> --------- Co-authored-by: Joshen Lim <joshenlimek@gmail.com> |
||
|
|
5c6ef8ae3d |
Joshenlim/fe 4221 explorer tab behaviours to mimic sql editor (#49386)
## Context Improves the tab behaviour for explorer to follow the SQL Editor - Tabs now start as preview tabs and become permanent once you start interacting with them - Query Tabs become permanent as soon as you start typing in the editor - Chat tabs become permanent as soon as you start typing in the chat input - Notebook tabs become permanenet as soon as you make any changes to the notebook - Notebooks with unsaved changes will show the orange dot indicator <img width="197" height="67" alt="image" src="https://github.com/user-attachments/assets/3005c379-a49a-4cd8-8d90-65406b186141" /> - Closing a notebook tab with unsaved changes will show a confirmation dialog - Except if the new notebook has no content (no changes) <img width="375" height="218" alt="image" src="https://github.com/user-attachments/assets/6ad10779-6415-4c55-bb4f-61d938e744c9" /> <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **New Features** * Explorer chat, query, and notebook tabs now begin as previews and become permanent when edited or saved. * Added unsaved-change indicators and close confirmation for edited notebook tabs. * Confirmed closure of edited notebooks now discards unsaved changes. * **Bug Fixes** * Improved restoration and persistence of Explorer drafts. * Notebook saves now reflect the latest edits and tab state. * Prevented stale save responses from incorrectly marking newer edits as saved. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
|
4dc973048d |
Add confirmation modal when running notebook if notebook contains query cells that aren't read only (#49376)
## Context Adds a confirmation modal when hitting "run notebook" if the notebook contains any query cells that involve any sort of mutation (insert, update, alter, etc, etc). Also gives users the option to run the notebook's read only cells as an alternative. <img width="432" height="355" alt="image" src="https://github.com/user-attachments/assets/0413a3ad-5419-4c83-8bf3-976bfa683b9a" /> <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **New Features** * Added confirmation prompts before running queries that may modify data or database structure. * Prompts identify potentially mutating notebook queries and allow running read-only cells instead. * Query execution now includes checks for destructive operations and missing row-level security, with optional automatic setup. * Notebook runs use the latest saved and unsaved SQL and reliably reset execution status. * **Bug Fixes** * Improved notebook layout behavior so content shrinks correctly within flexible sections. * **Tests** * Expanded coverage for mutation detection, comments, multiple statements, live SQL, and cell filtering. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
|
a18253f7c7 |
QueryEditor to have the same validations as per SQL editor (#49380)
## Context Adds the same validations such as UPDATE without where clause, or destructive query into the QueryEditor of explorer / notebooks. Kicks in for both notebook cells and query tab <img width="887" height="718" alt="image" src="https://github.com/user-attachments/assets/27757d41-e5df-4473-9278-ec30ff2306ca" /> <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit - **New Features** - Added safety checks for potentially destructive database queries. - Queries may pause for confirmation before execution. - Added optional RLS statement handling during query execution. - Added warnings and cancellation support for pending query runs. - Added read-only mode to prevent SQL edits and proposal acceptance. - **Bug Fixes** - SQL commits now use the current editor content. - Discarding a proposed query is handled directly and reliably. - **Tests** - Added coverage for query approval, cancellation, and RLS-enabled table creation. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
|
502e0f9b09 |
Add isReadOnly flag into QueryEditor component (#49378)
## Context `QueryEditor` component is being used in the Assistant Chat currently and needs to be read only in this context specifically <img width="1251" height="564" alt="image" src="https://github.com/user-attachments/assets/97d7ce9c-59bc-4acb-a105-e70361b6729e" /> <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Enhancements** * Added read-only support for query editors, allowing query content to be viewed without making changes. * Assistant-generated queries are now displayed in a non-editable mode to prevent accidental modifications. * Read-only editors also prevent applying suggested SQL changes, helping preserve the original query while it is being reviewed. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
|
4778ae66e0 |
Flush notebook cache in valtio and react query whenever closing notebook tab (#49369)
## Context Opting to flush the notebook cache within the Valtio store (nootebook-store) and react query whenever we close the notebook tab in the explorer. Mainly to ensure that whenever we re-open the notebook again, the notebook content isn't stale and we refetch the notebook content from the API <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit - **Bug Fixes** - Closing a saved notebook tab now removes it from the session and clears its cached content. - Notebooks with unsaved changes are preserved when their tabs close. - **Tests** - Added coverage for saved and unsaved notebook tab cleanup behavior. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
|
d93defe1e0 |
feat(studio): refine notebook query cell layout (#49350)
<img width="2326" height="1257" alt="image" src="https://github.com/user-attachments/assets/d0f63793-ff58-4f48-971f-0622d375b3c7" /> ## I have read the [CONTRIBUTING.md](https://github.com/supabase/supabase/blob/master/CONTRIBUTING.md) file. YES ## What kind of change does this PR introduce? Studio UI improvement. ## What is the current behavior? Explorer notebook query cells can extend beyond the intended reading width, and saved notebooks open with SQL code expanded. ## What is the new behavior? - Caps Explorer notebook query cells at `max-w-6xl`. - Hides SQL code by default in saved notebooks. - Keeps SQL visible by default for new notebooks. ## To test 1. Open a saved Explorer notebook with query cells. Confirm each cell is capped at the wider notebook width and its SQL editor is initially collapsed. 2. Expand a saved query cell and confirm the existing SQL and result remain available. 3. Create a new notebook, add a query cell, and confirm its SQL editor is initially visible. <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **New Features** * Added controls to show or hide SQL for individual query cells. * Query visibility is preserved when switching notebook tabs or reopening them. * New notebooks display SQL by default, while saved notebooks can hide SQL editors. * Expanded the query editor width for improved readability. * **Bug Fixes** * Prevented visibility settings from affecting notebook save status or unrelated cells. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
|
9a3500aad2 |
Set up infinite loading for notebooks (#49321)
## Context Sets up infinite loading for notebooks with the `InfiniteListDefault` component Also adds the notebook and chats count on the explorer home nav <img width="275" height="137" alt="image" src="https://github.com/user-attachments/assets/c3f16e8f-f520-4107-a188-43b1abcca043" /> <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **New Features** * Explorer navigation now displays accurate notebook and chat counts. * Notebook lists support infinite scrolling, loading indicators, and improved active-state styling. * Notebook navigation remains available as additional items load. * **Bug Fixes** * Corrected default markdown cell formatting by removing unintended leading spaces from headings and notes. <!-- end of auto-generated comment: release notes by coderabbit.ai --> --------- Co-authored-by: Charis <26616127+charislam@users.noreply.github.com> |
||
|
|
6779bf52e1 |
Joshenlim/fe 4208 explorer templates need to be properly set up (#49322)
## Context Set up Explorer templates properly for notebooks and chat. Tried (with the help of Claude) to come up with templates that are generic enough for most projects to sort of pick up and use, or even pick up to study how notebooks are meant to be used. Feel free to play around on the preview to check out the content of each template! 🙂 <img width="768" height="232" alt="image" src="https://github.com/user-attachments/assets/590893c4-9772-437d-980f-05ea62ffef81" /> <img width="1918" height="955" alt="image" src="https://github.com/user-attachments/assets/2114e73e-dc44-403d-a998-e87c8d328516" /> <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **New Features** * Added ready-to-use chat templates for sample data, security policies, and notebook creation. * Added notebook templates for database health, user growth, and error investigation workflows. * Explorer cards now dynamically create chats and notebooks from selected templates. * Templates include guided prompts, queries, logs, charts, and relevant notebook content. * **Bug Fixes** * Improved generated log cell identifiers for more reliable notebook creation. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
|
7d28bcc26b |
joshenlim/fe 4204 notebooks intellisense toggle (#49300)
## Context Adds an intellisense toggle for explorer notebooks similar to SQL editor + have QueryEditor render definitions via `useAddDefinition` <img width="259" height="162" alt="image" src="https://github.com/user-attachments/assets/278fdabd-1a24-4769-972e-1bce29060463" /> So intellisense will be running in the QueryEditor if intellisense is enabled + source selected is database, otherwise will not run. <img width="982" height="411" alt="image" src="https://github.com/user-attachments/assets/19497aa0-36fc-49ab-853d-cb938b5b18e7" /> Also updated `useAddDefinition` logic to flush the table columns + functions cache in react query - For context in the past we had users run into browser performance issues when definitions were loaded if their database is really big - Hence why we originally added this intellisense toggle - But we previously also required users to refresh the browser after disabling intellisense, as a manual way to flush the cache - So this change should remove the need to refresh the browser after disabling intellisense <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **New Features** * Added PostgreSQL IntelliSense with definitions, formatting, and code completions in SQL editors. * Added a notebook option to enable or disable IntelliSense, with the preference saved between sessions. * Improved the notebook’s empty-state appearance. * **Bug Fixes** * Improved IntelliSense cleanup and prevented duplicate registrations when disabled. * Improved query execution state handling while background IntelliSense data loads. * **Tests** * Added coverage for shared registration, cleanup, preference persistence, and IntelliSense-related query handling. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
|
2893c783d5 |
Hook up APIs for Notebooks CRUD (#49254)
## Context API changes are ready so hooking up the endpoints for full CRUD UX E2E - Can create notebooks - Can load notebooks - Can delete notebooks - Can update notebooks |
||
|
|
81bccd6862 |
notebook preview refine (#49288)
<img width="840" height="507" alt="image" src="https://github.com/user-attachments/assets/d0f4667f-a7bb-4afe-95b2-a9e224adcbb5" /> <img width="848" height="597" alt="image" src="https://github.com/user-attachments/assets/beb0c239-d36c-4103-ab07-8a3872ba3f30" /> Updates how we display Notebooks in Assistant to be more in line with our AssistantQueryCell. ## To test: - Open Assistant and ask it to create a test notebook and note the new styling <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **New Features** * Added unified, read-only notebook previews for create and update proposals. * Preview cells now support expandable content, clearer type icons, metadata, and “Show more” controls. * Added before-and-after metadata comparisons for replaced cells. * Integrated previews into confirmation cards with approval, skip, and refresh actions. * Added skip-only confirmation flows when approval is unavailable. * **Bug Fixes** * Improved handling of parse failures, stale notebooks, invalid changes, and loading errors. * **Style** * Refined confirmation card layouts, borders, spacing, and footer presentation. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
|
dde45ab06c |
Joshenlim/fe 4195 explorer queryeditor cmd k completion support (#49248)
## Context Adds the inline AI completion functionality into Explorer QueryEditor, similar to what we've got for the existing SQL editor - Shifts the `ResizableAIWidget` and `InlineWidget` components out of the SQL Editor folder into `components/ui/AiEditor` to be used by both SQL Editor and Query Editor - Consolidates the "proposal" logic that was initially set up for the Clickhouse Migration functionality with this Inline AI stuff - Also added the prompt into the proposal header (Refer to the screenshots below) - SQL Editor didn't have this - but figured this is useful as context for the user <img width="935" height="352" alt="image" src="https://github.com/user-attachments/assets/3f71539a-dda1-4763-be08-a850bdc8aec6" /> Source selected: Database <img width="922" height="357" alt="image" src="https://github.com/user-attachments/assets/81e772e6-dcc9-440d-83db-49d0d487dd13" /> Source selected: Logs <img width="920" height="345" alt="image" src="https://github.com/user-attachments/assets/83f1dae3-cf62-4424-be42-b06e70cb366d" /> <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit - **New Features** - Added AI-assisted SQL generation with contextual prompts and OS-specific guidance. - Review generated SQL changes in a diff, then accept, reject, or cancel suggestions. - Added inline, resizable AI prompt controls with loading and submission states. - Added the Ctrl/Cmd+Shift+K shortcut to run AI SQL generation. - **Improvements** - Added options to disable query execution and run custom actions. - Renamed “Recent” to “Recently updated.” - Improved editor widget positioning and display behavior. - Added clearer error notifications when AI generation fails. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
|
cf2322d198 |
Add delete chat functionality to explorer chats (#49250)
## Context Just realised that chats in the new Explorer UI have no delete functionality so this patches it <img width="296" height="184" alt="image" src="https://github.com/user-attachments/assets/90a79b6b-55a8-4122-8cd8-05fc13e9f4a5" /> Also added a confirmation modal for deletion <img width="473" height="266" alt="image" src="https://github.com/user-attachments/assets/56a1e400-2a1c-48b7-b6b8-0104af49b1a9" /> <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit - **New Features** - Added an option to delete Explorer chats from the chat toolbar. - Added a confirmation prompt before permanently deleting chat history. - Added success feedback after deletion is completed. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |