How to set PAGINATION for repeater items in Editor X

Hi guys,
I finally got how to do this:

let currentProduct = ""; 
let currentPageQuery = null; 

$w.onReady(function () {	
	setupRepeaterDetail("earring")
});

export async function checkCurrentTotal(item) {

	const nextBtn = $w(`#${item}NextButton`)
	const prevBtn = $w(`#${item}PrevButton`)
	let total = Number($w(`#${item}TotalPage`).text)
	let current = Number($w(`#${item}CurrentPage`).text)

	console.log("1-Total Pages:", total, "1-Current Page:", current);

	current === 1 ? prevBtn.disable() : prevBtn.enable()
	total === current ? nextBtn.disable() : nextBtn.enable()
}

export async function upDateNextBtn(item) {

	const btn = $w(`#${item}NextButton`)

	btn.onClick(() => {

		if (currentPageQuery && currentPageQuery.hasNext()) {
			currentPageQuery.next().then(newResults => {
				console.log("New Results", newResults);
				currentPageQuery = newResults; 
				setupRepeaterWithData(currentProduct, newResults.items); 
				updatePageControls(item, newResults); 
				checkCurrentTotal(item)
			});
		}

    });
}

export async function upDatePrevBtn(item) {

	const btn = $w(`#${item}PrevButton`)

	btn.onClick(() => {

		if (currentPageQuery && currentPageQuery.hasPrev()) {
			currentPageQuery.prev().then(newResults => {
				console.log("New Results", newResults);
				currentPageQuery = newResults; 
				setupRepeaterWithData(currentProduct, newResults.items); 
				updatePageControls(item, newResults); 
				checkCurrentTotal(item)
			});
		}

    });
}


export async function setupRepeaterDetail(item) {

	currentProduct = item; // Update the current product type
    const results = await getCategoryProduct1(item);
    if (results) {
        currentPageQuery = results; // Keep the query for pagination
        setupRepeaterWithData(item, results.items);
        updatePageControls(item, results); // Update or setup pagination controls
		upDateNextBtn(item)
		upDatePrevBtn(item)
		checkCurrentTotal(item)
    }

}

function setupRepeaterWithData(product, items) {
    let id = `#${product}Repeater`;
    $w(id).data = items;
    $w(id).forEachItem(($item, itemData, index) => {
        $item(`#${product}RepeaterImage`).src = itemData.mainMedia;
        $item(`#${product}RepeaterPrice`).text = itemData.formattedDiscountedPrice.toString();
        $item(`#${product}RepeaterTitle`).text = itemData.name;
		$item(`#${product}RepeaterImage`).link = itemData.productPageUrl;  
    });
}

//product can be "ring", "diamond", "earrinng", "..." 
export async function getCategoryProduct1(product) {
	try {
		const results = await wixData.query("Stores/Products")
			.contains("slug", product)
			.lt("price", 4000)
			.limit(12)
			.find();
		console.log("Products:", results.items);
		return results; // Return the whole results object for pagination
    } catch (error) {
        console.error("Error in getCategoryProduct1:", error);
        return null;
    }
    
}

function updatePageControls(item, results) {
    console.log("Total Pages:", results.totalPages, "Current Page:", results.currentPage + 1);
    $w(`#${item}TotalPage`).text = results.totalPages.toString();
    $w(`#${item}CurrentPage`).text = (results.currentPage + 1).toString();
}


![image|533x150](upload://sVpPH49FWMXSdop3pqFYpTH0v9S.png)