mirror of
https://github.com/supabase/supabase.git
synced 2026-10-05 09:25:06 +03:00
bot/decrease-eslint-ratchet-baselines
20
Commits
| Author | SHA1 | Message | Date | |
|---|---|---|---|---|
 Miranda LimonczenkoandClaude Opus 5
|
60f7903b52 |
fix(www): group the filter controls and announce the result count (#49410)
Closes FE-4251 ## Problem The filter sidebars are unstructured `div` nesting. Measured on a preview: * 9 checkboxes on `/features` and 13 on `/partners/catalog`, none inside a `fieldset`, a `role="group"`, or any region. * The `/features` "Filter by tags:" `h2` has no `id`, so nothing can reference it as a group name. * The only landmarks on `/features` are two `nav` elements, so the filter panel is unreachable by landmark navigation. A screen reader user meets a checkbox announced as "authentication, checkbox" with nothing conveying that it filters features by tag. Separately, both result counts update on every filter change with no live region, so the outcome of toggling a filter is never announced. ## Solution * Wrap each checkbox set in a labelled `role="group"`. * Wrap each filter panel in an `aside` labelled "Filters". * Add `aria-live="polite"` to both result counts. The two pages name their group differently on purpose. `/features` uses `aria-labelledby` pointing at the existing `h2`, so the visible heading is the accessible name. `/partners/catalog` uses `aria-label`, because `filtersPanel` renders into both the desktop sidebar and the mobile sheet, so an `id` would appear twice in the DOM. That file already calls out the duplicate-id hazard at line 152 as its reason for using wrapping labels. Chose `role="group"` over `fieldset` and `legend` to avoid resetting UA styling in a styled sidebar. The single self-hosted checkbox keeps its own label and needs no group. ## Manual testing **/features** 1. Open [/features](https://zone-www-dot-com-git-www-filter-groups-and-live-count-supabase.vercel.app/features) with Screenreader. 2. Confirm the tag checkboxes report as a group named "Filter by tags:". 3. Confirm a "Filters" landmark appears in landmark navigation. 4. Tick a tag filter. The result count changes and is announced. **/partners/catalog** 5. Open [/partners/catalog](https://zone-www-dot-com-git-www-filter-groups-and-live-count-supabase.vercel.app/partners/catalog) at a desktop width. The filter panel is `hidden md:block`, so the landmark only exists at md and above. 6. Confirm the category checkboxes report as a group named "Categories". 7. Open the mobile filter sheet at a narrow width and confirm the group is still named, with no duplicate ids. <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Accessibility Improvements** * Improved screen reader navigation for partner catalog and feature filters. * Added accessible labels and landmarks for filter sections. * Updated result counts to be announced when selections change. <!-- end of auto-generated comment: release notes by coderabbit.ai --> Co-authored-by: Claude Opus 5 <noreply@anthropic.com> |
||
|
Miranda LimonczenkoandClaude Opus 5
|
78d6d57faa |
fix(www): stop rendering the invisible Clear all filters button (#49409)
Closes FE-4250 <img width="661" height="294" alt="Screenshot 2026-08-21 at 10 44 38 AM" src="https://github.com/user-attachments/assets/db7e09db-845c-43a8-a6ca-5d0c67436355" /> ## Problem With no filters active, `/features` still rendered the "Clear all filters" button and hid it with `opacity-0`. Found with VoiceOver, which announced "You are currently on a button" on an apparently empty control. Measured on a preview with no filters active: | Property | Value | | -- | -- | | `opacity` | `0` | | `visibility` | `visible` | | `display` | `block` | | `tabIndex` | `-1` | | `aria-hidden`, `inert`, `disabled` | none | | `pointer-events` | `auto` | | Layout | 256 x 26px | Two assumptions were wrong. `opacity: 0` does not remove an element from the accessibility tree, and `tabIndex="-1"` only removes it from tab order, not the tree. Screen readers walk the tree. It was also a live 256 x 26 mouse target, so a sighted user could click an invisible button. ## Solution Render it conditionally, matching `IntegrationsContent.tsx` which already does this and was unaffected. No layout shift. The button is the last child of the sidebar column, so nothing above it moves when it appears. ## Manual testing 1. Open [/features](https://zone-www-dot-com-git-www-features-clear-filters-button-supabase.vercel.app/features) with no filters applied. Confirm no "Clear all filters" button exists anywhere in the DOM. 2. Tick a tag filter in the left sidebar. The button appears. 3. Click it. Every filter clears, the count returns to 79 features, and the button disappears again. For the before state, open [/features on production](https://supabase.com/features) with no filters, then run this in the console. It reveals the button that is present but invisible: ```js const b = [...document.querySelectorAll('button')].find(x => /Clear all filters/.test(x.textContent)) Object.assign(b.style, { opacity: '1', outline: '3px solid red' }) ``` <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Bug Fixes** * The “Clear all filters” button now appears only when filters are active. * Improved keyboard navigation by removing inactive filter controls from the tab order. <!-- end of auto-generated comment: release notes by coderabbit.ai --> Co-authored-by: Claude Opus 5 <noreply@anthropic.com> |
||
|
Miranda LimonczenkoandClaude Opus 5
|
0243ad7cf1 |
fix(www): make the view toggles a radio group and fix the filter rows (#49346)
Closes FE-4227 > [!NOTE] > Bottom of a stack. #49409 and #49410 sit on top of this one, so merge this first. ## Problem Five defects in the view toggles on `/features` and `/partners/catalog`, plus one in the `/features` filter rows. All measured on a preview. **Toggles** | Defect | Evidence | | -- | -- | | No pointer cursor | Tailwind 4 Preflight no longer sets `cursor: pointer` on buttons. 14 of 19 buttons on `/features` computed to `default`. Anchors were unaffected, which is why it looked inconsistent rather than total. | | The selected toggle offered a pointer | It is a no-op, so the cursor promised an action that does nothing. | | The selected state was invisible in light mode | `bg-surface-300` and `bg-surface-75` both resolve to pure white. Contrast ratio exactly 1.000. The light theme base lightness is `.995` and each surface step adds `.024`, so every lighter step clamps at white. The only cue left was icon colour. | | Hover inverted the selection | Unselected hover is `bg-surface-200`, a 2.7% black overlay, while the selected state was white. Hovering the wrong button made it look selected. | | No grouping | Two unrelated buttons. Nothing conveyed one choice with two options, and the selected view was not programmatically determinable at all. | **Filter rows on /features** A pointer appeared only on the narrow gap between each checkbox and its label: | Element | Computed cursor | | -- | -- | | wrapper `div` | `pointer` | | `label` | `default` | | checkbox | `default` | `cursor-pointer!` sat on the wrapper. A declaration targeting an element always beats an inherited value, so `!important` on the parent changed nothing and both children overrode it. ## Solution **Toggles become a `ToggleGroup`** on both pages, replacing the raw button pairs. * `type="single"` renders `role="group"` with `role="radio"` and `aria-checked` per item. That describes one choice with two options rather than two independent toggles, so a screen reader announces the selection and its position in the set. * Each group gets an `aria-label`, which the existing `ToggleGroup` usage on `/pricing` lacks. * Selected item gets `cursor-default`, unselected gets `cursor-pointer`. * Selected background becomes `bg-surface-400`, a 5.4% overlay that clears the 2.7% unselected hover and removes the inversion. **Filter rows** become wrapping `label` elements with `cursor-pointer` directly on the label, matching `IntegrationsContent.tsx`. The whole row becomes a click target, and `id` values derived from raw product names go away. `toggleVariants` sets the selected background to `bg-surface-300` under both `data-[state=on]:` and `aria-checked:`, and twMerge only dedupes matching prefixes. Both are overridden here so adopting the primitive does not reintroduce the invisible state this PR fixes. The primitive defect is FE-4245. ### Behaviour change The toggle pair is now a single tab stop navigated with arrow keys, rather than two separate tab stops. That is correct for a mutually exclusive group, but it is a change from current behaviour. ### Related, deliberately not here | Work | Where | | -- | -- | | Checkbox primitive pointer cursor | #49408, so the shared-package change is reviewed separately. The checkbox itself still shows an arrow on this branch. | | Naming these toggles, which rely on `title` | FE-4229 | | Base-layer cursor fix across www, Docs and Studio | FE-4228 | | Sharing one component between the two pages | FE-4244 | ## Manual testing 1. Open [/features](https://zone-www-dot-com-git-www-view-toggle-pointer-cursor-supabase.vercel.app/features) in light mode. The selected toggle is visibly darker than the unselected one. 2. Hover the selected toggle. The cursor is an arrow. Hover the unselected one. It is a pointer, and it does not become darker than the selected one. 3. Tab to the toggle pair. It takes one tab stop. Move between options with the arrow keys. 4. Inspect either toggle. It has `role="radio"` with `aria-checked` tracking the selection, and the wrapping group has an `aria-label`. 5. Hover a tag filter row over the label text and over the gap between the checkbox and the text. Both show a pointer. The checkbox itself still shows an arrow here; that is #49408. 6. Click a filter row well away from the checkbox. The filter toggles. 7. Repeat steps 1 to 4 on [/partners/catalog](https://zone-www-dot-com-git-www-view-toggle-pointer-cursor-supabase.vercel.app/partners/catalog). --------- Co-authored-by: Claude Opus 5 <noreply@anthropic.com> |
||
|
Miranda LimonczenkoandClaude Opus 5
|
c79d7be7d9 |
fix(www): give the feature and partner card grids list semantics (#49411)
Closes FE-4252 ## Problem `/features` renders 79 feature cards as bare `Link` elements in a grid `div`. Measured on a preview, `main` contains zero `ul`, `ol`, `li`, and zero `role="list"`. `/partners/catalog` is the same. A screen reader user gets a run of loose links with no "list, 79 items", no set size, and no way to navigate by list. Sighted users see an obvious grid of cards, and the structure conveying that is purely visual. Same defect class as FE-4101 and DOCS-1279, both already in this milestone. ## Solution Make each card container a `ul` with one `li` per card. Four containers: | File | Container | | -- | -- | | `apps/www/pages/features.tsx` | feature card grid | | `apps/www/app/partners/catalog/IntegrationsContent.tsx` | featured partners grid | | same | grid view | | same | list view | This change makes a Screenreader announce the number of items and track them. Most of this diff is re-indentation from the added wrapper. ## Manual testing **/features** 1. Open [/features](https://zone-www-dot-com-git-www-card-grid-list-semantics-supabase.vercel.app/features) with Screenreader. Confirm the cards report as a list of 79 items, and that the count tracks the filters. 2. Check the grid at mobile, tablet and desktop widths. Cards stay equal height within a row and the column counts are unchanged. **/partners/catalog** 3. Open [/partners/catalog](https://zone-www-dot-com-git-www-card-grid-list-semantics-supabase.vercel.app/partners/catalog) in grid view with Screenreader. Confirm both the featured section and the main grid are lists. 4. Switch to [list view](https://zone-www-dot-com-git-www-card-grid-list-semantics-supabase.vercel.app/partners/catalog?view=list). Confirm it is a list and the dividing lines between rows are unchanged. Compare any of these against [production](https://supabase.com/features). The rendering should be identical; only the markup changes. <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Accessibility** * Improved semantic structure for partner catalog and feature cards using properly organized lists. * Expanded card links to make larger portions of featured and grid cards clickable. * Preserved existing layouts, content, and filtering behavior. <!-- end of auto-generated comment: release notes by coderabbit.ai --> Co-authored-by: Claude Opus 5 <noreply@anthropic.com> |
||
|
Danny White
|
3bca21b3f8 |
chore(a11y): convert leftover focus recipes to focus-ring (#48219)
## What kind of change does this PR introduce? Accessibility cleanup (DEPR-628). ## What is the current behavior? Leftover call sites still use ad-hoc focus recipes (`ring-foreground-muted`, `outline-brand`, Dialog/Sheet `focus:` rings, etc.) instead of the shared utilities from #41575. ## What is the new behavior? Converts those leftovers across `packages/ui`, Studio, www, docs, and design-system to `focus-ring`, preferring `focus-visible`. Keeps documented exceptions (`group-focus-visible`, InputGroup `:has()`). ## To test Tab through controls (keyboard only). Expect a consistent offset ring on `:focus-visible`, not a green/brand/custom stack, and no ring animation. ### www (marketing) Preview: https://zone-www-dot-com-git-danny-depr-628-focus-ring-fbccf9-supabase.vercel.app - Global nav on `/`: Product, Developers, Solutions dropdowns; logo; hamburger + mobile menu - `/features`: view toggles and feature cards - `/company`: card links - `/changelog`: timeline / entry links - `/partners/catalog`: grid/list toggle and partner cards - `/pricing`: compute section expand control - Product / Modules / Solutions sticky navs on product pages (e.g. `/database`, `/storage`) - `/state-of-startups`: TwoOptionToggle if present ### docs Preview: https://docs-git-danny-depr-628-focus-ring-long-tail-supabase.vercel.app - Any guide page: top nav dropdowns and items - Narrow viewport: hamburger, then mobile menu links + close - Guide with PromptPanel / tabs: tab to prompt actions and tab list ### studio (dashboard) Preview: https://studio-staging-git-danny-depr-628-focus-ring-long-tail-supabase.vercel.app - Project home: Connect section tiles; drag-handle focus on sortable sections - Integrations marketplace (`/project/<ref>/integrations`): featured cards, list/grid toggle, list rows - Auth (`/project/<ref>/auth/oauth-apps`, `/project/<ref>/auth/providers`): open create/edit sheet, tab to close (X) - Database policies (`/project/<ref>/database/policies`): open policy editor sheet, tab to close - Storage policies (`/project/<ref>/storage/files/policies`): bucket section links; policy modal close - Query performance (`/project/<ref>/observability/query-performance`): info icon buttons on metrics - Replication pipeline detail (if available): slot lag / status info icons - Support (`/support/new`): attachment add/remove controls - Table editor: spreadsheet import preview checkboxes; row text/JSON editor TwoOptionToggle - Any Dialog/Sheet/toast close (X): ring on keyboard focus only, not mouse click ### design-system Preview: https://design-system-git-danny-depr-628-focus-ring-long-tail-supabase.vercel.app - Colour palette swatches (keyboard focus) - Form patterns sidepanel example: avatar / focusable control in the example ## Additional context - Linear: [DEPR-628](https://linear.app/supabase/issue/DEPR-628) - Follow-ups: form-group CSS (DEPR-629), Storage columns selection (DEPR-630), ESLint rule (DEPR-632) <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Accessibility & Usability** * Standardized keyboard focus indicators across navigation, dialogs, forms, buttons, toggles, links, and tooltips using a consolidated focus style. * Improved toggle controls to use proper button semantics (instead of clickable text), including `aria-pressed`/disabled handling and better keyboard navigation. * **Visual Updates** * Harmonized hover/focus ring visuals across the design system, Studio, documentation, and marketing pages while preserving existing layout and interaction behavior. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
Danny White
|
6f6badae51 |
fix(eslint): promote require-explicit-tabindex to error (#48170)
## What kind of change does this PR introduce? Accessibility / lint hardening (Safari keyboard focus). ## What is the current behavior? `supabase/require-explicit-tabindex` is `'warn'`. Studio’s ratchet was at 0 but the rule was still ratcheted; www / docs / design-system still had raw `<button>` / `role="button"` call sites without an explicit `tabIndex`. [DEPR-627](https://linear.app/supabase/issue/DEPR-627) · follow-up to #47984 / #48040 ## What is the new behavior? - Shared config: `'supabase/require-explicit-tabindex': 'error'` - Swept www / docs / design-system (+ Studio test fixtures the ratchet skipped) - Removed the rule from the Studio ratchet + baselines ## To test Prefer **Safari**. This PR only adds explicit `tabIndex` to raw `<button>` / `role="button"` call sites — not links, and not controls that already go through `Button` from `ui`. ### Marketing (`www`) ([staging link](https://zone-www-dot-com-git-danny-depr-627-promote-req-7ae43c-supabase.vercel.app/)) - [x] Homepage frameworks / dashboard feature tabs — Tab through each tab button - [x] Product pages (e.g. `/auth`, `/database`) — section tab switchers - [x] Narrow viewport — open the hamburger; Tab through menu buttons - [x] `/partners/catalog` — filter / view controls - [x] Blog view toggle (list ↔ grid) ### Docs ([staging link](https://docs-git-danny-depr-627-promote-require-explici-25e46d-supabase.vercel.app/)) - [x] **Desktop (≥ lg):** top-right **⋯ menu** (hamburger icon) — opens a dropdown that includes Theme. Not a separate theme button. - [x] **Mobile (< lg):** top-right **hamburger** opens the sheet; close (X) is the raw button we tagged. Theme inside the sheet uses `ThemeToggle` / `DropdownMenuTrigger` from `ui` (already supposed to set `tabIndex`). - [x] **Code blocks** — copy / language controls - [x] **Is this helpful?** — X / check are `Button` from `ui` (should already Tab). After voting **while signed in**, the follow-up “What went well?” / “How can we improve?” text button is the raw one we tagged. - [x] **AI Tools → Copy as Markdown** (right rail on a guide) — this is the only GuidesSidebar control this PR changed. “On this page” TOC items are **links**, not covered by this lint. - [x] **Reference docs** (e.g. JS client reference) — section headers that expand/collapse in the left nav (`Collapsible.Trigger`) - [x] **Troubleshooting index** — type in the search field, then Tab to the **clear (X)** control ### Dashboard (`studio`) No production UI changes in this PR (tests + lint config only). Quick Safari smoke that prior tabindex work still holds: - [x] Project sidebar — Tab through primary nav links - [x] Settings → General — Tab through inputs / buttons - [x] Storage → Files — Tab a bucket row / file actions |
||
|
Francesco Sansalvadore
|
c914163a06 |
Improve features search with relevance-based ranking (#48039)
## I have read the [CONTRIBUTING.md](https://github.com/supabase/supabase/blob/master/CONTRIBUTING.md) file. YES ## What kind of change does this PR introduce? Feature enhancement ## What is the current behavior? The features page filters search results by simple substring matching, treating all matches equally. Features are then sorted alphabetically regardless of search relevance. ## What is the new behavior? Search results are now ranked by relevance using a weighted scoring system: - Title matches starting with the search term score highest (5 points) - Title substring matches score 4 points - Subtitle matches score 2 points - Description matches score 1 point Results are sorted by relevance score (highest first), with alphabetical ordering as a tiebreaker. This ensures users see the most relevant features first when searching. ## Additional context The implementation adds: - `SEARCH_WEIGHT` constant defining the relevance weights for different match types - `getSearchScore()` function that calculates a feature's relevance to a search term - Updated filtering and sorting logic that uses relevance scoring The weights are carefully chosen so that any title match always ranks above features that only match in subtitle/description, improving search quality without requiring complex algorithms. https://claude.ai/code/session_01573vYv6WZhrboV14NQSuc4 <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **New Features** * Improved feature search with relevance-based matching. * Search results now prioritize matches in feature titles, especially title prefixes, followed by subtitles and descriptions. * Results are displayed in relevance order for faster discovery. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
Gildas GarciaandIvan Vasilov
|
96d43099bb |
chore: refactor Button API so that it can be used a standard button (#46880)
## Problem Our `<Button>` component breaks the default `button` contract by redefining the `type` prop to set its variant (`primary`, `default`, etc) instead of the button type (`submit`, `button`, etc). This is confusing and forces to write more code when using it with shadcn components that expect/inject the standard button props. ## Solution - rename the `type` prop to `variant` - rename the `htmlType` prop to `type` - propagate the changes where necessary - format code ## How to test As this is just prop renaming, if it builds it's ok --------- Co-authored-by: Ivan Vasilov <vasilov.ivan@gmail.com> |
||
|
Francesco Sansalvadore
|
5ab15751d2 |
chore(www): add feature matrix to features page (#45420)
## What changed Adds a **matrix (table) view** toggle to `supabase.com/features` alongside the existing card grid. The new view surfaces feature stage and self-hosted availability at a glance — the same information previously shown on the now-deprecated `docs/guides/getting-started/features` page — but richer and integrated into the live features page. Also adds `products` and `stage` badges on feature cards in gallery view. https://github.com/user-attachments/assets/9214204b-85e7-4ad4-acfe-b39970a928af |
||
|
Pamela Chia
|
c26b64a033 |
feat(www): emit BreadcrumbList JSON-LD on marketing surfaces (#45478)
## Summary
- Adds `breadcrumbListSchema(items)` helper to `apps/www/lib/json-ld.ts`
and a hand-curated `apps/www/lib/breadcrumbs.ts` route map.
- Wires inline `<script type="application/ld+json">` BreadcrumbList
blocks into 18 marketing surfaces: blog (index + slug), customers (index
+ slug), events (index + slug), 5 product pages (database, auth,
storage, edge-functions, realtime), 3 modules (vector, cron, queues),
pricing, careers, company, features.
- Pages router callers wrap the script in `<Head>`; app router callers
place it directly in JSX. Dynamic surfaces append a leaf at render time
using the page's title (`frontmatter.title` for blog, `meta_title ??
title` for customers, `event.meta_title ?? event.title` for events).
- Modules sit at `Home > {Name}` since no `/modules` index page exists;
products sit at `Home > {Product}` (no shared products parent). Absolute
`https://supabase.com` URLs match the existing `CANONICAL_ORIGIN`
convention so anchors stay stable across Vercel previews.
Linear:
[GROWTH-822](https://linear.app/supabase/issue/GROWTH-822/add-breadcrumblist-json-ld-to-www-marketing-surfaces)
(sub-issue under
[GROWTH-724](https://linear.app/supabase/issue/GROWTH-724)).
> **Note on branch name:** the branch is
`pamela/growth-820-www-breadcrumb-jsonld`; the actual Linear issue is
GROWTH-822. The branch was named before the sub-issue was created.
Ignore the `820` in the branch.
Explicitly deferred (separate PRs / low SEO ROI): `/launch-week/*`,
`/solutions/*`, `/partners/*`, `/alternatives/*`, `/changelog`,
`/legal/dpa`, `/aws-reinvent-2025`, `/wrapped`, `/contribute/*`,
`/brand-assets`, `/ga`, `/ga-week`, `/state-of-startups*`, and the
homepage (Organization + WebSite already cover homepage entity signals;
single-item BreadcrumbList is ignored by Google).
## Test plan
- [x] On the Vercel preview, `curl -s https://<preview>/database | grep
'"BreadcrumbList"'` returns the script block with `Home > Database`.
- [x] `curl -s https://<preview>/blog/<recent-slug> | grep
'"BreadcrumbList"'` returns `Home > Blog > {post title}`.
- [x] `curl -s https://<preview>/customers/<slug> | grep
'"BreadcrumbList"'` returns `Home > Customer Stories > {customer
title}`.
- [x] `curl -s https://<preview>/events/<slug> | grep
'"BreadcrumbList"'` returns `Home > Events > {event title}`.
- [x] `curl -s https://<preview>/modules/vector | grep
'"BreadcrumbList"'` returns `Home > Vector`.
|
||
|
Gildas Garcia
|
b554f58106 |
chore: migrate Input usages to Shadcn components (#45429)
## Problem We want to reduce the code we ship and maintain. ## Solution - Migrate old `Input` usage to the new Shadcn `input` This PR focuses on: - DevToolbar - design-system examples - `www` usages - `docs` usages ## Screenshots ### Docs: OAuth Apple Before: <img width="613" height="508" alt="image" src="https://github.com/user-attachments/assets/1d2d7726-cc5e-471f-a2c2-995b9d7f70ee" /> After: <img width="606" height="530" alt="image" src="https://github.com/user-attachments/assets/ca4f522f-de9c-4edf-966b-70cad5015d0c" /> NOTE: Also used the `DataInput` for the secret once the inputs are filled. ### Docs: Extensions Before: <img width="596" height="161" alt="image" src="https://github.com/user-attachments/assets/16d2f548-90dc-4987-9954-7c47ac58e76e" /> After: <img width="604" height="227" alt="image" src="https://github.com/user-attachments/assets/62c74102-98c6-47a6-b19b-cbf67dfad68f" /> ### WWW: Blog search Before: <img width="971" height="417" alt="image" src="https://github.com/user-attachments/assets/efb0307e-60b5-4d8f-9823-c8b8996cdf32" /> After: <img width="964" height="403" alt="image" src="https://github.com/user-attachments/assets/2dc0decd-b773-4bc6-9a72-c43f352f8cbf" /> ### WWW: Blog author search Before: <img width="953" height="337" alt="image" src="https://github.com/user-attachments/assets/1f629704-ab7d-4e4b-878e-1838ab16037f" /> After: <img width="1028" height="341" alt="image" src="https://github.com/user-attachments/assets/d8d54dcb-3c00-46ea-b97f-55c16cda917f" /> ### WWW: Assistant demo Before: <img width="421" height="715" alt="image" src="https://github.com/user-attachments/assets/bcc4a591-d53c-4202-acf8-2b3d6cfd52d2" /> After: <img width="435" height="731" alt="image" src="https://github.com/user-attachments/assets/8a57c5da-5c9e-474d-a89e-2835d3498aef" /> ### WWW: Integrations Before: <img width="740" height="599" alt="image" src="https://github.com/user-attachments/assets/cf3d3d8a-b247-4e20-b47d-11976ca49c57" /> After: <img width="911" height="492" alt="image" src="https://github.com/user-attachments/assets/dcb5b6e8-f4e2-4801-b390-352390a0b486" /> ### WWW: features Before: <img width="1098" height="491" alt="image" src="https://github.com/user-attachments/assets/ea3645c5-df03-4eb9-b28c-41018e01c41e" /> After: <img width="976" height="479" alt="image" src="https://github.com/user-attachments/assets/4439a38e-6342-42cd-a859-1e599a8cf0f4" /> <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Style** * Adjusted input widths and spacing for more consistent search and form layouts. * **Refactor** * Standardized input components across apps and docs, and reimplemented search controls as composed input groups with dedicated icon/action areas. * **Chores** * Removed a deprecated legacy input variant along with its legacy styles and tests. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
Ivan VasilovandJordi Enric
|
56de26fe22 |
chore: Migrate the monorepo to use Tailwind v4 (#45318)
This PR migrates the whole monorepo to use Tailwind v4: - Removed `@tailwindcss/container-queries` plugin since it's included by default in v4, - Bump all instances of Tailwind to v4. Made minimal changes to the shared config to remove non-supported features (`alpha` mentions), - Migrate all apps to be compatible with v4 configs, - Fix the `typography.css` import in 3 apps, - Add missing rules which were included by default in v3, - Run `pnpm dlx @tailwindcss/upgrade` on all apps, which renames a lot of classes - Rename all misnamed classes according to https://tailwindcss.com/docs/upgrade-guide#renamed-utilities in all apps. --------- Co-authored-by: Jordi Enric <jordi.err@gmail.com> |
||
|
Ivan Vasilov
|
308cd791a2 |
chore: Prep work for migrating to Tailwind v4 (#45285)
This PR preps the monorepo for a migration to Tailwind v4: - Bump all Tailwind dependencies and libraries to the latest possible version, while still compatible with Tailwind 3. - Cleans up obsolete Tailwind 3 specific options and configs. - Cleans up unused CSS files and fixes the CSS imports. - Migrates all `important` uses in `@apply` lines to using the `!` prefix. - Move `typography.css` to the `config` package and import it from the apps. - Migrated all occurrences of `flex-grow`, `flex-shrink`, `overflow-clip` and `overflow-ellipsis` since they're deprecated and will be removed in Tailwind 4. - Make the default theme object typesafe in the `ui` package. - Migrate all `bg-opacity`, `border-opacity`, `ring-opacity` and `divider-opacity` to the new format where they're declared as part of the property color. - Bump and unify all imports of `postcss` dependency. |
||
|
Gildas Garcia
|
416210d666 |
chore: remove _Shadcn_ suffix for Checkbox and Radio components (#45263)
## Problem With #45211 and #45218 merged, we don't need the `_Shadcn_` suffix anymore ## Solution - [x] Remove the `_Shadcn_` suffix - [x] Update exports and imports <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Refactor** * Standardized UI component exports by removing legacy naming conventions and providing direct imports for checkbox and radio group components throughout the design system. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
Gildas Garcia
|
502c098d90 |
chore: migrate old <Checkbox /> usage to the new Shadcn component (#45211)
## Problem We want to reduce the code we ship and maintain. ## Solution Migrate old `<Checkbox />` usage to the new Shadcn component. There's one visual change: no more green background or outline. ## Screenshots ### On `apps/www` Before: <img width="1095" height="772" alt="image" src="https://github.com/user-attachments/assets/b14a0477-d8ac-4ae5-a1c3-63657609e4e5" /> After: <img width="1085" height="766" alt="image" src="https://github.com/user-attachments/assets/f4c2156c-38e1-4834-b013-e39b8c3dd76e" /> <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Refactor** * Unified checkbox appearance and behavior across the app for consistent toggles, labels, and interactions. * **Bug Fixes** * Fixed selection issues including shift-select edge cases and click-propagation in lists; added ARIA labels for improved accessibility. * **Chores** * Removed legacy checkbox implementation, associated styles, tests, and deprecated theme entries. <!-- end of auto-generated comment: release notes by coderabbit.ai --> |
||
|
|
707c9093fb |
feat: add self-hosted features filter checkbox (#42055)
## I have read the [CONTRIBUTING.md](https://github.com/supabase/supabase/blob/master/CONTRIBUTING.md) file. YES ## What kind of change does this PR introduce? Adding a toggle feature to the Features page to enable users to see self hosted features only. ## What is the current behavior? N/A ## What is the new behavior? <img width="1690" height="1168" alt="Screenshot 2026-01-21 at 7 16 12 PM" src="https://github.com/user-attachments/assets/49938c82-e023-4126-b627-77a47f87bfc5" /> ## Additional context N/A <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **New Features** * Added self-hosted feature filtering. Users can now toggle a checkbox to show only features available on self-hosted deployments. * Filter selections are preserved when sharing or bookmarking links. * Clear all filters action now includes resetting the self-hosted filter. <sub>✏️ Tip: You can customize this high-level summary in your review settings.</sub> <!-- end of auto-generated comment: release notes by coderabbit.ai --> --------- Co-authored-by: Ana Mogul <anamogulsupa@Anas-MacBook-Pro.local> Co-authored-by: Alan Daniel <stylesshjs@gmail.com> |
||
|
Francesco Sansalvadore
|
2feda5ee19 |
cms www blog (#38045)
* show cms blog posts in www * remove contentlayer from www * outputFileTracingExcludes * update remotePatterns * fetch cms posts server-side with revalidation * add cms env vars to turbo.json * add www env vars to turbo.json * include cms posts in www sitemap * add migration to remove image from cms post * update cms meta image mapping in www |
||
|
Francesco Sansalvadore
|
1f89c24b7a |
[www] remove lodash (#38240)
remove lodash from www |
||
|
Francesco Sansalvadore
|
f6f834e416 |
feat: add status to features (#30382)
* first draft * add stage to features * finish features stages * update correct feature stages * add missing features * add proper client libs icons * keep tags lowercase |
||
|
Francesco Sansalvadore
|
9a3d0992c3 |
www features section (#30072)
* init features page * fix filtering * seo boostg * add features to sitemap * update copywriting * improve features descriptions * more studio features * moar featuress * better back to features * prev next feature nav * clean * improve page footer * fixes * stuff * sync filters with query params on page load * better mobile layout * 16px mobile input fontsize * add cover images or videos to features * improve a11y * update sitemap * last changes * update schema definitions |