JSFiddle - React, Tailwind, and code Playground

by graphettion

JavaScript

let arr = [
	{
    name: "Worksite 1000 JobAct123",
    steps: "[{\"Hazards\":[{\"ControlIds\":[\"CAL-9.2\",\"ALC-2.2\"],\"Detail\":null,\"Id\":\"HZ-513\"}],\"Name\":\"fygui\"},{\"Hazards\":[{\"ControlIds\":[\"ALC-2.2\"],\"Detail\":null,\"Id\":\"HZ-379\"},{\"ControlIds\":[\"BBS-1.2\",\"AUD-1.2\"],\"Detail\":\"Rain drops keep falling on my head...no wait...ahhh my eyes!\",\"Id\":\"HZ-628\"}],\"Name\":\"step 2\"},{\"Hazards\":[{\"ControlIds\":[\"AUD-1.2can\"],\"Detail\":null,\"Id\":\"HZ-471\"},{\"ControlIds\":[\"CAL-9.2\"],\"Detail\":null,\"Id\":\"HZ-472\"}],\"Name\":\"Step 3\"},{\"Hazards\":null,\"Name\":\"tfyguh\"},{\"Hazards\":[{\"ControlIds\":[\"CTRL-501-000017\"],\"Detail\":null,\"Id\":\"HZ-476\"}],\"Name\":\"This is a new step\"},{\"Hazards\":null,\"Name\":\"iiii\"},{\"Hazards\":null,\"Name\":\"test\"},{\"Hazards\":null,\"Name\":\"123test123\"},{\"Hazards\":null,\"Name\":\"test1234567\"},{\"Hazards\":[{\"ControlIds\":[\"ARC-2.2\"],\"Detail\":null,\"Id\":\"HZ-629\"}],\"Name\":\"123deleteme123\"},{\"Hazards\":null,\"Name\":\"1test1\"},{\"Hazards\":null,\"Name\":\"Step 13\"},{\"Hazards\":[{\"ControlIds\":[\"BBS-1.2\"],\"Detail\":null,\"Id\":\"HZ-513\"}],\"Name\":\"test 100\"}]",
	},
  {
    name: "tests Job Activity 3",
    steps: "[{\"Hazards\":null,\"Name\":\"Do thing #0\"},{\"Hazards\":null,\"Name\":\"Do thing #0 again\"}]"
  }
]

// parse the steps
let steps = arr.map(item => JSON.parse(item.steps))

// filter steps that have hazards
let filteredHazards = steps.flat().filter(item => item.Hazards !== null)

// get hazards array from steps
let getHazards = filteredHazards.map(item => item.Hazards)

// get hazard id from hazard array
let hazardId = getHazards.flat().map(item => item.Id)

// give unique values to hazard ids
let uniqueHarzardIds = [...new Set(hazardId)]

console.log('steps', steps)
console.log('filteredHazards', filteredHazards)
console.log('getHazards', getHazards)
console.log('hazardId', hazardId)
console.log('uniqueHarzardIds', uniqueHarzardIds)