feat: added codemod for renaming unsafe lifecycles in react

codemods/react/rename-unsafe-lifecycles/.codemodrc.json

@@ -0,0 +1,26 @@
+{
+  "$schema": "https://codemod-utils.s3.us-west-1.amazonaws.com/configuration_schema.json",
+  "name": "react/rename-unsafe-lifecycles",
+  "version": "1.0.0",
+  "description": "Renames unsafe React lifecycle methods to their new names with UNSAFE_ prefix",
+  "engine": "jscodeshift",
+  "private": false,
+  "arguments": [],
+  "include": [
+    "**/*.js",
+    "**/*.jsx",
+    "**/*.tsx",
+    "**/*.ts"
+  ],
+  "exclude": [
+    "node_modules/**",
+    "dist/**"
+  ],
+  "meta": {
+    "tags": [
+      "react",
+      "lifcycle-methods"
+    ],
+    "git": "https://docs.codemod.com/building-codemods/package-requirements#codemodrc-json-reference"
+  }
+}

codemods/react/rename-unsafe-lifecycles/.gitignore

@@ -0,0 +1,2 @@
+node_modules
+dist

codemods/react/rename-unsafe-lifecycles/README.md

@@ -0,0 +1,26 @@
+This codemod is used to rename the unsafe lifecycle methods to their new names. The following table shows the mapping of the old lifecycle methods to the new ones.
+
+| Old Name | New Name |
+|----------|----------|
+| componentWillMount | UNSAFE_componentWillMount |
+| componentWillReceiveProps | UNSAFE_componentWillReceiveProps |
+| componentWillUpdate | UNSAFE_componentWillUpdate |
+
+## Example
+
+### Before
+
+```ts
+componentWillMount() {
+  console.log("hello");
+}
+
+```
+
+### After
+
+```ts
+UNSAFE_componentWillMount() {
+  console.log("hello");
+}
+```

codemods/react/rename-unsafe-lifecycles/__testfixtures__/fixture1.input.ts

@@ -0,0 +1,19 @@
+class MyComponent extends React.Component {
+    componentWillMount() {
+        console.log('component will mount');
+    }
+
+    componentWillReceiveProps(nextProps) {
+        console.log('component will receive props', nextProps);
+    }
+
+    componentWillUpdate(nextProps, nextState) {
+        console.log('component will update', nextProps, nextState);
+    }
+
+    render() {
+        return <div>My Component</div>;
+    }
+}
+
+export { MyComponent };

codemods/react/rename-unsafe-lifecycles/__testfixtures__/fixture1.output.ts

@@ -0,0 +1,19 @@
+class MyComponent extends React.Component {
+    UNSAFE_componentWillMount() {
+        console.log('component will mount');
+    }
+
+    UNSAFE_componentWillReceiveProps(nextProps) {
+        console.log('component will receive props', nextProps);
+    }
+
+    UNSAFE_componentWillUpdate(nextProps, nextState) {
+        console.log('component will update', nextProps, nextState);
+    }
+
+    render() {
+        return <div>My Component</div>;
+    }
+}
+
+export { MyComponent };

codemods/react/rename-unsafe-lifecycles/package.json

@@ -0,0 +1,23 @@
+{
+  "name": "rename-unsafe-lifecycles",
+  "license": "MIT",
+  "devDependencies": {
+    "@types/node": "20.9.0",
+    "typescript": "^5.2.2",
+    "vitest": "^1.0.1",
+    "@codemod.com/codemod-utils": "*",
+    "jscodeshift": "^0.15.1",
+    "@types/jscodeshift": "^0.11.10"
+  },
+  "scripts": {
+    "test": "vitest run",
+    "test:watch": "vitest watch"
+  },
+  "files": [
+    "README.md",
+    ".codemodrc.json",
+    "/dist/index.cjs"
+  ],
+  "type": "module",
+  "author": "shubhraagarwal"
+}

codemods/react/rename-unsafe-lifecycles/src/index.js

