React component names and values filter

I want to filter React components by name and values.

this is the array i want to filter

let filteredArray: any[] = []
        const filteredItems: any[] = eventList.filter(
            (event) =>
                event.props.children.props.printEvent.labels === null &&
                event.props.children.props.printEvent.value === true &&
                event.props.children.props.printEvent.notes === null &&
                (event.props.children.props.printEvent && event.props.children.props.printEvent.name === 'control_fault') ||
                (event.props.children.props.printEvent.name === 'running' && event.props.children.props.printEvent.value === false) ||
                (event.props.children.props.printEvent.name === 'safety_chain' && event.props.children.props.printEvent.value === false) ||
                (event.props.children.props.printEvent.name === 'torch_collision' && event.props.children.props.printEvent.value === true) ||
                (event.props.children.props.printEvent.name === 'motion_sup' && event.props.children.props.printEvent.value === true) ||
                (event.props.children.props.printEvent.name === 'e_stop' && event.props.children.props.printEvent.value === true)
        )

        if (filteredItems) {
            filteredArray.push([...filteredItems])
        }
        ui.setUnlabeledCount(filteredItems.length)

        console.log(eventList, filteredArray, filteredItems, ui.unlabeledCount)

is there another way or to write this? dont want to be using props.children all the time

>Solution :

You should have a look at destructuring object in ES6 so that you don’t have to re-write props.children all the time like above

Here is the reference: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment

const filteredItems: any[] = eventList.filter(
({ props: {children: {props: {printEvent}}}}) =>
  printEvent.labels === null &&
  printEvent.value === true &&
  printEvent.notes === null &&
  (printEvent && printEvent.name === 'control_fault') ||
  (printEvent.name === 'running' && printEvent.value === false) ||
  (printEvent.name === 'safety_chain' && printEvent.value === false) ||
  (printEvent.name === 'torch_collision' && printEvent.value === true) ||
  (printEvent.name === 'motion_sup' && printEvent.value === true) ||
  (printEvent.name === 'e_stop' && printEvent.value === true)
)