Redux-devtools: Hide by default

[Anahkiasen]

Is there any way to hide the LogMonitor by default on React? I see it has an isVisible property but as the LogMonitor is injected into DevTools component I'm not sure about how to pass it

[sapegin]

+1.

[bnoon]

+1

[bkniffler]

+1

[cpsubrian]

FWIW this is what I'm doing ... In the long term though it would be cool to make a UI for devtools, and an api for monitors to register themselves so we can have a little panel with checkmarks or something. Could be implemented in userland though.

import React from 'react'
import store from './redux/store'

let devtools = null
if (process.env.NODE_ENV === 'development' && window.localStorage.getItem('DEVTOOLS') === 'enabled') {
  const {DevTools, DebugPanel, LogMonitor} = require('redux-devtools/lib/react')
  const SliderMonitor = require('redux-slider-monitor')

  devtools = (
    <div className='debug-tools'>
      {window.localStorage.getItem('DEVTOOLS_LOG') === 'enabled' ? (
        <DebugPanel top right bottom>
          <DevTools store={store} monitor={LogMonitor}/>
        </DebugPanel>
      ) : null}
      {window.localStorage.getItem('DEVTOOLS_SLIDER') === 'enabled' ? (
        <DebugPanel left right bottom>
          <DevTools store={store}
                    realtime
                    monitor={SliderMonitor}
          />
        </DebugPanel>
      ) : null}
    </div>
  )
}

export default devtools

Note: I then import devtools above and inject it into my rendered output.

[opatut]

I would rather than changing the default (hidden / shown) have the visibility of the LogMonitor persisted, e.g in localStorage.

Edit: alright, I just realized that editorState.isVisible is actually persisted using persistState. Just do the ?debug_session=... thing ;)

[jackielii]

PR #75 attempt to resolve this.

[kevinold]

+1 I'd love to see/contribute a way to toggle the devtools panel open or closed. Trying to figure out where to hook in as toggling visibleOnLoad from #75 feels wrong. Any suggestions?

[kevinold]

Disregard my comment from above. I must have missed the Ctrl+H shortcut.

[gaearon]

We now offer <DevTools monitor={LogMonitor} visibleOnLoad={false} store={store} /> if you want it, and you have Ctrl+H shortcut to toggle, so I'm closing.

[Anahkiasen]

Thanks!

[crashbell]

Just for someone who jumping in to this first (like me), no more visibleOnLoad link here