Upgrade Next.js to 15, React to 19 by shilman · Pull Request #410 · storybookjs/web

shilman · 2026-04-13T09:00:49Z

Summary

next ^14 → ^15 (frontpage, addon-catalog, ui)
react/react-dom ^18 → ^19 (all workspace packages)
framer-motion ^11 → ^12
next-plausible ^3 → ^4
@storybook/nextjs ^8.1.1 → ^8.6

Breaking change fixes

Awaited async params in releases/[slug], releases/iframe/[slug], recipes/[...name], docs/[...slug] pages
Awaited headers() in versions route and docs/footer/actions.ts
Extracted getLlmsBannerLines to lib/ (Next.js 15 disallows non-route exports from route files)
Removed JSX.Element return type annotations (@types/react@19 removed global JSX namespace)
Fixed AnimationControls → ReturnType<typeof useAnimation> (framer-motion v12)
Changed transition type: 'pop' → 'spring' (removed in framer-motion v12)
Fixed RefObject<HTMLDivElement> → RefObject<HTMLDivElement | null> (React 19 strictness)
Simplified PlausibleProvider props (next-plausible v4 API change)
Added legacy-peer-deps=true to .npmrc

Test plan

npx tsc --noEmit passes with 0 errors
npx turbo run build --filter=frontpage passes (4/4 tasks successful)
Spot-checked /, /releases/9.1, /recipes/@angular/material, /docs/get-started/why-storybook — all return 200

🤖 Generated with Claude Code

- next: ^14 → ^15 (frontpage, addon-catalog, ui) - react/react-dom: ^18 → ^19 (all workspace packages) - framer-motion: ^11 → ^12 (fix AnimationControls type, 'pop'→'spring', RefObject null) - next-plausible: ^3 → ^4 (add src param, simplify PlausibleProvider) - @storybook/nextjs: ^8.1.1 → ^8.6 - Await async params in releases, recipes, docs slug pages (Next.js 15 breaking change) - Await headers() in versions route and docs footer actions (Next.js 15 breaking change) - Extract getLlmsBannerLines to lib/ (Next.js 15 disallows non-route exports from route files) - Remove JSX.Element return types (@types/react@19 removed global JSX namespace) - Add legacy-peer-deps=true to .npmrc Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

netlify · 2026-04-13T09:00:55Z

✅ Deploy Preview for storybook-addon-catalog ready!

Name	Link
🔨 Latest commit	`8a531f3`
🔍 Latest deploy log	https://app.netlify.com/projects/storybook-addon-catalog/deploys/69dd9f2f5f2f7300099139df
😎 Deploy Preview	https://deploy-preview-410--storybook-addon-catalog.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify project configuration.

netlify · 2026-04-13T09:00:55Z

✅ Deploy Preview for storybook-frontpage ready!

Name	Link
🔨 Latest commit	`8a531f3`
🔍 Latest deploy log	https://app.netlify.com/projects/storybook-frontpage/deploys/69dd9f2f2f4e4000086c3786
😎 Deploy Preview	https://deploy-preview-410--storybook-frontpage.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify project configuration.

Copilot

Pull request overview

Upgrades the monorepo’s web stack to Next.js 15 and React 19 and applies the required breaking-change fixes across apps and shared packages (routing params/headers async changes, React 19 typing strictness, framer-motion v12 changes, and next-plausible v4 updates).

Changes:

Bump Next.js to ^15 and React/ReactDOM + React types to ^19 across workspaces.
Fix Next 15 breaking changes (async params, await headers(), route-file export restrictions) and refactor LLM banner helpers into lib/.
Update framer-motion and analytics integration code to match new APIs/types.

Reviewed changes

Copilot reviewed 24 out of 26 changed files in this pull request and generated 5 comments.

Show a summary per file

