## What kind of change does this PR introduce?
Bug fix / design-system alignment for the legacy `Button` from `ui`.
## What is the current behavior?
Omitting `variant` on the legacy `Button` falls back to brand-green
`primary`. That makes accidental greens easy, and it is hard to spot the
real main action on busy pages.
## What is the new behavior?
- Legacy `Button` now defaults to neutral `default`
- Intentional primary CTAs (create, save, submit, marketing CTAs, and
matching `ButtonTooltip` usages) now set `variant="primary"` so their
appearance is unchanged
- Neutral actions that previously relied on the old fallback (cancel,
close, back, dashboard nav, and similar) become grey/white
- Design-system docs updated; regression tests cover the new default
`Button_Shadcn_` is unchanged. It already uses its own CVA default.
This is PR 1 of 2 in a stack. PR 2 drops now-redundant
`variant="default"` props.
## To test
Studio (http://localhost:8082):
- `/sign-in`: Sign in stays green
- Open a project → Database → Tables: New table stays green
- Auth → Users → Invite: Invite user stays green; Cancel / dismiss
controls stay neutral
- Project Settings → General: edit a field so Cancel and Save appear.
Cancel is neutral, Save is green
Design system (http://localhost:3003):
- Components → Button: default demo is neutral; primary demo is green;
featured preview is the default variant
Marketing (optional):
- www header: Start your project stays green; logged-in Dashboard is
neutral
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
- **Style**
- Buttons now default to a neutral style, while primary actions across
Studio, documentation, marketing pages, forms, dialogs, and error states
use prominent primary styling.
- Updated button examples and previews clarify the distinction between
default and primary variants.
- Event registration now includes a directional arrow icon.
- **Tests**
- Added coverage confirming default button styling and explicit primary
styling behave as expected.
- Updated related test fixtures to use primary styling where
appropriate.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## What kind of change does this PR introduce?
Polish for the AWS PrivateLink integrations UI.
## What is the current behavior?
The add/view sheet labels the optional nickname field as "Description",
delete confirmation always shows the AWS account ID, list admonitions
use generic copy, and delete uses a fire-and-forget mutation.
## What is the new behavior?
- Rename the optional nickname field to **Name**, with helper copy
explaining it appears on the connections list
- Tighten list admonition copy to reference connections below and
pluralise share wording
- Rename `showAcceptLink` to `shouldShowAcceptLink`
- Delete confirmation uses the connection name (or account ID when
unnamed) and clearer read replica fallback copy
- Delete uses `mutateAsync` so the dialog can await the mutation
| Before | After |
| --- | --- |
| <img width="828" height="515" alt="Integrations Settings Chisel
Toolshed Supabase"
src="https://github.com/user-attachments/assets/9e255d4b-a048-459c-87ff-ee1b65f42f9a"
/> | <img width="828" height="515" alt="Integrations Settings Chisel
Toolshed Supabase"
src="https://github.com/user-attachments/assets/500e3922-912f-4e3b-a875-295ac7bd689e"
/> |
## To test
1. Open **Project settings → Integrations → AWS PrivateLink** on a
project with PrivateLink access
2. Click **Add connection** and confirm the optional field is labelled
**Name** with helper copy underneath
3. Add a connection with a name (e.g. `Production VPC`) and confirm the
list row shows that title
4. If you have a waiting or expired connection, confirm the list
admonition copy references shares below
5. Open a named connection, click **Delete**, and confirm the dialog
uses the connection name rather than always showing the raw account ID
6. Cancel delete and confirm the sheet stays open
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Improvements**
* Updated AWS PrivateLink connection messages with clearer singular and
plural wording.
* Improved guidance for expired and pending connections, including
acceptance-instruction links.
* Renamed the account field to “Name,” marked it optional, and clarified
its purpose and default behavior.
* Enhanced deletion confirmations with clearer connection names and AWS
account identifiers.
* Improved deletion handling to provide more reliable feedback.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## What kind of change does this PR introduce?
UI
## What is the current behavior?
GitHub’s empty state and Integrations icon spacing do not match the
PrivateLink list. Add connection has no plus. PrivateLink rows use a
kebab instead of click-to-view.
## What is the new behavior?
GitHub empty state matches the connections list. **Connect GitHub** is
tiny and asks you to connect before choosing a repo. Section icons
align. **Add connection** has a plus. PrivateLink rows are clickable;
delete stays in the sheet.
| Before | After |
| --- | --- |
| <img width="1456" height="1508" alt="CleanShot 2026-08-14 at 12 48
48@2x"
src="https://github.com/user-attachments/assets/27485e35-c24f-478e-8328-aad03ebb1dfb"
/> | <img width="1468" height="1494" alt="CleanShot 2026-08-14 at 14 22
19@2x"
src="https://github.com/user-attachments/assets/056e3b48-4542-4be5-9b21-4b5abd726e8e"
/> |
## Additional context
Stacked on #49087. No Vercel card work in this PR. See #49030 for the
end state, as it may already include fixes you might propose.
## To test
- **Project Settings → Integrations.** Check GitHub, Vercel, and
PrivateLink icon alignment.
- GitHub not connected: description should say **Connect GitHub to link
a repository to this project.** Button should be tiny.
- If GitHub has no repo (org page), the empty state should ask you to
add a connection.
- PrivateLink **Add connection** should show a plus. Click a connection
row to view it. No kebab.
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* AWS PrivateLink connections now display clearer titles, status,
replica details, and database visibility.
* GitHub organization integrations now provide improved empty states and
clearer connection actions.
* Added plus icons to connection buttons.
* **Improvements**
* Updated GitHub guidance based on authorization and repository
selection status.
* Standardized connection labels and refined integration page layouts.
* Improved AWS integration icon presentation and responsive upgrade
prompts.
* **Bug Fixes**
* Simplified default connection button wording across integrations.
* Improved AWS account title fallback behavior when a nickname is
unavailable.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## What kind of change does this PR introduce?
Feature
## What is the current behavior?
Accept-in-AWS guidance lives only in the view sheet, as a per-status
essay with a nested button/link. Delete is easy to miss and does not
name the database.
## What is the new behavior?
The list warns when any connection is Waiting or Expired. View
connection uses that same admonition. Delete uses a confirm dialog that
names the database, including from **View connection**.
| Before | After |
| --- | --- |
| <img width="1444" height="480" alt="CleanShot 2026-08-14 at 12 46
23@2x"
src="https://github.com/user-attachments/assets/015b261b-0bee-48f4-8f2d-d0d23293e120"
/> | <img width="1456" height="676" alt="CleanShot 2026-08-14 at 12 47
17@2x"
src="https://github.com/user-attachments/assets/0a12371b-553a-4e52-b042-7498af722f4a"
/> |
| <img width="844" height="560" alt="CleanShot 2026-08-14 at 12 46
49@2x"
src="https://github.com/user-attachments/assets/f664b165-d351-4572-8536-27f4a9749975"
/> | <img width="842" height="452" alt="CleanShot 2026-08-14 at 12 47
09@2x"
src="https://github.com/user-attachments/assets/a387c294-5814-451b-9359-e70c73de2cb2"
/> |
## Additional context
Stacked on #49086. See #49030 for the end state, as it may already
include fixes you might propose.
## To test
- **Project Settings → Integrations → AWS PrivateLink → Add
connection.** Leave it unaccepted in AWS. The list should show the
12-hour accept warning.
- **View connection** on that row. Same warning, **View instructions**,
not a status essay.
- **⋯ → Delete** on a row, and **Delete** inside **View connection.**
The dialog should name the database.
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* Added clearer AWS PrivateLink connection alerts for pending and
expired connections, including guidance and acceptance links when
applicable.
* Existing PrivateLink connections can now be deleted directly from the
connection form.
* Added confirmation dialogs with loading and completion states for
deletion.
* Added more specific descriptions for primary databases and read
replicas.
* **Bug Fixes**
* Improved connection status messaging and handling for AWS PrivateLink
integrations.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## What kind of change does this PR introduce?
UI
## What is the current behavior?
Waiting (still labelled Ready in #49085) is green. Creating is orange.
Deleting is red.
## What is the new behavior?
Waiting is orange. Creating is grey. Deleting is orange. Connected stays
the only green state.
| Before | After |
| --- | --- |
| <img width="1448" height="492" alt="CleanShot 2026-08-14 at 12 43
59@2x"
src="https://github.com/user-attachments/assets/c0d95b51-7841-4714-a01b-47e5587c3efb"
/> | <img width="1434" height="470" alt="CleanShot 2026-08-14 at 12 44
59@2x"
src="https://github.com/user-attachments/assets/3ba10dc5-5fdd-464a-a748-5085d2d65df3"
/> |
| <img width="842" height="440" alt="CleanShot 2026-08-14 at 12 44
21@2x"
src="https://github.com/user-attachments/assets/757db647-4b7c-4f77-8dcf-1eb289c40cc1"
/> | <img width="842" height="432" alt="CleanShot 2026-08-14 at 12 44
49@2x"
src="https://github.com/user-attachments/assets/1311a6d2-4712-4cb9-a6f2-f39387f0a953"
/> |
## Additional context
Stacked on #49085. See #49030 for the end state, as it may already
include fixes you might propose.
## To test
- **Project Settings → Integrations → AWS PrivateLink.** A connection
that AWS has not accepted yet should show an orange **Waiting** badge,
not green Ready.
- Creating should be grey. Deleting orange. Expired and Failed stay red.
- **Docs preview → Platform → PrivateLink.** Should say Waiting, not
Ready.
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Bug Fixes**
* Updated AWS PrivateLink connection statuses to accurately show
“Waiting” while the AWS Resource Share is pending acceptance.
* Refined status badge styling for creating, waiting, and deleting
connections.
* Clarified that Resource Shares must be accepted within 12 hours.
* **Documentation**
* Updated PrivateLink setup instructions to reflect the revised
connection status flow.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## What kind of change does this PR introduce?
Feature
## What is the current behavior?
Add connection field order and nickname handling are harder to scan.
Empty description can still show up as a blank name.
## What is the new behavior?
Add connection is AWS account ID, then database, then optional
description. An empty description is omitted from the list title.
| Before | After |
| --- | --- |
| <img width="846" height="874" alt="CleanShot 2026-08-14 at 12 42
33@2x"
src="https://github.com/user-attachments/assets/abfc4f37-a401-4bba-9408-c2530b0ac09b"
/> | <img width="844" height="794" alt="CleanShot 2026-08-14 at 12 43
01@2x"
src="https://github.com/user-attachments/assets/0cadeaea-583d-4c2b-9336-3d0fe6a1415b"
/> |
## Additional context
Stacked on #49084. See #49030 for the end state, as it may already
include fixes you might propose.
## To test
- **Project Settings → Integrations → AWS PrivateLink → Add
connection.** Confirm field order: account ID, database, description.
- Save once with a description and once without. Without one, the row
title should fall back to the account ID.
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
- **New Features**
- Added AWS account ID and database target fields to the PrivateLink
setup form.
- Added validation and improved preservation of entered values while
editing.
- Made the connection description optional.
- Updated connection status labels and badges for clearer status
visibility.
- **Documentation**
- Updated PrivateLink setup instructions to reflect the revised field
order and optional description.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## What kind of change does this PR introduce?
Refactor
## What is the current behavior?
Status labels and sheet copy are inline switches in the list and form.
## What is the new behavior?
One status lookup drives the badge and the view-sheet copy. No intended
visual change. Ready is still green.
| Before and After |
| --- |
| <img width="1460" height="486" alt="CleanShot 2026-08-14 at 12 37
13@2x"
src="https://github.com/user-attachments/assets/0c6c0b03-25f7-4e64-a0cd-72e7ef966454"
/> |
| _No visual changes_ |
## Additional context
Stacked on #48967. See https://github.com/supabase/supabase/pull/49030
for the end state, as it may already include fixes you might propose.
## To test
- **Project Settings → Integrations → AWS PrivateLink.** Look at a
connection row badge, then **View** it. Labels should match today’s
statuses. Ready should still be green.
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* Added clear status messaging for AWS PrivateLink connections,
including accepted, ready, creating, deleting, expired, and failed
states.
* Added fallback messaging for unavailable or unrecognized connection
statuses.
* **Bug Fixes**
* Improved consistency of PrivateLink status badges, labels,
descriptions, and visual styles.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## What kind of change does this PR introduce?
Feature and docs
## What is the current behavior?
PrivateLink is labelled as an AWS account, and there is no way to tell
which resource configuration belongs to the primary vs a read replica.
Put simply: you’re not adding an AWS account. You’re adding a
connection. One AWS account can have multiple PrivateLink connections,
just to different databases, with more fields also coming soon.
Part of PRODSEC-238 and fixes SEC-939.
## What is the new behavior?
Each connection shows resource configuration IDs so primary and replica
are distinguishable. Customer-facing copy says **connection**. API paths
and AWS console labels still say association.
| Before | After |
| --- | --- |
| <img width="1452" height="496" alt="CleanShot 2026-08-14 at 12 33
49@2x"
src="https://github.com/user-attachments/assets/3b295136-0325-4587-9291-b5f01fc07806"
/> | <img width="1440" height="434" alt="CleanShot 2026-08-14 at 12 34
30@2x"
src="https://github.com/user-attachments/assets/dd6ba064-18e4-4969-9c76-e3b79ac9d288"
/> |
| <img width="846" height="912" alt="CleanShot 2026-08-14 at 12 33
28@2x"
src="https://github.com/user-attachments/assets/c4c6caca-a2f6-4516-99c7-ad7cf865f8ac"
/> | <img width="844" height="880" alt="CleanShot 2026-08-14 at 12 34
39@2x"
src="https://github.com/user-attachments/assets/f3874c6b-abdc-4ef8-84fa-141cd9150871"
/> |
| <img width="1448" height="560" alt="CleanShot 2026-08-14 at 12 33
10@2x"
src="https://github.com/user-attachments/assets/8ae734cb-ec1f-4e4e-acf7-f4de459296d1"
/> | <img width="1460" height="496" alt="CleanShot 2026-08-14 at 12 32
15@2x"
src="https://github.com/user-attachments/assets/883050d5-a6f1-44bd-8ebd-1513a2c41e9f"
/> |
## Additional context
First PR in a stacked PrivateLink series (#49084 onwards). See
https://github.com/supabase/supabase/pull/49030 for the end state, as it
may already include fixes you might propose.
## To test
- **Project Settings → Integrations → AWS PrivateLink.** Open **Add
connection**, or **View** an existing one. Confirm the UI says
connection, and that resource config IDs are copyable.
- **Docs preview → Platform → PrivateLink.** Procedure steps should say
Add connection / View connection.
---------
Co-authored-by: Danny White <3104761+dnywh@users.noreply.github.com>
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>
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>
## 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
## 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>
<img width="1521" height="967" alt="image"
src="https://github.com/user-attachments/assets/8d7bed1f-3ed8-4311-bd4b-92345ae02a52"
/>
Updates project settings integration page to more aligned with our
updated layout guidance (as defined in layout.mdx in design system).
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Style**
* Refined the integrations settings page layout and visual design across
AWS PrivateLink, GitHub, and Vercel integration sections for improved
consistency.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## 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
## What kind of change does this PR introduce?
Docs update and UI copy improvement.
## What is the current behavior?
The GitHub integration working directory helper uses an inline tooltip
for examples. In the form layout, the tooltip alignment and inline code
wrapping can make the helper harder to scan.
The integration settings pages also mix markdown-rendered copy with JSX
copy, duplicate the integration cover image helper, and use slightly
different heading, spacing, and button copy patterns across GitHub,
Vercel, and AWS PrivateLink.
## What is the new behavior?
The GitHub working directory field now keeps the helper copy concise and
links to a dedicated docs section with examples for repository root and
nested `supabase/` directories.
The integration settings sections now use a more consistent JSX
structure and copy treatment across GitHub, Vercel, and AWS PrivateLink,
including shared cover imagery and matching explanatory section
hierarchy.
| Before | After |
| --- | --- |
| <img width="1838" height="696" alt="CleanShot 2026-04-24 at 14 35
32@2x"
src="https://github.com/user-attachments/assets/f9843018-fbf5-4c18-a0c3-1842b665f3fd"
/> | <img width="1842" height="700" alt="CleanShot 2026-04-24 at 14 30
21@2x-64E8726E-0B89-4C5A-8A47-CE1AA24F3D1A"
src="https://github.com/user-attachments/assets/bb017464-2b43-4dfe-94b8-a586aedea318"
/> |
| <img width="1884" height="1432" alt="CleanShot 2026-04-24 at 14 40
19@2x"
src="https://github.com/user-attachments/assets/b34e4573-cd7c-4588-83a0-0e1941019552"
/> | <img width="1844" height="1424" alt="CleanShot 2026-04-24 at 14 39
02@2x"
src="https://github.com/user-attachments/assets/4f82b01c-cb27-4f01-b2da-76b7f6e298a5"
/> |
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Documentation**
* Clarified GitHub integration setup: provide a Working directory value,
how to compute it from the repo root (including "." for root), examples,
and updated “initialize” spelling.
* **Refactor**
* Simplified integration form descriptions (tooltips → inline text +
Learn more link).
* Reworked GitHub and Vercel integration content to use consistent
headings, layout, and shared image handling.
* Reorganized integration settings rendering for clearer UI states.
* **Style**
* Minor copy, casing, and button text/spacing adjustments.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
Danny White