How to chain .hasSome query based on if statement

Ask the community
,
1

This is part of my code that I struggle with:

        wixData.query(dataset)
            if(ck1.length > 0) .hasSome(ck1FN, ck1);      
            if(ck2.length > 0) .hasSome(ck2FN, ck2);
            if(ck3.length > 0) .hasSome(ck3FN, ck3);
            if(ck4.length > 0) .hasSome(ck4FN, ck4);
            if(ck5.length > 0) .hasSome(ck5FN, ck5);
            if(ck6.length > 0) .hasSome(ck6FN, ck6);
            
            .find()
            .then(results => {
                repeater.data = results.items;
                });

In other words, I want to run a wixData.query but only with the .hasSome property that meets the specified if criteria. If the criteria is not met, the wixData.query should run without that specific .hasSome.

So for example, if ck1 length is not > 0 and ck2 through ck6 is > 0, then the wixData.query runs without the .hasSome(ck1FN, ck1) property and with all the other .hasSome properties.

I don’t want to run the wixData.query separatelly for each .hasSome property. The .hasSompe properties have to be chained and run within one wixData.query function.

I hope this is clear.
Please help.

Thank you
Petr

2

You can do it like this:

import wixData from 'wix-data'

$w.onReady(async () => {

    const query = []

    ck1.length > 0 && query.push(wixData.query(dataset).contains(ck1FN, ck1).find())
    ck2.length > 0 && query.push(wixData.query(dataset).contains(ck2FN, ck2).find())
    ck3.length > 0 && query.push(wixData.query(dataset).contains(ck3FN, ck3).find())
    ck4.length > 0 && query.push(wixData.query(dataset).contains(ck4FN, ck4).find())
    ck5.length > 0 && query.push(wixData.query(dataset).contains(ck5FN, ck5).find())
    ck6.length > 0 && query.push(wixData.query(dataset).contains(ck6FN, ck6).find())

    let queryAll = await Promise.all(query)

    console.log(queryAll)

})
3

Thank you. I need some clarification. I am attaching my full code now.

a) I added the “async” within .onChange? Is that ok?

b) how do I push the “queryAll” results into the “repeater” now? (as I had in the original code)

Thank you

import wixData from 'wix-data';

$w.onReady( () => {

    $w('#checkboxGroup1, #checkboxGroup2').onChange(async () => {

        const dataset = "FFDryFood";
        const repeater = $w("#repeater3");
        
        const ck1 = $w('#checkboxGroup1').value;
        const ck2 = $w('#checkboxGroup2').value;
        const ck3 = $w('#checkboxGroup3').value;
        const ck4 = $w('#checkboxGroup4').value;
        const ck5 = $w('#checkboxGroup5').value;
        const ck6 = $w('#checkboxGroup5').value;

        const ck1FN = "age";
        const ck2FN = "size";
        const ck3FN = "activity";
        const ck4FN = "GF";
        const ck5FN = "meat";
        const ck6FN = "special";

        const query = []

        ck1.length > 0 && query.push(wixData.query(dataset).hasSome(ck1FN, ck1).find())
        ck2.length > 0 && query.push(wixData.query(dataset).hasSome(ck2FN, ck2).find())
        ck3.length > 0 && query.push(wixData.query(dataset).hasSome(ck3FN, ck3).find())
        ck4.length > 0 && query.push(wixData.query(dataset).hasSome(ck4FN, ck4).find())
        ck5.length > 0 && query.push(wixData.query(dataset).hasSome(ck5FN, ck5).find())
        ck6.length > 0 && query.push(wixData.query(dataset).hasSome(ck6FN, ck6).find())

        let queryAll = await Promise.all(query)

        console.log(queryAll)


            
    });
});
4

Ok, so now you have an array of objects (query results) and you need to go through them one by one and check which ones had anything found, right? Then you need to collect this results as a new array of objects that you can feed to the repeater.

So, lets create a function to do this.

function createRepeaterData(array) {

}

This function is going to receive the result from the query, then it is going to filter only the objects that had totalCount bigger than 0 (the ones with results in it):

function createRepeaterData(array) {
    const filterArray = array.filter(item => item.totalCount > 0)
}

After that, we have an array of objects with arrays of objects with the items property we need (deep nested objects that we need to access). We’ll use .map() (high order function) to access this property and return a new array of objects.

function createRepeaterData(array) {
    const filterArray = array.filter(item => item.totalCount > 0)
    const newArray = filterArray.map(item => item.items)
}

And finally we use the .flat() method to remove one level of nested array and return it to the repeater.data property.

function createRepeaterData(array) {
    const filterArray = array.filter(item => item.totalCount > 0)
    const newArray = filterArray.map(item => item.items)
    return newArray.flat()
}

After that you just need to replace this line:

console.log(queryAll)

With this line:

repeater.data = createRepeaterData(queryAll)

:wink: