Upgrade to Next.js 16 and React 19 ✅

Summary

Successfully upgraded the project from Next.js 15.4.2 and React 18.3.1 to the latest versions: Next.js 16.0.1 and React 19.2.0. All builds, linting, and security scans pass successfully.

Completed Tasks

• Update Next.js to 16.0.1
• Update React and React-DOM to 19.2.0
• Update @types/react and @types/react-dom to latest
• Update next.config.js for Next.js 16 (remove deprecated i18n config)
• Update any deprecated experimental flags in next.config.js
• Update @playwright/test to meet Next.js 16 peer dependency requirements
• Update related dependencies if needed
• Run migrations and build to verify compatibility
• Run linter to check for issues
• Fix TypeScript build configuration issues
• Check for any React 19 breaking changes in code
• Run security scan with CodeQL
• Fix Dockerfile to use npm commands instead of yarn

Versions Updated

Core Framework:

• Next.js: 15.4.2 → 16.0.1 ✅
• React: 18.3.1 → 19.2.0 ✅
• React-DOM: 18.3.1 → 19.2.0 ✅
• @types/react: 18.3.23 → 19.2.3 ✅
• @types/react-dom: 18.3.7 → 19.2.2 ✅

Development Tools:

• @playwright/test: 1.35.1 → 1.56.1 ✅
• eslint: 8.49.0 → 8.57.1 ✅
• eslint-config-next: 13.5.2 → 15.5.6 ✅

Configuration Changes

• ✅ Removed experimental.serverActions (now stable and enabled by default)
• ✅ Removed i18n config (not supported in App Router)
• ✅ Removed serverRuntimeConfig (deprecated in Next.js 16)
• ✅ Updated images.domains to images.remotePatterns (domains deprecated)
• ✅ Added turbopack: {} to silence Turbopack warning for webpack config
• ✅ Updated build script to use --webpack flag (next-pwa requires webpack)
• ✅ Updated lint script to use eslint directly (next lint command removed in v16)
• ✅ Updated .eslintrc.json to ignore test fixtures and hold folder
• ✅ Updated tsconfig.json jsx to react-jsx (automatically by Next.js 16)
• ✅ Created tsconfig.migrations.json and tsconfig.bin.json for CLI builds
• ✅ Updated Dockerfile to use npm run instead of yarn commands

Validation Results

• ✅ Linting passes with no errors
• ✅ Production build succeeds with webpack mode
• ✅ Dev server starts successfully
• ✅ TypeScript compilation works for all scripts
• ✅ No React 19 breaking changes detected in codebase
• ✅ CodeQL security scan passed with 0 alerts
• ✅ Dockerfile updated for npm compatibility

Notes

• ESLint Version: Using ESLint 8.57.1 with eslint-config-next 15.5.6 because eslint-config-next 16.x has compatibility issues with both ESLint 8 and 9. This is a known issue and the current setup is functional.
• Webpack Mode: Using --webpack flag for builds because next-pwa plugin requires webpack. Turbopack is the default in Next.js 16 but not compatible with webpack plugins yet.
• TypeScript Configs: Created separate tsconfig files for migrations and CLI tools to properly inherit React JSX types after the jsx mode change to react-jsx.
• Dockerfile: Updated to use npm commands since project uses package-lock.json instead of yarn.lock.

Docker Build Note

The Dockerfile has been fixed to use npm run commands (was using yarn). If you encounter Alpine package repository network errors during build, this is an infrastructure/network issue accessing dl-cdn.alpinelinux.org, not a code issue. The build commands are now correct.

Security Summary

CodeQL security scan completed successfully with 0 vulnerabilities detected. All code changes are secure and follow best practices.

✨ Let Copilot coding agent set things up for you — coding agent works faster and does higher quality work when set up for your repo.