## 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
## What kind of change does this PR introduce?
Feature. Implements
[AUTH-1215](https://linear.app/supabase/issue/AUTH-1215/improve-studio-ui-when-send-email-hook-is-active-or-deleted).
Follow-up to #45396.
## What is the current behavior?
When a send-email hook is configured, email templates are bypassed
entirely. Auth passes event metadata to the hook, not rendered HTML. The
template list and editor give no indication of this.
Deleting the send-email hook silently reverts Auth to using email
templates with no warning. For post-cutoff Free plan projects without
custom SMTP, this also locks template editing.
## What is the new behavior?
### Admonition when send-email hook is active
A new `SendEmailHookActiveAdmonition` is shown on both the template list
and individual template editor pages when `HOOK_SEND_EMAIL_ENABLED` and
`HOOK_SEND_EMAIL_URI` are set:
> **Email templates are not used**
> A Send Email hook is active. Event metadata is passed directly to your
hook, meaning these templates are bypassed entirely.
With a **Manage hook** link to the hooks page.
### AlertDialog for Send Email hook deletion
Deleting the Send Email hook now uses a dedicated
`DeleteSendEmailHookConfirmationDialog`:
- **Always:** "The {default or built-in} email templates will be used to
send auth emails."
- **Post-cutoff Free plan, no custom SMTP:** adds "Email templates
cannot be edited on the Free plan without custom SMTP."
The dialog stays open with a loading state while the deletion is
in-flight and closes on success.
| After |
| --- |
| <img width="1862" height="880" alt="CleanShot 2026-05-25 at 15 57
41@2x"
src="https://github.com/user-attachments/assets/8a441bb2-9112-4b19-bd0b-02c9d1989ec1"
/> |
| <img width="884" height="578" alt="CleanShot 2026-05-25 at 15 57
21@2x"
src="https://github.com/user-attachments/assets/44e5bd79-2bd9-44ee-8f53-5fdaeefd68c6"
/> |
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* Added a Send Email hook warning in the template editor with “Manage
hook” and “Learn more” links.
* **UI Improvements**
* Refined template editor alerts to reflect when templates are bypassed
vs blocked.
* Updated hook cards/actions to a dropdown with separate Edit and Delete
flows, including documentation links.
* **Bug Fixes**
* Improved template editor and hook deletion flows to better reflect
pending states and current authentication configuration.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
---------
Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
Co-authored-by: Claude Sonnet 4.5 <noreply@anthropic.com>
Co-authored-by: Cursor <cursoragent@cursor.com>
## Context
Part of efforts to consolidate all the code editors that we have in the
repository
`CodeEditor` will serve as the base monaco editor file that all UIs
should consume from
It's aimed to be generic and just stores the common logic that will be
generally used where-ever we need a code editor (editor options, base
editor set up on mount, etc)
The idea is that `CodeEditor` holds just 3 default actions (run queyr,
format document and placeholder fill)
If any editor needs specific behaviours (e.g SQL Editor), they can
declare them in the `onMount` prop of `CodeEditor` which gives some
flexibility
## Changes involved
- Use `CodeEditor` component for SQL Editor's `MonacoEditor`
- Shifted Cmd K behaviour into `CodeEditor` since that's probably needed
everywhere that we render that UI
- Deprecate `MonacoEditor` from the table editor's `grid` folder
- All files that were using that component to use `CodeEditor` component
instead
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
## Release Notes
* **Refactor**
* Migrated the studio’s code editing UI (including JSON, text, and
payload viewers) to a unified CodeEditor experience.
* **New Features**
* Added plaintext language support for read-only/truncated views.
* **Behavior Changes**
* Improved editor startup by setting cursor position consistently and
deferring autofocus.
* Streamlined editor context-menu actions to the core set (run query,
format, placeholder fill).
* Updated SQL editor wiring for more consistent command/menu and
selection handling.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## Context
Dashboard currently doesn't have any support for managing stored
procedures. In the event that the security advisor surfaces a warning
about a stored procedure, users hence run into a dead-end as there's
currently no way to self-remediate via the dashboard
## Changes involved
We're hence adding support for managing stored procedures within
Database Functions
<img width="1082" height="546" alt="image"
src="https://github.com/user-attachments/assets/2598a5fe-e58f-4e8a-ad2f-9cb6d0eb2f53"
/>
Creating a function now shows a dropdown to select the type
<img width="500" alt="image"
src="https://github.com/user-attachments/assets/acc9249d-7b25-4416-aae8-89c630e1c62b"
/>
In which if stored procedure is selected, the following fields will be
hidden since they're irrelevant for stored procedures
- Return type
- Behaviour (Under advanced settings)
Some other minor UI changes as well:
- Field inputs are re-ordered a little, opting to group "Schema" and
"Name" into one section, followed by "Type" and "Return type"
- Opting to show "Return type" when editing a function but disabled
- Add schema filter for fetching database functions to reduce
unnecessary load on the database
## To test
- [ ] Can create, update, delete, read stored procedures via database
functions page
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
## Summary
- **New Features**
- Added PostgreSQL **procedure** support alongside functions, including
a **Type** selector in the create/edit flow.
- Updated Functions UI with a new **Type** column and procedure-aware
return/argument details.
- **Improvements**
- Refreshed create/edit headers and language help text for clearer
context.
- Improved argument parsing/display, including better handling of
procedure argument modes.
- **Bug Fixes**
- Corrected routine-type handling during function/procedure delete and
update SQL operations.
- **Tests**
- Updated unit snapshots and end-to-end UI flows/labels for the new “New
function” control.
<!-- 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>
## Context
Just some clean up as I was going through stuff
- `useExecuteSqlQuery` is deprecated and not used at all
- As such `execute-sql-query` is technically irrelevant, the more
relevant file is `execute-sql-mutation`
- Hence opting to consolidate `execute-sql-query` into
`execute-sql-mutation`
- Also removing `ExecuteSqlError` since its just re-exporting the
`ResponseError` type
There's a lot of file changes but its essentially just updating the
importing statements across the files
## 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?
Refactor / security improvement
## What is the current behavior?
SQL fragments across Studio are built from plain `string` values with no
type-level distinction between developer-authored SQL, DB-sourced
identifiers, and user-typed or externally-influenced content.
## What is the new behavior?
Extends the safe SQL model to additional Studio interfaces, using
`SafeSqlFragment`, `safeSql`, `ident()`, `literal()`, `untrustedSql()`,
and `acceptUntrustedSql()` from `@supabase/pg-meta/src/pg-format`:
- **Policy editor**: template constants typed as `SafeSqlFragment` via
`safeSql` tagged literals; Monaco editor `onInputChange` emits
`untrustedSql()`; `acceptUntrustedSql()` called only at the Save
gesture; roles selector emits a composed `SafeSqlFragment` via `ident()`
+ `joinSqlFragments()`
- **Auth hooks**: grant/revoke SQL statements use `ident()` for schema
and function names
- **Docs description editor**: `COMMENT ON` queries use `ident()` and
`literal()` for table/column/function names and values
- **Cron jobs**: `cron.schedule()` call and HTTP request builder use
`literal()` for all user-provided values
- **GraphQL linter CTA**: `REVOKE` statement uses `ident()` for schema,
table, and role
- **Storage public bucket warning**: `DROP POLICY` uses `ident()` for
policy name
- **View security autofix modal**: `ALTER VIEW` uses `ident()` for
schema and view name
- **API settings**: `CREATE SCHEMA` mutation uses `safeSql` tagged
literal
- **Database event trigger delete**: `DROP EVENT TRIGGER` uses `ident()`
for trigger name
- **Database queues query**: queue list query uses `safeSql` tagged
literal
- **Role impersonation**: function invocation SQL uses `ident()` and
`literal()`
## Manual testing checklist
- Authentication > Policies
- Authentication > Hooks
- Integrations > Queues
- Database > Event Triggers
- Integrations > Cron Jobs
- Table Editor > View entity security autofix
- API Settings > expose schema
- Linter > GraphQL exposure CTA
- Docs > table/column description editor
- Role impersonation (user impersonation panel)
## Additional context
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Refactor**
* Replaced ad-hoc SQL string building with a safer, fragment-based SQL
construction across auth, policies, integrations, storage, and DB
operations to improve SQL safety while preserving behavior.
* **Bug Fixes / UX**
* Policy editor and code editor now propagate role and input changes
more reliably, improving editor responsiveness and policy handling
without UI changes.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Style**
* Refined layout styling in the authentication hook interface to
optimize flex container behavior for improved responsiveness and visual
alignment.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
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>
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.
## Problem
We used to have a `_Shadcn_` suffix for all the shadcn form components
because we also had `formik` form components.
This is not needed anymore.
## Solution
- Remove the suffix
- Update all usages
## What kind of change does this PR introduce?
UX consistency improvement. Updates DEPR-355.
## What is the current behavior?
Discard-confirm close behavioir is implemented inconsistently across
Studio forms:
- some sheets/dialogs used `useConfirmOnClose`
- some duplicated local `CloseConfirmationModal` components
- some (e.g. `CreateHookSheet`) closed unconditionally and could lose
unsaved changes
## What is the new behavior?
Extracts and validates a reusable discard-close pattern for
dialogs/sheets
- enhances `useConfirmOnClose` with `handleOpenChange(open)` for
`Dialog`/`Sheet` `onOpenChange`
- adds shared `DiscardChangesConfirmationDialog` (`AlertDialog`-based,
override-able copy)
- migrates:
- `InviteMemberButton`
- `CreateHookSheet`
- `EditSecretSheet`
This standardizes close-guard behavior for
backdrop/escape/close-button/cancel-button flows without trying to block
route changes or arbitrary unmounts.
## Additional context
`CreateHookSheet` now also marks the generated secret action as dirty
(`setValue(..., { shouldDirty: true })`) so the discard guard behaves
correctly.
- Added tests for `useConfirmOnClose` covering:
- clean vs dirty close
- handleOpenChange(true|false)
- confirm/cancel behavior
- latest callback ref behavior
A follow-up PR is needed to migrate remaining duplicated
`CloseConfirmationModal` usages and older `useConfirmOnClose` call sites
to the shared `DiscardChangesConfirmationDialog` + `handleOpenChange`
pattern.
---------
Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
## Context
Related to FE-2461
Just following from the previous part
[here](https://github.com/supabase/supabase/pull/41819)
PR removes the usage of `useQueryStateWithSelect` in
- Publishable API Keys (Delete)
- Secret API Keys (Delete)
- Auth Hooks (Edit)
- Database Indexes (Edit + Delete)
-
Ensures that the appropriate behaviours are in place too
- Toast should show when landing on a page with an invalid ID param that
entity doesn't exist
- Toast should not show when deleting the param (which
useQueryStateWithSelect was using useRef as a workaround prior)
## To test
- [ ] API keys (Both publishable and secret key)
- URL updates when deleting a key
- Refresh the page, delete dialog should open with the right key
- Update the query param to something invalid, should see the "not
found" toast
- Delete a key, should only see a success toast
- [ ] Auth Hooks
- URL updates when adding / edit a hook
- Refresh the page, panel should open with the right hook
- Update the query param to something invalid, should see the "not
found" toast
- [ ] Database Indexes
- URL updates when editing/deleting an index
- Refresh the page, delete dialog should open with the right index
- Update the query param to something invalid, should see the "not
found" toast
- Delete an index, should only see a success toast
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Bug Fixes**
* Improved error handling and user notifications when API keys, hooks,
or indexes are deleted or become unavailable; users now see clear toasts
when a target item cannot be found.
* **Refactoring**
* Internal state and dialog visibility handling for API keys, hooks, and
database indexes have been simplified to make UI flows more reliable and
consistent.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
---------
Co-authored-by: Ali Waseem <waseema393@gmail.com>
* Popover ui component to use portal by default, remove all manual declaration of portal for PopoverContent in dashboard
* Forgot to add ui changes lol
* Clean uop
* Bump the deps, refactor deprecated code.
* Migrate keepPreviousData usage.
* Migrate all uses of InfiniteQuery.
* Fix refetchInterval in queries.
* Migrate all use of isLoading to isPending in mutations.
* Fix accessing location in claim-project.
* Fix a bug in duplicate query keys.
* Migrate all queries to use isPending.
* Revert "Fix accessing location in claim-project."
This reverts commit 2a07df64b5.
* Revert the rss.xml file to master.
* Update Supabase docs URLs to use env variable
Co-authored-by: a <a@alaisteryoung.com>
* Refactor: Use DOCS_URL constant for documentation links
This change centralizes documentation links using a new DOCS_URL constant, improving maintainability and consistency.
Co-authored-by: a <a@alaisteryoung.com>
* Refactor: Use DOCS_URL constant for all documentation links
This change replaces hardcoded documentation URLs with a centralized constant, improving maintainability and consistency.
Co-authored-by: a <a@alaisteryoung.com>
* replace more instances
* ci: Autofix updates from GitHub workflow
* remaining instances
* fix duplicate useRouter
---------
Co-authored-by: Cursor Agent <cursoragent@cursor.com>
Co-authored-by: alaister <10985857+alaister@users.noreply.github.com>
* Update perms checking in audit logs
* Deprecate useCheckPermissions, useIsPermissionsLoaded and useCheckProjectPermissions as they're no longer used
* Rename useAsyncCheckProjectPermissions to useAsyncCheckPermissions
* Fix TS
* Part 1 of swapping useCheckPermissions with useAsyncCheckProjectPermissions
* Update apps/studio/hooks/misc/useCheckPermissions.ts
Co-authored-by: Drake Costa <drake@saeris.io>
* Address feedback
---------
Co-authored-by: Drake Costa <drake@saeris.io>
* Replace all usage of useProjectContext with useSelectedProjectQuery
* Replace all usage of useSelectedProject with useSelectedProjectQuery
* Replace all usage of useProjectByRef with useProjectByRefQuery
* Replace all usage of useSelectedOrganization with useSelectedOrganizationQuery
* Deprecate useSelectedProject, useSelectedOrganization, and useProjectByRef hooks
* Deprecate ProjecContext
* feat: add documentation and UI integration for Before User Created hook
- Added new guide: `before-user-created-hook.mdx`, documenting usage, inputs,
outputs, and multiple complete examples for HTTP and SQL.
- Updated navigation menu and hook index table to include the new hook.
- Hook is now listed as available on Free and Pro plans.
Studio changes:
- Registered `Before User Created` hook in `hooks.constants.ts` with proper
title, slug, and configuration keys.
- Enabled Docs button linking to hook guide in both `CreateHookSheet` and `HookCard` components.
- Extended hook listing page to support docs access via `secondaryActions`.
This hook allows developers to intercept and reject user creation across all
flows (email/password, OAuth, SSO, SAML, anonymous) - enabling custom signup
logic like domain allowlists, geofencing, or account gating.
* fix: add subnet to mdx lint allowed list
* fix: incorporate feedback and spelling changes
* feat: add allow/deny domain and CIDR examples to before-user-created hook
This commit enhances the documentation for the before-user-created auth hook:
- Adds production-ready SQL examples for blocking or allowing signups by email domain (signup_email_domains) and IP address or CIDR (signup_networks)
- Introduces enum-based classification (allow vs deny) for both domain and network restrictions
- Adds full migration-style snippets for easy copy/paste into Supabase SQL Editor
- Includes updated HTTP examples that delegate to Postgres functions via Supabase client rpc()
- Adds environment setup guidance and edge function scaffolding
* fix: pnpm format
---------
Co-authored-by: Chris Stockton <chris.stockton@supabase.io>
* Consolidate copy to clipboard
* Fix
* Fix some extra clipboard events.
* Fix the tests. Fix a small issue with the copy button.
* Fix
---------
Co-authored-by: Ivan Vasilov <vasilov.ivan@gmail.com>
* fix schema selector in create fn sheet
* fix schemaselctor in auth hook
* add portal false to schemaselector in sqlfunction for cronjobs
* Fix schema selector in function sheet
---------
Co-authored-by: Terry Sutton <saltcod@gmail.com>
* Downgrade and fix radix dialog version to 1.0.5, and remove unnecessary modal props from all usages of DropdownMenu
* Downgrade and fix radix dialog version to 1.0.5, and remove unnecessary modal props from all usages of DropdownMenu
* Fix PopoverPOrtal
* Fix
* all settings moved into the right places
* clean a few things up
* update ui for auth settings
* more updating
* rearrange settings
* Update SmtpForm.tsx
* updated styling
* add old auth page to show links
* add copy
* udpate copy
* smtp links
* auth fixes
* Smol fix
* Another smol fix
* Fix tab page menu selection
* Add missing border
* Gah one last one
* Smol improvement for redirects from settings/auth to use id
* Update apps/studio/components/layouts/AuthLayout/AuthLayout.utils.ts
Co-authored-by: Kang Ming <kang.ming1996@gmail.com>
* Update apps/studio/pages/project/[ref]/auth/mfa.tsx
Co-authored-by: Kang Ming <kang.ming1996@gmail.com>
* Update apps/studio/pages/project/[ref]/auth/mfa.tsx
Co-authored-by: Kang Ming <kang.ming1996@gmail.com>
* remove recommendation
---------
Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
Co-authored-by: Kang Ming <kang.ming1996@gmail.com>
* Deprecate enableFreeSupport flag
* Deprecate enableExperimentalTheme flag and ThemeSettingsOld component
* Deprecate httpsAuthHooksEnabled flag
* Deprecate thirdPartyAuth flag
* Deprecate logdrains flag
* Deprecate enableNewRegions flag
* Deprecate cronUi flag
* Deprecate queues flag and old ProjectIntegrationsLayout folder
Gildas Garcia