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.
This PR moves several components which rely on `next` out of the `ui`
package to the `ui-patterns` package.
`ui-patterns` package is intented to be imported with specific imports
so it's ok if there are components reliant on `next` in there.
The `SonnerToaster` component has removed its dependency by requiring a
prop for `theme`.
## 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?
As we now have the internal error code mapping in `shared-data`, thought
it better to move away from the GraphQL endpoint and leave that for
external use. The error code popovers in studio now rely on shared-data,
meaning instant loads and no rate limiting.
## 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?
Formalising our status code component that was introduced in the new
charts + update auth overview page.
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* Added a StatusCode UI component to display HTTP methods and status
codes with color-coded indicators.
* Added a demo showcasing multiple StatusCode examples and alignment
variants.
* **Documentation**
* Added a documentation fragment and sidebar entry for Status Codes with
a preview of the demo.
* **Refactor**
* Updated an Auth Overview view to use the new StatusCode component for
consistent status rendering.
<sub>✏️ Tip: You can customize this high-level summary in your review
settings.</sub>
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## 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?
This introduces a small snippet preview of the error code coming via our
content API for the docs. This appears in a couple of places right now.
- **Auth Overview** - This page isn't fully released yet, but it appears
on the error codes table (as depicted below).
- **Logs** - When you delve into the logs panel, if there's an error
code available, they're also wrapped in this popover.
We are also working on a shared-data package (#43458) to potentially
replace this endpoint internally. Also introduces a multifaceted button
to debug/fix with either Assistant or LLM of choice.
| Auth Overview | Logs Panel |
|--------|--------|
| <img width="407" height="287" alt="Screenshot 2026-03-09 at 14 14 09"
src="https://github.com/user-attachments/assets/7450dddb-6828-4cd3-802d-37d47ba1b440"
/> | <img width="394" height="216" alt="Screenshot 2026-03-09 at 14 13
56"
src="https://github.com/user-attachments/assets/80c2a46e-dbe4-4e88-a0a7-68b977a71d6b"
/> |
---------
Co-authored-by: Claude Sonnet 4.6 <noreply@anthropic.com>
* feat: replace usage metric cards with new charts
* feat: use new chart components for auth api and error codes
* style: some tweaks to the two tables
* fix: padding around empty states
* feat: smol adjustment
* fix: add aria label to go to logs tooltip
* fix: diff value
* fix: status code method font colour
* fix: actions onClick
* 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.
* feat: rename reports to observability on nav sidebar
* fix: observability route
* feat: observability navigation and redirects
* fix: first time load redirects
* feat: change auth overview reports link
* feat: clean up of other links to observability sections
* fix: query perf redirects
* chore: find exhaustive deps and disable for time being
* fix: charis suggested fixes
* fix: forgotten suggested fix
* chore: delete old reports views files
* fix: paths in reports tests
* fix: url sync useEffect should trigger only once
* feat: reorganise observability sidebar
* fix: data api not being selected
* fix: wrong layout for realitime
* fix: custom reports reloading
---------
Co-authored-by: Charis Lam <26616127+charislam@users.noreply.github.com>
Co-authored-by: Ali Waseem <waseema393@gmail.com>
* feat: overview usage card match homepage
This matches the tiles for auth overview usage to the card styling on the homepage.
* style: smol tweak to card header
* style: table empty state
* style: table row styling
* feat: remove dummy test codes
* chore: remove ai slop empty file
* nit: remove border top from spacer
* chore: remove loading label from table cards
* fix: loading state for stat cards
* style: skeleton loader of cards tidy
* feat: add button to all reports and basic layout
* feat: add last 24 hours indicator
* feat: add active users tile
* feat: working first row of usage stats
* feat: add basic report charts for sign in and sign up
* fix: change prev number to difference from before
* feat: pass time range to view all reports link
* fix: get static numbers to show
* fix: type error
* fix: exclude admin users from active users
* fix: revert change as number stopped working
* feat: testing latest sign ups table
* chore: remove table redoing
* feat: testing with renderers
* feat: revert back to reportchartv2
* feat: make sure sign up and sign in charts are bar by default
* fix: class name for default difference num
* chore: bit of clean up
* chore: tidy up constants file
* chore: remove unused auth renderers
* feat: single query instead of multiple tiny ones
* fix: query fetching
* feat: simplify how the query does averages
* nit: small css bits
* feat: basic auth overview page setup
Adds the route and layout for the Authentication Overview page.
* feat: add feature flag for auth overview
* chore: small clean up
* feat: add overview page header
* feat: create sections for auth overview page
Adds three high level components for the sections of the Auth overview page. Can break down further later
* feat: add conditional redirect for top level sidebar item
This adds a redirect based on whether overview page is enabled or not. For users who dont have it enabled they go to users as default when tapping authentication.
* feat: add redirect if overview is set to false
* fix: add loaded context for feature flag
* chore: clean up scaffolding mark up
* chore: remove unused important
* chore: placeholders for sections
