refactor(desk98): author the Vue Vapor desktop in JSX instead of SFCs - #308
Merged
Conversation
Same framework, different authoring surface: the 18 .vue single-file components collapse back into the original three-module shape — chrome.tsx (T98, caption controls, taskbar, popups, Start menu, icons), programs.tsx (program views + content-local hit helpers back in one file) and app.tsx (the compositor, with the window shell + content dispatch) — compiled through vue-jsx-vapor like apps/hero-vue-vapor and the app.vue-vapor.tsx variants. Reactivity, state modules, the desk dialect, tests and the build wiring are untouched; pocket.json only moves the entry to main.tsx. JSX-specific rules honored: lists are plain .map() (the repo's vapor JSX idiom), reactive branches live in JSX child positions (a bare ternary returned from a component body evaluates once — MinesCell keeps its hidden/revealed swap inside a stable 16×16 wrapper), and imports use the clean @pocketjs/framework/* subpaths the framework resolves per-framework. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
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
1 participant
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.
Follow-up to #302: the desk98 desktop stays Vue Vapor, but the authoring surface moves from
.vueSFCs to JSX (vue-jsx-vapor — the same path asapps/hero-vue-vaporand theapp.vue-vapor.tsxvariants). The 18 single-file components collapse back into the original three-module shape:chrome.tsx— T98, caption controls, taskbar, popup panel, Start menu, desktop iconsprograms.tsx— Notepad/Minesweeper/folder/dialog views and their content-local hit helpers, back in one fileapp.tsx— the compositor, now also owning the window shell + content dispatch (Window98)Nothing else moves: reactivity (
vuerefs),state.ts, the pure modules, the desk dialect, the tests, the CI wiring and the build commands are all unchanged —pocket.jsonjust points the entry atmain.tsx.JSX-specific rules honored:
.map()— the repo's vapor JSX idiom (zerov-forin any shipped JSX app).MinesCellkeeps its hidden/revealed swap inside a stable 16×16 wrapper so the reveal actually re-renders.@pocketjs/framework/components|lifecycle|clock|host) — the compiler resolves them per-framework, same as the Solid days.Verified: the desk-companion sim journey (typing, double-click word select with the ⌘C payload asserted on the wire, drag selection, context menu → paste-req round-trip, ⌘Esc/⌘N/⌘W) passes against the JSX bundle unchanged;
bun run test12/12;pocket checkclean over the 39-module graph; the density-2 sim render is pixel-faithful (screenshot refreshed — Minesweeper reveal/flag exercises the reactive branch swap).🤖 Generated with Claude Code