'Find item in array of strings to filter a flatlist

I have a FlatList that I am trying to filter with multiple inputs from dropdown selectors. Here is my FlatList component

      <FlatList
        style={styles.list}
        data={data.filter(filteredUsers)}
        renderItem={renderItem}
        keyExtractor={(item) => item.id}
        ListEmptyComponent={EmptyItem}
      />

A sample item from the data object

  { id: "2", name: "Harry", city: "Scottdale", state: "AZ", instrument: ["Cowbell", "Ocarina"] },

And the filterUsers function that is working with a single string, which shows all items in the data object and filters down when a user starts selecting options from the dropdown. When cleared the full data list is shown again.

  const filteredUsers = (item: { state: string; instrument: string }) => {
    return (
      item.state.toLowerCase().indexOf(state.toLowerCase()) >= 0 &&
      item.instrument.toLowerCase().indexOf(instrument.toLowerCase()) >= 0
    )
  }

I'd like to have that same functionality after changing instrument to an array of strings rather than a single string.

Ive updated the instrument type in filteredUsers to instrument: Array<string> but can not figure out how to get the filtering to work as it did before I updated to the array. I appreciate any help and would happily provide more information if I left anything out. Thanks



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source