Use Portfolio Gallery

1// usePortfolioGallery — collections-gallery data, no markup: first page + count for the empty
2// state + cursor paging. queryCollections returns { collections, nextCursor } (an OBJECT, not an
3// array) and countCollections returns a number — those shapes are the bug-prone part; keep them.
4import { useState, useEffect } from "react";
5import { queryCollections, countCollections } from "@/rest/wix-portfolio";
6
7export function usePortfolioGallery({ limit = 24 } = {}) {
8  const [collections, setCollections] = useState(null); // null = loading
9  const [cursor, setCursor] = useState(null);
10  const [total, setTotal] = useState(null);             // 0 → empty state
11
12  useEffect(() => {
13    countCollections().then(setTotal);
14    queryCollections({ limit }).then(({ collections, nextCursor }) => {
15      setCollections(collections);
16      setCursor(nextCursor);
17    });
18  }, [limit]);
19
20  const loadMore = () =>
21    queryCollections({ limit, cursor }).then(({ collections: more, nextCursor }) => {
22      setCollections((c) => [...(c ?? []), ...more]);
23      setCursor(nextCursor);
24    });
25
26  return { collections, total, cursor, loadMore };
27}