diff --git a/src/bin/eds-migrate.ts b/src/bin/eds-migrate.ts index 8afa01b80..a6dd59703 100644 --- a/src/bin/eds-migrate.ts +++ b/src/bin/eds-migrate.ts @@ -33,6 +33,17 @@ export async function run() { console.log(` ${migration}`); }); } else if (name) { + const migrations = listMigrations(); + if (!migrations.includes(name)) { + console.warn( + chalk.red(`Migrate: Oops we do not have a migration named "${name}"!`), + ); + console.log('Here is a list of migrations available'); + listMigrations().forEach((migration) => { + console.log(` ${migration}`); + }); + return; + } await runMigration(name, { isVerbose }); } else { console.warn( diff --git a/src/bin/migrate/index.ts b/src/bin/migrate/index.ts index 06f0e84bf..da9d1e7df 100644 --- a/src/bin/migrate/index.ts +++ b/src/bin/migrate/index.ts @@ -42,8 +42,9 @@ export default async function runMigration( const pathToMigration = path.join(MIGRATION_DIR, `${name}.js`); try { console.log(`Running the following migration: "${name}"`); - const { default: migration } = await import(pathToMigration); - migration(project); + const module = await import(pathToMigration); + // This syntax seems odd to need when the code is packaged + module.default.default(project); } catch (error) { console.error('Error importing module:', error); } diff --git a/src/bin/migrate/transforms/rename-jsx-import.test.ts b/src/bin/migrate/transforms/rename-jsx-import.test.ts index 3ba598a39..6dd369ac7 100644 --- a/src/bin/migrate/transforms/rename-jsx-import.test.ts +++ b/src/bin/migrate/transforms/rename-jsx-import.test.ts @@ -140,4 +140,42 @@ describe('transform', () => { } `); }); + + it('uses the alias to rename the JsxElement', () => { + const sourceFileText = dedent` + import {Button} from '@chanzuckerberg/eds'; + + export default function Component() { + return ( +
+ +
+ ) + } + `; + const sourceFile = createTestSourceFile(sourceFileText); + + transform({ + file: sourceFile, + changes: [ + { + oldImportName: 'Button', + newImportName: 'ButtonV2', + alias: 'ButtonAlias', + }, + ], + }); + + expect(sourceFile.getText()).toEqual(dedent` + import {ButtonV2 as ButtonAlias} from '@chanzuckerberg/eds'; + + export default function Component() { + return ( +
+ Something over there +
+ ) + } + `); + }); }); diff --git a/src/bin/migrate/transforms/rename-jsx-import.ts b/src/bin/migrate/transforms/rename-jsx-import.ts index 1d265178d..2079b24f9 100644 --- a/src/bin/migrate/transforms/rename-jsx-import.ts +++ b/src/bin/migrate/transforms/rename-jsx-import.ts @@ -28,7 +28,11 @@ export default function transform({ file, changes }: TransformOptions) { /** * Used to keep track of which JSXElements need to be renamed */ - const appliedChanges: Change[] = []; + const jsxElementsToRename: Array<{ + oldName: string; + newName: string; + }> = []; + importsToTransform.forEach((importDeclaration) => { const namedImports = importDeclaration.getNamedImports(); @@ -39,7 +43,14 @@ export default function transform({ file, changes }: TransformOptions) { ); if (changeToApply) { - namedImport.getNameNode; + const jsxElementName = + namedImport.getAliasNode()?.getText() || namedImport.getName(); + + jsxElementsToRename.push({ + oldName: jsxElementName, + newName: changeToApply.alias || changeToApply.newImportName, + }); + namedImport.setName(changeToApply.newImportName); namedImport.getNameNode().rename(changeToApply.newImportName); if (changeToApply.removeAlias) { @@ -47,7 +58,6 @@ export default function transform({ file, changes }: TransformOptions) { } else if (changeToApply.alias) { namedImport.renameAlias(changeToApply.alias); } - appliedChanges.push(changeToApply); } }); }); @@ -58,13 +68,13 @@ export default function transform({ file, changes }: TransformOptions) { const openingTagNameNode = openingElement.getTagNameNode(); const closingTagNameNode = closingElement.getTagNameNode(); - const appliedChange = appliedChanges.find( - (change) => change.oldImportName === openingTagNameNode.getText(), + const renameInfo = jsxElementsToRename.find( + ({ oldName }) => oldName === openingTagNameNode.getText(), ); - if (appliedChange) { - openingTagNameNode.replaceWithText(appliedChange.newImportName); - closingTagNameNode.replaceWithText(appliedChange.newImportName); + if (renameInfo) { + openingTagNameNode.replaceWithText(renameInfo.newName); + closingTagNameNode.replaceWithText(renameInfo.newName); } }); @@ -72,11 +82,11 @@ export default function transform({ file, changes }: TransformOptions) { .getDescendantsOfKind(SyntaxKind.JsxSelfClosingElement) .forEach((element) => { const tagNameNode = element.getTagNameNode(); - const appliedChange = appliedChanges.find( - (change) => change.oldImportName === tagNameNode.getText(), + const renameInfo = jsxElementsToRename.find( + ({ oldName }) => oldName === tagNameNode.getText(), ); - if (appliedChange) { - tagNameNode.replaceWithText(appliedChange.newImportName); + if (renameInfo) { + tagNameNode.replaceWithText(renameInfo.newName); } }); }