File	Description
packages/utils/package.json	Updates React + React type dependencies for workspace compatibility.
packages/ui/src/footer/top-section.tsx	Removes `JSX.Element` return annotation for React 19 typings.
packages/ui/src/dropdown-menu/index.tsx	Removes `JSX.Element` return annotation for React 19 typings.
packages/ui/package.json	Upgrades Next/React/types + next-plausible to match the new stack.
package.json	Adds root-level React/ReactDOM versions for the workspace.
apps/frontpage/package.json	Upgrades Next/React, framer-motion, next-plausible, Storybook Next integration.
apps/frontpage/next.config.js	Updates next-plausible proxy configuration for v4.
apps/frontpage/next-env.d.ts	Adds typed-routes reference for Next-generated route types.
apps/frontpage/lib/get-llms-banner-lines.ts	Extracts LLM banner helper from route file (Next 15 constraint).
apps/frontpage/components/home/share/player.tsx	Updates framer-motion transition type (`pop` → `spring`).
apps/frontpage/components/home/develop/demo/controls.tsx	Updates framer-motion control typing approach for v12.
apps/frontpage/components/home/automate/ui-tests/ui-tests.tsx	Adjusts ref typings for React 19 stricter nullability.
apps/frontpage/components/docs/footer/actions.ts	Awaits `headers()` per Next 15 async request APIs.
apps/frontpage/app/versions/route.ts	Awaits `headers()` per Next 15 async request APIs.
apps/frontpage/app/releases/iframe/[slug]/page.tsx	Updates route `params` handling to async/await pattern.
apps/frontpage/app/releases/[slug]/page.tsx	Updates route `params` handling to async/await pattern.
apps/frontpage/app/recipes/[...name]/page.tsx	Updates route `params` handling to async/await pattern and call sites.
apps/frontpage/app/providers.tsx	Updates Plausible provider usage for next-plausible v4 API.
apps/frontpage/app/llms.txt/route.ts	Removes non-route export and imports extracted helper from `lib/`.
apps/frontpage/app/llms-full.txt/route.ts	Updates import to use extracted LLM banner helper.
apps/frontpage/app/layout.tsx	Removes `JSX.Element` return annotation for React 19 typings.
apps/frontpage/app/docs/[...slug]/page.tsx	Updates route `params` handling to async/await pattern.
apps/addon-catalog/package.json	Upgrades Next/React, framer-motion, next-plausible, React types.
apps/addon-catalog/app/providers.tsx	Updates Plausible provider usage for next-plausible v4 API.
.npmrc	Enables `legacy-peer-deps` to bypass peer dependency conflicts.

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

Copilot · 2026-04-13T09:06:40Z

    "@storybook/addon-essentials": "^8.1.1",
    "@storybook/addon-interactions": "^8.1.1",
    "@storybook/addon-links": "^8.1.1",
    "@storybook/blocks": "^8.1.1",
-    "@storybook/nextjs": "^8.1.1",
+    "@storybook/nextjs": "^8.6",
    "@storybook/preview-api": "^8.1.1",


@storybook/nextjs is bumped to ^8.6, but the other Storybook packages in this app (including storybook itself) remain on ^8.1.1. This version skew commonly triggers peer-dependency conflicts and can lead to hard-to-debug runtime issues; align the Storybook package versions within this workspace to the same minor/patch line.

Copilot · 2026-04-13T09:06:40Z

    "graphql-request": "^7.1.0",
    "human-format": "^1.2.0",
-    "next": "^14.2.4",
-    "next-plausible": "^3.12.0",
+    "next": "^15",
+    "next-plausible": "^4.0.0",
    "next-themes": "^0.3.0",


This workspace upgrades next to ^15, but @next/third-parties remains at ^14.2.4 (see the top of the dependencies list). Please align @next/third-parties to ^15 to match the Next.js major version and reduce risk of incompatibilities.

@copilot apply changes based on this feedback

Updated @next/third-parties from ^14.2.4 to ^15 in apps/addon-catalog/package.json to align with the Next.js major version (commit 8a531f3).

Copilot · 2026-04-13T09:06:41Z

+    "@types/react": "^19",
+    "@types/react-dom": "^19",
    "eslint": "^8",
    "eslint-config-next": "14.2.4",


eslint-config-next is still pinned to 14.2.4 while next is ^15. This can cause lint rule/config mismatches for Next 15 projects; update eslint-config-next (and related Next lint tooling if used) to the matching ^15 major.

Suggested change

"eslint-config-next": "14.2.4",

"eslint-config-next": "^15",

Copilot · 2026-04-13T09:06:41Z

@@ -0,0 +1 @@
+legacy-peer-deps=true


Setting legacy-peer-deps=true changes install semantics globally and can mask real peer-dependency incompatibilities (especially during CI), leading to non-deterministic runtime behavior. Prefer resolving the underlying peer conflicts (e.g., aligning Storybook/Next-related versions) and only use this as a last resort (or document/scoped usage if it must remain).

Suggested change

legacy-peer-deps=true

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

rehype-pretty-code requires shiki as a peer dep, and graphql-request requires graphql. Next.js 15's bundler is stricter about resolving peer deps that aren't explicitly installed. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>

chromatic-com · 2026-04-13T10:52:28Z

Important

UI Tests need review – Review now

🟡 UI Tests: web/frontpage: 3 changes must be accepted as baselines
🟢 UI Review: web/frontpage: 29 stories published -- no changes
Storybook Publish: web/frontpage: 29 stories published

chromatic-com · 2026-04-13T10:55:19Z

Tip

All tests passed and all changes approved!

🟢 UI Tests: web/ui: 11 tests unchanged
🟢 UI Review: web/ui: 11 stories published -- no changes
Storybook Publish: web/ui: 11 stories published

