mirror of
https://github.com/reduxjs/redux-devtools.git
synced 2024-11-15 14:17:07 +03:00
4164b6279e
* d3tooltip * map2tree * d3-state-visualizer * react-base16-styling * react-dock * Cleanup * Update * react-json-tree * redux-devtools * redux-devtools-app * redux-devtools-app-core * redux-devtools-cli * Fix * redux-devtools-dock-monitor * redux-devtools-extension * redux-devtools-inspector-monitor * redux-devtools-inspector-monitor-test-tab * redux-devtools-inspector-monitor-trace-tab * redux-devtools-instrument * Simplify * redux-devtools-log-monitor * redux-devtools-remote * redux-devtools-rtk-query-monitor * redux-devtools-serialize * redux-devtools-slider-monitor * redux-devtools-utils * Format |
||
---|---|---|
.. | ||
src | ||
test | ||
CHANGELOG.md | ||
eslint.config.js | ||
jest.config.cjs | ||
LICENSE.md | ||
package.json | ||
README.md | ||
tsconfig.json | ||
tsconfig.test.json |
A pure function to convert a map into a tree structure. Created by @romseguy and merged from romseguy/map2tree
.
The following opinions must be taken into account since the primary use case of this library is redux-devtools-chart-monitor:
- Objects and arrays deeply nested within collections are not converted into a tree structure. See
someNestedObject
andsomeNestedArray
in the output below, or the corresponding test. - Provides support for Immutable.js data structures (only List and Map though).
Usage
map2tree(
someMap,
(options = {
key: 'state', // the name you want for as the root node of the output tree
pushMethod: 'push', // use 'unshift' to change the order children nodes are added
}),
);
Input
const someMap = {
someReducer: {
todos: [
{ title: 'map', someNestedObject: { foo: 'bar' } },
{ title: 'to', someNestedArray: ['foo', 'bar'] },
{ title: 'tree' },
{ title: 'map2tree' },
],
completedCount: 1,
},
otherReducer: {
foo: 0,
bar: { key: 'value' },
},
};
Output
{
name: `${options.key}`,
children: [
{
name: 'someReducer',
children: [
{
name: 'todos',
children: [
{
name: 'todo[0]',
object: {
title: 'map',
someNestedObject: {foo: 'bar'}
}
},
{
name: 'todo[1]',
object: {
title: 'to',
someNestedArray: ['foo', 'bar']
}
},
// ...
]
},
// ...
]
},
{
name: 'otherReducer',
children: [
{
name: 'foo',
value: 0
},
{
name: 'bar',
object: {
key: 'value'
}
}
]
}
]
}