JSFiddle - React, Tailwind, and code Playground

by Diana Lemen

JavaScript

const OPTIONS = {
  personal_service: [
    { title: 'Personal service Option 1' },
    { title: 'Personal service Option 2' },
    {
      title: 'Personal service Option 3',
      subMenu: [
        { title: 'Personal service SubItem 1' },
        { title: 'Personal service SubItem 2' },
        { title: 'Personal service SubItem 3' },
        { title: 'Personal service SubItem 4' }
      ]
    },
    { title: 'Personal service Option 4' }
  ],
  it: [
    { title: 'IT Option 1' },
    { title: 'IT Option 2' },
    { title: 'IT Option 3' },
    { title: 'IT Option 4' }
  ],
  compliance: [
    { title: 'Compliance Option 1' },
    { title: 'Compliance Option 2' },
    { title: 'Compliance Option 3' },
    { title: 'Compliance Option 4' }
  ],
  assets: [
    { title: 'Assets Option 1' },
    { title: 'Assets Option 2' },
    { title: 'Assets Option 3' },
    {
      title: 'Assets Option 4',
      subMenu: [
        { title: 'Assets SubItem 1' },
        { title: 'Assets SubItem 2' },
        { title: 'Assets SubItem 3' },
        { title: 'Assets SubItem 4',
        		subMenu: [
              { title: 'Assets SubItem 12' },
              { title: 'Assets SubItem 22' },
              { title: 'Assets SubItem 32' },
              { title: 'Assets SubItem 42' }
      			]
         }
      ]
    }
  ]
}

const arr = ['personal_service', 'it', 'compliance', 'assets']

const stdOut = (subMenu) => {
	if(!subMenu) return;
	subMenu.map(item => {
  	console.log(item.title)
  	if(item.subMenu) stdOut(item.subMenu);
  })
}

arr.map(item => OPTIONS[item].map(option => {
	if(option.subMenu) stdOut(option.subMenu);
	console.log(option.title);
}))