Upgrade example app to Next.js 16, React 19, and AuthKit v4 (AUTH-6473)

[Rmole57]

Summary

Upgrades the example app from Next.js 14.1.4 to 16.2.12, which pulls React 19 and
majors of both WorkOS SDKs along with it. All required migrations are applied here.

Dependencies

Package	From	To
next	14.1.4	16.2.12
react / react-dom	^18	^19.2.0
@workos-inc/authkit-nextjs	0.4.2	^4.3.0
@workos-inc/node	^6.7.0	^10.8.0
eslint	^8	^9
eslint-config-next	14.1.4	16.2.12
@types/react / @types/react-dom	^18	^19

Breaking changes handled

Next.js 16

• src/middleware.ts → src/proxy.ts, authkitMiddleware → authkitProxy. Next 16 errors (E900) if both files exist.
• Async request APIs are no longer available synchronously: searchParams is now Promise<…> in 7 pages, and cookies() is awaited in with-session/auth.ts. reset-password/page.tsx is a Client Component, so it unwraps via use(searchParams).
• next lint was removed: .eslintrc.json → eslint.config.mjs (flat config), lint script is now plain eslint.
• tsconfig: target es5 → ES2017; Next's build also requires jsx: react-jsx and adds .next/dev/types.

React 19

• useFormState (react-dom) → useActionState (react) across 8 components.

authkit-nextjs v4

• getUser() → withAuth(); added the now-required AuthKitProvider to the root layout.
• Renamed WORKOS_REDIRECT_URI → NEXT_PUBLIC_WORKOS_REDIRECT_URI in .env.local.example and in using-hosted-authkit/README.md. v4 reads only the prefixed name.
• getSignInUrl() writes a PKCE cookie, so Next 16 forbids calling it during render. The with-nextjs example now signs in via a POST Server Action instead of an <a href>.

@workos-inc/node v10

• workos.mfa → workos.multiFactorAuth; userManagement.enrollAuthFactor → multiFactorAuth.createUserAuthFactor; sendMagicAuthCode → createMagicAuth.

Behavior change worth a look

sendPasswordResetEmail is gone. Its replacement, createPasswordReset, dropped the passwordResetUrl input and no longer sends an email — it mints the token and returns it, so delivery is now the application's responsibility. The example renders a labelled link to keep the flow clickable, and comments on why a real app must email the token instead. This is the one place where the example demonstrates something different than before, so it may warrant a product call rather than just a mechanical migration.

Also in this PR

• Switched to npm as the single package manager: yarn.lock removed, package-lock.json added, README install step updated. The committed yarn.lock was in Yarn Berry format while Yarn 1 is what most environments resolve, so installs had been rewriting it inconsistently.
• Added JWT_SECRET_KEY to .env.local.example — the with-session example already required it but it was undocumented.

Upgrading an existing local checkout

Only one step isn't covered by this PR, because the file is gitignored: rename WORKOS_REDIRECT_URI to NEXT_PUBLIC_WORKOS_REDIRECT_URI in your own .env.local (the value is unchanged). The old name is silently ignored, so auth fails with no clear error.

Testing

• tsc --noEmit clean
• eslint clean
• next build green — 29/29 routes, proxy.ts detected
• Dev smoke test: routes return 200; the reset-password flow renders correctly with and without a token

Closes AUTH-6473

[linear-code]

AUTH-6473

AUTH-6743

[greptile-apps]

Greptile Summary

Upgrades the example application to Next.js 16, React 19, AuthKit v4, and WorkOS Node v10.

• Migrates request APIs, middleware, authentication helpers, server actions, and MFA calls to their new interfaces.
• Adds the AuthKit provider and updates environment-variable documentation.
• Migrates ESLint configuration and standardizes dependency installation on npm.
• Revises the password-reset example so reset tokens remain server-side and are logged only during development.

Confidence Score: 5/5

The PR appears safe to merge.

No blocking failure remains; the reset token is no longer returned or rendered for unauthenticated requesters, and the remaining token log is restricted to development.

Important Files Changed

Filename	Overview
src/app/using-your-own-ui/reset-password/reset-password.ts	The reset token is no longer returned to the browser, and its development convenience log is now excluded from production.
src/app/using-your-own-ui/reset-password/page.tsx	The page now gives an account-neutral confirmation without rendering the newly minted reset token.
src/app/layout.tsx	The root layout adds the provider required by AuthKit v4.
src/proxy.ts	The authentication middleware is migrated to the Next.js 16 proxy convention.
package.json	Framework, SDK, React, TypeScript, and lint dependencies are upgraded for the new runtime.
eslint.config.mjs	Legacy ESLint configuration is replaced with the flat configuration required by the upgraded tooling.

_{Reviews (3): Last reviewed commit: "Update src/app/using-your-own-ui/reset-p..." | Re-trigger Greptile}

[Rmole57]

@greptileai update

[Rmole57]

@greptileai update