Merge pull request #21809 from storybookjs/kasper/mdx-update-glob-in-…

…codemod

CLI: Update stories glob in mdx codemod and not in mdx automigration

code/lib/cli/src/automigrate/fixes/index.ts

@@ -16,7 +16,6 @@ import { autodocsTrue } from './autodocs-true';
 import { addReact } from './add-react';
 import { nodeJsRequirement } from './nodejs-requirement';
 import { missingBabelRc } from './missing-babelrc';
-import { bareMdxStoriesGlob } from './bare-mdx-stories-glob';
 import { angularBuilders } from './angular-builders';
 import { angularBuildersMultiproject } from './angular-builders-multiproject';
 
@@ -36,7 +35,6 @@ export const allFixes: Fix[] = [
   removedGlobalClientAPIs,
   mdx1to2,
   mdxgfm,
-  bareMdxStoriesGlob,
   autodocsTrue,
   addReact,
   missingBabelRc,

code/lib/cli/src/automigrate/index.ts

@@ -10,6 +10,7 @@ import { join } from 'path';
 import { getStorybookInfo, loadMainConfig } from '@storybook/core-common';
 import semver from 'semver';
 import { JsPackageManagerFactory, useNpmWarning } from '../js-package-manager';
+import type { PackageManagerName } from '../js-package-manager';
 
 import type { Fix, FixId, FixOptions, FixSummary } from './fixes';
 import { FixStatus, PreCheckFailure, allFixes } from './fixes';
@@ -64,12 +65,6 @@ export const automigrate = async ({
     return null;
   }
 
-  if (useNpm) {
-    useNpmWarning();
-    // eslint-disable-next-line no-param-reassign
-    pkgMgr = 'npm';
-  }
-
   const selectedFixes = inputFixes || allFixes;
   const fixes = fixId ? selectedFixes.filter((f) => f.id === fixId) : selectedFixes;
 
@@ -81,6 +76,72 @@ export const automigrate = async ({
 
   augmentLogsToFile();
 
+  logger.info('🔎 checking possible migrations..');
+
+  const { fixResults, fixSummary } = await runFixes({
+    fixes,
+    useNpm,
+    pkgMgr,
+    userSpecifiedConfigDir,
+    rendererPackage,
+    skipInstall,
+    dryRun,
+    yes,
+  });
+
+  const hasFailures = Object.values(fixResults).some(
+    (r) => r === FixStatus.FAILED || r === FixStatus.CHECK_FAILED
+  );
+
+  // if migration failed, display a log file in the users cwd
+  if (hasFailures) {
+    await move(TEMP_LOG_FILE_PATH, join(process.cwd(), LOG_FILE_NAME), { overwrite: true });
+  } else {
+    await remove(TEMP_LOG_FILE_PATH);
+  }
+
+  const packageManager = JsPackageManagerFactory.getPackageManager({ force: pkgMgr });
+  const installationMetadata = await packageManager.findInstallations([
+    '@storybook/*',
+    'storybook',
+  ]);
+
+  logger.info();
+  logger.info(
+    getMigrationSummary({ fixResults, fixSummary, logFile: LOG_FILE_PATH, installationMetadata })
+  );
+  logger.info();
+
+  cleanup();
+
+  return fixResults;
+};
+
+export async function runFixes({
+  fixes,
+  dryRun,
+  yes,
+  useNpm,
+  pkgMgr,
+  userSpecifiedConfigDir,
+  rendererPackage,
+  skipInstall,
+}: {
+  fixes: Fix[];
+  yes?: boolean;
+  dryRun?: boolean;
+  useNpm?: boolean;
+  pkgMgr?: PackageManagerName;
+  userSpecifiedConfigDir?: string;
+  rendererPackage?: string;
+  skipInstall?: boolean;
+}) {
+  if (useNpm) {
+    useNpmWarning();
+    // eslint-disable-next-line no-param-reassign
+    pkgMgr = 'npm';
+  }
+
   const packageManager = JsPackageManagerFactory.getPackageManager({ force: pkgMgr });
 
   const {
@@ -126,7 +187,6 @@ export const automigrate = async ({
     };
   }
 
-  logger.info('🔎 checking possible migrations..');
   const fixResults = {} as Record<FixId, FixStatus>;
   const fixSummary: FixSummary = { succeeded: [], failed: {}, manual: [], skipped: [] };
 
@@ -248,29 +308,5 @@ export const automigrate = async ({
     }
   }
 
-  const hasFailures = Object.values(fixResults).some(
-    (r) => r === FixStatus.FAILED || r === FixStatus.CHECK_FAILED
-  );
-
-  // if migration failed, display a log file in the users cwd
-  if (hasFailures) {
-    await move(TEMP_LOG_FILE_PATH, join(process.cwd(), LOG_FILE_NAME), { overwrite: true });
-  } else {
-    await remove(TEMP_LOG_FILE_PATH);
-  }
-
-  const installationMetadata = await packageManager.findInstallations([
-    '@storybook/*',
-    'storybook',
-  ]);
-
-  logger.info();
-  logger.info(
-    getMigrationSummary({ fixResults, fixSummary, logFile: LOG_FILE_PATH, installationMetadata })
-  );
-  logger.info();
-
-  cleanup();
-
-  return fixResults;
-};
+  return { fixResults, fixSummary };
+}

code/lib/cli/src/migrate.ts

@@ -1,11 +1,31 @@
 import { listCodemods, runCodemod } from '@storybook/codemod';
+import { runFixes } from './automigrate';
+import { bareMdxStoriesGlob } from './automigrate/fixes/bare-mdx-stories-glob';
+import { JsPackageManagerFactory } from './js-package-manager';
+import { getStorybookVersionSpecifier } from './helpers';
 
-export async function migrate(migration: any, { glob, dryRun, list, rename, logger, parser }: any) {
+const logger = console;
+
+export async function migrate(migration: any, { glob, dryRun, list, rename, parser }: any) {
   if (list) {
     listCodemods().forEach((key: any) => logger.log(key));
   } else if (migration) {
+    if (migration === 'mdx-to-csf' && !dryRun) {
+      await runFixes({ fixes: [bareMdxStoriesGlob] });
+      await addStorybookBlocksPackage();
+    }
     await runCodemod(migration, { glob, dryRun, logger, rename, parser });
   } else {
     throw new Error('Migrate: please specify a migration name or --list');
   }
 }
+
+export async function addStorybookBlocksPackage() {
+  const packageManager = JsPackageManagerFactory.getPackageManager();
+  const packageJson = packageManager.retrievePackageJson();
+  const versionToInstall = getStorybookVersionSpecifier(packageManager.retrievePackageJson());
+  logger.info(`✅ Adding "@storybook/blocks" package`);
+  await packageManager.addDependencies({ installAsDevDependencies: true, packageJson }, [
+    `@storybook/blocks@${versionToInstall}`,
+  ]);
+}