codemod-construction-ast_skill

Overview

This skill automates large-scale React codebase refactors by building codemods that operate on ASTs. It focuses on reliable, repeatable transformations such as prop renames, component restructuring, and import updates. The goal is to reduce manual edits while preserving formatting and behavior across a premium legal management platform codebase.

How this skill works

The skill uses a parser that understands JSX to convert source files into an AST, then applies jscodeshift-style transforms to locate and modify nodes. Transforms include renaming props, rewriting component shapes, migrating class components to hooks, and adjusting import paths. Changes are validated with unit tests and dry-run applications before committing.

When to use it

• Renaming props or components across hundreds of files
• Refactoring class components into function components with hooks
• Restructuring component APIs without breaking consumers
• Updating import paths after package restructuring
• Enforcing consistent patterns and removing deprecated APIs

Best practices

• Write small, focused transforms and compose them for complex tasks
• Include unit tests that run transforms against representative code snippets
• Perform dry-run and staged application with git to review changes
• Preserve original formatting where possible and document any stylistic changes
• Handle edge cases explicitly (dynamic props, spread attributes, conditional rendering)

Example use cases

• Rename a commonly used prop across all JSX files and update affected imports
• Migrate a set of class components to function components, converting lifecycle logic to hooks
• Consolidate multiple similar components into a single higher-order component and update usage
• Automate replacement of deprecated third-party components with modern alternatives
• Adjust folder or package paths and update all related import statements