ES6: How to filter a state array using a map - ecmascript-6

Question

I have the following state array called structure:
var structure = [
{ id: 0, label: "Dashboard", link: "/test/dashboard", icon: <HomeIcon /> },
{
id: 1,
label: "Test1",
link: "/test1",
icon: <InboxIcon />,
},
{
id: 2,
label: "Test2",
link: "/test2",
icon: <PresentToAllIcon />,
},
{ id: 3, type: "divider" },
{
id: 4,
label: "Test3",
link: "/test3",
icon: <ListAltIcon />,
children: [
{
label: "Test4",
link: "/test4",
icon: <LanguageIcon />,
},
{
label: "Test5",
link: "/test5",
icon: <ListIcon />,
},
],
},
{
id: 5,
label: "Test6",
link: "/test6",
icon: <DescriptionIcon />,
},
{
id: 6,
label: "Test7",
link: "/test7",
icon: <AccountBalanceWallet />,
children: [
{
label: "Test8",
link: "/test8",
icon: <FaceIcon />,
},
{
label: "Test9",
link: "/test9",
icon: <TransferWithinAStationIcon />,
},
{
label: "Test10",
link: "/test10",
icon: (
<Avatar alt="Test" src={testlogo} className={classes.small} />
),
},
{
label: "Test11",
link: "/test11",
icon: <PeopleAlt />,
},
],
},
{
id: 7,
label: "Test12",
link: "/test12",
icon: <EditIcon />,
},
];
I want to filter it using another array, the modules array looks like this:
["Miscellaneous","Test Converter"]
What I've done so far is this
modules.forEach((modulesMap) => {
structureNew = structure.filter(
(structureFiltered) => structureFiltered.label == modulesMap
);
});
Anyone has an idea how to do this properly? The problem I'm encountering with my code is it overrides or replaces the current variable structureNew
I would like it to get appended into a state array as well so it would look kind of similar to structure

Answer 1

Try this one, i just made some small change in your code
var structure = [
{ id: 0, label: "Dashboard", link: "/cpex/dashboard", icon: '<HomeIcon />' },
{
id: 1,
label: "Inward",
link: "/cpex/inward",
icon: '<InboxIcon />',
},
{
id: 2,
label: "Outward",
link: "/cpex/outward",
icon: '<PresentToAllIcon />',
},
{ id: 3, type: "divider" },
{
id: 4,
label: "Proof List",
link: "/cpex/prooflist",
icon: '<ListAltIcon />',
children: [
{
label: "Proof Web",
link: "/cpex/prooflist/web",
icon: '<LanguageIcon />',
},
{
label: "Proof Others",
link: "/cpex/prooflist/others",
icon: '<ListIcon />',
},
],
},
{
id: 5,
label: "Miscellaneous",
link: "/cpex/misc",
icon: '<DescriptionIcon />',
},
{
id: 6,
label: "RPS",
link: "/cpex/rps",
icon: '<AccountBalanceWallet />',
children: [
{
label: "Client Maintenance",
link: "/cpex/rps/clientmaintenance",
icon: '<FaceIcon />',
},
{
label: "Process SFTP",
link: "/cpex/rps/sftp",
icon: '<TransferWithinAStationIcon />',
},
{
label: "Process PESONet",
link: "/cpex/rps/pesonet",
icon: (
'<Avatar alt="Pesonet" src={pesonetlogo} className={classes.small} />'
),
},
{
label: "Override Enrollment",
link: "/cpex/rps/overrideenrollment",
icon: '<PeopleAlt />',
},
],
},
{
id: 7,
label: "Message Converter",
link: "/cpex/message",
icon: '<EditIcon />',
},
];
var modules=["Miscellaneous","Message Converter"]
var structureNew=[]
modules.forEach((modulesMap,i) => {
let arrs = structure.filter(
(structureFiltered) => structureFiltered.label == modulesMap
);
structureNew= structureNew.concat(...arrs)
});
console.log('RESULT:'+JSON.stringify(structureNew))
debugger