What's new and Report tabs

[TechLuddite]

Two things Joseph asked for: a way to tell us when a move works differently from the real game, and a changelog he can actually read.

What's new

src/data/changelog.js holds the words, src/features/News.jsx draws them. Every update written up in plain language — what it means in a battle, not what changed in the code. Entries carry a credit line for whoever spotted the thing, because being named in the changelog is the best part of reporting something.

The tab shows an amber dot until this build's entry has been read, remembered in localStorage like the rest of the app's state.

The top entry's date doubles as the app's version stamp, and it's what gets attached to every bug report — so CLAUDE.md now says the changelog is part of shipping, not an afterthought, and changelog.test.js guards the shape (dates present, newest first, only the two kinds the UI can draw).

Report

Composed in-app, filed on GitHub. Pick what kind of thing it is, optionally pick the move it's about, write it up, press send — GitHub opens with the issue already filled in and you press submit there. There's a copy button for when whoever is holding the tablet isn't logged in, and a "see exactly what gets sent" preview, because in a child's app what am I about to publish should never be a mystery.

No backend, nothing about the user collected: just the text typed, the move picked, and which version of the lab it came from. That matches the standing rule in CLAUDE.md — no accounts, nothing collecting personal data.

src/lib/feedback.js is tested rather than trusted. A report saying Fire Spin & Wrap does 1/8 + a bit? see #4, 100% of max HP has to survive being turned into a URL — the & would start a new parameter, the # would cut the link short. An over-long report is cut deliberately with a visible note rather than being silently mangled by the browser.

Writing the tests caught a real trap: decodeURIComponent on an already-decoded 100% throws URI malformed. Exactly the kind of string a Pokémon bug report contains.

Tab layout

The row now splits — the four battling tabs on the left, these two over on the right and a shade quieter, since they're about the app rather than about Pokémon. They're grouped so they wrap as a pair on a phone instead of stranding one per line.

[ DAMAGE ][ BATTLE ][ LEAGUE ][ STATS ]              [ WHAT'S NEW • ][ REPORT ]

Also

MoveSelect takes an emptyLabel so the optional move picker can say "no move in particular" instead of the team builder's "— empty —". Default unchanged, so the team builder is untouched.

Checks

• npm run test:run — 177 pass, 21 of them new (feedback URL building, changelog shape).
• npm run build — clean.
• Driven in a real browser at 900px and 380px: the unread dot appears on a fresh profile, clears when you open the tab and stays cleared after a reload; the send link carries the right title, label and version; the meta group sits flush with the right edge of the nav; no horizontal overflow on mobile; no page errors.
• No new dependencies.

🤖 Generated with Claude Code

https://claude.ai/code/session_017SGWh8kJjQsy4QB9pigonf