reactotron
reactotron copied to clipboard
Do not understand documentation about storybook switcher
The documentation do not says where to use storybook imported from reactotron
Can you show me your reactotron config?
I'm in the same boat - the example for using storybook doesn't not explain anything I can understand :-(
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',
})
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
...