Estoy trabajando en una aplicación y estoy tratando de permitir que un usuario filtre elementos según los títulos de una categoría o vea todo. Con este código, puedo obtener todos los elementos que ha agregado un usuario determinado, pero también me gustaría poder filtrar por categoría y mostrar todos los elementos si no se selecciona ninguna categoría.
export const ClothingListItems = ({ category }) => { const [items, setItems] = useState([]); const userUid = auth.currentUser.uid; const [isLoading, setIsLoading] = useState(false); const [isError, setIsError] = useState(false); //getting items where closetceator Uid == userUid const getClosetAsync = async ({category}) => { setIsLoading(true); try { const q = query( collection(db, "clothing"), where("closetOwerUid", "==", userUid) ); onSnapshot(q, (snapshot) => { let results = []; snapshot.forEach((doc) => { results.push({ ...doc.data(), id: doc.id }); }); setItems(results); setIsLoading(false); }); } catch (error) { setIsError(error.message); } }; // Keep track with changes in data add or delete. Clean up! useEffect(() => { const unsubscribe = getClosetAsync(); return () => unsubscribe; }, []); return isLoading ? ( <LoadingIndicator /> ) : isError || !items.length ? ( <> <Error /> <EmptyView message="Your closet is empty, add items." marginSize={65} /> </> ) : ( <View style={styles.container}> <> <FlatList data={items} keyExtractor={(item) => item.id} numColumns={2} renderItem={({ item }) => <ClothingItem items={item} />} /> </> </View> ); };