@commercetools-frontend/codemod 0.1.0 → 0.2.0

package/README.md

@@ -12,8 +12,20 @@ Codemod transformations for Custom Applications.
 $ npx @commercetools-frontend/codemod <transform> <glob_pattern>
 ```
 
+We recommend to run `prettier` on the modified files to preserve the formatting configured on your project. For example, you can run `prettier --write $(git diff --name-only)`.
+
+> If you are using `lint-staged` there is a high chance that you already run `prettier` on the staged files. Therefore, you don't need to run it manually.
+
 ## Transforms
 
+### `remove-deprecated-modal-level-props`
+
+Remove deprecated `level` and `baseZIndex` props from modal page components.
+
+```
+$ npx @commercetools-frontend/codemod remove-deprecated-modal-level-props 'src/**/*.js'
+```
+
 ### `rename-js-to-jsx`
 
 Rename `.js` files using React JSX syntax to `.jsx`.

package/build/cli.js

@@ -25,7 +25,8 @@ Global options:
 
 Transforms:
 
-  rename-js-to-jsx       Rename ".js" files using React JSX syntax to ".jsx".
+  remove-deprecated-modal-level-props     Remove deprecated "level" and "baseZIndex" props from modal page components.
+  rename-js-to-jsx                        Rename ".js" files using React JSX syntax to ".jsx".
   `);
         process.exit(0);
     }
@@ -36,6 +37,7 @@ Transforms:
     };
     const execute = async () => {
         switch (transform) {
+            case 'remove-deprecated-modal-level-props':
             case 'rename-js-to-jsx': {
                 const transformPath = path_1.default.join(__dirname, `transforms/${transform}.js`);
                 await runJscodeshift(transformPath, files, {
@@ -47,6 +49,7 @@ Transforms:
                         '**/build/**',
                     ],
                     parser: 'tsx',
+                    verbose: 0,
                     dry: flags['dry-run'],
                 });
                 break;

package/build/transforms/remove-deprecated-modal-level-props.js

@@ -0,0 +1,33 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const componentNamesWithDeprecatedZIndexProps = [
+    'InfoModalPage',
+    'FormModalPage',
+    'CustomFormModalPage',
+    'TabularModalPage',
+];
+const deprecatedPropsToBeRemoved = ['level', 'baseZIndex'];
+function removeDeprecatedModalLevelProps(file, api, options) {
+    const j = api.jscodeshift;
+    const root = j(file.source);
+    let hasModifications = false;
+    function removeDepreactedPropsFromComponent(path) {
+        const node = path.node;
+        if (node.name.type === 'JSXIdentifier' &&
+            componentNamesWithDeprecatedZIndexProps.includes(node.name.name)) {
+            node.attributes =
+                node.attributes?.filter((attribute) => {
+                    if (attribute.type === 'JSXAttribute' &&
+                        attribute.name.type === 'JSXIdentifier') {
+                        const hasDeprecatedAttribute = deprecatedPropsToBeRemoved.includes(attribute.name.name);
+                        hasModifications = true;
+                        return !hasDeprecatedAttribute;
+                    }
+                    return true;
+                }) ?? [];
+        }
+    }
+    root.find(j.JSXOpeningElement).forEach(removeDepreactedPropsFromComponent);
+    return hasModifications ? root.toSource(options) : null;
+}
+exports.default = removeDeprecatedModalLevelProps;

package/build/transforms/rename-js-to-jsx.js

@@ -20,6 +20,6 @@ function renameJsToJsx(file, api, options) {
             }
         }
     }
-    return root.toSource(options);
+    return null;
 }
 exports.default = renameJsToJsx;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@commercetools-frontend/codemod",
-  "version": "0.1.0",
+  "version": "0.2.0",
   "description": "Codemod transformations for Custom Applications",
   "bugs": "https://github.com/commercetools/merchant-center-application-kit/issues",
   "repository": {
@@ -30,9 +30,9 @@
   },
   "devDependencies": {
     "@tsconfig/node14": "^1.0.1",
-    "@types/jscodeshift": "0.11.0",
+    "@types/jscodeshift": "0.11.5",
     "rimraf": "3.0.2",
-    "typescript": "4.6.3"
+    "typescript": "4.6.4"
   },
   "engines": {
     "node": ">=14"