redux-devtools/packages/map2tree
Nathan Bierema faff0db47b Publish
- remotedev-redux-devtools-extension@3.0.0-rc.1
 - d3-state-visualizer@1.4.1
 - d3tooltip@1.3.1
 - map2tree@1.5.1
 - react-base16-styling@0.8.1
 - react-dock@0.4.1
 - react-json-tree@0.15.1
 - @redux-devtools/app@1.0.0-9
 - @redux-devtools/chart-monitor@1.9.1
 - @redux-devtools/cli@1.0.0-10
 - @redux-devtools/dock-monitor@1.4.1
 - @redux-devtools/extension@3.0.0-rc.1
 - @redux-devtools/inspector-monitor-test-tab@0.7.3
 - @redux-devtools/inspector-monitor-trace-tab@0.2.3
 - @redux-devtools/inspector-monitor@1.0.1
 - @redux-devtools/instrument@1.11.1
 - @redux-devtools/log-monitor@2.3.1
 - @redux-devtools/remote@0.6.0
 - @redux-devtools/rtk-query-monitor@1.0.1
 - @redux-devtools/serialize@0.3.1
 - @redux-devtools/slider-monitor@2.0.0-9
 - @redux-devtools/ui@1.0.0-10
 - @redux-devtools/utils@1.0.0-7
 - @redux-devtools/core@3.9.1
 - d3-state-visualizer-tree-example@0.1.1
 - react-dock-demo@0.1.1
 - react-json-tree-example@1.1.3
 - test-demo@0.1.1
 - inspector-demo@0.1.1
 - rtk-query-demo@0.1.1
 - slider-todomvc@0.1.3
 - counter-redux@0.1.3
 - todomvc@0.2.2
2021-11-06 13:44:49 -04:00
..
src chore(deps): update all non-major dependencies (#758) 2021-08-26 09:52:23 -04:00
test feat(d3-state-visualizer): convert to TypeScript (#640) 2020-09-20 19:05:37 -04:00
.babelrc chore(*): clean up babel configs (#816) 2021-08-29 23:25:48 +00:00
.eslintignore feat(map2tree): convert to TypeScript (#638) 2020-09-19 19:56:40 -04:00
.eslintrc.js chore(*): move devDependencies back to packages (#870) 2021-09-18 23:47:03 +00:00
CHANGELOG.md chore(*): run prettier 2021-03-06 10:17:55 -05:00
jest.config.js feat(map2tree): convert to TypeScript (#638) 2020-09-19 19:56:40 -04:00
LICENSE.md Merge map2tree package (#426) 2018-12-19 16:50:39 +02:00
package.json Publish 2021-11-06 13:44:49 -04:00
README.md chore(*): make more packages scoped (#692) 2020-12-21 15:46:28 -05:00
tsconfig.json feat(map2tree): convert to TypeScript (#638) 2020-09-19 19:56:40 -04:00
tsconfig.webpack.json feat(map2tree): convert to TypeScript (#638) 2020-09-19 19:56:40 -04:00
webpack.config.umd.ts feat(d3-state-visualizer): convert to TypeScript (#640) 2020-09-20 19:05:37 -04:00

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 and someNestedArray 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'
          }
        }
      ]
    }
  ]
}