## 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>
- Persist the list/grid view in a cookie so the server renders the chosen view
on first paint (no localStorage hydration flicker); index/category/author
pages read it and become dynamically rendered
- Add in-category client-side search to category pages via a new BlogFilters
onSearch mode
- Rebuild the author page to match the /blog layout: header, divider, search
aligned with the list/grid toggle; drop the old DefaultLayout (fixes the
duplicate navbar) and old container
- Extract the shared BlogViewToggle used by BlogFilters and the author page
- Category filters now navigate to the statically generated
/blog/categories/<category> pages (prefetched) instead of client-side
?category= filtering — removes the skeleton flash
- Move the featured hero into the persistent blog layout and collapse its
height between /blog and category routes so content slides up/down smoothly
- Exclude the hero's featured + secondary posts from the index list (fix dup)
and correct the load-more offset
- Set blog thumbnails to the OG 1.91:1 ratio; drop FeaturedThumb min-height
- Match the list/grid toggle radius to the search input; fix category top-bar
spacing; mark the collapsed hero inert
- Run prettier on 23 www files flagged by CI format check
- Fix generic type args: Record, ReturnType<typeof setInterval/setTimeout>
- Type optional `badge` field on database HighlightsSection data
- Pass canvas as parameter to async init in PostgresGlow to preserve null narrowing
- Accept readonly arrays in VisualDemo's pick<T>()
- Guard BlogPostRenderer hero image render on imageUrl presence
Render blog posts on server so they are available in initial HTML
response.
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* New collapsible sections for blog content
* Server-side MDX compilation for blog posts
* Improved TOC extraction producing both structured JSON and markdown
* **Refactor**
* Blog rendering converted to a server-rendered flow with unified MDX
components
* Tag handling normalized for related-post matching
* **Bug Fixes**
* Consistent image/self-closing tag normalization and corrected TOC
indentation
* Errors are now surfaced instead of being swallowed
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
www pages that use DefaultLayout are bailing out of SSR because of
useSearchParams. Removing the useSearchParams opts more pages (including
the pricing page) into SSR.
_However_, it breaks the build because once blog pages are opted into
SSR, they fail due to next-mdx-remote/codehike incompatibilities. So we
also need to opt blog pages back _out_ of SSR using next/dynamic. This
reproduces previous behaviour for the blog.
Also had to remove suspense wrapper around everything because that was
causing the content div to be streamed in a hidden later chunk
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **New Features**
* Added support for the Contribute section with improved state
management integration.
* **Performance Improvements**
* Optimized blog post rendering with client-side enhancements.
* Improved navigation and layout loading strategies.
* **Refactor**
* Simplified provider architecture for better maintainability.
* Restructured internal component organization.
<!-- 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.
- CustomerStoriesSection: animated accordion with brand colors
(black/dark panels for Resend/Hyper/Mobbin, muted rust for Firecrawl,
muted amber for E2B), raw brand-color icons for Firecrawl/E2B, author
avatar ring, consistent padding
- AI builder section: photo background cards for Lovable/Bolt,
full-width logo strip (Lovable, Figma, v0, Bolt, Tempo, Gumloop, Pika,
Udio)
- Blog: remove borders/grid lines, narrower featured post, smaller title
text, image border, restored list padding
- Footer: replace large SOC2/HIPAA seal section with compact footnote
next to copyright
- Fix icon SVG viewBoxes (Resend, E2B) and add brand fill color to E2B
icon
## I have read the
[CONTRIBUTING.md](https://github.com/supabase/supabase/blob/master/CONTRIBUTING.md)
file.
YES/NO
## What kind of change does this PR introduce?
Bug fix, feature, docs update, ...
## What is the current behavior?
Please link any relevant issues here.
## What is the new behavior?
Feel free to include screenshots if it includes visual changes.
## Additional context
Add any other context or screenshots.
---------
Co-authored-by: Claude Sonnet 4.6 <noreply@anthropic.com>
## What kind of change does this PR introduce?
- Bug fix that resolves DEPR-396
- Additional improvements to blog post image handling
## What is the current behavior?
Blog post Open Graph metadata often prefers `imgThumb` over `imgSocial`,
so social previews on X, iMessage, and similar surfaces can render the
on-site thumbnail instead of the intended social image.
The image selection and path-normalization rules are also duplicated
across blog surfaces, which makes the precedence rules easy to drift.
## What is the new behavior?
- Centralizes blog image handling in `apps/www/lib/blog-images.ts`
- Uses `imgSocial` first, then `imgThumb`, for blog OG/Twitter metadata
- Uses `imgThumb` first, then `imgSocial`, then the placeholder, for
blog thumbnails and post hero images
- Normalizes relative blog image paths into absolute URLs for metadata
- Adds warning-only validation during content reads/builds for partial
or malformed `imgSocial` / `imgThumb` config
- Updates a few recent blog posts so `imgThumb` is a thumbnail-only
asset instead of duplicating the social image
## Additional context
- Replaces #42319 with the additional above fixes
- Added unit coverage for the shared image helper
---------
Co-authored-by: Alan Daniel <stylesshjs@gmail.com>
This PR removes all CMS code from the `www` app. This includes fetching
of blog posts, API routes for proxying blog posts and types.
All functionality should remain the same (and the number of blog posts
should be the same).
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Chores**
* Removed CMS integration, APIs, preview/draft/revalidate endpoints,
related env vars and dependency; switched to static markdown-only blog
pipeline.
* **Refactor**
* Simplified image and author resolution, tightened component props to
static post shapes, and migrated imports to path aliases.
* **Documentation**
* Deleted CMS integration docs and rich-text conversion helpers.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
## What kind of change does this PR introduce?
Frontmatter name change.
## What is the current behavior?
We repeatedly mistake `thumb` for `image` and visa versa, meaning the
wrong images are used for Open Graph and in-site thumbnails on blog
posts. Events and case studies use the same naming convention too.
## What is the new behavior?
These two bits of frontmatter are renamed for clarity:
- Blog posts: `imgThumb` + `imgSocial`
That mapping for blog posts:
- `thumb` is now `imgThumb`
- `image` is now `imgSocial`
These related bits remain as-is:
- Events
- Case studies
The
[www/README.md](https://github.com/supabase/supabase/blob/dnywh/chore/blog-image-frontmatter/apps/www/README.md#best-practices)
file has been expanded to clarify all of the above. It now also provides
instructions on image optimisation.
## To test
A lot of files were touched here. Please help make sure:
- [ ] The CMS works as intended. This is the **biggest unknown**.
- [x] All blog posts render the correct image as their on-site thumbnail
and Open Graph image. You can test the latter by firing up a draft
iMessage. Online Open Graph services like Facebook cache images, so
aren’t reliable.
- [x] All events render their correct images
- [x] All case studies render their correct images
- [x] All customer stories render their correct images ([known
issue](https://supabase.slack.com/archives/C072FL5KKKP/p1768888063209359?thread_ts=1768885681.502169&cid=C072FL5KKKP),
predates this work)
* show cms blog posts in www
* remove contentlayer from www
* outputFileTracingExcludes
* update remotePatterns
* fetch cms posts server-side with revalidation
* add cms env vars to turbo.json
* add www env vars to turbo.json
* include cms posts in www sitemap
* add migration to remove image from cms post
* update cms meta image mapping in www
* d5
* feat: database.build v2 blog post
* light mode images
* change hero to database.build v2
* add back Redesign section to blog post
* fix(blog): special characters
* feat(blog): add youtube video
* feat(blog): update post title
* wide blog images
* sets up the wrap up post
* fix attribute
* feat(blog): mention wasm pg_dump
* edits
* images
* Adds OG and thumb
* grammar
* blog assets
* mobile fix
* add video to launch week page
* prettify
* is
* hackathon link
---------
Co-authored-by: Francesco Sansalvadore <f.sansalvadore@gmail.com>
Co-authored-by: Greg Richardson <greg.nmr@gmail.com>
Co-authored-by: Copple <10214025+kiwicopple@users.noreply.github.com>
Co-authored-by: Julien Goux <hi@jgoux.dev>
Co-authored-by: Jonathan Summers-Muir <MildTomato@users.noreply.github.com>
* init features page
* fix filtering
* seo boostg
* add features to sitemap
* update copywriting
* improve features descriptions
* more studio features
* moar featuress
* better back to features
* prev next feature nav
* clean
* improve page footer
* fixes
* stuff
* sync filters with query params on page load
* better mobile layout
* 16px mobile input fontsize
* add cover images or videos to features
* improve a11y
* update sitemap
* last changes
* update schema definitions
* Add lucide-react to docs (to make the autocomplete work).
* Migrate the docs app icons.
* Migrate the ui-patterns.
* Remove the old icons from ui package.
* Migrate the www app from react-feather icons.
* Migrate all of studio icons.
* Migrate the only component in design-system.
* Fix an old import in ui package. Revert an import in docs app.
* Fix some pages in www.
* Remove unneeded files used in generation of icons.
* Fix a prettier error.
* Fix more issues in www.
* Fix an issue in Log Date picker.
* Replace all string sizes with number sizes because the icons grew in some cases.
* Fix more imports in security page.
* Fix an extra import.
* Remove the size prop from all icons if they're in a button and they match the button size.
* Minor fixes for docs and www.
---------
Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
* add contentlayer2 to www
* remove authorURL from blog post meta
* latest blog posts in Developers dropdown menu
* parse blog slug in contentlayer
* change next config plugins order
* contentlayer build in www package.json
* contentlayer2
* contentlayer2 build on typecheck in www
* remove comment
* Update package-lock.json
* revert npm package version
* Update package-lock.json
---------
Co-authored-by: Jonathan Summers-Muir <MildTomato@users.noreply.github.com>
* d5 announcements
* Adds both posts
* Add YC logo
* change names
* fix slugs
* Adds content
* images
* Update Quote.tsx
* clarity
* d5 assets
* banner link
* ga link in footer
* Grammar and spelling
* move image up for consistency
* grammar
* fix my mistake
* markdown formatting
* Fix details tag
* blog img optimizations
* blog img optimizations
* fix blog link
---------
Co-authored-by: Copple <10214025+kiwicopple@users.noreply.github.com>
Co-authored-by: Jonathan Summers-Muir <MildTomato@users.noreply.github.com>
Co-authored-by: Terry Sutton <saltcod@gmail.com>
* set up multiple themes in studio
* set up multiple themes in studio
* set up multiple themes in docs and www
* update all resolvedTheme to also include deep-dark
* update all resolvedTheme checks to also include deep-dark
* update tailwind.config.js tokens
* update tailwind.config.js tokens
* update leftover scale12 token
* update if resolvedTheme _doesn't_ include 'dark'
* update more styling tokens
* add dynamic themes to CmdK
* fix nav and footer for multi theme
* add data-theme selector output to transformTokens.js
* update code-hike.css to target data-theme css
* update tailwindcss to ^3.3.5
* ThemeImage with light and dark src for www and docs
* add brand-button styling token
* update old dark theme boolean
* update old dark theme boolean
* make homepage product visuals themeable
* update product page themed images
* update badge green with brand
* fix roles list appearance
* fix auth widget in auth page
* update more dark logic
* update more dark logic
* add button default bg and border
* update pricing page theme styling
* clean up Themeimage
* remove forceDark in homepage
* update dark:border-dark occurrences
* update dark:border-dark occurrences
* fix dark mode base colors
* remove foreground-strong
* fix notification badge bg
* remove some dark: selectors
* update dark: selectors
* update code-hike deep dark bg color
* fix comment typo
* update border-button-hover token
* fix customer story logo
* remove some more dark: selectors
* restore forceDark in www homepage
* fix auth react icon
* fix homepage product visuals
* remove theme
* add brand-link token
* fix checkbox bg
* npm install
* more visible EntityListItem active bg
* fix --background-alternative-default css vars
---------
Co-authored-by: Jonathan Summers-Muir <MildTomato@users.noreply.github.com>
Francesco Sansalvadore