@@ -0,0 +1,62 @@
+/**
+ * Copyright 2015-present, Facebook, Inc.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+
+'use strict';
+
+const DEPRECATED_APIS = Object.create(null);
+DEPRECATED_APIS.componentWillMount = 'UNSAFE_componentWillMount';
+DEPRECATED_APIS.componentWillReceiveProps = 'UNSAFE_componentWillReceiveProps';
+DEPRECATED_APIS.componentWillUpdate = 'UNSAFE_componentWillUpdate';
+
+export default (file, api, options) => {
+  const j = api.jscodeshift;
+
+  const printOptions = options.printOptions || {
+    quote: 'single',
+    trailingComma: true
+  };
+
+  const root = j(file.source);
+
+  let hasModifications = false;
+
+  const renameDeprecatedApis = path => {
+    const name = path.node.key.name;
+
+    if (DEPRECATED_APIS[name]) {
+      path.value.key.name = DEPRECATED_APIS[name];
+      hasModifications = true;
+    }
+  };
+
+  const renameDeprecatedCallExpressions = path => {
+    const name = path.node.property.name;
+
+    if (DEPRECATED_APIS[name]) {
+      path.node.property.name = DEPRECATED_APIS[name];
+      hasModifications = true;
+    }
+  };
+
+  // Class methods
+  root.find(j.MethodDefinition).forEach(renameDeprecatedApis);
+
+  // Class methods - typescript
+  root.find(j.ClassMethod).forEach(renameDeprecatedApis);
+
+  // Arrow functions
+  root.find(j.ClassProperty).forEach(renameDeprecatedApis);
+
+  // createReactClass and mixins
+  root.find(j.Property).forEach(renameDeprecatedApis);
+
+  // Function calls
+  root.find(j.MemberExpression).forEach(renameDeprecatedCallExpressions);
+
+  return hasModifications ? root.toSource(printOptions) : null;
+};

codemods/react/rename-unsafe-lifecycles/test/test.js

@@ -0,0 +1,74 @@
+/**
+ * Copyright 2015-present, Facebook, Inc.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+
+'use strict';
+
+const tests = [
+  'arrow-functions',
+  'create-react-class',
+  'instance-methods',
+  'manually-calling-lifecycles',
+  'manually-invoked-mixin-methods',
+  'one-lifecycle-calls-another',
+  'standalone-function',
+  'variable-within-class-method',
+];
+
+const defineTest = require('jscodeshift/dist/testUtils').defineTest;
+
+describe('rename-unsafe-lifecycles', () => {
+  describe('flow', () => {
+    beforeEach(() => {
+      jest.mock('../rename-unsafe-lifecycles', () => {
+        return Object.assign(
+          require.requireActual('../rename-unsafe-lifecycles'),
+          {
+            parser: 'flow'
+          }
+        );
+      });
+    });
+
+    afterEach(() => {
+      jest.resetModules();
+    });
+
+    tests.forEach(test =>
+      defineTest(
+        __dirname,
+        'rename-unsafe-lifecycles',
+        null,
+        `rename-unsafe-lifecycles/${test}`
+      )
+    );
+  });
+
+  describe('typescript', () => {
+    beforeEach(() => {
+      jest.mock('../rename-unsafe-lifecycles', () => {
+        return Object.assign(
+          require.requireActual('../rename-unsafe-lifecycles'),
+          {
+            parser: 'tsx'
+          }
+        );
+      });
+    });
+
+    afterEach(() => {
+      jest.resetModules();
+    });
+
+    defineTest(
+      __dirname,
+      'rename-unsafe-lifecycles',
+      null,
+      'rename-unsafe-lifecycles/typescript/class.tsx'
+    );
+  });
+});

codemods/react/rename-unsafe-lifecycles/vitest.config.ts

@@ -0,0 +1,7 @@
+import { configDefaults, defineConfig } from 'vitest/config';
+
+export default defineConfig({
+  test: {
+    include: [...configDefaults.include, '**/test/*.ts'],
+  },
+});