From 277d6c50a2e8e8c816a75eb538d6afaa76571cbe Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Sat, 12 Oct 2019 09:41:23 +0800
Subject: [PATCH] CLI: REACT template CSF refactor

---
 lib/cli/generators/REACT/index.js             | 24 +++++++------------
 .../.storybook/addons.js                      |  0
 .../.storybook/config.js                      |  0
 .../stories/0-Welcome.stories.js              |  0
 .../stories/1-Button.stories.js               |  0
 lib/cli/lib/initiate.js                       |  2 +-
 6 files changed, 10 insertions(+), 16 deletions(-)
 rename lib/cli/generators/REACT/{template => template-csf}/.storybook/addons.js (100%)
 rename lib/cli/generators/REACT/{template => template-csf}/.storybook/config.js (100%)
 rename lib/cli/generators/REACT/{template => template-csf}/stories/0-Welcome.stories.js (100%)
 rename lib/cli/generators/REACT/{template => template-csf}/stories/1-Button.stories.js (100%)

diff --git a/lib/cli/generators/REACT/index.js b/lib/cli/generators/REACT/index.js
index 31dbea118bb..a38635234f6 100644
--- a/lib/cli/generators/REACT/index.js
+++ b/lib/cli/generators/REACT/index.js
@@ -1,23 +1,23 @@
-import path from 'path';
-import fse from 'fs-extra';
 import {
   getVersions,
   getPackageJson,
   writePackageJson,
   getBabelDependencies,
   installDependencies,
+  copyTemplate,
 } from '../../lib/helpers';
 
-export default async npmOptions => {
-  const [storybookVersion, actionsVersion, linksVersion, addonsVersion] = await getVersions(
-    npmOptions,
+export default async (npmOptions, { storyFormat = 'csf' }) => {
+  const packages = [
     '@storybook/react',
     '@storybook/addon-actions',
     '@storybook/addon-links',
-    '@storybook/addons'
-  );
+    '@storybook/addons',
+  ];
 
-  fse.copySync(path.resolve(__dirname, 'template/'), '.', { overwrite: true });
+  const versionedPackages = await getVersions(npmOptions, ...packages);
+
+  copyTemplate(__dirname, storyFormat);
 
   const packageJson = getPackageJson();
 
@@ -32,11 +32,5 @@ export default async npmOptions => {
 
   const babelDependencies = await getBabelDependencies(npmOptions, packageJson);
 
-  installDependencies(npmOptions, [
-    `@storybook/react@${storybookVersion}`,
-    `@storybook/addon-actions@${actionsVersion}`,
-    `@storybook/addon-links@${linksVersion}`,
-    `@storybook/addons@${addonsVersion}`,
-    ...babelDependencies,
-  ]);
+  installDependencies(npmOptions, [...versionedPackages, ...babelDependencies]);
 };
diff --git a/lib/cli/generators/REACT/template/.storybook/addons.js b/lib/cli/generators/REACT/template-csf/.storybook/addons.js
similarity index 100%
rename from lib/cli/generators/REACT/template/.storybook/addons.js
rename to lib/cli/generators/REACT/template-csf/.storybook/addons.js
diff --git a/lib/cli/generators/REACT/template/.storybook/config.js b/lib/cli/generators/REACT/template-csf/.storybook/config.js
similarity index 100%
rename from lib/cli/generators/REACT/template/.storybook/config.js
rename to lib/cli/generators/REACT/template-csf/.storybook/config.js
diff --git a/lib/cli/generators/REACT/template/stories/0-Welcome.stories.js b/lib/cli/generators/REACT/template-csf/stories/0-Welcome.stories.js
similarity index 100%
rename from lib/cli/generators/REACT/template/stories/0-Welcome.stories.js
rename to lib/cli/generators/REACT/template-csf/stories/0-Welcome.stories.js
diff --git a/lib/cli/generators/REACT/template/stories/1-Button.stories.js b/lib/cli/generators/REACT/template-csf/stories/1-Button.stories.js
similarity index 100%
rename from lib/cli/generators/REACT/template/stories/1-Button.stories.js
rename to lib/cli/generators/REACT/template-csf/stories/1-Button.stories.js
diff --git a/lib/cli/lib/initiate.js b/lib/cli/lib/initiate.js
index 4eb4e0e52ee..74280487951 100644
--- a/lib/cli/lib/initiate.js
+++ b/lib/cli/lib/initiate.js
@@ -87,7 +87,7 @@ const installStorybook = (projectType, options) => {
           .then(end);
 
       case types.REACT:
-        return reactGenerator(npmOptions)
+        return reactGenerator(npmOptions, generatorOptions)
           .then(commandLog('Adding storybook support to your "React" app'))
           .then(end);