function App () {

  const [animals] = React.useState([

    'dog', 'cat', 'mouse', 'elephant', 'wolf', 'peacock', 'fish', 'dragon', 'ant', 'dinosaur'

  ])

  const filteredAnimals = React.useMemo(() => {

    const result = []

    // we only wish to see the animals that have the "d" letter in them - feel free to edit the value!

    const filter = 'd'

    animals.forEach(animal => {

      if (animal.includes(filter)) {

        result.push(animal)

      }

    })

    return result

  }, [animals])

  return (

    <div>

      Filtered animals: {filteredAnimals.join(', ')}

    </div>

  )

}