Follow-up to #48344: collapses the two resolution paths for the
Admonition module into one.
`src/admonition.tsx` was a back-compat shim re-exporting
`src/Admonition/`. Two ways to resolve one module is exactly what
produced the macOS self-import bug fixed in #48344, and the local
typecheck errors that #48374 worked around. This removes the shim and
standardizes on the PascalCase subpath, matching every other export in
the package.
**Changed:**
- Codemodded all 246 `ui-patterns/admonition` imports to
`ui-patterns/Admonition` (240 `.tsx`, 5 `.mdx`, 1 `.ts` across studio,
docs, www, design-system, and lite-studio)
- Pointed the 5 internal `'../admonition'` imports back at the
`'../Admonition'` directory
**Removed:**
- `packages/ui-patterns/src/admonition.tsx`, and its `./admonition`
entry in the exports map (regenerated with `pnpm gen:exports`)
## To test
- `grep -r "ui-patterns/admonition" --include='*.ts*'` → no hits
- `pnpm test:case-hazards` → passes
- `pnpm typecheck` → all 15 tasks green
- `pnpm --filter studio run lint:ratchet` → passes
- `pnpm --filter ui-patterns vitest run src/Admonition` → 11 tests pass
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Bug Fixes**
* Standardized Admonition component imports across the application and
documentation.
* Improved compatibility with case-sensitive environments by using the
canonical component path.
* Removed the legacy Admonition import entry point.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
---------
Co-authored-by: Alaister Young <10985857+alaister@users.noreply.github.com>
Use `grafana-cloud` slug for the partner integration.
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* Added Grafana Cloud to the featured integrations in the marketplace.
* Added light and dark themed artwork for the Grafana Cloud featured
integration.
* **Improvements**
* Updated the OAuth “installed” detection to include Grafana Cloud
alongside Grafana.
* Included Grafana Cloud in the set of official partners for the
partner-only filter.
* **Tests**
* Expanded marketplace integration fixtures to cover Grafana Cloud
scenarios.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## 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 -->
Make the new "one-click" integrations feature preview opt-in by default
so it appears for all users once we switch `marketplaceIntegrations` to
_true_ and reframe the feature preview copywriting.
<img width="1007" height="694" alt="Screenshot 2026-07-22 at 12 01 08"
src="https://github.com/user-attachments/assets/4b35870c-dcf0-45cc-a1b5-69628e7e10b5"
/>
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* Added a visual preview image to the integrations layout preview.
* Renamed the preview to “One-Click Integrations.”
* Made the preview enabled by default when the marketplace feature is
enabled.
* **Style**
* Refreshed the preview text and updated the layout with improved
spacing, border, and rounded corners.
* **Documentation**
* Updated the page header documentation link to the general integrations
guide.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## What is the current behavior?
featured integration image was looking muddy on light mode
<img width="1479" height="792" alt="Screenshot 2026-07-16 at 16 20 29"
src="https://github.com/user-attachments/assets/d51960f9-7c58-47d6-a751-e310f0edb32e"
/>
## What is the new behavior?
dedicated light-mode preview images
<img width="1482" height="785" alt="Screenshot 2026-07-16 at 16 29 48"
src="https://github.com/user-attachments/assets/5c1b9772-8ea2-4b94-aeba-cb095015df8e"
/>
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* Added Stripe Sync Engine to the featured integrations list.
* Added light-theme cover imagery for featured integrations.
* Featured integration cards now display theme-aware images and improved
visual overlays.
* Updated the marketplace grid for improved responsive layouts across
screen sizes.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## What kind of change does this PR introduce?
A11y cleanup follow-up to #47984 /
[DEPR-626](https://linear.app/supabase/issue/DEPR-626).
## What is the current behavior?
Studio had 82 ratcheted `supabase/require-explicit-tabindex` violations
(raw `<button>` / `role="button"` without explicit `tabIndex`).
## What is the new behavior?
- Explicit `tabIndex={0}` (or disabled → `-1`) on those Studio call
sites across nav, `components/ui`, Database, Storage, and the remainder
- Ratchet baseline cleared (**82 → 0**) and the rule **removed from the
Studio ratchet** (debt is gone; ratchet is temporary)
- Rule remains a shared **`warn`** for now — promoting to `error` (and
sweeping www/docs/design-system) is a follow-up
- Also fixed the learn/ui-library call sites that surfaced while
experimenting with error promotion
- Small follow-ups where making controls focusable exposed gaps:
accessible names, disabled/focus consistency, focus-ring polish on
To-test surfaces, home section `KeyboardSensor`, and an E2E locator
tightened after `aria-label="Remove column"`
Prefer migrating to `Button` from `ui` in future touch-ups; this PR
takes the minimal path so Studio debt can stay at zero.
## Additional context
Batches landed together so baseline conflicts stayed simple while
chipping away:
- Hotspots / nav (FirstLevelNav, Marketplace, AttachmentUpload, Column,
Tabs, …)
- `components/ui` shared
- Database + Storage
- Remainder
**Out of scope / intentional deferrals**
- Promoting `supabase/require-explicit-tabindex` to a lint **error**
(follow-up after www/docs/design-system sweeps)
- Tabs/Radio roving, tooltips, context menus, in-menu items
- Full keyboard-accessible tab-close UX (close stays hover +
`tabIndex={-1}`; context menu still closes tabs)
- Data API docs links (`/project/<ref>/api` redirect)
**Reviewer notes**
- Rule only flags raw `<button>` / `role="button"` without a `tabIndex`
prop. `Button` from `ui` already bakes this in
- `tabIndex={-1}` is intentional for disabled controls, in-menu /
roving-focus children, and hover-only tab close
- For dnd-kit grips, put `tabIndex` **after** `{...attributes}` so it
isn’t overwritten (TS2783)
### To test
Use **Safari** with macOS Keyboard navigation **off** (System Settings →
Keyboard). Chrome once for a sanity pass. For each surface below: Tab
until the control is focused, then activate with Enter/Space where
relevant.
1. **API Docs side panel** (Table Editor → open a table → **API docs**)
- Floating API Docs panel — **not** `/project/<ref>/api` (that redirects
to Data API docs; language ToggleGroup uses arrow keys; links are out of
scope)
- Left nav buttons — Tab through several and activate one; active
highlight / navigation still works
2. **Integrations → Marketplace**
- Enable **Integrations layout** feature preview first (avatar menu →
Feature previews)
- `/org/<slug>/integrations` or project integrations marketplace
- “Clear all”, grid/list toggles — Tab + activate
3. **Table Editor → create a table → Columns**
- Drag handles only appear while **creating** (not when editing an
existing table)
- Tab to grip / remove (X) / sensitive-data eye if shown
4. **Project Home** — section drag handles
- Tab to a grip (visible focus ring)
- Optional: Space to pick up, arrows to move, Space/Esc to drop
(KeyboardSensor added)
- Mouse dnd still works
5. **Storage → Policies** — expand/collapse bucket list chevron
(design-system focus ring, no stuck grey open bg)
6. **Support form** (Help → Support) — attachment remove (×) and
add-attachment control when visible
Disabled controls should be **skipped** by Tab.
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Accessibility Improvements**
* Improved keyboard navigation throughout Studio by explicitly managing
focus (`tabIndex`) across many interactive controls (menus, tabs,
tables, charts, dialogs, navigation, and form actions).
* Disabled or non-interactive controls are now removed from the tab
order (or made unfocusable), while available actions remain reachable.
* Ensured `type="button"` on relevant controls to prevent unintended
submissions, and refined keyboard focus behavior for various toggles and
copy/remove actions.
* **Chores**
* Updated the ESLint rule baseline configuration to match the new focus
behavior.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## Info architecture change around "Partners"
The www "integrations" now become more partner-driven.
`/partners/integrations` -> now Partner Catalog under
`/partners/catalog` (old links redirect to new paths)
Moved them close together in the nav dropdown and in the footer
<img width="494" height="336" alt="Screenshot 2026-07-09 at 11 06 41"
src="https://github.com/user-attachments/assets/a875fef0-0ab8-47ca-8756-d658b27c4892"
/>
<img width="1149" height="665" alt="Screenshot 2026-07-09 at 11 09 48"
src="https://github.com/user-attachments/assets/9631bb72-fe25-4fb4-b1af-9f14a37d02e7"
/>
## /partners
This page remains untouched in this PR, updates to layout, content and
intake form are delegated to #47874
## /partners/catalog
Listed in the
[catalog](https://zone-www-dot-com-git-feat-www-partners-pages-supabase.vercel.app/partners/catalog)
are now partners. Some partners match with a listing.
<img width="1207" height="866" alt="Screenshot 2026-07-09 at 11 14 17"
src="https://github.com/user-attachments/assets/b65216be-976f-4ef5-91f8-1ad49da87b45"
/>
## /partners/catalog/[partner]
Each partner can have one or more "listings" which are either
- simple guides
- foreign data wrappers
- dashboard integrations
Integrations available in the dashboard now all have a prominent
"Install integration" cta to open it in the dashboard [integrations
page](https://supabase.com/dashboard/project/_/integrations).
<img width="1269" height="776" alt="Screenshot 2026-07-09 at 11 16 51"
src="https://github.com/user-attachments/assets/3c7bb715-ffce-4d0a-905f-9a660c3b1f5a"
/>
## Docs
Update docs →
[Preview](https://docs-git-feat-www-partners-pages-supabase.vercel.app/docs/guides/integrations)
- remove "Supabase marketplace"
- use "Dashboard Integrations and Partner Catalog
- update integrations in sidenav to link to updated /partners/catalog/**
listings
<img width="1520" height="696" alt="Screenshot 2026-07-15 at 12 54 47"
src="https://github.com/user-attachments/assets/9f5a2794-4536-4299-97df-9732d3d75b4c"
/>
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* Added a Partner Catalog experience with search, category filters,
official-partner toggle, responsive filtering (sidebar + bottom sheet),
grid/list views, and featured partners.
* Added Partner Catalog detail pages with tabbed listings, MDX-rendered
content, image gallery with zoom overlay, and “add/install” actions.
* **Improvements**
* Updated “Become a Partner” layout and form support for prefilled
values and checkbox-group fields (including validation).
* Updated navigation/footer/docs and partner tile links to use Partner
Catalog routes; expanded redirects from legacy integrations paths.
* Added public agent-skills discovery manifest.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
---------
Co-authored-by: Alan Daniel <stylesshjs@gmail.com>
Co-authored-by: Alex Hall <alex.hall@supabase.io>
Co-authored-by: Miranda Limonczenko <miranda.limonczenko@supabase.io>
Previously, uncaught permission errors were bubbling up and preventing
the marketplace UI from rendering at all. This is a problem because
users might have access to the integrations tab, but not permissions to
view all the connected resources on a particular integration. In that
scenario, we want to degrade gracefully and show them only those
resources they have access to.
## Problem
We now export components under a subpath in ui-patterns to avoid barrel
files as they slow down every tools (from IDE to linters, etc.) and may
also affect bundles our users have to download.
## Solution
- Remove the UI patterns index file
- Fix invalid impors
Fixes three GraphiQL/integrations layout issues introduced by the
Marketplace layout change (#45856), which dropped the height passthrough
on the integration page content wrapper.
**Changed:**
- **Full-height integration pages** — the content wrapper had no height,
so GraphiQL's `h-full` editor collapsed instead of filling the page.
Added `flex-1 min-h-0` to the wrapper in both the legacy
(`LegacyIntegrationPage`) and marketplace (`MarketplaceDetail`) render
paths.
- **GraphiQL gutter bleed** — Monaco's `.overflow-guard` was ending up
`overflow: visible` (an inline style Monaco sets at runtime), so the
oversized opaque line-number gutter escaped the editor and painted over
the page above it. Re-asserted the clip, scoped to GraphiQL so the SQL
editor is untouched.
- **GraphiQL editor spacing** — removed GraphiQL's default 16px
query-editor padding so the scroll shadow sits flush, and restored the
content's breathing room via Monaco's own `padding` (top/bottom) and
`glyphMargin` (line-number left inset) options, which leave the scroll
shadow pinned to the top edge.
Before:
<img width="2056" height="814" alt="Screenshot 2026-06-26 at 5 27 24 PM"
src="https://github.com/user-attachments/assets/573856bf-2bfb-4bf2-9dd7-59c29b423ec9"
/>
## To test
- Open a project → **Integrations → GraphiQL** (the `graphiql` tab). The
editor should fill the full page height.
- Scroll the query editor — the scroll shadow should sit flush at the
top edge, not float inset, and the white gutter should not bleed over
the page header above.
- Confirm line numbers have left padding and content has top/bottom
padding.
- Trigger autocomplete in the editor — the suggestion popup should still
appear (not clipped by the gutter `overflow: hidden`).
- Toggle the **Marketplace** feature preview (Account dropdown → Feature
Previews) and re-check the GraphiQL page in both states, since it
renders through two different page components.
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Bug Fixes**
* Improved the GraphQL in-browser editor layout to prevent the editor
gutter from overlapping surrounding content.
* Removed unnecessary query-editor padding so scrolling and shadow
effects display correctly in the available space.
* Ensured Monaco editor spacing/settings are applied consistently to
both existing and newly created editors.
* Fixed full-height sizing for integration pages so content stays
correctly constrained and doesn’t collapse or overflow.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
---------
Co-authored-by: Alaister Young <10985857+alaister@users.noreply.github.com>
## Problem
There's still more unused code in the repository which slows down
everything:
- checkouts
- tooling
- probably builds (not sure how good turbopack is at handling this)
## Solution
- remove old unused code
- remove more recent code after checking git history to ensure it's not
unfinished/ongoing work
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Chores**
* Removed several unused interface, onboarding, and helper components
from the studio app.
* Cleaned up outdated branching, integrations, query performance,
support, and table/grid UI elements.
* Removed a few unused utility hooks and key-mapping logic.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## 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>
- fix install badge state in wrappers detail page
- add "Install" button in top action bar
- "Install wrapper" if required extensions _aren't_ installed
- "Add new wrapper" if required extensions _are_ installed
- make wrappers "one-click install" by
- showing the required extensions in the CreateWrappersSheet
- and automatically installing them on wrapper submission
Only available behind `isMarketplaceEnabled` flag at the moment.
https://github.com/user-attachments/assets/38f5549d-938e-4e2f-a723-53b9a028e9dc
- 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>
This PR overrides title, description, content, logo, images, docs url,
and site url from marketplace db for wrappers. If marketplace doesn't
yet publish a wrapper listing, the page falls back to the hardcoded
content we show today.
It also improves the marketplace listings and categories queries by
returning typed results, making the code more type safe.
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* Studio integrations now surface updated marketplace metadata (name,
description, icon, docs, site, author, files) when available.
* Marketplace wrapper integrations are consolidated and shown alongside
studio integrations.
* **Refactor**
* Marketplace category and integration fetching rewritten for more
reliable loading, cancellation support, and improved menu/category
population.
<!-- review_stack_entry_start -->
[](https://app.coderabbit.ai/change-stack/supabase/supabase/pull/46472?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 -->
## Summary
Adds keyboard shortcuts to the Integrations Marketplace landing and
per-integration detail pages. Introduces a `useDynamicShortcut` hook
since per-integration tab counts/labels can't be pre-declared in the
static registry.
## Shortcuts
| Page | Keys | Action |
|---|---|---|
| Marketplace landing | `Shift+F` | Focus the integrations search input
|
| Marketplace landing | `F` then `C` | Clear search +
category/type/source filters |
| Marketplace landing search | `Esc` | Clear value (1st press), blur
(2nd press) |
| Integration detail | `1`–`9` | Jump to the Nth tab (label adapts per
integration, e.g. "Go to Queues", "Go to Jobs") |
Linear: [FE-3416](https://linear.app/supabase/issue/FE-3416)
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* Use number keys 1–9 to jump to integration detail tabs.
* Marketplace search shortcuts: focus/select the search field and reset
filters via keyboard; Escape now clears the search input.
* Shortcuts now appear in the command menu under a dedicated
integrations navigation group.
<!-- review_stack_entry_start -->
[](https://app.coderabbit.ai/change-stack/supabase/supabase/pull/46348?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 -->
Restores proper content in new marketplace detail overview pages
compared to the legacy overview pages.
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* Added Data API URL settings and a visible "Required extensions"
section across integration overviews.
* Unified install/manage UIs for webhooks, Stripe Sync, wrappers,
queues, and others; marketplace mode now shows marketplace-specific
overview content.
* **Style**
* Improved marketplace detail rail and filter-bar button styling;
refined list/link row visuals.
* **Refactor**
* Overview pages reorganized to branch on marketplace mode and extract
shared overview content for consistency.
* **Tests**
* Stabilized integration overview test data for deterministic runs.
<!-- review_stack_entry_start -->
[](https://app.coderabbit.ai/change-stack/supabase/supabase/pull/46179?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: Joshen Lim <joshenlimek@gmail.com>
- add loading state to "Installed" integrations in sidebar
- share filtering and sorting logic from legacy to new marketplace
- integrate missing/empty categories
- refine featured integrations hero component
<img width="296" height="473" alt="Screenshot 2026-05-20 at 12 30 14"
src="https://github.com/user-attachments/assets/efbc0bd1-3e78-4033-9e65-abaa257d2a73"
/>
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* Added loading indicators while installed integrations are being
fetched.
* **Improvements**
* Enhanced integration categorization to surface meaningful categories
for more integrations.
* Empty categories are now hidden from the category filter.
* Sorting now prioritizes installed integrations and improves
alphabetical ordering.
* Simplified and more consistent status badge display.
* Updated featured integrations ordering and fixed featured hero
rotation to restart its progress animation when resumed.
* **Refactor**
* Consolidated filtering and sorting into a shared hook for consistent
behavior.
<!-- review_stack_entry_start -->
[](https://app.coderabbit.ai/change-stack/supabase/supabase/pull/46146?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 -->
Introducing a new Integrations Marketplace layout
- behind feature flag
- behind opt-out feature preview (default to true) to easily toggle
before and after
Doesn't introduce new functionality, only layout change behind ff.
## What changed
Nothing if `marketplaceIntegrations` flag is off.
### With flag
- New Marketplace index layout
- filter via text or by `category`, `integration type` and `source`
- Featured Partners Integrations hero (hidden when any filter is active)
- toggle between `grid` and `list` view
- new integration detail page layout
- with top action bar
- more consistent fullWidth or narrow content layouts
- can access Feature Preview toggle under Account Dropdown > Feature
Previews > Marketplace
## How to review and what to test
I recommend reviewing file changes from bottom to top in
https://github.com/supabase/supabase/pull/45856/changes because it makes
more sense from a pr-logic perspective.
- [ ] Visit
https://studio-staging-git-chore-integrations-ui-refine-fs-supabase.vercel.app/dashboard/project/_/integrations
- [ ] Check if new layout doesn't have big layout issues like weird
paddings or margins mostly. (We can iterate in upcoming PRs for
additional features/fixes)
- [ ] Toggle "Marketplace" feature preview to `FALSE` and check that the
Integrations layout looks like in prod
https://supabase.com/dashboard/project/_/integrations
- [ ] Also check individual integration pages and toggle the feature
preview on and off to see before and after and check if everything looks
good
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* Full Marketplace experience: explorer with featured hero,
filters/search, list & grid views, cards, sidebar, detailed integration
pages, install flows, badges, and a preview toggle.
* **Bug Fixes**
* Prevented stale markdown from showing when switching integrations.
* **Style**
* Improved responsive layouts, loading placeholders, and header/nav
full-width behavior.
<!-- review_stack_entry_start -->
[](https://app.coderabbit.ai/change-stack/supabase/supabase/pull/45856)
<!-- review_stack_entry_end -->
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
---------
Co-authored-by: Saxon Fletcher <saxonafletcher@gmail.com>
Co-authored-by: Raminder Singh <romi_ssk@yahoo.co.in>
Danny White
