mirror of
https://github.com/supabase/supabase.git
synced 2026-09-22 13:37:53 +08:00
docs/cli-deploy-next-step
437 Commits
| Author | SHA1 | Message | Date | |
|---|---|---|---|---|
 Jordi Enric
|
fa7c223209 |
fix(studio): use Compute management endpoints FUNC-896 (#50393)
## Problem Studio still called the legacy `/workers` Management API routes and used the old `project_worker` response contract, so Compute instances could not be listed or retrieved after the API rename. The production API type check also detected drift in the v1 and platform declarations. ## Fix - Regenerate the v1, v2, and platform API declarations from the deployed schemas. - Update Studio list and detail queries to `/compute`. - Align typed fixtures with the Compute response schemas and `project_compute_instance` resource type. - Update platform response type references to the generated `_Output` schema names. ## How to test - Run `pnpm api:verify-types`. - Run `pnpm --filter api-types test`. - Run `pnpm --filter studio test data/compute/compute.utils.test.ts "tests/pages/project/[ref]/compute/index.test.tsx"`. - Run `pnpm --filter studio typecheck`. - Run `pnpm --filter common typecheck`. - Run `pnpm --filter studio lint:ratchet`. Expected result: production API declarations are synchronized, and Studio requests the `/compute` list and detail endpoints and renders `project_compute_instance` responses successfully. <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Improvements** * Updated API response handling across profiles, backups, notifications, integrations, warehouses, access tokens, payments, and other Studio workflows for more accurate serialized data. * Compute instance pages and queries now use the compute-specific API endpoints and response data. * Improved feature-flag type handling when disabled feature data is unavailable. * **Tests** * Updated automated coverage and fixtures to reflect current compute and API response formats. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
Danny White
|
476d4a5851 |
refactor(ui): drop redundant Button variant="default" props (#50161)
## What kind of change does this PR introduce? Mechanical cleanup on top of the Button default-variant change (#50160). ## What is the current behavior? Many callsites still pass `variant="default"` even though that is now the component default. ## What is the new behavior? Removes redundant static `variant="default"` from legacy `Button` and `ButtonTooltip` callsites. Keeps explicit defaults where they document the API: - `button-default.tsx` and `button-sizes.tsx` demos - `DocsButton`, which pins neutral styling at the wrapper boundary ## To test Studio: - [Auth → Rate Limits](https://studio-staging-2s957kwc4-supabase.vercel.app/dashboard/project/_/auth/rate-limits): dirty the form so Cancel appears; Cancel stays neutral, Save stays green - [Project Settings → API Keys](https://studio-staging-2s957kwc4-supabase.vercel.app/dashboard/project/_/settings/api-keys): `DocsButton` in the header actions stays neutral Design system: - [Design system → Button](https://design-system-git-dnywh-dc924ac1-supabase.vercel.app/design-system/docs/components/button): `button-default` / `button-sizes` still show explicit default styling; Primary (green) is restricted to the Primary section (and `asChild`) WWW: - [www → Brand assets](https://zone-www-dot-com-git-dnywh-dc924ac1-supabase.vercel.app/brand-assets): Download logo kit / Download button kit stay neutral |
||
|
Gildas Garcia
|
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> |
||
|
Joshen Lim
|
9a9228a9f8 |
Assistant panel maximize CTA to open in explorer only if explorer preview is enabled (#50203)
### Context As per PR title - currently the assistant panel's maximize CTA defaults to opening in explorer, which might be confusing for users who don't have the explorer feature preview enabled <img width="581" height="190" alt="image" src="https://github.com/user-attachments/assets/9a9b6129-164e-4e3e-a14e-66ecafe8e5ff" /> <img width="574" height="157" alt="image" src="https://github.com/user-attachments/assets/ffff0a49-3357-4e5f-8cc0-be2f94263128" /> <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **New Features** * Updated the AI assistant’s maximize control with context-sensitive actions. * When Explorer preview is enabled, the control opens the active conversation in Explorer. * When Explorer preview is disabled, the control maximizes or minimizes the assistant panel. * Updated the control’s label, accessibility text, and keyboard shortcut to reflect the available action. * Maximized AI Assistant panels now use the full available width, while other sidebars retain responsive sizing. * **Bug Fixes** * Improved sidebar behavior on mobile and overlay layouts to prevent unwanted resizing or collapsing. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
Francesco Sansalvadore
|
0bf22ee6fc |
chore(studio): update product naming (#50208)
workers -> compute <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit - **New Features** - Added the Compute experience for deploying, viewing, managing, and monitoring compute instances. - Added Compute navigation, instance detail pages, secrets, logs, deployment dialogs, generated snippets, and CLI commands. - Added filtering, status, availability, and data-loading support for compute instances. - **Updates** - Updated labels, icons, links, feature controls, unified logs, and secret-deletion messaging to use Compute terminology. - Compute routes now replace the previous Workers routes and pages. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
Alaister Young
|
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> |
||
|
Saxon Fletcher
|
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> |
||
|
Danny White
|
1131e3e2ce |
fix(ui): default Button variant to default instead of primary (#50160)
## What kind of change does this PR introduce? Bug fix / design-system alignment for the legacy `Button` from `ui`. ## What is the current behavior? Omitting `variant` on the legacy `Button` falls back to brand-green `primary`. That makes accidental greens easy, and it is hard to spot the real main action on busy pages. ## What is the new behavior? - Legacy `Button` now defaults to neutral `default` - Intentional primary CTAs (create, save, submit, marketing CTAs, and matching `ButtonTooltip` usages) now set `variant="primary"` so their appearance is unchanged - Neutral actions that previously relied on the old fallback (cancel, close, back, dashboard nav, and similar) become grey/white - Design-system docs updated; regression tests cover the new default `Button_Shadcn_` is unchanged. It already uses its own CVA default. This is PR 1 of 2 in a stack. PR 2 drops now-redundant `variant="default"` props. ## To test Studio (http://localhost:8082): - `/sign-in`: Sign in stays green - Open a project → Database → Tables: New table stays green - Auth → Users → Invite: Invite user stays green; Cancel / dismiss controls stay neutral - Project Settings → General: edit a field so Cancel and Save appear. Cancel is neutral, Save is green Design system (http://localhost:3003): - Components → Button: default demo is neutral; primary demo is green; featured preview is the default variant Marketing (optional): - www header: Start your project stays green; logged-in Dashboard is neutral <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit - **Style** - Buttons now default to a neutral style, while primary actions across Studio, documentation, marketing pages, forms, dialogs, and error states use prominent primary styling. - Updated button examples and previews clarify the distinction between default and primary variants. - Event registration now includes a directional arrow icon. - **Tests** - Added coverage confirming default button styling and explicit primary styling behave as expected. - Updated related test fixtures to use primary styling where appropriate. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
Kanishk Dudeja
|
b917b0e1bf |
feat(billing): adds non-dismissable modal for indirect tax declaration (#49643)
### Summary This PR adds a blocking dashboard modal for affected Australian customers to confirm their GST registration and business use of Supabase. KPMG requires us to collect this declaration from certain existing Australian customers. The backend now identifies organizations that still need to respond using `requires_indirect_tax_declaration` and stores their `yes` or `no` response in Orb customer metadata. It also supports email links with `submit_indirect_tax_declaration=true` and shows a dismissible confirmation when the organization has already responded. ### Testing #### Manual testing - Confirmed the modal appears for an affected organization without an existing response and cannot be dismissed. - Submitted both `yes` and `no` and confirmed the modal remains closed after a refresh. - Confirmed the declaration is stored without changing the customer's Tax ID. - Confirmed the modal does not appear for non admins/owners or organizations that do not require a declaration. - Confirmed the email-link parameter shows the already-submitted confirmation only for organizations that have responded, and is removed when dismissed. <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **New Features** * Added an indirect tax declaration dialog for eligible Australian organizations. * Users with billing permissions can select “Yes” or “No” and submit their declaration. * Added a dismissible confirmation for declarations submitted through a linked prompt. * The dialog requires an explicit response and provides guidance when no option is selected. * **Bug Fixes** * Declaration prompts remain visible through submission confirmation and close when dismissed. * Users without billing permissions do not see the dialog. * Success notifications no longer overlap with the confirmation dialog. <!-- end of auto-generated comment: release notes by coderabbit.ai --> --------- Co-authored-by: Julian Domke <68325451+juleswritescode@users.noreply.github.com> |
||
|
Joshen Lim
|
961fc749d4 |
Add feature preview banner toast for explorerd (#49606)
## Context Adds a feature preview banner toast for the explorer - flagged behind the configcat flag <img width="315" height="342" alt="image" src="https://github.com/user-attachments/assets/9dbd7ffd-02c6-4083-9ca0-266b862e1b5d" /> <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit - **New Features** - Added an Explorer preview banner to project layouts when the feature is enabled. - Added an “Enable Explorer” call-to-action that opens the feature preview. - Banner dismissal is remembered and persists across sessions. - Added telemetry tracking for banner dismissal and CTA interactions. - **Bug Fixes** - Improved banner behavior and stability when displaying database connection notifications. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
Joshen Lim
|
2d1a2ff9a2 |
Set up feature preview for explorer (#49602)
## Context Sets up the Explorer behind the feature preview modal + removes the temporary entry point from the SQL Editor Changes are still not live on production, so will only affect local + staging. Enabling the feature preview will replace the sidebar nav for SQL Editor to new Explorer (Icon remains unchanged, just the label) <img width="918" height="647" alt="image" src="https://github.com/user-attachments/assets/b088eb47-1176-4618-b345-d1ec0521b092" /> <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit - **New Features** - Added an “Explorer & Notebooks” feature preview with an overview image and direct access to Explorer or SQL Editor. - Added Explorer navigation when the preview is enabled. - **Improvements** - Updated desktop and mobile navigation to consistently display the available editor destination. - Improved the Explorer shortcut tooltip to clearly say “Go to Explorer.” - Organized SQL Editor previews under the Editors category. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
Danny White
|
bd02d7f297 |
feat(www + studio): broaden Select 2026 banner reach and soften www edges (#49569)
## What kind of change does this PR introduce? Feature polish for the Select 2026 promotion. ## What is the current behavior? - Studio only shows the Select Banner Stack card inside `ProjectLayout` (project routes). - www glyph fields read as hard rectangles on each side of the announcement banner. ## What is the new behavior? - Studio registers the Select banner from `AppBannerWrapper`, so it also appears outside project context (org / account surfaces). - www fields use per-row widths with edge alignment: top/middle shorter, bottom longer, growing inward from each side for a softer silhouette. https://github.com/user-attachments/assets/c5275967-63d0-40dd-a472-e3db08d1c39d ## To test - **Studio (non-project):** open an org home or account page on the deploy preview. Confirm the Select Banner Stack card appears in the usual stack and dismisses as before. - **Studio (project):** open any project route. Confirm the same card still appears and does not double-register. - **www:** open the marketing homepage. On `sm+`, confirm each side of the cream announcement bar has a 3-row field where the bottom row reaches further inward than the top, and the middle row is shortest. <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **New Features** * Added the Select 2026 promotional banner to eligible hosted Studio environments. * Banner visibility reflects promotion status, platform eligibility, loading state, and dismissal preferences. * **Style** * Refined decorative field layouts with improved row alignment, mirrored visuals, and flexible sizing. * **Bug Fixes** * Updated visibility behavior so the banner is no longer tied to being inside a specific project. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
Danny White
|
b5462ee7bb |
feat(www + studio): promote Select 2026 in www and Dashboard (#49511)
## What kind of change does this PR introduce?
Feature. Promotes Supabase Select 2026 across www and the Dashboard.
## What is the current behavior?
There is no active Select promotion on www or in the Dashboard.
## What is the new behavior?
- Adds a dismissible Select 2026 banner above the www navigation.
- Adds a low-priority Banner Stack card across hosted Studio project
pages.
- Shares a lightweight pixel lockup and CSS-only motion across both
surfaces, with light, dark, and reduced-motion treatments.
- Opens the application page in a new tab and automatically expires both
placements after October 2 in San Francisco.
## To test
- Open `/database` on the www preview. Confirm the banner is legible in
light and dark mode, the complete message remains visible at a phone
width, and the CTA opens `select.supabase.com` in a new tab.
- Dismiss the www banner, then refresh the page. Confirm it stays
dismissed.
- Open any `/project/{ref}` route in the Dashboard preview. Confirm the
Select card appears in the bottom-right Banner Stack behind
higher-priority notices.
- Dismiss the Dashboard card, navigate to another project page, and
confirm it stays dismissed.
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* Added a time-limited Select 2026 promotional banner across the website
and Studio.
* Added responsive themed artwork, animated visuals, campaign messaging,
and an external “Apply to attend” CTA.
* Banner dismissal preferences are saved and respected across visits.
* Promotion automatically disappears after the campaign ends.
* **Accessibility**
* Improved announcement dismissal controls with semantic buttons and
accessible labels.
* Added reduced-motion support for promotional artwork.
* **Bug Fixes**
* Improved product-card loading effects to prevent hydration
inconsistencies.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
|
||
|
Monica Khoury
|
d5ee11bea0 |
fix: hand off AI assistant to the project page in org view (#49477)
Fixes FE-4200, FE-4206. ## What is the current behavior? Submitting a support ticket from an org-level page (with no project in the URL) shows a "While you wait" AI assistant card. However, the assistant is built around project-scoped context from the URL, so making it work here required adding project-context fallbacks across several features. Two previous PRs addressed individual issues, but testing continued to surface the same underlying problem in other areas, including chat persistence, message rating, table browsing, and SQL editor actions. - **#49244** - **#49430** Rather than keep adding fallbacks, this PR removes the underlying context mismatch. ## What is the new behavior? When a support ticket is submitted from an org-level page, the "While you wait" card now links to the relevant project instead of trying to run the AI Assistant without real project context. The link opens the project with the AI Assistant sidebar and hands off the support ticket. The chat is created there, so project-scoped features like schema browsing, SQL actions, message rating, and chat persistence work natively without special-casing. If there’s no relevant project, the card isn’t shown. The ticket form also restores the "No specific project" option for cases where the auto-selected project isn't relevant. ## Additional context Also fixes ?sidebar= deep links not opening the sidebar after client-side navigation. LayoutSidebarProvider now reacts to URL param changes instead of only checking on initial load. ## How to test 1. Submit a project-related support ticket from an org-level page. 2. Confirm the "While you wait" card shows "Open Assistant in project". 3. Click it and confirm the correct project opens with the AI Assistant sidebar and support chat active. 4. Verify project-scoped features work, such as schema questions and Edit query / Run. 5. Refresh and confirm the chat persists. 6. Select "No specific project" and confirm no assistant card is shown. 7. Submit a ticket from a project support page and confirm the existing inline assistant behavior is unchanged. 8. Verify a project ?sidebar=ai-assistant deep link still opens the sidebar normally. <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **New Features** * Added support handoff links when a submitted ticket belongs to another project. * Handoff links securely preserve support request details without exposing them in the URL. * Opening a valid handoff link creates and selects a support chat with the submitted request context. * **Bug Fixes** * Improved sidebar behavior when URL state changes. * Project selector validation messages now remain visible. * Invalid, expired, or mismatched handoffs now fall back to a new chat and display an error message. * Handoff details are securely handled only once and cleared after use. <!-- end of auto-generated comment: release notes by coderabbit.ai --> --------- Co-authored-by: Claude Sonnet 5 <noreply@anthropic.com> |
||
|
Ayaan Gazali
|
18896e33de |
fix(studio): give two DropdownMenuTriggers asChild so they stop nesting buttons (#49264)
## 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. Two `DropdownMenuTrigger`s wrap a `Button` without `asChild`, so each renders a `<button>` inside a `<button>`. One of them also loses its `aria-label`, leaving an icon-only menu trigger with no accessible name. ## What is the current behavior? `DropdownMenuTrigger` forwards to `DropdownMenuPrimitive.Trigger`, which renders its own `<button>` unless `asChild` is set. So this: ```tsx <DropdownMenuTrigger> <Button variant="default" className="px-1" icon={<MoreVertical />} aria-label={`Open actions for ${hook.title}`} /> </DropdownMenuTrigger> ``` produces `<button><button/></button>`, which is invalid HTML, and puts the props on the inner element rather than on the thing that actually opens the menu. Measured by rendering `HookCard` before and after, rather than reasoning about it: | | before | after | | --- | --- | --- | | `container.querySelectorAll('button button').length` | 1 | 0 | | `aria-label` on `[aria-haspopup="menu"]` | `null` | `Open actions for Send Email` | That second row is the part worth caring about. The `aria-label` was written deliberately for a button whose only content is a `MoreVertical` icon, and it lands on the nested inner button instead of the trigger, so a screen reader gets no name for the control it actually operates. Two sites: - `components/interfaces/Auth/Hooks/HookCard.tsx`, the per-hook actions menu. This is the one with the orphaned `aria-label`. - `components/layouts/ProjectLayout/PauseFailedState.tsx`, the overflow menu next to "Download backup". ## What is the new behavior? Both get `asChild`, so the `Button` becomes the trigger. No nesting, and the props land where they were meant to. ## Additional context #48948 fixed exactly this in `RestoreFailedState.tsx`, which sits in the same directory as `PauseFailedState.tsx` and has the same overflow-menu shape. This is that fix applied to the two places it was not. I swept all 4398 `.tsx` files across studio, www, docs, design-system, ui-library, `packages/ui` and `packages/ui-patterns` for any Radix-style trigger (`DropdownMenu`, `Tooltip`, `Popover`, `Dialog`, `Sheet`, `AlertDialog`, `HoverCard`, `Collapsible`, `ContextMenu`, `Menubar`, `Select`, `Tabs`, `Accordion`) that wraps a button-like element without `asChild`. After discarding one false positive in `EdgeFunctionDetails.tsx`, where the `Button` is a sibling of `TabsTrigger` inside `TabsList` rather than its child, these two are the only ones left. So this should be the end of the pattern rather than the start of a series. No test added, matching what #48948 did for the same change. The `asChild` behaviour belongs to Radix, and a test asserting DOM nesting around two JSX attributes would be testing the library. I did verify it the other way round while developing: a throwaway render assertion failed on unmodified master with a nested-button count of 1 and a null trigger `aria-label`, and passed after the change. Happy to commit that assertion if you would rather have it in the suite. Gates: `test:prettier` passes repo wide, `typecheck --filter=studio --force` passes 9/9, `--filter studio run lint:ratchet` reports rules improved, and the tests covering both touched directories pass (18 files, 143 tests, including the `RestoringState` suite that came in with #48948). Freshman contributor. Found this with Claude Code's help by checking whether the `asChild` fix in #48948 had siblings, and I confirmed the nesting and the missing accessible name myself before touching anything. <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Bug Fixes** * Improved dropdown menu trigger behavior in the authentication hooks and project layout interfaces. * Existing buttons now correctly serve as menu triggers without changing available actions or menu behavior. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
Danny White
|
6ac5bf6b86 |
feat(studio): point replica deep links at Infrastructure and recommend compute (#48921)
## What kind of change does this PR introduce? Feature. Stack 5 of 5 (tip) for [PIPE-1007](https://linear.app/supabase/issue/PIPE-1007/move-read-replicas-out-of-replication-into-infrastructure). ## What is the current behavior? Selectors still open Replication with `destinationType=Read+Replica`. Compute eligibility actions leave the add-replica flow without carrying a recommended size into the Infrastructure form. ## What is the new behavior? DatabaseSelector and the SQL submenu open Infrastructure `?addReplica=true`. Change to Small/XL compute waits for the sheet to close, pre-selects that size, then focuses and scrolls the Infrastructure form to Compute without shifting the page footer. ## Additional context Last stack PR. [#49043](https://github.com/supabase/supabase/pull/49043) has merged. Please review, but do not merge until 2→4 are also approved. Then merge [#49044](https://github.com/supabase/supabase/pull/49044) → [#49045](https://github.com/supabase/supabase/pull/49045) → [#49046](https://github.com/supabase/supabase/pull/49046) → this PR in succession, and drop the `do-not-merge` labels. Update the read replicas getting-started doc in the same sitting so it points only at Infrastructure (it currently also links Database → Replication). Remaining stack: [#49044](https://github.com/supabase/supabase/pull/49044) → [#49045](https://github.com/supabase/supabase/pull/49045) → [#49046](https://github.com/supabase/supabase/pull/49046) → this PR ## To test `infrastructure:read_replicas` is an enabled-feature, on by default. There is no Feature Preview or ConfigCat switch. You should already see the Infrastructure Read replicas section. If you do not, your profile lists `infrastructure:read_replicas` in `disabled_features`. 1. [Infrastructure](https://studio-staging-git-dnywh-choreread-replicas-in-829a4b-supabase.vercel.app/dashboard/project/_/settings/infrastructure): topology, Read replicas, Scaling. 2. Add read replica. If blocked on compute, Change to Small compute: sheet closes, Small is selected and focused, the price footer is dirty, and no blank page gap appears. 3. From the SQL editor database selector, Add replica should open Infrastructure, not Replication. |
||
|
Jordi Enric
|
6c6ac567b1 |
feat(studio): workers list behind the workers flag (FE-4188) (#49193)
## What
The Workers list page at `/project/[ref]/workers`, behind
`useFlag('workers')`. Reads `GET /v2/projects/{ref}/workers`.
- Sidebar and command-menu entries, both hidden when the flag is off
- Name search, state and access filters, pagination
- Read-only
Gating, in order: flag off redirects to the project home; a 404 from the
API means the project is outside the alpha allow-list ("not enabled for
this project"); a 403 means the caller lacks the permission
(`NoPermission`); anything else is an `AlertError`.
`parseWorker` in `data/workers/workers.utils.ts` is the only place the
API shape becomes the view model. It validates with zod, so a drifted
response fails the query instead of half-rendering a row.
## How to test
Only on the **Mockamaster** project in staging — it is the one project
in the alpha allow-list, and standing a worker up anywhere else is
involved right now.
1. Staging dashboard → Mockamaster → **Compute** in the sidebar
2. Expect the `dashboard-test` worker: state `Active`, runtime Deno,
private, US West, 2 GB · 1 vCPU · 1 inst
3. Open any other project's `/workers` URL → "Compute is not enabled for
this project"
4. Turn the `workers` flag off → the sidebar entry disappears and the
URL redirects to the project home
Closes FE-4188
|
||
|
Ali Waseem
|
b6abae6abe |
fix(studio): only show restore completion once the restore has run (#48948)
Resolves [FE-4144](https://linear.app/supabase/issue/FE-4144/restore-flow-shows-completion-before-restore-is-actually-done) ## Problem `RestoringState` treated any `ACTIVE_HEALTHY` reading from the project status endpoint as "restore finished". Right after a restore is triggered the backend still reports the pre-restore status, so the first poll could land on `ACTIVE_HEALTHY` and flip the UI to "Restoration complete!" seconds into a restore that had barely started. `isCompleted` was local state nothing reset and polling stopped on that first reading, so the screen never self-corrected — "Return to project" then hung until a manual refresh. ## Changes - Gate completion on having observed the project leave the healthy state, so a stale pre-restore reading is no longer mistaken for a finished restore. - Keep polling through an unconfirmed healthy reading instead of stopping on it. - `onConfirm` clears its loading flag rather than relying on the layout to unmount the component. - Component tests covering both the premature completion and the stuck button. ## Needs validation Not yet verified against a real restore — please confirm on staging before merging. Worth checking in particular that a restore which completes normally still reaches the completion screen. There is one residual edge case left in place deliberately: if the details endpoint reports `RESTORING` while the status endpoint reports `ACTIVE_HEALTHY`, the UI now stays on "Restoration in progress" until the details query catches up. Fixing that properly needs an authoritative "restore initiated at" timestamp from the API, which does not exist today. <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit - **Bug Fixes** - Improved project restoration tracking to prevent completion from being reported prematurely. - Restoration now correctly detects failures and stops polling when appropriate. - Restore status and saved transition information are cleared after successful completion or failure. - Confirmation actions now remain reliable while project details refresh. - Restoring controls become usable again after the process finishes. - Improved the restore menu trigger behavior for more consistent interaction. <!-- end of auto-generated comment: release notes by coderabbit.ai --> --------- Co-authored-by: Alaister Young <10985857+alaister@users.noreply.github.com> |
||
|
Danny White
|
b3edaa02f0 |
feat(studio): remove unified logs banner and deprioritise tos banner (#49239)
## What kind of change does this PR introduce? Studio UI cleanup for sidebar BannerStack items and Unified Logs preview defaults. ## What is the current behavior? The sidebar BannerStack shows both a Unified Logs promo banner and a Terms of Service update notice. Unified Logs has been default opt-in for a while, and the ToS banner currently shares priority with other higher-value notices. The default opt-in behaviour is still gated behind the `unifiedLogsDefaultOptIn` feature flag. Closes [DEPR-646](https://linear.app/supabase/issue/DEPR-646/remove-unified-logs-banner-and-deprioritise-tos-banner). | Before | | --- | | <img width="1024" height="759" alt="5717" src="https://github.com/user-attachments/assets/1a19e6f6-0c7f-49e8-8e7e-9f83196b2353" /> | ## What is the new behavior? - Removes the Unified Logs BannerStack item and its component - Keeps the ToS update banner but lowers its priority so other banners surface first - Sets Unified Logs `isDefaultOptIn` to `true` and removes `unifiedLogsDefaultOptIn` flag usage ## To test - Open any project in Studio (e.g. `/project/<ref>`) - Confirm the sidebar BannerStack no longer shows the "Unified Logs is here" banner - If you have not dismissed the ToS notice and it is still before the expiry date, confirm it still appears but sits behind higher-priority banners (e.g. free micro upgrade on eligible projects) - Open `/project/<ref>/logs` and confirm Unified Logs loads by default for users who have not previously toggled the preview off ## After merge - [ ] Retire the `unifiedLogsDefaultOptIn` PostHog flag <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit - **New Features** - Unified Logs preview is now enabled by default when available, while preserving individual user choices. - **Bug Fixes** - Terms of Service update notifications now appear with higher priority. - **Changes** - Removed the Unified Logs promotional banner, including related navigation, dismissal, and tracking behavior. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
Joshen Lim
|
a7671019a8 |
Scaffold the explorer layout (#48740)
## 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 --> |
||
|
Saxon Fletcher
|
ad203ae277 |
Merge compute and disk into Infrastructure (#48370)
## Summary This is the final step in merging compute and disk with infrastructure to become a single place to manage everything. This moves everything we've done in compute and disk over to infrastructure along with redirects. - Makes Infrastructure canonical for the completed compute and disk configuration and usage charts. - Moves Service Versions to General Project Settings. - Removes the legacy Infrastructure activity implementation and constants. - Updates settings navigation, shortcuts, banners, billing links, warning CTAs, usage pages, support suggestions, and other internal entry points. - Adds the permanent `/settings/compute-and-disk` redirect, removes its Next and TanStack routes, regenerates the route tree, and updates the migration checklist. - Preserves query parameters and legacy metric anchors, including `#cpu`. ## Stack 1. #48368 2. #48369 3. #48370 (this PR) ## How to test 1. Check out `chore/infra-compute-3-cutover`. 2. Test the Next implementation with `pnpm dev:studio`, then stop it and test TanStack with `STUDIO_FRAMEWORK=tanstack pnpm dev:studio`. 3. In each implementation, open `/project/<ref>/settings/infrastructure`. Confirm the page contains the usage charts and the Scaling, Compute, Disk, and Advanced configuration sections. 4. Open `/project/<ref>/settings/general`. Confirm Service Versions appears there with its existing name, content, and styling, and no longer appears on Infrastructure. 5. Open `/project/<ref>/settings/compute-and-disk?upgrade=micro#disk`. Confirm it permanently redirects to `/project/<ref>/settings/infrastructure?upgrade=micro#disk`, preserving the query string and hash. 6. Confirm the settings menu exposes Infrastructure and no longer exposes Compute and Disk. Repeat with platform and self-hosted settings. 7. Follow representative entry points from billing usage, resource warning CTAs, upgrade banners, shortcuts, and support suggestions. Confirm they land on Infrastructure and preserve any query parameters or metric anchors such as `#cpu`. 8. Smoke-test compute and disk updates from Infrastructure, including validation, the sticky review footer, and warning/critical chart states. <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **New Features** * Consolidated compute and disk management under the **Infrastructure** project settings page. * Added a **Service versions** section to **General** project settings. * **Bug Fixes** * Updated links and upgrade CTAs across the product to route to the correct **Infrastructure** or **Service versions** destinations. * Added permanent redirects from legacy **Compute and Disk** to **Infrastructure**, preserving query/hash. * Improved resource warning upgrade routing for compute scenarios. * **Tests** * Expanded automated coverage for **Infrastructure**, **Service versions**, redirects, and warning-link routing. * **Chores** * Updated ESLint rule baseline configuration for the studio app. <!-- end of auto-generated comment: release notes by coderabbit.ai --> --------- Co-authored-by: Alaister Young <10985857+alaister@users.noreply.github.com> |
||
|
Joshen Lim
|
bb9e3d8168 |
Joshen/fe 3967 support top for postgres in self hosted and local (#48386)
## Context Allow self-host / local dashboard to access the "Observability" pages Currently only Query Performance will be accessible - eventually once Database Connections is publicly ready, it'll also be accessible here too <img width="518" height="312" alt="image" src="https://github.com/user-attachments/assets/18e5f6c7-ca77-4e90-81ec-c303bd31dc33" /> <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **New Features** * Navigation, sidebar, and mobile menus now consistently display **Observability** and **Logs** based on enabled features, including the unified logs preview. * **Observability** destinations now adapt to platform and settings so users land on the correct Query Performance view. * **Bug Fixes** * Improved Query Performance loading layout for a smoother loading experience. * Database selection is now shown only on supported platform environments. * **Tests** * Updated navigation/menu tests to match the new routing behavior. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
Alaister Young
|
ca2b50a0a7 |
chore(ui-patterns): collapse the admonition shim into ui-patterns/Admonition (#48377)
Follow-up to #48344: collapses the two resolution paths for the Admonition module into one. `src/admonition.tsx` was a back-compat shim re-exporting `src/Admonition/`. Two ways to resolve one module is exactly what produced the macOS self-import bug fixed in #48344, and the local typecheck errors that #48374 worked around. This removes the shim and standardizes on the PascalCase subpath, matching every other export in the package. **Changed:** - Codemodded all 246 `ui-patterns/admonition` imports to `ui-patterns/Admonition` (240 `.tsx`, 5 `.mdx`, 1 `.ts` across studio, docs, www, design-system, and lite-studio) - Pointed the 5 internal `'../admonition'` imports back at the `'../Admonition'` directory **Removed:** - `packages/ui-patterns/src/admonition.tsx`, and its `./admonition` entry in the exports map (regenerated with `pnpm gen:exports`) ## To test - `grep -r "ui-patterns/admonition" --include='*.ts*'` → no hits - `pnpm test:case-hazards` → passes - `pnpm typecheck` → all 15 tasks green - `pnpm --filter studio run lint:ratchet` → passes - `pnpm --filter ui-patterns vitest run src/Admonition` → 11 tests pass <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Bug Fixes** * Standardized Admonition component imports across the application and documentation. * Improved compatibility with case-sensitive environments by using the canonical component path. * Removed the legacy Admonition import entry point. <!-- end of auto-generated comment: release notes by coderabbit.ai --> --------- Co-authored-by: Alaister Young <10985857+alaister@users.noreply.github.com> |
||
|
Crispy
|
8c092185ae |
feat: paused project restore window copy and backup downloads (#48279)
Shows the restore deadline as a date on the paused-project screens, and offers backup downloads while a paused project is still restorable (previously only after the restore window ended). Depends on a backend change — keep as draft until that is live. <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **New Features** * Extended the paused-project restore window from 90 days to up to 1 year. * Added clearer, downloadable options for database backups and storage objects while a project is paused. * Paused-project screens now show an “available until” date when applicable (and updated resume guidance). * **Documentation** * Updated platform and troubleshooting guides to reflect the new 1-year restore window and post-window recovery limitations. * **Bug Fixes** * Standardized restore-window wording across the pause confirmation and paused-state UI. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
Danny White
|
6f6badae51 |
fix(eslint): promote require-explicit-tabindex to error (#48170)
## What kind of change does this PR introduce? Accessibility / lint hardening (Safari keyboard focus). ## What is the current behavior? `supabase/require-explicit-tabindex` is `'warn'`. Studio’s ratchet was at 0 but the rule was still ratcheted; www / docs / design-system still had raw `<button>` / `role="button"` call sites without an explicit `tabIndex`. [DEPR-627](https://linear.app/supabase/issue/DEPR-627) · follow-up to #47984 / #48040 ## What is the new behavior? - Shared config: `'supabase/require-explicit-tabindex': 'error'` - Swept www / docs / design-system (+ Studio test fixtures the ratchet skipped) - Removed the rule from the Studio ratchet + baselines ## To test Prefer **Safari**. This PR only adds explicit `tabIndex` to raw `<button>` / `role="button"` call sites — not links, and not controls that already go through `Button` from `ui`. ### Marketing (`www`) ([staging link](https://zone-www-dot-com-git-danny-depr-627-promote-req-7ae43c-supabase.vercel.app/)) - [x] Homepage frameworks / dashboard feature tabs — Tab through each tab button - [x] Product pages (e.g. `/auth`, `/database`) — section tab switchers - [x] Narrow viewport — open the hamburger; Tab through menu buttons - [x] `/partners/catalog` — filter / view controls - [x] Blog view toggle (list ↔ grid) ### Docs ([staging link](https://docs-git-danny-depr-627-promote-require-explici-25e46d-supabase.vercel.app/)) - [x] **Desktop (≥ lg):** top-right **⋯ menu** (hamburger icon) — opens a dropdown that includes Theme. Not a separate theme button. - [x] **Mobile (< lg):** top-right **hamburger** opens the sheet; close (X) is the raw button we tagged. Theme inside the sheet uses `ThemeToggle` / `DropdownMenuTrigger` from `ui` (already supposed to set `tabIndex`). - [x] **Code blocks** — copy / language controls - [x] **Is this helpful?** — X / check are `Button` from `ui` (should already Tab). After voting **while signed in**, the follow-up “What went well?” / “How can we improve?” text button is the raw one we tagged. - [x] **AI Tools → Copy as Markdown** (right rail on a guide) — this is the only GuidesSidebar control this PR changed. “On this page” TOC items are **links**, not covered by this lint. - [x] **Reference docs** (e.g. JS client reference) — section headers that expand/collapse in the left nav (`Collapsible.Trigger`) - [x] **Troubleshooting index** — type in the search field, then Tab to the **clear (X)** control ### Dashboard (`studio`) No production UI changes in this PR (tests + lint config only). Quick Safari smoke that prior tabindex work still holds: - [x] Project sidebar — Tab through primary nav links - [x] Settings → General — Tab through inputs / buttons - [x] Storage → Files — Tab a bucket row / file actions |
||
|
Danny White
|
e3d7267845 |
fix(studio): chip away explicit-tabindex ratchet debt (#48040)
## What kind of change does this PR introduce? A11y cleanup follow-up to #47984 / [DEPR-626](https://linear.app/supabase/issue/DEPR-626). ## What is the current behavior? Studio had 82 ratcheted `supabase/require-explicit-tabindex` violations (raw `<button>` / `role="button"` without explicit `tabIndex`). ## What is the new behavior? - Explicit `tabIndex={0}` (or disabled → `-1`) on those Studio call sites across nav, `components/ui`, Database, Storage, and the remainder - Ratchet baseline cleared (**82 → 0**) and the rule **removed from the Studio ratchet** (debt is gone; ratchet is temporary) - Rule remains a shared **`warn`** for now — promoting to `error` (and sweeping www/docs/design-system) is a follow-up - Also fixed the learn/ui-library call sites that surfaced while experimenting with error promotion - Small follow-ups where making controls focusable exposed gaps: accessible names, disabled/focus consistency, focus-ring polish on To-test surfaces, home section `KeyboardSensor`, and an E2E locator tightened after `aria-label="Remove column"` Prefer migrating to `Button` from `ui` in future touch-ups; this PR takes the minimal path so Studio debt can stay at zero. ## Additional context Batches landed together so baseline conflicts stayed simple while chipping away: - Hotspots / nav (FirstLevelNav, Marketplace, AttachmentUpload, Column, Tabs, …) - `components/ui` shared - Database + Storage - Remainder **Out of scope / intentional deferrals** - Promoting `supabase/require-explicit-tabindex` to a lint **error** (follow-up after www/docs/design-system sweeps) - Tabs/Radio roving, tooltips, context menus, in-menu items - Full keyboard-accessible tab-close UX (close stays hover + `tabIndex={-1}`; context menu still closes tabs) - Data API docs links (`/project/<ref>/api` redirect) **Reviewer notes** - Rule only flags raw `<button>` / `role="button"` without a `tabIndex` prop. `Button` from `ui` already bakes this in - `tabIndex={-1}` is intentional for disabled controls, in-menu / roving-focus children, and hover-only tab close - For dnd-kit grips, put `tabIndex` **after** `{...attributes}` so it isn’t overwritten (TS2783) ### To test Use **Safari** with macOS Keyboard navigation **off** (System Settings → Keyboard). Chrome once for a sanity pass. For each surface below: Tab until the control is focused, then activate with Enter/Space where relevant. 1. **API Docs side panel** (Table Editor → open a table → **API docs**) - Floating API Docs panel — **not** `/project/<ref>/api` (that redirects to Data API docs; language ToggleGroup uses arrow keys; links are out of scope) - Left nav buttons — Tab through several and activate one; active highlight / navigation still works 2. **Integrations → Marketplace** - Enable **Integrations layout** feature preview first (avatar menu → Feature previews) - `/org/<slug>/integrations` or project integrations marketplace - “Clear all”, grid/list toggles — Tab + activate 3. **Table Editor → create a table → Columns** - Drag handles only appear while **creating** (not when editing an existing table) - Tab to grip / remove (X) / sensitive-data eye if shown 4. **Project Home** — section drag handles - Tab to a grip (visible focus ring) - Optional: Space to pick up, arrows to move, Space/Esc to drop (KeyboardSensor added) - Mouse dnd still works 5. **Storage → Policies** — expand/collapse bucket list chevron (design-system focus ring, no stuck grey open bg) 6. **Support form** (Help → Support) — attachment remove (×) and add-attachment control when visible Disabled controls should be **skipped** by Tab. <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Accessibility Improvements** * Improved keyboard navigation throughout Studio by explicitly managing focus (`tabIndex`) across many interactive controls (menus, tabs, tables, charts, dialogs, navigation, and form actions). * Disabled or non-interactive controls are now removed from the tab order (or made unfocusable), while available actions remain reachable. * Ensured `type="button"` on relevant controls to prevent unintended submissions, and refined keyboard focus behavior for various toggles and copy/remove actions. * **Chores** * Updated the ESLint rule baseline configuration to match the new focus behavior. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
Joshen Lim
|
22b3419a28 |
Extract project creation form into its own component (#47957)
## Context This is just a pre-requisite to consolidating the project creation UI as there's another page that has the project creation flow too [here](https://github.com/supabase/supabase/blob/master/apps/studio/pages/integrations/vercel/%5Bslug%5D/deploy-button/new-project.tsx). So the next step will just be to use the same `ProjectCreationForm` there No functional changes here - just moving things around ## To test - [ ] Verify that project creation still works <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **New Features** * Added a full “create project” experience with eligibility-aware defaults, advanced configuration sections, optional GitHub integration, and compute-cost confirmation when applicable. * **Improvements** * Enhanced project-creation success/error handling and navigation. * Refined CLI backup/restore dialogs (better layout/wording, accessibility updates, and improved section separation). * **Documentation** * Standardized all relevant documentation links across the app using a shared `DOCS_URL` source. * **Refactor** * Refactored the “New Project” page to delegate the wizard UI and flow to a reusable creation component. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
Joshen Lim
|
72d623f1b7 |
Joshen/fe 3775 create a larger assistant workspace for observability (#47954)
## Context Supports maximising the AI assistant to fit the content width which will provide a larger workspace for observability work for example <img width="424" height="179" alt="image" src="https://github.com/user-attachments/assets/f2b84571-0188-4d94-9798-a289496ab543" /> <img width="1388" height="960" alt="image" src="https://github.com/user-attachments/assets/07f52b1f-7b95-4d67-9a5c-151ef036fc7c" /> ## To test - [ ] Can maximize/minimize AI Assistant - [ ] Swapping to another sidebar should bring the panel size back to previous - Only the AI Assistant can be maximized (for now at least) <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **New Features** * Added maximize/minimize controls for the AI assistant panel. * Added a keyboard shortcut to quickly maximize the assistant (hidden from settings). * **Improvements** * The main content panel now collapses/resizes automatically based on assistant maximization. * Switching away from the AI assistant now automatically exits maximized mode; returning restores the maximized experience. * Updated the assistant header UI with dynamic label/icon/accessibility and a maximize shortcut when chat isn’t loading. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
Danny White
|
805aee289e |
fix(studio): color regressions after theme update (#47794)
## What kind of change does this PR introduce? Bug fix + small shared component ## What is the current behavior? After the recent colour system changes, several UI elements lost contrast in light mode: - `InfoIcon` with a background appeared as a flat grey circle (glyph fill matched the background) - Several buttons forced `text-white`, which no longer contrasts correctly against the updated brand fills - Selected / completed check badges were inconsistent between call sites ## What is the new behavior? - `InfoIcon` uses `text-background` for the glyph fill so the "i" is visible against the grey circle - www primary buttons drop hardcoded `text-white` and use standard `Button` colours - New shared `SuccessCheck` in `ui` for selected state and completion progress (green circle; white check in light mode, black check in dark mode) - Documented in the design system with selected + progress examples Note on `InfoIcon`: [#47933](https://github.com/supabase/supabase/pull/47933) landed a related fix using `text-background-200` (`--card`). This PR keeps `text-background` instead, to match `CheckIcon` / `EyeOffIcon` in the same file and avoid the legacy alias. | Before | After | | --- | --- | | <img width="688" height="268" alt="CleanShot 2026-07-10 at 11 30 25@2x" src="https://github.com/user-attachments/assets/c0276b0c-1023-46c8-805c-35a22def1353" /> | <img width="664" height="278" alt="CleanShot 2026-07-10 at 11 29 43@2x" src="https://github.com/user-attachments/assets/3508cf37-1b48-4fb7-a939-83522feb44f1" /> | | <img width="468" height="550" alt="CleanShot 2026-07-10 at 11 31 04@2x" src="https://github.com/user-attachments/assets/acd42273-15ce-4fb2-9d0c-5a43ac23073c" /> | <img width="460" height="540" alt="CleanShot 2026-07-10 at 11 32 50@2x" src="https://github.com/user-attachments/assets/f66fb4bc-81f7-4df1-95f5-63980c4e8537" /> | ## To test Use the staging preview link from this PR and check the following in **light mode** (and spot-check dark mode): **www** - Visit `/404` — "Head back" button should have readable text (not white-on-green) - Visit `/company` — "Join the team" button in the Team section - Visit a product page with a hero CTA (e.g. `/database`, `/realtime`) — primary "Start for free" button **studio** - Database → Replication → deploy a read replica — footer `InfoIcon` next to the pricing line should show a visible "i" inside the grey circle - `/redeem` — select an org; green `SuccessCheck` should match light/dark contrast (white check / black check) - Settings → API → service role key row — red "secret" tag text should be readable **design system** - `/docs/components/success-check` — demo, selected-state, and progress examples |
||
|
Joshen Lim
|
88f3173920 |
Remove home page skeleton loader, improve base loading behaviour (#47903)
## Context The project's home page has been updated for a while now, but the skeleton loader is still showing the old layout Am opting to remove the skeleton loader entirely and instead improve the loading state of the base UI - adjusts some heights to minimize layout shifts <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Improvements** * Added shimmer loading for project titles while project details are loading. * Refined project connection dropdown behavior: improved URL display/truncation, adjusted dropdown alignment, and more reliable option selection (disabled items remain unavailable). * Streamlined the project page’s loading and transition experience across different project states. * **Tests** * Updated the connect E2E scenario to interact with the Connect sheet via its accessible label before selecting the ORM option. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
Jordi Enric
|
dbdbe1540b |
fix(studio): make paused project messaging easier to scan DEPR-581 (#47807)
## Problem The free-plan paused project notice was a dense paragraph, so the key points (data is safe, resume window, download-after-expiry, upgrade) were easy to skip. ## Fix Present those points as a scannable bullet list, keeping the dynamic day-count tooltip, restore-deadline timestamp, and the existing Pro-wording variant. Also adds a "Project Status" tab to the dev toolbar (local and staging only) with a select for forcing the current project's status, so the paused state and other statuses are easy to preview without touching the backend. It overrides the status in the React Query cache and reverts on close, project navigation, or reset. ## How to test - Run Studio locally against the platform API - Open the dev toolbar, go to the Project Status tab, and select INACTIVE - Navigate to a project page and confirm the paused screen renders - On a free-plan org, confirm the notice now shows the details as bullet points with the day-count tooltip and restore-deadline date intact - Click "Reset to real data" (or close the toolbar) and confirm the status reverts <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **New Features** * Added a development toolbar “Project Status” tab to simulate project status and pause states in non-production environments. * Status and pause-state overrides persist locally, can be reset, and are reflected across project detail and paused-state views. * **Style** * Refined paused-project messaging: updated the heading and reworked the free-plan explanation into bullet points, while keeping paid-plan messaging paragraph-based for readability. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
Joshen Lim
|
073cada53a |
Fix observability custom reports menu item (#47759)
## Context More action button should be flushed to the right here <img width="294" height="156" alt="image" src="https://github.com/user-attachments/assets/65017960-3edb-4268-bb0e-1e2c26937d4b" /> ## Changes involved - Adjust `Menu.Item` in `packages/ui` to use a `div` instead of a `span` - Was otherwise causing HTML validation issues as we were trying to nest a `div` within a `span` - Having a `div` is a bit more flexible as well since `Menu.Item` expects `children` to be of any type (e.g a react node) <img width="279" height="149" alt="image" src="https://github.com/user-attachments/assets/12730cef-b077-4ef4-93c9-c21def939888" /> <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Refactor** * Standardized the Observability menu component to use named exports, ensuring consistent usage across the app. * Updated the mobile observability menu registration to reference the correct exported component. * **Style** * Refined Observability menu item layout, spacing, truncation, and dropdown sizing for a cleaner presentation. * Enhanced menu item rendering to allow custom `className` styling and full-width content layout. * **Accessibility** * Added an aria-label to the “more actions” button for improved screen reader support. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
Ali Waseem
|
3fcf980b0a |
fix(studio): batch of production Sentry crash fixes (array/null guards) (#47460)
Fixes a batch of production Studio crashes from Sentry (all caught by the global error boundary). Most are missing array/null guards where an endpoint typed as an array — or with a nested array field — returned a non-array body in production; a few are one-off render crashes. Resolves FE-3748. ## Issues fixed | Sentry | Error | Fix | | --- | --- | --- | | [J7R](https://supabase.sentry.io/issues/7492997940/) | Maximum update depth exceeded | Disable RadialBar animation in disk-cooldown countdown | | [JR5](https://supabase.sentry.io/issues/7548484681/) | resourceWarnings.find is not a function | Guard in ResourceExhaustionWarningBanner | | [JCJ](https://supabase.sentry.io/issues/7506024989/) | resourceWarnings.find is not a function | Guard in ProjectLayout + normalize query | | [K1Y](https://supabase.sentry.io/issues/7584792331/) | snippet.name on undefined | Optional-chain SQL editor download filename | | [B3K](https://supabase.sentry.io/issues/7141649636/) | pagination.count on undefined | Guard pagination in projects infinite query | | [JVP](https://supabase.sentry.io/issues/7560437621/) | schemas.some / extensions.find | Coerce pg-meta lists to arrays in useInstalledIntegrations | | [JR2](https://supabase.sentry.io/issues/7548339272/) | extensions.find is not a function | (same fix as JVP) | | [JQR](https://supabase.sentry.io/issues/7547163939/) | lints.filter is not a function | Normalize project lints query | | [JR3](https://supabase.sentry.io/issues/7548433501/) | entitlements.find is not a function | Guard call sites + normalize entitlements query | | [JQS](https://supabase.sentry.io/issues/7547557098/) | selected_addons.find is not a function | Normalize addons query arrays | <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Bug Fixes** * Improved stability across several Studio screens by handling missing or unexpected data more safely. * Downloads now use a fallback name when a snippet name isn’t available. * Project, entitlement, schema, addon, warning, and extension views are less likely to break when data is missing or not in the expected format. * Pagination and countdown visuals now behave more consistently, with reduced chance of runtime errors or animation-related glitches. <!-- end of auto-generated comment: release notes by coderabbit.ai --> --------- Co-authored-by: Ivan Vasilov <vasilov.ivan@gmail.com> |
||
|
Gildas Garcia
|
b30db91d71 |
chore: cleanup UI patterns exports (#47406)
## Problem We now export components under a subpath in ui-patterns to avoid barrel files as they slow down every tools (from IDE to linters, etc.) and may also affect bundles our users have to download. ## Solution - Remove the UI patterns index file - Fix invalid impors |
||
|
Gildas Garcia
|
c6fc456910 |
chore: cleanup duplicate exports studio (#47387)
## Problem Knip reports many duplicate exports (both named and default). Besides, we're moving away from default exports and even have an eslint rule to enforce it on new code. ## Solution - Cleanup those exports - Update imports when necessary No functional changes. If it builds, it's fine |
||
|
Charis
|
5cb81123ae |
refactor(studio): move SQL editor save trigger into a scheduler + provider (5/9) (#47316)
## What
PR 5 of a stacked refactor. Moves *when to save* out of a module-load
`subscribe` and into an injectable **scheduler** armed by a headless
**provider**, splits the save queue, and adds an unsaved-close warning.
### Scheduler (`sql-editor-save-scheduler.ts`)
`createSaveScheduler({ state, saveMechanism, notify, getSaveMode })`
owns the save *policy*:
- **auto** mode drains the dirty snippet queue as edits land; **manual**
mode (the seam for a future opt-in; defaults to `auto`) leaves snippets
queued until `requestSave`. Folder saves always drain.
- `start()` returns an unsubscribe; `requestSave(id)` is the
explicit-save entry.
### Provider (`sql-editor-save-coordinator.tsx`)
Headless `SqlEditorSaveCoordinatorProvider` instantiates the mechanism
(invalidation via the **React Query client from context**, not the
global `getQueryClient`) + scheduler, `start()`s it in an effect
(start/stop with the provider), and exposes `requestSave` via
`useSqlEditorSaveCoordinator()`. Mounted in `ProjectContext` (under the
app's QueryClientProvider). Cmd+S and the SavingIndicator Retry now go
through `requestSave`.
### Queue split
`needsSaving` (snippets) and `pendingFolderSaves` (folders) are separate
queues, drained independently — the old snippet-vs-folder `if/else` is
gone.
### Unsaved-close warning
A `beforeunload` guard triggers the browser's native "Leave site?"
prompt while any snippet's `status !== 'saved'` (failed / in-flight /
never-saved).
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* Improved SQL editor saving with a centralized save flow, including
automatic/manual save handling and immediate “Save Query” requests.
* Added unsaved-change detection so the app can warn before closing or
reloading when edits are still pending.
* **Bug Fixes**
* Retry actions now use the updated save flow for more reliable
re-saving.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
|
||
|
Joshen Lim
|
2bac064adf |
Joshen/fe 3697 progressively default opt in to unified logs (#47296)
## Context We're progressively opting in users to use the new Unified Logs UI 🙂🙏 ## Changes involved - [ ] Removed flag for controlling visibility of unified logs feature preview - [ ] Added flag for controlling default opt in behaviour of unified logs - [ ] Small tweak to Unified Logs banner is default opted in (Just show "New" and more info CTA) - Disabling, then enabling again will thereafter show the existing "Go back to old logs CTA" <img width="290" height="166" alt="image" src="https://github.com/user-attachments/assets/a2c46ce1-63c3-490c-bc7d-fc1254982dbe" /> <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **New Features** * Unified Logs preview now derives default opt-in state from a new default-opt-in flag and exposes `isDefaultOptIn`. * **Bug Fixes** * Removed eligibility-based gating so the “Beta” badge and Unified Logs banner render consistently across logs screens. * Unified Logs banner was refactored to handle enable/disable and navigation internally, while remaining shown unconditionally. * **Tests** * Updated mocks and assertions to reflect the revised preview/banner enablement and dismissal logic. <!-- end of auto-generated comment: release notes by coderabbit.ai --> --------- Co-authored-by: Alaister Young <10985857+alaister@users.noreply.github.com> |
||
|
Gildas Garcia
|
f34aa108d5 |
chore: dead code cleanup (#47294)
## Problem There's still more unused code in the repository which slows down everything: - checkouts - tooling - probably builds (not sure how good turbopack is at handling this) ## Solution - remove old unused code - remove more recent code after checking git history to ensure it's not unfinished/ongoing work <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Chores** * Removed several unused interface, onboarding, and helper components from the studio app. * Cleaned up outdated branching, integrations, query performance, support, and table/grid UI elements. * Removed a few unused utility hooks and key-mapping logic. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
Gildas Garcia
|
7f1298e35e |
chore: dead code cleanup (#47129)
## Problem We have many unused files, left overs from features refactoring ## Solution - Remove unused files - Move some files closer to their usage <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Refactor** * Removed multiple legacy Studio UI components and placeholders to streamline the interface (including onboarding panels, navigation elements, docs layout helpers, and various UI building blocks). * **UI Updates** * Updated the layout’s API keys section to use the Project-specific presentation. * **Maintenance** * Adjusted internal sourcing for documentation tab menu logic without changing visible behavior. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
Gildas Garcia
|
96d43099bb |
chore: refactor Button API so that it can be used a standard button (#46880)
## Problem Our `<Button>` component breaks the default `button` contract by redefining the `type` prop to set its variant (`primary`, `default`, etc) instead of the button type (`submit`, `button`, etc). This is confusing and forces to write more code when using it with shadcn components that expect/inject the standard button props. ## Solution - rename the `type` prop to `variant` - rename the `htmlType` prop to `type` - propagate the changes where necessary - format code ## How to test As this is just prop renaming, if it builds it's ok --------- Co-authored-by: Ivan Vasilov <vasilov.ivan@gmail.com> |
||
|
kemal.earth
|
3162cad715 |
feat(studio): add a banner to promote unified logs (#46847)
## 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? Adds a one time banner to the `<BannerStack />` to promote Unified Logs becoming available. This also fixes the `<BannerStack />` components issue with stacking varying height banners. https://github.com/user-attachments/assets/40f02709-0d67-43a9-ab95-750d9a4a582a <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **New Features** * Added a dismissible "Unified Logs" banner with an animated sample-log carousel, CTA to Unified Logs, and a preview/enable flow for non-enabled users. Dismissal is persisted locally and telemetry is recorded for CTA and dismiss actions; banner appears only for eligible projects. * **Refactor** * Banner stack UI updated to display a single front banner with animated "peek" slivers and refined hover/animation behavior. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
Vaibhav
|
0957932b1d |
fix: reset scroll (#46553)
- closes https://github.com/supabase/supabase/issues/46548 <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Bug Fixes** * Main content now reliably scrolls to the top when navigating between project sections. * **Tests** * Updated tests to cover the updated scroll behavior and context handling. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
Jordi Enric
|
776381ea98 |
feat(studio): organization audit log drains settings O11Y-1685 (#46614)
## Problem
Log drains were only available per project. Organizations had no way to
export their platform audit logs to a third party destination, which had
to be set up manually through the API.
## Fix
Add a self-serve "Audit Log Drains" page under Organization Settings
(Compliance section) that reuses the existing log drains destination UI
at the org scope.
- Extract a presentational `LogDrainsList` shared by the project and org
containers, with no behavior change to the project page.
- Make `LogDrainDestinationSheetForm` presentational via
`existingDrainNames` and `onSaveClick` props, removing its project-only
data and telemetry coupling.
- Add org-scoped data hooks (list, create, update, delete, test
connection) calling
`/platform/organizations/{slug}/analytics/audit-log-drains`, gated by
the `audit_log_drains` entitlement.
- Add the page, nav entry and a keyboard shortcut, all gated behind the
`auditLogsLogDrain` feature flag and `IS_PLATFORM`.
The org audit log drain endpoints are not yet present in the generated
API types, so the new hooks use a localized `// @ts-ignore` (matching
the existing project log drain hooks) until the types are regenerated.
## How to test
- Open `/org/{slug}/audit-log-drains` on an org with the
`audit_log_drains` entitlement.
- Create an S3 and a webhook destination, confirm the cost dialog, then
delete one and test a connection.
- Confirm the list refreshes and that the existing project Log Drains
page is unchanged.
- Confirm the page and nav entry are hidden when the flag is off.
## Notes
- Verified locally: org data hook tests and the org settings nav
shortcut tests pass. Full typecheck, lint and the component test suite
should be run in CI, since this sandbox has an incomplete dependency
install.
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* Audit Log Drains management in organization settings: add, update,
test, and delete destinations; new Audit Log Drains page and navigation
shortcut.
* **Improvements**
* New consolidated list view with clearer loading, error, empty and
populated states.
* Feature-flag driven display of available drain types.
* Form validation prevents duplicate names and supports save callbacks
with telemetry on save.
* **Tests**
* Added tests covering listing, create/update/delete, testing, and form
validation.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
---------
Co-authored-by: Claude Opus 4.8 <noreply@anthropic.com>
|
||
|
Danny White
|
b2b5cba287 |
feat(studio): add organization shortcuts (#46356)
## What kind of change does this PR introduce? Feature. Resolves FE-3470. ## What is the current behavior? Organization surfaces have a `G then ,` shortcut to enter org settings, but once inside there is no keyboard navigation, sidebar tooltips, or action shortcuts for the various org pages. | Area | Current behaviour | | --- | --- | | Org Settings sidebar | Routes are click-only once users are inside Settings. | | OAuth Apps | Publish / confirm actions have no keyboard shortcuts. | | Private Apps | Create app has no keyboard shortcut. | | Team | Invite / send actions have no keyboard shortcuts. | | Integrations | Add project connection has no keyboard shortcut. | | Org Projects | New project and search have no keyboard shortcuts. | | Audit Logs | Refresh has no keyboard shortcut. | ## What is the new behavior? Mirrors the Project Settings shortcut pattern (#46352) across all Organization surfaces. | Area | New shortcut coverage | | --- | --- | | Org Settings sidebar | `S then G/C/S/A/P/W/L/D` for General, Security, SSO, OAuth apps, Private apps, Webhooks, Audit logs, Legal documents. Shortcut badge appears on hover in the sidebar. | | Org Settings entry | `G then ,` (remapped from `G then O`) to match the Project Settings chord. | | OAuth Apps | `Shift+N` opens Publish app panel; `Mod+Enter` confirms the open panel. | | Private Apps | `Shift+N` opens Create app sheet (works in both empty-state and list-state). | | Team | `Shift+N` opens Invite members dialog; `Mod+Enter` sends the invitation(s). | | Integrations | `Shift+N` triggers Add project connection when permitted. | | Org Projects | `Shift+N` navigates to new project; `Shift+F` focuses the search input. | | Audit Logs | `Shift+R` refreshes the log list. | ### Implementation notes - Threads `shortcutId` through the `WithSidebar` pipeline (`SidebarLink` → `SubMenuSection` → `ProductMenuGroup`) so tooltip display is automatic — no new rendering logic. - Layout-scoped chords mount only while `OrganizationSettingsLayout` is active, so `S then G` in org settings does not conflict with `S then G` in project settings. - Cheatsheet reference groups promoted to typed constants with readable labels (was: bare strings like `'org-oauth-apps'`). <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **New Features** * System-wide keyboard shortcuts for org areas: project search & new project, private app creation, OAuth app publish/confirm, add GitHub integration, invite members (open/submit), and refresh audit logs. * Sidebar and product menu now show assigned shortcuts for faster navigation; org settings navigation shortcut remapped. * **Tests** * Added coverage for org shortcut registry behavior, sequences, and ordering. * **Chores** * New shortcut reference groups and ordering for improved discoverability. <!-- review_stack_entry_start --> [](https://app.coderabbit.ai/change-stack/supabase/supabase/pull/46356?utm_source=github_walkthrough&utm_medium=github&utm_campaign=change_stack) <!-- review_stack_entry_end --> <!-- end of auto-generated comment: release notes by coderabbit.ai --> --------- Co-authored-by: Claude Sonnet 4.6 <noreply@anthropic.com> Co-authored-by: Ali Waseem <waseema393@gmail.com> |
||
|
Alaister Young
|
7e9badc6b8 |
chore(studio): migrate useStaticEffectEvent to React 19 useEffectEvent (#46415)
Studio is on `react@^19.2.6`, and `useEffectEvent` shipped stable in React 19.2 with the same signature as the userland polyfill. This drops the local hook in `apps/studio` and `apps/www` in favor of the built-in. **Removed:** - `apps/studio/hooks/useStaticEffectEvent.ts` - `apps/www/hooks/useStaticEffectEvent.ts` - `.claude/skills/use-static-effect-event/` — skill is obsolete **Changed:** - 26 call sites: dropped the `useStaticEffectEvent` import, added `useEffectEvent` to the existing `react` import, renamed call sites - `.claude/CLAUDE.md`: `apps/studio` row updated React 18 → React 19 - `.claude/skills/vercel-composition-patterns/SKILL.md`: removed stale "Studio uses React 18, skip these patterns" warning ## To test - `pnpm typecheck --filter=studio` — passes locally - `pnpm typecheck --filter=www` — passes locally - `grep -rn "useStaticEffectEvent"` returns nothing outside `node_modules` - Smoke-test areas that use the hook: schema visualizer edges (intersection check), spreadsheet import, sign-in/CLI login flows, side panels with unsaved-changes prompts **Out of scope:** pre-existing Tailwind lint warning on `DefaultEdge.tsx:141` (`outline` + `outline-1` conflict) — unrelated to this migration <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Refactor** * Internal event handling migrated to React’s built-in event hooks across the Studio app; no user-facing changes. * **Documentation** * Clarified React 19 compatibility and noted Studio now targets React 19. * Removed obsolete documentation for a deprecated internal hook. <!-- review_stack_entry_start --> [](https://app.coderabbit.ai/change-stack/supabase/supabase/pull/46415?utm_source=github_walkthrough&utm_medium=github&utm_campaign=change_stack) <!-- review_stack_entry_end --> <!-- end of auto-generated comment: release notes by coderabbit.ai --> --------- Co-authored-by: Alaister Young <10985857+alaister@users.noreply.github.com> |
||
|
Pamela Chia
|
47c084e51d |
refactor(studio): migrate telemetry to useTrack (#46140)
## Summary
I migrated every `useSendEventMutation` call site in `apps/studio` to
`useTrack`, deleted the legacy hook, and added a lint guardrail so it
can't return. `useTrack` is the type-safe replacement: it auto-injects
`groups: { project, organization }` from the selected project/org and
types `action` + `properties` against `TelemetryEvent`. Existing call
sites built groups manually and were not type-checked at the action
level. The migration covers 81 files (60 trivial swaps, 9 org-only, 3
pre-auth, 5 bespoke, 4 test mocks).
## Changes
- Migrated trivial call sites across `pages/project/[ref]`,
`components/interfaces/*` (Reports, Storage, Realtime/Inspector,
SQLEditor, Functions, EdgeFunctions, Integrations, ProjectAPIDocs,
Branching/BranchManagement, TableGridEditor, Connect, Docs, Auth,
Support, Home, ProjectHome, App), `components/layouts/*`, and
`components/ui/*`.
- Migrated org-only sites (`Organization/Documents/*`,
`Organization/BillingSettings/Subscription/*`,
`Organization/SecuritySettings.tsx`,
`Account/Preferences/DashboardSettingsToggles.tsx`) by dropping the
manual `groups: { organization: ... }` and letting `useTrack`
auto-inject. Verified `useSelectedProjectQuery` is disabled on org
routes (gates on URL `[ref]`).
- Migrated pre-auth sites (`SignInForm.tsx`, `sign-in-mfa.tsx`,
`profile.tsx`) where neither project nor org is resolved.
- Bespoke handling:
- `execute-sql-mutation.ts` and `table-row-create-mutation.ts`: pass `{
project: projectRef }` via `groupOverrides` since the mutation can
target a non-selected project ref.
- `useStudioCommandMenuTelemetry.ts`: kept a direct `sendTelemetryEvent`
call because studio groups must override pre-built event groups
(opposite of `useTrack`'s override direction).
- `AIAssistantOption.tsx`: passes sentinel-aware `groupOverrides` so
`NO_PROJECT_MARKER`/`NO_ORG_MARKER` continue to suppress group emission.
- `SidePanelEditor.utils.tsx`: utility functions `createTable` and
`updateTable` now take a `track: Track` parameter (threaded from
`SidePanelEditor.tsx`); dropped the `organizationSlug` arg since groups
are no longer assembled manually.
- Branch-event attribution: preserved `parentProjectRef` overrides on
`branch_updated`, `branch_merge_completed`, `branch_merge_failed`,
`branch_merge_submitted`, `branch_delete_button_clicked`,
`branch_review_with_assistant_clicked`, and
`branch_*_merge_request_button_clicked`. Original code grouped these
under the parent (production) project, not the branch ref;
auto-injection would have shifted them onto the branch.
- Switched 4 test mocks from `@/data/telemetry/send-event-mutation` to
`@/lib/telemetry/track`. Removed obsolete tests around manual groups and
`try/catch` on telemetry rejection.
- Deleted `apps/studio/data/telemetry/send-event-mutation.ts`. The
deleted module is its own guardrail: any reintroduction of the import
fails at TypeScript module resolution before lint runs.
## Testing
Tested on preview deploy:
- [x] SQL editor `CREATE TABLE` fires `table_created` with method
`sql_editor` and `groups.project` set to the mutation's `projectRef`.
- [x] Table editor creates a table from the side panel; `table_created`
fires from `SidePanelEditor.utils` via threaded `track`.
- [x] Help button (`/project/[ref]/...`) fires `help_button_clicked`
with auto-injected project + org groups.
- [x] Sign-in form fires `sign_in` with empty groups (pre-auth,
expected).
- [x] Org documents page (`/org/[slug]/documents`) fires
`document_view_button_clicked` with org group only, no stale project
ref.
- [x] Command menu (`Cmd+K`) inside a project still fires
`command_menu_opened` with studio's project/org overriding any
event-supplied groups.
- [x] Support form "Ask the Assistant" without selected org fires
`ai_assistant_in_support_form_clicked` with no project/org groups
(sentinels suppress).
- [x] On a branch, "Update branch" / "Merge branch" / "Close merge
request" events fire with `groups.project` set to the parent project
ref, not the branch ref.
Local checks:
- [x] 22/22 tests pass across the 4 updated test files
(`SidePanelEditor.utils.createTable`, `EdgeFunctionRenderer`,
`LayoutSidebar`, `PlanUpdateSidePanel`).
- [x] `rg useSendEventMutation apps/studio` returns 0 hits.
## Linear
- fixes GROWTH-860
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Chores**
* Standardized telemetry across the Studio to a unified tracking system;
events now send simplified payloads with less contextual/grouping data.
* No user-facing flows changed; UI behavior, permissions, and
interactions remain the same.
* **Tests**
* Updated telemetry mocks and tests to align with the new tracking
approach.
<!-- review_stack_entry_start -->
[](https://app.coderabbit.ai/change-stack/supabase/supabase/pull/46140?utm_source=github_walkthrough&utm_medium=github&utm_campaign=change_stack)
<!-- review_stack_entry_end -->
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
|
||
|
Saxon Fletcher
|
033daf223c |
Support form Assistant Streamdown (#46248)
Re-adds support form Assistant response using a lighter weight Streamdown component vs the more heavy `Message` component. <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **New Features** * AI Assistant follow-up card after ticket submission for project-scoped requests. * In-chat support request preview panels showing submitted subject and message. * **Improvements** * Smarter project selection when opening the support form via route/context. * Success screen: cleaner layout, project-name messaging, optional finish action, and a "Join Discord" button. * Category prompt text updated to "What issue are you having?" * New success/feedback section for consistent layouts. * **Tests** * Added tests covering support prompt serialization/parsing and UI previews. <!-- review_stack_entry_start --> [](https://app.coderabbit.ai/change-stack/supabase/supabase/pull/46248?utm_source=github_walkthrough&utm_medium=github&utm_campaign=change_stack) <!-- review_stack_entry_end --> <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
Joshen Lim
|
d11bd4997e |
Revert "Support form Assistant" (#46194)
Reverts supabase/supabase#45861 <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit ## Release Notes * **New Features** * Support form now returns to home view upon completion within the help panel. * Success screen conditionally displays community (Discord) section for specific issue categories. * **Bug Fixes** * Improved project selection logic in support form initialization. * **Style** * Updated support form label text for clarity. * Redesigned success screen layout with updated styling and separators. * **Removed Features** * Removed support assistant follow-up card from success screen. * Removed support request message parsing from AI responses. <!-- review_stack_entry_start --> [](https://app.coderabbit.ai/change-stack/supabase/supabase/pull/46194?utm_source=github_walkthrough&utm_medium=github&utm_campaign=change_stack) <!-- review_stack_entry_end --> <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
Saxon Fletcher
|
af7d953f52 |
Support form Assistant (#45861)
When a support from is submitted, we believe there is an opportunity to help people before a human receives and responds. Human support is still involved regardless of whether Assistant helps or not, so this is to positioned as a "while you wait" type experience. ## To test: - Enable to `supportAssistantFollowUp` feature flag - Open a project - Open the support form and submit a request - Note the success state and the additional Assistant card - Note text generation in card - Clicking card should open the Assistant conversation <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **New Features** * AI assistant follow-up card appears after submitting a support ticket to continue the conversation * Support request preview rendered in the assistant panel showing subject/message when present * **Bug Fixes** * Improved project selection fallback during support form initialization * **Improvements** * Refined success layout and messaging; finish action behavior simplified [](https://app.coderabbit.ai/change-stack/supabase/supabase/pull/45861) <!-- end of auto-generated comment: release notes by coderabbit.ai --> --------- Co-authored-by: Gildas Garcia <1122076+djhi@users.noreply.github.com> |
||
|
Gildas Garcia
|
243e079a2c |
chore: remove _Shadcn_ suffix from Command components (#46153)
## Problem The `_Shadcn_` suffix isn't needed anymore on `Command` components ## Solution - Remove the `_Shadcn_` suffix - Simplify UI package exports - Apply prettier <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Refactor** * Simplified command component imports and exports across the UI library by removing internal naming aliases and adopting direct component references. Updated the public UI package barrel export to use wildcard re-exports for cleaner API surface. <!-- review_stack_entry_start --> [](https://app.coderabbit.ai/change-stack/supabase/supabase/pull/46153?utm_source=github_walkthrough&utm_medium=github&utm_campaign=change_stack) <!-- review_stack_entry_end --> <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
