feat: add dependency alert (#50)

.eslintrc.js

@@ -9,5 +9,6 @@ module.exports = {
     'react/no-array-index-key': 0,
     'react/sort-comp': 0,
     '@typescript-eslint/no-explicit-any': 0,
+    'no-return-await': 0,
   },
 };

bin/cli.js

@@ -1,15 +1,17 @@
 const path = require('path');
 const fs = require('fs');
+const os = require('os');
+
 const isGitClean = require('is-git-clean');
 const chalk = require('chalk');
 const execa = require('execa');
 const globby = require('globby');
 const updateCheck = require('update-check');
-const os = require('os');
 
 const jscodeshiftBin = require.resolve('.bin/jscodeshift');
 const pkg = require('../package.json');
 const summary = require('../transforms/utils/summary');
+const marker = require('../transforms/utils/marker');
 
 const transformersDir = path.join(__dirname, '../transforms');
 
@@ -147,6 +149,20 @@ async function transform(transformer, parser, globPath, styleOption) {
   }
 }
 
+function dependenciesAlert(needIcon, needCompatible) {
+  console.log(chalk.yellow('Please install the following dependencies:\n'));
+  const dependencies = ['antd^4.0.0-rc.0'];
+  if (needIcon) {
+    dependencies.push('@ant-design/icons^4.0.0-rc.0');
+  }
+
+  if (needCompatible) {
+    dependencies.push('@ant-design/compatible^1.0.0-rc.0');
+  }
+
+  console.log(dependencies.map(n => `* ${n}`).join('\n'));
+}
+
 async function bootstrap() {
   const dir = process.argv[2];
   // eslint-disable-next-line global-require
@@ -176,8 +192,10 @@ async function bootstrap() {
     console.log(chalk.yellow('Invalid dir:', dir, ', please pass a valid dir'));
     process.exit(1);
   }
-  summary.start();
+  await summary.start();
+  await marker.start();
   await run(dir, args);
+
   try {
     const output = await summary.output();
     if (Array.isArray(output) && output.length) {
@@ -191,11 +209,17 @@ async function bootstrap() {
           console.log(message);
           console.log('\n');
         });
-
-      console.log(
-        '\n----------- Thanks for using @ant-design/codemod -----------',
-      );
     }
+
+    console.log('----------- antd4 dependencies alert -----------\n');
+    const dependenciesMarkers = await marker.output();
+    const needIcon = dependenciesMarkers['@ant-design/icons'];
+    const needCompatible = dependenciesMarkers['@ant-design/compatible'];
+    dependenciesAlert(needIcon, needCompatible);
+
+    console.log(
+      '\n----------- Thanks for using @ant-design/codemod -----------',
+    );
   } catch (err) {
     console.log('skip summary due to', err);
   }

transforms/utils/marker.js

@@ -0,0 +1,69 @@
+// markers for dependencies usage
+const fs = require('fs');
+const { promisify } = require('util');
+const path = require('path');
+
+const encoding = 'utf8';
+
+const iconMarkerPath = path.join(
+  require('os').tmpdir(),
+  './antd-v4-icon.marker.txt',
+);
+
+const compatibleMarkerPath = path.join(
+  require('os').tmpdir(),
+  './antd4-v4-compatible.marker.txt',
+);
+
+const dependencyMarkerPathMap = {
+  '@ant-design/icons': iconMarkerPath,
+  '@ant-design/compatible': compatibleMarkerPath,
+};
+
+const fsOpenAsync = promisify(fs.open);
+const fsUnlinkAsync = promisify(fs.unlink);
+const fsAppendFileAsync = promisify(fs.appendFile);
+const fsReadFileAsync = promisify(fs.readFile);
+
+async function start() {
+  return await Promise.all(
+    Object.values(dependencyMarkerPathMap).map(markPath =>
+      fsOpenAsync(markPath, 'w'),
+    ),
+  );
+}
+
+async function markDependency(dependency) {
+  const markerPath = dependencyMarkerPathMap[dependency];
+  if (markerPath) {
+    // add times count
+    await fsAppendFileAsync(markerPath, '1', encoding);
+  }
+}
+
+async function output() {
+  const dependencies = Object.keys(dependencyMarkerPathMap);
+  const jobs = dependencies.map(async dependencyName => {
+    const markerPath = dependencyMarkerPathMap[dependencyName];
+    const content = await fsReadFileAsync(markerPath, encoding);
+    const times = content.length;
+    await fsUnlinkAsync(markerPath);
+    return times;
+  });
+  const result = await Promise.all(jobs);
+  return dependencies.reduce((prev, dependencyName, index) => {
+    const times = result[index];
+    if (times) {
+      // eslint-disable-next-line no-param-reassign
+      prev[dependencyName] = times;
+    }
+
+    return prev;
+  }, {});
+}
+
+module.exports = {
+  start,
+  markDependency,
+  output,
+};

