dataset.setFilter working in editor but in llive + unexpected console errors

Ask the community
, , ,
1

Question:
dataset.setFilter() not working in live but in editor (unexpected console errors)

Product:
Wix editor

What are you trying to achieve:
Filter collection through a repeater element. User filters through selection tag and text input.

What have you already tried:
Forum topics, Chat gpt, tutorials on possible causes of why it is working in the editor and not when published

Additional information:
there are console errors that I can’t fix yet :

Screenshot 2024-12-23 at 8.30.24 AM
Screenshot 2024-12-23 at 8.30.24 AM1658×1828 252 KB

2

Could you show your code please?

3 
import wixData from 'wix-data';

const SEARCH_DEBOUNCE_MS = 500
const DEFAULT_COVER_URL = 'https://lh3.googleusercontent.com/d/14EQ8m8F3OM5thPubnxW9cBQT1I7CmVh6'

const delay = async (ms) => new Promise(resolve => setTimeout(resolve, ms))

$w.onReady(async function () {
    console.log('## ON READY ##');
    let searchDebounce;
    let isLoading = false;
    $w('#moviesLoader').hide();
    // $w('#moviesList').collapse();
    let result;

    let filterInput = ''
    let filterGenres = []
    let theEnd = false;
    let count = 0;
    let searchCount = 0;

    const starred = await wixData.query('Import64').eq('starred', true).find()
    console.log('starred', starred)
    if ((starred?.items?.length ?? 0) > 0) {
        $w('#starredMovie').background.src = `https://lh3.googleusercontent.com/d/${starred.items[0].cover}`;
    }

    $w('#moviesList').onItemReady(($item, itemData) => {
        console.log(itemData);
        $item('#box').background.src = itemData.cover ? `https://lh3.googleusercontent.com/d/${itemData.cover}` : DEFAULT_COVER_URL;
        let authorText = `${itemData.authorFirstname} ${itemData.authorName}`;
        if (itemData.coauthorFirstname) {
            authorText += `\n${itemData.coauthorFirstname ?? ''} ${itemData.coauthorName ?? ''}`;
        }
        if (itemData.reviewerFirstname) {
            authorText += `\n${itemData.reviewerFirstname ?? ''} ${itemData.reviewerName ?? ''}`;
        }
        $item('#text170').text = authorText
    });

    const dataset = $w('#dataset1');
    console.log(dataset);

    dataset.onReady(async function () {

        const filterOnInputAndGenre = async () => {
            const inputSearch = $w('#inputSearch').value;
            const inputFilter = wixData.filter().startsWith('title', inputSearch)
                .or(wixData.filter().startsWith('authorName', inputSearch))
                .or(wixData.filter().startsWith('coauthorName', inputSearch))
                .or(wixData.filter().startsWith('reviewerName', inputSearch))

            if (filterGenres.length === 0) {
                await dataset.setFilter(inputFilter);
                return;
            }
            await dataset.setFilter(inputFilter.and(wixData.filter().hasSome('genre', filterGenres)));
        }

        const wrapperFilter = async () => {
            searchCount++
            return new Promise(resolve => {
                isLoading = true;
                $w('#moviesList').collapse();
                $w('#noResultMessage').collapse();
                $w('#moviesLoader').show();
                clearTimeout(searchDebounce);
                searchDebounce = setTimeout(async () => {
                    await Promise.all([filterOnInputAndGenre(), delay(700)]);
                    isLoading = false;
                    if (searchCount > 0) {
                        $w('#starredRepeater').collapse()
                    }
                    $w('#moviesList').expand();
                    if (dataset.getTotalCount() === 0) {
                        $w('#noResultMessage').expand();
                    }
                    $w('#moviesLoader').hide();
                    resolve()
                }, SEARCH_DEBOUNCE_MS)
            })
        }

        $w('#inputSearch').onInput((e) => {
            console.log('on input', e);
            theEnd = false;
            count = dataset.getPageSize();
            wrapperFilter()
        })

        // Attach the onViewportEnter event to a hidden element at the bottom of the page
        $w("#loadMoreTrigger").onViewportEnter(async () => {
            console.log(count, dataset.getTotalCount(), dataset.getPageSize(), theEnd);
            if (!searchCount || theEnd || !dataset.hasNextPage()) {
                return;
            }
            $w('#moviesLoader').show()
            count += dataset.getPageSize()
            theEnd = dataset.getTotalCount() <= count + dataset.getPageSize()
            await dataset.loadMore()
            $w('#moviesLoader').hide()
        });

        $w('#selectionTags1').onChange(async (event) => {
            filterGenres = $w('#selectionTags1').selectedIndices.map(i => $w('#selectionTags1').options[i].value);
            await wrapperFilter()

        })
    })
});```