mirror of
https://github.com/supabase/supabase.git
synced 2026-10-06 09:55:06 +03:00
codex/fix-tanstack-e2e
11
Commits
| Author | SHA1 | Message | Date | |
|---|---|---|---|---|
|
|
d0135231fb |
chore(studio): improve assistant feed performance (#50888)
## Problem Assistant conversations with multiple query and Edge Function blocks repeatedly render expensive content while streaming. Scrolling past the feed boundary can also move the surrounding layout. ## Solution Memoize unchanged messages, blocks, and code highlighting; batch streaming UI updates; and skip off-screen query layout while keeping block state mounted. Preserve streamed status updates and contain scrolling in the message viewport. The changes are shared by Next and TanStack. ## Review instructions 1. Compare the base branch and this branch using the same saved conversation containing 10–20 query, result/chart, and Edge Function blocks. Keep the browser, viewport, and conversation identical. 2. In Chrome DevTools, record Performance with 4× CPU throttling while streaming a follow-up, typing in the composer, and scrolling through the feed. Compare scripting/layout time and long tasks. React DevTools Profiler should show unchanged completed blocks avoiding renders during subsequent text updates. 3. Scroll away from query blocks and return. Confirm results, display settings, selections, and controls retain their state. Run a read-only query such as `select 1` and check its results still update. 4. Confirm “Thinking…” finishes, Stop retains the latest streamed text, and approval/skip, copy, edit, and branch actions still work. Repeated scrolling at the feed boundary must leave the outer layout/composer stationary; jump-to-latest and following new messages should still work. 5. Repeat in both runtimes: `STUDIO_FRAMEWORK=next pnpm dev:studio` and `STUDIO_FRAMEWORK=tanstack pnpm dev:studio`. Also check the assistant sidebar, which shares the feed. ## Validation - 170 assistant/Explorer tests and one shared CodeBlock test passed; formatting and Studio lint passed (two existing warnings). - Browser checks covered both route entry points, viewport state/geometry, and scroll behavior. - Review fixes: 23 focused tests, lint, formatting, and full Studio typechecking passed. Full production builds were not verified. ## Checklist - [x] I have read [CONTRIBUTING.md](https://github.com/supabase/supabase/blob/master/CONTRIBUTING.md) - [x] No docs content changed; docs authoring skills are not applicable. <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Performance** * Improved responsiveness in the AI assistant by reducing unnecessary updates while messages stream and conversation history is displayed. * Optimized query previews, message rendering, and code blocks to keep the interface smoother during use. * **Bug Fixes** * Improved handling of message edits and deletions during generation, and preserved the latest response when generation is stopped. * Improved conversation scrolling behavior while keeping conversation content and scroll areas working as expected. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
|
252f69e451 |
chore(studio): refine Explorer sidebar, onboarding, and notebooks (#50555)
## 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> |
||
|
|
7880c2f079 |
fix(studio): explorer chat and notebook layout refinements (#50453)
Five layout fixes across Explorer chat, notebooks, and the sidebar. ### Chat - **Conversation fade overlapped the scrollbar.** The top and bottom gradients are positioned against the conversation's padding box, which includes the scroll container's scrollbar gutter, so `inset-x-0` painted them over the scrollbar. They now stop at the conversation's content gutter, which `Conversation` owns for both the content and the fades. - **Composer background bled past the input's radius.** The form paints the surface behind the textarea but had no radius of its own, so its square corners showed outside the `rounded-lg` input. It now shares the radius. - **Message parts used two different widths.** Wide parts come down to `max-w-3xl` so every part shares a column, matching `AssistantQueryCell` and `AssistantNotebookPreview`. `isWide` / `isWideMessagePart` stay in place with both widths equal, so a part can diverge again later without rebuilding the mechanism. ### Notebooks - **Cell controls sat at the container edge.** Each cell centred itself at its own max width while the grip and add-cell button stayed at the far left of the full-width row, leaving a large gap. `SortableSection` takes a `sectionWidth` and carries its control gutter twice — once as the controls, once as padding on the other side — so the section stays centred with its controls immediately beside it. Cell widths are unchanged (prose `48rem`, query `72rem`); set them equal and the two cell types' controls line up on their own. The controls stay in flow rather than floating in an outside gutter, so on a viewport narrower than the cap the row just fills the space instead of clipping the controls into the padding. ### Sidebar - **Search icon didn't line up with the menu row icons.** The row box already sits flush with the search input's box, so rows moved from `pl-3` to `pl-2` to put their icons on the same 8px offset the search icon uses. Spacing between the input and the list now matches the 12px side padding. ### Testing `pnpm --filter studio run typecheck`, Prettier, and 378 tests across `Explorer`, `ProjectHome`, `AIAssistantPanel`, and `ExplorerLayout` pass. ESLint warning counts are unchanged from master. These were reasoned from layout rather than checked in a browser, so they're worth a look on a preview before merge. <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **UI Improvements** * Updated Explorer layouts with flexible, configurable widths for notebook and query sections. * Refined navigation spacing and padding across Explorer views. * Centered and standardized AI Assistant preview, query, and message content widths. * Improved chat form styling with rounded corners. * Adjusted conversation spacing and fade overlays to avoid overlapping the scrollbar. * Preserved full-width behavior where appropriate while keeping controls aligned. * **Tests** * Updated layout tests to reflect revised width and alignment behavior. <!-- end of auto-generated comment: release notes by coderabbit.ai --> --------- Co-authored-by: Claude Opus 5 <noreply@anthropic.com> |
||
|
|
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 --> |
||
|
|
f0cb024139 |
feat(studio): preserve assistant tool previews after completion (#49352)
<img width="2337" height="1005" alt="image" src="https://github.com/user-attachments/assets/08298850-715e-4b31-866d-186d73266305" /> ## 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? Assistant execution feedback improvement. ## Stack context Builds on #49351. ## What is the current behavior? When an Assistant query, notebook, Edge Function deployment, or log query completes or fails, the preview can be replaced by a terse text result. ## What is the new behavior? - Retains the original query, log-query, notebook, and Edge Function preview after the tool resolves. - Replaces confirmation actions with a success, error, or skipped footer state. - Keeps the Open notebook action available after a successful notebook creation or update. ## To test 1. Ask the Assistant to run a valid SQL query, approve it, and confirm the query cell remains visible with a Query executed footer. 2. Trigger a failed SQL or log query and confirm the original preview remains visible with an error footer and error result. 3. Ask the Assistant to create or update a notebook, approve it, and confirm the preview remains visible with a completed footer and Open notebook action. 4. Skip any approval and confirm the preview remains visible with a skipped footer instead of being replaced by plain text. <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **New Features** * Assistant actions now show clear success, error, or denied-status messages. * Completed actions retain relevant previews and provide follow-up actions, such as opening a created notebook. * SQL, log-query, Edge Function, and notebook errors appear within their respective result views. * Status updates are announced more clearly as actions progress and complete. * **Bug Fixes** * Preserved submitted tool details when execution fails or original input is unavailable. * Improved handling of failed and denied operations across assistant workflows. <!-- 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 --> |
||
|
|
86105ca5ec |
feat(studio): align assistant message parts (#49351)
<img width="2252" height="1228" alt="image" src="https://github.com/user-attachments/assets/5c1165ae-cb65-4495-97dd-427b30ceaefc" /> ## 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. ## Stack context Builds on #49350. ## What is the current behavior? The Assistant conversation uses one outer width constraint. This leaves query and notebook previews too narrow, separates consecutive generic tool rows, and leaves message actions aligned to the far left. ## What is the new behavior? - Gives Assistant query cells and notebook previews a `max-w-6xl` container. - Keeps text and other regular message parts at their existing `max-w-3xl` width. - Keeps consecutive generic tool rows such as Reasoned and Ran load_knowledge compact. - Aligns message action rows with regular message content. ## To test 1. In the Assistant, produce a response containing text plus a SQL query or notebook preview. Confirm the preview is wide while regular text remains at the normal width. 2. Produce a response that reasons and runs consecutive non-preview tools. Confirm those rows remain close together with their separators. 3. Hover an Assistant response and confirm copy, rating, and branch actions align with the regular message content. 4. Hover a user message and confirm edit and delete actions use the same alignment. <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit - **Style** - Improved AI Assistant message layout with centered, consistent content widths. - Expanded notebooks, SQL results, and query-related content where additional space is helpful. - Improved alignment and spacing for actions, tool outputs, loading states, errors, and disclaimers. - Improved query editor visibility when switching between cells. - Loading indicators now respect reduced-motion preferences. - **Tests** - Added coverage for message layouts, tool grouping, and notebook preview sizing. <!-- 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> |
||
|
|
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 --> |
||
|
|
e605178a63 |
feat(studio): render assistant log query results (#49293)
<img width="1510" height="862" alt="image" src="https://github.com/user-attachments/assets/f7157bad-9b23-4d73-a9aa-2a7a7c179318" /> ## 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 and bug fix. ## What is the current behavior? `query_logs` can return rows to the assistant, but the chat UI does not hydrate those rows into the query result by default. The query only becomes visible after clicking **Run query**, even though the same SQL and time range work when rerun manually. ## What is the new behavior? - Renders `query_logs` tool output through a dedicated logs message part using the shared assistant query cell. - Parses the exact MCP untrusted-data envelope into the initial query result, without changing what the assistant model receives. - Preserves the logs source and time range for manual reruns. - Infers a useful table or chart presentation from the returned rows while retaining explicit display settings. - Adds focused tests for MCP result parsing, timestamps, errors, query source handling, and visualization inference. ## How to test 1. Check out this PR and run Studio against a project that has recent logs. Generate some project activity first, such as an API request, if needed. 2. Open the AI Assistant and ask: `Show log counts by minute for the last 15 minutes and summarize any spikes.` 3. Wait for `query_logs` to finish. Verify the query cell appears with results already populated; do not click **Run query** first. 4. Verify the aggregate result opens as a chart, then switch to the table view and confirm the underlying rows are present. 5. Click **Run query** and verify the query runs successfully again using the same logs source and 15-minute time range. 6. Ask: `Show the 20 most recent log entries from the last 15 minutes.` Verify this non-aggregate result opens as a table with rows already populated. 7. Confirm the assistant's written summary agrees with the displayed rows and does not report zero rows when results are visible. ## Additional context This is the top PR in stack #49294 and depends on the back-end knowledge change in #49292. Verified with 59 focused tests across assistant context, Studio/MCP tools, query display, and logs result parsing. <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **New Features** * Added AI Assistant support for querying and displaying application logs. * Added automatic visualization selection, including charts for time-based and categorical data. * Added source-aware query handling with dedicated titles, time ranges, and result displays. * Added clearer loading, parsing, and error states for log queries. * **Bug Fixes** * Improved handling of streamed results, source changes, and query display updates. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
|
6e64ad039c |
feat(studio): add AssistantQueryCell on the shared QueryEditor (#49169)
## 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? Notebooks and query tabs use `QueryEditor`. Assistant SQL still uses `DisplayBlockRenderer` / `QueryBlock`. ## What is the new behavior? Adds `AssistantQueryCell`, a local-state wrapper around the shared `QueryEditor` (`variant="viewport"`, `isRunDisabled` while confirming). Nothing is wired into the conversation yet — that is #49170 — so this PR is the reusable cell plus the small editor/report-container hooks it needs. ## Additional context Part of stack #49171. Base: `feat/assistant-confirm` (#49168). ## Test plan - [ ] `AssistantQueryCell.utils.test.ts` passes - [ ] Query editor still runs in Explorer notebooks / query tabs - [ ] No assistant conversation UI change in this PR (still DisplayBlockRenderer) --------- Co-authored-by: Cursor <cursoragent@cursor.com> |