How to query data from Firestore with dynamic input [duplicate]

Question

I have a problem with my code and I don't know how to solve it in the correct way.

I am trying to write a filter that when user clicks on each filter, it will automatically query the data from firestore.

In my Redux Saga have this one:

const {type, currency, location} = action.payload;

All is work fine but the thing is when I trying to query the data with dynamic input: For example:

firebase
        .firestore()
        .collection("ItemData")
        .where("type", "==", type)
        .where('currency', '==', currency)
        .where('location', '==', location)

When user clicks on option type it shows nothing as the input currency and location have no data, just the empty string, so the query return none response. Unless you click all the filter it will show the correct response.

So how can I solve that problem?

Answer 1

You should only add to the query clause when needed (ie. type, currency, or location are true/not empty):

let query = firebase
    .firestore()
    .collection("ItemData");

if (type) {
    query = query.where('type', '==', type);
}

if (currency) {
    query = query.where('currency', '==', currency);
}

if (location) {
    query = query.where('location', '==', location);
}

Special thanks to this post which had a similar issue to yours.