const users = [

  {

    name: "Mighty dragon",

    email: "dragon@cave.elsewhere"

  },

  {

    name: "Abducted Princess",

    email: "princess@castle.far"

  },

  {

    name: "Brave Knight",

    email: "knight@castle.far"

  },

  {

    name: "Little Elf",

    email: "elf@village.green"

  },

  {

    name: "Rainbow Uniciorn",

    email: "unicorn@clouds"

  }

]

​

function App () {

  const [localUsers, setLocalUsers] = React.useState(users)

  const filterState = React.useState({ name: '', email: '' })

  const [filter] = filterState

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

    const result = []

    localUsers.forEach(user => {

      const fName = filter.name.toLowerCase()

      const fEmail = filter.email.toLowerCase()

      const includesUsername = user.name.toLowerCase().includes(fName)

      const includesEmail = user.email.toLowerCase().includes(fEmail)

      if (includesUsername && includesEmail) {

        result.push(user)