Commit Graph
389 Commits
Author SHA1 Message Date
Jordi EnricandClaude Sonnet 4.6 447dfb29e8 fix(studio): remove CLI backup instructions from paused project state
The inline CLI section in ProjectPausedState pushed the card off-screen
on smaller viewports with no way to scroll, blocking users from resuming
their project. CLI instructions are still available in the delete modal
and via the Download backup button in failed states.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-04-16 15:03:28 +02:00
Jordi EnricandClaude Sonnet 4.6 09713bc31f refactor: extract tooltip text to named constant in failed states
Replace 3-level nested ternary for the Download backup tooltip with a
named variable for readability.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-04-15 16:12:33 +02:00
Jordi EnricandClaude Opus 4.6 37a8ffb362 fix(studio): address four CLI backup review issues
- isPending race: destructure isPending from useDownloadableBackupQuery
  and disable the Download backup button while the query is in-flight,
  preventing the CLI dialog from opening before backups have loaded

- tooltip/click mismatch: align onClickDownloadBackup with tooltip by
  also routing physical-backups-enabled projects to the CLI dialog

- PauseDisabledState: remove LogicalBackupCliInstructions — the project
  has been paused >90 days, compute is stopped and cannot be resumed,
  so pg_dump commands would fail with connection refused; the Download
  backups button is the correct path here

- ProjectPausedState: pass note prop to LogicalBackupCliInstructions
  clarifying the project must be resumed before running the commands

- LogicalBackupCliInstructions: decouple error-state DB settings link
  from showResetPassword — the link is always shown on query failure;
  add note prop for contextual call-site warnings

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-04-15 11:33:13 +02:00
Jordi EnricandClaude Opus 4.6 93474835b1 chore(studio): format LogicalBackupCliInstructions files
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-04-15 11:29:20 +02:00
Jordi EnricandClaude Opus 4.6 1d8849ea0c fix(studio): show CLI backup instructions even when pause status query fails
LogicalBackupCliInstructions uses its own independent query
(useProjectSettingsV2Query) so it should not be gated on
isPauseStatusSuccess. Removing that guard ensures users always
see backup options when the project is paused, even if the
pause status API call errors.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-04-14 17:10:22 +02:00
Jordi EnricandClaude Opus 4.6 d7d57fd0b2 refactor(studio): extract CLI backup utils and add unit tests
Move buildDirectPostgresConnectionUri and buildLogicalBackupShellScript
out of the component into a co-located utils module so they can be
unit tested independently. Adds 8 tests covering URI construction,
password placeholder, port handling, script structure, single-quote
shell safety, and exclusion of storage vector tables.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-04-14 17:10:16 +02:00
Jordi EnricandClaude Opus 4.6 bd9a6b9da2 chore(studio): format LogicalBackupCliInstructions.tsx
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-04-14 15:47:19 +02:00
Jordi EnricandClaude Opus 4.6 b0a59b3f73 fix(studio): restore tooltip context on download backup button in failed states
When no downloadable backup is available (no backups or physical backups),
the tooltip now explains why and signals that clicking will show CLI
backup instructions — preserving the context that was lost when the
disabled state was removed.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-04-14 15:05:57 +02:00
Jordi EnricandClaude Opus 4.6 ef6a62eee2 fix(studio): pass required tooltip prop to ButtonTooltip in failed states
ButtonTooltip unconditionally reads tooltip.content, so omitting
the prop caused a crash after removing the disabled tooltip text.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-04-14 14:55:29 +02:00
Jordi EnricandClaude Opus 4.6 ac18df1af3 refactor(studio): replace inline CLI backup section with dialog in failed states
Instead of showing CLI instructions inline (cluttering the error card),
the download backup button now opens a dialog with CLI instructions when
no downloadable backup is available. The inline backup section is removed.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-04-14 14:35:47 +02:00
Jordi EnricandClaude Opus 4.6 287e97907c refactor(studio): improve CLI backup instructions and add showResetPassword prop
- Simplify encoding guidance: clarify that any reserved URL character
  must be encoded, not just the listed examples; add / → %2F
