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>
Alex Hall
