Im building a chat app using next.js and firebase.The problem is that im trying to build a search bar that filters by the email of the user.The filter only works for emails that are in the 0 index of the array.Any clues? The users array contains the users that are in the chat The array of the doc looks like this:

   const [searchTerm,setSearchTerm]=useState("");
   const [user]=useAuthState(auth)
   const userChatRef=db.collection('chats').where('users','array-contains',user.email)
   const[chatsSnapshot]=useCollection(userChatRef) 
   render( 
    <Search>
        <SearchIcon/>
        <SearchInput
        style={{fontFamily:"Roboto",fontSize:"calc(6px + 0.3vw)"}}
        type="text"
        placeholder="Pesquise uma conversa"
        onChange={(event) => {
            setSearchTerm(event.target.value);
        }}
    />
    </Search>
    {chatsSnapshot?.docs.filter((user)=>{
     
        console.log(user.data().users.findIndex(email =>email !== user.email ))
        if(searchTerm==""){
            return user
        } else if (user.data().users[user.data().users.findIndex(email =>email !== user.email )].toLowerCase().includes(searchTerm.toLowerCase())){
            
            return user
            
        }
    }).map((chat)=>(
        <Contact key={chat.id}>
           <Chat  id={chat.id} users={chat.data().users}></Chat>
           <Line/>
        </Contact>
        
        
    ))}
 )
const Search=styled.div`
display: flex;
align-items: center;
padding:5px;
border-radius:2px;
height:60px;
background-color:#f1f2f6;
border-radius:5px;
`;

const SearchInput= styled.input`
outline-width:0;
border:none;
flex:1;
font-size:15px ;
margin-left:10px;
background-color:#f1f2f6;
min-width:10vh;
font-size:calc(3px + 0.5vw);
font-family: 'Roboto';