From 9cda076c2de0dbba8509ca471017bb06b5509f0e Mon Sep 17 00:00:00 2001
From: Katerina Skroumpelou <sk.katherine@gmail.com>
Date: Wed, 9 Mar 2022 20:41:37 +0200
Subject: [PATCH] feat(storybook): show warning about version 5 support drop

---
 .../src/executors/storybook/storybook.impl.ts  | 18 ++++++++++++++++++
 packages/storybook/src/executors/utils.ts      | 11 ++++++++++-
 .../generators/configuration/configuration.ts  | 18 ++++++++++++++++++
 3 files changed, 46 insertions(+), 1 deletion(-)

diff --git a/packages/storybook/src/executors/storybook/storybook.impl.ts b/packages/storybook/src/executors/storybook/storybook.impl.ts
index 099454f0990ed6..c59d0a584aa15a 100644
--- a/packages/storybook/src/executors/storybook/storybook.impl.ts
+++ b/packages/storybook/src/executors/storybook/storybook.impl.ts
@@ -7,6 +7,7 @@ import {
   normalizeAngularBuilderStylesOptions,
   resolveCommonStorybookOptionMapper,
   runStorybookSetupCheck,
+  isStorybookLT6,
 } from '../utils';
 export interface StorybookExecutorOptions extends CommonNxStorybookConfig {
   host?: string;
@@ -34,6 +35,23 @@ export default async function* storybookExecutor(
   // print warnings
   runStorybookSetupCheck(options);
 
+  if (isStorybookLT6()) {
+    logger.warn(
+      `It looks like you're using Storybook version 5.
+      Please note that starting with Nx version 14, Nx will drop support for Storybook version 5.
+      Before upgrading to Nx 14, please make sure you have migrated your Storybook configurations
+      to the latest version of Storybook.
+
+      For more information, please take a look at our upgrade guide:
+      ${
+        options.uiFramework === '@storybook/angular'
+          ? 'https://nx.dev/storybook/upgrade-storybook-v6-angular'
+          : 'https://nx.dev/storybook/upgrade-storybook-v6-react'
+      }
+      `
+    );
+  }
+
   await runInstance(option);
 
   yield { success: true };
diff --git a/packages/storybook/src/executors/utils.ts b/packages/storybook/src/executors/utils.ts
index 08b17b0f198f5d..726ef94afbaf1d 100644
--- a/packages/storybook/src/executors/utils.ts
+++ b/packages/storybook/src/executors/utils.ts
@@ -13,7 +13,7 @@ import { checkAndCleanWithSemver } from '@nrwl/workspace/src/utilities/version-u
 import 'dotenv/config';
 import { existsSync, readFileSync } from 'fs';
 import { join } from 'path';
-import { gte } from 'semver';
+import { gte, lt } from 'semver';
 import {
   findOrCreateConfig,
   readCurrentWorkspaceStorybookVersionFromExecutor,
@@ -296,6 +296,15 @@ function isStorybookGTE6_4() {
   );
 }
 
+export function isStorybookLT6() {
+  const storybookVersion = readCurrentWorkspaceStorybookVersionFromExecutor();
+
+  return lt(
+    checkAndCleanWithSemver('@storybook/core', storybookVersion),
+    '6.0.0'
+  );
+}
+
 export function findStorybookAndBuildTargets(targets: {
   [targetName: string]: TargetConfiguration;
 }): {
diff --git a/packages/storybook/src/generators/configuration/configuration.ts b/packages/storybook/src/generators/configuration/configuration.ts
index 27d4e134777bce..480bbca7cce6ef 100644
--- a/packages/storybook/src/generators/configuration/configuration.ts
+++ b/packages/storybook/src/generators/configuration/configuration.ts
@@ -78,6 +78,23 @@ export async function configurationGenerator(
     }
   }
 
+  if (workspaceStorybookVersion !== '6') {
+    logger.warn(
+      `It looks like you're using Storybook version 5.
+      Please note that starting with Nx version 14, Nx will drop support for Storybook version 5.
+      Before upgrading to Nx 14, please make sure you have migrated your Storybook configurations
+      to the latest version of Storybook.
+
+      For more information, please take a look at our upgrade guide:
+      ${
+        rawSchema.uiFramework === '@storybook/angular'
+          ? 'https://nx.dev/storybook/upgrade-storybook-v6-angular'
+          : 'https://nx.dev/storybook/upgrade-storybook-v6-react'
+      }
+      `
+    );
+  }
+
   await formatFiles(tree);
 
   return runTasksInSerial(...tasks);
@@ -112,6 +129,7 @@ function createRootStorybookDir(
     `adding .storybook folder to the root directory - 
      based on the Storybook version installed (v${workspaceStorybookVersion}), we'll bootstrap a scaffold for that particular version.`
   );
+
   const templatePath = join(
     __dirname,
     workspaceStorybookVersion === '6' ? './root-files' : './root-files-5'