← ClaudeAtlas

promote-componentlisted

Use to refactor a React/RN component up the colocation hierarchy (L0 → L1 → L2) when its usage spreads across pages. Two modes: (1) "scan candidates" — analyzes the entire codebase, counts usages of every component under app/**/_components/ (web) or components/<feature>/ (mobile — Expo Router has no app/_components/ convention), and reports a table of promotion candidates with the Rule of Three; (2) "promote <Component>" — moves the file to the right level, updates all imports across the codebase, runs tsc --noEmit to verify, and commits atomically. Reads .workflow/meta.json#stack.framework to honor next / expo-rn / monorepo conventions, each with its own target paths. Triggers on: "promote PostCard", "scan promotion candidates", "this component is used everywhere, lift it up", "questo componente è usato in più pagine, promuovilo", "refactor components/shared/". Not for: creating new components (use design-md-to-app or screenshot-to-page or rn-add-screen), splitting compound components into a folder (that's a
lukedj78/dev-flow · ★ 4 · Web & Frontend · score 77
Install: claude install-skill lukedj78/dev-flow
# promote-component — Rule of Three automation ## Contract See `references/contracts.md` (vendored from `dev-flow`). Key facts: - Reads `<project-root>/.workflow/meta.json#stack.framework` (must be `"next"`, `"expo-rn"`, or `"monorepo"`). - Reads `meta.json#stack.route_groups` (optional, helps detect the target level). - Modifies code in `<project-root>/` (or `<project-root>/apps/<web|mobile>/` for monorepo). - Does NOT modify `meta.json#phase`. Appends to `meta.json#history`. - Always idempotent: re-running the scan reports the same candidates; re-running a promote on an already-promoted component does nothing. ## When this skill applies - User says "scan promotion candidates" / "scansiona candidati promozione" → run the scan. - User says "promote <Component>" / "promovi <Component>" → execute the move. - The user is reviewing the codebase after a feature lands and wants to clean up duplication. Orchestrator does NOT route here automatically — invoked on demand. ## Knowledge dependencies - `composition-patterns-guide/SKILL.md` — the 7 Vercel composition rules + our colocation rules. - `references/colocation-rules.md` — the canonical Rule of Three + L0/L1/L2 spec. ## Web vs mobile targets (read this first) **Next.js App Router** supports `_`-prefixed private folders — `app/<route>/_components/` is a valid non-routable convention there. **Expo Router does not**: every file under `app/` (aside from a short reserved list) becomes a real route, so `app/<route>/_component