commerce
commerce copied to clipboard
Category Pagination
Not sure about other platforms, but for bigcommerce if anyone is curious it is really easy to create paginated category pages.
Just add a page query string to framework/bigcommerce/api/endpoints/catalog/get-products
if (page && Number.isInteger(Number(page))) url.searchParams.set('page', String(page))
then in use-search hook you add it as well. Then from any category page you can create pretty easy pagination using router or state
Not sure about other platforms, but for bigcommerce if anyone is curious it is really easy to create paginated category pages.
Just add a page query string to framework/bigcommerce/api/endpoints/catalog/get-products
if (page && Number.isInteger(Number(page))) url.searchParams.set('page', String(page))
then in use-search hook you add it as well. Then from any category page you can create pretty easy pagination using router or state
@kogan007 I'm new here, Can you give me your code?
@Nazmer
framework/bigcommerce/api/endpoints/catalog/get-products add page to query params, mine looks like this
body: { search, categoryId, brandId, sort, page, limit }
then where all the query params are being set add if (page && Number.isInteger(Number(page))) url.searchParams.set('page', String(page))
then in use-search.tsx you want to add page to the fetcher params and again add if (page && Number.isInteger(Number(page))) url.searchParams.set('page', String(page)) as a search param
type SearchProductsInput needs a new field page?: number | string
then at the bottom add ['page', input.page],
you might have to change some types for type checking, not sure. but it shouldnt be too difficult. i did this a while ago so sorry for any confusion
Also if you check the bigcommerce api reference over at https://developer.bigcommerce.com/api-reference they have a lot of details about all the endpoints and objects, so what I did with mine was add the meta object to my return, so that I could see exactly which page I'm querying
Hey there! Thank you for opening this issue. We have decided to take Next.js Commerce in a new direction and will be closing out current PRs and issues due to this change. Please see this PR for more details: https://github.com/vercel/commerce/pull/966