feat(storybook): upgrade @storybook/react-native version to ^6.0.1-be…

…ta.5 - also move the toggle-storybook.tsx to src/storbyook folder rather than .storybook
nrwl · Apr 1, 2022 · f35a2c4 · f35a2c4
1 parent 9b13b53
commit f35a2c4
Show file tree

Hide file tree

Showing 9 changed files with 29 additions and 10 deletions.
diff --git a/e2e/react-native/src/react-native.test.ts b/e2e/react-native/src/react-native.test.ts
@@ -66,8 +66,8 @@ describe('react native', () => {
     expect(() =>
       checkFilesExist(
         `.storybook/story-loader.js`,
-        `apps/${appName}/.storybook/storybook.ts`,
-        `apps/${appName}/.storybook/toggle-storybook.tsx`,
+        `apps/${appName}/src/storybook/storybook.ts`,
+        `apps/${appName}/src/storybook/toggle-storybook.tsx`,
         `apps/${appName}/src/app/App.stories.tsx`
       )
     ).not.toThrow();

diff --git a/...act-native/src/generators/component-story/files/__componentFileName__.stories.__fileExt__ b/...act-native/src/generators/component-story/files/__componentFileName__.stories.__fileExt__
@@ -19,7 +19,6 @@ const props <% if ( propsTypeName ) { %>:<%= propsTypeName %><% } %> = {<% for (
 <% } %>};
 
 storiesOf('<%= componentName %>', module)
-  .addDecorator((getStory) => <>{getStory()}</>)
   .add('Primary', () => (
     <<%= componentName %> {...props} <% if (hasActions) { %> {...actions} <% } %>/>
   ));
diff --git a/packages/react-native/src/generators/storybook-configuration/files/app/storybook.ts.template b/packages/react-native/src/generators/storybook-configuration/files/app/storybook.ts.template
@@ -1,6 +1,6 @@
 import { configure, getStorybookUI } from '@storybook/react-native';
 
-import { loadStories } from '../../../.storybook/story-loader';
+import { loadStories } from '../../../../.storybook/story-loader';
 
 configure(loadStories(), module, false);
 

diff --git a/...act-native/src/generators/storybook-configuration/files/app/toggle-storybook.tsx.template b/...act-native/src/generators/storybook-configuration/files/app/toggle-storybook.tsx.template
@@ -5,7 +5,7 @@ import React, { useState, useEffect, useRef } from 'react';
 import { DevSettings } from 'react-native';
 import AsyncStorage from '@react-native-async-storage/async-storage';
 
-import AppRoot from '../src/app/App';
+import AppRoot from '../app/App';
 
 export const DEFAULT_REACTOTRON_WS_URI = 'ws://localhost:9090';
 

diff --git a/packages/react-native/src/generators/storybook-configuration/lib/create-storybook-files.ts b/packages/react-native/src/generators/storybook-configuration/lib/create-storybook-files.ts
@@ -53,7 +53,7 @@ export async function createStorybookFiles(
   generateFiles(
     host,
     join(__dirname, '../files/app'),
-    join(root, '.storybook'),
+    join(root, 'src', 'storybook'),
     {
       tmpl: '',
       offsetFromRoot: offsetFromRoot(sourceRoot),

diff --git a/...c/generators/storybook-configuration/lib/replace-app-import-with-storybook-toggle.spec.ts b/...c/generators/storybook-configuration/lib/replace-app-import-with-storybook-toggle.spec.ts
@@ -34,7 +34,7 @@ describe('replaceAppImportWithStorybookToggle', () => {
     const mainFile = tree.read('apps/products/src/main.tsx', 'utf-8');
     expect(formatFile`${mainFile}`).toEqual(
       formatFile`import { AppRegistry } from 'react-native';
-      import App from '../.storybook/toggle-storybook';
+      import App from './storybook/toggle-storybook';
       
       AppRegistry.registerComponent('main', () => App);`
     );
@@ -57,7 +57,7 @@ describe('replaceAppImportWithStorybookToggle', () => {
     const mainFile = tree.read('apps/products/src/main.tsx', 'utf-8');
     expect(formatFile`${mainFile}`).toEqual(
       formatFile`import { AppRegistry } from 'react-native';
-      import App from '../.storybook/toggle-storybook';
+      import App from './storybook/toggle-storybook';
       
       AppRegistry.registerComponent('main', () => App);`
     );

diff --git a/...ve/src/generators/storybook-configuration/lib/replace-app-import-with-storybook-toggle.ts b/...ve/src/generators/storybook-configuration/lib/replace-app-import-with-storybook-toggle.ts
@@ -20,7 +20,7 @@ export function replaceAppImportWithStorybookToggle(
 
   const mainFilePath = join(sourceRoot, schema.js ? 'main.js' : 'main.tsx');
   const appImportImport = `import App from './app/App';`;
-  const storybookeToggleImport = `import App from '../.storybook/toggle-storybook';`;
+  const storybookeToggleImport = `import App from './storybook/toggle-storybook';`;
 
   try {
     logger.debug(`Updating import for ${mainFilePath}`);

diff --git a/packages/storybook/migrations.json b/packages/storybook/migrations.json
@@ -87,6 +87,26 @@
         "@storybook/core-server": {
           "version": "~6.4.12",
           "alwaysAddToPackageJson": true
+        },
+        "@storybook/react-native": {
+          "version": "^6.0.1-beta.5",
+          "alwaysAddToPackageJson": false
+        },
+        "@storybook/addon-ondevice-actions": {
+          "version": "^6.0.1-beta.5",
+          "alwaysAddToPackageJson": false
+        },
+        "@storybook/addon-ondevice-backgrounds": {
+          "version": "^6.0.1-beta.5",
+          "alwaysAddToPackageJson": false
+        },
+        "@storybook/addon-ondevice-controls": {
+          "version": "^6.0.1-beta.5",
+          "alwaysAddToPackageJson": false
+        },
+        "@storybook/addon-ondevice-notes": {
+          "version": "^6.0.1-beta.5",
+          "alwaysAddToPackageJson": false
         }
       }
     },

diff --git a/packages/storybook/src/utils/versions.ts b/packages/storybook/src/utils/versions.ts
@@ -6,5 +6,5 @@ export const babelPresetTypescriptVersion = '7.12.13';
 export const svgrVersion = '^5.4.0';
 export const urlLoaderVersion = '^3.0.0';
 export const webpack5Version = '^5.64.0';
-export const storybookReactNativeVersion = '6.0.1-alpha.7';
+export const storybookReactNativeVersion = '^6.0.1-beta.5';
 export const reactNativeStorybookLoader = '^2.0.5';