CLI: Add legacyMdx1 & @storybook/mdx1-csf automigration

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

@@ -5,6 +5,7 @@ import { webpack5 } from './webpack5';
 import { vite4 } from './vite4';
 import { vue3 } from './vue3';
 import { mdxgfm } from './mdx-gfm';
+import { removeLegacyMDX1 } from './remove-legacymdx1';
 import { eslintPlugin } from './eslint-plugin';
 import { builderVite } from './builder-vite';
 import { viteConfigFile } from './vite-config-file';
@@ -51,6 +52,7 @@ export const allFixes: Fix[] = [
   reactDocgen,
   storyshotsMigration,
   removeReactDependency,
+  removeLegacyMDX1,
   webpack5CompilerSetup,
 ];
 

code/lib/cli/src/automigrate/fixes/mdx-gfm.test.ts

@@ -40,6 +40,7 @@ describe('no-ops', () => {
         packageManager: {},
         main: {
           features: {
+            // @ts-expect-error (user might be upgrading from a version that had this option)
             legacyMdx1: true,
           },
         },

code/lib/cli/src/automigrate/fixes/mdx-gfm.ts

@@ -54,6 +54,7 @@ export const mdxgfm: Fix<Options> = {
       return files.some((f) => f.endsWith('.mdx'));
     }, Promise.resolve(false));
 
+    // @ts-expect-error (user might be upgrading from an older version that still had it)
     const usesMDX1 = mainConfig?.features?.legacyMdx1 === true || false;
     const skip =
       usesMDX1 ||

code/lib/cli/src/automigrate/fixes/remove-legacymdx1.ts

@@ -0,0 +1,56 @@
+import { dedent } from 'ts-dedent';
+
+import { writeConfig } from '@storybook/csf-tools';
+
+import type { Fix } from '../types';
+import { updateMainConfig } from '../helpers/mainConfigFile';
+
+const logger = console;
+
+interface RemoveLegacyMDX1Options {
+  hasFeature: boolean;
+}
+
+/**
+ * Does the user have 'legacyMdx1' in their main.ts?
+ *
+ * If so, prompt them to upgrade to delete it.
+ */
+export const removeLegacyMDX1: Fix<RemoveLegacyMDX1Options> = {
+  id: 'builder-vite',
+
+  async check({ mainConfig }) {
+    if (mainConfig.features) {
+      //
+      return {
+        hasFeature: !!Object.hasOwn(mainConfig.features, 'legacyMdx1'),
+      };
+    }
+
+    return null;
+  },
+
+  prompt({}) {
+    return dedent`
+      You have features.legacyMdx1 in your Storybook main config file. This feature has been removed. Shall we remove it from your Storybook main config file?
+
+      Link: https://storybook.js.org/docs/8.0/migration-guide
+    `;
+  },
+
+  async run({ dryRun, mainConfigPath, skipInstall, packageManager }) {
+    logger.info(`✅ Removing legacyMdx1 feature`);
+    if (!dryRun) {
+      await updateMainConfig({ dryRun: !!dryRun, mainConfigPath }, async (main) => {
+        main.removeField(['features', 'legacyMdx1']);
+        await writeConfig(main);
+      });
+
+      const packageJson = await packageManager.retrievePackageJson();
+
+      await packageManager.removeDependencies({ skipInstall: skipInstall, packageJson }, [
+        '@storybook/mdx1-csf',
+      ]);
+    }
+  },
+};

code/lib/types/src/modules/core-common.ts

@@ -355,11 +355,6 @@ export interface StorybookConfigRaw {
      */
     argTypeTargetsV7?: boolean;
 
-    /**
-     * Use legacy MDX1, to help smooth migration to 7.0
-     */
-    legacyMdx1?: boolean;
-
     /**
      * Apply decorators from preview.js before decorators from addons or frameworks
      */

docs/api/main-config-features.md

@@ -10,7 +10,6 @@ Type:
 {
   argTypeTargetsV7?: boolean;
   legacyDecoratorFileOrder?: boolean;
-  legacyMdx1?: boolean;
 }
 ```