En un componente, cuando se proporciona una entrada, envía la entrada a un reductor

 const changeSearchTerm = (e) => { setSearchTerm(e.target.value) dispatch(userActions.searchByName(searchTerm)); }

Luego, el reductor toma ese valor e intenta filtrar la matriz en función de esa entrada

 searchByName: (state, action) => { state.search = action.payload; let newArray = state.users.filter((user) => user.name.toLowerCase().includes(state.search.toLowerCase()) ); state.users = newArray; },

Luego, toda esta matriz se muestra en uno de los otros componentes. La barra de búsqueda funciona hasta cierto punto: cuando comienza a escribir en la barra de búsqueda, solo comienza a funcionar después de la segunda entrada. En la consola, noté que si escribe "Timmothy", solo registrará "Timmoth" en el estado. Además, si elimino texto de la entrada, el estado de la matriz no se actualiza y permanece igual aunque cambie el valor de entrada.

Entonces, lo que sucede actualmente es que si comienza a escribir en la barra de búsqueda, actualiza la matriz, pero siempre solo registra la penúltima pulsación de tecla. Además, si elimina la entrada de la barra de búsqueda, no se registra. El valor cambia, pero la matriz permanece con solo unos pocos elementos.

He intentado no usar la variable adicional para almacenar el estado y hacerlo así

 state.users.filter((user) => user.name.toLowerCase().includes(state.search.toLowerCase())

Pero luego no pasa absolutamente nada. Agradecería si alguien pudiera decirme lo que me estoy perdiendo aquí

EDITAR

Este es el componente que recibe esa entrada.

 <input onChange={changeSearchTerm} type="text" value={searchTerm}></input>

Y el valor de searchTerm se guarda en useState - const [searchTerm, setSearchTerm] = useState("");