Commit Graph

57 Commits

Author SHA1 Message Date
Alaister Young
b9df7aaf9e [FE-3711] feat(studio): make compute config read-only for HA projects (#49359)
Makes the compute-size configuration on Settings → Infrastructure
read-only for High Availability (Multigres) projects during Alpha — HA
projects run on a single fixed compute size and resizing isn't supported
yet (previously attempting one could leave a project stuck Resizing).

Gated on `project.high_availability` via the existing
`useHighAvailability()` hook — the same signal every other HA gate in
Studio uses.

**Changed:**
- Compute size options other than the project's current size render with
the existing locked treatment (greyed out, lock icon, tooltip) for HA
projects, and the whole radio group is disabled
- A `HighAvailabilityDisabledSectionNotice` in the Compute section
explains that HA projects run on a fixed compute size during Alpha
- The compute branch of `onSubmit` and the read-replica
compute-recommendation handoff are skipped for HA projects, so a compute
change can never reach `POST /billing/addons`
- The "Contact Us" larger-sizes card is hidden for HA projects
- Form initialization now also fires once the project loads for HA
projects (disk-attribute queries never run on their cloud provider, so
the existing reset effect never fired and the picker showed the
`ci_micro` fallback as selected)

**Added:**
- Two MSW page tests in the Infrastructure suite covering the HA
read-only state and the unchanged editable state for non-HA projects

## To test

- On an HA (Multigres) project: Settings → Infrastructure should show a
notice under Compute size, the project's current size selected, every
other size locked with a tooltip, no "Contact Us" card, and clicking any
option should never surface the "Review changes" bar
- On a regular project: compute selection, "Review changes" → "Confirm
changes", and the Contact Us card all behave as before
- `pnpm vitest run
"tests/pages/project/[ref]/settings/infrastructure.test.tsx"`

Addresses
[FE-3711](https://linear.app/supabase/issue/FE-3711/make-compute-configuration-read-only-for-mvp)

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

## Summary by CodeRabbit

* **New Features**
* Added High Availability notices and guidance to the Compute settings.
* High Availability projects now show compute sizes as read-only, with
explanations for unavailable options.
* Hid the larger-instance contact option for High Availability projects.

* **Bug Fixes**
* Prevented unsupported compute resizing and add-on changes for High
Availability projects.
  * Preserved compute resizing and review actions for standard projects.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->

---------

Co-authored-by: Alaister Young <10985857+alaister@users.noreply.github.com>
2026-08-24 16:09:43 +08:00
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.
2026-08-21 12:44:41 +10:00
Danny White
5f9ce727c0 fix(ui): systematise control surface fills and hover borders (#48887)
## What kind of change does this PR introduce?

Bug fix / design-system token hygiene for form and selector chrome.

## What is the current behavior?

After opaque default-button fills, text fields, selects, and selector
tiles drifted apart: inputs and selects mixed ad-hoc washes, hover
borders bounced between `border-stronger` / `border-foreground-muted`,
invalid fields had no hover step, and composites like InputGroup leaked
inner hover borders.

Follow-up to #48837 (opaque button fills) where Select rest still felt
darker than Input on forms such as scoped access tokens.

## What is the new behavior?

Named control roles and one interactive border:

| Role | Fill | Rest border | Hover / focus / open |
| --- | --- | --- | --- |
| Field (sunk) | `bg-field` | `border-control` | `border-control-hover`
|
| Raised control | `bg-control-raised` | `border-strong` |
`border-control-hover` |
| Overlaying action | card → popover | `border-strong` |
`border-control-hover` |
| Invalid field | `bg-destructive-200` | `border-destructive-400` |
`border-destructive` |

- `--field` / `--control-raised` / `--border-control-hover` live in
`semantic.css` (source of truth for roles; README points there)
- Input / Textarea / InputGroup / legacy TextArea use the field ladder
(incl. invalid hover)
- Select and empty MultiSelect use raised; filled MultiSelect sinks to
field
- Default + dashed Button, CommandMenu trigger, and radio
card/stacked/large use `border-control-hover`
- Studio selector tiles aligned: Connect mode, role impersonation,
DuckLake modes, compute “Contact us”

| Before and After |
| --- |
| <img width="1576" height="759" alt="Access Tokens Account Supabase"
src="https://github.com/user-attachments/assets/4bbe8b2b-a31a-4d63-80ba-04a1a8a5609d"
/> |
| <img width="1576" height="759" alt="Access Tokens Account Supabase"
src="https://github.com/user-attachments/assets/92271223-4103-4cc6-a7c0-9e4ff71cce30"
/> |

## Additional context

`--control-raised` aliases `--card` today (role name so fill can diverge
later). Rest `border-control` / `border-strong` both still map to
`--input` via compat; the shared interactive step is
`--border-control-hover`.

## To test

1. **[Account → Access
Tokens](https://studio-staging-git-dnywh-fixcontrol-surface-tokens-supabase.vercel.app/dashboard/account/tokens)**
Open Generate / New scoped token. Side-by-side Input, Select,
RadioGroupStacked, MultiSelect. Confirm sunk vs raised fills, shared
hover border, MultiSelect flips to sunk once a value is selected. Leave
a required field empty to check invalid rest → hover → focus.

2. **[Org →
Projects](https://studio-staging-git-dnywh-fixcontrol-surface-tokens-supabase.vercel.app/dashboard/org/_)**
Hover the dashed Status filter. Hover default / filled filter buttons
when active. Confirm hover/open borders match.

3. **[Project →
Connect](https://studio-staging-git-dnywh-fixcontrol-surface-tokens-supabase.vercel.app/dashboard/project/_)**
Open Connect from the header. Mode grid tiles: hover + selected borders
match radio cards (no old muted-foreground ring).

4. **[Project →
Compute](https://studio-staging-git-dnywh-fixcontrol-surface-tokens-supabase.vercel.app/dashboard/project/_/settings/infrastructure)**
(optional)
   Compute size radios + “Contact us” tile hover.
2026-08-18 16:54:25 +10:00
Joshen Lim
a0cec24f49 Remove references to fly (#48648)
## Context

As per PR title - should not have any visual nor functional change 

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

## Summary by CodeRabbit

- **Changes**
- Standardized infrastructure, region, and database configuration around
AWS-based environments.
- Removed Fly.io-specific region and provider options from project
creation, instance sizing, and infrastructure settings.
- Enabled disk validation, spend-cap eligibility, backup restoration,
and extension setup consistently across supported projects.
- Updated billing and region displays to use the applicable AWS
configuration.
- **Bug Fixes**
- Corrected project-specific restrictions that could incorrectly hide
configuration and billing controls.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2026-08-03 21:14:50 +07:00
Joshen Lim
fcfb0f0222 Refactor all usage of form.watch to either useWatch or subscribe (#48436)
## Context

Replaces all usage of `form.watch()` to use `useWatch` instead + follows
the "name what you watch" convention as specified in the react-hook-form
skills.

There's also a small refactor in `SmtpForm.tsx` which removes the
unnecessary use of a `useState` to track if SMTP is enabled or not

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

* **Improvements**
* Updated many Studio forms to watch specific fields more precisely,
improving live UI updates for previews, warnings, conditional sections,
and validation messages.
* Enhanced responsiveness across settings, authentication, billing,
storage, integrations, and support flows while keeping save/update
behavior the same.
* **Refined Experiences**
* Improved the analytics table creation flow with tighter, enum-based
column type validation and structured, type-specific column options.
* **Preserved Behavior**
* Maintained existing permission checks, submission flows, and
account-management workflows.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2026-07-30 11:45:40 +08:00
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>
2026-07-29 19:26:28 +08:00
Saxon Fletcher
618e003136 Modernize compute and disk configuration (#48368)
## Summary

This is a precursor to unifying "compute and disk" and "infrastructure
pages". First step is just updating the existing compute and disk page
to make use of standard page and form patterns.

- Reorganizes the existing Compute and Disk form into the established
settings layout pattern, with Scaling, Compute, Disk, and Advanced
sections.
- Moves billing deltas to section headers while retaining the sticky
review footer.
- Adds animated notices, validation-error scrolling, and a responsive
compute-size selector (2 columns by default, 3 from 680px, and 4 from
900px).
- Preserves permissions, entitlements, cooldowns, read-only warnings,
replica pricing, GP3 validation, Nano/PITR locks, and the free Micro
upgrade treatment.
- Keeps the redesigned experience on `/settings/compute-and-disk` so it
can be reviewed independently of the route cutover.

## Stack

1. #48368 (this PR)
2. #48369
3. #48370

## How to test

1. Check out `chore/infra-compute-1-config` and start Studio with `pnpm
dev:studio`.
2. Open `/project/<ref>/settings/compute-and-disk`.
3. Confirm the page header and Scaling, Compute, Disk, and Advanced
sections follow the standard settings-page spacing, with the plan notice
directly below the Scaling header.
4. Change the compute size and disk configuration. Confirm billing
deltas appear in the relevant section headers and the sticky review
footer summarizes and applies the pending changes.
5. Enter invalid GP3 IOPS or throughput values and submit. Confirm the
validation message is shown and the first invalid field is scrolled into
view.
6. Exercise representative project states: insufficient permissions,
read-only mode, resize cooldown, Nano with PITR, a project with read
replicas, and a free Micro upgrade. Confirm the existing locks,
warnings, pricing, and upgrade treatment remain intact.
7. Resize the viewport and confirm the compute cards use 2 columns by
default, 3 columns from 680px, and no more than 4 columns from 900px.


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

- **New Features**
- Reworked the Compute and Disk settings UI into clearer sectioned
pages, including smoother navigation to the first validation error.
- Added a transitional in-form NoticeBar for consistent alert rendering.
- Improved billing change badges to reflect accurate before/after
totals.
- **Bug Fixes**
  - Fixed disk IOPS/throughput pricing to include replica-based charges.
- Strengthened disk sizing validation (GP3 limits, legacy/size edge
cases, spend-cap behavior, and provider-specific constraints).
- **Refactor**
  - Updated key form field layouts for improved readability.
- **Tests**
  - Expanded schema validation and pricing/billing badge test coverage.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

---------

Co-authored-by: Alaister Young <10985857+alaister@users.noreply.github.com>
2026-07-29 10:56:19 +10:00
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>
2026-07-29 00:48:56 +08:00
kemal.earth
84e273cf0b fix(studio): alignment of compute pricing blocks on compute settings (#48289)
## 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?

Fixes alignment issues across viewports with the size blocks on compute
& disk page.





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

## Summary by CodeRabbit

* **New Features**
  * Added responsive container support for horizontal form layouts.
* Compute-size options now adapt more smoothly to available screen
space.
* Preserved existing loading states, error messages, pricing details,
locked options, and larger-compute guidance.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2026-07-24 17:35:50 +01:00
Ali Waseem
da7a10be6b chore: simplify CPU messaging for compute sizes (#48109)
## Summary
- Simplify CPU messaging on the Compute and Disk docs page and in
Studio's compute size UI to keep it generic rather than
architecture-specific.

## Test plan
- [x] Unit tests pass
- [x] Typecheck passes
- [x] Lint passes

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

* **Updates**
* Simplified compute size labels across the UI by removing
cloud-provider architecture details from CPU text.
* Standardized CPU descriptions to show core counts and whether
resources are shared or dedicated.
* Updated the “Compute Size” pricing/specs table in the compute & disk
guide to use generic CPU labels while keeping pricing, memory, and
database size guidance the same.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2026-07-21 06:40:50 -06:00
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
2026-06-30 09:23:17 +02:00
Gildas Garcia
1059b726ce use Admonition instead of deprecated NoticeBar (#47262)
## Problem

The `NoticeBar` component is flagged as deprecated and should be
replaced by `Admonition`

## Solution

- Refactor `NoticeBar` usages to `Admonition` (no visual changes
detected)
- Delete `NoticeBar`

You can see one easily in _Project Settings/Compute and Disks_ and
opening the _Advanced disk settings_ collapsible section

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

## Summary by CodeRabbit

* **UI Improvements**
* Updated disk management alerts and guidance to use a newer, more
consistent notification style.
* Improved visibility of messages for pending disk changes, permission
limits, AWS availability, and advanced disk requirements.
* Refreshed the compute-size upgrade prompt with the same updated alert
styling.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2026-06-25 10:15:06 +02:00
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>
2026-06-16 23:59:58 +02:00
Gildas Garcia
5d97339d41 chore: remove <Select> _Shadcn_ suffix (#45988)
## Problem

The `_Shadcn_` suffix isn't needed anymore on `Select` components

## Solution

Remove it. No other changes

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

## Summary by CodeRabbit

* **Refactor**
* Updated internal component architecture to standardize and simplify
the codebase. These changes improve code maintainability and consistency
across the application without affecting existing functionality or user
experience.

<!-- review_stack_entry_start -->

[![Review Change
Stack](https://storage.googleapis.com/coderabbit_public_assets/review-stack-in-coderabbit-ui.svg)](https://app.coderabbit.ai/change-stack/supabase/supabase/pull/45988)

<!-- review_stack_entry_end -->

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2026-05-15 16:39:57 +02:00
Ivan Vasilov
56de26fe22 chore: Migrate the monorepo to use Tailwind v4 (#45318)
This PR migrates the whole monorepo to use Tailwind v4:
- Removed `@tailwindcss/container-queries` plugin since it's included by
default in v4,
- Bump all instances of Tailwind to v4. Made minimal changes to the
shared config to remove non-supported features (`alpha` mentions),
- Migrate all apps to be compatible with v4 configs,
- Fix the `typography.css` import in 3 apps,
- Add missing rules which were included by default in v3,
- Run `pnpm dlx @tailwindcss/upgrade` on all apps, which renames a lot
of classes
- Rename all misnamed classes according to
https://tailwindcss.com/docs/upgrade-guide#renamed-utilities in all
apps.

---------

Co-authored-by: Jordi Enric <jordi.err@gmail.com>
2026-04-30 10:53:24 +00:00
Joshen Lim
7f5865872a Enforce noUnusedLocals and noUnusedParameters in tsconfig.json + fix all related issues (#45264)
## Context

Enforce `noUnusedLocals` and `noUnusedParameters` in tsconfig.json + fix
all related issues
2026-04-27 17:42:34 +08:00
Gildas Garcia
0facd341a6 chore: remove UI form components _Shadcn_ suffix (#45212)
## Problem

We used to have a `_Shadcn_` suffix for all the shadcn form components
because we also had `formik` form components.
This is not needed anymore.

## Solution

- Remove the suffix
- Update all usages
2026-04-24 12:14:15 +02:00
Joey Freeland
bc1e5c7760 fix(studio): allow compute changes when disk is below 8GB (#45137)
Projects that upgrade from free → paid keep their original sub-8 GB disk until the first usage-driven auto-expand fires. During that window, the compute-and-disk settings page is broken in several ways.  This PR fixed it.
2026-04-22 20:06:08 -04:00
Gildas Garcia
d95fdfd566 fix: input-group don't have the proper validation attributes (#44703)
## Problem

The input groups components introduced in #44282 don't have the
validation attributes when invalid. This hurts accessibility and also
break the design:
<img width="1730" height="324" alt="image"
src="https://github.com/user-attachments/assets/a3fb8d86-f3a8-46bb-aa53-d0599c11f056"
/>

## Solution

This is because the wrapper `<FormControl_Shadcn_>` passes the
validation props to its direct child.
The solution is to avoid applying them on the `<InputGroup>` and to
apply them manually on the inputs.

I also fixed a small accessibility issue by moving the addon texts after
the input so that screen readers announce them in the correct order. No
visual change for this

<img width="587" height="158" alt="image"
src="https://github.com/user-attachments/assets/1f8858ea-6659-45f9-964e-8c43a7fe14ba"
/>


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

* **Style**
* Unified numeric input layout by moving unit labels/suffixes (e.g.,
"seconds", "GB", "%", "connections", "digits", "IOPS", "MB/s", "rows")
to appear after their inputs for a consistent, predictable form
appearance.

* **Accessibility**
* Form controls now expose IDs and ARIA attributes from form context
when available, improving screen-reader descriptions and error
association.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

---------

Co-authored-by: Ivan Vasilov <vasilov.ivan@gmail.com>
2026-04-10 11:45:30 +10:00
Charis
205cbe7d26 chore(studio}: enforce import order, remove bare import specifiers (#44585) 2026-04-07 20:34:10 -04:00
Jordi Enric
c3af2858bd feat(compute): collapse large instance sizes behind expand toggle DEBUG-50 (#44189)
## Problem

The Compute and Disk settings page shows all 12+ instance sizes (Nano
through >16XL) in a grid, which requires scrolling on smaller screens
like a 13" MacBook. This makes it impossible to see all three sections
(compute size, disk size, advanced settings) in a single view. Free tier
users have no need to see 8XL, 12XL, or 16XL options.

## Fix

Show only the first 6 compute sizes (Nano through XL) by default,
cutting the grid from 4 rows to 2 rows. Larger sizes (2XL and above,
plus the >16XL contact card) are revealed via a "Show all sizes" toggle
button below the grid. The grid auto-expands if the project is already
running on a large instance size so the selected option is always
visible.

## How to test

- Go to Settings > Compute and Disk on a project
- Verify only 6 cards are visible by default (Nano, Micro, Small,
Medium, Large, XL)
- Verify the Disk size and Advanced settings sections are visible
without scrolling on a 13" screen
- Click "Show all sizes" and verify the remaining sizes appear (2XL
through 16XL plus the >16XL contact card)
- Click "Show fewer sizes" and verify the grid collapses back to 6 cards
- On a project running 4XL or larger, verify the grid opens expanded by
default so the selected card is visible

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

## Summary by CodeRabbit

* **New Features**
* Compute size options now display in a compact view with a toggle to
expand and show all available sizes
* Auto-expands to reveal the currently selected compute size when it's
not visible in the initial view
  * Enhanced loading state for improved visual clarity

<!-- end of auto-generated comment: release notes by coderabbit.ai -->

---------

Co-authored-by: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-04-01 12:29:04 +02:00
Charis
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
Gildas Garcia
18e4ad227e chore: add shadcn input-group components (#44282)
## Screenshots

On a number input with units:
<img width="660" height="162" alt="image"
src="https://github.com/user-attachments/assets/1758a6d9-0836-4d41-80d1-97a03292db91"
/>

focused state:
<img width="651" height="71" alt="image"
src="https://github.com/user-attachments/assets/a92a5c39-2c7e-4c5f-9e4b-eb89810cc45c"
/>

On a textarea:
<img width="989" height="294" alt="image"
src="https://github.com/user-attachments/assets/cc696cb9-3671-4719-bdd8-daa1aea4f041"
/>
2026-03-31 09:14:56 +02:00
Ivan Vasilov
9fa96977be chore: Minor prettier fixes (#43849)
This PR fixes some prettier issues:
- Bump and unify all prettier versions to 3.7.3 across teh whole repo
- Bump the SQL prettier plugin
- When running `test:prettier`, check `mdx` files also
- Run the new prettier format on all files

---------

Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
2026-03-17 11:17:42 +01:00
Jordi Enric
022b510269 fix: centralize compute disk limits data and update documentation (#41242)
https://linear.app/supabase/issue/FE-2226/fix-incorrect-baseline-and-max-iopsthroughput-values

- Centralized compute/disk limits in
packages/shared-data/compute-disk-limits.ts (MB/s, baseline+max
IOPS/throughput) and re-exported from shared-data.
- Hooked Docs compute/disk table into shared data, converted docs
text/table to MB/s baseline/max.
- Removed duplicated compute IOPS/throughput constants from Studio,
Studio now imports shared data.
- Updated Studio disk schema: compute-aware MAX IOPS/throughput
validation (MB/s), defaults computeSize to ci_micro, and gp3/io2 checks
use compute caps.
- Clarified disk update mutation to send throughput as MB/s despite
backend throughput_mbps field name.
- Added tests for compute-size mappings and IOPS helper logic.
- Added Infra ownership for shared compute/disk data in CODEOWNERS.
- Locked zod version via catalog and added zod dep to shared-data.

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

* **New Features**
* Added a reusable Compute Disk Limits table and centralized compute
disk limits dataset for dynamic display.

* **Documentation**
* Replaced static per-size tables with a component-driven MB/s view;
clarified baseline vs. burst behavior and updated guides and
troubleshooting.

* **Bug Fixes**
* Validation and UI guidance now honor compute-size limits for IOPS and
throughput.

* **Tests**
  * Expanded unit tests for sizing, mappings, and edge cases.

* **Chores**
* Published shared-data exports, added a validation schema, pinned a
dependency, and added ownership entries.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2026-02-03 10:52:42 +00:00
Ivan Vasilov
0d5be306ef chore: Bump React Query to v5 (#40174)
* Bump the deps, refactor deprecated code.

* Migrate keepPreviousData usage.

* Migrate all uses of InfiniteQuery.

* Fix refetchInterval in queries.

* Migrate all use of isLoading to isPending in mutations.

* Fix accessing location in claim-project.

* Fix a bug in duplicate query keys.

* Migrate all queries to use isPending.

* Revert "Fix accessing location in claim-project."

This reverts commit 2a07df64b5.

* Revert the rss.xml file to master.
2025-12-10 10:10:29 +01:00
Danny White
031b227165 studio(chore): badge component defrag (#40118)
* component clean up

* optically center

* docs and type size

* code badge variant

* sensible defaults

* fix product menu flex

* badge sweep

* new project badges

* logs

* compute badge

* studio badge sweep

* www sweep

* docs sweep

* clean up

* fixes

* cleanup

* fixes

* better docs

* fixes

* misc fixes

* consistency

* Minor fixes for issues i found

* simplify mt-0

* mt simplification

* remaining optical alignment

---------

Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
2025-12-02 11:15:50 +11:00
Ignacio Dobronich
35387c6f1c chore: compute entitlement set (#40352)
* chore: compute entitlement set

* Clean up

* Clean up

* Format
2025-11-12 14:06:54 -03:00
Charis
d8f7cc0d57 feat(support form): attach dashboard logs (#39539)
* o11y: mirror and sanitize breadcrumbs

Mirror Sentry breadcrumbs as the basis for our own support logging. Also
adds more sanitization to breadcrumbs.

* feat(support form): toggle for attaching dashboard  logs

Add a toggle to the support form when the category is "Dashboard bug",
to attach recent dashboard logs. Users can preview the attached logs and
opt out.

* feat(support links): dedicated support link component

Add a new component for support links, which:
- Uses the serializer for support link params to ensure
serialization/deserialization pairs correctly
- Snapshots breadcrumbs so the attached log on the support form will be
cut off at the support link click (otherwise we will get support form
actions cluttering up the log)

* tests(support form): extend timeout on flaky test

* Minor clean up

* fix(support form): allow url to specifically indicate no specified project

* minor nits

* Fix tests

* Fix tests

---------

Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
2025-10-22 08:57:49 -04:00
Joshen Lim
c74dbc5f73 Add callout for migration (#39230)
* Add callout for migration

* Update copy

* Update date

* remove docs button

* Fix conditional - storage upgrade prompt should only show if list v2 is false
2025-10-06 13:31:53 +08:00
Alaister Young
5f533247e1 Update docs url to env var (#38772)
* Update Supabase docs URLs to use env variable

Co-authored-by: a <a@alaisteryoung.com>

* Refactor: Use DOCS_URL constant for documentation links

This change centralizes documentation links using a new DOCS_URL constant, improving maintainability and consistency.

Co-authored-by: a <a@alaisteryoung.com>

* Refactor: Use DOCS_URL constant for all documentation links

This change replaces hardcoded documentation URLs with a centralized constant, improving maintainability and consistency.

Co-authored-by: a <a@alaisteryoung.com>

* replace more instances

* ci: Autofix updates from GitHub workflow

* remaining instances

* fix duplicate useRouter

---------

Co-authored-by: Cursor Agent <cursoragent@cursor.com>
Co-authored-by: alaister <10985857+alaister@users.noreply.github.com>
2025-09-26 10:16:33 +00:00
Alaister Young
7f0fbe378d chore: add compute price to enabled features (#38696) 2025-09-16 03:13:34 +00:00
Han Qiao
0487fbf625 fix: let api handle signing key validation error (#38649)
* fix: let api handle signing key validation error

* Fix styles

---------

Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
2025-09-12 17:50:27 +08:00
Joshen Lim
a3035733d1 Make project infinite query keys fully unique (#38624)
* Make project infinite query keys fully unique

* Clean up
2025-09-12 10:50:55 +08:00
Danny White
65b962e771 design system: text color contrast (#38343)
* Refactor Drawer component and add date-fns dependency

Refactored the Drawer component for improved slot-based structure, updated styles, and added 'use client' directive. Added 'date-fns' as a dependency in design-system, updated tsconfig paths for icons, and marked ToggleGroup as a client component.

* nit: add env for svg path

* fix: instructions

* accent color docs and basic tidy

* copy value feature

* improve color contrast

* increase contrast on text-warning in light mode

* update changelog

* replace outdated text-warning utility classes

* remove redundant warning-600

* minor design-system docs updates

* docs updates

* remove unused brand-button class

* update docs

* fix: restore brand default

* update docs brand text color

* low hanging branded text fruit

* Nit refactor and clean  up

* re-add Kemal’s README instructions for hot reload

---------

Co-authored-by: Jonathan Summers-Muir <MildTomato@users.noreply.github.com>
Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
2025-09-09 11:45:08 +10:00
Joshen Lim
cab0585533 Fe 1799/consolidate to useselectedprojectquery and (#37684)
* Replace all usage of useProjectContext with useSelectedProjectQuery

* Replace all usage of useSelectedProject with useSelectedProjectQuery

* Replace all usage of useProjectByRef with useProjectByRefQuery

* Replace all usage of useSelectedOrganization with useSelectedOrganizationQuery

* Deprecate useSelectedProject, useSelectedOrganization, and useProjectByRef hooks

* Deprecate ProjecContext
2025-08-06 10:53:10 +07:00
Kevin Grüneberg
9765a70a73 fix: disk attributes on compute down size (#36788)
When downgrading from a larger compute size to <large while having provisioned IOPS or throughput, we would leave the disk as-is, even though the configuration is unsupported and then block any disk changes because the instance size is too small, essentially dead-locking the customer on the disk attributes, unless they bump back up to a higher instance size.

PR addresses multiple issues:
- Automatically reset disk attributes to default when customers downgrade to <large instances
- Do not use the baseline compute IOPS/throughput for the fields, as this leads to accidentally over-provisioning by customers
2025-07-01 17:25:11 +08:00
Kevin Grüneberg
e1bd23d66f fix: do not translate USD prices (#35466)
When translation tools go over prices, they wrongfully convert USD into other currencies without changing the price. $25 becomes Rp25 (Rupiah).

By using `translate='no'` we avoid the translation of pricing info. There are some tooltips left that are not covered yet, but this should be the majority already.

Kept the docs Pricing component as simple as possible, just wrapping in a span to avoid translation, not modifying any formatting.
2025-05-06 12:03:35 +08:00
Joshen Lim
323ac72cb1 FIx layout in support form (#35065) 2025-04-21 15:36:42 +07:00
Kevin Grüneberg
d05bbb669f perf: use subscription plan from org response (#34993) 2025-04-14 20:37:19 +08:00
Kamil Ogórek
c3a352331a ref: Fix all API types after Zod migration (#34903) 2025-04-11 10:28:08 +08:00
Joshen Lim
04600dd711 Fix compute size check in PITR side panel (#34858)
* Fix compute size check in PITR side panel

* Disable confirm button if trying to enable without sufficient compute size

* Prevent downgrading to micro if PITR enabled

* Tiny fgix

* Update apps/studio/components/interfaces/DiskManagement/fields/ComputeSizeField.tsx

Co-authored-by: Alaister Young <alaister@users.noreply.github.com>

* Pretty

---------

Co-authored-by: Alaister Young <alaister@users.noreply.github.com>
2025-04-10 15:53:05 +08:00
Saxon Fletcher
5fe1bdd54d container queries basics (#34724)
* container queries basics

* refine padding

* add contain

---------

Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
2025-04-09 15:28:21 +08:00
Jonathan Summers-Muir
fb24d91305 Feat/ Org layout (#33150)
* update test

* move back button, fix width issues on sidebar

* update sidebar logic

* Update ProjectLayout.tsx

* lots of updates. layouts now streamlined. localstorage for tabs in use

* moar

* bunch of new tab logic

* fix empty tab issue

* Update tabs.ts

* layouts switched

* new pages now have fixed layouts

* fix tabs

* fix code bg

* add tabs support for multiple project refs

* intialization issue

* update ID handling

* fixed isOpened state for SQL snippets

* remove old assistant because its bugging up panels

* preview style works in sql editor

* fix border

* removes preview tab if there is one

* fix background of loading skeleton

* lots of issues with types/icons/redirect

* new tab cards

* snippets in empty state now work

* moar stuff

* tabs now in feature flags

* Update tabs.ts

* Update tabs.ts

* moar

* add feature previews

* remove code not needed

* Update next-env.d.ts

* Delete FeaturePreviewModal.tsx

* fix typescript errors. remove more explorer stuff

* remove explorer files

* fixed issues with templates and quickstarts tab

* fixed active state when tabs are not opted in

* logic error

* fix open/highlight issue when opted out of tabs

* templates/quickstarts now displayed with new cards

* Update recent-items.tsx

* Update new-tab.tsx

* add icon back in

* add old empty state back in

* recent items updated to respect project ref

* localstorage cleanup on deletion

* moar

* overflow tabs now working

* correct tab names used for new sql templates/quickstarts

* ongoing queries fix

* cleanup

* update images

* Update RouteValidationWrapper.tsx

* Update AppLayout.tsx

* Update NavigationBar.tsx

* add headers back into side panels

* improve writing

* tabs now drag and drop a billion times better

* Update tabs.tsx

* Update tabs.tsx

* init issues on stores, which caused a race condition.

* fix hydration error

* init

* init sidebars

* init

* Update app-default-navigation.tsx

* user dropdown updates

* moar layouts

* init

* moar

* moar

* updat

* reverse top bar

* some banners

* moar

* start adding account page

* change styling of dropdowns

* Update sidebar.tsx

* fix new tab issue in sql

* Update ProjectLayout.tsx

* Update pnpm-lock.yaml

* latest

* Update pnpm-lock.yaml

* moar layouts on account

* getLayout updates

* more fixes

* force a cache build

* moar

* Update app-default-navigation.tsx

* fix AI button animation

* moar layout

* account pages refactored

* Update user-dropdown.tsx

* Update new-tab.tsx

* move EditorMenuListSkeleton

* Fix type issues

* fixes: DESIGN-87

fixes: DESIGN-87

* refactor sort/filter components

* Update rules-set-button-text.tsx

* remove discussions for now

* small styling fixes

* Update FeaturePreviewModal.tsx

* Update FeaturePreviewModal.tsx

* Update RouteValidationWrapper.tsx

* revert

* revert

* revert

* revert

* revert

* more revert

* Update collapse-button.tsx

* Update SQLEditorTreeViewItem.tsx

* revert

* Update SchemaGraph.tsx

* Delete new-upcoming.tsx

* revert

* Update ProjectLayout.tsx

* fix home link

* Update table-editor.spec.ts

* test update

* Update projects.tsx

* remove

* Delete sidebar-open-top-banner.tsx

* add organizations page

* Update table-editor.spec.ts

* Fix the playwright tests.

* layout fixes

* layout fix

* revert sort/filter

* Update LastSignInWrapper.tsx

* revert

* revert

* remove

* update file names

* revert

* revert

* revert

* advisor lint page tabs revert

* revert

* revert

* revert

* revert

* revert

* revert tabs

* remove packages

* add sidebar

* sidebar docs added

* add sidebar

* fixed issues

* fix mobile

* fixes

* add org side bar in

* redirect updated

* fix more layouts

* move settings icon back down

* remove old stuff

* Delete SideBar.tsx

* use ProfileImage component

* spelling

* Update ThemeSettings.tsx

* Update ThemeSettings.tsx

* Update Sidebar.tsx

* layout udpate

* Update Sidebar.tsx

* fixes

* Minor lints

* Update Sidebar.tsx

* create a alt user dropdown for self hosting and local

* add fragment back in

* Adds Theme Selector for local/self hosting

* Update UserDropdown.tsx

* fix theme selector for local self host

* Update index.ts

* Update DefaultLayout.tsx

* now supports feature preview

* remove old files

* rename files

* revert

* Update LayoutHeader.tsx

* clean

* revert

* revert

* Update resource-banner.tsx

* remove redundant side bar stuff

* organizations action bar updated. removed hardcoded value

* fix type errors

* fix tests

* Undo test changes

* Fix account pages for when feature preview is off

* Bug fixes 1

* Missing key in map of EmailTemplates

* Fix missing border in StorageExplorer

* fix missing header in performance advisor

* Final clean up

* Fix DefaultLayout re-rendering issue on auth pages

* A couple of fixes

* Redirect to /organizations if land on /projects with feature preview on

* Route back to /projects if toggling preview off on /organizations

* Add HomePageActions to /org/slug

* make re-routing nicer

* Moar fixes

* Fix logging in redirect to /organizations irregardless of feature preview

* Fix missing withAuth in OrganizationLayout

* Minor clean upo

* Fix branch dropdown not aligned

* Add feature preview for update layout

* update dropdowns to only be chevron triggered in new layout

* Update content-query.ts

* Update entity-types-infinite-query.ts

* add IS_PLATFORM for org dropdown

* Add IS_PLATFORM check for EnableBranchingDropdown in LayoutHeader

* Midway fixing mobile nav

* Mobile nav fixes

* Address feedbacks

---------

Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
Co-authored-by: Alaister Young <a@alaisteryoung.com>
Co-authored-by: Ivan Vasilov <vasilov.ivan@gmail.com>
Co-authored-by: Jordi Enric <jordi.err@gmail.com>
2025-04-08 11:32:29 +08:00
Joshen Lim
0f0b02e0d9 chore: rework disk validation and cleanup (#34533) 2025-04-03 16:58:23 +08:00
Kevin Grüneberg
5eb57a4fa2 chore: mention larger instance sizes (#34473) 2025-03-28 12:55:41 +01:00
Pamela Chia
b19c043d93 fix: consistent disk unit (#34156)
* fix: consistent disk unit

* Update apps/docs/content/guides/platform/manage-your-usage/disk-throughput.mdx

* Update apps/docs/content/guides/platform/manage-your-usage/disk-throughput.mdx

* Update apps/docs/content/guides/platform/manage-your-usage/disk-throughput.mdx

* docs: makes use of singular/plural for metrics that are billed hourly consistent.

* ci: Autofix updates from GitHub workflow

* fix: instance is Mbps

* fix: description Mbps

---------

Co-authored-by: Thomas <31189692+ecktoteckto@users.noreply.github.com>
Co-authored-by: github-tidy-bot <github-tidy-bot@supabase.com>
2025-03-14 11:16:25 +01:00
Joshen Lim
a458977e2d Support for Dedicated Pooler in Connection Pooling (#33817)
* Init

* Initial set up for hooking up supavisor and pgbouncer

* Hook up pgbouncer status check after swapping pooler type

* Add check for nano compute for switching to pg bouncer

* Add check for ipv4 addon

* Remove expect error tag

* Add badge to select options for pooler types

* Remove statement mode

* Resolve undefined problem with react hook form

* Fix

* Update UI texts from PgBouncer to Dedicated Pooler

* Feex

* FEEX

* Fix

* Small update to UI

* Smol update
2025-02-28 11:14:42 +08:00
Terry Sutton
7ffd525da1 Chore/delay disk size report (#33686)
Dont show warning if project coming_up
2025-02-21 12:04:55 -03:30
Joshen Lim
681cf5098c Disable selection of io2 volume type if project region is not supported (#33733)
* disable selection of io2 volume type if project region is not supported

* Update apps/studio/components/interfaces/DiskManagement/fields/StorageTypeField.tsx

Co-authored-by: Alaister Young <alaister@users.noreply.github.com>

* Fix import

---------

Co-authored-by: Alaister Young <alaister@users.noreply.github.com>
2025-02-20 19:58:04 +08:00