# Class Upgrade Desk

> An upgrade of one React class component file for React 18.3.1 and React 19, following four skills from
> github/awesome-copilot. Paste the file (or drop it); the browser masks comments, strings, template literals and
> regex literals (an apostrophe in JSX text does not open a string), matches every class extending Component or
> PureComponent, and finds string refs (rewriting the static ones to createRef fields read as .current), the three
> unsafe lifecycles routed by what their body does (a side-effect-only componentWillMount is moved to
> componentDidMount for you; the rest go to the constructor, componentDidUpdate, getDerivedStateFromProps or
> getSnapshotBeforeUpdate by case), UNSAFE_ prefixes left as permanent fixes, getDerivedStateFromProps traps, legacy
> context providers and consumers (with the context module drafted from their keys), and React 18 batching hazards.
> Metered runs write the review and the whole upgraded file. Built on the SkillSafe skills
> @github/react18-string-refs, @github/react18-lifecycle-patterns, @github/react18-legacy-context and
> @github/react18-batching-patterns, from github/awesome-copilot (MIT).

https://class-upgrade-desk.skillsafe.ai/

## What is free
- The scan: every finding with an id (U1, U2, ...), a severity (major - breaks or warns on the upgrade, minor - polish), the line, the class, what the page saw and the fix.
- The item table: every string ref, lifecycle (with its case and its replacement), context provider and consumer, and batching hazard.
- The upgraded file itself (string refs and side-effect componentWillMount done), the repo scan commands, the drafted context module, the checklist, findings and items as CSV, everything as JSON.

## The metered lanes
Two tasks on gpt-terra, metered per run, routed by `task`. Input string fields: `task` (review or rewrite), `unit`, `code`, `carry` (rewrite only: the review's decisions) and `facts` (the page's scan and item lists).
- `review` replies with `summary`, `findings` (confirmed ids with the issue, the decision and the upgraded lines), `cleared`, `extra` (up to five issues a scan cannot see, on real lines), `plan` (the steps in order, naming their ids) and `caveats`.
- `rewrite` replies with `summary`, `code` (the whole upgraded file), `changes`, `kept` and `caveats`.
The page holds every reply to its scan: each id accounted for exactly once, every class component and the whole file kept, and the upgraded file re-scanned - a deprecated API the rewrite left behind, or a new one, is flagged.

## Links
- API tutorial: https://class-upgrade-desk.skillsafe.ai/api.html
- Source skills: https://skillsafe.ai/skill/@github/react18-string-refs, https://skillsafe.ai/skill/@github/react18-lifecycle-patterns, https://skillsafe.ai/skill/@github/react18-legacy-context, https://skillsafe.ai/skill/@github/react18-batching-patterns

An independent tool for React code. Not affiliated with or endorsed by Meta or the React team; React is a trademark of Meta Platforms, Inc.