JSFiddle - React, Tailwind, and code Playground
JavaScript
const json = [{
"categories": [
{
"_id": "1",
"pid": "0",
"name": "general-categories"
}, {
"priority": 3,
"name_lower": "tragedy",
"_id": "2",
"pid": "1",
"name": "Tragedy"
}, {
"priority": 3,
"name_lower": "natural",
"_id": "3",
"pid": "1",
"name": "natural"
}, {
"priority": 3,
"name_lower": "humans",
"_id": "4",
"pid": "2",
"name": "humans"
}, {
"priority": 3,
"name_lower": "earthquake",
"_id": "5",
"pid": "2",
"name": "earthquake"
}, {
"priority": 3,
"name_lower": "floods",
"_id": "6",
"pid": "3",
"name": "floods"
}, {
"priority": 3,
"name_lower": "drought",
"_id": "7",
"pid": "3",
"name": "drought"
}, {
"priority": 3,
"name_lower": "landslides",
"_id": "8",
"pid": "6",
"name": "landslides"
}, {
"priority": 3,
"name_lower": "tsunami",
"_id": "9",
"pid": "6",
"name": "tsunami"
}]
}];
function setNodes(obj, data) {
obj.nodes = data.filter(x => x.pid === obj._id);
}
function populateLevel(arr, data) {
arr.forEach(x => {
setNodes(x, data);
if (x.nodes.length) {
populateLevel(x.nodes, data);
}
});
}
const data = json[0].categories;
const startingLevel = data.filter(x => x.pid === '0');
populateLevel(startingLevel, data);
console.log(startingLevel);