Commit Graph

165 Commits

Author SHA1 Message Date
Danny White
a351a36e9b refactor(studio): centralise replication payload builders (#49842)
## What kind of change does this PR introduce?

Studio data-layer refactor.

## What is the current behavior?

Pipeline creation, editing, and validation build similar destination and
pipeline payloads separately. The duplicated mappings rely on type
assertions and can drift between actions.

## What is the new behavior?

Uses shared typed builders for create, update, and validation payloads
across the existing destinations. Update payloads continue to omit blank
secrets, while create payloads preserve their current values. This PR
does not add table partitioning configuration.

## To test

This is a data-layer refactor. No visible behaviour should change.

1. Open **Database > Replication** and click **Start a new pipeline**.
2. Select **BigQuery**, or any other enabled destination.
3. Edit a few non-secret fields and expand **Advanced settings**.
4. Confirm the form remains usable and no runtime errors appear.

Create, update, validation, and secret-handling behaviour is covered by
the focused tests and CI. Deploy previews and fresh local projects do
not have the existing destinations or credentials needed to exercise
those paths manually.

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

* **Bug Fixes**
* Improved replication destination configuration handling during
creation, updates, and validation.
* Applied consistent configuration mapping across supported destination
types.
* Ensured blank secret values are omitted during updates while retained
when creating destinations.
* Standardized table synchronization defaults when no specific setting
is provided.
* **Tests**
* Added coverage for BigQuery configuration mapping and secret handling.
  * Updated DuckLake tests for destination updates.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

---------

Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
2026-09-07 15:02:09 +08:00
Gildas Garcia
6e8b43d7b4 fix: improve useRefreshOnOpen hook (#49886)
## Problem
The `useRefreshOnOpen` returns a new object each time it runs, making
the `useCallback` useless.

## Solution
Wrap the function content in `useMemo` instead

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

* **Refactor**
* Improved refresh handling for the replication destination form when it
is opened.
  * Existing refresh behavior remains consistent and reliable.
* No user-visible changes to functionality, controls, or configuration
options.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2026-09-03 11:36:40 +10:00
Danny White
442e40a30b refactor(studio): simplify pipeline advanced settings (#49841)
## What kind of change does this PR introduce?

Small Studio UI refactor.

## What is the current behavior?

BigQuery-only fields are already conditionally rendered, but repeat that
scope in badges. Number inputs also convert non-empty invalid values
directly with Number().

## What is the new behavior?

Removes the redundant badges, keeps number fields empty instead of
storing NaN, and gives the invalidated-slot menu consistent viewport
collision spacing.

| Before | After |
| --- | --- |
| <img width="1238" height="364" alt="CleanShot 2026-09-02 at 14 40
02@2x"
src="https://github.com/user-attachments/assets/8c9b0c30-250e-422f-af3b-70f84e439459"
/> | <img width="1252" height="358" alt="CleanShot 2026-09-02 at 14 40
22@2x"
src="https://github.com/user-attachments/assets/8b3c6837-2c84-4c0d-ae07-b6b8b7a50cfe"
/> |

## To test

1. Open the pipeline creation sheet and expand Advanced settings.
2. Confirm connection pool size and maximum staleness appear only for
BigQuery, without BigQuery-only badges.
3. Clear and re-enter the numeric advanced settings.
4. Open Invalidated slot behavior near the viewport edge and confirm the
menu remains visible.

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

## Summary by CodeRabbit

* **Bug Fixes**
* Improved handling of numeric input in advanced replication settings,
including empty and invalid values.
  * Adjusted the invalidated slot menu positioning for better display.

* **UI Improvements**
* Simplified labels for connection pool size and maximum staleness
settings.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2026-09-03 10:09:44 +10:00
Danny White
924b3f5793 feat(ui-patterns): add async selection feedback (#49843)
## What kind of change does this PR introduce?

Shared UI pattern and Studio UX improvement.

## What is the current behavior?

Async selectors use bespoke loading and error layouts. Some replace the
entire field while fetching, and opening a selector does not
consistently refresh its options.

## What is the new behavior?

Adds shared loading, error, and empty states for Select, command, and
MultiSelector lists, including a persistent polite live region and
reduced-motion support. Analytics Bucket and DuckLake selectors keep
their controls in place, retain populated options during background
refreshes, and refresh when reopened.

## To test

Open the [Replication
preview](https://studio-staging-git-dnywh-featasync-selection-feedback-supabase.vercel.app/dashboard/project/_/database/replication?destinationType=Analytics%20Bucket).
The destination sheet should already be open on **Analytics Bucket**.

You do not need to create a bucket, configure a destination, or start a
pipeline. Open **Select a bucket**, then review these outcomes:

1. **The trigger stays put.** Opening the picker must not replace the
form field with a full-width loading placeholder.
2. **Loading belongs inside the menu.** While options are fetched, the
open menu shows a compact skeleton list.
3. **No resources has a clear explanation.** If the project has no
Analytics Buckets, the menu says **No buckets available**. It still
offers **Create a new bucket** beneath that message.
4. **Existing options do not disappear on refresh.** If the project does
have buckets, close and reopen the picker. Its current options remain
visible while the refresh happens in the background, rather than
flashing back to skeletons.
5. **The pattern is consistent.** If convenient, select a bucket and
open the namespace or access-key picker. The same in-menu loading,
empty, and error treatment applies there too.

The deterministic request-error and reduced-motion cases are covered by
focused unit tests because the deploy preview cannot reliably force
those states.
2026-09-02 14:25:03 +10:00
Alaister Young
b0e31be89a chore(studio): remove dead code found by knip (#49719)
Removes Studio code that nothing imports, as reported by knip. First PR
in a stack of three: this one is pure deletions, #49720 removes the
unused dependencies, #49721 upgrades knip and adds the CI gate so this
doesn't accumulate again.

Every file was verified with a repo-wide grep for its basename, exported
symbols, and string/dynamic imports before deletion — none are reachable
via `next/dynamic`, a barrel file, or a config.

**Removed:**
-
`Billing/Usage/UsageWarningAlerts/{CPU,RAM,DiskIOBandwidth}Warnings.tsx`
(whole directory)
- `DataWarehouse/FormFooterChangeBadge.tsx` (whole directory)
- `Database/Replication/ReplicationDiagram/EmptyReplicationDiagram.tsx`
- `Integrations/Vercel/OrganizationPicker.tsx`
- `QueryInsights/QueryInsightsTable/QueryInsightsTableRow.tsx`
- `hooks/misc/useTrackExperimentExposure.ts`
- `data/ai/{parse-client-code,sql-policy}-mutation.ts`,
`data/misc/parse-query-mutation.ts`,
`data/database/table-check-rls-mutation.ts`
-
`data/notifications/notifications-v2-{archive-all-mutation,summary-query}.ts`
+ their two now-unused keys in `notifications/keys.ts` (`listV2` kept)
-
`data/platform-apps/platform-app-{update,signing-key-delete}-mutation.ts`
- `DateTimeFormats.DATE_ONLY` and the unused
`Notebooks.{MarkdownCell,LogCell,ChartConfig}` types

**Changed:**
- `ReportPadding` no longer has a duplicate default export; its 9
default importers (observability pages) now use the named export

Not removed: `CONSTRAINT_TYPE`'s unused members mirror the closed set of
`pg_constraint.contype` values, so they're documentation rather than
dead code — suppressed narrowly in #49721's knip config instead.

## To test

- `pnpm --filter studio run typecheck` and `lint:ratchet` pass
- Observability pages (`/project/[ref]/observability/*`) still render
with padding — they're the only code touched, via the `ReportPadding`
import change
- Notifications popover still loads and marks-as-read (the removed keys
weren't used for invalidation)


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

## Summary by CodeRabbit

- **Removed Features**
  - Removed CPU, memory, and disk usage warning alerts.
- Removed the Vercel organization picker and empty replication diagram.
  - Removed query insights row actions and several SQL assistance tools.
  - Removed notification summary and archive-all capabilities.
  - Removed platform app update and signing-key deletion actions.
- Removed the form change-count badge and experiment exposure tracking.

- **Refactor**
- Updated observability reports to use the revised report layout export.

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

Co-authored-by: Alaister Young <10985857+alaister@users.noreply.github.com>
2026-08-31 10:55:23 +08:00
Danny White
27dba8d02d fix(studio): group pipeline destinations by release stage (#49669)
## What kind of change does this PR introduce?

UI clarity improvement for the current pipeline creation sheet.

## What is the current behavior?

All destination types appear under a generic Pipelines heading, with
release-stage badges repeated beside each option.

## What is the new behavior?

Destination types are grouped under Public Alpha, Early Access, and
Deprecated headings. The selected value stays compact, while its
release-stage guidance remains below the field.

| Before | After |
| --- | --- |
| <img width="1280" height="750" alt="CleanShot 2026-08-28 at 15 45
29@2x"
src="https://github.com/user-attachments/assets/5be32928-21fa-4911-bc68-3376c068703f"
/> | <img width="1280" height="888" alt="CleanShot 2026-08-28 at 15 44
49@2x"
src="https://github.com/user-attachments/assets/2046d174-dd4f-41f1-98da-3d8d48af8a1c"
/> |

## To test

1. Open a project, then go to Database → Replication and select Add
destination.
2. Open the Type selector.
3. Confirm available destinations are grouped by Public Alpha, Early
Access, and Deprecated.
4. Select BigQuery and confirm the field still explains that it is in
public alpha.
5. Edit an existing destination and confirm the Type selector remains
disabled.

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

## Summary by CodeRabbit

* **UI Improvements**
* Destination options are now organized into clear release-stage groups:
Public Alpha, Early Access, and Deprecated.
* Added group headings and separators to make destination selection
easier to scan.
* Removed individual stage badges from destination labels for a cleaner,
more consistent layout.

* **Tests**
* Updated coverage to verify grouping and visibility across supported
destination types.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2026-08-28 17:37:44 +10:00
Danny White
19e3844a0e feat(studio): upload BigQuery pipeline credentials (#49668)
## What kind of change does this PR introduce?

Feature improvement for BigQuery pipeline creation and editing.

## What is the current behavior?

Users must paste the complete service-account JSON into a text area.

## What is the new behavior?

Users can paste, upload, or drag and drop a service-account JSON file.
Imported credentials remain editable, and unreadable or oversized files
show an inline form error.

## To test

1. Open a project, then go to Database → Replication and select Add
destination.
2. Select BigQuery.
3. Under Service account key, select Upload JSON file and choose a
service-account `.json` file.
4. Confirm its contents appear in the editable text area.
5. Drag and drop a JSON file onto the same field and confirm it replaces
the contents.
6. Confirm pasting credentials manually still works.

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

* **New Features**
  * Added support for uploading BigQuery service account key JSON files.
  * Added drag-and-drop support for service account key files.
  * Updated guidance to clarify that keys can be pasted or uploaded.
  * Constrained the service account key field to 5,000 characters.

* **Bug Fixes**
  * Added clear validation when keys exceed the character limit.
* Improved handling of unreadable files while preserving the existing
key.
  * Improved editing of imported service account key content.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2026-08-28 17:37:31 +10:00
Danny White
02bb456647 fix(studio): clarify pipeline form guidance (#49666)
## What kind of change does this PR introduce?

UI copy improvement for the current pipeline creation sheet.

## What is the current behavior?

Several pipeline fields use ambiguous labels or omit useful guidance.
Validation messages also use inconsistent punctuation.

## What is the new behavior?

- Explains how the pipeline name is used
- Clarifies invalidated replication slot behaviour
- Explains that BigQuery maximum staleness is optional
- Makes pipeline validation messages consistent

## To test

1. Open a project, then go to Database → Replication and select Add
destination.
2. Confirm Name explains that it identifies the pipeline in Supabase.
3. Expand Advanced settings and confirm Invalidated slot behaviour uses
Block startup and Recreate slot.
4. Select BigQuery and confirm Maximum staleness explains that leaving
it blank gives the freshest results.
5. Submit incomplete destination settings and confirm validation
messages end with full stops.

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

* **New Features**
* Replication slot behavior options now use clearer labels: “Block
startup” and “Recreate slot.”
* Added guidance explaining that the pipeline name identifies the
pipeline in Supabase.
  * Improved the BigQuery maximum-staleness description and display.

* **Bug Fixes**
* Standardized replication destination validation messages with
consistent punctuation.
  * Clarified the ClickHouse HTTPS validation message.
  * Updated validation tests to reflect the improved error messages.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2026-08-28 17:37:08 +10:00
Danny White
777cf83ec4 feat(studio): add leave feedback on replication list (#49582)
## What kind of change does this PR introduce?

Feature.

## What is the current behavior?

Replication destinations list has docs and add-destination actions, but
no clear path to leave pipelines feedback.

## What is the new behavior?

Adds a **Leave feedback** button that opens the pipelines GitHub
discussion. Create destination still opens the existing sheet (no wizard
redirect in this PR).

| Before | After |
| --- | --- |
| <img width="1024" height="759" alt="Replication Database ETL BigTable
ETL Team Supabase"
src="https://github.com/user-attachments/assets/9a18a90b-3041-49f6-a65c-adb5c07ef0fe"
/> | <img width="1024" height="759" alt="47954"
src="https://github.com/user-attachments/assets/675d0137-9acb-436a-a3aa-741efeaf74bb"
/> |
| <img width="1024" height="759" alt="49523"
src="https://github.com/user-attachments/assets/1f8f5cd6-315f-45b1-a1e0-0b02a83d9780"
/> | <img width="1024" height="759" alt="Replication Database ETL
BigTable ETL Team Supabase"
src="https://github.com/user-attachments/assets/d61e0db9-e28f-4384-8206-4dedbf7ecc74"
/> |

## To test

1. Open a project → Database → Replication
2. Click **Leave feedback** in the list toolbar
3. Confirm it opens the pipelines discussion in a new tab
4. Confirm **Add destination** still opens the sheet as today

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

## New Features

- Added a feedback button to the replication destinations toolbar.
- Feedback opens the relevant discussion forum in a new browser tab.

## Improvements

- Simplified destination status descriptions for clearer presentation.
- Removed inline discussion links from individual destination
descriptions.
- Centralized feedback access in the replication destinations interface
for easier discovery.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2026-08-27 16:05:03 +08:00
Danny White
3945234b9e feat(studio): polish replication destination sheet form (#49581)
## What kind of change does this PR introduce?

Feature (sheet polish, no wizard).

## What is the current behavior?

Edit destination sheet uses a disabled region Select, weaker BigQuery
JSON validation messaging, and a name field that password managers may
fill.

## What is the new behavior?

- Read-only pipeline region field with flag, display name, region code,
and destination-specific hint
- Clearer BigQuery service-account JSON validation
- Destination name ignores password managers (`data-1p-ignore` and
related attrs)
- Advanced settings can optionally group fields (defaults keep full
accordion for the sheet)

Independent of the [create-pipeline
wizard](https://github.com/supabase/supabase/pull/49243). Safe to merge
on its own.

| Before | After |
| --- | --- |
| <img width="1024" height="759" alt="Replication Database Chisel
Toolshed Supabase"
src="https://github.com/user-attachments/assets/98360d10-3efd-4f77-9645-2f054bb8caab"
/> | <img width="1024" height="759" alt="Replication Database Chisel
Toolshed Supabase"
src="https://github.com/user-attachments/assets/fdb55904-44f5-4fdf-a750-d4b7f1602b4e"
/> |
| <img width="1024" height="759" alt="Replication Database Chisel
Toolshed Supabase"
src="https://github.com/user-attachments/assets/cd40e4c3-5653-467b-a3b6-c0c497f9c500"
/> | <img width="1024" height="759" alt="Replication Database Chisel
Toolshed Supabase"
src="https://github.com/user-attachments/assets/d4115dab-fd94-411c-bbc4-ee69e22436d6"
/> |

## To test

1. Open a project → Database → Replication
2. Edit an existing destination
3. Confirm **Pipeline region** is read-only (not a combobox) and shows
flag + region name/code
4. Open Advanced settings and confirm fields still appear
5. For BigQuery: paste invalid service-account JSON and confirm a clear
validation message

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

- **New Features**
- Added grouped advanced settings for connection and data configuration.
- Added a read-only pipeline region display with destination-specific
guidance.
  - Destination names now receive focus automatically when forms open.

- **Bug Fixes**
- Improved BigQuery credential validation, including malformed or
missing service-account keys.
- Password-manager autofill is now suppressed for destination name
fields.

- **Tests**
- Added coverage for BigQuery validation and pipeline-region display
behavior.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2026-08-27 10:17:36 +10:00
Alaister Young
928049ce2c [FE-3717] feat(studio): Multigres cluster topology diagram (#49298)
Adds an infrastructure/topology diagram for High Availability
(Multigres) projects showing the real cluster topology — gateway tier,
shard group, and the primary + read replicas inside it — on both the
project homepage and the database/replication page, replacing the
primary-only view and the "Replication unavailable" empty state.

<img width="790" height="541" alt="Screenshot 2026-08-20 at 8 23 42 PM"
src="https://github.com/user-attachments/assets/0bce21e3-2091-4285-84ca-60fdecb10d39"
/>

Addresses
[FE-3717](https://linear.app/supabase/issue/FE-3717/show-replicas-in-replication-diagram).

**Added:**

- `data/ha-admin/` — read-only queries for the mgmt-api
`/ha-admin/v1/{gateways,poolers,cells,databases}` multiadmin passthrough
(ported from `bobbie/ha-stub`, re-authored to `queryOptions`). Responses
are validated with zod at the fetch boundary (all fields optional per
proto3 zero-value omission; enum-shaped fields stay plain strings so new
proto values degrade gracefully); malformed payloads surface through the
diagram's error fallback.
- `HaTopology.utils.ts` — pure topology mapper (+ 26 unit tests): shard
grouping, primary identified via `routingState.role` (deprecated `type`
as fallback) with **failover-safe election** — when the outgoing and
incoming primary briefly both claim `ROUTING_ROLE_PRIMARY`, the highest
routing rule (coordinator term, leader subterm) wins, matching the
multigateway's own election — plus status mapping onto the existing
Healthy / Coming up / Going down / Unhealthy vocabulary, and an AZ
formatter for `id.cell` that degrades to the raw cell name.
- HA diagram nodes/edges: `Multigateway` card, shard group box with
header pill (`Shard 1`, `Automatic failover` + tooltip), `Primary
Database` card styled like the standard diagram's — neutral border,
green icon chip (with the standard CPU / Disk / RAM footer — connections
omitted until their meaning through the multigateway is confirmed),
`Read Replica` cards, and the standard animated replication edges
(status lives on the card badges). Poolers and gateways poll every 30s
without re-running layout (topology projection + structural sharing).
Drag-to-pan works through the shard group box, and the metrics footer's
skeleton matches the loaded row height so the card doesn't shift.
- Accessibility: the failover tooltip trigger is a keyboard-focusable
button, status badges sit in stable `role="status"` live regions, the
region flag is decorative (`alt=""`), and the edge dash/spinner
animations respect `prefers-reduced-motion` (applied to the pipelines
diagram's edges too).
- Fallbacks: `AlertError` ("Failed to retrieve cluster topology") when
either ha-admin query errors, and a "Cluster topology unavailable" empty
state when the topology comes back empty — never a half-rendered
diagram.

**Changed:**

- `InstanceConfiguration` is now topology-source-aware: it branches
internally on `useHighAvailability()`, so both surfaces (homepage
`TopSection` and the replication page) get the right diagram with no new
wiring. The two-pass measured dagre layout moved into a shared
`DiagramFlow`; `nodeTypes`/`edgeTypes` are module-level consts.
- `getEdgeVisual` + the mid-edge icon chip lifted out of
`ReplicationDiagram/Edges.tsx` into
`components/ui/ReactFlow/EdgeVisual.tsx` so both diagrams derive edge
icon + line style from one state object (no behavior change for the
pipelines diagram). The primary card's CPU/Disk/RAM footer is likewise
extracted into a shared `ComputeMetricsFooter`.
- Fixes a latent relayout loop inherited from the region-box pattern:
handing React Flow a freshly created (unmeasured) group node on every
layout pass reset `nodesInitialized`, re-triggering the measured pass
and `fitView` forever — which made the diagram snap back to center and
effectively unpannable. The shared `DiagramFlow` now re-attaches known
measurements to group nodes, which also covers the standard diagram's
region boxes.
- Standard diagram: the API Load Balancer → primary edge is now static —
no data flows over it, the line only indicates a relation.
- `database/replication` page: the HA early-return empty state is
replaced by the diagram under a "High Availability cluster topology"
header. Non-HA projects are untouched.

**Intentional deviations from the mock** (for design review):

1. **No per-replica regions** — alpha replicas are one-per-cell inside a
single region, so the mock's `eu-west-1` / `ap-southeast-1` on sibling
replicas would be false. Availability zone per node, region shown once
on the primary.
2. **"Primary Database", not "Main Database"** — matches the string both
existing diagrams already ship, and the same component now renders both
project types.
3. **No collapse chevron on the shard header** — alpha has exactly one
shard; collapsing it would hide the whole diagram. The group box still
ships; add collapse when `shards.length > 1`.
4. **Failover shown on the shard group, not replica cards** — failover
is a cohort property; per-card badging would assert readiness we can't
verify without a per-pooler `/status` fanout.
5. **Standard node/edge styling reused** (per review) — neutral primary
border + green chip and the default animated edges instead of the mock's
green ring and dashed green arrowed edges, keeping the HA and non-HA
diagrams visually consistent.

**Confirmed against a real local Multigres cluster:** cells are named
`cell-1`/`cell-2`/… (not AZ-shaped — the AZ formatter falls back to the
raw cell name as designed); `GET /platform/projects/{ref}/databases`
returns only the primary row for HA projects; and the `/ha-admin`
passthrough returns **each gateway/pooler record once per cell it fans
out to** — the topology mapper dedupes by id, but worth confirming with
@sbc-bobbie whether the backend should dedupe.

**Known alpha limitation:** node health and the "replicating" edge state
derive from the pooler's *topology record*
(`lifecycleStatus`/`servingStatus`), not a live probe — a pooler that
crashes without publishing a terminal state can read as healthy until
the topology evicts its record, and a serving replica with paused replay
still shows a green edge. This matches the existing replication
diagram's semantics (`ACTIVE_HEALTHY` ⇒ animated edge). Live per-pooler
signals (WAL receiver state, replay position) exist on `GET
/poolers/{cell}/{name}/status` but need a per-pooler fanout —
deliberately deferred, noted on `getPoolerStatus`.

**Still to confirm** (doesn't block review): whether the `/ha-admin`
passthrough is deployed to production or staging-only (if staging-only,
this should get a flag before GA).

## To test

Tested end-to-end locally against a real Multigres project
(standard-project regression pass, HA creation flow, error fallback
against real 500s, and full topology + polling + console checks against
live multiadmin data):

- **HA project homepage**: diagram card shows Multigateway → shard box
(`Shard 1`, count badge, `Automatic failover` tooltip) → green-bordered
Primary Database (region, AZ, size) + Read Replica cards (AZ), dashed
green animated edges to healthy replicas. No flow/map toggle for HA.
- **HA project → Database → Replication**: same diagram under a "High
Availability cluster topology" header; no Destinations section; the old
"Replication unavailable…" state is gone.
- **Error path**: if `/ha-admin/v1/*` fails, both surfaces show "Failed
to retrieve cluster topology" with Contact support — no partial diagram.
- **Standard project regression**: homepage diagram (primary card, flow
⇄ map toggle round-trips), replication page (pipelines diagram +
Destinations) all unchanged; zero requests to `/ha-admin/*`.


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

- **New Features**
  - Added High Availability topology diagrams to the Replication page.
- Display gateways, primary databases, replicas, shards, statuses,
regions, infrastructure details, and compute metrics.
- Added observability links and live topology updates with loading,
error, and unavailable states.

- **Bug Fixes**
- Improved handling of incomplete infrastructure identities and
unexpected data.
  - Corrected topology layout, node spacing, and visual edge behavior.

- **Accessibility**
- Reduced-motion preferences now disable diagram animations and loading
effects.
  - Improved status announcements for assistive technologies.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

---------

Co-authored-by: Alaister Young <10985857+alaister@users.noreply.github.com>
2026-08-26 16:51:36 +08:00
Danny White
5f50338a2f fix(studio): keep region flags visible on light surfaces (#49517)
## What kind of change does this PR introduce?

Studio interface fix.

## What is the current behavior?

Region flags with light backgrounds, such as Japan, can disappear
against light Studio surfaces. Flag rendering is also repeated across
region selectors and infrastructure views.

## What is the new behavior?

Region flags use a shared `RegionFlag` component with the existing small
radius and a subtle 1px border. The treatment is applied consistently
across project creation, replication, read replicas, infrastructure, and
Edge Function observability.

| Before | After |
| --- | --- |
| <img width="746" height="246" alt="CleanShot 2026-08-25 at 14 01
07@2x"
src="https://github.com/user-attachments/assets/5ccffccd-f253-47ca-a587-e97d1e8306a8"
/> | <img width="746" height="234" alt="CleanShot 2026-08-25 at 14 09
20@2x"
src="https://github.com/user-attachments/assets/9d59f7f6-4364-4c2c-8b97-a9673616736a"
/> |

## To test

- Open the new project flow and inspect the selected region and region
menu. Confirm light flags remain visible without changing size or aspect
ratio.
- Open Database Replication and inspect region flags in the diagram and
destination form.
- Open `/project/<ref>/settings/infrastructure` and inspect flags in the
topology, map, and read replica details.
- Open Edge Function observability and inspect the region filter
options.


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

* **UI Improvements**
* Standardized region flag displays across project creation,
replication, infrastructure, read replica, and observability views.
* Region flags now use consistent styling, rounded borders, and
rendering throughout the Studio interface.
* Improved visual consistency for selected regions, database nodes,
tooltips, and region options.
* Decorative flags in observability views are handled appropriately for
assistive technologies.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2026-08-25 16:25:12 +10:00
Victor Farazdagi
3bc52101ee (docs/pipelines): early access destinations (#49304)
## What kind of change does this PR introduce?

Docs update


## Summary

- Add Early Access setup and reference guides for ClickHouse, DuckLake,
and Snowflake.
- Update Pipelines navigation and shared documentation with
destination-specific data models, source requirements, schema-change
support, and recovery behavior.
- Keep all three destinations organization-gated. DuckLake is documented
only as a Pipelines replication destination i.e. query compute remains
external and this is not a Warehouse launch.

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

* **New Features**
* Added ClickHouse, DuckLake, and Snowflake as Early Access Pipelines
destinations.
  * Added BigQuery as a managed destination.
* Added destination navigation and setup guides covering configuration,
replication behavior, schema changes, type mappings, troubleshooting,
and monitoring.

* **Documentation**
* Clarified destination availability, regional guidance, requirements,
limitations, and processing behavior.
* Documented destination-specific schema-change support, table identity
requirements, reset behavior, and CDC replication modes.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2026-08-24 14:44:54 +03:00
Danny White
417b0fe13e feat(studio): show read replicas moved notice on Replication (#49355)
## What kind of change does this PR introduce?

Feature / communication. Resolves
[PIPE-1008](https://linear.app/supabase/issue/PIPE-1008/communicate-read-replica-move-changelog-leftover-ui-docs).

## What is the current behavior?

Database → Replication is now Pipelines-only. The “Read replicas have
moved” callout only appears inside the New destination sheet, so users
who land on Replication looking for replicas can miss it.
Getting-started already points create at Infrastructure but does not say
the management surface moved.

## What is the new behavior?

Replication shows the moved callout at the top of the page (flag-gated),
with a _Go to Infrastructure_ CTA. The same callout remains in the
destination-type sheet. Getting-started adds a short note that
management moved from Replication to Infrastructure.

This Admonition is dismissible, with its state stored in local storage.

| Before | After |
| --- | --- |
| <img width="1024" height="759" alt="64555"
src="https://github.com/user-attachments/assets/7084bd51-2f48-4a83-ac2a-89bdd3f23804"
/> | <img width="1024" height="759" alt="Replication Database Chisel
Toolshed Supabase"
src="https://github.com/user-attachments/assets/9b26c23a-1b44-4711-919b-c7000f155190"
/> |



## To test

`infrastructure:read_replicas` on by default.

1. Open [Database →
Replication](https://studio-staging-git-danny-pipe-1008-replication-moved-notice-supabase.vercel.app/dashboard/project/_/database/replication)
(preview URL once deployed). Confirm the note “Read replicas have moved”
and Go to Infrastructure.
2. Click the CTA: lands on Settings → Infrastructure.
3. Open New destination: callout still appears under the type selector.
4. Docs preview: getting-started Creating a Read Replica section shows
the move note.

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

## Summary by CodeRabbit

* **New Features**
* Added a callout informing users that read replicas are now managed
through Infrastructure.
* Added a direct link to the Infrastructure page from database
replication settings.
* Added the option to dismiss the callout, with dismissal saved per
project.
* Displayed the callout on the replication page and destination
selection view.

* **Bug Fixes**
* Updated callout visibility behavior to respect project settings and
prior dismissal.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2026-08-21 02:59:28 +00:00
Danny White
bb086a84b8 feat(studio): remove read replicas from Replication (#49046)
## What kind of change does this PR introduce?

Feature. Stack 4 of 5 for
[PIPE-1007](https://linear.app/supabase/issue/PIPE-1007/move-read-replicas-out-of-replication-into-infrastructure).
Contributes to PIPE-1008.

## What is the current behavior?

Database / Replication lists, creates, and diagrams read replicas
alongside pipelines.

## What is the new behavior?

Replication is pipelines-only. No replica rows, type, or diagram nodes.
`?destinationType=Read+Replica` redirects to Infrastructure. A short
callout points create-mode users at the new home.

## Additional context

Please review, but do not merge until
[#48921](https://github.com/supabase/supabase/pull/48921) is ready to
follow immediately. The flag is already on, so this PR is the
user-facing cutover off Replication.

## 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`.

Open [Database /
Replication](https://studio-staging-git-danny-pipe-1007-04-cut-from-77ef95-supabase.vercel.app/dashboard/project/_/database/replication?destinationType=Read+Replica).
You should land on Infrastructure with the add-replica sheet, not a
replica destination type. The Replication page itself should be
pipelines-only.

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

## Summary by CodeRabbit

* **New Features**
* Added guidance directing users to Infrastructure to create read
replicas.
  * Added automatic redirection for legacy read-replica links.

* **Updates**
* Replication destinations now focus exclusively on external analytics
and pipeline destinations.
* Updated destination selection, empty states, descriptions, and
diagrams to reflect the streamlined experience.
* Removed read replicas from the replication destination list and
related creation flow.

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

---------

Co-authored-by: Jeremias Menichelli <jmenichelli@gmail.com>
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
Danny White
14fe0c0cc8 fix(studio): slightly round split-button corners on focus (#49129)
## What kind of change does this PR introduce?

UI polish for split buttons (primary action + dropdown chevron).
Follow-up to #49055.

## What is the current behavior?

The focus ring sits above the neighbouring half, but the inner edge
stays square, so the ring has two sharp corners at the join.

## What is the new behavior?

On keyboard focus, the squared-off edge uses a slight radius so the ring
matches the outer corners more closely. Resting state is unchanged.
Split-button callsites now share the same join classes as the
design-system example.

| Before | After |
| --- | --- |
| <img width="1030" height="296" alt="43471"
src="https://github.com/user-attachments/assets/9df3bd72-c7ac-4419-ae18-a7e649dc2d66"
/> | <img width="1056" height="276" alt="CleanShot 2026-08-17 at 10 45
09@2x"
src="https://github.com/user-attachments/assets/52e8a4dc-9c52-45ce-b4d0-f0e7b1b75935"
/> |

## To test

Tab to each half (labelled button, then chevron). Inner corners of the
focus ring should be slightly rounded, not square.

1. [Split with
dropdown](https://design-system-git-fix-split-button-focus-radius-supabase.vercel.app/design-system/docs/components/button#split-with-dropdown)
(no login)
2. [Access
Tokens](https://studio-staging-git-fix-split-button-focus-radius-supabase.vercel.app/dashboard/account/tokens)
→ Generate new token
3. Any project on [studio
staging](https://studio-staging-git-fix-split-button-focus-radius-supabase.vercel.app/dashboard/_/settings/general)
→ Settings → General → Restart project

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

## Summary by CodeRabbit

- **Accessibility**
  - Added accessible labels to dropdown and export controls.
- Improved keyboard-focus visibility, layering, and rounded edge
treatment across joined buttons and menus.
  - Removed misleading or redundant screen-reader text and titles.

- **Bug Fixes**
- Prevented split-button controls from shrinking or displaying awkward
borders and corners.
- Refined hover and focus behavior for action buttons throughout
settings, database, storage, account, and documentation interfaces.

- **Documentation**
- Clarified guidance for using overflow menus and responsive
split-button actions.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2026-08-17 17:28:22 +10:00
Danny White
2c8cc7ec8a feat(studio): relocate read replica modules under Infrastructure (#49043)
## What kind of change does this PR introduce?

Feature. Stack 1 of 5 for
[PIPE-1007](https://linear.app/supabase/issue/PIPE-1007/move-read-replicas-out-of-replication-into-infrastructure).

## What is the current behavior?

Read replica UI lives under Database / Replication.

## What is the new behavior?

Moves replica form, row, and modals into Settings/Infrastructure and
extracts `REPLICA_STATUS` plus path helpers. URLs and user-facing
behaviour are unchanged.

## Additional context

Keep `infrastructure:read_replicas` off in prod until the full stack
lands.

Stack: this PR →
[#49044](https://github.com/supabase/supabase/pull/49044) →
[#49045](https://github.com/supabase/supabase/pull/49045) →
[#49046](https://github.com/supabase/supabase/pull/49046) →
[#48921](https://github.com/supabase/supabase/pull/48921)

## To test

Open [Database /
Replication](https://studio-staging-git-danny-pipe-1007-01-relocate-701014-supabase.vercel.app/dashboard/project/_/database/replication?destinationType=Read+Replica).
Confirm add replica still works as today. No new Infrastructure section
yet.

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

- **New Features**
- Added navigation for viewing a specific read replica and starting the
add-replica setup flow.
- Improved read-replica setup validation, including unsupported regions
and invalid PostgreSQL versions.

- **Bug Fixes**
  - Corrected default region and success messaging behavior.
- Prevented incomplete pricing labels and clarified eligibility
warnings.
  - Improved display handling for localized pricing values.

- **Tests**
- Added coverage for read-replica navigation paths and fallback
behavior.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2026-08-14 15:21:24 +10:00
kemal.earth
88e916a4c0 fix(studio): focus state for buttons with dropdown (#49055)
## 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?

We've quite a few instances where some buttons have a dropdown
appendage. The focus state for these were broken as well as visually
regarding the separator. This first pass fixes the instances we have in
studio, I've left potentially adding this to our design system fragment
components as another PR.

| Before | After |
|--------|--------|
| <img width="531" height="133" alt="Screenshot 2026-08-13 at 11 29 36"
src="https://github.com/user-attachments/assets/70747fd0-11d4-4670-85fa-d76f3564837b"
/> | <img width="519" height="130" alt="Screenshot 2026-08-13 at 11 40
15"
src="https://github.com/user-attachments/assets/5920bebb-81ce-4962-908b-5f61526ca7ca"
/> |
| <img width="538" height="146" alt="Screenshot 2026-08-13 at 11 29 48"
src="https://github.com/user-attachments/assets/f1c7018f-cd43-47fa-b4c0-045af350f80b"
/> | <img width="515" height="148" alt="Screenshot 2026-08-13 at 11 39
56"
src="https://github.com/user-attachments/assets/fee09113-433a-4b5d-ac68-3ab3f2565d34"
/> |
| <img width="538" height="143" alt="Screenshot 2026-08-13 at 11 29 52"
src="https://github.com/user-attachments/assets/3063d391-99b2-4599-9cdf-edd0b2cdfdf0"
/> | <img width="529" height="159" alt="Screenshot 2026-08-13 at 11 40
05"
src="https://github.com/user-attachments/assets/4bdeb9e0-8324-45df-a211-8c7fd0ee11a6"
/> |




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

## Summary by CodeRabbit

* **Bug Fixes**
* Improved keyboard focus visibility across Studio controls, including
token management, email settings, replication, log drains, query
insights, infrastructure, storage, and assistant actions.
* Focused buttons in adjacent or split-button groups now appear above
neighboring controls, preventing borders and overlays from obscuring the
active selection.
* Preserved existing button behavior, layout, and appearance while
improving focus-state clarity.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2026-08-13 12:45:06 +01:00
Riccardo Busetti
c3742ba07f ref(pipelines): Align handling of credentials (#48896) 2026-08-10 14:40:02 +02:00
Riccardo Busetti
21919ec9b8 feat(pipelines): Use new restart endpoint (#48737) 2026-08-06 09:02:10 +00:00
Stephen Morgan
9dc5c0faf3 feat: privatelink read replica (#48642)
Frontend changes for new privatelink functionality.
The updates to the API are already live, but will be putting the UI
changes behind a feature flag while we do some full end to end testing.

Changes to Integration page:
<img width="744" height="456" alt="image"
src="https://github.com/user-attachments/assets/02026083-4b61-4f36-927b-1bac42cb73e2"
/>

Changes to create associations page:
<img width="859" height="411" alt="image"
src="https://github.com/user-attachments/assets/303b4ec5-3b5a-4eaf-8d22-45e1e63a0705"
/>

Fixes SEC-919

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

- **New Features**
- AWS PrivateLink connections can target the primary database or a read
replica.
- Connection lists and confirmation dialogs now identify the selected
database clearly.
- Replica details include improved status information and a “Manage
replica” link.

- **Bug Fixes**
- Replica removal errors now provide clearer guidance and link to
integration settings when PrivateLink issues occur.

- **Updates**
- Infrastructure diagrams focus on visualization, with replica
management actions moved to dedicated management views.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

---------

Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
2026-08-04 20:47:48 +12:00
Danny White
73c9dbfa52 fix(studio): standardise custom icon weight (#48478)
## What kind of change does this PR introduce?

Bug fix and internal tooling update. Resolves FE-3472.

## What is the current behavior?

Custom Studio icons use inconsistent source stroke widths, and some
child-level styling prevents component props from overriding them. Mixed
custom and Lucide icon sets can therefore appear uneven.

## What is the new behavior?

Custom stroke icons use a root-level `stroke-width="1.5"`; fill-only
logos use `stroke="none"`. The build validates that contract and
regenerated components preserve existing exports and props.

Studio applies the same `1.5` weight across Reports categories and uses
one shared destination icon mapping in the replication selector,
destination rows and diagram.

| Before | After |
| --- | --- |
| <img width="418" height="516" alt="56398"
src="https://github.com/user-attachments/assets/6afa7042-e6be-40e7-9911-af2f61238c9d"
/> | <img width="390" height="550" alt="CleanShot 2026-07-30 at 17 12
37@2x"
src="https://github.com/user-attachments/assets/870f49cf-c8fa-40db-8be8-2eb5f264ff4a"
/> |
| <img width="510" height="734" alt="CleanShot 2026-07-30 at 17 19
28@2x"
src="https://github.com/user-attachments/assets/a5b2c088-dcd2-4907-976b-5820794d06e3"
/> | <img width="554" height="742" alt="CleanShot 2026-07-30 at 17 16
06@2x"
src="https://github.com/user-attachments/assets/ed3a77c4-5d94-4ca7-b9e4-1403b725a981"
/> |


## Testing

At 100% zoom, compare custom and Lucide icon weight in:

- Reports: **Add your first chart** and **Add block**
- Database > Replication: the destination selector, destination rows and
replication diagram
- Command menu (`⌘K`): **Search Database Tables**, **Search RLS
Policies**, **Search Edge Functions** and **Search Storage**
- Authentication > Users: right-click a user row and compare the
context-menu icons
- Database > Schema Visualizer: open a table node overflow menu
- A paused project: **Export your data > Download backups**

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

* **New Features**
* Added consistent destination icons across replication panels, rows,
and diagrams.
  * Updated instance health and metric icons for clearer identification.
* Standardized icon stroke weight and reduced default icon stroke
thickness.

* **Documentation**
* Clarified custom icon requirements, default properties, and validation
guidance.

* **Bug Fixes**
* Improved consistency of icon rendering across replication destinations
and reports.

* **Tests**
* Added coverage for icon SVG validation and replication destination
icon rendering.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2026-08-03 17:48:50 +10:00
Danny White
7a77760a10 fix(studio): confirm before discarding dirty replication destination forms (#48522)
## What kind of change does this PR introduce?

Bug fix (dirty form dismissal for Replication destination sheets), plus
small docs/skill updates so agents pick up the existing modality
pattern.

## What is the current behavior?

Closing the Add/Edit destination sheet (Cancel, Escape, or backdrop)
discards in-progress form state with no confirm. Same for the nested
Create publication sheet.

## What is the new behavior?

Dirty closes go through `useConfirmOnClose` +
`DiscardChangesConfirmationDialog`, matching other Studio sheets.
Successful submit still closes without prompting.

Also: skills + `forms.mdx` now point at Modality “Dirty form dismissal”.

| After |
| --- |
| <img width="1024" height="759" alt="Replication Database Chisel
Toolshed Supabase"
src="https://github.com/user-attachments/assets/6f568a2a-c76b-442a-b592-d638bb36adc4"
/> |

### How to test

1. Studio → Database → Replication → **Add destination** (any pipelines
type with access).
2. Change a field so the form is dirty.
3. Try Cancel, Escape, and backdrop click → discard dialog appears;
**Keep editing** stays open; **Discard changes** closes.
4. Submit successfully with a valid config → sheet closes with no
discard dialog.
5. Repeat for **Edit destination** from a destination row menu.
6. Optional: Add destination → create a new publication from the
publication picker → dirty that nested sheet and dismiss the same way.
7. Optional: Add destination → Read Replica → change region → dismiss →
discard dialog; deploy still closes without prompting.

## Additional context

Sheet owns the close guard; forms report dirty via a ref because RHF
lives in the child. Nested `NewPublicationPanel` wires the guard
locally.

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

- **New Features**
- Added unsaved-changes tracking to replication destination and
publication forms.
- Added confirmation prompts before closing forms with unsaved changes
via Cancel, Escape, or backdrop dismissal.
- Forms now reset appropriately after successful submission or confirmed
dismissal.

- **Documentation**
- Updated form and UI pattern guidance to document dirty-form dismissal
behavior for sheets and dialogs.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

---------

Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
2026-08-03 10:00:41 +10:00
Joshen Lim
78957bcd68 Replace disable pipelines cta with enable pipelines if pipelines not enabled yet (#48518)
## Context

Addresses 2 issues found for the Replication UI

- "Disable Pipelines" CTA was still being shown despite Pipelines not
being enabled yet
- Opting to show the "Enable Pipelines" CTA instead in this case, which
will open the `EnablePipelinesModal`
<img width="269" height="162" alt="image"
src="https://github.com/user-attachments/assets/41e5ec7d-11b1-4008-ae9d-64def00329eb"
/>
- Fixes "Disable Pipelines" being incorrectly disabled


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

* **New Features**
* Added options to enable or disable Pipelines directly from the
replication destinations menu.
* Added an enablement modal with messaging and upgrade actions based on
available access.
* Added support for opening the Pipelines modal through external
controls.

* **Bug Fixes**
  * Corrected action disabled states and destination-removal guidance.
* Improved error handling when disabling Pipelines, including a reliable
fallback message.
* Refined modal and dialog layout spacing for a more consistent
presentation.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2026-07-31 11:43:02 +07:00
Danny White
205527c716 feat(studio): tune up replication page layout and empty state (#48265)
## What kind of change does this PR introduce?

UI polish for Database → Replication: empty state, page layout, diagram
containment, filter actions, and destination sheet copy.

## What is the current behavior?

- Empty destinations use a custom dashed box with generic copy.
- The diagram is full-bleed with `border-y`.
- Page chrome still uses legacy Scaffold wrappers and a long header
description that duplicates the empty state.
- Filter-row “Add destination” is a default button ahead of secondary
actions; Usage always shows.
- Local ETL warning sits on the page list.
- Destination sheet title/helper/access copy is more verbose; Type
helper sits beside the label.

## What is the new behavior?

- Empty state uses `EmptyStatePresentational` with clearer CTA copy;
toolbar “Add destination” is primary at the end of the filter row;
empty-state CTA stays default.
- Usage only appears when there is at least one Pipelines destination.
- Page uses `PageHeader` / `PageContainer` / `PageSection`, with a short
header: “Read replicas and analytics pipelines”.
- Diagram sits in a rounded bordered frame inside the page container
(same treatment as project overview).
- Local ETL warning shows in the add-destination sheet for Pipelines
types only, without blocking the form; Type + warning scroll with the
sheet body.
- Type helper sits under the dropdown as one flowing paragraph (“Cannot
be changed after creation…” plus shortened stage notice).
- Sheet title is “Add destination”; close only fires on dismiss; Lucide
icons (e.g. Snowflake) use consistent stroke width.

| Before | After |
| --- | --- |
| <img width="1479" height="930" alt="Replication Database Chisel
Toolshed Supabase"
src="https://github.com/user-attachments/assets/a3caf0ba-ed1a-4659-bdef-f66b67e85be4"
/> | <img width="1479" height="930" alt="Replication Database Chisel
Toolshed Supabase"
src="https://github.com/user-attachments/assets/d5a82641-a316-4577-9480-959346994c40"
/> |
| <img width="1479" height="930" alt="Replication Database Chisel
Toolshed Supabase"
src="https://github.com/user-attachments/assets/4f956e26-b8d4-4653-a60e-ceca7ec1e070"
/> | <img width="1479" height="930" alt="Replication Database Chisel
Toolshed Supabase"
src="https://github.com/user-attachments/assets/a72461ab-dea9-48a6-ab88-852a12ac80a5"
/> |

### Test plan

- [x] Open **Database → Replication** with no replicas/destinations:
empty state, primary filter-row Add destination, default empty-state Add
destination, no Usage button.
- [x] Confirm header→diagram and diagram→filter spacing feel even;
filter→empty state/table stays tight (`space-y-4`).
- [x] Confirm diagram is contained (rounded border), not full-bleed.
- [x] Add a Pipelines destination (or use a project that has one): Usage
appears; table still works; search “no results” still works.
- [ ] Open **Add destination**: title “Add destination”; Type helper
under the dropdown; Read Replica has no local warning; Pipelines type
shows local warning without hiding fields (when ETL isn’t set up
locally).
- [ ] Without Pipelines access: request-access panel shows “alpha” copy
and “Request alpha access”.
- [ ] Spot-check dark/light themes.

---------

Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
2026-07-31 06:20:38 +10: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
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
Riccardo Busetti
6f8fe470a6 ref(pipelines): Update pricing descriptions given new egress calculation (#48241) 2026-07-27 12:52:37 +02:00
Riccardo Busetti
b2b150fa3c feat(pipelines): Add UI selector for choosing which tables to skip copy of (#47808)
## Summary

Adds initial-copy scoping to Pipelines in Studio. Users can copy all
existing rows, skip all initial copies, copy only selected publication
tables, or skip selected table copies. All publication tables continue
streaming new changes regardless of the initial-copy policy.

The policy now round-trips through create, edit, validation, and the
generated Management API contract. Initial-copy estimates and
table-restart confirmations use the same scope. Edit requests also
preserve redacted credentials and pipeline settings that Studio does not
own.

This completes the Studio layer of the [ETL API
change](https://github.com/supabase/etl/pull/897) and [Management API
change](https://github.com/supabase/platform/pull/35479).

## Screenshots

### Selector

<img width="1153" height="465" alt="image"
src="https://github.com/user-attachments/assets/bf615e82-ee61-4222-979d-a8695a957e82"
/>

### Select certain tables only

<img width="1153" height="465" alt="image"
src="https://github.com/user-attachments/assets/28adaa24-f239-4d1d-8fb8-fdb1988320cd"
/>

### Confirm copy costs

As the final step before the pipeline is created:

<img width="597" height="619" alt="image"
src="https://github.com/user-attachments/assets/a660bd87-bfb8-41c5-8099-4cdbdef943bf"
/>


### Policy-aware initial-copy estimate

#### Copy no table is selected

<img width="407" height="464" alt="image"
src="https://github.com/user-attachments/assets/99d859ec-2ec3-452a-ab69-11924a8db260"
/>

#### Some tables are selected

<img width="407" height="464" alt="image"
src="https://github.com/user-attachments/assets/e68aedf4-66bc-4372-98ef-0dd7fecef324"
/>


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

- **New Features**
- Added configurable “initial table copy” policies (copy/skip all and
copy/skip selected) during replication setup, including table-picker
behavior, pruning of stale selections, and updated restart/cost
estimates.
- **Bug Fixes**
- Improved restart flows to consistently use `schema.table` identity and
simplified “errored tables” targeting to match error-state tables.
- Reduced unnecessary loading by gating publication/table fetches to
when panels are visible; improved validation/toast handling when
publication tables are unavailable.
- **Tests**
- Added/expanded coverage for destination form submission, table-copy
selection, restart/cost dialogs, and copy-estimate summarization.
- **Style**
- Refreshed warning/label text for clearer configuration and
confirmation messaging.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

---------

Co-authored-by: Victor Farazdagi <simple.square@gmail.com>
Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
2026-07-24 10:29:46 +03:00
Danny White
3bca21b3f8 chore(a11y): convert leftover focus recipes to focus-ring (#48219)
## What kind of change does this PR introduce?

Accessibility cleanup (DEPR-628).

## What is the current behavior?

Leftover call sites still use ad-hoc focus recipes
(`ring-foreground-muted`, `outline-brand`, Dialog/Sheet `focus:` rings,
etc.) instead of the shared utilities from #41575.

## What is the new behavior?

Converts those leftovers across `packages/ui`, Studio, www, docs, and
design-system to `focus-ring`, preferring `focus-visible`. Keeps
documented exceptions (`group-focus-visible`, InputGroup `:has()`).

## To test

Tab through controls (keyboard only). Expect a consistent offset ring on
`:focus-visible`, not a green/brand/custom stack, and no ring animation.

### www (marketing)

Preview:
https://zone-www-dot-com-git-danny-depr-628-focus-ring-fbccf9-supabase.vercel.app

- Global nav on `/`: Product, Developers, Solutions dropdowns; logo;
hamburger + mobile menu
- `/features`: view toggles and feature cards
- `/company`: card links
- `/changelog`: timeline / entry links
- `/partners/catalog`: grid/list toggle and partner cards
- `/pricing`: compute section expand control
- Product / Modules / Solutions sticky navs on product pages (e.g.
`/database`, `/storage`)
- `/state-of-startups`: TwoOptionToggle if present

### docs

Preview:
https://docs-git-danny-depr-628-focus-ring-long-tail-supabase.vercel.app

- Any guide page: top nav dropdowns and items
- Narrow viewport: hamburger, then mobile menu links + close
- Guide with PromptPanel / tabs: tab to prompt actions and tab list

### studio (dashboard)

Preview:
https://studio-staging-git-danny-depr-628-focus-ring-long-tail-supabase.vercel.app

- Project home: Connect section tiles; drag-handle focus on sortable
sections
- Integrations marketplace (`/project/<ref>/integrations`): featured
cards, list/grid toggle, list rows
- Auth (`/project/<ref>/auth/oauth-apps`,
`/project/<ref>/auth/providers`): open create/edit sheet, tab to close
(X)
- Database policies (`/project/<ref>/database/policies`): open policy
editor sheet, tab to close
- Storage policies (`/project/<ref>/storage/files/policies`): bucket
section links; policy modal close
- Query performance (`/project/<ref>/observability/query-performance`):
info icon buttons on metrics
- Replication pipeline detail (if available): slot lag / status info
icons
- Support (`/support/new`): attachment add/remove controls
- Table editor: spreadsheet import preview checkboxes; row text/JSON
editor TwoOptionToggle
- Any Dialog/Sheet/toast close (X): ring on keyboard focus only, not
mouse click

### design-system

Preview:
https://design-system-git-danny-depr-628-focus-ring-long-tail-supabase.vercel.app

- Colour palette swatches (keyboard focus)
- Form patterns sidepanel example: avatar / focusable control in the
example

## Additional context

- Linear: [DEPR-628](https://linear.app/supabase/issue/DEPR-628)
- Follow-ups: form-group CSS (DEPR-629), Storage columns selection
(DEPR-630), ESLint rule (DEPR-632)

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

* **Accessibility & Usability**
* Standardized keyboard focus indicators across navigation, dialogs,
forms, buttons, toggles, links, and tooltips using a consolidated focus
style.
* Improved toggle controls to use proper button semantics (instead of
clickable text), including `aria-pressed`/disabled handling and better
keyboard navigation.

* **Visual Updates**
* Harmonized hover/focus ring visuals across the design system, Studio,
documentation, and marketing pages while preserving existing layout and
interaction behavior.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2026-07-23 08:52:22 +10:00
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 -->
2026-07-21 08:22:43 +10:00
Jordan McQueen
fa1e4c4bbf feat(studio): add ClickHouse replication destination (#46870)
Adds ClickHouse as a replication destination type in Studio.

- New ClickHouse option in the destination type selector, gated behind
the
`etlEnableClickHousePrivateAlpha` organization feature flag (off by
default).
- ClickHouse settings form: URL, user, password (optional), database,
and
  - Client-side URL validation requires HTTPS and rejects URLs targeting
    internal addresses (loopback, RFC 1918, link-local, CGNAT, IPv6
    loopback/link-local/ULA, and IPv4-mapped/NAT64 forms). Server-side
    validation remains authoritative.

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

## New Features
- Added **ClickHouse** as a replication destination option (private
alpha), including support in destination selection/panel, replication
diagram rendering, and destination icons.
- Introduced a ClickHouse destination form with fields for URL, user,
optional password (masked toggle), database, and engine selection.
- Added ClickHouse destination config handling for create/update flows,
with normalization and engine support.

## Tests
- Expanded unit tests to cover ClickHouse validation and destination
config building/normalization, including HTTPS-only and blocking
localhost/internal targets.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

---------

Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
2026-07-20 12:09:13 +08:00
Riccardo Busetti
f19cb09b43 feat(pipelines): Update product docs and UI copy (#47997) 2026-07-17 11:43:04 +02:00
Riccardo Busetti
c9eb33abc7 feat(pipelines): Add new cost estimation dialog (#47915) 2026-07-15 06:20:59 +00:00
Danny White
79b2eeb8b2 fix(studio): make replica pricing learn more an inline link (#47825)
## What kind of change does this PR introduce?

Bug fix / polish

## What is the current behavior?

On the add-destination sheet for read replicas, “Learn more” sits as a
stray sibling next to the cost copy.

## What is the new behavior?

Cost copy and “Learn more” are one paragraph, with the link inline and
styled like `InlineLink` (underline, pointer cursor, hover colour):

> New replica will cost an additional $16.25/month. Learn more

| Before | After |
| --- | --- |
| <img width="1258" height="120" alt="CleanShot 2026-07-10 at 12 21
21@2x"
src="https://github.com/user-attachments/assets/bb47461e-e856-4cf2-b81a-f8e9aa9ebf75"
/> | <img width="1256" height="114" alt="CleanShot 2026-07-10 at 12 23
48@2x"
src="https://github.com/user-attachments/assets/094332be-ad2e-4782-94ac-08c8775a4665"
/> |

_Note that the grey icon square is being fixed separately in
https://github.com/supabase/supabase/pull/47794._

## To test

On the staging preview, open Database → Replication → Add destination →
Read replica, and check the footer cost line in light and dark mode —
“Learn more” should sit inline, show a pointer cursor, and change colour
on hover.

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

## Summary by CodeRabbit

## Summary by CodeRabbit

* **New Features**
* Added estimated monthly pricing to the read replica pricing dialog
trigger (“additional {cost}/month”).

* **UI Improvements**
* Moved the pricing/cost impact messaging from the form footer to the
pricing dialog area.
* Refined the “Learn more” link/button styling and layout for a cleaner
presentation.



<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2026-07-10 16:34:16 +00:00
Riccardo Busetti
f45389138b ref(pipelines): Remove unnecessary restarts (#47732) 2026-07-10 01:34:19 +00:00
Riccardo Busetti
34d641f50b feat(pipelines): Add clarification on region (#47641) 2026-07-07 10:36:55 +02:00
Saxon Fletcher
fb02182e86 Color system (#47288)
## I have read the
[CONTRIBUTING.md](https://github.com/supabase/supabase/blob/master/CONTRIBUTING.md)
file.

YES/NO

## What kind of change does this PR introduce?

Bug fix, feature, docs update, ...

## What is the current behavior?

Please link any relevant issues here.

## What is the new behavior?

Feel free to include screenshots if it includes visual changes.

## Additional context

Add any other context or screenshots.


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

* **New Features**
* Refreshed theming across the UI to use modern color expressions and
shared theme variables (including OKLCH-based gradients), improving
consistency for charts, code blocks, overlays, icons, and decorative
backgrounds.
* **Bug Fixes**
* Improved light/dark color and gradient consistency across axis/grid
styling, reference lines, buttons/badges, sidebar accents, loaders, and
other visual components.
* **Documentation**
* Updated styling/theming guidance to align with the revised semantic
token system and the updated theme variable usage patterns.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

---------

Co-authored-by: Claude Opus 4.8 <noreply@anthropic.com>
2026-07-03 15:00:43 +10:00
Coenen Benjamin
a1716edc3c refactor(replication): do not fetch secrets from APIs and enable partial update on API (#47454) 2026-07-02 21:04:12 +02: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
Danny White
3acc53cca3 chore(studio): minor database UI polish (#47356)
## What kind of change does this PR introduce?

Chore

## What is the current behavior?

- Add-column uses implicit button styling
- Replication row tooltip says "Open in Table Editor"

## What is the new behavior?

- Add-column explicitly uses `variant="default"`
- Auth Users explicitly uses `variant="default"`
- Replication row tooltip says "Table Editor"

---------

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-06-30 03:47:35 +10:00
Riccardo Busetti
df7a0ca3f7 feat(replication): Evaluate new product name (#47066) 2026-06-24 16:36:23 +02:00
Alaister Young
9eab4f8fbf build(studio): Vite/TanStack-Start build pipeline behind flag (stack 1/6, from #46424) (#47107)
**Stack 1/6** of the TanStack Start migration (#46424), split into
reviewable, independently-mergeable PRs.

> [!IMPORTANT]
> **Next stays the default and only active framework after this PR.**
This wires up the Vite/TanStack-Start build pipeline behind the
`STUDIO_FRAMEWORK` flag, but there are no TanStack routes yet — so the
TanStack build isn't functional or tested until later PRs in the stack.
Nothing about the Next build, dev, or deploy changes behaviourally here.

## What's in this PR
- **Dispatch:** `dev`/`build`/`start` now go through
`scripts/dispatch.js`, which runs the Next variant unless
`STUDIO_FRAMEWORK=tanstack`. The original commands are preserved as
`dev:next`/`build:next`/`start:next`.
- **Build pipeline:** `vite.config.ts`, `serve.js`, `smoke-server.mjs`,
vite/tanstack deps, `turbo.jsonc`.
- **`tsconfig.json`:** `jsx: react-jsx`, `moduleResolution: Bundler`,
`target: ES2022`. Because `include` is `**/*.ts(x)`, this re-typechecks
the whole app, so the companion adaptations below land with it.
- **Shared adaptations (companions to the tsconfig change):**
`BufferSource` casts, `packages/ui` unused-`React` import removals, etc.
- **Routing/middleware plumbing:** `next.config.ts` +
`redirects.shared.ts` (redirect rules now shared with `vercel.ts`),
`proxy.ts`/`start.ts` middleware + `hosted-api-allowlist.ts`.

## Verification
Run locally off `master`: frozen install ✓, `studio` typecheck ✓, **Next
build ✓** (compiles + generates all routes), lint ratchet ✓ ("some rules
improved"), prettier ✓.


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

* **New Features**
* Added a hosted API endpoint allowlist to return 404 for non-supported
`/api/*` routes.
* Introduced a TanStack route-migration checklist and expanded TanStack
Start routing support.
* **Improvements**
* Enhanced deployment refresh/detection by tightening cookie handling
for “latest deployment” updates.
* Centralized redirect/maintenance-mode rules for consistent platform vs
self-hosted behavior.
* Improved production serving with a dedicated static + proxy server and
a post-build smoke test.
* **Dependencies**
* Updated TanStack-related packages and React Table/query tooling
versions.
* **Documentation / Chores**
* Updated formatting and tooling config; added shared build environment
parsing utilities.
<!-- 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>
2026-06-24 17:55:22 +08:00
Joshen Lim
68525aedd6 Break down DestinationForm into its own hook for validation and submission (#47176)
## Context

Another pass on refactoring the ETL code, specifically for
`DestinationForm/index.tsx`

Splits out the validation + pipeline submission logic into its own hook
`useDestinationForm.ts` so the main file is broken into smaller pieces

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

* **Refactor**
* Streamlined the database replication destination form by centralizing
validation and save/submission workflow in a dedicated hook.
* Improved the validation flow so failed validations guide users by
scrolling to the inline validation section, and warning confirmations
submit through the standard pipeline flow.
* Updated form reset behavior when the panel opens to ensure validation
state clears consistently.
* **Bug Fixes**
* Corrected autogenerated S3 key “description” to derive from the
selected warehouse when using Analytics Bucket destinations.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2026-06-22 17:44:31 +08:00
Coenen Benjamin
2ce01473bb feat(replication): add better form to create ducklake replication (#47069)
## What kind of change does this PR introduce?

Add support to use supabase projects as a pg catalog and storage when
adding a ducklake replication.

## What is the current behavior?

Only simple form with raw input text for custom parameters is available.

## What is the new behavior?

Being able to select supabase project to directly use projects in
supabase for the ducklake.
I also fixed a warning we had in the console for this form (cf
screenshot)

## Additional context

[API Changes ](https://github.com/supabase/platform/pull/34282)


https://github.com/user-attachments/assets/4ff9ee65-6ba4-4f17-9ea1-9aebad34171c

<img width="862" height="228" alt="Capture d’écran 2026-06-18 à 09 58
50"
src="https://github.com/user-attachments/assets/1592c3be-807e-426f-9a5a-84979e05d93c"
/>

### Test scenario
Follow the screencast, go to your supabase project (better if it's in
ap-southeast-1)
Create a test table with 1 row for example
-> Database -> Replication -> New destination -> Select ducklake and use
supabase option
-> Keep the same current supabase project selected for both catalog and
storage
-> Create destination -> You'll get a warning about the storage and
credentials
-> Confirm creation
-> Wait until it's in status Running, if it's runing then it works


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

## Release Notes

* **New Features**
* Added DuckLake replication destination with **Use Supabase** and
**Custom parameters** modes.
* Added DuckLake bucket selection with a **“New bucket”** creation
dialog.
* Added/expanded BigQuery, Analytics Bucket, and Snowflake destination
configuration.

* **Improvements**
* Updated DuckLake create vs edit behavior: mode selection is hidden in
edit mode and configuration is mapped correctly for the selected
variant.
* Enhanced field-level validation (including whitespace-only handling)
and added clearer validation issue messages.
* Added a cross-region warning for DuckLake when catalog and storage
regions differ.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

---------

Signed-off-by: Benjamin <5719034+bnjjj@users.noreply.github.com>
Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
2026-06-19 16:07:20 +02:00
Joshen Lim
ea909e998b Local only: skip loading destinations if ETL API is not set up (#47031)
## Context

> [!IMPORTANT]  
> Changes in this PR only apply to the local environment - there should
not be any changes to staging (nor production)

Given that read replicas currently sit under database replication, the
UI currently waits for replication destinations to load before rendering
the page. However for local development, setting up of the ETL API isn't
necessary nor applicable for everyone so this indirectly adds friction
if we just want to work with read replicas.

## Changes involved
- Opting to skip retrying fetching ETL related requests if the error
returned is "replication API URL is not configured"
  - This is indicative that the local platform isn't set up for ETL yet
- ^ Database replication page will hence not wait for ETL requests to
succeed before finally rendering the UI
  - Node diagram will also then render properly (just read replicas)
- Add a small admonition to visualize this
<img width="1079" height="301" alt="image"
src="https://github.com/user-attachments/assets/32bd5d2f-a76e-417e-bedf-9a04de3bb305"
/>

## To test
- Will only be able to test locally - basically just head over to the
database replication page (unless you somehow already have ETL API set
up locally)
- But can also verify that there's no changes on staging preview


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

## Summary by CodeRabbit

* **Bug Fixes**
* Improved error messaging when ETL is not configured in local
development environments
* Enhanced error handling for replication API failures with better
non-retryable error detection

* **Improvements**
* Refined replication diagram rendering based on destination setup state
  * Updated dropdown menu interactions for read replica management

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2026-06-19 17:27:44 +08:00
Riccardo Busetti
f162190be8 feat(replication): Render errors as markdown and improve publication loading (#47037) 2026-06-18 07:31:35 +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
Riccardo Busetti
cb6c361f25 feat(replication): Improve replication validation and fix scroll (#46943) 2026-06-16 14:38:25 +00:00