…t-plausible v4) Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

Next.js 15 expects @next/eslint-plugin-next@>=12.3.0 <15.0.0-0 as an optional peer dep. Bumping to ^15 meant it was never installed, which Next.js promotes to a fatal error when CI=true. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

Was missing from the lockfile so npm ci in CI never installed it, causing Next.js to fail with a fatal peer dep error when CI=true. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

Agent-Logs-Url: https://github.com/storybookjs/web/sessions/b82ec22c-2db0-49ca-9604-a5d1c7f43cbb Co-authored-by: shilman <488689+shilman@users.noreply.github.com>

Copilot AI review requested due to automatic review settings April 13, 2026 09:00

Copilot started reviewing on behalf of shilman April 13, 2026 09:01 View session

Copilot AI reviewed Apr 13, 2026

View reviewed changes

shilman and others added 3 commits April 13, 2026 17:59

Move outputFileTracingIncludes out of experimental (Next.js 15)

9cf807e

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

Upgrade other next deps

b88e882

Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>

shilman and others added 6 commits April 13, 2026 18:55

Migrate PlausibleProvider pageviewProps to init.customProperties (nex…

dcd7c82

…t-plausible v4) Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

Update Plausible proxy src to site-specific script URL

c49704b

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

Make it a peer dep

3bc211f

Add @next/eslint-plugin-next@^14 to lockfile

87f5d6e

Was missing from the lockfile so npm ci in CI never installed it, causing Next.js to fail with a fatal peer dep error when CI=true. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

Limit concurrency on SSG

f575558

shilman mentioned this pull request Apr 13, 2026

SSG all tag pages instead of categories only #411

Open

2 tasks

shilman and others added 2 commits April 14, 2026 09:55

Fix plausible proxy

709d4d6

Await async params in addon-catalog pages (Next.js 15)

e7b4cae

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

Copilot started work on behalf of shilman April 14, 2026 01:57 View session

fix: align @next/third-parties to ^15 in addon-catalog

8a531f3

Agent-Logs-Url: https://github.com/storybookjs/web/sessions/b82ec22c-2db0-49ca-9604-a5d1c7f43cbb Co-authored-by: shilman <488689+shilman@users.noreply.github.com>

Copilot finished work on behalf of shilman April 14, 2026 01:58

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Upgrade Next.js to 15, React to 19#410

Upgrade Next.js to 15, React to 19#410
shilman wants to merge 13 commits into
mainfrom
shilman/next-15-upgrade

shilman commented Apr 13, 2026

Uh oh!

netlify Bot commented Apr 13, 2026 •

edited

Loading

Uh oh!

netlify Bot commented Apr 13, 2026 •

edited

Loading

Uh oh!

Copilot AI left a comment

Uh oh!

Uh oh!

Copilot AI Apr 13, 2026

Uh oh!

Copilot AI Apr 13, 2026

Uh oh!

shilman Apr 14, 2026

Uh oh!

Copilot AI Apr 14, 2026

Uh oh!

Copilot AI Apr 13, 2026

Uh oh!

Copilot AI Apr 13, 2026

Uh oh!

chromatic-com Bot commented Apr 13, 2026 •

edited

Loading

UI Tests need review – Review now

Uh oh!

chromatic-com Bot commented Apr 13, 2026 •

edited

Loading

All tests passed and all changes approved!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

Conversation

shilman commented Apr 13, 2026

Summary

Breaking change fixes

Test plan

Uh oh!

netlify Bot commented Apr 13, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

✅ Deploy Preview for storybook-addon-catalog ready!

Uh oh!

netlify Bot commented Apr 13, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

✅ Deploy Preview for storybook-frontpage ready!

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull request overview

Reviewed changes

Uh oh!

Uh oh!

Copilot AI Apr 13, 2026

Choose a reason for hiding this comment

Uh oh!

Copilot AI Apr 13, 2026

Choose a reason for hiding this comment

Uh oh!

shilman Apr 14, 2026

Choose a reason for hiding this comment

Uh oh!

Copilot AI Apr 14, 2026

Choose a reason for hiding this comment

Uh oh!

Copilot AI Apr 13, 2026

Choose a reason for hiding this comment

Uh oh!

Copilot AI Apr 13, 2026

Choose a reason for hiding this comment

Uh oh!

chromatic-com Bot commented Apr 13, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

UI Tests need review – Review now

Uh oh!

chromatic-com Bot commented Apr 13, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

All tests passed and all changes approved!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

netlify Bot commented Apr 13, 2026 •

edited

Loading

netlify Bot commented Apr 13, 2026 •

edited

Loading

chromatic-com Bot commented Apr 13, 2026 •

edited

Loading

chromatic-com Bot commented Apr 13, 2026 •

edited

Loading