Reactotron: Do not understand documentation about storybook switcher

[lucasluca]

The documentation do not says where to use storybook imported from reactotron

[rmevans9]

Can you show me your reactotron config?

[crobinson42]

I'm in the same boat - the example for using storybook doesn't not explain anything I can understand :-(

[crobinson42]

[crobinson42]

My solution was to define a Reactotron "custom command":

// App.js

...

const AppRoot = () => {
  const [showStorybook, setShowStorybook] = useState(false)

  Object.defineProperty(global, 'showStorybook', {
    configurable: true,
    get() {
      return showStorybook
    },
    set(value) {
      setShowStorybook(Boolean(value))
      return Boolean(value)
    },
  })

  return (
    <SafeAreaView style={{ flex: 1 }}>
      <Provider store={state}>
        {global.showStorybook ? <StorybookUI /> : <App />}
      </Provider>
    </SafeAreaView>
  )
}

// ReactotronConfig.js

...

Reactotron.onCustomCommand({
  command: 'storybook',
  handler() {
    global.showStorybook = !global.showStorybook
  },
  title: 'Toggle Storybook',
  description: 'Toggle between app and storybook',
})

[martinezguillaume]

Seems like storybookSwitcher function is not defined at first. But if I wait like so setTimeout(() => console.tron.log(Tron.storybookSwitcher), 1). It is defined, but we can't register yet the App with AppRegistry.registerComponent...