Search code examples
javascriptnode.jsjsonecmascript-6treeview

How to convert string path to JSON parent-child tree using node js?


I have been trying to convert an array of paths to the JSON parent-child tree using node js. I am following @Nenad Vracar answer for building the tree link. I am using the mentioned answer which I have slightly modified. Below is my code:

function buildTree(obj) {
  let result = [];
  let level = {
    result
  };

  obj.forEach(item => {
    if (typeof item.fsLocation != "undefined") {
      var obj = {}
      var path = ""
      item.fsLocation.split('/').reduce((r, name, i, a) => {
        path += "/"+name

        if (!r[name]) {
          r[name] = {
            result:[]
          };
          obj = {
            name,
            children: r[name].result
          }
          if(r[name].result.length < 1){
            obj["path"] = item.fsLocation
            obj["fileSize"] = item.fileSize
            obj["createDate"] = item.createDate
            obj["editDate"] = item.editDate
            obj["fileType"] = item.fileType
            obj["version"] = item.version
          }
          r.result.push(obj)
        }
        return r[name];
      }, level)
    }
  })
  return result
}

obj:

[
   {
      "createDate":"2019-10-03T07:00:00Z",
      "fileType":"pptx",
      "fsLocation":"Events/Plays/Technologies/Continuity/technology.pptx",
      "fileSize":46845322,
      "fileName":"technology.pptx",
      "editDate":"2019-10-03T07:00:00Z",
      "version":"10.0"
   },
   {
      "fileName":"operations.pptx",
      "fileSize":23642178,
      "fileType":"pptx",
      "fsLocation":"Events/Plays/Technologies/operations.pptx",
      "createDate":"2019-01-08T08:00:00Z",
      "editDate":"2019-01-09T08:00:00Z",
      "version":"15.0"
   },
   {
      "fileName":"Solution.pdf",
      "createDate":"2016-06-16T22:42:16Z",
      "fileSize":275138,
      "fsLocation":"Events/Plays/Technologies/Solution.pdf",
      "fileType":"pdf",
      "editDate":"2016-06-16T22:42:16Z",
      "version":"1.0"
   }
]

Using that above code my output is like below:

[
   {
      "name":"Events",
      "children":[
         {
            "name":"Plays",
            "children":[
               {
                  "name":"Technologies",
                  "children":[
                     {
                        "name":"Continuity",
                        "children":[
                           {
                              "name":"technology.pptx",
                              "children":[
                                 
                              ],
                              "path":"Events/Plays/Technologies/Continuity/technology.pptx",
                              "fileSize":46845322,
                              "createDate":"2019-10-03T07:00:00Z",
                              "editDate":"2019-10-03T07:00:00Z",
                              "fileType":"pptx",
                              "version":"10.0"
                           }
                        ],
                        "path":"Events/Plays/Technologies/Continuity/technology.pptx",
                        "fileSize":46845322,
                        "createDate":"2019-10-03T07:00:00Z",
                        "editDate":"2019-10-03T07:00:00Z",
                        "fileType":"pptx",
                        "version":"10.0"
                     },
                     {
                        "name":"Technologies",
                        "children":[
                           {
                              "name":"operations.pptx",
                              "children":[
                                 
                              ],
                              "path":"Events/Plays/Technologies/operations.pptx",
                              "fileSize":23642178,
                              "createDate":"2019-01-08T08:00:00Z",
                              "editDate":"2019-01-09T08:00:00Z",
                              "fileType":"pptx",
                              "version":"15.0"
                           },
                           {
                              "name":"Solution.pdf",
                              "children":[
                                 
                              ],
                              "path":"Events/Plays/Technologies/Solution.pdf",
                              "fileSize":275138,
                              "createDate":"2016-06-16T22:42:16Z",
                              "editDate":"2016-06-16T22:42:16Z",
                              "fileType":"pdf",
                              "version":"1.0"
                           }
                        ],
                        "path":"Events/Plays/Technologies/operations.pptx",
                        "fileSize":23642178,
                        "createDate":"2019-01-08T08:00:00",
                        "editDate":"2019-01-09T08:00:00Z",
                        "fileType":"pptx",
                        "version":"15.0"
                     }
                  ]
               }
            ]
         }
      ]
   }
]

I would like to get output like below

