skills.rest
ohmyhotelco
ohmyhotelcoOFFICIAL
Explore all skills by this author →
GitHub

fm-gen

Generates a React Router v7 page from a migration plan via a phased TDD pipeline.

1|Updated Feb 19, 2026
Search Tags:#tdd#frontend#code generation#monorepo#page migration#legacy migration#react router v7
One-click install
npx skills add https://github.com/ohmyhotelco/hare-cc-plugins --skill fm-gen-ohmyhotelco
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: fm-gen
Source: https://github.com/ohmyhotelco/hare-cc-plugins/tree/main/frontend-migration-plugin/skills/fm-gen
Command: npx skills add https://github.com/ohmyhotelco/hare-cc-plugins --skill fm-gen-ohmyhotelco

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? Migrating a legacy page to React Router v7 by hand is error-prone and hard to resume when interrupted. This Skill executes a migration plan phase by phase (foundation, api, store, component, page, integration) with strict TDD, so each page is regenerated deterministically with full state tracking, locking, and resume support. ## Core Features & Use Cases - Phased TDD generation: Runs each build-order phase in an isolated agent session with Red-Green cycles, style-spec asset copying, and i18n key-coverage scaffolding. - Resume and demotion safety: Resumes from the last incomplete phase via generation-state.json, supports --force full regeneration, and refuses to regenerate pages that are flipped or done to protect production traffic. - Tracker and gate accounting: Records sourcePaths, clears stale gate evidence after regeneration, and coordinates locks so concurrent sessions cannot corrupt migration state. - Use Case: After running fm-plan for a legacy admin page, invoke this Skill to generate the React Router v7 implementation with tests, then proceed to fm-verify for gate validation. ## Quick Start Run the fm-gen skill for the page 'booking-list' to generate its React Router v7 migration from the existing migration plan.

Frequently Asked Questions about fm-gen

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I generate a React Router v7 page from a migration plan?▼

Run fm-gen with the page name after creating migration-plan.json via fm-plan and style-spec.json via fm-style-spec. It executes each build-order phase in a separate agent session with TDD cycles and records progress in generation-state.json.

How do I resume a failed page migration generation?▼

Re-run fm-gen with the same page name; it detects generation-state.json and resumes from the last incomplete phase. Use the --force flag to regenerate every phase from scratch, which resets all phases to pending after acquiring the page lock.

Can I regenerate a page that is already flipped to production?▼

No, fm-gen refuses pages with flipped or done status because the path serves live traffic. Run fm-route --revert first to return the page to parity-passed, then regenerate.

Why does fm-gen stop with a blockers error?▼

The plan lists unextracted shared component candidates whose tracker status is not yet extracted. Run fm-extract first to extract those shared packages, then re-run fm-gen.

What happens to previous verification results after regeneration?▼

Regeneration clears gateEvidence, verifiedAt, e2ePassedAt, parityPassedAt, routePrepared, and cascade records because prior gate passes no longer apply to the new code. You must re-run fm-verify and downstream gates.

Related Skills

Explore More Software Engineering Skills→
citumcitum
31

style-migrate-enhance

Migrate CSL 1.0 parent styles into Citum with oracle comparisons and fidelity metrics.

Official
Advanced
StuartAJStuartAJ
1

image-first-frontend-build

Generate visual mockups, implement frontends, and validate parity with automated QA gates.

Community
Advanced
metasavermetasaver

dry-check

Detect DRY violations by comparing code against multi-mono shared libraries.

Community
Advanced
abereghiciabereghici

lifecycle/migrate-from-react-router

Migrate React Router v7 projects to TanStack Router route definitions and navigation APIs.

Community
Intermediate