JSFiddle - React, Tailwind, and code Playground

by Joe Saad

HTML

<div id="mtree"></div>

JavaScript

const marr = [
 {
  "children": [],
  "Id": "3434839483",
  "ParentId": "0",
  "Text": "Potassium less than 2.5 mEq/L (mmol/L)",
  "state": 1,
  "nodeLevel": 3
 },
 {
  "children": [],
 // "Id": "id_02_01_03_05m",
  "Id": "id_02_01_03_05",
  "ParentId": "0",
  "Text": "Potassium less than 2.5 mEq/L (mmol/L)",
  "state": 1,
  "nodeLevel": 3
 },
 {
  "children": [],
  "Id": "id_02_01_03_08_02m",
  "ParentId": "id_02_01_03_08",
  "Text": "Acute worsening of renal failure (creatinine greater than 2.5 mg/dL (221 micromoles/L) or significant elevation for age and size)",
  "state": 1
 },
 {
  "children": [],
  "Id": "id_02_01_03_08m",
  "ParentId": "0",
  "Text": "(parent of second in array) Potassium greater than 5 mEq/L (mmol/L) with 1 or more of the following:",
  "state": 1,
  "nodeLevel": 3,
  "sortOrder": 24
 }
]

const p = [
        {
            "Id": "12",
            "ParentId": "0",
            "text": "Man",
            "level": "1",
            "children": null
        },
        {
            "Id": "6",
            "ParentId": "12",
            "text": "Boy",
            "level": "2",
            "children": null
        },
                {
            "Id": "7",
            "ParentId": "12",
            "text": "Other",
            "level": "2",
            "children": null
        },
        {
            "Id": "9",
            "ParentId": "0",
            "text": "Woman",
            "level": "1",
            "children": null
        },
        {
            "Id": "11",
            "ParentId": "9",
            "text": "Girl",
            "level": "2",
            "children": null
        }
    ]


function list_to_tree(list) {
    var map = {}, node, roots = [], i;
    console.log(list)
    for (i = 0; i < list.length; i++) {
        map[list[i].Id] = i; // initialize the map
        console.log(list[i].Id + '---' +i)
        list[i].children = []; // initialize the children
    }
    console.log('^^^^^^')
    console.log(map)
       ...