From 224f2a2cc7ead773969665ddf62c7b3b918f5d4f Mon Sep 17 00:00:00 2001 From: Renato Massao Yonamine Date: Fri, 26 Apr 2024 12:57:16 +0200 Subject: [PATCH 1/3] feat: update v5 icons codemod remove variant prop and update size props --- .../__testfixtures__/v5/icons.input.js | 9 ++- .../__testfixtures__/v5/icons.output.js | 11 ++- .../forma-36-codemod/transforms/v5/icons.js | 79 +++++++++++++++++++ .../utils/updateTernaryValues.js | 10 ++- 4 files changed, 99 insertions(+), 10 deletions(-) diff --git a/packages/forma-36-codemod/transforms/__testfixtures__/v5/icons.input.js b/packages/forma-36-codemod/transforms/__testfixtures__/v5/icons.input.js index a9de714e6a..0aa2488411 100644 --- a/packages/forma-36-codemod/transforms/__testfixtures__/v5/icons.input.js +++ b/packages/forma-36-codemod/transforms/__testfixtures__/v5/icons.input.js @@ -6,8 +6,11 @@ import { InfoCircleIcon, } from '@contentful/f36-icons'; -; -; +; +; ; ; -; +; + +const largeIcon = true; + diff --git a/packages/forma-36-codemod/transforms/__testfixtures__/v5/icons.output.js b/packages/forma-36-codemod/transforms/__testfixtures__/v5/icons.output.js index a76d9b39eb..ced6ad8b50 100644 --- a/packages/forma-36-codemod/transforms/__testfixtures__/v5/icons.output.js +++ b/packages/forma-36-codemod/transforms/__testfixtures__/v5/icons.output.js @@ -1,7 +1,10 @@ -import { CaretDownIcon, CaretUpIcon, XIcon, TrashSimpleIcon, InfoFillIcon } from "@contentful/f36-icons-alpha"; +import { CaretDownIcon, CaretUpIcon, XIcon, TrashSimpleIcon, InfoIcon } from "@contentful/f36-icons-alpha"; -; -; +; +; ; ; -; +; + +const largeIcon = true; + diff --git a/packages/forma-36-codemod/transforms/v5/icons.js b/packages/forma-36-codemod/transforms/v5/icons.js index edb1633c20..479a452c54 100644 --- a/packages/forma-36-codemod/transforms/v5/icons.js +++ b/packages/forma-36-codemod/transforms/v5/icons.js @@ -2,8 +2,15 @@ const { getComponentLocalName, changeComponentName, changeImport, + changeProperties, + deleteProperty, + updateTernaryValues, + updatePropertyValue, + getProperty, + hasProperty, } = require('../../utils'); const { shouldSkipUpdateImport, getImport } = require('../../utils/config'); +const { isConditionalExpression } = require('../../utils/updateTernaryValues'); // V4 icon name : V5 icon name const iconsMap = { @@ -134,6 +141,78 @@ module.exports = function (file, api) { components.forEach(({ localName, v4IconName }) => { const newComponentName = `${iconsMap[v4IconName]}Icon`; + source = changeProperties(j, source, { + componentName: localName, + fn(attributes) { + let modifiedAttributes = attributes; + + // Remove variant prop + modifiedAttributes = deleteProperty(modifiedAttributes, { + propertyName: 'variant', + file, + }); + + // Update size prop + if (hasProperty(modifiedAttributes, { propertyName: 'size' })) { + let size = getProperty(modifiedAttributes, { + propertyName: 'size', + }); + + // update conditional expressions + if (isConditionalExpression(size.value, j)) { + modifiedAttributes = updatePropertyValue(modifiedAttributes, { + j, + propertyName: 'size', + propertyValue: (value) => { + const valueMap = { + large: 'medium', + xlarge: 'medium', + }; + + const updatedValue = updateTernaryValues(value, { + j, + valueMap, + }); + + return updatedValue; + }, + }); + } + + size = getProperty(modifiedAttributes, { + propertyName: 'size', + }); + + // If ternary has same value for true and false, simplify + if (size.value.value === undefined) { + const matches = size.value.match(/\{'(\w+?)'\}/); + if (matches[1]) { + modifiedAttributes = updatePropertyValue(modifiedAttributes, { + j, + propertyName: 'size', + propertyValue: () => { + return j.literal(matches[1]); + }, + }); + } + } + size = getProperty(modifiedAttributes, { + propertyName: 'size', + }); + + // Remove size prop if value is 'large', 'xlarge' or 'medium' + if (['large', 'xlarge', 'medium'].includes(size.value.value)) { + modifiedAttributes = deleteProperty(modifiedAttributes, { + propertyName: 'size', + file, + }); + } + } + + return modifiedAttributes; + }, + }); + source = changeComponentName(j, source, { componentName: localName, outputComponentName: newComponentName, diff --git a/packages/forma-36-codemod/utils/updateTernaryValues.js b/packages/forma-36-codemod/utils/updateTernaryValues.js index 881018be2f..9b0a3474c3 100644 --- a/packages/forma-36-codemod/utils/updateTernaryValues.js +++ b/packages/forma-36-codemod/utils/updateTernaryValues.js @@ -32,9 +32,13 @@ function updateTernaryValues(value, { j, valueMap = {} }) { const consequent = getValueFor('consequent', commonArgs); const alternate = getValueFor('alternate', commonArgs); - j(expression).replaceWith( - j.conditionalExpression(expression.value.test, consequent, alternate), - ); + if (consequent.value === alternate.value) { + j(expression).replaceWith(j.literal(consequent.value)); + } else { + j(expression).replaceWith( + j.conditionalExpression(expression.value.test, consequent, alternate), + ); + } }) .toSource({ quote: 'single' }); } From c83022d6f18bfeebebff3a0a5fa3951a425475a0 Mon Sep 17 00:00:00 2001 From: Renato Massao Yonamine Date: Fri, 26 Apr 2024 12:59:20 +0200 Subject: [PATCH 2/3] chore: update version of codemod --- packages/forma-36-codemod/package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/forma-36-codemod/package.json b/packages/forma-36-codemod/package.json index d40712e39a..d760031e02 100644 --- a/packages/forma-36-codemod/package.json +++ b/packages/forma-36-codemod/package.json @@ -1,7 +1,7 @@ { "name": "@contentful/f36-codemod", "description": "Forma 36 Codemod", - "version": "4.5.0", + "version": "5.0.0-alpha.0", "main": "bin/f36-codemod.mjs", "license": "MIT", "files": [ From ae6e10162a5f7c7805277c30e8782d2b8d8c9d10 Mon Sep 17 00:00:00 2001 From: Renato Massao Yonamine Date: Fri, 26 Apr 2024 13:55:31 +0200 Subject: [PATCH 3/3] chore: remove unnecessary dependency --- packages/forma-36-codemod/package.json | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/packages/forma-36-codemod/package.json b/packages/forma-36-codemod/package.json index d760031e02..5c15906017 100644 --- a/packages/forma-36-codemod/package.json +++ b/packages/forma-36-codemod/package.json @@ -21,8 +21,7 @@ "devDependencies": { "@types/semver": "^7.3.12", "eslint": "^8.43.0", - "jest": "^29.3.1", - "@contentful/f36-icons": "^4.0.0" + "jest": "^29.3.1" }, "publishConfig": { "registry": "https://npm.pkg.github.com/",