[
   {
      "name":"Events",
      "path":"Events",
      "children":[
         {
            "name":"Plays",
            "path":"Events/Plays",
            "children":[
               {
                  "name":"Technologies",
                  "path":"Events/Plays/Technologies",
                  "children":[
                     {
                        "name":"Continuity",
                        "path":"Events/Plays/Technologies/Continuity",
                        "children":[
                           {
                              "name":"technology.pptx",
                              "children":[
                                 
                              ],
                              "path":"Events/Plays/Technologies/Continuity/technology.pptx",
                              "fileSize":46845322,
                              "createDate":"2019-10-03T07:00:00Z",
                              "editDate":"2019-10-03T07:00:00Z",
                              "fileType":"pptx",
                              "version":"10.0"
                           }
                        ]
                     },
                     {
                        "name":"Technologies",
                        "path":"Events/Plays/Technologies",
                        "children":[
                           {
                              "name":"operations.pptx",
                              "children":[
                                 
                              ],
                              "path":"Events/Plays/Technologies/operations.pptx",
                              "fileSize":23642178,
                              "createDate":"2019-01-08T08:00:00Z",
                              "editDate":"2019-01-09T08:00:00Z",
                              "fileType":"pptx",
                              "version":"15.0"
                           },
                           {
                              "name":"Solution.pdf",
                              "children":[
                                 
                              ],
                              "path":"Events/Plays/Technologies/Solution.pdf",
                              "fileSize":275138,
                              "createDate":"2016-06-16T22:42:16Z",
                              "editDate":"2016-06-16T22:42:16Z",
                              "fileType":"pdf",
                              "version":"1.0"
                           }
                        ]
                     }
                  ]
               }
            ]
         }
      ]
   }
]

Any idea of how to produce the above output?


Solution

  • Always favor readability over fancy:

    const arr = [{
        "fileName": "operations.pptx",
        "fileSize": 23642178,
        "fileType": "pptx",
        "fsLocation": "Events/Plays/Technologies/operations.pptx",
        "createDate": "2019-01-08T08:00:00Z",
        "editDate": "2019-01-09T08:00:00Z",
        "version": "15.0"
      },
      {
        "createDate": "2019-10-03T07:00:00Z",
        "fileType": "pptx",
        "fsLocation": "Events/Plays/Technologies/Continuity/technology.pptx",
        "fileSize": 46845322,
        "fileName": "technology.pptx",
        "editDate": "2019-10-03T07:00:00Z",
        "version": "10.0"
      },
      {
        "fileName": "Solution.pdf",
        "createDate": "2016-06-16T22:42:16Z",
        "fileSize": 275138,
        "fsLocation": "Events/Plays/Technologies/Solution.pdf",
        "fileType": "pdf",
        "editDate": "2016-06-16T22:42:16Z",
        "version": "1.0"
      }
    ]
    
    const tree = {
      name: 'root',
      path: '',
      children: []
    }
    
    for (const e of arr) {
      let node = tree
      const nodenames = e.fsLocation.split('/')
      while (nodenames.length > 0) {
        const nodename = nodenames.shift()
        if (!node.children.map(e => e.name).includes(nodename)) {
          node.children.push({
            name: nodename,
            path: [node.path, nodename].join('/'),
            children: []
          })
        }
        node = node.children.filter(e => e.name === nodename)[0]
      }
    }
    console.log(JSON.stringify(tree, null, 2));

    returns tree:

    {
      "name": "root",
      "path": "",
      "children": [
        {
          "name": "Events",
          "path": "/Events",
          "children": [
            {
              "name": "Plays",
              "path": "/Events/Plays",
              "children": [
                {
                  "name": "Technologies",
                  "path": "/Events/Plays/Technologies",
                  "children": [
                    {
                      "name": "operations.pptx",
                      "path": "/Events/Plays/Technologies/operations.pptx",
                      "children": []
                    },
                    {
                      "name": "Continuity",
                      "path": "/Events/Plays/Technologies/Continuity",
                      "children": [
                        {
                          "name": "technology.pptx",
                          "path": "/Events/Plays/Technologies/Continuity/technology.pptx",
                          "children": []
                        }
                      ]
                    },
                    {
                      "name": "Solution.pdf",
                      "path": "/Events/Plays/Technologies/Solution.pdf",
                      "children": []
                    }
                  ]
                }
              ]
            }
          ]
        }
      ]
    }