busirocket-refactor-workflow_skill

Overview

This skill provides a strict, repeatable refactoring workflow for TypeScript and React codebases. It enforces one-export-per-file, moves inline types to a dedicated types/ folder, and requires mandatory post-refactor quality gates. Use it to keep large codebases modular, predictable, and easy to review.

How this skill works

The skill defines concrete rules and a one-shot @file refactor workflow: split files so each exports exactly one symbol, extract helpers from components and hooks, and relocate inline interfaces/types into types/. After changes, it runs the project’s standard checks as a blocking gate and offers guidance on what to do when checks fail. Rule documents include examples and decision heuristics for splitting files and sizing targets.

When to use it

• Refactoring files that have multiple exports into single-responsibility modules
• Splitting large components, hooks, or utility files into smaller files
• Moving inline type/interface declarations into a centralized types/ directory
• Enforcing mandatory post-refactor checks and CI-quality gates
• Applying consistent import practices (no index/barrel imports)

Best practices

• Always run the project’s standard checks after any refactor (e.g., yarn check:all) and treat failures as blocking
• Limit each file to a single exported symbol — one component, hook, or util per file
• Extract helper functions from components and hooks into their own modules when they have separate responsibilities
• Move inline types and interfaces to a types/ folder and import them explicitly from concrete modules
• Avoid index/barrel files; import directly from the concrete module path to keep boundaries explicit

Example use cases

• Refactor a utilities file with several exported functions into separate files under utils/ with one export each
• Split a large React component into a presentational component and several small child components and extract helpers into hooks or utils
• Move inline type/interface declarations from a component file into types/ and update imports across the codebase
• Run the post-refactor golden path: refactor, run checks, fix lint/type/test failures, open a focused PR