@usequeek/theme-kit 0.1.13 → 0.1.14

package/api/collections.ts

@@ -55,10 +55,7 @@ export async function fetchCollectionProducts(
   if (options?.sort) query.sort = options.sort;
   if (options?.keyword?.trim()) query.keyword = options.keyword.trim();
   if (options?.perPage) query.per_page = options.perPage;
-  // Laravel's paginator reads the CURRENT page off the `page` query param
-  // implicitly (there is no `page` field in VendorCollectionProductsRequest's
-  // own validation rules) — it must be sent as a plain query param, not
-  // folded into the validated filters the backend actually reads.
+  // Page mode (`?page=N`): the storefront URL is crawlable and bookmarkable.
   if (options?.page && options.page > 1) query.page = options.page;
 
   try {
@@ -67,22 +64,17 @@ export async function fetchCollectionProducts(
       client.get<ApiResponse<unknown, Record<string, unknown>>>(`/collections/${slug}/products`, query),
     ]);
 
-    const meta = response.meta ?? {};
-
     return {
       collection,
       products: extractProducts(response.data).map((product) => normalizeProduct(product)),
+      // The API answers the walk state top-level and echoes no page number or
+      // total: the page is the one asked for, `has_more` says whether another
+      // follows ("Page N" + prev/next — no page count exists to show).
       pagination: {
-        current_page: (meta.current_page as number) ?? options?.page ?? 1,
-        per_page: (meta.per_page as number) ?? options?.perPage,
-        // No `total`/`last_page` — this endpoint uses `simplePaginate()`
-        // (deliberately, to avoid a COUNT query on large catalogues), so
-        // `links.next` (a URL or null) is the only real "is there another
-        // page" signal. `CollectionPager` already treats total/last_page as
-        // optional and falls back to a plain "Page N" label without them.
-        has_more: Boolean(response.links?.next),
-        next_page_url: response.links?.next ?? null,
-        prev_page_url: response.links?.prev ?? null,
+        current_page: options?.page && options.page > 1 ? options.page : 1,
+        per_page: options?.perPage,
+        has_more: response.has_more ?? false,
+        next_cursor: response.next_cursor ?? null,
       },
     };
   } catch (error) {

package/components/blog/pagination.tsx

@@ -6,9 +6,10 @@ import type { Pagination } from '../../types/page';
 import { useStorefront } from '../../provider';
 
 /**
- * Shared blog pagination (Prev / page indicator / Next). SSR page-based
- * navigation preserving the active category. Renders nothing when there is
- * only a single page. Themes style via `.core-pagination*` selectors.
+ * Shared blog pagination (Prev / "Page N" / Next). SSR page-based navigation
+ * preserving the active category. The API sends no totals, so there is no
+ * "of M": `has_more` enables Next, page > 1 enables Previous. Renders nothing
+ * on a lone first page. Themes style via `.core-pagination*` selectors.
  */
 export function BlogPagination({
   pagination,
@@ -26,10 +27,7 @@ export function BlogPagination({
   }
 
   const current = pagination.current_page ?? 1;
-  const perPage = pagination.per_page ?? 0;
-  const total = pagination.total ?? 0;
-  const lastPage = perPage > 0 && total > 0 ? Math.ceil(total / perPage) : undefined;
-  const hasNext = pagination.has_more ?? (lastPage ? current < lastPage : false);
+  const hasNext = pagination.has_more ?? false;
   const hasPrev = current > 1;
 
   if (!hasNext && !hasPrev) {
@@ -59,7 +57,7 @@ export function BlogPagination({
           ← Previous
         </span>
       )}
-      <span className="core-pagination__status">{lastPage ? `Page ${current} of ${lastPage}` : `Page ${current}`}</span>
+      <span className="core-pagination__status">{`Page ${current}`}</span>
       {hasNext ? (
         <Link href={buildHref(current + 1)} className="core-pagination__link" rel="next">
           Next →

package/hooks/use-product-questions.ts

@@ -10,8 +10,9 @@ interface ProductQuestionsResponse {
   data: {
     product: { id: string; slug: string; title: string };
     questions: ProductQuestionItem[];
-    pagination: { current_page: number; per_page: number; has_more: boolean };
   };
+  has_more?: boolean;
+  next_cursor?: string | null;
 }
 
 export function useProductQuestions(options: ProductQaBlockData): {

package/hooks/use-shop.ts

@@ -21,11 +21,7 @@ export type { ShopPagination, ShopPrefetch, ShopQuery, ShopSort } from '../utils
 
 const EMPTY_PAGINATION: ShopPagination = {
   currentPage: 1,
-  lastPage: 1,
   perPage: SHOP_DEFAULT_PER_PAGE,
-  total: 0,
-  from: null,
-  to: null,
   hasMore: false,
 };
 
@@ -137,11 +133,7 @@ export function useShop(options?: {
       products: slice,
       pagination: {
         currentPage: safePage,
-        lastPage,
         perPage,
-        total,
-        from: total === 0 ? null : start + 1,
-        to: total === 0 ? null : start + slice.length,
         hasMore: safePage < lastPage,
       } satisfies ShopPagination,
     };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@usequeek/theme-kit",
-  "version": "0.1.13",
+  "version": "0.1.14",
   "private": false,
   "license": "MIT",
   "description": "The framework a Queek storefront theme is built against.",

package/tests/list-pagination.test.tsx

@@ -0,0 +1,71 @@
+import { renderToStaticMarkup } from 'react-dom/server';
+import { afterEach, describe, expect, it, vi } from 'vitest';
+import { StorefrontContext } from '../provider';
+import { BlogPagination } from '../components/blog/pagination';
+import type { Pagination } from '../types/page';
+
+vi.mock('next/headers', () => ({
+  headers: async () => new Headers({ host: 'kili-foods.usequeek.com' }),
+}));
+
+/**
+ * Storefront lists answer `{data, has_more, next_cursor}` with no totals, page
+ * counts or page URLs (founder 28/9/26: prev/next + "Page N", zero COUNT). The
+ * kit's readers must walk on `has_more` alone and label the page they asked for.
+ */
+describe('storefront list walk state (has_more, no totals)', () => {
+  afterEach(() => vi.unstubAllGlobals());
+
+  it('fetchCollectionProducts reads has_more/next_cursor top-level and labels the page it asked for', async () => {
+    const fetchMock = vi.fn(async (url: string) => ({
+      ok: true,
+      json: async () =>
+        url.includes('/collections/new-season/products')
+          ? { status: 'success', data: [], has_more: true, next_cursor: 'eyJ2IjoxfQ', meta: { collection: { slug: 'new-season' } } }
+          : { status: 'success', data: [{ id: 'c1', slug: 'new-season', name: 'New season' }] },
+    }));
+    vi.stubGlobal('fetch', fetchMock);
+    const { fetchCollectionProducts } = await import('../api/collections');
+
+    const page3 = await fetchCollectionProducts('kili-foods', 'new-season', { page: 3, perPage: 20 });
+    expect(page3.pagination).toEqual({ current_page: 3, per_page: 20, has_more: true, next_cursor: 'eyJ2IjoxfQ' });
+    const productsCall = fetchMock.mock.calls.map(([url]) => String(url)).find((url) => url.includes('/products'));
+    expect(productsCall).toContain('page=3');
+    expect(productsCall).toContain('per_page=20');
+  });
+
+  it('treats a response with no has_more as the last page (never follows legacy links)', async () => {
+    vi.stubGlobal('fetch', vi.fn(async () => ({
+      ok: true,
+      json: async () => ({ status: 'success', data: [], links: { next: 'https://api/x?page=2' }, meta: { current_page: 1, last_page: 4 } }),
+    })));
+    const { fetchCollectionProducts } = await import('../api/collections');
+
+    const page = await fetchCollectionProducts('kili-foods', 'new-season');
+    expect(page.pagination).toEqual({ current_page: 1, per_page: undefined, has_more: false, next_cursor: null });
+  });
+
+  const renderPager = (pagination: Pagination, category?: string): string =>
+    renderToStaticMarkup(
+      <StorefrontContext.Provider value={{ vendor: { id: 'v1', slug: 'kili-foods' }, basePath: '/kili-foods' } as never}>
+        <BlogPagination pagination={pagination} category={category} />
+      </StorefrontContext.Provider>,
+    );
+
+  it('BlogPagination: "Page N" with Next enabled by has_more and no "of M"', () => {
+    const html = renderPager({ current_page: 2, per_page: 12, has_more: true }, 'news');
+    expect(html).toContain('Page 2');
+    expect(html).not.toMatch(/Page 2 of/);
+    expect(html).toContain('rel="prev" href="/kili-foods/blog?category=news"');
+    expect(html).toContain('rel="next" href="/kili-foods/blog?category=news&amp;page=3"');
+  });
+
+  it('BlogPagination: last page disables Next; a lone first page renders nothing', () => {
+    const last = renderPager({ current_page: 4, has_more: false });
+    expect(last).toContain('Page 4');
+    expect(last).not.toContain('rel="next"');
+    expect(last).toContain('rel="prev"');
+
+    expect(renderPager({ current_page: 1, has_more: false })).toBe('');
+  });
+});

package/tests/shop-query.test.ts

@@ -47,12 +47,18 @@ describe('shop query (shared by useShop and the server prefetch)', () => {
       .toEqual({ per_page: 24, page: 2, category_slug: 'soups', keyword: 'egusi', sort: 'popular' });
   });
 
-  it('parses nested and flat pagination meta', () => {
+  it('reads the walk state top-level: the page it asked for, has_more from the API, no totals', () => {
     const query = normalizeShopQuery({ page: 2 });
-    const nested = parseShopResponse({ data: [], meta: { pagination: { current_page: 2, last_page: 5, per_page: 24, total: 110, from: 25, to: 48, has_more: true } } } as never, query);
-    expect(nested.pagination).toEqual({ currentPage: 2, lastPage: 5, perPage: 24, total: 110, from: 25, to: 48, hasMore: true });
-    const flat = parseShopResponse({ data: [], meta: { current_page: 1, last_page: 1, total: 3 } } as never, normalizeShopQuery());
-    expect(flat.pagination).toMatchObject({ currentPage: 1, lastPage: 1, total: 3, hasMore: false, perPage: 24 });
-    expect(parseShopResponse({ data: [] } as never, query).pagination.currentPage).toBe(2);
+    const page = parseShopResponse({ data: [], has_more: true, next_cursor: 'eyJ2IjoxfQ', meta: { listing_mode: 'listing' } } as never, query);
+    expect(page.pagination).toEqual({ currentPage: 2, perPage: 24, hasMore: true });
+
+    const last = parseShopResponse({ data: [], has_more: false, next_cursor: null } as never, normalizeShopQuery());
+    expect(last.pagination).toEqual({ currentPage: 1, perPage: 24, hasMore: false });
+
+    // A legacy paginator echo (the old meta.pagination/meta.current_page) is
+    // never read: the page is the one asked for, has_more defaults to false.
+    const legacy = parseShopResponse({ data: [], meta: { pagination: { current_page: 9, last_page: 12, total: 280, has_more: true } } } as never, query);
+    expect(legacy.pagination).toEqual({ currentPage: 2, perPage: 24, hasMore: false });
+    expect(Object.keys(legacy.pagination).sort()).toEqual(['currentPage', 'hasMore', 'perPage']);
   });
 });

package/tests/use-shop-prefetch.test.tsx

@@ -20,13 +20,13 @@ function product(id: string, title: string): Product {
 const PREFETCH: ShopPrefetch = {
   query: normalizeShopQuery({ categorySlug: 'soups', keyword: 'egusi', sort: 'popular', page: 1, perPage: 24 }),
   products: [product('p1', 'Egusi Soup'), product('p2', 'Ogbono Soup')],
-  pagination: { currentPage: 1, lastPage: 1, perPage: 24, total: 2, from: 1, to: 2, hasMore: false },
+  pagination: { currentPage: 1, perPage: 24, hasMore: true },
 };
 
 function Grid(props: Parameters<typeof useShop>[0]): JSX.Element {
   const { products, isLoading, pagination } = useShop(props);
   return (
-    <ul data-loading={String(isLoading)} data-total={pagination.total}>
+    <ul data-loading={String(isLoading)} data-has-more={String(pagination.hasMore)} data-page={pagination.currentPage}>
       {products.map((p) => <li key={p.id}>{p.title}</li>)}
     </ul>
   );
@@ -52,7 +52,7 @@ describe('useShop + ShopPrefetchProvider', () => {
   it('renders the prefetched page when the query matches exactly', () => {
     const html = render(<Grid categorySlug="soups" keyword="  egusi " sort="popular" page={1} perPage={24} />, { prefetch: PREFETCH });
     expect(html).toContain('data-loading="false"');
-    expect(html).toContain('data-total="2"');
+    expect(html).toContain('data-has-more="true"');
     expect(html).toContain('Egusi Soup');
     expect(html).toContain('Ogbono Soup');
   });
@@ -72,7 +72,8 @@ describe('useShop + ShopPrefetchProvider', () => {
   it('behaves exactly as before with no provider value', () => {
     const html = render(<Grid categorySlug="soups" keyword="egusi" sort="popular" />);
     expect(html).toContain('data-loading="true"');
-    expect(html).toContain('data-total="0"');
+    expect(html).toContain('data-has-more="false"');
+    expect(html).toContain('data-page="1"');
   });
 
   it('preview mode keeps using the demo catalogue, never the prefetch', () => {

package/types/page.ts

@@ -4,15 +4,17 @@ import type { Product } from './product';
 
 export type PageType = 'page' | 'post' | 'gallery' | 'policy';
 
+/**
+ * A list page's walk state, as the page-mode storefront routes render it.
+ * `current_page` is the page the storefront ASKED for (the API echoes no page
+ * number, total or page count) — label it "Page N"; `has_more` from the API
+ * decides whether a next page exists.
+ */
 export interface Pagination {
   current_page?: number;
   per_page?: number;
-  total?: number;
   has_more?: boolean;
   next_cursor?: string | null;
-  next_page_url?: string | null;
-  prev_cursor?: string | null;
-  prev_page_url?: string | null;
 }
 
 export interface SeoData {

package/types/product.ts

@@ -225,26 +225,25 @@ export interface Product {
   updated_at: string | null;
 }
 
+/** `meta` on `GET store/products` — the listing context beside the list. */
 export interface ProductListMeta {
-  next_cursor?: string | null;
-  has_more?: boolean;
+  listing_mode?: string;
+  filters?: { attributes?: unknown[] };
 }
 
+/**
+ * The storefront API envelope. List routes answer the walk state TOP-LEVEL:
+ * `has_more` (another page exists) and `next_cursor` (pass it back as
+ * `starting_after` to walk sequentially; `null` on the last page). A page-mode
+ * client (`?page=N`) advances with `page + 1` while `has_more` is true — the
+ * API sends no totals, page counts or page URLs.
+ */
 export interface ApiResponse<T, M = Record<string, unknown>> {
   data: T;
   message?: string;
   meta?: M;
-  /** Present on Laravel `simplePaginate()` resource responses (e.g. collection
-   *  products) — that paginator never computes a total/last-page count (it's
-   *  deliberately cheap on large catalogues), so `links.next`/`links.prev`
-   *  (a URL or null) is the only reliable "is there another page" signal,
-   *  not `meta.has_more` or a page count. */
-  links?: {
-    first?: string | null;
-    last?: string | null;
-    prev?: string | null;
-    next?: string | null;
-  };
+  has_more?: boolean;
+  next_cursor?: string | null;
 }
 
 export interface LegacyProductLike {

package/utils/shop-query.ts

@@ -16,13 +16,14 @@ export const SHOP_SORTS: readonly ShopSort[] = ['latest', 'popular', 'price_low'
 /** What every theme's shop page asks for, and `useShop`'s default. */
 export const SHOP_DEFAULT_PER_PAGE = 24;
 
+/**
+ * Where the shop grid is: the page it asked for and whether another follows.
+ * The API sends no totals or page counts (no COUNT on the hottest read), so a
+ * shop pager is prev/next + "Page N" — `hasMore` enables Next.
+ */
 export interface ShopPagination {
   currentPage: number;
-  lastPage: number;
   perPage: number;
-  total: number;
-  from: number | null;
-  to: number | null;
   hasMore: boolean;
 }
 
@@ -97,17 +98,11 @@ export function parseShopResponse(
   response: ApiResponse<unknown, Record<string, unknown>>,
   query: ShopQuery,
 ): { products: Product[]; pagination: ShopPagination } {
-  const meta = (response.meta ?? {}) as Record<string, unknown>;
-  const nestedMeta = (meta.pagination ?? meta) as Record<string, unknown>;
   return {
     pagination: {
-      currentPage: (nestedMeta.current_page as number) ?? query.page,
-      lastPage: (nestedMeta.last_page as number) ?? 1,
-      perPage: (nestedMeta.per_page as number) ?? query.perPage,
-      total: (nestedMeta.total as number) ?? 0,
-      from: (nestedMeta.from as number | null) ?? null,
-      to: (nestedMeta.to as number | null) ?? null,
-      hasMore: (nestedMeta.has_more as boolean) ?? false,
+      currentPage: query.page,
+      perPage: query.perPage,
+      hasMore: response.has_more ?? false,
     },
     products: extractProducts(response.data).map((item) => normalizeProduct(item as LegacyProductLike)),
   };