Commit Graph

8 Commits

Author SHA1 Message Date
Danny White 512201dcd0 chore(ui): remove the Classic Dark theme (#50387)
## What kind of change does this PR introduce?

Chore.

## What is the current behaviour?

Classic Dark remains available across the shared theme library and
several apps. Studio now supports System, Dark, and Light as its theme
modes, but still carries compatibility paths for Classic Dark.

## What is the new behaviour?

- Removes Classic Dark from shared theme options, application commands,
stylesheets, previews, examples, and replay handling.
- Deletes the Classic Dark and faux Classic Dark stylesheets.
- Removes the now-unused Classic Dark branches from Studio theme colour
controls.
- Migrates `classic-dark` to `dark` so first rendered frame renders Dark
(not Light)

| After |
| --- |
| <img width="1458" height="1778" alt="CleanShot 2026-09-18 at 11 07
40@2x"
src="https://github.com/user-attachments/assets/679bf87f-a3c1-4599-ad2f-292d98d0b856"
/> |

## To test

1. In Studio, open Account Preferences → Appearance. Confirm the
available themes are System, Dark, and Light, and that theme colour
controls still work in each resolved mode.
2. Set the `theme` local storage value to `classic-dark`, then reload
Studio. Confirm it renders as Dark immediately and the stored value
becomes `dark`.
3. Open the theme switcher in Design System, Learn, and UI Library.
Confirm Classic Dark is no longer available and Light, Dark, and System
still apply correctly.


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

## Summary by CodeRabbit

* **Changes**
* Removed the Classic Dark theme option from theme menus and settings
across the application.
* Classic Dark selections are automatically migrated to the standard
Dark theme.
* Updated theme documentation and demonstrations to list only System,
Light, and Dark.
* Removed Classic Dark styling and preview support; existing Dark,
Light, and System themes remain available.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2026-09-21 10:53:14 +10:00
claude[bot] cc540ff302 feat(studio): add safe theme colour controls (#49804)
## What kind of change does this PR introduce?

Feature.

## What is the current behaviour?

Studio Appearance preferences only select a theme mode. The underlying
theme colours cannot be adjusted, and the existing proof of concept
allowed unsafe combinations and introduced a bespoke Slider variant.

## What is the new behaviour?

- Preserves the existing System, Dark, Light, and Classic Dark theme
options. Classic Dark remains a fixed preset.
- Adds four theme colour controls using the existing Supabase Slider
unchanged. Each control presents a consistent 0 to 100 scale mapped to
bounded light and dark ranges.
- Previews colour changes while dragging and persists them once the
interaction finishes, including rapid pointer gestures.
- Stores light and dark overrides separately, validates stored values,
clamps legacy values, and removes overrides that return to their shipped
defaults.
- Adds concise descriptions for Chroma, Contrast, Surface, and Elevation
step, with a scoped Reset action shown only when the active theme
differs from its defaults.
- Keeps Slider in a stable shared chunk so production builds do not
create a circular dependency between generated UI chunks.

| Before | After |
| --- | --- |
| <img width="1448" height="1284" alt="CleanShot 2026-09-15 at 14 33
53@2x"
src="https://github.com/user-attachments/assets/d55151c7-b2a9-40c6-9468-e77ae685ac38"
/> | <img width="1454" height="1958" alt="CleanShot 2026-09-15 at 17 48
47@2x"
src="https://github.com/user-attachments/assets/9d302e67-76cc-4341-948c-81713dea2e93"
/> |

## To test

1. Open `/account/me` and scroll to Appearance.
2. Switch between System, Dark, Light, and Classic Dark. Confirm the
same four modes remain available in the account theme menu.
3. Confirm Classic Dark retains its existing appearance and does not
show theme colour controls.
4. In System, Dark, or Light, move each Theme colors slider to both
ends. Confirm the dashboard previews the change, remains readable, and
the theme cards do not shift or remount.
5. Reload the page and confirm colour changes persist separately for
Light and Dark.
6. Return all sliders to their defaults, or select Reset, and confirm
the Reset action disappears.
7. In System mode, change the operating system theme and confirm each
resolved mode restores its own colour settings.

---------

Co-authored-by: Claude <noreply@anthropic.com>
Co-authored-by: Danny White <3104761+dnywh@users.noreply.github.com>
2026-09-17 10:33:59 +10:00
claude[bot] 99be7f92ce feat(studio): add Privacy Policy update notice (#50397)
## Summary

Adds a compact Privacy Policy update notice for signed-in Studio users
on organization landing pages.

- Shows on `/org`, `/organizations`, and `/org/:slug`
- Opens the approved policy explanation in a dialog
- Links to the Privacy Policy and `privacy@supabase.com`
- Persists acknowledgement in a dated local storage key
- Stays off project and organization settings routes so it cannot cover
product controls

## Why

The Privacy Policy changes the data controller from Supabase, Inc. to
Supabase Pte. Ltd. User rights and protections are unchanged.

This restores the established authenticated Studio notification pattern:

- [#35923](https://github.com/supabase/supabase/pull/35923): May 2025
Privacy Policy notice
- [#43681](https://github.com/supabase/supabase/pull/43681) and
[#43889](https://github.com/supabase/supabase/pull/43889): March 2026
Privacy Policy notice and design pass
- [#45632](https://github.com/supabase/supabase/pull/45632): May 2026
Terms of Service notice
- [#48524](https://github.com/supabase/supabase/pull/48524): current
reusable Studio banner stack

## Release order

The policy content and Studio notice deploy independently. Keep this PR
in draft until [#50392](https://github.com/supabase/supabase/pull/50392)
is approved, merged, and live. The notice appears immediately when this
Studio change deploys.

## To test

1. Open Studio on `/organizations` or an organization project-list page.
2. Confirm the compact Privacy Policy notice appears.
3. Open **Learn more** and confirm the dialog copy and both links.
4. Select **Understood** or close the notice.
5. Reload and confirm the notice remains dismissed.
6. Remove `privacy-policy-update-2026-09-16-dismissed` from local
storage and confirm the notice returns.
7. Open a project route and confirm the notice is absent.

## Verification

- Prettier passes on changed files.
- ESLint passes on changed Studio files.
- Focused Vitest suites pass: 25 tests.
- Studio Unit Tests & Build Check passes.
- TypeScript & Lint, UI Tests, Studio Docker Build, dead-code, ratchet,
and validation workflows pass.
- All four self-hosted Studio E2E shards pass for both router
implementations.
- All deploy previews pass.
- The Studio preview rendered the compact notice on the organization
landing page without console errors. The dialog and dismissal flow still
need an authenticated browser pass after the session redirected to
sign-in.

A direct local Studio TypeScript check reaches one existing unrelated
error in
`packages/ui-patterns/src/McpUrlBuilder/components/InstructionBlocks.tsx`;
no changed file reports an error and the required TypeScript CI workflow
passes.

## Measurement

Success means signed-in users can find the updated policy from the
organization landing experience without interrupting project work. The
dated dismissal key confirms acknowledgement locally. CI protects the
non-blocking route scope, and Privacy can monitor questions sent to
`privacy@supabase.com` after release.

---------

Co-authored-by: Claude <noreply@anthropic.com>
Co-authored-by: Pamela Chia <pamelachiamayyee@gmail.com>
2026-09-16 17:51:25 +08:00
Danny White e57aae3c83 feat(design-system): document disabled controls and add focusableWhenDisabled (#50068)
## What kind of change does this PR introduce?

Docs update, with supporting `ui` and Studio changes.

## What is the current behaviour?

Disabled buttons with tooltips use native `disabled`, which removes them
from the tab order. Keyboard users cannot focus the control or read the
tooltip explaining why an action is blocked.

The design system also lacked guidance on keeping disabled actions
discoverable and explaining why they are unavailable.

## What is the new behaviour?

- Adds a **Disabled controls** section to the accessibility docs, with
live examples for a focusable disabled button and visible page-level
context
- Adds `focusableWhenDisabled` to `Button`, keeping `disabled` as the
semantic state while using `aria-disabled`, retaining keyboard focus,
and guarding click handlers
- Updates Studio's `ButtonTooltip` to make disabled buttons with tooltip
text focusable automatically

Also includes earlier design-system fixes on this branch:

- Centralises `BASE_PATH` with a `/design-system` fallback so asset URLs
work without a local `.env` file
- Fixes sidebar hover and active tokens in design-system and ui-library,
aligned with Studio's `InnerSideMenuItem`

## To test

**Design system**

1. Open the [accessibility
preview](https://design-system-git-fix-design-system-docs-and-nav-fixes-supabase.vercel.app/design-system/docs/accessibility)
2. Scroll to **Disabled controls**
3. Tab to the **disabled-focusable** example. Confirm the button remains
focusable, looks disabled, and shows its tooltip on focus
4. Confirm the **disabled-unavailable-with-notice** example shows the
admonition and focusable disabled button pattern

**Studio (optional, requires a High Availability project)**

5. Go to Settings → General → **Pause project**. Tab to the button and
confirm it remains focusable, looks disabled, and shows the HA tooltip
on focus
6. Go to Database → Backups and find **Restore** on a scheduled backup
row. Confirm the same behaviour
2026-09-11 01:52:21 +00:00
Danny White 30ab816ff4 feat(studio): make the Connect framework and client selectors searchable (#50072)
## What kind of change does this PR introduce?

Feature.

## What is the current behavior?

The Framework and Client selectors in the Connect sheet are plain
selects. Neither is scannable at its current length, and Client is the
worse of the two at 19 options.

## What is the new behavior?

Both are searchable comboboxes. Each keeps its selection, filters as you
type, matches on the underlying key as well as the label so `nextjs`
finds `Next.js`, and announces its empty state to screen readers.

| Before | After |
| --- | --- |
| <img width="1182" height="1250" alt="CleanShot 2026-09-07 at 14 47
12@2x"
src="https://github.com/user-attachments/assets/6243c549-03cc-41bf-8b3c-a186ca0e93b5"
/> | <img width="1178" height="1162" alt="CleanShot 2026-09-07 at 14 46
42@2x"
src="https://github.com/user-attachments/assets/d7ca5e72-3f8b-48e5-b20f-84382e4e4fd7"
/> |

Placeholder, search and empty-state copy now sit on the field definition
in the schema, next to the label, so one combobox component serves both
fields without guessing at plurals.

Client keeps its icons hidden, matching what the select did. The comment
about MCP images being unoptimized still stands, so this is not the PR
to turn them on.

Radix Select brings its own scroll lock, so replacing it with a popover
would have regressed touch scrolling in the sheet. #50103 moved that
guard into `CommandList` and has merged, so this branch now carries the
feature only.

## To test

- Open the Connect sheet on the deploy preview.
- Open the Framework selector, search for `native`, confirm only React
Native remains, select it, and confirm the generated connection
instructions update.
- Search `nextjs` and confirm Next.js matches on its key.
- Switch to the MCP tab and open Client. Search `cur` and confirm Cursor
matches.
- Confirm both lists cap their height and scroll, and that the sheet
behind stays put.
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit

* **New Features**
* Framework selection now uses a searchable combobox for easier
navigation of long lists.
  * Search results clear automatically when the combobox closes.
  * Long framework lists appear in a contained, scrollable area.

* **Accessibility**
  * Screen readers announce when no frameworks match the search.
* Improved combobox and listbox relationships support assistive
technologies.
* The dropdown opens as a modal layer to keep focus within the selection
experience.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

---------

Co-authored-by: Claude Opus 5 <noreply@anthropic.com>
2026-09-10 00:35:05 +00:00
Danny White 282a2a22cf fix(studio): allow pipeline number inputs to be cleared (#50078)
## What kind of change does this PR introduce?

Bug fix for the pipeline destination form.

## What is the current behavior?

Clearing a numeric field under Advanced settings restores its previous
value immediately, so users cannot replace the value normally.

## What is the new behavior?

Numeric fields use an empty string as their controlled blank value while
editing, so users can clear an existing value before entering its
replacement. Existing field-specific validation messages are preserved
for invalid or empty required values. Maximum staleness remains optional
and can be left blank.
Adds component and schema coverage for all five numeric Advanced
settings fields, including the BigQuery-only fields.

## To test

1. Open Database > Replication and start a new pipeline.
2. Select BigQuery and expand Advanced settings.
3. Clear each numeric field and confirm it can be edited without
reverting to its previous value. Required fields may show their existing
validation message while empty.
4. Enter a replacement value such as `5` and confirm the field accepts
it.
5. Leave a required numeric field blank and confirm the existing
field-specific validation message appears.

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

- **Bug Fixes**
- Improved validation for replication destination settings, with clearer
errors when required numeric fields are left empty.
- Validation now updates immediately when numeric values are cleared or
corrected.
  - BigQuery connection pool size must be greater than zero.
  - Empty maximum staleness values are accepted and handled correctly.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

---------

Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
2026-09-08 11:32:46 +10:00
Kanishk Dudeja b917b0e1bf feat(billing): adds non-dismissable modal for indirect tax declaration (#49643)
### Summary

This PR adds a blocking dashboard modal for affected Australian
customers to confirm their GST registration and business use of
Supabase.

KPMG requires us to collect this declaration from certain existing
Australian customers. The backend now identifies organizations that
still need to respond using `requires_indirect_tax_declaration` and
stores their `yes` or `no`
response in Orb customer metadata.

It also supports email links with `submit_indirect_tax_declaration=true`
and shows a dismissible confirmation when the organization has already
responded.

### Testing

#### Manual testing

- Confirmed the modal appears for an affected organization without an
existing response and cannot be dismissed.
- Submitted both `yes` and `no` and confirmed the modal remains closed
after a refresh.
- Confirmed the declaration is stored without changing the customer's
Tax ID.
- Confirmed the modal does not appear for non admins/owners or
organizations that do not require a declaration.
- Confirmed the email-link parameter shows the already-submitted
confirmation only for organizations that have responded, and is removed
when dismissed.

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

* **New Features**
* Added an indirect tax declaration dialog for eligible Australian
organizations.
* Users with billing permissions can select “Yes” or “No” and submit
their declaration.
* Added a dismissible confirmation for declarations submitted through a
linked prompt.
* The dialog requires an explicit response and provides guidance when no
option is selected.

* **Bug Fixes**
* Declaration prompts remain visible through submission confirmation and
close when dismissed.
  * Users without billing permissions do not see the dialog.
* Success notifications no longer overlap with the confirmation dialog.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

---------

Co-authored-by: Julian Domke <68325451+juleswritescode@users.noreply.github.com>
2026-09-01 18:04:25 +05:30
Mert YEREKAPAN 65033221fb feat(studio): add logs.all deprecation banner (#49059)
Informational banner for the `logs.all` Management API removal on Sept
23, in the Logs and Observability sections.

* Untargeted. Whether a project calls the endpoint is behaviour that no
API response carries, so precise targeting needs a mgmt-api change (we
aimed for speed and less complexity here). Copy is informational rather
than "action required" since most viewers won't be affected.
* Uses `BannerStack` (bottom-right card) rather than the top header
banner, at priority 4 so it renders as the front card. Note this pushes
`database-connections-banner` (p2) and `index-advisor-banner` (p3) into
peek slivers on Observability.
* Short Notice card: title, one line of copy with `logs.all` inline, and
a Learn more link to the changelog.
* Waits for localStorage before showing, and BannerStack ignores stale
dismiss timers when a banner is revived (avoids flash-then-disappear on
refresh).
* Dismiss is browser-level; self-expires Sept 24 via
`LogsAllDeprecationExpiry`.
* Cleanup tracked in GROWTH-1104.
* Tested in staging.

Check in:

- /project/_/logs (unified logs)
- /project/_/logs/explorer
- /project/_/observability

| After |
| --- |
| <img width="626" height="528" alt="CleanShot 2026-08-20 at 12 29
49@2x"
src="https://github.com/user-attachments/assets/2044966d-bc83-4f88-ac75-1b8ff80be08d"
/> | <img width="622" height="440" alt="CleanShot 2026-08-20 at 12 28
33@2x"
src="https://github.com/user-attachments/assets/1dc768cd-837c-4a5a-a3fa-7b6986fe5876"
/> |

Resolves GROWTH-1093.

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

## New Features
* Added a dismissible notice about the `logs.all` endpoint retirement on
September 23, 2026.
* The notice appears on relevant Logs and Observability pages with
streamlined migration guidance.
* Clarified that dashboard logs remain unchanged.
* Dismissal preferences are saved, and notices remain visible or are
removed reliably during navigation.

## Telemetry
* Added tracking for notice display and dismissal interactions.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

---------

Co-authored-by: Danny White <3104761+dnywh@users.noreply.github.com>
Co-authored-by: Cursor Agent <cursoragent@cursor.com>
Co-authored-by: Danny White <dnywh@users.noreply.github.com>
2026-08-20 14:17:20 +00:00