reduxjs / redux-devtools-chart-monitor Goto Github PK

The issue is likely to be upstream (reduxjs/d3-state-visualizer#12), but I still decided to report it here as well until the dependency is upgraded. For those who're wondering if this is what they see too, here is a quick gif of the bug:

Steps to reproduce:

• Collapse a node
• Make a state change
• Node isn't collapsed anymore

Is there a way to set an initial "expandedNodes" prop to false so that it won't try and render the entire state tree? We sometimes load large json structures that we don't care to look at yet the monitor will try and render, causing it to slow down to a crawl and making the tool unusable :(

I'm hooking into the TreeChart's onClickText prop and using JSONTree to render my object to the right....(using your ChartMonitor in a seperate window).

Might be interesting to incorporate something like this as it sort of becomes a standalone dev tool (I've been using this on it's own all day and not even rendering the normal LogMonitor). Though hooking into the LogMonitor would probably be even cooler : )

Anyhow, thanks for this!

This is somewhat related to #5 and #10.
When a node contains too many children, clicking on it to expand or collapse causes a substantial shift of a tree. You have zoom out and search for the node you've just been looking at, which takes quite a lot of time. A solution could be in calculating x and y of a just-clicked node in two modes (when its children are hidden and visible) and then adjusting the global coordinate system accordingly.

I used DockMonitor to make it dockable.

const DevTools = createDevTools(
  <DockMonitor toggleVisibilityKey='ctrl-h'
               changePositionKey='ctrl-q'
               changeMonitorKey='ctrl-m'
               defaultIsVisible={ false }>
    <LogMonitor />
    <SliderMonitor />
    <DiffMonitor />
    <ChartMonitor />
  </DockMonitor>
);

My DockMonitor version is 1.1.1, ChartMonitor version is 1.4.1.
So how to fix it?

I see the reducer is handling TOGGLE_VISIBILITY, but it is not dispatched from anywhere. Is it an orphaned code that should be removed?

I just followed the instructions, pretty straight forward, but I'm getting these error:

TypeError: Cannot read property 'object' of undefined
./node_modules/redux-devtools-chart-monitor/lib/Chart.js

  62 | }(_react.Component);
  63 | 
  64 | Chart.propTypes = {
> 65 |   state: _react.PropTypes.object,
  66 |   rootKeyName: _react.PropTypes.string,
  67 |   pushMethod: _react.PropTypes.oneOf(['push', 'unshift']),
  68 |   tree: _react.PropTypes.shape({

I'm getting these error even before use the component in my Monitor component, I'm only importing it
import ChartMonitor from 'redux-devtools-chart-monitor'

I am using the version 1.6.1

Some complex data structures can't be serialized to be pretty-printed in the tooltip, replace json-pretty with our own function depending on answer over here michielbdejong/json-pretty#3

Hi Romain,

I added redux-devtools-chart-monitor to a new project recently and noticed some rendering issues, which I did not see before. Here's the summary:

(VM6084:208 Uncaught TypeError: Cannot read property '__oldData__' of undefined appears on first render and each time I click on a node)

To make sure it's not something about my project, I replicated the issue in your redux-store-visualizer demo after updating all deps (see romseguy/redux-store-visualizer#4). It's still unclear to me how to fix it, so I'm submitting an issue instead of a PR. Missing edges between the nodes might give a clue.

I'm using the , and this is my code.

  <DockMonitor toggleVisibilityKey='ctrl-h'
               changePositionKey='ctrl-q'
               changeMonitorKey='ctrl-m'
               defaultIsVisible={ false }>
    <LogMonitor />
    <SliderMonitor />
    <DiffMonitor />
    <ChartMonitor />
  </DockMonitor>

It will work when defaultIsVisible is true