Não consigo de jeito nenhum fazer com que a minha search bar no React funcione para filtrar os resultados vindo do meu backend em Mongoose. Eu consigo mostrar todos os pets, mas quando eu tento procurar algo não aparece nada.
BackEnd (MongoDB/Mongoose)
static async getAll(req, res) {
const query = req.query;
if (Object.keys(query).length === 0) {
Pet.find({}, (err, pets) => {
if (err) return res.status(500).send(err);
res.status(200).json({
pets,
});
}).sort('-createdAt');
} else {
Pet.find(query, (err, pets) => {
if (err) return res.status(500).send(err);
res.status(200).json({
pets,
});
}).sort('-createdAt');
}
}
FrontEnd em React:
const Adopt = () => {
const [searchTerm, setSearchTerm] = useState('');
const [pets, setPets] = useState([]);
useEffect(() => {
api
.get(`/pets`)
.then((response) => {
setPets(response.data.pets);
})
.catch((err) => console.log(err));
}, []);
const handleOnChangeSearch = (e) => {
setSearchTerm(e.target.value);
};
const handleOnClickSearch = (e) => {
e.preventDefault();
api
.get('/pets', { params: { name: searchTerm } })
.then((res) => setPets(res.data))
.catch((err) => console.log(err));
};