Merge branch 'fix-state-bleeding-in-js' of https://github.com/sherlo-…

…io/sherlo into fix-state-bleeding-in-js

packages/react-native-storybook/src/addToggleStorybookToDevMenu.ts → packages/react-native-storybook/src/addStorybookToDevMenu.ts

@@ -9,7 +9,7 @@ try {
 
 const { SherloModule: SherloNativeModule } = NativeModules;
 
-function addToggleStorybookToDevMenu() {
+function addStorybookToDevMenu() {
   if (!__DEV__ || devMenuToggleInitialized) return;
 
   const MENU_LABEL = 'Toggle Storybook';
@@ -24,4 +24,4 @@ function addToggleStorybookToDevMenu() {
   devMenuToggleInitialized = true;
 }
 
-export default addToggleStorybookToDevMenu;
+export default addStorybookToDevMenu;

packages/react-native-storybook/src/index.ts

@@ -1,12 +1,8 @@
+export { default as addStorybookToDevMenu } from './addStorybookToDevMenu';
 export { default as getStorybook } from './getStorybook';
-export { default as isRunningStorybook } from './isRunningStorybook';
 export { default as isRunningVisualTests } from './isRunningVisualTests';
+export { default as isStorybookMode } from './isStorybookMode';
 export { default as openStorybook } from './openStorybook';
-export { default as shouldShowStorybook } from './shouldShowStorybook';
 export { default as verifyIntegration } from './verifyIntegration';
 
 export * from './types';
-
-import addToggleStorybookToDevMenu from './addToggleStorybookToDevMenu';
-
-addToggleStorybookToDevMenu();

packages/react-native-storybook/src/isStorybookMode.ts

@@ -0,0 +1,17 @@
+import { NativeModules } from 'react-native';
+
+const { SherloModule } = NativeModules;
+
+/**
+ * isStorybookMode determines whether Storybook should be displayed.
+ *
+ * Returns true if any of the following conditions are met:
+ * 1. User selected "Toggle Storybook" in Dev Menu
+ * 2. User called "openStorybook" function imported from "@sherlo/react-native-storybook"
+ * 3. Build is running tests on Sherlo
+ */
+const isStorybookMode = ['storybook', 'testing', 'verification'].includes(
+  SherloModule?.getConstants().mode
+);
+
+export default isStorybookMode;

testing/expo-storybook-8/App.tsx

@@ -1,4 +1,4 @@
-import { shouldShowStorybook } from '@sherlo/react-native-storybook';
+import { isStorybookMode } from '@sherlo/react-native-storybook';
 import Storybook from './.storybook';
 import { PropsWithChildren } from 'react';
 import HomeScreen from './src/HomeScreen';
@@ -34,7 +34,7 @@ export default function App() {
    * Note: If called without parameters, like "shouldShowStorybook()",
    * only conditions 2, 3 and 4 apply.
    */
-  if (shouldShowStorybook(Constants.expoConfig?.extra?.storybookEnabled)) {
+  if (Constants.expoConfig?.extra?.storybookEnabled || isStorybookMode) {
     return (
       <CommonProviders>
         <Storybook />