## Summary
Add PostHog event tracking for the two new buttons introduced in PR
supabase/supabase#49698 that allow users to temporarily switch between
the Explorer and SQL Editor:
* **Explorer button**: "Back to SQL Editor" button in the Explorer
sidebar title bar now fires `explorer_temp_access_sql_editor_clicked`
event
* **SQL Editor button**: "Back to Explorer" button in the SQL Editor
title bar (shown during temporary visits) now fires
`sql_editor_back_explorer_clicked` event
Both event interfaces follow the repo's telemetry-standards conventions,
carrying only `groups: TelemetryGroups` property with no additional
custom properties.
## Test plan
- [X] Verify `explorer_temp_access_sql_editor_clicked` event fires in
PostHog when clicking "Back to SQL Editor" button in Explorer
- [X] Verify `sql_editor_back_explorer_clicked` event fires in PostHog
when clicking "Back to Explorer" button in SQL Editor
- [X] Run typecheck: `pnpm typecheck` passes without errors
- [X] Run lint: `pnpm lint --filter=studio` passes
## Issue
Resolves
[FE-4213](https://linear.app/supabase/issue/FE-4213/explorer-set-up-telemetry-for-metrics-where-appropriate)
## Summary by CodeRabbit
* **Analytics**
* Added tracking for navigation from the Explorer to the SQL Editor.
* Added tracking for returning from the SQL Editor to the Explorer.
## 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?
Users who have opted into the Explorer feature preview have no way back
to the SQL Editor from within Explorer, so they can't easily check their
old snippets.
## What is the new behavior?
- The Explorer sidebar title bar now has a button (using the same icon
as the SQL Editor/Explorer nav entry) that links to the SQL Editor, with
a tooltip explaining it's a temporary switch to access snippets.
- Clicking it marks the visit as temporary in localStorage, which
surfaces a matching "Back to Explorer" button in the SQL Editor title
bar. Clicking that button clears the temporary flag and returns to
Explorer.
- Fixed the product menu title bar badge slot to sit flush right instead
of directly next to the title text.
## Additional context
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* Added a quick switch from the Explorer to the project’s SQL Editor.
* Added a “Back to Explorer” option in the SQL Editor when opened from
Explorer.
* Added tooltips to clarify these navigation actions.
* Navigation state is preserved per project for a smoother return
experience.
* **UI Improvements**
* Improved product menu spacing and title truncation for better layout
handling.
<!-- 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
Explorer home tab has a box shadow when selected (more visible in light
mode) so this PR removes it
Before:
<img width="237" height="218" alt="image"
src="https://github.com/user-attachments/assets/17abd73b-2328-47ad-bb58-94cb5761dbb1"
/>
After:
<img width="242" height="208" alt="image"
src="https://github.com/user-attachments/assets/ef159dd7-61b9-4027-8b58-25229ae2283a"
/>
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Style**
* Updated the active Explorer home tab appearance to remove its default
shadow.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## 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 -->
## 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 -->
## Context
Very tiny one - just hooks up the browser tab label for explorer
properly
Browser tab should be the focused explorer tab, otherwise defaults to
'Explorer'
<img width="175" height="48" alt="image"
src="https://github.com/user-attachments/assets/fa6eef96-3222-4bf6-b929-993441970728"
/>
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
- **Bug Fixes**
- Browser titles now accurately reflect the active Explorer tab.
- Untitled tabs display “Untitled,” while views without an active
Explorer tab display “Explorer.”
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
<img width="1693" height="1038" alt="image"
src="https://github.com/user-attachments/assets/9ef52446-c517-4ea9-ada6-ac6dc57c8af4"
/>
## Summary
- add an Explorer-specific chat toolbar with rename, chat ID,
permission, and branching controls
- list searchable non-support chats in Explorer with reactive updates
and safe rehydrated-date sorting
- add chat creation entry points to Explorer home and navigation menus
- route chat recent items correctly and show chat icons across shared
tab surfaces
- make the assistant sidebar expand action open the active chat in
Explorer
This is PR 3 of 3 and is stacked on #49031. Review #48973 first, then
#49031, then this PR. Compared with its base, this PR contains only
discovery, toolbar, and cross-surface integration work.
## To Test
- visit /explorer
- Create a new chat either via home tab chat input OR the chats sidebar
- Validate chats show up in sidebar
- Validate chat conversation works
- Close the chat tab and open a chat via sidebar
- Change permission settings via the chat tab toolbar and verify it
persists
## Test plan
- `mise exec node@22 -- pnpm --dir apps/studio exec tsc --noEmit`
- focused Vitest suite: 4 files / 5 tests covering reactive chat lists,
navigation filtering and sorting, recent-item routing, and sidebar
handoff
- ESLint on changed TypeScript files
- Prettier check on changed source files
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
- **New Features**
- Added chat creation from the Explorer home, navigation, and new-tab
menu.
- Added an Explorer chat toolbar with editable names, ID copying,
permissions, shortcuts, and metadata warnings.
- Added searchable chat history with sorting, active-chat highlighting,
and clear empty states.
- Chats can now open directly in Explorer from the AI Assistant panel.
- Recent items now link correctly to chats and notebooks.
- **Bug Fixes**
- Improved chat list updates after creation, deletion, and restored
sessions.
- Added safer handling for chats without update timestamps.
- **Tests**
- Expanded coverage for chat navigation, creation, metadata warnings,
shortcuts, and recent-item links.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
---------
Co-authored-by: Claude Opus 5 <noreply@anthropic.com>
<img width="1693" height="1037" alt="image"
src="https://github.com/user-attachments/assets/51fdf618-f06e-45ca-bf30-e1307dfbb372"
/>
## Stack
Depends on #49041. Followed by #49028.
## Summary
- add a dedicated ad-hoc query tab type and route under Explorer
- connect query tabs to the shared `QueryEditor` through a `QueryTab`
lifecycle adapter
- add local query draft/result state and restore query tabs from their
routes
- confirm before closing populated local-only drafts and clean up their
state on close
## To test
1. Open Explorer, select **Run SQL**, enter `select 1`, and run the
query.
2. Rename the query, reload the page, then close the tab and confirm the
discard prompt appears.
## Why
Explorer needs a lightweight place to run SQL without creating a
snippet. This layer adds the query-tab lifecycle on top of the shared
editor foundation.
## Impact
Queries in this layer run against the selected project's primary
database. Drafts are local to the browser and are discarded when their
tabs are closed.
## Validation
- fresh non-incremental Studio TypeScript check
- 22 focused tests across query draft state, tab state, and notebook tab
registration
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* Added support for creating, opening, editing, and running SQL queries
in Explorer.
* Added project-scoped persistence for query drafts and results.
* Added dedicated query routes, query icons, and query tabs.
* Added unsaved-changes warnings when closing query tabs.
* Added a pinned Explorer Home tab and “New query” option.
* Improved notebook tab registration and editor tab organization.
* **Bug Fixes**
* Improved tab navigation, closing behavior, and layout.
* **Tests**
* Added coverage for query persistence, cleanup, restoration, and tab
navigation.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
---------
Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
## Context
More groundwork for the Explorer - this PR initializes the Notebook
editor page which you can access with the "New notebook" CTA
As usual nothing functional just yet, but this PR also addresses some UI
functionality
- Creating more than 1 notebook will open multiple tabs (it wasn't
previously)
- Swapping between notebooks will update the URL (wasn't previously as
well)
Will probably start looking into the cells next, starting with
MarkdownCell followed by QueryCell
<img width="1390" height="894" alt="image"
src="https://github.com/user-attachments/assets/a467cdb4-f99f-43db-8106-c15c26c1bfbf"
/>
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* Added notebook creation actions from the Explorer home and navigation
areas.
* Introduced a full notebook editor with title editing, rename support,
and Analyze, Run, and Save controls.
* Added options to create query or Markdown cells in empty notebooks.
* Notebook tabs now open the corresponding notebook in the project
Explorer.
* **Bug Fixes**
* Improved Explorer layout sizing and notebook tab navigation behavior.
* Improved notebook tab labels and editing behavior, including
cancellation with Escape and submission with Enter or blur.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## Context
More groundwork for the Explorer - this one's focused on initializing
the valtio store for managing notebooks
Store architecture will follow closely with the existing
sql-editor-store
No data persistence yet, but can test creating a new notebook
<img width="195" height="143" alt="image"
src="https://github.com/user-attachments/assets/8656fb5b-3a8e-4f71-b2ce-d2f34ca9b552"
/>
Which should open a placeholder page
<img width="1387" height="527" alt="image"
src="https://github.com/user-attachments/assets/4a81b1ae-a740-40e6-9d33-29fa4f83b541"
/>
Closing the notebook brings you back to the explorer home page
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* Added support for creating and opening project notebooks from the
Explorer.
* Added notebook tabs alongside existing entity and SQL tabs.
* Added notebook management, including loading, renaming, removing,
editing cells, and tracking unsaved changes.
* Added support for SQL, logs, and Markdown notebook cells.
* Added dedicated notebook routes and an initial notebook editor view.
* Added notebook icons throughout the Explorer interface.
* **Documentation**
* Documented session-scoped notebook state for query results and row
limits.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## Context
More groundwork for the Explorer - initializing the home page
Note that nothing here is functional, all just visual still
<img width="1387" height="960" alt="image"
src="https://github.com/user-attachments/assets/d4967578-edbd-476f-8150-d9d5e9d66666"
/>
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* Added a new Explorer landing page with an assistant chat form.
* Added quick actions for creating notebooks and SQL work.
* Added notebook and chat template cards for faster project exploration.
* **Improvements**
* Explorer content now fills the available page height.
* Assistant send button styling now reflects whether submission is
available.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## Context
Continued ground work for Explorer - just initializes the Tab UI for
Explorer as such:
- Plan is to continue using the existing tabs store + EditorTabs
component
- Purely visual, nothing functional
<img width="1389" height="556" alt="image"
src="https://github.com/user-attachments/assets/d46c5ae7-01a8-4887-9452-11b98327d6bf"
/>
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* Added an Explorer workspace with animated navigation and tab controls.
* Added a home tab and a new-tab menu for creating notebooks, with chat
creation shown as unavailable.
* Added support for notebook tabs in the editor and Explorer navigation.
* Added flexible tab layouts with custom tab content, optional new-tab
actions, and configurable collapse controls.
* Improved editor navigation to recognize Explorer workspaces alongside
existing table and SQL editors.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## Context
Resolves FE-4074
Just adds scaffolding for the explorer UI - no data fetching yet.
Initializes the page + side nav, based off Saxon's POC in
`poc/explorer-prototype`
<img width="1389" height="500" alt="image"
src="https://github.com/user-attachments/assets/8f293992-97d9-403e-91d6-2e104cd20eb5"
/>
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
## New Features
- Added a project Explorer page accessible from
`/project/:ref/explorer`.
- Added navigation for browsing notebooks and chats.
- Added search fields, back navigation, animated transitions, and empty
states for Explorer sections.
- Added a conditional Explorer link to the SQL Editor menu when enabled.
## Documentation
- Marked the Explorer route migration as complete in the migration
checklist.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
