Repository navigation
Move the frontend to React 19, Vite 8 and React Router 8 - #58
Merged
Merged
Conversation
Dependabot raised these as separate PRs that cannot pass alone (#49, #50, #52): react-dom 19 needs @types/react 19 in step, @vitejs/plugin-react 6 needs Vite 8, and React Router 8 needs React 19.2.7 or later. They move together here (#41). - react, react-dom, @types/react and @types/react-dom 18 to 19.3 - vite 6.4 to 8.3 and @vitejs/plugin-react 4 to 6 - react-router 7.18 to 8.4 The only source change is the type of useModalFocus's ref. React 19 types useRef(null) as RefObject<T | null>, and the hook already handled a null element. The lockfile drops Babel, Rollup and esbuild for Rolldown and Lightning CSS, adds no package with an install script, and moves source-map-js to 1.2.2, which closes Dependabot alert 7. The libc markers on the Linux native packages are kept, so npm ci installs only the glibc builds. Fixes #41 Co-Authored-By: Claude Opus 5.5 <[email protected]>
…de 22.22 Vite 8 minifies with Rolldown and Lightning CSS, which drop the @license comments esbuild kept. The release binary embeds web/dist, so it would have shipped React, React Router and xterm without the notices their MIT licences require. Rolldown's comments.legal option keeps them. xterm's notice in its stylesheet still goes, but the same notice ships in its JavaScript, as it did before. React Router 8 needs Node 22.22 or later, so CONTRIBUTING.md now says so. Co-Authored-By: Claude Opus 5.5 <[email protected]>
This was referenced Oct 6, 2026
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
What this changes
The frontend moves to React 19, Vite 8 and React Router 8 in one step, as #41 planned. Dependabot's separate PRs cannot pass alone, since react-dom 19 needs
@types/react19 in step,@vitejs/plugin-react6 needs Vite 8, and React Router 8 needs React 19.2.7 or later.The only source change is the type of
useModalFocus's ref inweb/src/ui/Modal.tsx. React 19 typesuseRef(null)asRefObject<T | null>, and the hook already guarded against a null element.The lockfile removes 98 packages (Babel, Rollup, esbuild) and adds 31 (Rolldown and Lightning CSS with their platform builds, plus
@remix-run/route-patternandcookie-esfor the router). None of the new ones has an install script and all resolve from the npm registry.source-map-jsmoves to 1.2.2, which closes Dependabot alert 7. Thelibcmarkers on the Linux native packages are kept, taken from each package's registry manifest, sonpm ciinstalls only the glibc builds. Without them local npm 10 would drop the markers and CI would fetch both glibc and musl binaries.Worth knowing
width>=40rem). Tailwind 4 already needed the same browsers, so no supported browser loses anything.mainand this branch and compared them. Both have the same 678 selectors in the main stylesheet and 48 in the terminal stylesheet, with the same!importantrules, written differently by the new minifier. The terminal stylesheet is smaller mostly because Lightning CSS drops xterm's licence comment. The same notice still ships in xterm's JavaScript.@licensecomments esbuild kept, so the embedded bundle would have shipped React, React Router and xterm without their notices. The second commit setsrolldownOptions.output.comments.legal, which restores every noticemainshipped (22 headers in the main script, 4 in the terminal script), for 0.6 kB gzipped.node-version: 22, and CONTRIBUTING.md now says 22.22+.How it was verified
npm run build(typecheck included),npm test23 of 23, andnpm auditreports 0 vulnerabilities.?d=) to show its log. Modal focus is checked too (focus moves in, Tab stays inside, Escape closes and focus returns), and the terminal connects and runs a command inside the container.useModalFocus, was checked at 390 px wide. Focus is trapped, Escape closes it, and a link navigates and closes it./system/update, which got a 502 because GitHub rate limits unauthenticated release checks after many local restarts.Not checked: the route error boundary's fallback, because nothing in the app can throw a render error on demand. Its class API (
getDerivedStateFromError,componentDidCatch) is unchanged in React 19.Once this is merged, #49, #50 and #52 are superseded and will be closed.
Fixes #41
🤖 Generated with Claude Code