Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: react v19 codemods #1

Open
wants to merge 11 commits into
base: main
Choose a base branch
from
Open

feat: react v19 codemods #1

wants to merge 11 commits into from

Conversation

r4zendev
Copy link

@r4zendev r4zendev commented Apr 3, 2024

React v19 codemods

Summary

This PR contributes 6 new codemods to the repository, designed to facilitate migration to React v19 that is going to have built-in compiler optimization features and a set of other semantic changes. Each codemod has its own description in the README file but below is a summary:

  • React's memoization hooks removal. As per latest canary changelog, various optimizations will be handled by React compiler and there is not going to be a need to use memoization hooks anymore.
  • React's useContext hook conversion to use hook.
  • React's <Context.Provider value={defaultContextValue}> typical context initialization expression conversion to cleaner <Context value={defaultContextValue}>.
  • React's ref property access passed via forwardRef function wrapper conversion to destructure the ref property from the props object, as per latest changelog.
  • React-DOM's test-utils act method import transfer to react namespace.
  • React-DOM's useFormState method is going to be replaced with useActionState

Codemod Platform

Codemod is an open-source platform that makes it easy for developers to build, share, and run codemods with a free-forever and open-source set of toolings such as Codemod Studio, CLI and VS Code Extension. Codemod platform offers an enhanced user experience, including simplified setup, execution, and access to extended list of features like the following:

  • Ability to control include and exclude patterns by using glob-like pattern-matching
  • Dry-running the codemods and integration with VSCode extension, which provides immediate access to diff in your editor's GUI
  • Built-in formatting, error reporting, extensive developer experience, all in one place
  • Access to dozens of other codemods built by community
  • Access to these and other framework codemods via Codemod Registry, which is an npm-like registry for codemods. Codemods that are publish to the registry can be access via CLI, VS Code extension, and the web registry.
  • The codemod platform is built to provide you with the most fine-grained control and the most insight about the impact of the codemods on your codebase. In the future, more analytics become available for codemod executions, performance and impact.

Maintaining the codemods

Via this PR, we would like to transfer ownership of the future versions of these codemods to the react team, meaning that these codemods are possible to spread in the developers' world under your name and improve if needed. To iterate over these codemods and publish them to the registry to make them available for execution, please see our publishing documentation

Running the codemods

  • npm install -g codemod to install Codemod.com's official CLI application
  • codemod list to locate the list of available codemods
  • codemod <codemod-name> (for example: codemod react/19/use-context-hook-alpha) to run the codemod

Or just simply run:

npx codemod react/19/use-context-hook-alpha

By default, the current path where you run the codemod will be used as the target folder to be processed. For advanced configurations of Codemod CLI, please refer to the documentation

@r4zendev r4zendev self-assigned this Apr 3, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
5 participants