transforms/v3-Component-to-compatible.js

@@ -5,6 +5,7 @@ const {
   removeEmptyModuleImport,
   parseStrToArray,
 } = require('./utils');
+const { markDependency } = require('./utils/marker');
 
 const deprecatedComponentNames = ['Form', 'Mention'];
 
@@ -53,6 +54,8 @@ module.exports = (file, api, options) => {
           moduleName: '@ant-design/compatible/assets/index.css',
           after: '@ant-design/compatible',
         });
+
+        markDependency('@ant-design/compatible');
       });
 
     return hasChanged;

transforms/v3-Icon-to-v4-Icon.js

@@ -1,4 +1,5 @@
 const { addIconRelatedMsg } = require('./utils/summary');
+const { markDependency } = require('./utils/marker');
 const { printOptions } = require('./utils/config');
 const { getV4IconComponentName } = require('./utils/icon');
 const {
@@ -91,6 +92,7 @@ module.exports = (file, api, options) => {
       localName: 'LegacyIcon',
       before,
     });
+    markDependency('@ant-design/compatible');
   }
 
   function rewriteToSepcificV4Icon(j, root, { jsxElement, before }) {
@@ -125,6 +127,7 @@ module.exports = (file, api, options) => {
       importedName: v4IconComponentName,
       before,
     });
+    markDependency('@ant-design/icons');
     return true;
   }
 
@@ -223,6 +226,7 @@ module.exports = (file, api, options) => {
         importedName: staticMethod,
         before,
       });
+      markDependency('@ant-design/icons');
     });
 
     staticMethodCallExpressions.forEach(nodePath => {

transforms/v3-Modal-method-with-icon-to-v4.js

@@ -5,6 +5,7 @@ const {
 } = require('./utils');
 const { printOptions } = require('./utils/config');
 const { addIconRelatedMsg } = require('./utils/summary');
+const { markDependency } = require('./utils/marker');
 const {
   getV4IconComponentName,
   createIconJSXElement,
@@ -25,6 +26,7 @@ module.exports = (file, api, options) => {
       importedName: iconName,
       before,
     });
+    markDependency('@ant-design/icons');
 
     return iconJSXElement;
   }
@@ -44,6 +46,7 @@ module.exports = (file, api, options) => {
       localName: 'LegacyIcon',
       before,
     });
+    markDependency('@ant-design/compatible');
 
     return iconJSXElement;
   }

transforms/v3-component-with-string-icon-props-to-v4.js

@@ -5,6 +5,7 @@ const {
 } = require('./utils');
 const { printOptions } = require('./utils/config');
 const { addIconRelatedMsg } = require('./utils/summary');
+const { markDependency } = require('./utils/marker');
 const {
   createIconJSXElement,
   getV4IconComponentName,
@@ -75,6 +76,7 @@ module.exports = (file, api, options) => {
                   importedName: v4IconComponentName,
                   before: antdPkgName,
                 });
+                markDependency('@ant-design/icons');
                 return;
               }
               const location = nodePath.node.loc.start;
@@ -99,6 +101,7 @@ module.exports = (file, api, options) => {
               localName: 'LegacyIcon',
               before: antdPkgName,
             });
+            markDependency('@ant-design/compatible');
           });
       });
 

transforms/v4-Icon-Outlined.js

@@ -1,6 +1,7 @@
 const allIcons = require('@ant-design/icons/lib/icons');
 
 const { printOptions } = require('./utils/config');
+const { markDependency } = require('./utils/marker');
 const { removeEmptyModuleImport, addSubmoduleImport } = require('./utils');
 
 const outlinedIcons = Object.keys(allIcons)
@@ -35,13 +36,14 @@ module.exports = (file, api, options) => {
             specifier.imported.name !== importComponentName,
         );
 
-        const outlinedIconName = importComponentName + 'Outlined';
+        const outlinedIconName = `${importComponentName}Outlined`;
 
         if (localComponentName === importComponentName) {
           addSubmoduleImport(j, root, {
             moduleName: '@ant-design/icons',
             importedName: outlinedIconName,
           });
+          markDependency('@ant-design/icons');
           if (localComponentName === importComponentName) {
             root
               .findJSXElements(localComponentName)
@@ -58,6 +60,7 @@ module.exports = (file, api, options) => {
             importedName: outlinedIconName,
             localName: localComponentName,
           });
+          markDependency('@ant-design/icons');
         }
       });