feat(upgrade): update-carbon-icons-react-import-to-carbon-react cod…

…emod (#14217)

* feat(upgrade): update-carbon-icons-react-import-to-carbon-react codemod

* feat(upgrade): update-carbon-icons-react-import-to-carbon-react codemod

docs/migration/v11.md

@@ -661,14 +661,14 @@ instructions in [`@carbon/upgrade`](../../packages/upgrade/README.md).
 #### Rewrite imports from `carbon-components-react` to `@carbon/react`.
 
 ```bash
-npx @carbon/upgrade migrate update-carbon-components-react-import-to-scoped
+npx @carbon/upgrade migrate update-carbon-components-react-import-to-scoped --write
 ```
 
 #### Automates size prop changes.
 
 ```bash
-npx @carbon/upgrade migrate small-to-size-props
-npx @carbon/upgrade migrate size-prop-updates
+npx @carbon/upgrade migrate small-to-size-props --write
+npx @carbon/upgrade migrate size-prop-updates --write
 ```
 
 For a full overview of changes to components, checkout our components section
@@ -1361,8 +1361,8 @@ The `@carbon/icons-react` package has been updated to minimize the number of
 exports from the package to help reduce build and compile times. It also has
 been updated to remove icons that were deprecated in v10.
 
-_If you are using @carbon/react, you can now import icons directly from
-@carbon/react/icons._
+_If you are using `@carbon/react`, you can now import icons directly from
+`@carbon/react/icons`._
 
 ### Changes to size
 
@@ -1444,15 +1444,28 @@ their replacement, if available, in v11.
 ### Migration
 
 Most use-cases of the icons from the `@carbon/icons-react` package will be
-covered by an automated codemod. To run this codemod, follow the instructions in
+covered by automated codemods. To run these codemods, follow the instructions in
 [`@carbon/upgrade`](../../packages/upgrade/README.md).
 
-Update imports and size usage for @carbon/icons-react
+#### Update imports and size usage for @carbon/icons-react
 
 ```bash
-npx @carbon/upgrade migrate icons-react-size-prop
+npx @carbon/upgrade migrate icons-react-size-prop --write
 ```
 
+### Rewrite imports from `@carbon/icons-react` to `@carbon/react/icons`.
+
+If you are using `@carbon/react`, you can now import icons directly from
+`@carbon/react/icons`.
+
+```bash
+npx @carbon/upgrade migrate update-carbon-icons-react-import-to-carbon-react --write
+```
+
+Note: be sure to run this codemod _after `icons-react-size-prop`_.
+
+#### Troubleshooting automated codemod migration
+
 However, in certain situations, we will be unable to infer what the correct
 update should be for a certain usage of the icon component. We have written the
 codemod to work for most situations, but you will see console warnings for files

packages/upgrade/src/upgrades.js

@@ -260,6 +260,37 @@ export const upgrades = [
           });
         },
       },
+      {
+        name: 'update-carbon-icons-react-import-to-carbon-react',
+        description:
+          'Rewrites imports from `@carbon/icons-react` to `@carbon/react/icons`',
+        migrate: async (options) => {
+          const transform = path.join(
+            TRANSFORM_DIR,
+            'update-carbon-icons-react-import-to-carbon-react.js'
+          );
+          const paths =
+            Array.isArray(options.paths) && options.paths.length > 0
+              ? options.paths
+              : await glob(['**/*.js', '**/*.jsx'], {
+                  cwd: options.workspaceDir,
+                  ignore: [
+                    '**/es/**',
+                    '**/lib/**',
+                    '**/umd/**',
+                    '**/node_modules/**',
+                    '**/storybook-static/**',
+                  ],
+                });
+
+          await run({
+            dry: !options.write,
+            transform,
+            paths,
+            verbose: options.verbose,
+          });
+        },
+      },
     ],
   },
   {

packages/upgrade/transforms/__testfixtures__/update-carbon-icons-react-import-to-carbon-react.input.js

@@ -0,0 +1,8 @@
+//prettier-ignore
+import { Add } from '@carbon/icons-react';
+//prettier-ignore
+import { Settings, Search } from '@carbon/icons-react';
+//prettier-ignore
+import Icons from '@carbon/icons-react';
+import Something from 'somewhere-else';
+import { SomethingElse } from 'somewhere-else';

packages/upgrade/transforms/__testfixtures__/update-carbon-icons-react-import-to-carbon-react.output.js

@@ -0,0 +1,8 @@
+//prettier-ignore
+import { Add } from "@carbon/react/icons";
+//prettier-ignore
+import { Settings, Search } from "@carbon/react/icons";
+//prettier-ignore
+import Icons from "@carbon/react/icons";
+import Something from 'somewhere-else';
+import { SomethingElse } from 'somewhere-else';

packages/upgrade/transforms/__tests__/update-carbon-icons-react-import-to-carbon-react.js

@@ -0,0 +1,12 @@
+/**
+ * Copyright IBM Corp. 2016, 2023
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+'use strict';
+
+const { defineTest } = require('jscodeshift/dist/testUtils');
+
+defineTest(__dirname, 'update-carbon-icons-react-import-to-carbon-react');

packages/upgrade/transforms/update-carbon-icons-react-import-to-carbon-react.js

@@ -0,0 +1,33 @@
+/**
+ * Copyright IBM Corp. 2016, 2023
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * Rewrites imports from '@carbon/icons-react' to '@carbon/react/icons'
+ *
+ * Transforms:
+ *
+ * import { Add } from '@carbon/icons-react';
+ *
+ * Into:
+ *
+ * import { Add } from "@carbon/react/icons";
+ */
+
+function transformer(file, api) {
+  const j = api.jscodeshift;
+
+  return j(file.source)
+    .find(j.ImportDeclaration, {
+      source: {
+        value: '@carbon/icons-react',
+      },
+    })
+    .forEach((path) => {
+      path.get('source').replace(j.stringLiteral('@carbon/react/icons'));
+    })
+    .toSource();
+}
+
+module.exports = transformer;