This PR removes all `paths` in `tsconfig.json` for all apps and
packages. They were added previosly because some of the components had a
`_Shadcn` suffix because of an ongoing migration. How that the migration
is done, the paths can be removed.
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Refactor**
* Standardized shared UI component, utility, and icon imports across
design-system examples and application screens.
* Simplified shared component access and project configuration.
* Added shared access to anchor-link helpers and animation styles.
* **Compatibility**
* Updated component exports and imports without changing existing
behavior.
* No changes to user-facing workflows, screens, or functionality.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
Fixes FE-4128.
## What is the current behavior?
When updating the global Storage file size limit using a unit other than
MB, the selected unit displays an incorrect value after navigating away
from the Storage settings page and returning.
The updated file size is persisted correctly by the API, but the unit
selector does not always reflect the value derived from the persisted
configuration.
The Save button also remains enabled after successfully saving the
updated configuration.
## What is the new behavior?
The file size unit selector now correctly reflects the unit derived from
the persisted global file size limit after saving and navigating between
pages.
The form state is also correctly synchronized with the latest Storage
configuration after an update, so the Save button returns to its
disabled state once the changes have been persisted.
## Additional context
The Storage API persists the global file size limit in bytes rather than
persisting the selected display unit separately. The dashboard derives
the appropriate unit (MB/GB) from the stored byte value when loading the
configuration.
The issue was caused by the unit Select retaining stale internal state
when the form values were reset after the Storage configuration was
loaded/refetched. Ensuring the Select is refreshed when the controlled
unit changes keeps the displayed unit synchronized with the form state.
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Bug Fixes**
* Improved storage settings form initialization when configuration and
entitlements load.
* Ensured storage unit selections and placeholders display consistently.
* Improved form resetting to reflect the latest loaded settings.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## Context
Replaces all usage of `form.watch()` to use `useWatch` instead + follows
the "name what you watch" convention as specified in the react-hook-form
skills.
There's also a small refactor in `SmtpForm.tsx` which removes the
unnecessary use of a `useState` to track if SMTP is enabled or not
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Improvements**
* Updated many Studio forms to watch specific fields more precisely,
improving live UI updates for previews, warnings, conditional sections,
and validation messages.
* Enhanced responsiveness across settings, authentication, billing,
storage, integrations, and support flows while keeping save/update
behavior the same.
* **Refined Experiences**
* Improved the analytics table creation flow with tighter, enum-based
column type validation and structured, type-specific column options.
* **Preserved Behavior**
* Maintained existing permission checks, submission flows, and
account-management workflows.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
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>
## 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 -->
## Context
Cleans up a number of stale feature flags that have been enabled for all
users for more than 3 months
- enableSmartRegion
- SentryLogDrain
- axiomLogDrain
- S3logdrain
- Last9LogDrain
- otlpLogDrain
- ShowPrettyExplain
- pgdeltaDiff
- CustomOauthProviders
- timezonePicker
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* Timezone selector is now always available in the user menu.
* Log drain “Type” options are expanded in the creation flow.
* Custom auth providers now appear when the custom providers setting is
enabled.
* **Bug Fixes**
* Smart region selection and related queries now follow the selected
cloud provider.
* PG Delta Diff preview availability and SQL editor “EXPLAIN” routing
now follow the latest enabled settings (including platform-only preview
behavior).
* **Changes**
* Removed the Storage List-V2 migration callout from the Storage
settings page.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## 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
## Problem
Knip reports many duplicate exports (both named and default). Besides,
we're moving away from default exports and even have an eslint rule to
enforce it on new code.
## Solution
- Cleanup those exports
- Update imports when necessary
No functional changes. If it builds, it's fine
## Context
Storage settings "Global file size limit" field goes off the card on
smaller viewports
<img width="1592" height="1258" alt="image"
src="https://github.com/user-attachments/assets/bdc58ff1-f54a-4e09-adc8-79c8a1a0b3f1"
/>
Just removes a className on the FormItemLayout that's causing it - have
verified that doesn't cause other issues
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Style**
* Updated the layout configuration of the Global file size limit field
in Storage Settings.
<!-- 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>
## Problem
The `_Shadcn_` suffix isn't needed anymore on `Select` components
## Solution
Remove it. No other changes
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Refactor**
* Updated internal component architecture to standardize and simplify
the codebase. These changes improve code maintainability and consistency
across the application without affecting existing functionality or user
experience.
<!-- review_stack_entry_start -->
[](https://app.coderabbit.ai/change-stack/supabase/supabase/pull/45988)
<!-- review_stack_entry_end -->
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
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>
## 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
## TL;DR
fixes an inconsistent UI state where the image transformations toggle
could appear enabled + blur
even when the feature is unavailable for that account
## ex:
| Before | After |
| --- | --- |
| enabled and blurred | disabled and blurred |
| <img width="1295" height="389" alt="Before: image transformations
toggle appears enabled while blurred"
src="https://github.com/user-attachments/assets/2f9617b3-9f45-4cdd-8ba7-a360e1ba9754"
/> | <img width="1316" height="386" alt="After: image transformations
toggle appears disabled and blurred"
src="https://github.com/user-attachments/assets/f6be26fd-1390-49c9-b30c-880344eaeca8"
/> | |
## ref:
- closes https://github.com/supabase/supabase/issues/44844
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Bug Fixes**
* Fixed the image transformation toggle so it visually reflects both the
user's entitlement and the saved setting, ensuring the control
accurately shows when the feature is available and enabled.
* Preserved the existing disabled behavior for users without access or
update rights so functionality remains unchanged.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## Context
Resolves FE-2923
There's an issue with creating s3 keys in the storage settings at the
moment, where naming your key throws a form field validation error. This
PR fixes that - not sure when this was introduced though, but the main
fix was just using `field` from `render` instead of calling `register`
## To test
- [ ] Verify that you can create an s3 access key via the storage
settings
## Context
Related to FE-2557
Part of shifting manually written dashboard queries into
packages/pg-meta where
- pg-meta can be code owners of
- we can write tests for the queries
This PR just shifts all the `.sql.ts` files that we previously created
into packages/pg-meta
There's still other areas where we need to shift over as well which I'll
address in subsequent PRs
## Notable changes
- `getTableRowsCountSql` -> Opted to shift `formatFilterValue` logic out
before calling this method (ref `table-rows-count-query`)
- `getDeleteOldCronJobRunDetailsByCtidSql` -> Opted to shift
`validatePageNumber` logic out before calling this method (ref
`CronJobsTab.useCleanupActions`)
Add entitlement check for storage image transformations to properly
control access based on organization's plan.
### Changes
- Add `storage.image_transformations` entitlement check to Storage
Settings
- Add `storage.max_file_size.configurable` entitlement check to Storage
Settings
- Disable image transformation toggle based on entitlement instead of
just free tier check
- Wait for entitlement loading before initializing form values
- Use entitlement value as fallback when setting default
imageTransformationEnabled state
- Consolidate all loading states into a single isLoading variable for
cleaner code
### Testing
- Head to `/project/_/storage/files/settings` with an Org on the Free
Plan
- Assert that the Image Transformations toggle is disabled
- Head to `/project/_/storage/files/settings` with an Org on the Free
Plan
- Assert that the Image Transformations toggle is enabled
- Toggle it, save and refresh the page to assert that your changes were
correctly saved
## Context
Related to Dashboard Scalability, specifically having Postgres team as
CODEOWNERS for dashboard queries
This is just a clean up as we're currently piling manual queries into
one folder under `data/sql/queries`, whereas I reckon it'll be better
for each query to sit within their RQ folder for better context.
Am opting the naming format for files housing queries to be `*.sql.ts`,
and also updating CODEOWNERS to reflect as such
Next step will also be to shift all the dashboard queries within pg-meta
into studio itself as requested by the pg-meta team
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Refactor**
* Consolidated and reorganized internal module structure for the data
layer to improve maintainability and reduce redundancy.
* Streamlined import paths across components to align with new
consolidated module organization.
* **Chores**
* Updated code ownership patterns to reflect reorganized file structure.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
---------
Co-authored-by: Ali Waseem <waseema393@gmail.com>
## Context
Related prior work was making edge functions page accessible while
project is restoring - however the status of the project gets flipped to
COMING_UP while it's restoring hence why the functions page was still
inaccessible.
## Changes involved
- Update `NavigationBar.utils` to have edge functions link to
`/functions` irregardless of project status
- (Unrelated) Disable (with tooltip) deploy new function CTA on edge
functions page if project is not active
<img width="403" height="108" alt="image"
src="https://github.com/user-attachments/assets/88479247-999b-4d41-a444-6705f8c3993e"
/>
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* Deploy Edge Function button now disables and shows a tooltip when the
project is inactive to make deployment status clear.
* **Bug Fixes**
* Edge Functions link now points consistently to the functions view
regardless of project build state.
* **Refactor**
* Consolidated project-active check and reorganized related UI wiring to
standardize inactive-state handling across settings and controls.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
* Add shimmering-loader CSS to ui-patterns.
* Import the shimmering-loader classes from the ui-patterns component.
* Remove ShimmeringLoader from studio.
* Migrate studio to use ui-patterns/ShimmeringLoader.
* Migrate away from using default import for ShimmeringLoader.
* Fix the css imports in docs and studio.
The global storage size validation depends on an unpaginated buckets
query to determine whether it is lower than any individual bucket's
cutoff. This causes a problem for users with tens of thousands of
buckets.
There's a bit of a UX/performance problem here, because in order to
determine whether any bucket's `file_size_limit` exceeds the global
setting, we need to get the max `file_size_limit` of `storage.buckets`
-- however, that column is not indexed.
My workaround is:
- Below a certain threshold (10,000) buckets, the query for max
`file_size_limit` is automatically run on form submit.
- Above that threshold, the user must confirm whether they want to run
the query. They're still allowed to change the storage config without
running it -- this does open a loophole where they can have a global
storage setting lower than an individual bucket's file size limit, but
though this is a potentially confusing situation, it's not strictly an
error.
---------
Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
* 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.
* init request upgrade plan modal
* Consolidate UpgradeToPro components across UI + use UpgradePlanButton, UpgradePlanButton determines whether to show request upgrade CTA
* Allow to pass icon to Admonition
* Tiny fix on upgrade plan button CTA to consider addons
* Hook up upgrade request endpoint
* Update API types
* remove hardcode
* Add request upgrade CTA in plan side panel
* Fix disk compute
* Show request upgrade button for change to large compute
* Nit
* Fix childProps in Admonition so that they're added as a prop to the main div.
* Replace the admonition with Alert in Wrapper tab page to add a gap between childs.
* Add s3 vectors fdw.
* Minor fix to FormSection.
* Update the fdw mutations to support passing in options.
* Refactor the vector flow to create fdws.
* Revert cron description change.
* If the bucket can't be created, don't create a fdw.
* Update/delete the fdw when deleting a table or a bucket.
* Minor fixes.
* Clean up the delete modal.
* Handle edge cases when missing a wrapper.
* Remove the admonition in the create bucket modal.
* Fix the loading state when creating a bucket.
* Fix the createWrapper sheet to work with s3 vectors.
* Fix undefined wrapperMeta issue.
* Create the schema when installing a wrapper.
* Tiny cleanup.
* Clean up unneeded useState. Create a wrapper only if the all conditions are met.
* Fix all comments.
* Add s3 vectors for docs.
* Add a link and fix the file name for S3 Vectors in docs.
* Hide the table editor button if the wrapper instance is missing.
* Small fixes.
* user newer input in api keys
* user newer input in s3 connection settings
* improve input read-only styles
* make API text selectable
* disable text until reveal button tapped
* fix build
* revert change
* fix other cases
* revert hardcoded example
* nice region field
* documentation
* cleanup
* better docs
* colour tweaks
* fix: add custom message for 404 storage config errors
Added a specific error message "Storage configuration not found." when
the storage config API returns a 404 error code.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
* Add comment
* Nit improve error handling for S3 connection UI
---------
Co-authored-by: Claude <noreply@anthropic.com>
Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
* Add callout for migration
* Update copy
* Update date
* remove docs button
* Fix conditional - storage upgrade prompt should only show if list v2 is false
* 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