- Split description into two focused paragraphs for readability
- Add showResetPassword prop (default true) to hide the reset password
  button and swap the isError fallback text in inaccessible project states

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-04-14 14:35:43 +02:00
Jordi EnricandClaude Sonnet 4.6 14fcf6f905 chore(studio): format PauseFailedState.tsx
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-04-13 14:25:28 +02:00
Jordi EnricandClaude Sonnet 4.6 c91166d2d2 fix(studio): add backup CLI to PauseFailedState and improve encoding guidance
- Add LogicalBackupCliInstructions to PauseFailedState (mirrors RestoreFailedState)
- Add single quote and percent sign to percent-encoding guidance (both break single-quoted shell commands or URI parsing)

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-04-13 14:17:42 +02:00
Jordi EnricandClaude Sonnet 4.6 47c82c16cb fix(studio): address PR review comments on LogicalBackupCliInstructions
- Remove unused Button import and useIsProjectActive hook
- Allow Reset database password button in paused/failed states (it's a navigation action, not project-state-dependent)
- Remove npx supabase login from generated script (--db-url auth doesn't require it)
- Use single quotes around --db-url values to prevent shell metacharacter issues
- Fix misleading error message that referenced non-existent commands
- Add percent-encoding guidance for special characters in passwords

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-04-13 14:00:01 +02:00
Jordi EnricandClaude Opus 4.6 2f6bbf6076 fix(studio): align imports with studio tsconfig
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Made-with: Cursor
2026-04-10 12:32:11 +02:00
Jordi EnricandClaude Opus 4.6 e2e0687cca fix(studio): use alias imports for backup cli block
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Made-with: Cursor
2026-04-10 12:26:48 +02:00
Jordi EnricandClaude Opus 4.6 9af1fa01c2 feat(studio): show backup cli steps on restore failed
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Made-with: Cursor
2026-04-10 11:45:20 +02:00
Jordi EnricandClaude Opus 4.6 764fd209e9 chore(studio): format backup cli changes
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Made-with: Cursor
2026-04-07 12:03:13 +02:00
Jordi EnricandClaude Opus 4.6 e8b2de82ff chore: merge master into feat/studio-backup-cli-delete-project
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Made-with: Cursor
2026-04-07 11:58:44 +02:00
Jordi EnricandClaude Opus 4.6 1855a4c95e feat(studio): add db backup cli instructions
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Made-with: Cursor
2026-04-06 10:34:45 +02:00
Danny White 73692b0a4d feat(studio): add stuck pausing and restoring escalations (#43368)
## What kind of change does this PR introduce?

Bug fix / UX improvement for long-running project transitions. Resolves
DEPR-362.

## What is the current behaviour?

- `PausingState` does not preserve elapsed time across refreshes, so the
stuck escalation can disappear for the same user.
- `RestoringState` relies on weaker frontend heuristics and always
showed a support CTA in the footer even before the restore was clearly
long-running.

## What is the new behaviour?

- `PausingState`
- Persists a per-project pause start time in local storage so the stuck
CTA survives refreshes in the same browser.
  - Escalates after 10 minutes.
  - Clears the stored timer when pausing succeeds or fails.

- `RestoringState`
- Persists a per-project restore start time in local storage so the
stuck CTA survives refreshes in the same browser.
- Removes the always-visible footer CTA and only escalates once
restoration is genuinely long-running.
- Computes the long-running threshold from volume size using a shared
restore estimate: `max(10, ceil(estimateRestoreTime(sizeGb) * 1.5))`.
  - Clears the stored timer when restoration succeeds or fails.

- Shared changes
- Extracts reusable transition timing helpers and restore estimate
helpers with unit tests.
- Reuses the same restore estimate formula for branch restore timing and
restore escalation, so the two do not drift.

| `PausingState` | `RestoringState` |
| --- | --- |
| <img width="1570" height="906" alt="Krosno Toolshed
Supabase-C6D7E29F-C38D-43E1-8AF9-C612B6A2FD8D"
src="https://github.com/user-attachments/assets/e0bd9434-09b6-4cf6-bffa-07a0ddcdf5db"
/> | <img width="1570" height="906" alt="Krosno Toolshed
Supabase-51F4763D-B798-4B41-A92D-43B3CF8ECDAF"
src="https://github.com/user-attachments/assets/d0e47356-dcc3-42aa-b602-802a35249a16"
/> |

## Additional context

- This PR intentionally stays frontend-only.
- We are not exposing backend lifecycle timestamps here; local storage
is the stopgap to improve the same-browser experience now.
- If you need to test the frontend blocker states locally, use
[`dnywh/chore/depr-362-blocker-preview-mocks`](https://github.com/supabase/supabase/tree/dnywh/chore/depr-362-blocker-preview-mocks)
and append one of the following query params to a project URL:
  - `?mockProjectBlockingState=pausing`
  - `?mockProjectBlockingState=pausing-long-running`
  - `?mockProjectBlockingState=restoring`
  - `?mockProjectBlockingState=restoring-long-running`
- I know these two views are quite differently stylistically, and will
consolidate later
  - References DEPR-434
2026-04-02 11:09:18 +11:00
kemal.earth 908da85225 feat(studio): nano exhaustion indicators (#44395)
## 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?

This PR introduces some visual indicators when a Nano project is
exhausting resources on Pro plus plans. The indicator tells the user a
free upgrade to Micro is available via a flashing Nano badge that guides
them to Upgrade and a global banner that notifies them resources are
near exhaustion, please upgrade for free.

| Project List | Project View |
|--------|--------|
| <img width="412" height="223" alt="Screenshot 2026-03-31 at 16 11 19"
src="https://github.com/user-attachments/assets/0d0e7727-e4eb-4ade-9024-528a2501596c"
/> | <img width="1256" height="618" alt="Screenshot 2026-03-31 at 16 11
10"
src="https://github.com/user-attachments/assets/b664e020-2b18-4842-8e64-4e49fac69eef"
/> |

<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit

* **New Features**
* Free Micro Upgrade banner appears for nano-tier projects near compute
exhaustion with animated visuals and an “Upgrade for free” CTA.
* Compute badge highlights near-exhaustion with glow/shimmer and an
animated upgrade indicator; optional icon support added.
* Per-project banner dismissal is saved locally; dismissed banners
remain hidden.
* **Tests**
  * Added tests covering banner display and dismissal scenarios.
* **Chores**
* Added local-storage keys and telemetry events for banner and upgrade
interactions.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2026-04-01 11:48:43 +01:00
4a0bb36ca8 style: require sorted imports in studio/components (#44408)
Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>
Co-authored-by: Ivan Vasilov <vasilov.ivan@gmail.com>
2026-04-01 10:22:37 +02:00
kemal.earth a9a1326b92 feat(studio): private apps ui (#43382)
## 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?

This is a prototype for private apps UI. There are no endpoints at the
minute, just wanted to see what a potential flow could look like.
2026-03-23 10:51:04 -06:00
Joshen Lim 00ca386e24 Chore/add get restore initiated event endpoint (#43485)
## Context

Resolves FE-2709
Dependent on API PR: https://github.com/supabase/platform/pull/30564

While a project is in restoring, we should a "Contact support" CTA in
the footer, but this has led to a high number of tickets coming in
despite the project's status being `ACTIVE_HEALTHY` when we check on our
end.

Will be adjusting the behaviour of this CTA to only show up if the
project's status is RESTORING and it's `updated_at` is at than 30
minutes ago, and update the CTA a bit as well

<img width="765" height="243" alt="image"
src="https://github.com/user-attachments/assets/69fe6fa3-d46f-4268-ad1b-46cffb3cc6ba"
/>

<img width="566" height="273" alt="image"
src="https://github.com/user-attachments/assets/2d5f31c2-6ef2-444b-8aee-fd94139cf713"
/>
2026-03-19 00:49:01 +08:00
Charis a4641d0b9f refactor: move /incident-status to app router (#43881)
## 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?

Refactor

## What is the current behavior?

`/incident-status` is handled via Pages Router.

## What is the new behavior?

`/incident-status` is handled via App Router, enabling use of Vercel
Data Cache to cache the upstream fetch.

## Additional context

Adding the first App Router route handler triggered `next typegen` (run
as `pretypecheck`) to generate `.next/dev/types/validator.ts`, which
imports all route files and expanded the type-checked graph. This
surfaced pre-existing `null`-safety errors in:

- `components/grid/SupabaseGrid.utils.ts` — `useSearchParams()` result
- `components/layouts/ProjectLayout/UpgradingState/index.tsx` —
`useSearchParams()` result
- `pages/project/[ref]/sql/quickstarts.tsx` — `useParams()` result
- `pages/project/[ref]/sql/templates.tsx` — `useParams()` result

These are fixed with optional chaining. The `tsconfig.json` change
(adding `.next/dev/types/**/*.ts` to `include`) is auto-generated by
Next.js and committed as correct behavior.
2026-03-18 09:36:19 +01:00
Danny WhiteandJoshen Lim 7d6995bbfe refactor(studio): clean up ProjectLayout title API (#43742)
## What kind of change does this PR introduce?

Refactor, cleanup, and docs update.

## What is the current behavior?

After the page-title rollout, `ProjectLayout` is still in a transitional
state:

- it accepts a deprecated `title` prop
- it still supports a separate `browserTitle.surface`
- wrapper layouts are split between passing `title` directly and passing
`browserTitle.section`

That makes the API harder to reason about than it needs to be, even
though the rendered titles are already correct.

## What is the new behavior?

This cleanup finishes the API simplification that came out of the
stacked PR review:

- wrapper layouts stay `title`-first for DX
- `ProjectLayout` no longer accepts `title`
- `product` is now the single source of truth for the project-surface
title segment
- `browserTitle` is now only used for extra browser-title metadata
(`entity`, `section`, `override`)
- the remaining project-scoped callers now pass `browserTitle.section`
when they need a section label
- docs now reflect the final pattern instead of the transitional one

Rendered page titles stay the same.

## Additional context

Checks run:

- `pnpm --filter studio exec vitest --run lib/page-title.test.ts
components/layouts/ProjectLayout/index.test.tsx`
- `pnpm --filter studio typecheck`
- `pnpm exec prettier --check ...` on touched files

This is intended as the post-rollout cleanup PR based on Joshen's review
feedback across the stacked title changes.

---------

Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
2026-03-16 18:03:10 +11:00
Francesco Sansalvadore 156f904018 feat: floating mobile toolbar (#43444)
- move navigation components to `apps/studio/components/layouts/Navigation`
- add [FloatingMobileToolbar](https://github.com/supabase/supabase/pull/43444/changes#diff-3dffe47fd51ca851d612d8728e03b2dc344ec213d4f3a46a824d3fa32a7cc851) as quick access to tools such as search, assistant, inline editor, etc - behind feature flag and feature preview (true by default as it's a bit
annoying to have to enable it all the time as previews are stored in
local-storage)
- fix sidebar panels closing on viewport resizing (regression from previous pr)

https://github.com/user-attachments/assets/d6881e3b-5128-4306-bb82-3ca39c755dba

<img width="986" height="697" alt="Screenshot 2026-03-12 at 12 40 11"
src="https://github.com/user-attachments/assets/da8511e2-7d01-4237-b814-596031c747c5"
/>
2026-03-13 12:13:07 +00:00
Pamela Chia fe5b22d314 fix(studio): fall back to legacy connect dialog when connectSection flag is unresolved (#43733)
## Summary

When the `connectSection` PostHog flag is unresolved (`undefined`) —
e.g. during loading or if PostHog is unreachable — the header Connect
button renders nothing (`null`), making it a no-op. This changes the
fallback to render the legacy `<Connect />` dialog instead, so the
button always works.

## Changes

- Remove `isFlagResolved` gate in `LayoutHeader` — render `<Connect />`
(legacy) whenever `connectSection !== 'connect'`, including when
`undefined`

## Testing

Tested on Vercel preview:
- [x] Flag returns `'connect'` — ConnectSheet opens
- [x] Flag returns `'getting-started'` or `false` — legacy Connect
dialog opens
- [x] Flag is `undefined` (unresolved) — legacy Connect dialog opens
instead of nothing
2026-03-13 04:28:41 +00:00
Pamela ChiaandAli Waseem 578a73f966 feat(studio): connectSection experiment — replace Getting Started with Connect section (#43629)
## Summary

Re-ports PR #43119 against the current `ProjectHome` codebase (the
original PR targeted `HomeNew/` which was removed during the `homeNew`
graduation in #43437). Also unifies the `connectSheet` and
`connectSection` feature flags into a single `connectSection` flag — the
`connectSheet` flag is removed entirely, so both the ConnectSheet
(header) and ConnectSection (homepage row) are controlled by one
experiment.

- Adds `connectSection` PostHog experiment flag that controls two
things:
1. Swaps the Getting Started section for a Connect section on the
project homepage for new projects (< 10 days old)
2. Swaps the legacy Connect dialog for the new ConnectSheet panel in the
header
- **Control** (`getting-started`): existing Getting Started section +
legacy Connect dialog in header
- **Treatment** (`connect`): new 4-tile Connect section + ConnectSheet
in header
- `undefined` (loading): neither section renders, avoiding flash
- Tiles filtered by the same `useIsFeatureEnabled` flags as ConnectSheet
(`show_app_frameworks`, `show_mobile_frameworks`, `show_orms`)
- Connect tile clicks tracked via `home_connect_action_clicked`; section
render tracked via `home_connect_section_exposed`; sheet opens tracked
via `connect_sheet_opened` with source attribution (`header_button` or
`connect_section`)

## Changes

- `packages/common/telemetry-constants.ts` — new
`home_connect_section_exposed`, `home_connect_action_clicked`, and
`connect_sheet_opened` event types
- `ConnectSheet/ConnectSheet.tsx` — read `connectTab` query param and
sync to active mode on open; `handleModeChange` keeps param in sync on
tab switch; fire `connect_sheet_opened` event with source attribution on
open
- `ConnectButton/ConnectButton.tsx` — set `connectSource=header_button`
query param on click
- `ProjectHome/ConnectSection.tsx` — new component (4-tile connect
card); set `connectSource=connect_section` on tile click
- `ProjectHome/Home.tsx` — experiment flag wiring
- `LayoutHeader/LayoutHeader.tsx` — read `connectSection` flag instead
of `connectSheet` to toggle ConnectSheet vs legacy Connect dialog

## Test plan

To test on the Vercel preview, set `connectSection=connect` to 100% in
PostHog (or override via cookie `ph_override_connectSection=connect`).
No separate `connectSheet` flag is needed — `connectSection` controls
both features.
- [x] Treatment (`connect` variant) — "Get connected" section renders on
new project, Getting Started hidden
- [x] Control (`getting-started`) — Getting Started renders, Connect
section hidden
- [x] Mature project (> 10 days) — neither section regardless of flag
- [x] Clicking each tile opens ConnectSheet on the correct tab
(Framework / Direct / ORM / MCP)
- [x] Switching tabs inside sheet updates `connectTab` URL param
- [x] Closing sheet clears `connectTab` param
- [x] Direct URL deep-link (`?showConnect=true&connectTab=orm`) opens
sheet on correct tab
- [x] Dark mode — background gradient renders correctly
- [x] Light mode — background switches to light gradient
- [x] Responsive layout — 4 cols (xl), 2×2 (md), stacked (mobile)
- [x] Telemetry — `home_connect_section_exposed` fires once on load;
`home_connect_action_clicked` fires with correct `mode`
- [x] Treatment — header Connect button opens ConnectSheet (not legacy
Connect dialog)
- [x] Control — header Connect button opens legacy Connect dialog (not
ConnectSheet)
- [x] Telemetry — clicking a ConnectSection tile fires
`connect_sheet_opened` with `source: 'connect_section'`
- [x] Telemetry — clicking header Connect button fires
`connect_sheet_opened` with `source: 'header_button'`

---------

Co-authored-by: Ali Waseem <waseema393@gmail.com>
2026-03-13 11:50:07 +09:00
Danny WhiteandJoshen Lim 817a2710da feat(studio): page titles for account and org surfaces (#43536)
Stacked PR 4/5 for page title improvements. Includes account and
organization-level title updates plus organization list/selector page
titles.

_Base:
[dnywh/feat/page-titles](https://github.com/supabase/supabase/pull/43538)_

---

## What kind of change does this PR introduce?

- Resolves FE-1960
- Resolves FE-1983
- Resolves DEPR-207

## What is the current behavior?

Page titles between surfaces are inconsistent and vague. Sometimes they
say the product name:

```
My Project | My Org | Supabase
```

...even when on a specific surface like Database > Tables.

Other times they show the entity name but skip over the project or org
name :

```
Edge Functions | Supabase
```

## What is the new behavior?

Account and organization-level title updates plus organization
list/selector page titles, adopting the layout title format introduced
in https://github.com/supabase/supabase/pull/43538:

```
users | Table Editor | My Project | My Org | Supabase
hello-world | Logs | Edge Functions | My Project | My Org | Supabase
Backups | Database | My Project | My Org | Supabase
Authentication | My Project | My Org | Supabase
```

That format is:

entity, section, surface, project, org, brand

## Additional context

Related stacked PRs also based on the the original
[dnywh/feat/page-titles](https://github.com/supabase/supabase/pull/43538)
branch:

- https://github.com/supabase/supabase/pull/43534
- https://github.com/supabase/supabase/pull/43535
- https://github.com/supabase/supabase/pull/43537

---------

Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
2026-03-13 12:18:13 +11:00
Joshen Lim 0b97e0ff86 Joshen/fe 2642 project settings allow to select a replica to power (#43626)
## Context

Related to dashboard scalability
Previous PR: https://github.com/supabase/supabase/pull/42856

Note: Changes are all feature flagged still and I'm still not entirely
convinced with the current UX
Will iterate as as go along, and only make this publicly available when
we're satisfied with the behaviour

Adds a "Dashboard preference" section to the project settings
<img width="265" height="740" alt="image"
src="https://github.com/user-attachments/assets/6ce1aa19-26c2-47c6-a9c4-595137266631"
/>

In which users can then select which database they'd like to use for
read queries run from the dashboard
Note: Everything is local storage for now, but we'd need middleware
support if we want to make this setting persist for all users on the
project
<img width="791" height="434" alt="image"
src="https://github.com/user-attachments/assets/e651d6d9-fed4-4da4-b552-c9f93f8d46d3"
/>

Added a dialog as well to further explain what this implies
<img width="610" height="312" alt="image"
src="https://github.com/user-attachments/assets/0aa957af-cb51-476f-aa79-8948a7cbe5ae"
/>

## To test

- Choosing a replica in dashboard preferences will only affect the table
editor as thats the only place that's set up so far to use a replica for
read queries (I'll need to follow up for other parts of the dashboard in
subsequent PRs)
2026-03-12 11:18:28 +07:00
Francesco Sansalvadore b997b7fb13 feat(studio): org project branch mobile selector (#43238)
- add new
[OrgSelector](https://github.com/supabase/supabase/pull/43238/changes#diff-214b339101a9c06864ea2755ac7246eb4c971ce74c5d3169b1385a28ee1d4227)
and
[ProjectBranchSelector](https://github.com/supabase/supabase/pull/43238/changes#diff-82d25c128c306b61bea7481026f58f670a229874f23ca3a1a1d78ddeabde21e0)
components to the mobile navigation, replacing the previous which took
up a lot of horizontal space
- org/project/branch dropdowns now open up in the bottom MobileSheetNav
for a better mobile ux
- desktop nav remains unchanged
2026-03-11 16:25:22 +01:00
Francesco Sansalvadore 23c827bdda feat: nested mobile nav menu (#43333)
- consolidate `top level menu` and `contextual menu` into nested menu on
mobile
- remove legacy mobile submenu
2026-03-11 13:55:20 +01:00
Danny WhiteandJoshen Lim 0972d61db5 feat(studio): page titles for project surfaces (#43534)
Stacked PR 2/5 for page title improvements. Includes Auth, Database,
editors, and Edge Functions layout title adoption.

_Base:
[dnywh/feat/page-titles](https://github.com/supabase/supabase/pull/43538)_

---

## What kind of change does this PR introduce?

- Resolves FE-1960
- Resolves FE-1983
- Resolves DEPR-207

## What is the current behavior?

Page titles between surfaces are inconsistent and vague. Sometimes they
say the product name:

```
My Project | My Org | Supabase
```

...even when on a specific surface like Database > Tables.

Other times they show the entity name but skip over the project or org
name :

```
Edge Functions | Supabase
```

## What is the new behavior?

Auth, Database, editors, and Edge Functions adopt the layout title
format introduced in https://github.com/supabase/supabase/pull/43538:

```
users | Table Editor | My Project | My Org | Supabase
hello-world | Logs | Edge Functions | My Project | My Org | Supabase
Backups | Database | My Project | My Org | Supabase
Authentication | My Project | My Org | Supabase
```

That format is:

entity, section, surface, project, org, brand

## Additional context

Related stacked PRs also based on the the original
[dnywh/feat/page-titles](https://github.com/supabase/supabase/pull/43538)
branch:

- https://github.com/supabase/supabase/pull/43535
- https://github.com/supabase/supabase/pull/43536
- https://github.com/supabase/supabase/pull/43537

---------

Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
2026-03-11 12:38:02 +11:00
Pamela Chia 01c178e159 chore(studio): graduate homeNew experiment (#43437)
## Summary

The `homeNew` PostHog experiment has concluded. This PR graduates it by
making the new homepage (`ProjectHome`, formerly `HomeV2`) the permanent
default for all users, and removes all dead code from the old
experiment.

## Changes

- Remove `homeNew` PostHog feature flag checks and `home_new` experiment
exposure tracking from 3 files
- Rename `HomeNew/` → `ProjectHome/` directory and `HomeV2` →
`ProjectHome` export
- Delete old `Home/Home.tsx` component (shared components like
`ProjectList/` are kept — still used by org pages)
- Delete `pages/project/[ref]/building.tsx` and add a server-side
redirect from `/project/:ref/building` → `/project/:ref` to prevent 404s
during rollout (old cached JS bundles may still route to `/building`)
- Simplify `ContentWrapper` building-state logic in `ProjectLayout` —
always redirect building projects to home, always suppress building
interstitial on home page
- Always route to `/project/{ref}` after project creation (remove
`/building` path)
- Update all Observability imports from `HomeNew` → `ProjectHome`

## Self-hosted behavior change

Self-hosted Studio previously showed the old `Home` component (client
libraries + example projects) since PostHog flags don't load. This PR
changes self-hosted to show `ProjectHome` (TopSection with service
status + instance diagram, advisor, custom reports). All sections query
backend APIs that exist on self-hosted. E2E tests pass against the
self-hosted build.

## Testing

- [x] `pnpm turbo run build --filter=studio` passes
- [x] No remaining references to `homeNew`, `home_new`, or `HomeNew` in
codebase
- [x] No broken imports to deleted files
- [x] Self-hosted E2E tests pass (145 passed, 1 flaky, 4 skipped)
- [x] `/building` redirect added to both platform and self-hosted config
blocks

**Quick test:**
1. Navigate to any project homepage — should render the ProjectHome
component
2. Create a new project — should redirect to `/project/{ref}` (not
`/building`)
3. Visit a project in `COMING_UP` state on a non-home route — should
redirect to home
4. Visit `/project/{ref}/building` directly — should 302 redirect to
`/project/{ref}`

## Linear

- fixes GROWTH-671
2026-03-10 17:03:58 +09:00
Danny White 96ac1c2652 feat(studio): page titles (core) (#43538)
## What kind of change does this PR introduce?

- Resolves FE-1960
- Resolves FE-1983
- Resolves DEPR-207

## What is the current behavior?

Page titles between surfaces are inconsistent and vague. Sometimes they
say the product name:

```
My Project | My Org | Supabase
```

...even when on a specific surface like Database > Tables.

Other times they show the entity name but skip over the project or org
name :

```
Edge Functions | Supabase
```

## What is the new behavior?

Page titles *mostly* (see below) follow the same format:
```
users | Table Editor | My Project | My Org | Supabase
hello-world | Logs | Edge Functions | My Project | My Org | Supabase
Backups | Database | My Project | My Org | Supabase
Authentication | My Project | My Org | Supabase
```

That format is:

entity, section, surface, project, org, brand

## Additional context

This is stacked PR 1/5 for page title improvements. Includes the core
title utility and ProjectLayout integration/tests. Follow-up stacked PRs
are based on this branch:

- https://github.com/supabase/supabase/pull/43534
- https://github.com/supabase/supabase/pull/43535
- https://github.com/supabase/supabase/pull/43536
- https://github.com/supabase/supabase/pull/43537

This one should be merged first. The others (listed right above) can
_then_ be merged in any order.
2026-03-09 15:25:05 +07:00
Joshen Lim 9b0dc8d9b9 Chore/fix storage explorer when switching buckets (#43541)
## Context

Taking a slightly different approach to [this
PR](https://github.com/supabase/supabase/pull/43370)

Original problem was that if you opened some folders while in a bucket
and then switched to a different bucket, the folder UI will persists
(folders from Bucket A will render when landing on Bucket B)

## Changes involved
- Shift `StorageExplorerStateContextProvider` into `[bucketId].tsx]`
instead of `ProjectContext`
- The valtio store here only applies for the storage explorer so having
it so high in the project's context was unnecessary
- This also just implies that the valtio store will automatically reset
whenever the bucket changes
- Simplify storage explorer valtio store by initializing the store with
the bucket
- We'll initialize the selected bucket with the store now (Same as
previous PR)
- Removes unnecessary `setSelectedBucket` method which required a
separate `useEffect` in `StorageExplorer.tsx`

## To test
- [ ] Verify that the original is resolved
- [ ] General smoke test of the storage explorer - i've also re-added
the e2e test that Gildas wrote up in his PR
2026-03-09 14:32:34 +07:00
Danny White df55c5c327 feat(studio): platform webhooks scaffolding (#43276)
## What kind of change does this PR introduce?

Impending feature addition. Resolves DEPR-340.

## What is the current behavior?

We don’t have any platform webhook support.

## What is the new behavior?

This puts the scaffolding for platform webhooks **behind a feature
flag**. The content is currently UI-only (with mock data and a
[temporary tracking
file](https://github.com/supabase/supabase/blob/8adadc61f57c70b686a0f5f05e9f7f05837e0466/apps/studio/components/interfaces/Platform/Webhooks/DEPR-340-backend-integration-tracker.md)).

Merging this in lets us work incrementally from here on.
2026-03-06 02:56:54 +00:00
Kevin Grüneberg 589cdae7e5 chore: log drains on Pro Plan (#42435) 2026-03-03 19:10:23 +08:00
Riccardo BusettiandJoshen Lim 43bccc52a3 feat(etl): Add new flags per org (#43292)
This PR adds new feature flags for controlling etl destinations
visibility based on the org slug.

---------

Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
2026-03-03 15:44:57 +08:00
Danny White 706207436f chore(studio): move organization settings nav to sidebar layout (#43228)
## What kind of change does this PR introduce?

UI change

## What is the current behavior?

Organization settings are currently spread across a NavMenu. This is
getting unweildy as the amount of children within Organization settings
grows.

## What is the new behavior?

Organization settings are now on a sidebar, just like Project Settings
and most other surfaces.

| Before | After |
| --- | --- |
| <img width="1024" height="563" alt="Supabase"
src="https://github.com/user-attachments/assets/3889858c-157a-4deb-8714-71fe9cf002e6"
/> | <img width="1024" height="563" alt="General Supabase"
src="https://github.com/user-attachments/assets/1b4eb2c3-a67c-4eda-ab3c-e6610dd5ccf4"
/> |

## Additional context

@fsansalvadore and the design team have have other efforts going on to
reduce interface clutter, e.g. nested sidebars.
2026-03-03 10:15:40 +11:00
Francesco Sansalvadore affdf865e0 fix: mobile sheet nav close (#43239)
Mobile sheet nav doesn't close on route change and viewport resizing
after #43184.

This PR fixes that and also makes it optional to close on nav and
resizing, because the sidepanels need them _not_ to resize, while mobile
navigation menu does.

Also added some tests. 🪄
2026-02-27 16:14:57 +01:00
Francesco Sansalvadore 9145470ff6 feat(studio): mobile sheet nav (#43184)
- use `MobileSheetNav` for all `LayoutSidebar` panels on mobile viewport
- move `Help` to LayoutSidepanel for a more cohesive experience
- enables opening the help panel using params `?sidebar=help-panel`

https://github.com/user-attachments/assets/a84e56f0-f2e2-4217-89a2-ba895bb7d352
2026-02-27 12:06:27 +00:00
Ivan VasilovandJoshen Lim e8c309c312 fix: resolve undefined project ref in TabsStateContextProvider (#43222)
This pull request refactors how the `TabsStateContextProvider` receives
the project reference and updates related imports for consistency and
maintainability. The main change is to pass `projectRef` explicitly as a
prop instead of fetching it internally, which improves context control
and makes the component easier to test and reuse. Additionally, the PR
updates import paths to use absolute aliases and removes an unused
function.

This fixes an issue which you can replicate by:
1. Go to SQL editor
2. Open any snippet
3. Delete the local storage `supabase_studio_tabs_{project ref}`
4. Refresh the page while still the snippet is open

This will make the snippet to enter in a ghost state where the tab name
is not visible but you see the content.

---------

Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
2026-02-27 12:32:01 +08:00
Ivan Vasilov 637b6fb792 chore: update react-resizable-panels to v4 to support pixel width (#42990)
This pull request standardizes the usage of props and value types for
the `ResizablePanelGroup` and `ResizablePanel` components across
multiple files in the codebase. Specifically, it replaces the deprecated
`direction` prop with `orientation`, and updates numeric prop values
(such as `defaultSize`, `minSize`, and `maxSize`) to be passed as
strings. This ensures consistency with the updated component API and
improves type safety.

**Component API Updates:**

* Replaced the `direction` prop with `orientation` for all usages of
`ResizablePanelGroup`
* Updated all `ResizablePanel` props (`defaultSize`, `minSize`,
`maxSize`) to be passed as strings instead of numbers, ensuring
compatibility with the latest API requirements.
* Removed deprecated or unnecessary props such as `order` from
`ResizablePanel` components, and ensured all size-related props are
consistently formatted as strings.
2026-02-23 19:48:19 +01:00
Joshen Lim 42f1344303 Ensure logs pages are accessible irregardless of project's status (#43010)
## Context

Ensure that project's logs pages are accessible irregardless of
project's status, given that logs are mutually exclusive from the
project's database and doesn't require the database to be online for it
to be functional.

## Other changes
Mainly around simplifying some logic within ProjectLayout
- Remove `disabled` prop in `SideBarNavLink` component, given that
`route` prop already has a `disabled` param
- Define `disabled` within `NavigationBar.utils.tsx` -> just have one
place to define the "configuration" of a route
- Minimize manually declaring specific routes to render specific UI (for
Restore failed)
  - All of these can be grouped under `routesToIgnoreDBConnection`

## To test
- [ ] Verify that you can access the logs page while the project is
coming up
- [ ] Verify that you can access the logs page on a paused project (and
also use it)
2026-02-19 17:53:45 +08:00
Zachary Stallings 192cbfe999 One liner: Adding more specific css to target open and closing animations without affecting the resize animation (#42069)
## 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. One liner.

## What is the current behavior?

The resizable product menu to the left on drag responds with a slow drag
animation.
This is inconsistent with other resizable drag animations.


![supabase-resizable-before](https://github.com/user-attachments/assets/d8807aa9-2d9a-4371-a4a3-13f0983a1866)

## What is the new behavior?

the drag animation is consistent and snappy!


![supabase-resizable-after](https://github.com/user-attachments/assets/716c28af-3cba-4d97-8ee5-8d1331dd6bd5)


## Additional context

As far as I can tell the transition animation on the `ResizablePanel` is
for the open and closing of the menu and not for resizing. It looks like
a just overly broad transition target (`transition-all`).

The react-resizable-panels seems to use flex grow to do the animation.
The `transition-all` which is currently on the `ResizablePanel`
component is causing the flex grow to animate and this in turn is
causing some minor layout thrashing.
<img width="406" height="579" alt="Screenshot 2026-01-21 at 8 40 24 PM"
src="https://github.com/user-attachments/assets/9282731a-f1d6-411d-9092-25f0bddff29f"
/>

After this update the layout thrashing from flex-grow is fixed.
<img width="539" height="520" alt="Screenshot 2026-01-21 at 6 38 00 PM"
src="https://github.com/user-attachments/assets/dc2b2e28-8298-400e-8f19-77edaf6b9884"
/>

Related to [this](https://github.com/supabase/supabase/issues/27801)
issue.

<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit

* **Style**
* Refined sidebar animation to animate width-related properties only,
delivering smoother and more responsive open/close transitions without
changing timing.

<sub>✏️ Tip: You can customize this high-level summary in your review
settings.</sub>
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2026-02-18 08:52:48 -07:00
Francesco Sansalvadore bd9e78b209 chore: dashboard header alignments (#42769)
Align borders to match header heights.

<img width="2904" height="1734" alt="shot_2026-02-04_at_08 42 21z_2x"
src="https://github.com/user-attachments/assets/0538f8eb-64a5-4329-94fb-3ea4feed847d"
/>
2026-02-13 11:48:12 +01:00
Charis f7bf7d7ce4 feat(studio): move data api docs to integrations section (#42749)
Feature / Refactor

## What is the current behavior?

Data API docs live at the `/api` route as a standalone page. Old links
point to the previous location.

## What is the new behavior?

Data API docs are moved to the integrations section with a dedicated
docs tab and settings tab. Old links are cleaned up, a mobile menu is
added for data API docs navigation, and minor code review fixes are
applied.

## Additional context

Resolves FE-2517

## Summary by CodeRabbit

* **New Features**
* Revamped API docs UI with reusable section layout, language toggle
(JS/Bash), API key selection, and improved code snippets
* Added Data API docs tab, mobile navigation, and dedicated
loading/error/disabled states

* **Navigation Updates**
* Moved API docs and related links into the Integrations/Data API area
and added redirects to new routes
* Updated various internal links to the new Data API settings and
overview locations

* **Tests**
  * Added comprehensive unit tests for Data API utilities
2026-02-12 15:57:44 -05:00