## What kind of change does this PR introduce?
Bug fix.
- Follow-up work to FE-3640
- Contributes to DEPR-604
## What is the current behavior?
Known dynamic OAuth requesters on `/dashboard/authorize` relied on
OAuth-specific hard-coded icon assets that were dark-mode only.
Cursor did not have separate light/dark assets in the shared MCP icon
registry, Perplexity only had a light tile asset with baked-in padding,
and OpenAI used the older blossom mark.
## What is the new behavior?
Known OAuth requester logos now resolve through the shared MCP icon
registry while preserving the existing `SupabaseLogo` treatment for
paired authorisation screens.
Cursor uses transparent SVG light/dark variants, Perplexity has cropped
transparent SVG light/dark variants, and OpenAI/ChatGPT uses the newer
monoblossom SVG in black/white variants. Claude remains static until a
suitable variant is available.
Unknown requester icons still render from the provided URL and fall back
to the requester initial if the image fails.
| Before | After |
| --- | --- |
| <img width="828" height="636" alt="Authorize OpenAI
Supabase-E2A05664-589F-458F-8452-9CEE008D558A"
src="https://github.com/user-attachments/assets/140021b1-ff05-4092-98ef-2eae94ff2ddb"
/> | <img width="828" height="636" alt="Authorize OpenAI
Supabase-EC7E00BD-439A-45D1-8E55-240B227C6897"
src="https://github.com/user-attachments/assets/93e603f2-5cbf-4219-b692-d36ac98e8d2a"
/> |
| <img width="828" height="636" alt="66 Authorize OpenAI
Supabase-CB31FF76-86DB-43A6-A426-46B99B8B1B91"
src="https://github.com/user-attachments/assets/b261416e-39b8-40b3-87fd-461653aa0334"
/> | <img width="828" height="636" alt="Authorize OpenAI
Supabase-EAFCF2F2-5CEA-4FE6-8AC0-819F764B414E"
src="https://github.com/user-attachments/assets/35ad7525-0fa9-4438-b117-4e70b78eb719"
/> |
## To test
1. Navigate to `http://localhost:8082/authorize?auth_id=test-auth-id`
2. Open DevTools → Network
3. Find `/platform/oauth/authorizations/test-auth-id`
4. Right-click → Override content
5. Replace the response body with:
```js
{
"name": "Perplexity",
"website": "https://perplexity.ai",
"icon": null,
"domain": "perplexity.ai",
"scopes": [],
"expires_at": "2026-12-31T23:59:59.000Z",
"approved_at": null,
"registration_type": "dynamic"
}
```
6. Then change "name" to Cursor, Claude, ChatGPT, or OpenAI and refresh
to inspect each logo
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* OAuth app requester logos now dynamically adapt to light and dark
themes, with improved logo selection for known requesters.
* Cursor now uses a distinct dark icon variant.
* Added Perplexity client icon support.
* **Bug Fixes**
* Improved logo rendering robustness: if a logo can’t be loaded, the UI
falls back to the requester’s initial.
* **Tests**
* Expanded coverage for theme-aware logo rendering and icon variant
handling, including unknown-icon and fallback scenarios.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
---------
Co-authored-by: Copilot Autofix powered by AI <175728472+Copilot@users.noreply.github.com>
**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>
## Problem
We now use the Shadcn breadcrumb everywhere but we still have the old
breadcrumb code.
## Solution
- Remove the old breadcrumb code
- Fix import paths where needed
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Refactor**
* Consolidated UI component imports across the codebase to use unified
package entrypoints.
* Removed legacy breadcrumb component implementation in favor of
standardized components.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## Context
Changes are mainly within the `FilterBar` component in UI patterns
Supports a `count` option in `filterProperties` for `FilterBar` - which
will render as a filter option but only if the operator is set to
`eq`(opting for this as we don't have the numbers up front for the `neq`
operator)
<img width="389" height="319" alt="image"
src="https://github.com/user-attachments/assets/1d6e7dae-5350-4110-910b-88a5517fbb6e"
/>
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* Filter options in Unified Logs now display item counts for log type,
method, level, and other enum filters, providing visibility into result
distribution across filter choices.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## Problem
All inputs don't have the same style when focused
## Solution
Consolidate focus states across inputs
## How to test
Checkout the design system form examples:
https://design-system-git-gildasgarcia-depr-354-consoli-0188d7-supabase.vercel.app/design-system/docs/ui-patterns/forms
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Style**
* Refined focus-visible ring/outline and ring-offset tokens across
buttons, multi-select, radio groups, checkbox, select, and switch for a
more consistent accessible experience.
* Updated focus-state styling details within the shared Button and
related controls (including open-state outline behavior).
* **Refactor**
* Updated icon upload preview triggers in form examples to use the
shared Button component while preserving existing upload behavior and
visuals.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## Problem
The date picker pattern we currently have:
- requires developers add classes and props themselves to get the
expected result. This is cumbersome and prone to error.
- does not visually convey the field invalid state like inputs do
<img width="702" height="256" alt="image"
src="https://github.com/user-attachments/assets/cacd6414-6789-42e3-8d06-88e44fd9fe0a"
/>
## Solution
Introduce a new `DatePicker` _UI pattern_ that wraps the `Popover` and
`Button` components to ease the most common scenarios while still
allowing full customization
<img width="699" height="250" alt="image"
src="https://github.com/user-attachments/assets/e80f842c-28b2-4a4f-b316-c2005e771912"
/>
## Component usage
Note how we manually pass the `isInvalid` prop to the
`<DatePickerButton>` to avoid relying on `react-hook-form` contexts
which would make the date picker unusable outside RHF forms.
Alternative would be to also have a `<DatePickerInput>` that could be
used instead of `<DatePickerButton>` when inside an RHF form.
```tsx
<FormField
control={form.control}
name="expiryDate"
render={({ field, fieldState }) => (
<FormItemLayout
layout="horizontal"
label="Date Picker"
description="Date selection with calendar popover"
>
<FormControl className="col-span-6">
<DatePicker>
<DatePickerTrigger asChild>
<DatePickerButton isInvalid={fieldState.invalid}>
{field.value ? format(field.value, 'PPP') : 'Pick a date'}
</DatePickerButton>
</DatePickerTrigger>
<DatePickerContent>
<Calendar
mode="single"
selected={field.value}
onSelect={field.onChange}
initialFocus
/>
</DatePickerContent>
</DatePicker>
</FormControl>
</FormItemLayout>
)}
/>
---------
Co-authored-by: Ivan Vasilov <vasilov.ivan@gmail.com>
## 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>
This PR adds an error state to the usage charts on the Project home
page.
<img width="1708" height="471" alt="Screenshot 2026-06-16 at 18 10 20"
src="https://github.com/user-attachments/assets/cba87dad-5e23-4cd1-b787-0ea699445d7f"
/>
I also added an error state to the charts in the [design
system](https://design-system-git-feat-chart-error-state-supabase.vercel.app/design-system/docs/ui-patterns/charts#chart-states).
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* Charts now display error states when data retrieval or processing
fails, providing users with clear feedback about issues.
* Improved error visibility and handling across analytics and charting
components for better transparency.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
The 'New Group' action used value `'group'` which collided with any
column named `'group'`. Changed to unique sentinel `'__new_group__'`.
## How to test
Create a table with the column Group
```
create table public.test_group_filter (
id bigint generated always as identity primary key,
name text,
"group" text
);
insert into public.test_group_filter (name, "group")
values
('Alice', 'admin'),
('Bob', 'member'),
('Charlie', 'guest');
```
Try to filter on Group, it should work
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Bug Fixes**
* Resolved a naming collision in FilterBar where properties named
"group" conflicted with the group creation action, preventing users from
accurately filtering by properties with this name.
* **Tests**
* Added comprehensive test coverage for FilterBar's property selection
and group creation features, verifying correct handling of edge cases
and reserved property names.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## Context
As per PR title
<img width="500" alt="image"
src="https://github.com/user-attachments/assets/4cf07471-a0c1-449d-9759-a0ccb3456e09"
/>
Also resolves FE-3565
Closes mobile menu when a link is clicked
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Improvements**
* Mobile menu now closes reliably when selecting more navigation items
(Modules, various Developers/Solutions links and footer links).
* Enhanced link focus and interaction behavior in the mobile menu for
clearer keyboard/touch feedback.
* **New Features**
* Navigation links can now accept optional click handlers, enabling
custom onClick behavior.
* **Refactor**
* Internal reorganization of mobile menu styling and link composition to
simplify maintenance.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
- Marketplace index page
- update order of feature partner integrations in hero
- fix z-index on MarketplaceFilterBar in "list" view
<img width="275" height="104" alt="Screenshot 2026-06-02 at 17 07 29"
src="https://github.com/user-attachments/assets/5cef64f9-895e-4f8d-8f30-153ddd5c89dd"
/>
- Marketplace detail page
- use "prose" css styling on overview content for better text styling
(heading with top padding, etc)
- refine FilesView in overview tab to only show swipeable and zoomable
previews (so the big image doesn't occupy too much space) + lazy load
FilesView component
- improve page loading state
- improve overview side rail sticky-top and remove redundant "About"
label
<img width="1333" height="732" alt="Screenshot 2026-06-02 at 17 20 29"
src="https://github.com/user-attachments/assets/8f3dd4a0-c241-4b7f-b8c8-192e1d7a616d"
/>
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* Interactive carousel with image zoom capability for viewing
integration preview images
* **Bug Fixes**
* Fixed z-index layering issue with marketplace filter bar
* **Refactor**
* Redesigned marketplace detail page header with breadcrumb navigation
* Updated integration image handling structure with enhanced metadata
* Optimized dynamic loading for integration file viewers
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
---------
Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com>
## What kind of change does this PR introduce?
Add `Markdown` component
- as a ui-pattern
- docs in design-system
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* Introduced a Markdown UI pattern with full documentation and a docs
sidebar entry.
* Markdown component supports composable renderers, optional lazy syntax
highlighting, and customizable element overrides.
* Added many interactive examples (full demo, headings, paragraphs,
lists, links, inline code, blockquotes, code blocks, tables, images,
horizontal rules) plus Quote and Avatar demos.
* **Documentation**
* New MDX guide detailing usage, props, and customization previews.
<!-- review_stack_entry_start -->
[](https://app.coderabbit.ai/change-stack/supabase/supabase/pull/46325?utm_source=github_walkthrough&utm_medium=github&utm_campaign=change_stack)
<!-- review_stack_entry_end -->
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
<img width="1285" height="654" alt="image"
src="https://github.com/user-attachments/assets/10074f07-3ac0-4f1f-b920-4255c67968d6"
/>
Updates file storage buckets to make use of new page components and
follow more standard full width pages as recommended in our design
system.
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* Search input now always visible with dynamic placeholder and cancel
control.
* “Go up one level” navigation button shown in list view when not at
bucket root.
* **Style**
* Thinner icon strokes and smaller button/icon sizing across the Storage
Explorer and preview.
* Header, breadcrumbs, and page container spacing/layout refined;
explorer outer container simplified.
* Selection count UI made compact/monospaced; new layout tokens for
header and bulk-action rows.
* **Tests**
* Unit and e2e tests updated; added e2e helper for rename/create inputs.
<!-- review_stack_entry_start -->
[](https://app.coderabbit.ai/change-stack/supabase/supabase/pull/46184?utm_source=github_walkthrough&utm_medium=github&utm_campaign=change_stack)
<!-- review_stack_entry_end -->
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## What kind of change does this PR introduce?
Chore / docs update. Related to DEPR-551. Stacked on #46053.
## What is the current behavior?
`Admonition` still accepts `label` as a backwards-compatible alias for
`title`, and a few www blog posts plus the Docs MkDocs admonition
transform still use or emit that alias.
## What is the new behavior?
Removes the `label` prop from `AdmonitionProps`, migrates the remaining
www blog Admonitions to `title`, and updates the Docs MkDocs transform
to emit `title` directly.
This leaves `title`, `description`, and `children` as the supported
Admonition content API.
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Refactor**
* Admonition now uses a single required title prop for headings; the
legacy label prop is removed and no longer used.
* **Documentation**
* Updated docs and blog posts to pass admonition heading via title and
removed notes about label support.
* **Tests**
* Component tests adjusted to validate the new title-only behavior and
to ensure legacy label usage is rejected.
<!-- review_stack_entry_start -->
[](https://app.coderabbit.ai/change-stack/supabase/supabase/pull/46054?utm_source=github_walkthrough&utm_medium=github&utm_campaign=change_stack)
<!-- review_stack_entry_end -->
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
---------
Co-authored-by: Claude Sonnet 4.6 <noreply@anthropic.com>
## Summary
Two surfaces were showing invalid Codex config keys that don't exist in
Codex's schema (which uses `additionalProperties: false`), causing
validation errors for users who followed the setup steps.
- **Studio Connect Sheet** (`connect.schema.ts`): removes the "Enable
remote MCP client support" step, which told users to add
`[mcp]\nremote_mcp_client_enabled = true` to `~/.codex/config.toml`.
Deletes the dead content component and updates tests.
- **Docs MCP panel** (`ui-patterns/McpUrlBuilder/constants.tsx`):
removes the `[features]\nrmcp_client = true` config block from the Codex
`alternateInstructions`. Keeps the valid authenticate (`codex mcp login
supabase`) and verify (`/mcp`) steps.
Closes
[AI-548](https://linear.app/supabase/issue/AI-548/bug-studio-mcp-connect-flow-shows-invalid-codex-config-guidance)
Fixes#43893
## Root cause
Both invalid keys were introduced in #42374 (Feb 2026). A full search
through the [`openai/codex`](https://github.com/openai/codex) git
history confirms neither `remote_mcp_client_enabled` nor `rmcp_client`
ever existed in any version of the codebase (neither the TypeScript CLI
nor the Rust rewrite).
---------
Co-authored-by: Claude Sonnet 4.6 <noreply@anthropic.com>
Adjusts layout / page patterns including design system documentation and
page components.
<img width="937" height="643" alt="image"
src="https://github.com/user-attachments/assets/5f7864a3-04ae-4ccf-b2b8-d9fe5e29554e"
/>
**To test**
- Ensure all existing page types in Studio are un-effected. They
shouldn't be since existing components aren't touched.
- Run design-system and have a read through layout and page header
documentation. Make sure you understand when and where to use the
various combinations of page components and their variants.
**Next**
Once we are happy with these patterns we can gradually start to update
Studio pages that make use of breadcrumbs and/or sub navigation.
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* Added PageBreadcrumbs and PageNav page chrome
* Several new interactive layout examples (Auth Emails, Edge Functions,
Full‑Width, Logs) and demo pages
* **Documentation**
* New docs for PageBreadcrumbs and PageNav
* Reworked layout guidance and patterns; updated fragment/example docs
and usage notes
* **Improvements**
* Component preview now supports explicit padding control
* Simplified page header demo and updated previews
<!-- review_stack_entry_start -->
[](https://app.coderabbit.ai/change-stack/supabase/supabase/pull/46126?utm_source=github_walkthrough&utm_medium=github&utm_campaign=change_stack)
<!-- review_stack_entry_end -->
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## Problem
The `_Shadcn_` suffix isn't needed anymore on `Command` components
## Solution
- Remove the `_Shadcn_` suffix
- Simplify UI package exports
- Apply prettier
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Refactor**
* Simplified command component imports and exports across the UI library
by removing internal naming aliases and adopting direct component
references. Updated the public UI package barrel export to use wildcard
re-exports for cleaner API surface.
<!-- review_stack_entry_start -->
[](https://app.coderabbit.ai/change-stack/supabase/supabase/pull/46153?utm_source=github_walkthrough&utm_medium=github&utm_campaign=change_stack)
<!-- review_stack_entry_end -->
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## Context
Adjusts the filter bar component to accept a `freeformDefaultProperty`,
in which entering any text in the filter bar will opt to search against
that property by default. (Property must be defined within the
`filterProperties` prop too)
Applies to unified logs, which for e.g "Event message" is a valid
filter:
<img width="428" height="250" alt="image"
src="https://github.com/user-attachments/assets/a08c015c-c9aa-4985-9e15-6429f455ccf0"
/>
I've set `freeformDefaultProperty` to be `event_message`, and hence
typing free text will opt the default action to just filtering against
that property
<img width="437" height="135" alt="image"
src="https://github.com/user-attachments/assets/ccf6944a-1c5d-4944-acfa-ac82dc20bb10"
/>
### Demo:
https://github.com/user-attachments/assets/287ee22d-f957-48e5-89b0-1fed159cd86a
### Other changes
- Opt to deprecate `truncateText` util from unified logs -> preference
for tailwind instead
- Event message is added as a filter field, but hidden in the side nav
(wouldn't make sense since the content is very dynamic, unlike something
similar like pathname)
- Fixes some console errors in unified logs because we were using
`.getColumn` in `DataTableSheetRowAction`
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* Added an "Event message" filter (hidden by default) and set it as the
default target for freeform searches.
* **UI Improvements**
* Filter sidebar resize constraints tightened.
* Timeline chart spacing and x-axis tick behavior improved.
* Action labels and command list items no longer truncate long input
values.
* **Bug Fixes**
* More reliable resolution of target columns for row actions, improving
available filter options.
<!-- review_stack_entry_start -->
[](https://app.coderabbit.ai/change-stack/supabase/supabase/pull/46134?utm_source=github_walkthrough&utm_medium=github&utm_campaign=change_stack)
<!-- review_stack_entry_end -->
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## Problem
The `ui-patterns/CommandMenu` exposes internal components that have the
same names as the base shadcn components they wrap. This create
confusion about which one to use and forces us to expose the base ones
with the `_Shadcn_` suffix.
## Solution
Rename those internal components to have `CommandMenu` in their names to
make it clearer they are meant to be used with `CommandMenu`. We will
then rename the shadcn base ones to remove the suffix.
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
## Refactor
* Standardized Command Menu component naming across the design system
for improved consistency and clarity. Updated component names:
`CommandInput` → `CommandMenuInput`, `CommandList` → `CommandMenuList`,
`CommandItem` → `CommandMenuItem`, `CommandEmpty` → `CommandMenuEmpty`,
and `CommandGroup` → `CommandMenuGroup`. Updated public API exports,
internal subpath references, all examples within the registry, and
implementations across documentation, studio, and application
interfaces.
<!-- review_stack_entry_start -->
[](https://app.coderabbit.ai/change-stack/supabase/supabase/pull/45996)
<!-- review_stack_entry_end -->
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## Context
Swaps out (and deprecates) the unified logs's own filter bar, for our
existing design system's filter bar
<img width="1450" height="355" alt="image"
src="https://github.com/user-attachments/assets/c5e83bd1-4e67-4bb5-8f27-a3d9beacbbb5"
/>
Other changes involved for the FilterBar itself includes the following
(more details in subsequent sections)
- Add `onApply` param for `FilterBar` that will only trigger when an
entered filter is "complete" (e.g on enter or blur)
- Automatically select the operator if only one exists
## To test
- Verify that the filter bar in general works BUT note there's some odd
behaviour when searching on say the "status" column (more details under
known issues)
- likely something with the internal SQL i think, will need to
investigate separately
- afaict testing on the method seems to be working at least
---
### Add `onApply` parameter for `FilterBar`
The search behaviour for the filter bar feels a bit awkward atm -
referencing the table editor:
- selecting the column triggers a search, which returns an error cause
the search query is incorrect (operator and value not selected yet)
- when typing the search value (after selecting the column + operator),
the search triggers on debounce, which feels odd in this context as I'd
expect the search to only trigger when i've hit enter (e.g to "finalize"
my search parameters)
- Am adding an `onApply` parameter gets called when a filter is
"complete" -> column, operator, and value are finalized (e.g via Enter
or onBlur)
- Updated both Unified logs and table editor to use this behaviour
### Automatically select operator if only one exists in `FilterBar`
This one's more specific to unified logs since there's only an `=`
operator - but saves an unnecessary "enter" key event when filtering in
unified logs
### Known issues
- For some reason (even with the existing filter bar) - searching
against status for e.g for postgres logs doesnt return the expected
rows. e.g i've got rows with status as `00000`, but searching for
`00000` doesnt return anything. Suspect its something to do with the SQL
we're firing?
<img width="1167" height="271" alt="image"
src="https://github.com/user-attachments/assets/1dde74cf-8366-4cf1-8d8f-6907ba2473f6"
/>
<img width="1184" height="453" alt="image"
src="https://github.com/user-attachments/assets/bf55f0fb-cb27-4e8f-b2d9-cd913d6ac6b9"
/>
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* Added a dedicated Logs filter bar with an explicit "apply"/commit
callback for filter UI.
* **Bug Fixes**
* Filter edits are buffered locally and only committed on apply to
prevent aggressive data requests.
* **Refactor**
* Replaced legacy command-style table filter UI and removed related
utilities.
* Updated filter commit lifecycle and narrowed option value typing;
adjusted top-level provider ordering.
* **Style**
* Small layout and trigger behavior tweaks for filter controls, timeline
chart spacing, and download button.
<!-- review_stack_entry_start -->
[](https://app.coderabbit.ai/change-stack/supabase/supabase/pull/46071?utm_source=github_walkthrough&utm_medium=github&utm_campaign=change_stack)
<!-- review_stack_entry_end -->
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
---------
Co-authored-by: Gildas Garcia <1122076+djhi@users.noreply.github.com>
## Problem
The `_Shadcn_` suffix isn't needed anymore on `Select` components
## Solution
Remove it. No other changes
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Refactor**
* Updated internal component architecture to standardize and simplify
the codebase. These changes improve code maintainability and consistency
across the application without affecting existing functionality or user
experience.
<!-- review_stack_entry_start -->
[](https://app.coderabbit.ai/change-stack/supabase/supabase/pull/45988)
<!-- review_stack_entry_end -->
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
- Most changes are related to either types or `useRef` usages (it now
requires an initial value).
- also updated `vaul` to its latest version and haven't noticed any
change ([design-system
demo](https://design-system-git-react-19-supabase.vercel.app/design-system/docs/components/drawer))
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* Upgraded workspace to React 19.
* **Bug Fixes**
* Improved null-safety and ref handling across editors, UI components,
shortcuts, and markdown/image rendering to reduce runtime errors.
* Safer event/timeout/interval cleanup and more robust command/context
handling.
* **Chores**
* Bumped vaul dependency versions.
* **Documentation**
* Type and TypeScript accuracy improvements for clearer developer
feedback.
<!-- review_stack_entry_start -->
[](https://app.coderabbit.ai/change-stack/supabase/supabase/pull/45886)
<!-- review_stack_entry_end -->
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## Problem
The `_Shadcn_` suffix isn't needed anymore on label component
## Solution
Remove it. No other changes
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Refactor**
* Standardized Label usage across the codebase by removing the legacy
alias and using the direct Label export from the UI package
consistently.
* **Documentation**
* Updated component examples and docs to use the standardized Label
component in usage snippets and demos.
<!-- review_stack_entry_start -->
[](https://app.coderabbit.ai/change-stack/supabase/supabase/pull/45986)
<!-- review_stack_entry_end -->
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## Problem
We have multiple Popover components
## Solution
- [x] migrate Popover usages to Shadcn components
- Migrated JSON and text editor in the `TableEditor` (inline row
edition)
- Migrated the template popover in the logs explorer templates page
- [x] remove `_Shadcn_` suffix from Popover components (renaming +
prettier)
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Refactor**
* Unified popover implementation across the app and design system;
dropdowns, calendars, menus and tooltips now use a consistent popover
API with no visual or interaction changes.
* **Chores**
* Minor prop typing update for the logs date-picker to align with the
consolidated popover content type.
<!-- review_stack_entry_start -->
[](https://app.coderabbit.ai/change-stack/supabase/supabase/pull/45980)
<!-- review_stack_entry_end -->
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## What kind of change does this PR introduce?
Docs update and design-system component taxonomy cleanup
## What is the current behavior?
The design-system docs conflate low-level shadcn primitives with
product-level alert patterns. Collapsible documentation previews the
alert-specific wrapper, and the alert/collapsible relationship is
unclear
## What is the new behavior?
- Documents Alert and Collapsible as low-level atom components
- Moves the alert-styled expandable wrapper into
`ui-patterns/expandable-alert` as `ExpandableAlert`
- Documents Expandable Alert as a Fragment Component next to Admonition
- Updates the Session Timeout modal to import `ExpandableAlert` from
`ui-patterns/expandable-alert`
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* `CollapsibleAlert` component is now available for alert-styled
expandable content.
* **Documentation**
* Updated component documentation to clarify when to use `Alert`,
`Collapsible`, `Admonition`, and `CollapsibleAlert`.
* Added comprehensive documentation for `CollapsibleAlert` with usage
examples and variant options.
<!-- review_stack_entry_start -->
[](https://app.coderabbit.ai/change-stack/supabase/supabase/pull/45863)
<!-- review_stack_entry_end -->
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
---------
Co-authored-by: Gildas Garcia <1122076+djhi@users.noreply.github.com>
This PR migrates the JS config for Tailwind into a CSS config. As such,
all variables have been defined as CSS variables and they're using the
specialized Tailwind syntax for generating utility classes.
Beside the migration, these changes were also added:
- Added `tailwind.config.css` to few packages to make the Tailwind
Intellisense work.
- Migrated away from Radix style color classes to our defined classes,
the values will remain the same.
- Most of the CSS is generated by scripts, they'll be removed in next
PRs.
* Removed redundant `border-light` classes from several components since
it was undefined.
* Removed redundant `text-strong` classes from several components since
it was undefined.
How to test:
- Open all apps, compare the UI (mainly colors) to builds from #45417
and try to find a difference.
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Style**
* Harmonized color variable usages and updated UI color references
(affects palettes, charts, gradients, hero illustrations, and
scrollbars).
* Tweaked border, tab, and selection visuals across components.
* **New Features**
* Added a suite of theme animations and refined typography presets used
by site prose and docs.
* **Refactor**
* Overhauled Tailwind/theme configuration and color token generation for
more consistent theming.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## Problem
We have multiple `Collapsible` components.
## Solution
Reduce their number by using only the one from shadcn.
I haven't noticed any visual nor functional changes.
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Refactor**
* Migrated expandable/collapsible UI to a unified shadcn-based
implementation for more consistent expand/collapse behavior across the
app.
* **Style**
* Updated listbox check icon sizing and removed obsolete collapsible
open/close animations.
* **Chores**
* Removed deprecated collapsible variants and consolidated UI component
surface for simpler maintenance.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## What kind of change does this PR introduce?
Feature and design-system update. Resolves DEPR-551.
This is a narrower redo of #45302 after the revert in #45535.
## What is the current behaviour?
The reverted implementation made Admonition more flexible, but it also
changed Studio callsites, touched shared Alert styling, renamed the
design-system Tailwind config, and changed Docs-facing content/API
assumptions in a way that broke production docs static generation.
## What is the new behaviour?
Admonition now supports description-only content, children-only content,
optional `title`, legacy `label`, and `type="success"` without touching
`apps/docs/content/**` or shared Alert styling.
`title` wins over `label` when both are provided. The runtime component
props stay backwards-compatible for existing MDX and Studio usage, while
`AdmonitionStrictProps` captures the stricter new-usage contract for
tests and future callsites.
The design-system docs and registry include description-only and success
examples, and the Admonition tests cover the rendering paths that broke
production previously.
| After |
| --- |
| <img width="1668" height="1768" alt="CleanShot 2026-05-06 at 17 35
13@2x"
src="https://github.com/user-attachments/assets/1c00ea7f-e3ca-45eb-8af9-3536b657c341"
/> |
## Additional context
These things that were in #45302 have been left out (unless checked):
- [ ] Studio callsite rewrites from title/label to description
- [ ] Shared Alert text-colour changes
- [ ] Design-system Tailwind config rename
- [ ] Design-system global CSS changes
- [ ] Any docs content migration or label deprecation
- [ ] Any production docs workaround
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* Added success admonition variant with dedicated styling and icon.
* Introduced description-only admonition example.
* **Documentation**
* Expanded admonition guidance on title vs description usage and best
practices.
* Added example sections showcasing description-only and success
variants.
* **Tests**
* Added comprehensive tests covering admonition variants and
rendering/precedence behavior.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## Problem
The dashboard renders all timestamps in the browser's local timezone.
When debugging app issues, users often want to see logs and timestamps
in a different timezone (e.g. their app's deployment region) without
changing their OS clock.
## Fix
- New Timezone submenu in the user-avatar dropdown, sitting next to the
existing Theme picker. Search-as-you-type combobox over the full IANA
catalog plus an Auto detect option.
- Selection persists in localStorage (`supabase-ui-timezone`) and
survives `clearLocalStorage()`. No backend schema change.
- New `lib/datetime.tsx` exposes pure timezone-aware formatters
(`formatDateTime`, `formatDate`, `formatTime`, `formatFromNow`,
`toTimezone`) plus a `TimezoneProvider` and matching React hooks
(`useTimezone`, `useFormatDateTime`, ...). The pure functions take `tz`
explicitly so they're easy to unit test (17 vitest cases covering DST
transitions, multi-tz formatting, unix-micro/Date inputs, invalid-tz
fallback).
- The selected timezone propagates to every existing `<TimestampInfo>`
in Studio via a new `TimestampInfoProvider` context exported from
`ui-patterns`. No per-callsite changes needed for those ~20+ surfaces.
- The `UnifiedLogs` date column migrates off `date-fns` to the new
`useFormatDateTime` hook (the rest of the date-fns callers stay as-is,
since they're either internal range math or non-display).
- `ALL_TIMEZONES` (~600 entries) moves out of `PITR.constants.ts` into a
shared `lib/constants/timezones.ts`. PITR keeps a re-export shim so its
callers don't move. New `TIMEZONES_BY_IANA` dedupes the catalog by
primary IANA name (the original list contains both PDT and PST rows for
`America/Los_Angeles`, etc.) and `findTimezoneByIana` provides reverse
lookup.
- Telemetry: `timezone_picker_clicked` PostHog event with
`previousTimezone`, `nextTimezone`, `isAutoDetected` properties.
Notes for reviewers:
- Bare `dayjs(x).format(...)` calls (~157 files) intentionally still
render in browser-local time. Surfaces opt in by switching to the new
wrappers, so this PR is the abstraction plus logs adoption; broader
migration is a follow-up.
- Two `// prettier-ignore` lines (`apps/studio/pages/_app.tsx`,
`apps/studio/components/interfaces/UnifiedLogs/UnifiedLogs.fields.tsx`)
work around a pre-existing local-tooling issue where
`prettier-plugin-sql-cst` strips angle-bracket type arguments under
certain conditions. Project's pinned prettier (3.8.1) does not strip;
the issue surfaces with a globally-installed prettier. Worth tracking
separately.
- Hydration: `guessLocalTimezone()` and `useLocalStorageQuery` are
client-only. Studio is mostly CSR via the Pages Router, but any SSR'd
`<TimestampInfo>` may briefly render in the server's tz before client
hydration. Existing behavior already had this mismatch with `.local()`;
this PR does not regress it.
- Backend timestamps round-tripped through query params and mutations
stay UTC. The picker is display-only.
## How to test
- Run `pnpm dev:studio`, sign in.
- Open the user avatar dropdown (top right). Hover Timezone.
- Search for "tokyo", pick `(UTC+09:00) Osaka, Sapporo, Tokyo`.
- Open any project, navigate to Logs (e.g. `Project > Logs > Edge
Functions`). Hover a log row's timestamp; the popover should show UTC,
the chosen tz (`Asia/Tokyo`), and the relative time. Visible cell text
should be in JST.
- Visit any page that uses `<TimestampInfo>` (Database > Backups,
Project Pause state, Edge Function details). Same tooltip should reflect
Asia/Tokyo.
- Refresh the page; timezone is still Asia/Tokyo.
- Reopen the picker, choose Auto detect; timestamps revert to browser
local.
- Run `pnpm --filter studio test lib/datetime.test.ts`. 17 tests should
pass.
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* Timezone selector added to the user menu with auto-detect and manual
override
* App-wide timezone provider and hooks plus a shared timezone catalog
for consistent timezone-aware display
* Timestamp components accept an optional timezone prop and respect user
preference (persisted)
* **Bug Fixes / Improvements**
* Logs and timestamp displays now use the new timezone formatting hooks
* **Tests**
* Added comprehensive datetime and timezone catalog tests
* **Telemetry**
* Telemetry event added for timezone picker interactions
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## Consolidate Table Editor grid header actions into a single row
https://github.com/user-attachments/assets/1020c385-8fa9-4ef1-b5e7-03983111508b
## Changes involved
- Index advisor, Realtime, and API docs are now behind a dropdown menu
button (Treated as secondary actions)
- Grid header actions shifted into the same row as filter bar (more
space for data grid)
- Header actions will hide while filter bar is in focus (remove
distractions, more space for filter bar)
## Changes to filter bar
- Filter bar will refocus when deleting a filter
- Clicking on the search icon will focus on the free form input of the
filter bar
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* Added a “More” dropdown in grid actions to access Realtime, API docs,
and Index Advisor.
* New dialogs for enabling Index Advisor and toggling Realtime are now
consistently managed.
* **Improvements**
* Improved filter focus handling with auto-refocus when conditions
change and responsive header behavior.
* Adjusted popover alignment, separator visuals,
header/footer/pagination layout and sizing.
* Filter bar now supports programmatic focus; Connect button supports
icon-only mode.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
---------
Co-authored-by: Gildas Garcia <1122076+djhi@users.noreply.github.com>
This PR fixes a bug where a user might choose `classic-dark` as a theme
in `studio` but then `docs` and `marketing` apps will look weird.
To test:
- Change the localStorage value of `theme` to `classic-dark`
- Open `www` and `docs` apps, they should look ok
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* Added a new "classic-dark" theme option for enhanced visual
customization.
* **Improvements**
* Unified and simplified theme handling across apps for more consistent
behavior.
* Improved system-theme detection and smoother transitions when
switching themes.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
- closes https://github.com/supabase/supabase/issues/45266
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
## Release Notes
* **Bug Fixes**
* Updated the formatting of MCP URLs in generated Codex setup commands
to include proper quotation marks for correct CLI execution.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## Context
Realised that MultiSelector's content is not scrollable when rendered
within a sheet (e.g Auth policies, Database indexes)
### Explanation from Claude:
- The issue is that Radix Dialog (Sheet) adds
@radix-ui/react-remove-scroll which intercepts wheel events. The Popover
portal renders outside the Sheet's DOM tree, so the scroll lock blocks
wheel events on CommandList.
- The fix is to stop wheel event propagation on the CommandList so it
doesn't reach the RemoveScroll handler.
### To test
- [ ] Verify that MultiSelector can be scrollable within a sheet (e.g
Auth policies roles) and outside of a sheet (e.g Data API -> Exposed
schemas)
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Bug Fixes**
* Fixed scroll wheel propagation in multi-select dropdown to prevent
unintended scrolling of parent elements.
* **Updates**
* Simplified filter component interface by removing an unused
configuration property.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## Summary
- Adds Claude.ai and ChatGPT as MCP connectors in the existing
`/guides/getting-started/mcp` dropdown
<img width="1511" height="744" alt="Screenshot 2026-05-04 at 14 53 24"
src="https://github.com/user-attachments/assets/8de5b3a4-56e2-45a7-bcce-1051baac30cd"
/>
- Groups all MCP clients into three categories: **Web Clients**
(Claude.ai, ChatGPT, Goose), **AI Agent CLIs** (Claude Code, Codex,
Gemini CLI, Opencode, Factory), **IDE** (Cursor, VS Code, Antigravity,
Kiro, Windsurf)
<img width="1511" height="744" alt="image"
src="https://github.com/user-attachments/assets/eb3ecdaa-878a-4f87-abfe-41a9144db5b8"
/>
- Both connectors use `generateDeepLink` to render a one-click "Connect"
button linking to the Supabase connector directory entry
- Includes external docs links for each connector
- Sets Claude Code as the default selected client
Closes
[AI-699](https://linear.app/supabase/issue/AI-699/add-claudeai-and-chatgpt-connectors-to-mcp-docs)
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* Added Claude.ai and ChatGPT as selectable client options.
* Reorganized the client selector into categorized groups (AI Agent CLI,
Web Clients, IDE) for easier discovery.
* Improved dropdown rendering and selection behavior for more consistent
visuals and interaction.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
---------
Co-authored-by: Claude Sonnet 4.6 <noreply@anthropic.com>
## What kind of change does this PR introduce?
Feature and design-system cleanup. Resolves DEPR-551.
## What is the current behavior?
Admonition supports several overlapping content shapes, but it
previously did not support a first-class success state or
description-only usage cleanly. Title-only usage was also possible,
which made some callouts read like floating headings without body copy.
Docs MDX Admonitions could also pick up prose spacing around rich
children, while the design-system Tailwind config emitted an
ESM/CommonJS warning in the design-system app.
## What is the new behavior?
Adds a `success` Admonition type, description-only support, and a
stricter content contract: `title` or legacy `label` now requires either
`description` or `children`. Existing title-only Studio callsites have
been converted to description-only callouts.
The design-system docs now include examples for description-only and
success Admonitions, plus guidance for `title`, `description`,
`children`, and legacy `label` usage.
This also tightens Admonition body spacing so rich MDX children keep
docs link/code styling without inheriting excessive prose margins, and
renames the design-system Tailwind config to `tailwind.config.cjs` so it
matches its CommonJS syntax.
Warning and destructive alerts now explicitly set `text-foreground`,
preventing nested Admonition titles from inheriting muted
form-description colour after the Tailwind v4 cascade changes.
| Before | After |
| --- | --- |
| <img width="1818" height="388" alt="Image"
src="https://github.com/user-attachments/assets/283a1853-348a-4d74-a408-013957350e5e"
/> | <img width="1380" height="462" alt="Image"
src="https://github.com/user-attachments/assets/e5761e8e-3697-423b-805b-45110205099a"
/> |
| <img width="1398" height="550" alt="CleanShot 2026-04-28 at 15 12
41@2x"
src="https://github.com/user-attachments/assets/982694d9-5461-4362-8bae-a6e2b4c60e8b"
/> | <img width="1402" height="450" alt="CleanShot 2026-04-28 at 15 13
09@2x"
src="https://github.com/user-attachments/assets/0b1257c4-6b58-4c39-a182-4861a9e378ee"
/> |
| <img width="1640" height="716" alt="CleanShot 2026-04-28 at 15 17
25@2x"
src="https://github.com/user-attachments/assets/a5be4d5f-2bf7-4dc2-b396-56129fe64ec9"
/> | <img width="1630" height="716" alt="CleanShot 2026-04-28 at 15 16
00@2x"
src="https://github.com/user-attachments/assets/0d589252-aaf8-4efc-9d81-15ec4f99ec61"
/> |
| Design System Docs |
| --- |
| <img width="1646" height="1864" alt="CleanShot 2026-04-28 at 14 59
15@2x"
src="https://github.com/user-attachments/assets/12d13595-8972-4fb2-a04a-fb916388ebb6"
/> |
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* Added a "success" admonition variant and new example previews
demonstrating success and description-only usages.
* **Documentation**
* Clarified admonition guidance: when to use title vs description vs
children; added example sections for short callouts and success
messages.
* **Refactor**
* Standardized UI by moving short/advisory text into description across
the app and harmonized trailing punctuation.
* **Style**
* Ensured warning/destructive admonitions use consistent foreground text
styling.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## Context
As per PR title - saw that there's a `md:min-w-100` on `FlexContainer`
which overrides `md:w-1/2`. Removing the former resolves this
<img width="622" height="188" alt="image"
src="https://github.com/user-attachments/assets/6414d546-7c27-4a3c-9fd9-83da89acc387"
/>
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Style**
* Improved form layout responsiveness on medium-sized screens by
adjusting width constraints for better flexibility.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
The format of some Tailwind classes changed from `px-[--card-padding-x]`
to `px-(--card-padding-x)`. Because `tailwind-merge` is on a older
version (pre Tailwind v4), it doesn't deduplicate the class when it
encounters
```
px-(--card-padding-x) p-0
```
With the new version, it should result in `p-0`.
By bumping `tailwind-merge` and other `cn` related deps, the `cn` util
function is aware of the new class format.
Before:
<img width="819" height="357" alt="Screenshot 2026-04-30 at 15 27 39"
src="https://github.com/user-attachments/assets/6d16497a-86a6-4a31-bc7c-eab17bb17ab3"
/>
After:
<img width="837" height="389" alt="Screenshot 2026-04-30 at 15 28 04"
src="https://github.com/user-attachments/assets/2b53d7fe-2a61-493a-9aa0-abb34007738f"
/>
Danny White
