Nodes in chart monitor are not reused properly when adding/removing them

[kachkaev]

This is a duplicate of reduxjs/d3-state-visualizer#12 reduxjs/redux-devtools-chart-monitor#17 and I'm just posting it here as a reminder to upgrade deps when (if) the problem is resolved.

Here is what's happening when I add three leafs to a list at the very top one by one and then remove them (also one by one):

The second (the largest) state branch is not affected at all, but there's quite a lot going on visually.

Those strange unexpected horisontal jumps probably happen because of how d3 treats ids of the nodes. If they are represented as an array and id = i, adding or removing an item in the middle of it is likely to bring in this effect.

[zalmoxisus]

Thanks for the report. Unfortunately, I'm just a newbie in D3. Maybe @romseguy or some one who are experienced with D3 can look into it. If i is a bug related to D3 directly, maybe we could upgrade it to d3@4.

[kachkaev]

The issue has been (hopefully) solved by reduxjs/d3-state-visualizer#13, but we need two releases upstream from @romseguy before the transitions can be fixed in the extension.

@zalmoxisus what do you think of collaboratively moving all the extension parts to a new org (say, https://github.com/redux-devtools)? It'll be easier for the community to fix bugs in this case, because there'll be more people who can take a look at issues and PRs at any point in time. It'd be great if you could discuss this idea with other open source developers who've put efforts in building such a great tool.

[zalmoxisus]

@kachkaev thanks for addressing that. Yes, I'll make an org and move the instrumentation and ui as well.

[kachkaev]

ping @zalmoxisus 😃

@romseguy seems to be waiting for your move 😉

[gilamran]

I know that it's not a solution, but is there a way to disable the animations?
Disabling them would be a fast solution for me...

[zalmoxisus]

Hey @kachkaev thanks for working on that. Could you please publish that to npm so we can add it here. I see @romseguy granted access to that npm package. Without that nothing I can do from my side.

[kachkaev]

Will publish a new version of d3-state-visualizer in a couple of days. Thanks for reminding me about that @zalmoxisus!

[zalmoxisus]

Thanks for helping with that @kachkaev!
About collaboratively moving all the extension parts to a new org, I wanted to do that years ago, but still didn't have time. Another idea is to move everything into one repository (monorepo), so it would be easier for new contributors (no need to search for all the pieces). We still can keep monitors outside if there are maintainers willing to take care of them. I opened the discussion in reduxjs/redux-devtools#412.

[kachkaev]

d3-state-visualizer@1.3.2 is out now 😉

[zalmoxisus]

Thanks @kachkaev! I'll fix also other critical issues these days and include it in 2.16.

[zalmoxisus]

It is included in 2.16, which will land in a day on Chrome Store. Thanks again for your contribution!