@tapcart/mobile-components 0.12.10 → 0.12.12

package/dist/components/hooks/use-infinite-wishlist.test.js

@@ -0,0 +1,1244 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+import { renderHook, act, waitFor } from "@testing-library/react";
+import { useInfiniteWishlist } from "./use-infinite-wishlist";
+// ─── Module mocks ────────────────────────────────────────────────────────────
+jest.mock("./use-collection", () => ({
+    useCollection: jest.fn(),
+}));
+jest.mock("react-intersection-observer", () => ({
+    useInView: jest.fn(),
+}));
+jest.mock("../../lib/utils", () => ({
+    getProductGidsFromIds: jest.fn((ids) => ids.map((id) => id.startsWith("gid://shopify/Product/")
+        ? id
+        : `gid://shopify/Product/${id}`)),
+    getVariantGidsFromIds: jest.fn((ids) => ids.map((id) => id.startsWith("gid://shopify/ProductVariant/")
+        ? id
+        : `gid://shopify/ProductVariant/${id}`)),
+}));
+// ─── Imports after mocks ─────────────────────────────────────────────────────
+import { useCollection } from "./use-collection";
+import { useInView } from "react-intersection-observer";
+// ─── Helpers ─────────────────────────────────────────────────────────────────
+const mockUseCollection = useCollection;
+const mockUseInView = useInView;
+const MOCK_LOAD_MORE_REF = jest.fn();
+// Stable array references used as hook props – must live outside renderHook
+// callbacks so React's effect dep comparison sees the same reference each render.
+const THREE_ITEMS = [{ productId: "1" }, { productId: "2" }, { productId: "3" }];
+const TWO_ITEMS = [{ productId: "1" }, { productId: "2" }];
+const ONE_ITEM = [{ productId: "1" }];
+const EMPTY_ITEMS = [];
+// Same product, two variants — item keys are variant GIDs so two separate cards
+const TWO_ITEMS_WITH_VARIANTS = [
+    { productId: "2", variantId: "v3" },
+    { productId: "1", variantId: "v2" },
+];
+const TWO_ITEMS_VARIANT_IDS_ONE = [
+    { productId: "1", variantId: "v1" },
+    { productId: "1", variantId: "v999" },
+];
+// GID-format productIds for removal and sort-ordering tests (product.id is GID).
+const GID_1 = "gid://shopify/Product/1";
+const GID_2 = "gid://shopify/Product/2";
+const GID_3 = "gid://shopify/Product/3";
+const GID_4 = "gid://shopify/Product/4";
+const TWO_ITEMS_GIDS = [{ productId: GID_1 }, { productId: GID_2 }];
+const THREE_ITEMS_GIDS = [
+    { productId: GID_1 },
+    { productId: GID_2 },
+    { productId: GID_3 },
+];
+const FOUR_ITEMS_GIDS = [
+    { productId: GID_1 },
+    { productId: GID_2 },
+    { productId: GID_3 },
+    { productId: GID_4 },
+];
+const FOUR_ITEMS_GIDS_NO_2 = [
+    { productId: GID_1 },
+    { productId: GID_3 },
+    { productId: GID_4 },
+];
+function makeProduct(id, variantIds = [`${id}-v1`]) {
+    return {
+        id: `gid://shopify/Product/${id}`,
+        handle: `product-${id}`,
+        title: `Product ${id}`,
+        description: `Description ${id}`,
+        availableForSale: true,
+        vendor: "TestVendor",
+        variants: variantIds.map((vid) => ({
+            id: `gid://shopify/ProductVariant/${vid}`,
+            title: `Variant ${vid}`,
+            price: { amount: "10.00" },
+            compareAtPrice: { amount: "15.00" },
+            availableForSale: true,
+            sku: `SKU-${vid}`,
+            selectedOptions: [],
+        })),
+        featuredImage: {
+            url: `https://example.com/${id}.jpg`,
+            altText: `Image ${id}`,
+            width: 100,
+            height: 100,
+        },
+    };
+}
+function setupInView(inView) {
+    mockUseInView.mockReturnValue({ ref: MOCK_LOAD_MORE_REF, inView });
+}
+function setupCollection(collectionId) {
+    mockUseCollection.mockReturnValue({
+        collections: collectionId ? [{ id: collectionId }] : [],
+        specificCollection: null,
+        maxProductCollection: null,
+        loading: false,
+        error: null,
+    });
+}
+// queryVariables must also be a stable module-level reference so it doesn't
+// recreate fetchProducts/loadMore on every render.
+const DEFAULT_QUERY_VARS = { language: "EN", country: "US", appId: "app-123" };
+const DEFAULT_PROPS = {
+    initialItems: THREE_ITEMS,
+    chunkSize: 2,
+    apiUrl: "https://api.example.com",
+    shouldMock: false,
+    queryVariables: DEFAULT_QUERY_VARS,
+};
+// ─── Tests ───────────────────────────────────────────────────────────────────
+describe("useInfiniteWishlist", () => {
+    beforeEach(() => {
+        jest.clearAllMocks();
+        setupInView(false);
+        setupCollection(undefined);
+        global.fetch = jest.fn();
+    });
+    // ── Initial state ──────────────────────────────────────────────────────────
+    describe("initial state", () => {
+        it("returns empty products, not loading, no error, and hasMore when ids exist", () => {
+            const { result } = renderHook(() => useInfiniteWishlist(Object.assign({}, DEFAULT_PROPS)));
+            expect(result.current.products).toEqual([]);
+            expect(result.current.isLoading).toBe(false);
+            expect(result.current.isLoadingMore).toBe(false);
+            expect(result.current.error).toBeNull();
+            expect(result.current.hasMore).toBe(true);
+            expect(result.current.loadMoreRef).toBe(MOCK_LOAD_MORE_REF);
+            expect(typeof result.current.loadMore).toBe("function");
+            expect(typeof result.current.reset).toBe("function");
+        });
+        it("hasMore is false when initialItems is empty", () => {
+            const { result } = renderHook(() => useInfiniteWishlist(Object.assign(Object.assign({}, DEFAULT_PROPS), { initialItems: EMPTY_ITEMS })));
+            expect(result.current.hasMore).toBe(false);
+        });
+    });
+    // ── Non-mock mode: loadMore ────────────────────────────────────────────────
+    describe("non-mock mode", () => {
+        it("fetches first chunk of products on loadMore", () => __awaiter(void 0, void 0, void 0, function* () {
+            // Multiple variants per product so getProductOrVariantKey returns p.id (product GID)
+            const products = [
+                makeProduct("1", ["v1", "v2"]),
+                makeProduct("2", ["v1", "v2"]),
+            ];
+            global.fetch.mockResolvedValueOnce({
+                ok: true,
+                json: () => __awaiter(void 0, void 0, void 0, function* () { return products; }),
+            });
+            const { result } = renderHook(() => useInfiniteWishlist(Object.assign({}, DEFAULT_PROPS)));
+            yield act(() => __awaiter(void 0, void 0, void 0, function* () {
+                yield result.current.loadMore();
+            }));
+            expect(result.current.products).toEqual(products);
+            expect(result.current.isLoading).toBe(false);
+        }));
+        it("uses chunkSize to limit how many ids are fetched per call", () => __awaiter(void 0, void 0, void 0, function* () {
+            var _a;
+            const products = [
+                makeProduct("1", ["v1", "v2"]),
+                makeProduct("2", ["v1", "v2"]),
+            ];
+            global.fetch.mockResolvedValueOnce({
+                ok: true,
+                json: () => __awaiter(void 0, void 0, void 0, function* () { return products; }),
+            });
+            const { result } = renderHook(() => useInfiniteWishlist(Object.assign(Object.assign({}, DEFAULT_PROPS), { initialItems: THREE_ITEMS, chunkSize: 2 })));
+            yield act(() => __awaiter(void 0, void 0, void 0, function* () {
+                yield result.current.loadMore();
+            }));
+            const [calledUrl] = global.fetch.mock.calls[0];
+            const url = new URL(calledUrl);
+            const ids = (_a = url.searchParams.get("ids")) === null || _a === void 0 ? void 0 : _a.split(",");
+            expect(ids).toHaveLength(2);
+        }));
+        it("appends products on subsequent loadMore calls", () => __awaiter(void 0, void 0, void 0, function* () {
+            const chunk1 = [
+                makeProduct("1", ["v1", "v2"]),
+                makeProduct("2", ["v1", "v2"]),
+            ];
+            const chunk2 = [makeProduct("3", ["v1", "v2"])];
+            global.fetch
+                .mockResolvedValueOnce({ ok: true, json: () => __awaiter(void 0, void 0, void 0, function* () { return chunk1; }) })
+                .mockResolvedValueOnce({ ok: true, json: () => __awaiter(void 0, void 0, void 0, function* () { return chunk2; }) });
+            const { result } = renderHook(() => useInfiniteWishlist(Object.assign({}, DEFAULT_PROPS)));
+            yield act(() => __awaiter(void 0, void 0, void 0, function* () {
+                yield result.current.loadMore();
+            }));
+            yield act(() => __awaiter(void 0, void 0, void 0, function* () {
+                yield result.current.loadMore();
+            }));
+            expect(result.current.products).toHaveLength(3);
+            expect(result.current.products[0]).toEqual(chunk1[0]);
+            expect(result.current.products[2]).toEqual(chunk2[0]);
+        }));
+        it("updates hasMore correctly as products are loaded", () => __awaiter(void 0, void 0, void 0, function* () {
+            const chunk1 = [
+                makeProduct("1", ["v1", "v2"]),
+                makeProduct("2", ["v1", "v2"]),
+            ];
+            const chunk2 = [makeProduct("3", ["v1", "v2"])];
+            global.fetch
+                .mockResolvedValueOnce({ ok: true, json: () => __awaiter(void 0, void 0, void 0, function* () { return chunk1; }) })
+                .mockResolvedValueOnce({ ok: true, json: () => __awaiter(void 0, void 0, void 0, function* () { return chunk2; }) });
+            const { result } = renderHook(() => useInfiniteWishlist(Object.assign({}, DEFAULT_PROPS)));
+            expect(result.current.hasMore).toBe(true);
+            yield act(() => __awaiter(void 0, void 0, void 0, function* () {
+                yield result.current.loadMore();
+            }));
+            // One id ("3") still remaining
+            expect(result.current.hasMore).toBe(true);
+            yield act(() => __awaiter(void 0, void 0, void 0, function* () {
+                yield result.current.loadMore();
+            }));
+            expect(result.current.hasMore).toBe(false);
+        }));
+        it("does not fetch when there are no more ids", () => __awaiter(void 0, void 0, void 0, function* () {
+            const { result } = renderHook(() => useInfiniteWishlist(Object.assign(Object.assign({}, DEFAULT_PROPS), { initialItems: EMPTY_ITEMS })));
+            yield act(() => __awaiter(void 0, void 0, void 0, function* () {
+                yield result.current.loadMore();
+            }));
+            expect(global.fetch).not.toHaveBeenCalled();
+        }));
+        it("builds the request URL with ids, language, and country params", () => __awaiter(void 0, void 0, void 0, function* () {
+            ;
+            global.fetch.mockResolvedValueOnce({
+                ok: true,
+                json: () => __awaiter(void 0, void 0, void 0, function* () { return [makeProduct("1")]; }),
+            });
+            const { result } = renderHook(() => useInfiniteWishlist(Object.assign(Object.assign({}, DEFAULT_PROPS), { initialItems: ONE_ITEM, chunkSize: 1 })));
+            yield act(() => __awaiter(void 0, void 0, void 0, function* () {
+                yield result.current.loadMore();
+            }));
+            const [calledUrl] = global.fetch.mock.calls[0];
+            expect(calledUrl).toContain("/products/by-ids");
+            expect(calledUrl).toContain("language=EN");
+            expect(calledUrl).toContain("country=US");
+            expect(calledUrl).toContain("gid%3A%2F%2Fshopify%2FProduct%2F1");
+        }));
+        it("omits country and language params when not provided", () => __awaiter(void 0, void 0, void 0, function* () {
+            ;
+            global.fetch.mockResolvedValueOnce({
+                ok: true,
+                json: () => __awaiter(void 0, void 0, void 0, function* () { return [makeProduct("1")]; }),
+            });
+            const emptyQueryVars = {};
+            const { result } = renderHook(() => useInfiniteWishlist(Object.assign(Object.assign({}, DEFAULT_PROPS), { initialItems: ONE_ITEM, chunkSize: 1, queryVariables: emptyQueryVars })));
+            yield act(() => __awaiter(void 0, void 0, void 0, function* () {
+                yield result.current.loadMore();
+            }));
+            const [calledUrl] = global.fetch.mock.calls[0];
+            expect(calledUrl).not.toContain("language=");
+            expect(calledUrl).not.toContain("country=");
+        }));
+        it("sets error state and throws when fetch returns non-ok response", () => __awaiter(void 0, void 0, void 0, function* () {
+            var _b;
+            ;
+            global.fetch.mockResolvedValueOnce({
+                ok: false,
+                status: 500,
+            });
+            const { result } = renderHook(() => useInfiniteWishlist(Object.assign({}, DEFAULT_PROPS)));
+            yield act(() => __awaiter(void 0, void 0, void 0, function* () {
+                try {
+                    yield result.current.loadMore();
+                }
+                catch (_c) {
+                    // expected
+                }
+            }));
+            expect(result.current.error).toBeInstanceOf(Error);
+            expect((_b = result.current.error) === null || _b === void 0 ? void 0 : _b.message).toContain("HTTP error: 500");
+        }));
+        it("sets error state when fetch throws a network error", () => __awaiter(void 0, void 0, void 0, function* () {
+            var _d;
+            ;
+            global.fetch.mockRejectedValueOnce(new Error("Network failure"));
+            const { result } = renderHook(() => useInfiniteWishlist(Object.assign({}, DEFAULT_PROPS)));
+            yield act(() => __awaiter(void 0, void 0, void 0, function* () {
+                try {
+                    yield result.current.loadMore();
+                }
+                catch (_e) {
+                    // expected
+                }
+            }));
+            expect(result.current.error).toBeInstanceOf(Error);
+            expect((_d = result.current.error) === null || _d === void 0 ? void 0 : _d.message).toBe("Network failure");
+        }));
+        it("sets isLoading true while fetching and false after with no prior products", () => __awaiter(void 0, void 0, void 0, function* () {
+            let resolveFetch;
+            const fetchPromise = new Promise((resolve) => {
+                resolveFetch = resolve;
+            });
+            global.fetch.mockReturnValueOnce(fetchPromise);
+            const { result } = renderHook(() => useInfiniteWishlist(Object.assign({}, DEFAULT_PROPS)));
+            act(() => {
+                result.current.loadMore();
+            });
+            // No products yet → isLoading (not isLoadingMore)
+            expect(result.current.isLoading).toBe(true);
+            expect(result.current.isLoadingMore).toBe(false);
+            yield act(() => __awaiter(void 0, void 0, void 0, function* () {
+                resolveFetch({ ok: true, json: () => __awaiter(void 0, void 0, void 0, function* () { return []; }) });
+                yield fetchPromise;
+            }));
+            expect(result.current.isLoading).toBe(false);
+        }));
+        it("shows isLoadingMore (not isLoading) when products already exist", () => __awaiter(void 0, void 0, void 0, function* () {
+            const chunk1 = [
+                makeProduct("1", ["v1", "v2"]),
+                makeProduct("2", ["v1", "v2"]),
+            ];
+            global.fetch.mockResolvedValueOnce({
+                ok: true,
+                json: () => __awaiter(void 0, void 0, void 0, function* () { return chunk1; }),
+            });
+            const { result } = renderHook(() => useInfiniteWishlist(Object.assign({}, DEFAULT_PROPS)));
+            // Load first chunk so products array is populated
+            yield act(() => __awaiter(void 0, void 0, void 0, function* () {
+                yield result.current.loadMore();
+            }));
+            let resolveSecond;
+            const secondPromise = new Promise((resolve) => {
+                resolveSecond = resolve;
+            });
+            global.fetch.mockReturnValueOnce(secondPromise);
+            act(() => {
+                result.current.loadMore();
+            });
+            expect(result.current.isLoading).toBe(false);
+            expect(result.current.isLoadingMore).toBe(true);
+            yield act(() => __awaiter(void 0, void 0, void 0, function* () {
+                resolveSecond({ ok: true, json: () => __awaiter(void 0, void 0, void 0, function* () { return []; }) });
+                yield secondPromise;
+            }));
+        }));
+        it("prevents concurrent loadMore calls via loadingRef guard", () => __awaiter(void 0, void 0, void 0, function* () {
+            let resolveFirst;
+            const firstPromise = new Promise((resolve) => {
+                resolveFirst = resolve;
+            });
+            global.fetch.mockReturnValueOnce(firstPromise);
+            const { result } = renderHook(() => useInfiniteWishlist(Object.assign({}, DEFAULT_PROPS)));
+            // Both calls happen synchronously; the second should be blocked by
+            // loadingRef.current being true after the first starts.
+            act(() => {
+                result.current.loadMore();
+                result.current.loadMore();
+            });
+            yield act(() => __awaiter(void 0, void 0, void 0, function* () {
+                resolveFirst({ ok: true, json: () => __awaiter(void 0, void 0, void 0, function* () { return [makeProduct("1")]; }) });
+                yield firstPromise;
+            }));
+            expect(global.fetch).toHaveBeenCalledTimes(1);
+        }));
+    });
+    // ── initialItems with variants (one card per item key) ──────────────────────
+    describe("initialItems with variants", () => {
+        it("returns products filtered and ordered by initialItems (variant keys)", () => __awaiter(void 0, void 0, void 0, function* () {
+            const product1 = makeProduct("1", ["v1", "v2"]);
+            const product2 = makeProduct("2", ["v3"]);
+            global.fetch.mockResolvedValueOnce({
+                ok: true,
+                json: () => __awaiter(void 0, void 0, void 0, function* () { return [product1, product2]; }),
+            });
+            const { result } = renderHook(() => useInfiniteWishlist(Object.assign(Object.assign({}, DEFAULT_PROPS), { initialItems: TWO_ITEMS_WITH_VARIANTS, chunkSize: 2 })));
+            yield act(() => __awaiter(void 0, void 0, void 0, function* () {
+                yield result.current.loadMore();
+            }));
+            expect(result.current.products).toHaveLength(2);
+            // Order follows initialItems: v3 (product2) first, then v2 (product1)
+            expect(result.current.products[0].id).toBe(product2.id);
+            expect(result.current.products[0].variants).toHaveLength(1);
+            expect(result.current.products[0].variants[0].id).toContain("v3");
+            expect(result.current.products[1].id).toBe(product1.id);
+            expect(result.current.products[1].variants[0].id).toContain("v2");
+        }));
+        it("preserves global variant order across paginated loads (chunkSize=1)", () => __awaiter(void 0, void 0, void 0, function* () {
+            const product1 = makeProduct("1", ["v1", "v2"]);
+            const product2 = makeProduct("2", ["v3"]);
+            global.fetch
+                .mockResolvedValueOnce({ ok: true, json: () => __awaiter(void 0, void 0, void 0, function* () { return [product2]; }) })
+                .mockResolvedValueOnce({ ok: true, json: () => __awaiter(void 0, void 0, void 0, function* () { return [product1]; }) });
+            const { result } = renderHook(() => useInfiniteWishlist(Object.assign(Object.assign({}, DEFAULT_PROPS), { initialItems: TWO_ITEMS_WITH_VARIANTS, chunkSize: 1 })));
+            yield act(() => __awaiter(void 0, void 0, void 0, function* () {
+                yield result.current.loadMore(); // loads product2 (has v3)
+            }));
+            yield act(() => __awaiter(void 0, void 0, void 0, function* () {
+                yield result.current.loadMore(); // loads product1 (has v2)
+            }));
+            expect(result.current.products).toHaveLength(2);
+            // Final order must follow variantIds: v3 (product2) first, v2 (product1) second.
+            expect(result.current.products[0].id).toBe(product2.id);
+            expect(result.current.products[0].variants[0].id).toContain("v3");
+            expect(result.current.products[1].id).toBe(product1.id);
+            expect(result.current.products[1].variants[0].id).toContain("v2");
+        }));
+        it("excludes variants not found in product list", () => __awaiter(void 0, void 0, void 0, function* () {
+            const product1 = makeProduct("1", ["v1"]);
+            global.fetch.mockResolvedValueOnce({
+                ok: true,
+                json: () => __awaiter(void 0, void 0, void 0, function* () { return [product1]; }),
+            });
+            const { result } = renderHook(() => useInfiniteWishlist(Object.assign(Object.assign({}, DEFAULT_PROPS), { initialItems: TWO_ITEMS_VARIANT_IDS_ONE, chunkSize: 1 })));
+            yield act(() => __awaiter(void 0, void 0, void 0, function* () {
+                yield result.current.loadMore();
+            }));
+            expect(result.current.products).toHaveLength(1);
+            expect(result.current.products[0].variants[0].id).toContain("v1");
+        }));
+        it("returns all products when items have no variantId", () => __awaiter(void 0, void 0, void 0, function* () {
+            const products = [
+                makeProduct("1", ["v1", "v2"]),
+                makeProduct("2", ["v1", "v2"]),
+            ];
+            global.fetch.mockResolvedValueOnce({
+                ok: true,
+                json: () => __awaiter(void 0, void 0, void 0, function* () { return products; }),
+            });
+            const { result } = renderHook(() => useInfiniteWishlist(Object.assign(Object.assign({}, DEFAULT_PROPS), { initialItems: TWO_ITEMS, chunkSize: 2 })));
+            yield act(() => __awaiter(void 0, void 0, void 0, function* () {
+                yield result.current.loadMore();
+            }));
+            expect(result.current.products).toEqual(products);
+        }));
+        it("same productId with two variantIds: one API call, two cards", () => __awaiter(void 0, void 0, void 0, function* () {
+            const product1 = makeProduct("1", ["v1", "v2"]);
+            global.fetch.mockResolvedValueOnce({
+                ok: true,
+                json: () => __awaiter(void 0, void 0, void 0, function* () { return [product1]; }),
+            });
+            const twoVariantsSameProduct = [
+                { productId: "1", variantId: "v1" },
+                { productId: "1", variantId: "v2" },
+            ];
+            const { result } = renderHook(() => useInfiniteWishlist(Object.assign(Object.assign({}, DEFAULT_PROPS), { initialItems: twoVariantsSameProduct, chunkSize: 2 })));
+            yield act(() => __awaiter(void 0, void 0, void 0, function* () {
+                yield result.current.loadMore();
+            }));
+            expect(global.fetch).toHaveBeenCalledTimes(1);
+            expect(result.current.products).toHaveLength(2);
+            expect(result.current.products[0].variants[0].id).toContain("v1");
+            expect(result.current.products[1].variants[0].id).toContain("v2");
+        }));
+        it("isPureRemoval removes one of two variant cards and leaves the other", () => __awaiter(void 0, void 0, void 0, function* () {
+            const product1 = makeProduct("1", ["v1", "v2"]);
+            global.fetch.mockResolvedValueOnce({
+                ok: true,
+                json: () => __awaiter(void 0, void 0, void 0, function* () { return [product1]; }),
+            });
+            const twoVariants = [
+                { productId: "1", variantId: "v1" },
+                { productId: "1", variantId: "v2" },
+            ];
+            const oneVariant = [{ productId: "1", variantId: "v1" }];
+            const { result, rerender } = renderHook(({ items }) => useInfiniteWishlist(Object.assign(Object.assign({}, DEFAULT_PROPS), { initialItems: items, chunkSize: 2 })), { initialProps: { items: twoVariants } });
+            yield act(() => __awaiter(void 0, void 0, void 0, function* () {
+                yield result.current.loadMore();
+            }));
+            expect(result.current.products).toHaveLength(2);
+            rerender({ items: oneVariant });
+            expect(result.current.products).toHaveLength(1);
+            expect(result.current.products[0].variants[0].id).toContain("v1");
+        }));
+        it("isPureAddition adds second variant of an already-loaded product", () => __awaiter(void 0, void 0, void 0, function* () {
+            const product1 = makeProduct("1", ["v1", "v2"]);
+            global.fetch
+                .mockResolvedValueOnce({ ok: true, json: () => __awaiter(void 0, void 0, void 0, function* () { return [product1]; }) })
+                .mockResolvedValueOnce({ ok: true, json: () => __awaiter(void 0, void 0, void 0, function* () { return [product1]; }) });
+            const oneVariant = [{ productId: "1", variantId: "v1" }];
+            const twoVariants = [
+                { productId: "1", variantId: "v1" },
+                { productId: "1", variantId: "v2" },
+            ];
+            const { result, rerender } = renderHook(({ items }) => useInfiniteWishlist(Object.assign(Object.assign({}, DEFAULT_PROPS), { initialItems: items, chunkSize: 2 })), { initialProps: { items: oneVariant } });
+            yield act(() => __awaiter(void 0, void 0, void 0, function* () {
+                yield result.current.loadMore();
+            }));
+            expect(result.current.products).toHaveLength(1);
+            rerender({ items: twoVariants });
+            expect(result.current.products).toHaveLength(1);
+            expect(result.current.hasMore).toBe(true);
+            yield act(() => __awaiter(void 0, void 0, void 0, function* () {
+                yield result.current.loadMore();
+            }));
+            expect(result.current.products).toHaveLength(2);
+        }));
+        it("stale-response bail-out when allItemKeys ref changes during fetch", () => __awaiter(void 0, void 0, void 0, function* () {
+            let resolveFirst;
+            const firstPromise = new Promise((resolve) => {
+                resolveFirst = resolve;
+            });
+            global.fetch.mockReturnValueOnce(firstPromise);
+            const { result, rerender } = renderHook(({ items }) => useInfiniteWishlist(Object.assign(Object.assign({}, DEFAULT_PROPS), { initialItems: items, chunkSize: 2 })), { initialProps: { items: TWO_ITEMS } });
+            act(() => {
+                result.current.loadMore();
+            });
+            rerender({ items: ONE_ITEM });
+            yield act(() => __awaiter(void 0, void 0, void 0, function* () {
+                resolveFirst({
+                    ok: true,
+                    json: () => __awaiter(void 0, void 0, void 0, function* () {
+                        return [
+                            makeProduct("1", ["v1", "v2"]),
+                            makeProduct("2", ["v1", "v2"]),
+                        ];
+                    }),
+                });
+                yield firstPromise;
+            }));
+            expect(result.current.products).toHaveLength(0);
+        }));
+    });
+    // ── Product sort ordering ─────────────────────────────────────────────────
+    describe("product sort ordering (product-only items)", () => {
+        it("sorts products to match the requested ID order when the API returns them out of order", () => __awaiter(void 0, void 0, void 0, function* () {
+            const product1 = makeProduct("1", ["v1", "v2"]);
+            const product2 = makeProduct("2", ["v1", "v2"]);
+            const product3 = makeProduct("3", ["v1", "v2"]);
+            global.fetch.mockResolvedValueOnce({
+                ok: true,
+                json: () => __awaiter(void 0, void 0, void 0, function* () { return [product3, product1, product2]; }),
+            });
+            const { result } = renderHook(() => useInfiniteWishlist(Object.assign(Object.assign({}, DEFAULT_PROPS), { initialItems: THREE_ITEMS_GIDS, chunkSize: 3 })));
+            yield act(() => __awaiter(void 0, void 0, void 0, function* () {
+                yield result.current.loadMore();
+            }));
+            expect(result.current.products[0].id).toBe(GID_1);
+            expect(result.current.products[1].id).toBe(GID_2);
+            expect(result.current.products[2].id).toBe(GID_3);
+        }));
+        it("preserves wishlist order across paginated chunks", () => __awaiter(void 0, void 0, void 0, function* () {
+            ;
+            global.fetch
+                .mockResolvedValueOnce({
+                ok: true,
+                json: () => __awaiter(void 0, void 0, void 0, function* () {
+                    return [
+                        makeProduct("2", ["v1", "v2"]),
+                        makeProduct("1", ["v1", "v2"]),
+                    ];
+                }),
+            })
+                .mockResolvedValueOnce({
+                ok: true,
+                json: () => __awaiter(void 0, void 0, void 0, function* () { return [makeProduct("3", ["v1", "v2"])]; }),
+            });
+            const { result } = renderHook(() => useInfiniteWishlist(Object.assign(Object.assign({}, DEFAULT_PROPS), { initialItems: THREE_ITEMS_GIDS, chunkSize: 2 })));
+            yield act(() => __awaiter(void 0, void 0, void 0, function* () {
+                yield result.current.loadMore();
+            }));
+            expect(result.current.products[0].id).toBe(GID_1);
+            expect(result.current.products[1].id).toBe(GID_2);
+            yield act(() => __awaiter(void 0, void 0, void 0, function* () {
+                yield result.current.loadMore();
+            }));
+            expect(result.current.products).toHaveLength(3);
+            expect(result.current.products[2].id).toBe(GID_3);
+        }));
+    });
+    // ── Mock mode ──────────────────────────────────────────────────────────────
+    describe("mock mode (shouldMock: true)", () => {
+        it("does not fetch until collectionToFetchID is available", () => __awaiter(void 0, void 0, void 0, function* () {
+            setupCollection(undefined);
+            const { result } = renderHook(() => useInfiniteWishlist(Object.assign(Object.assign({}, DEFAULT_PROPS), { shouldMock: true, initialItems: EMPTY_ITEMS })));
+            yield act(() => __awaiter(void 0, void 0, void 0, function* () {
+                yield new Promise((resolve) => setTimeout(resolve, 0));
+            }));
+            expect(global.fetch).not.toHaveBeenCalled();
+            expect(result.current.products).toEqual([]);
+        }));
+        it("auto-fetches mocked products when collectionToFetchID becomes available", () => __awaiter(void 0, void 0, void 0, function* () {
+            const mockedProducts = [makeProduct("m1"), makeProduct("m2")];
+            setupCollection("coll-abc");
+            global.fetch.mockResolvedValueOnce({
+                ok: true,
+                json: () => __awaiter(void 0, void 0, void 0, function* () { return ({ products: mockedProducts }); }),
+            });
+            const { result } = renderHook(() => useInfiniteWishlist(Object.assign(Object.assign({}, DEFAULT_PROPS), { shouldMock: true, initialItems: EMPTY_ITEMS })));
+            yield waitFor(() => {
+                expect(result.current.products).toHaveLength(2);
+            });
+            expect(result.current.products).toEqual(mockedProducts);
+        }));
+        it("posts to /products/by-page with correct body", () => __awaiter(void 0, void 0, void 0, function* () {
+            setupCollection("coll-xyz");
+            global.fetch.mockResolvedValueOnce({
+                ok: true,
+                json: () => __awaiter(void 0, void 0, void 0, function* () {
+                    return ({
+                        products: [makeProduct("m1"), makeProduct("m2")],
+                    });
+                }),
+            });
+            renderHook(() => useInfiniteWishlist(Object.assign(Object.assign({}, DEFAULT_PROPS), { shouldMock: true, initialItems: EMPTY_ITEMS })));
+            yield waitFor(() => {
+                expect(global.fetch).toHaveBeenCalledTimes(1);
+            });
+            const [calledUrl, fetchOptions] = global.fetch.mock
+                .calls[0];
+            expect(calledUrl).toContain("/products/by-page");
+            expect(fetchOptions.method).toBe("POST");
+            const body = JSON.parse(fetchOptions.body);
+            expect(body).toMatchObject({
+                language: "EN",
+                country: "US",
+                appId: "app-123",
+                collectionId: "coll-xyz",
+            });
+        }));
+        it("slices mocked products to at most 2", () => __awaiter(void 0, void 0, void 0, function* () {
+            setupCollection("coll-abc");
+            global.fetch.mockResolvedValueOnce({
+                ok: true,
+                json: () => __awaiter(void 0, void 0, void 0, function* () {
+                    return ({
+                        products: [makeProduct("1"), makeProduct("2"), makeProduct("3")],
+                    });
+                }),
+            });
+            const { result } = renderHook(() => useInfiniteWishlist(Object.assign(Object.assign({}, DEFAULT_PROPS), { shouldMock: true, initialItems: EMPTY_ITEMS })));
+            yield waitFor(() => {
+                expect(result.current.products).toHaveLength(2);
+            });
+        }));
+        it("replaces products instead of appending on subsequent loadMore calls", () => __awaiter(void 0, void 0, void 0, function* () {
+            setupCollection("coll-abc");
+            const batch = [makeProduct("m1"), makeProduct("m2")];
+            global.fetch
+                .mockResolvedValueOnce({
+                ok: true,
+                json: () => __awaiter(void 0, void 0, void 0, function* () { return ({ products: batch }); }),
+            })
+                .mockResolvedValueOnce({
+                ok: true,
+                json: () => __awaiter(void 0, void 0, void 0, function* () { return ({ products: batch }); }),
+            });
+            const { result } = renderHook(() => useInfiniteWishlist(Object.assign(Object.assign({}, DEFAULT_PROPS), { shouldMock: true, initialItems: EMPTY_ITEMS })));
+            yield waitFor(() => {
+                expect(result.current.products).toHaveLength(2);
+            });
+            yield act(() => __awaiter(void 0, void 0, void 0, function* () {
+                yield result.current.loadMore();
+            }));
+            // Still 2 products – replaced, not appended
+            expect(result.current.products).toHaveLength(2);
+        }));
+        it("hasMore is true when products.length < 2 in mock mode", () => __awaiter(void 0, void 0, void 0, function* () {
+            setupCollection("coll-abc");
+            global.fetch.mockResolvedValueOnce({
+                ok: true,
+                json: () => __awaiter(void 0, void 0, void 0, function* () { return ({ products: [makeProduct("m1")] }); }),
+            });
+            const { result } = renderHook(() => useInfiniteWishlist(Object.assign(Object.assign({}, DEFAULT_PROPS), { shouldMock: true, initialItems: EMPTY_ITEMS })));
+            yield waitFor(() => {
+                expect(result.current.products).toHaveLength(1);
+            });
+            expect(result.current.hasMore).toBe(true);
+        }));
+        it("hasMore is false when products.length >= 2 in mock mode", () => __awaiter(void 0, void 0, void 0, function* () {
+            setupCollection("coll-abc");
+            global.fetch.mockResolvedValueOnce({
+                ok: true,
+                json: () => __awaiter(void 0, void 0, void 0, function* () {
+                    return ({
+                        products: [makeProduct("m1"), makeProduct("m2")],
+                    });
+                }),
+            });
+            const { result } = renderHook(() => useInfiniteWishlist(Object.assign(Object.assign({}, DEFAULT_PROPS), { shouldMock: true, initialItems: EMPTY_ITEMS })));
+            yield waitFor(() => {
+                expect(result.current.products).toHaveLength(2);
+            });
+            expect(result.current.hasMore).toBe(false);
+        }));
+        it("returns empty products when server response has no products key", () => __awaiter(void 0, void 0, void 0, function* () {
+            // Covers the `data.products?.slice(0, 2) || []` fallback in
+            // fetchMockedProducts when the server omits the products array.
+            setupCollection("coll-abc");
+            global.fetch.mockResolvedValueOnce({
+                ok: true,
+                json: () => __awaiter(void 0, void 0, void 0, function* () { return ({}); }),
+            });
+            const { result } = renderHook(() => useInfiniteWishlist(Object.assign(Object.assign({}, DEFAULT_PROPS), { shouldMock: true, initialItems: EMPTY_ITEMS })));
+            yield act(() => __awaiter(void 0, void 0, void 0, function* () {
+                yield new Promise((resolve) => setTimeout(resolve, 0));
+            }));
+            expect(result.current.products).toEqual([]);
+            expect(result.current.error).toBeNull();
+        }));
+        it("returns empty array from fetchMockedProducts when collectionToFetchID is absent", () => __awaiter(void 0, void 0, void 0, function* () {
+            setupCollection(undefined);
+            const { result } = renderHook(() => useInfiniteWishlist(Object.assign(Object.assign({}, DEFAULT_PROPS), { shouldMock: true, initialItems: EMPTY_ITEMS })));
+            yield act(() => __awaiter(void 0, void 0, void 0, function* () {
+                yield result.current.loadMore();
+            }));
+            expect(result.current.products).toEqual([]);
+            expect(global.fetch).not.toHaveBeenCalled();
+        }));
+    });
+    // ── initialItems change effect ─────────────────────────────────────────────
+    describe("initialItems change", () => {
+        it("preserves products and surfaces hasMore when a new item is appended", () => __awaiter(void 0, void 0, void 0, function* () {
+            ;
+            global.fetch.mockResolvedValueOnce({
+                ok: true,
+                json: () => __awaiter(void 0, void 0, void 0, function* () {
+                    return [
+                        makeProduct("1", ["v1", "v2"]),
+                        makeProduct("2", ["v1", "v2"]),
+                    ];
+                }),
+            });
+            const { result, rerender } = renderHook(({ items }) => useInfiniteWishlist(Object.assign(Object.assign({}, DEFAULT_PROPS), { initialItems: items })), { initialProps: { items: TWO_ITEMS } });
+            yield act(() => __awaiter(void 0, void 0, void 0, function* () {
+                yield result.current.loadMore();
+            }));
+            expect(result.current.products).toHaveLength(2);
+            // Pure addition: existing products must be preserved, new item surfaced via hasMore
+            rerender({ items: THREE_ITEMS });
+            expect(result.current.products).toHaveLength(2);
+            expect(result.current.hasMore).toBe(true);
+        }));
+        it("does not reset on the initial mount", () => {
+            const { result } = renderHook(() => useInfiniteWishlist(Object.assign({}, DEFAULT_PROPS)));
+            expect(result.current.products).toEqual([]);
+        });
+        it("does not reset when a new array reference has identical content", () => __awaiter(void 0, void 0, void 0, function* () {
+            ;
+            global.fetch.mockResolvedValueOnce({
+                ok: true,
+                json: () => __awaiter(void 0, void 0, void 0, function* () {
+                    return [
+                        makeProduct("1", ["v1", "v2"]),
+                        makeProduct("2", ["v1", "v2"]),
+                    ];
+                }),
+            });
+            const { result, rerender } = renderHook(({ items }) => useInfiniteWishlist(Object.assign(Object.assign({}, DEFAULT_PROPS), { initialItems: items })), { initialProps: { items: TWO_ITEMS } });
+            yield act(() => __awaiter(void 0, void 0, void 0, function* () {
+                yield result.current.loadMore();
+            }));
+            expect(result.current.products).toHaveLength(2);
+            // New reference, same values → must be a no-op
+            rerender({ items: [{ productId: "1" }, { productId: "2" }] });
+            expect(result.current.products).toHaveLength(2);
+            expect(global.fetch).toHaveBeenCalledTimes(1);
+        }));
+        it("removes a product in-place without resetting when a single item is removed", () => __awaiter(void 0, void 0, void 0, function* () {
+            ;
+            global.fetch.mockResolvedValueOnce({
+                ok: true,
+                json: () => __awaiter(void 0, void 0, void 0, function* () {
+                    return [
+                        makeProduct("1", ["v1", "v2"]),
+                        makeProduct("2", ["v1", "v2"]),
+                        makeProduct("3", ["v1", "v2"]),
+                    ];
+                }),
+            });
+            const { result, rerender } = renderHook(({ items }) => useInfiniteWishlist(Object.assign(Object.assign({}, DEFAULT_PROPS), { initialItems: items, chunkSize: 3 })), { initialProps: { items: THREE_ITEMS_GIDS } });
+            yield act(() => __awaiter(void 0, void 0, void 0, function* () {
+                yield result.current.loadMore();
+            }));
+            expect(result.current.products).toHaveLength(3);
+            rerender({ items: TWO_ITEMS_GIDS });
+            expect(result.current.products).toHaveLength(2);
+            expect(result.current.products.map((p) => p.id)).not.toContain(GID_3);
+            // Products were filtered in-place – no re-fetch
+            expect(global.fetch).toHaveBeenCalledTimes(1);
+        }));
+        it("removes multiple products in-place when several items are removed at once", () => __awaiter(void 0, void 0, void 0, function* () {
+            ;
+            global.fetch.mockResolvedValueOnce({
+                ok: true,
+                json: () => __awaiter(void 0, void 0, void 0, function* () {
+                    return [
+                        makeProduct("1", ["v1", "v2"]),
+                        makeProduct("2", ["v1", "v2"]),
+                        makeProduct("3", ["v1", "v2"]),
+                    ];
+                }),
+            });
+            const { result, rerender } = renderHook(({ items }) => useInfiniteWishlist(Object.assign(Object.assign({}, DEFAULT_PROPS), { initialItems: items, chunkSize: 3 })), { initialProps: { items: THREE_ITEMS_GIDS } });
+            yield act(() => __awaiter(void 0, void 0, void 0, function* () {
+                yield result.current.loadMore();
+            }));
+            expect(result.current.products).toHaveLength(3);
+            rerender({ items: [{ productId: GID_2 }] });
+            expect(result.current.products).toHaveLength(1);
+            expect(result.current.products[0].id).toBe(GID_2);
+            expect(global.fetch).toHaveBeenCalledTimes(1);
+        }));
+        it("recalculates loadedIndex correctly after removal so subsequent loadMore fetches the right next chunk", () => __awaiter(void 0, void 0, void 0, function* () {
+            // Setup: 4 items, chunkSize 2.
+            // Step 1 – load first chunk [GID_1, GID_2], loadedIndex becomes 2.
+            // Step 2 – remove GID_2, new list is [GID_1, GID_3, GID_4].
+            //          newLoadedIndex should be 1 (only GID_1 was in prev[0..1]).
+            // Step 3 – loadMore must fetch [GID_3, GID_4], not re-fetch GID_1.
+            ;
+            global.fetch
+                .mockResolvedValueOnce({
+                ok: true,
+                json: () => __awaiter(void 0, void 0, void 0, function* () {
+                    return [
+                        makeProduct("1", ["v1", "v2"]),
+                        makeProduct("2", ["v1", "v2"]),
+                    ];
+                }),
+            })
+                .mockResolvedValueOnce({
+                ok: true,
+                json: () => __awaiter(void 0, void 0, void 0, function* () {
+                    return [
+                        makeProduct("3", ["v1", "v2"]),
+                        makeProduct("4", ["v1", "v2"]),
+                    ];
+                }),
+            });
+            const { result, rerender } = renderHook(({ items }) => useInfiniteWishlist(Object.assign(Object.assign({}, DEFAULT_PROPS), { initialItems: items, chunkSize: 2 })), { initialProps: { items: FOUR_ITEMS_GIDS } });
+            yield act(() => __awaiter(void 0, void 0, void 0, function* () {
+                yield result.current.loadMore();
+            }));
+            expect(result.current.products).toHaveLength(2);
+            rerender({ items: FOUR_ITEMS_GIDS_NO_2 });
+            expect(result.current.products).toHaveLength(1);
+            expect(result.current.products[0].id).toBe(GID_1);
+            expect(result.current.hasMore).toBe(true);
+            yield act(() => __awaiter(void 0, void 0, void 0, function* () {
+                yield result.current.loadMore();
+            }));
+            expect(global.fetch).toHaveBeenCalledTimes(2);
+            expect(result.current.products).toHaveLength(3);
+            expect(result.current.products.map((p) => p.id)).toContain(GID_3);
+            expect(result.current.products.map((p) => p.id)).toContain(GID_4);
+        }));
+        it("keeps existing products visible and exposes the new item via hasMore when an item is added", () => __awaiter(void 0, void 0, void 0, function* () {
+            ;
+            global.fetch
+                .mockResolvedValueOnce({
+                ok: true,
+                json: () => __awaiter(void 0, void 0, void 0, function* () {
+                    return [
+                        makeProduct("1", ["v1", "v2"]),
+                        makeProduct("2", ["v1", "v2"]),
+                        makeProduct("3", ["v1", "v2"]),
+                    ];
+                }),
+            })
+                .mockResolvedValueOnce({
+                ok: true,
+                json: () => __awaiter(void 0, void 0, void 0, function* () { return [makeProduct("4", ["v1", "v2"])]; }),
+            });
+            const { result, rerender } = renderHook(({ items }) => useInfiniteWishlist(Object.assign(Object.assign({}, DEFAULT_PROPS), { initialItems: items, chunkSize: 3 })), { initialProps: { items: THREE_ITEMS_GIDS } });
+            yield act(() => __awaiter(void 0, void 0, void 0, function* () {
+                yield result.current.loadMore();
+            }));
+            expect(result.current.products).toHaveLength(3);
+            rerender({ items: FOUR_ITEMS_GIDS });
+            // Existing products preserved — no skeleton flash
+            expect(result.current.products).toHaveLength(3);
+            expect(result.current.hasMore).toBe(true);
+            // Fetch the new item
+            yield act(() => __awaiter(void 0, void 0, void 0, function* () {
+                yield result.current.loadMore();
+            }));
+            expect(result.current.products).toHaveLength(4);
+            expect(result.current.products[3].id).toBe(GID_4);
+        }));
+        it("does not create duplicate products when loadMore re-requests an already-loaded ID", () => __awaiter(void 0, void 0, void 0, function* () {
+            ;
+            global.fetch
+                .mockResolvedValueOnce({
+                ok: true,
+                json: () => __awaiter(void 0, void 0, void 0, function* () {
+                    return [
+                        makeProduct("1", ["v1", "v2"]),
+                        makeProduct("2", ["v1", "v2"]),
+                    ];
+                }),
+            })
+                .mockResolvedValueOnce({
+                ok: true,
+                json: () => __awaiter(void 0, void 0, void 0, function* () {
+                    return [
+                        makeProduct("new", ["v1", "v2"]),
+                        makeProduct("1", ["v1", "v2"]),
+                    ];
+                }),
+            });
+            const GID_NEW = "gid://shopify/Product/new";
+            const initialItems = [{ productId: GID_1 }, { productId: GID_2 }];
+            const itemsWithPrepend = [
+                { productId: GID_NEW },
+                { productId: GID_1 },
+                { productId: GID_2 },
+            ];
+            const { result, rerender } = renderHook(({ items }) => useInfiniteWishlist(Object.assign(Object.assign({}, DEFAULT_PROPS), { initialItems: items, chunkSize: 2 })), { initialProps: { items: initialItems } });
+            yield act(() => __awaiter(void 0, void 0, void 0, function* () {
+                yield result.current.loadMore();
+            }));
+            expect(result.current.products).toHaveLength(2);
+            rerender({ items: itemsWithPrepend });
+            expect(result.current.products).toHaveLength(2);
+            yield act(() => __awaiter(void 0, void 0, void 0, function* () {
+                yield result.current.loadMore();
+            }));
+            const ids = result.current.products.map((p) => p.id);
+            const uniqueIds = new Set(ids);
+            expect(uniqueIds.size).toBe(ids.length);
+            expect(ids).toEqual([GID_NEW, GID_1, GID_2]);
+        }));
+        it("performs a full reset when the list is replaced with different items", () => __awaiter(void 0, void 0, void 0, function* () {
+            ;
+            global.fetch.mockResolvedValueOnce({
+                ok: true,
+                json: () => __awaiter(void 0, void 0, void 0, function* () {
+                    return [
+                        makeProduct("1", ["v1", "v2"]),
+                        makeProduct("2", ["v1", "v2"]),
+                    ];
+                }),
+            });
+            const DIFFERENT_ITEMS = [
+                { productId: "10" },
+                { productId: "11" },
+                { productId: "12" },
+            ];
+            const { result, rerender } = renderHook(({ items }) => useInfiniteWishlist(Object.assign(Object.assign({}, DEFAULT_PROPS), { initialItems: items })), { initialProps: { items: TWO_ITEMS } });
+            yield act(() => __awaiter(void 0, void 0, void 0, function* () {
+                yield result.current.loadMore();
+            }));
+            expect(result.current.products).toHaveLength(2);
+            rerender({ items: DIFFERENT_ITEMS });
+            expect(result.current.products).toEqual([]);
+            expect(result.current.hasMore).toBe(true);
+        }));
+    });
+    // ── inView effect ─────────────────────────────────────────────────────────
+    describe("inView intersection observer", () => {
+        it("triggers loadMore when element comes into view and hasMore is true", () => __awaiter(void 0, void 0, void 0, function* () {
+            setupInView(true);
+            global.fetch.mockResolvedValueOnce({
+                ok: true,
+                json: () => __awaiter(void 0, void 0, void 0, function* () {
+                    return [
+                        makeProduct("1", ["v1", "v2"]),
+                        makeProduct("2", ["v1", "v2"]),
+                    ];
+                }),
+            });
+            const { result } = renderHook(() => useInfiniteWishlist(Object.assign(Object.assign({}, DEFAULT_PROPS), { initialItems: TWO_ITEMS, chunkSize: 2 })));
+            yield waitFor(() => {
+                expect(result.current.products).toHaveLength(2);
+            });
+            expect(global.fetch).toHaveBeenCalledTimes(1);
+        }));
+        it("does not trigger loadMore when inView is false", () => __awaiter(void 0, void 0, void 0, function* () {
+            setupInView(false);
+            renderHook(() => useInfiniteWishlist(Object.assign({}, DEFAULT_PROPS)));
+            yield act(() => __awaiter(void 0, void 0, void 0, function* () {
+                yield new Promise((resolve) => setTimeout(resolve, 0));
+            }));
+            expect(global.fetch).not.toHaveBeenCalled();
+        }));
+        it("does not trigger loadMore when inView but no more items", () => __awaiter(void 0, void 0, void 0, function* () {
+            setupInView(true);
+            renderHook(() => useInfiniteWishlist(Object.assign(Object.assign({}, DEFAULT_PROPS), { initialItems: EMPTY_ITEMS })));
+            yield act(() => __awaiter(void 0, void 0, void 0, function* () {
+                yield new Promise((resolve) => setTimeout(resolve, 0));
+            }));
+            expect(global.fetch).not.toHaveBeenCalled();
+        }));
+    });
+    // ── reset ─────────────────────────────────────────────────────────────────
+    describe("reset", () => {
+        it("clears products and resets loadedIndex", () => __awaiter(void 0, void 0, void 0, function* () {
+            ;
+            global.fetch.mockResolvedValueOnce({
+                ok: true,
+                json: () => __awaiter(void 0, void 0, void 0, function* () {
+                    return [
+                        makeProduct("1", ["v1", "v2"]),
+                        makeProduct("2", ["v1", "v2"]),
+                    ];
+                }),
+            });
+            const { result } = renderHook(() => useInfiniteWishlist(Object.assign({}, DEFAULT_PROPS)));
+            yield act(() => __awaiter(void 0, void 0, void 0, function* () {
+                yield result.current.loadMore();
+            }));
+            expect(result.current.products).toHaveLength(2);
+            act(() => {
+                result.current.reset();
+            });
+            expect(result.current.products).toEqual([]);
+            expect(result.current.hasMore).toBe(true);
+        }));
+        it("allows re-fetching from the start after reset", () => __awaiter(void 0, void 0, void 0, function* () {
+            const products = [
+                makeProduct("1", ["v1", "v2"]),
+                makeProduct("2", ["v1", "v2"]),
+            ];
+            global.fetch
+                .mockResolvedValueOnce({ ok: true, json: () => __awaiter(void 0, void 0, void 0, function* () { return products; }) })
+                .mockResolvedValueOnce({ ok: true, json: () => __awaiter(void 0, void 0, void 0, function* () { return products; }) });
+            const { result } = renderHook(() => useInfiniteWishlist(Object.assign(Object.assign({}, DEFAULT_PROPS), { initialItems: TWO_ITEMS, chunkSize: 2 })));
+            yield act(() => __awaiter(void 0, void 0, void 0, function* () {
+                yield result.current.loadMore();
+            }));
+            act(() => {
+                result.current.reset();
+            });
+            yield act(() => __awaiter(void 0, void 0, void 0, function* () {
+                yield result.current.loadMore();
+            }));
+            expect(result.current.products).toHaveLength(2);
+            expect(global.fetch).toHaveBeenCalledTimes(2);
+        }));
+    });
+    // ── useCollection integration ─────────────────────────────────────────────
+    describe("useCollection integration", () => {
+        it("passes correct options to useCollection", () => {
+            renderHook(() => useInfiniteWishlist(Object.assign(Object.assign({}, DEFAULT_PROPS), { shouldMock: true })));
+            expect(mockUseCollection).toHaveBeenCalledWith(expect.objectContaining({
+                apiUrl: DEFAULT_PROPS.apiUrl,
+                appId: "app-123",
+                language: "EN",
+                getCollections: true,
+                limit: 1,
+            }));
+        });
+        it("passes getCollections: false when shouldMock is false", () => {
+            renderHook(() => useInfiniteWishlist(Object.assign(Object.assign({}, DEFAULT_PROPS), { shouldMock: false })));
+            expect(mockUseCollection).toHaveBeenCalledWith(expect.objectContaining({ getCollections: false }));
+        });
+    });
+    describe("API contract and backward compatibility", () => {
+        it("returns all fields so forked blocks do not break", () => {
+            const { result } = renderHook(() => useInfiniteWishlist(Object.assign({}, DEFAULT_PROPS)));
+            expect(result.current).toMatchObject({
+                products: expect.any(Array),
+                isLoading: expect.any(Boolean),
+                isLoadingMore: expect.any(Boolean),
+                error: null,
+                hasMore: expect.any(Boolean),
+                loadMore: expect.any(Function),
+                loadMoreRef: expect.any(Function),
+                reset: expect.any(Function),
+            });
+        });
+        it("products: initial empty array, then fetched product data in order after loadMore", () => __awaiter(void 0, void 0, void 0, function* () {
+            const p1 = makeProduct("1", ["v1", "v2"]);
+            const p2 = makeProduct("2", ["v1", "v2"]);
+            global.fetch.mockResolvedValueOnce({
+                ok: true,
+                json: () => __awaiter(void 0, void 0, void 0, function* () { return [p1, p2]; }),
+            });
+            const { result } = renderHook(() => useInfiniteWishlist(Object.assign({}, DEFAULT_PROPS)));
+            expect(result.current.products).toEqual([]);
+            yield act(() => __awaiter(void 0, void 0, void 0, function* () {
+                yield result.current.loadMore();
+            }));
+            expect(result.current.products).toHaveLength(2);
+            expect(result.current.products[0].id).toBe(p1.id);
+            expect(result.current.products[1].id).toBe(p2.id);
+        }));
+        it("isLoading: true only while first fetch in progress and no products yet", () => __awaiter(void 0, void 0, void 0, function* () {
+            let resolveFetch;
+            const fetchPromise = new Promise((resolve) => {
+                resolveFetch = resolve;
+            });
+            global.fetch.mockReturnValueOnce(fetchPromise);
+            const { result } = renderHook(() => useInfiniteWishlist(Object.assign({}, DEFAULT_PROPS)));
+            expect(result.current.products).toHaveLength(0);
+            act(() => {
+                result.current.loadMore();
+            });
+            expect(result.current.isLoading).toBe(true);
+            expect(result.current.isLoadingMore).toBe(false);
+            yield act(() => __awaiter(void 0, void 0, void 0, function* () {
+                resolveFetch({
+                    ok: true,
+                    json: () => __awaiter(void 0, void 0, void 0, function* () {
+                        return [
+                            makeProduct("1", ["v1", "v2"]),
+                            makeProduct("2", ["v1", "v2"]),
+                        ];
+                    }),
+                });
+                yield fetchPromise;
+            }));
+            expect(result.current.isLoading).toBe(false);
+            expect(result.current.products).toHaveLength(2);
+        }));
+        it("isLoadingMore: true while loading when products already exist", () => __awaiter(void 0, void 0, void 0, function* () {
+            const chunk1 = [
+                makeProduct("1", ["v1", "v2"]),
+                makeProduct("2", ["v1", "v2"]),
+            ];
+            let resolveSecond;
+            const secondPromise = new Promise((resolve) => {
+                resolveSecond = resolve;
+            });
+            global.fetch
+                .mockResolvedValueOnce({ ok: true, json: () => __awaiter(void 0, void 0, void 0, function* () { return chunk1; }) })
+                .mockReturnValueOnce(secondPromise);
+            const { result } = renderHook(() => useInfiniteWishlist(Object.assign({}, DEFAULT_PROPS)));
+            yield act(() => __awaiter(void 0, void 0, void 0, function* () {
+                yield result.current.loadMore();
+            }));
+            expect(result.current.products).toHaveLength(2);
+            act(() => {
+                result.current.loadMore();
+            });
+            expect(result.current.isLoading).toBe(false);
+            expect(result.current.isLoadingMore).toBe(true);
+            yield act(() => __awaiter(void 0, void 0, void 0, function* () {
+                resolveSecond({
+                    ok: true,
+                    json: () => __awaiter(void 0, void 0, void 0, function* () { return [makeProduct("3", ["v1", "v2"])]; }),
+                });
+                yield secondPromise;
+            }));
+            expect(result.current.isLoadingMore).toBe(false);
+            expect(result.current.products).toHaveLength(3);
+        }));
+        it("error: null on success, set when fetch fails", () => __awaiter(void 0, void 0, void 0, function* () {
+            ;
+            global.fetch.mockResolvedValueOnce({
+                ok: false,
+                status: 500,
+            });
+            const { result } = renderHook(() => useInfiniteWishlist(Object.assign({}, DEFAULT_PROPS)));
+            expect(result.current.error).toBeNull();
+            yield act(() => __awaiter(void 0, void 0, void 0, function* () {
+                try {
+                    yield result.current.loadMore();
+                }
+                catch (_a) {
+                    // expected
+                }
+            }));
+            expect(result.current.error).not.toBeNull();
+        }));
+        it("hasMore: true when items remain to load, false when empty or all loaded", () => __awaiter(void 0, void 0, void 0, function* () {
+            const twoProducts = [
+                makeProduct("1", ["v1", "v2"]),
+                makeProduct("2", ["v1", "v2"]),
+            ];
+            global.fetch.mockResolvedValueOnce({
+                ok: true,
+                json: () => __awaiter(void 0, void 0, void 0, function* () { return twoProducts; }),
+            });
+            const empty = renderHook(() => useInfiniteWishlist(Object.assign(Object.assign({}, DEFAULT_PROPS), { initialItems: EMPTY_ITEMS })));
+            expect(empty.result.current.hasMore).toBe(false);
+            const withItems = renderHook(() => useInfiniteWishlist(Object.assign(Object.assign({}, DEFAULT_PROPS), { initialItems: TWO_ITEMS })));
+            expect(withItems.result.current.hasMore).toBe(true);
+            yield act(() => __awaiter(void 0, void 0, void 0, function* () {
+                yield withItems.result.current.loadMore();
+            }));
+            expect(withItems.result.current.hasMore).toBe(false);
+            expect(withItems.result.current.products).toHaveLength(2);
+        }));
+        it("loadMore: fetches next chunk and merges into products in order", () => __awaiter(void 0, void 0, void 0, function* () {
+            const chunk1 = [
+                makeProduct("1", ["v1", "v2"]),
+                makeProduct("2", ["v1", "v2"]),
+            ];
+            const chunk2 = [makeProduct("3", ["v1", "v2"])];
+            global.fetch
+                .mockResolvedValueOnce({ ok: true, json: () => __awaiter(void 0, void 0, void 0, function* () { return chunk1; }) })
+                .mockResolvedValueOnce({ ok: true, json: () => __awaiter(void 0, void 0, void 0, function* () { return chunk2; }) });
+            const { result } = renderHook(() => useInfiniteWishlist(Object.assign({}, DEFAULT_PROPS)));
+            yield act(() => __awaiter(void 0, void 0, void 0, function* () {
+                yield result.current.loadMore();
+            }));
+            expect(result.current.products).toHaveLength(2);
+            yield act(() => __awaiter(void 0, void 0, void 0, function* () {
+                yield result.current.loadMore();
+            }));
+            expect(result.current.products).toHaveLength(3);
+            expect(result.current.products[2].id).toContain("3");
+        }));
+        it("loadMoreRef: stable ref callback for intersection observer", () => {
+            const { result } = renderHook(() => useInfiniteWishlist(Object.assign({}, DEFAULT_PROPS)));
+            expect(typeof result.current.loadMoreRef).toBe("function");
+            expect(() => result.current.loadMoreRef(null)).not.toThrow();
+            expect(() => result.current.loadMoreRef(document.createElement("div"))).not.toThrow();
+        });
+        it("reset: clears products and loaded state, next loadMore fetches from start", () => __awaiter(void 0, void 0, void 0, function* () {
+            const twoProducts = [
+                makeProduct("1", ["v1", "v2"]),
+                makeProduct("2", ["v1", "v2"]),
+            ];
+            global.fetch
+                .mockResolvedValueOnce({ ok: true, json: () => __awaiter(void 0, void 0, void 0, function* () { return twoProducts; }) })
+                .mockResolvedValueOnce({ ok: true, json: () => __awaiter(void 0, void 0, void 0, function* () { return twoProducts; }) });
+            const { result } = renderHook(() => useInfiniteWishlist(Object.assign({}, DEFAULT_PROPS)));
+            yield act(() => __awaiter(void 0, void 0, void 0, function* () {
+                yield result.current.loadMore();
+            }));
+            expect(result.current.products).toHaveLength(2);
+            act(() => {
+                result.current.reset();
+            });
+            expect(result.current.products).toEqual([]);
+            expect(result.current.hasMore).toBe(true);
+            yield act(() => __awaiter(void 0, void 0, void 0, function* () {
+                yield result.current.loadMore();
+            }));
+            expect(result.current.products).toHaveLength(2);
+        }));
+        it("accepts legacy initialProductIds + variantIds and behaves like initialItems", () => __awaiter(void 0, void 0, void 0, function* () {
+            const product1 = makeProduct("1", ["v1", "v2"]);
+            const product2 = makeProduct("2", ["v3"]);
+            global.fetch.mockResolvedValueOnce({
+                ok: true,
+                json: () => __awaiter(void 0, void 0, void 0, function* () { return [product1, product2]; }),
+            });
+            const { result } = renderHook(() => useInfiniteWishlist({
+                chunkSize: 2,
+                apiUrl: DEFAULT_PROPS.apiUrl,
+                shouldMock: false,
+                queryVariables: DEFAULT_PROPS.queryVariables,
+                initialProductIds: ["1", "2"],
+                variantIds: ["v2", "v3"],
+            }));
+            yield act(() => __awaiter(void 0, void 0, void 0, function* () {
+                yield result.current.loadMore();
+            }));
+            expect(result.current.products).toHaveLength(2);
+            expect(result.current.products[0].variants[0].id).toContain("v2");
+            expect(result.current.products[1].variants[0].id).toContain("v3");
+        }));
+    });
+});