I added outcome events for Explorer query runs and successful manual
notebook saves. Existing page visits and preview toggles do not show
whether users complete queries or persist notebooks.
**Changed:**
- **Query usage:** Accepted runs from query tabs and notebook cells emit
submitted and terminal outcome events with a shared run ID. Canceled
confirmations emit no run events.
- **Notebook adoption:** Successful manual saves emit created or updated
events. Recreated notebooks count as creations. Unsaved drafts and
failed saves emit neither.
- **Event metadata:** Explorer action events use `Explorer` as their
page title.
**Note:** Assistant-generated saves are outside this PR. Custom
properties omit SQL and notebook content. Page visits still carry the
browser title, which can include a notebook name.
## To test
Tested on the staging preview:
- [x] Run valid and invalid SQL from an Explorer query tab. Each run
emits one submitted event and one matching completed or failed event
with the same run ID.
- [x] Run database and Logs notebook query cells, then add a markdown
cell. The query cells emit matching event pairs; the markdown cell emits
no query event.
- [x] Save a new notebook, then edit and save it again. The successful
saves emit created and updated events.
- [x] Cancel a guarded query. It emits no query run event.
- [ ] Recreate a notebook deleted on the server after local edits. A
successful save emits created, not updated.
- [x] Inspect an Explorer action event request. Its page title is
`Explorer`; page visits still use the browser title.
- [ ] Force a notebook save failure. It should emit no save event. This
case was not tested manually.
## Linear
- fixes GROWTH-1298
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Analytics**
* Explorer query runs are tracked for database and log queries,
including whether they complete or fail.
* Query activity is associated with its location in Explorer, such as a
query tab or notebook cell.
* Successful notebook saves are tracked as creations or updates.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
---------
Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
## 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 -->
## Summary
A round of small Explorer refinements.
**Sidebar**
- Adds a **Run SQL** row (with a `+` icon) above Notebooks in the
Explorer sidebar; opens a new query tab.
**Assistant**
- Assistant query cells now have the same **Save** dropdown as query
tabs (add to an existing notebook or create a new one). It shows only
when Explorer is enabled, and not while the query is still streaming.
- `SaveQueryDropdown` takes an optional `source`, so logs queries are
saved as log cells (keeping their time range) instead of database cells.
This also fixes saving logs queries from query tabs.
- The "Drafting notebook..." notice (and the notebook loading/status
rows) now span the full message width; `delete_notebook` parts use the
wide layout like create/update.
**Onboarding**
- Replaces the single page with a four-step walkthrough: Welcome to
Explorer (with a **Preview** badge), Run SQL, Notebooks, and Chat with
your project. Each step has an icon, heading, and short description,
with step dots and **Skip** / **Back** / **Next** buttons; the last step
ends with **Continue to Explorer**.
- Removes the "Choose how Explorer opens" choice (still available in
Account preferences) and the collapsible "Learn more" section. Skipping
or finishing still respects the saved startup preference.
- Deletes `ExplorerOnboardingLearnMore`, `ExplorerHomePreference`, and
`ExplorerHomePreview`, which were only used by onboarding.
**Notebooks**
- Query cells use the same max width as markdown cells (`48rem`, was
`72rem`).
- "Add query cell" / "Add markdown cell" are now **Add query** / **Add
markdown** everywhere; the buttons at the bottom of a notebook are
larger (34px, 18px icons).
## Test plan
- [ ] Explorer sidebar: **Run SQL** opens a new query tab
- [ ] Assistant: generate SQL, use **Save** to add it to a new and an
existing notebook; repeat with a logs query and confirm a log cell is
created
- [ ] Assistant: ask for a notebook and confirm the drafting notice is
full width
- [ ] Clear `hasCompletedOnboarding` in Explorer preferences and step
through onboarding (Next / Back / Skip); finishing or skipping respects
the startup preference set in Account preferences
- [ ] Notebook: query cells line up with markdown cell width; bottom add
buttons are larger
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
- **New Features**
- Added a **Run SQL** shortcut to Explorer navigation.
- Assistant query results can now be saved to notebooks, including log
queries.
- **Improvements**
- Updated Explorer onboarding with guided steps, progress navigation,
and visual previews.
- Shortened Explorer action labels and refined control sizing.
- Reduced notebook query layout width and adjusted assistant notebook
displays.
- **Changes**
- Removed the Explorer startup preference selector and onboarding “Learn
more” section.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
---------
Co-authored-by: Claude Opus 5 <noreply@anthropic.com>
## Context
Swaps out the "Save as snippet" CTA in the `EditorPanel` to the "Save to
notebook" dropdown CTA if explorer is enabled
<img width="488" height="147" alt="image"
src="https://github.com/user-attachments/assets/915017a1-c416-4904-8146-b0695244d2bd"
/>
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* Added a save-query dropdown in Explorer for creating a new notebook or
adding a query to an existing notebook.
* Added notebook search, loading states, and empty-state messaging when
selecting an existing notebook.
* Saved queries now open in the selected notebook after insertion.
* **Improvements**
* Added an accessible label to the query title input.
* Updated query-saving controls to appear appropriately when Explorer is
enabled.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
### 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 -->
## 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 -->
## 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 -->
## 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 -->
## 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>
## 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"
/>
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>
## 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 -->
<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 -->
## Context
Just reorganizing the files under the Explorer folder as details are a
bit more clearer
Mainly shifting related and exclusive files into their own folder and
tests into `__tests__` folder + renaming some files
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
- **New Features**
- Added query result display settings for switching between table and
chart views.
- Added chart configuration options for chart type, axes, scaling,
cumulative mode, and labels.
- Automatically prevents invalid logarithmic scaling when chart data is
incompatible.
- **Refactor**
- Standardized Explorer tab and query source naming across the interface
without changing existing behavior.
- Updated Explorer navigation, routing, and page wiring to use the
standardized components.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
