I have a filtering system where I use an array to add or remove the filtering methods. But my state is not working properly or i've missed something.
const [filters, setFilters] = useState([]);
const [creatorFilter, setCreatorFilter] = useState(null);
const handleCreatorFilter =(filter) => {
setCreatorFilter(filter);
if (filter === 'structures' && filters.indexOf(byStructureFilter) === -1) {
setFilters([...filters, byStructureFilter]);
}
if (filter === 'members' && filters.indexOf(byMemberFilter) === -1) {
setFilters([...filters, byMemberFilter]);
}
if (filter === 'all') {
setFilters(filters.filter(el => el !== byStructureFilter || el !== byMemberFilter));
}
};
const byStructureFilter = (item) => {
return item.relationships.structure.data
};
const byMemberFilter = (item) => {
return item.relationships.user.data && !item.relationships.structure.data
};
Here the two buttons calling that handleCreatorFilter
for filtering
<button onClick={() => creatorFilter === 'structures' ? handleCreatorFilter('all') : handleCreatorFilter('structures')}>Structures officielles</button>
<button onClick={() => creatorFilter === 'members' ? handleCreatorFilter('all') : handleCreatorFilter('members')} >Membres Wekomkom</button>
The things is for adding filtering methods to the array it works fine but not when the filter is set to all
(removing the filtering methods). Do you see something wrong in my logic ?