@mohasinac/appkit 2.3.2 → 2.4.1

package/dist/features/products/components/ProductsIndexListing.js

@@ -1,25 +1,84 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { useState, useCallback } from "react";
-import { Search, SlidersHorizontal, LayoutGrid, List, X } from "lucide-react";
+import { useState, useCallback, useMemo } from "react";
+import { X, ShoppingCart, Heart, SlidersHorizontal } from "lucide-react";
 import { useRouter } from "next/navigation";
 import { useUrlTable } from "../../../react/hooks/useUrlTable";
 import { useProducts } from "../hooks/useProducts";
-import { Pagination, SortDropdown } from "../../../ui";
+import { Pagination, useToast, BulkActionsBar, ListingToolbar } from "../../../ui";
 import { ROUTES } from "../../../next";
 import { ProductGrid, ProductFilters, PRODUCT_PUBLIC_SORT_OPTIONS } from ".";
-import { useSession } from "../../../react/contexts/SessionContext";
-import { useWishlistWithGuest } from "../../wishlist/hooks/useWishlistWithGuest";
-import { apiClient } from "../../../http";
+import { useGuestCart } from "../../cart/hooks/useGuestCart";
+import { useGuestWishlist } from "../../wishlist/hooks/useGuestWishlist";
+import { pushCartOp, pushWishlistOp } from "../../cart/utils/pending-ops";
+import { useBulkSelection } from "../../../react/hooks/useBulkSelection";
 import { useCategoryTree, categoriesToFacetOptions } from "../../categories/hooks/useCategoryTree";
+const FILTER_KEYS = ["category", "condition", "minPrice", "maxPrice", "brand", "storeId", "freeShipping", "tags"];
 export function ProductsIndexListing({ initialData }) {
     const router = useRouter();
     const table = useUrlTable({ defaults: { pageSize: "24", sort: "-createdAt" } });
+    const { showToast } = useToast();
     const [searchInput, setSearchInput] = useState(table.get("q") || "");
     const [filterOpen, setFilterOpen] = useState(false);
+    const showSold = table.get("showSold") === "true";
     const [view, setView] = useState(table.get("view") || "card");
-    const { user } = useSession();
-    const wl = useWishlistWithGuest(user?.uid ?? null);
+    // Pending filter state — buffered until "Apply Filters" clicked
+    const [pendingFilters, setPendingFilters] = useState(() => Object.fromEntries(FILTER_KEYS.map((k) => [k, table.get(k)])));
+    const pendingTable = useMemo(() => ({
+        get: (key) => pendingFilters[key] ?? "",
+        getNumber: (key, fallback = 0) => {
+            const v = pendingFilters[key];
+            if (!v)
+                return fallback;
+            const n = Number(v);
+            return isNaN(n) ? fallback : n;
+        },
+        set: (key, value) => setPendingFilters((p) => ({ ...p, [key]: value })),
+        setMany: (updates) => setPendingFilters((p) => ({ ...p, ...updates })),
+        clear: (keys) => {
+            const ks = keys ?? FILTER_KEYS;
+            setPendingFilters((p) => ({
+                ...p,
+                ...Object.fromEntries(ks.map((k) => [k, ""])),
+            }));
+        },
+        setPage: (_) => { },
+        setPageSize: (_) => { },
+        setSort: (_) => { },
+        buildSieveParams: () => "",
+        buildSearchParams: () => "",
+        params: new URLSearchParams(),
+    }), [pendingFilters]);
+    const openFilters = useCallback(() => {
+        // Sync pending state from current URL when drawer opens
+        setPendingFilters(Object.fromEntries(FILTER_KEYS.map((k) => [k, table.get(k)])));
+        setFilterOpen(true);
+    }, [table]);
+    const applyFilters = useCallback(() => {
+        const updates = { page: "1" };
+        for (const k of FILTER_KEYS)
+            updates[k] = pendingFilters[k] ?? "";
+        table.setMany(updates);
+        setFilterOpen(false);
+    }, [pendingFilters, table]);
+    const clearFilters = useCallback(() => {
+        setPendingFilters(Object.fromEntries(FILTER_KEYS.map((k) => [k, ""])));
+    }, []);
+    const resetAll = useCallback(() => {
+        const updates = { q: "", sort: "", showSold: "" };
+        for (const k of FILTER_KEYS)
+            updates[k] = "";
+        table.setMany(updates);
+        setSearchInput("");
+    }, [table]);
+    const activeFilterCount = FILTER_KEYS.filter((k) => !!table.get(k)).length;
+    const hasActiveState = !!table.get("q") ||
+        table.get("showSold") === "true" ||
+        table.get("sort") !== "-createdAt" ||
+        activeFilterCount > 0;
+    const localCart = useGuestCart();
+    const localWishlist = useGuestWishlist();
+    const wishlistedIds = new Set(localWishlist.items.filter((i) => i.type === "product").map((i) => i.itemId));
     const { categories } = useCategoryTree();
     const categoryOptions = categoriesToFacetOptions(categories);
     const params = {
@@ -35,8 +94,11 @@ export function ProductsIndexListing({ initialData }) {
         page: table.getNumber("page", 1),
         perPage: table.getNumber("pageSize", 24),
         isAuction: false,
+        isPreOrder: false,
+        status: showSold ? undefined : "published",
     };
-    const { products, total, totalPages, page, isLoading } = useProducts(params, { initialData });
+    const { products, totalPages, page, isLoading } = useProducts(params, { initialData });
+    const selection = useBulkSelection({ items: products, keyExtractor: (p) => p.id });
     const commitSearch = useCallback(() => {
         table.set("q", searchInput.trim());
         table.setPage(1);
@@ -49,43 +111,67 @@ export function ProductsIndexListing({ initialData }) {
         setView(next);
         table.set("view", next);
     };
-    const closeFilters = () => setFilterOpen(false);
-    const handleWishlistToggle = useCallback(async (productId) => {
-        const isWishlisted = wl.wishlistedIds?.has(productId) ?? false;
-        if (wl.isGuest) {
-            const guestWl = wl.guestWishlist;
-            if (isWishlisted)
-                guestWl?.remove(productId, "product");
-            else
-                guestWl?.add(productId, "product");
+    const handleWishlistToggle = useCallback((productId) => {
+        const isWishlisted = wishlistedIds.has(productId);
+        if (isWishlisted) {
+            localWishlist.remove(productId, "product");
+            pushWishlistOp({ op: "remove", itemId: productId, type: "product" });
+            showToast("Removed from wishlist", "info");
         }
         else {
-            if (isWishlisted)
-                await apiClient.delete(`/api/user/wishlist/${productId}`);
-            else
-                await apiClient.post("/api/user/wishlist", { productId });
-        }
-    }, [wl]);
-    const handleAddToCart = useCallback(async (product) => {
-        try {
-            await apiClient.post("/api/cart", { productId: product.id, quantity: 1 });
-        }
-        catch {
-            // silently ignore cart errors on listing page
-        }
-    }, []);
-    const handleBuyNow = useCallback(async (product) => {
-        try {
-            await apiClient.post("/api/cart", { productId: product.id, quantity: 1 });
-        }
-        catch {
-            // silently ignore cart errors; still navigate
+            localWishlist.add(productId, "product");
+            pushWishlistOp({ op: "add", itemId: productId, type: "product" });
+            showToast("Added to wishlist", "success");
         }
-        router.push("/cart");
-    }, [router]);
-    return (_jsxs("div", { className: "min-h-screen", children: [_jsx("div", { className: `sticky top-0 z-20 border-b border-zinc-200 dark:border-slate-700 bg-white/95 dark:bg-slate-900/95 backdrop-blur-sm py-2.5 px-4`, children: _jsxs("div", { className: "flex items-center gap-2.5 max-w-full", children: [_jsxs("button", { type: "button", onClick: () => setFilterOpen(true), className: "flex shrink-0 items-center gap-2 rounded-lg border border-zinc-300 dark:border-slate-600 px-3.5 py-2 text-sm font-medium text-zinc-700 dark:text-zinc-200 hover:bg-zinc-50 dark:hover:bg-slate-800 transition-colors", children: [_jsx(SlidersHorizontal, { className: "h-4 w-4" }), _jsx("span", { className: "hidden sm:inline", children: "Filters" })] }), _jsxs("div", { className: "flex flex-1 items-center overflow-hidden rounded-lg border border-zinc-300 dark:border-slate-600 bg-white dark:bg-slate-900", children: [_jsx("input", { type: "text", value: searchInput, onChange: (e) => setSearchInput(e.target.value), onKeyDown: handleSearchKeyDown, placeholder: "Search products...", className: "min-w-0 flex-1 bg-transparent px-3 py-2 text-sm text-zinc-900 dark:text-zinc-100 placeholder-zinc-400 outline-none" }), _jsx("button", { type: "button", onClick: commitSearch, className: "flex shrink-0 items-center justify-center px-3 py-2 text-zinc-400 hover:text-primary dark:hover:text-primary-400 transition-colors", "aria-label": "Search", children: _jsx(Search, { className: "h-4 w-4" }) })] }), _jsxs("div", { className: "flex shrink-0 items-center gap-1.5 text-sm text-zinc-500 dark:text-zinc-400", children: [_jsx("span", { className: "hidden md:inline whitespace-nowrap", children: "Sort by" }), _jsx(SortDropdown, { value: table.get("sort") || "-createdAt", onChange: (v) => { table.set("sort", v); table.setPage(1); }, options: PRODUCT_PUBLIC_SORT_OPTIONS })] }), _jsxs("div", { className: "flex shrink-0 items-center rounded-lg border border-zinc-300 dark:border-slate-600 overflow-hidden", children: [_jsx("button", { type: "button", onClick: () => handleViewToggle("card"), "aria-label": "Grid view", className: `p-2 transition-colors ${view === "card"
-                                        ? "bg-primary text-white"
-                                        : "text-zinc-500 hover:bg-zinc-50 dark:hover:bg-slate-800 dark:text-zinc-400"}`, children: _jsx(LayoutGrid, { className: "h-4 w-4" }) }), _jsx("button", { type: "button", onClick: () => handleViewToggle("list"), "aria-label": "List view", className: `p-2 transition-colors ${view === "list"
-                                        ? "bg-primary text-white"
-                                        : "text-zinc-500 hover:bg-zinc-50 dark:hover:bg-slate-800 dark:text-zinc-400"}`, children: _jsx(List, { className: "h-4 w-4" }) })] })] }) }), _jsxs("div", { className: "py-6", children: [isLoading ? (_jsx("div", { className: "grid grid-cols-2 sm:grid-cols-3 lg:grid-cols-4 gap-4", children: Array.from({ length: 10 }).map((_, i) => (_jsxs("div", { className: "rounded-xl border border-zinc-100 dark:border-slate-700 overflow-hidden animate-pulse", children: [_jsx("div", { className: "aspect-square bg-zinc-200 dark:bg-slate-700" }), _jsxs("div", { className: "p-3 space-y-2", children: [_jsx("div", { className: "h-3 bg-zinc-200 dark:bg-slate-700 rounded w-3/4" }), _jsx("div", { className: "h-3 bg-zinc-200 dark:bg-slate-700 rounded w-1/2" }), _jsx("div", { className: "h-4 bg-zinc-200 dark:bg-slate-700 rounded w-1/3" })] })] }, i))) })) : (_jsx(ProductGrid, { products: products, getProductHref: (p) => String(ROUTES.PUBLIC.PRODUCT_DETAIL(p.slug || p.id)), view: view, onWishlistToggle: handleWishlistToggle, wishlistedIds: wl.wishlistedIds, onAddToCart: handleAddToCart, onBuyNow: handleBuyNow })), totalPages > 1 && (_jsx("div", { className: "mt-8 flex justify-center", children: _jsx(Pagination, { currentPage: page, totalPages: totalPages, onPageChange: (p) => table.setPage(p) }) }))] }), filterOpen && (_jsxs(_Fragment, { children: [_jsx("div", { className: "fixed inset-0 z-40 bg-black/40", "aria-hidden": "true", onClick: closeFilters }), _jsxs("div", { className: "fixed inset-y-0 left-0 z-50 flex w-80 flex-col bg-white dark:bg-slate-900 shadow-2xl", children: [_jsxs("div", { className: "flex items-center justify-between border-b border-zinc-200 dark:border-slate-700 px-4 py-3.5", children: [_jsxs("span", { className: "flex items-center gap-2 text-base font-semibold text-zinc-900 dark:text-zinc-100", children: [_jsx(SlidersHorizontal, { className: "h-4 w-4" }), "Filters"] }), _jsx("button", { type: "button", onClick: closeFilters, "aria-label": "Close filters", className: "rounded-lg p-1.5 text-zinc-500 hover:bg-zinc-100 dark:hover:bg-slate-800 transition-colors", children: _jsx(X, { className: "h-5 w-5" }) })] }), _jsx("div", { className: "flex-1 overflow-y-auto px-4 py-4", children: _jsx(ProductFilters, { table: table, currencyPrefix: "\u20B9", categoryOptions: categoryOptions }) }), _jsx("div", { className: "border-t border-zinc-200 dark:border-slate-700 px-4 py-3.5", children: _jsx("button", { type: "button", onClick: closeFilters, className: "w-full rounded-lg bg-primary py-2.5 text-sm font-semibold text-white hover:bg-primary-600 transition-colors", children: "Apply filters" }) })] })] }))] }));
+    }, [wishlistedIds, localWishlist, showToast]);
+    const handleAddToCart = useCallback((product) => {
+        localCart.add(product.id, 1, {
+            productTitle: product.title,
+            productImage: product.mainImage,
+            price: product.price,
+        });
+        pushCartOp({ op: "add", productId: product.id, quantity: 1, productTitle: product.title, productImage: product.mainImage, price: product.price });
+        showToast("Added to cart", "success");
+    }, [localCart, showToast]);
+    const handleBuyNow = useCallback((product) => {
+        localCart.add(product.id, 1, {
+            productTitle: product.title,
+            productImage: product.mainImage,
+            price: product.price,
+        });
+        pushCartOp({ op: "add", productId: product.id, quantity: 1, productTitle: product.title, productImage: product.mainImage, price: product.price });
+        router.push(String(ROUTES.USER.CART));
+    }, [localCart, router]);
+    return (_jsxs("div", { className: "min-h-screen", children: [_jsx(ListingToolbar, { filterCount: activeFilterCount, onFiltersClick: openFilters, searchValue: searchInput, searchPlaceholder: "Search products...", onSearchChange: setSearchInput, onSearchCommit: commitSearch, onSearchKeyDown: handleSearchKeyDown, sortValue: table.get("sort") || "-createdAt", sortOptions: PRODUCT_PUBLIC_SORT_OPTIONS, onSortChange: (v) => { table.set("sort", v); table.setPage(1); }, view: view === "card" ? "grid" : "list", onViewChange: (v) => handleViewToggle(v === "grid" ? "card" : "list"), onResetAll: resetAll, hasActiveState: hasActiveState, bulkMode: selection.isSelecting, bulkSelectedCount: selection.selectedCount, bulkTotalCount: products.length, onBulkSelectAll: selection.toggleAll, onBulkClear: selection.clearSelection, extra: _jsxs("label", { className: "flex items-center gap-1.5 cursor-pointer select-none shrink-0", children: [_jsx("span", { className: "hidden sm:inline text-xs text-zinc-600 dark:text-zinc-300 whitespace-nowrap", children: "Show sold" }), _jsx("button", { type: "button", role: "switch", "aria-checked": showSold, onClick: () => table.set("showSold", showSold ? "" : "true"), className: `relative inline-flex h-5 w-9 flex-shrink-0 items-center rounded-full transition-colors duration-200 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary focus-visible:ring-offset-1 ${showSold ? "bg-primary" : "bg-zinc-300 dark:bg-slate-600"}`, children: _jsx("span", { className: `inline-block h-3.5 w-3.5 transform rounded-full bg-white shadow-sm transition-transform duration-200 ${showSold ? "translate-x-[19px]" : "translate-x-[3px]"}` }) })] }) }), totalPages > 1 && (_jsx("div", { className: "sticky top-[calc(var(--header-height,0px)+44px)] z-10 flex justify-center bg-white/95 dark:bg-slate-900/95 backdrop-blur-sm border-b border-zinc-200 dark:border-slate-700 px-3 py-1.5", children: _jsx(Pagination, { currentPage: page, totalPages: totalPages, onPageChange: (p) => table.setPage(p) }) })), _jsx("div", { className: "py-6", children: isLoading ? (_jsx("div", { className: "grid grid-cols-2 sm:grid-cols-3 lg:grid-cols-4 gap-4", children: Array.from({ length: 10 }).map((_, i) => (_jsxs("div", { className: "rounded-xl border border-zinc-100 dark:border-slate-700 overflow-hidden animate-pulse", children: [_jsx("div", { className: "aspect-square bg-zinc-200 dark:bg-slate-700" }), _jsxs("div", { className: "p-3 space-y-2", children: [_jsx("div", { className: "h-3 bg-zinc-200 dark:bg-slate-700 rounded w-3/4" }), _jsx("div", { className: "h-3 bg-zinc-200 dark:bg-slate-700 rounded w-1/2" }), _jsx("div", { className: "h-4 bg-zinc-200 dark:bg-slate-700 rounded w-1/3" })] })] }, i))) })) : (_jsx(ProductGrid, { products: products, getProductHref: (p) => String(ROUTES.PUBLIC.PRODUCT_DETAIL(p.slug || p.id)), view: view, onWishlistToggle: handleWishlistToggle, wishlistedIds: wishlistedIds, onAddToCart: handleAddToCart, onBuyNow: handleBuyNow, selectionMode: selection.isSelecting, selectedIds: selection.selectedIdSet, onToggleSelect: selection.toggle })) }), _jsx(BulkActionsBar, { selectedCount: selection.selectedCount, onClearSelection: selection.clearSelection, actions: [
+                    {
+                        key: "cart",
+                        label: "Add to Cart",
+                        icon: _jsx(ShoppingCart, { className: "h-3.5 w-3.5" }),
+                        variant: "primary",
+                        onClick: () => {
+                            const selected = products.filter((p) => selection.selectedIdSet.has(p.id));
+                            selected.forEach((p) => {
+                                localCart.add(p.id, 1, { productTitle: p.title, productImage: p.mainImage, price: p.price });
+                                pushCartOp({ op: "add", productId: p.id, quantity: 1, productTitle: p.title, productImage: p.mainImage, price: p.price });
+                            });
+                            showToast(`${selected.length} items added to cart`, "success");
+                            selection.clearSelection();
+                        },
+                    },
+                    {
+                        key: "wishlist",
+                        label: "Wishlist",
+                        icon: _jsx(Heart, { className: "h-3.5 w-3.5" }),
+                        variant: "secondary",
+                        onClick: () => {
+                            const selected = products.filter((p) => selection.selectedIdSet.has(p.id));
+                            selected.forEach((p) => {
+                                localWishlist.add(p.id, "product");
+                                pushWishlistOp({ op: "add", itemId: p.id, type: "product" });
+                            });
+                            showToast(`${selected.length} items added to wishlist`, "success");
+                            selection.clearSelection();
+                        },
+                    },
+                ] }), filterOpen && (_jsxs(_Fragment, { children: [_jsx("div", { className: "fixed inset-0 z-40 bg-black/40", "aria-hidden": "true", onClick: () => setFilterOpen(false) }), _jsxs("div", { className: "fixed inset-y-0 left-0 z-50 flex w-80 flex-col bg-white dark:bg-slate-900 shadow-2xl", children: [_jsxs("div", { className: "flex items-center justify-between border-b border-zinc-200 dark:border-slate-700 px-4 py-3.5", children: [_jsxs("span", { className: "flex items-center gap-2 text-base font-semibold text-zinc-900 dark:text-zinc-100", children: [_jsx(SlidersHorizontal, { className: "h-4 w-4" }), "Filters"] }), _jsxs("div", { className: "flex items-center gap-2", children: [activeFilterCount > 0 && (_jsx("button", { type: "button", onClick: clearFilters, className: "text-xs text-zinc-500 hover:text-rose-500 dark:text-zinc-400 transition-colors", children: "Clear all" })), _jsx("button", { type: "button", onClick: () => setFilterOpen(false), "aria-label": "Close filters", className: "rounded-lg p-1.5 text-zinc-500 hover:bg-zinc-100 dark:hover:bg-slate-800 transition-colors", children: _jsx(X, { className: "h-5 w-5" }) })] })] }), _jsx("div", { className: "flex-1 overflow-y-auto px-4 py-4", children: _jsx(ProductFilters, { table: pendingTable, currencyPrefix: "\u20B9", categoryOptions: categoryOptions }) }), _jsx("div", { className: "border-t border-zinc-200 dark:border-slate-700 px-4 py-3.5", children: _jsxs("button", { type: "button", onClick: applyFilters, className: "w-full rounded-lg bg-primary py-2.5 text-sm font-semibold text-white hover:bg-primary-600 transition-colors active:scale-[0.98]", children: ["Apply Filters", activeFilterCount > 0 ? ` (${activeFilterCount})` : ""] }) })] })] }))] }));
 }

package/dist/features/products/components/RelatedProductsCarousel.js

@@ -7,5 +7,5 @@ import { ProductCard } from "./ProductGrid";
 export function RelatedProductsCarousel({ items, title = "You might also like", }) {
     if (items.length === 0)
         return null;
-    return (_jsx(SectionCarousel, { title: title, pillLabel: "Related Products", headingVariant: "editorial", items: items, isLoading: false, perView: THEME_CONSTANTS.carousel.perView.standard, keyExtractor: (item) => item.id, renderItem: (item) => (_jsx(ProductCard, { product: item, href: String(ROUTES.PUBLIC.PRODUCT_DETAIL(item.slug || item.id)) })) }));
+    return (_jsx(SectionCarousel, { title: title, pillLabel: "Related Products", headingVariant: "editorial", items: items, isLoading: false, perView: THEME_CONSTANTS.carousel.perView.standard, keyExtractor: (item) => item.id, renderItem: (item) => (_jsx(ProductCard, { product: item, href: item.slug || item.id ? String(ROUTES.PUBLIC.PRODUCT_DETAIL(item.slug || item.id)) : undefined })) }));
 }

package/dist/features/products/components/ShareButton.d.ts

@@ -0,0 +1,7 @@
+interface ShareButtonProps {
+    title?: string;
+    text?: string;
+    className?: string;
+}
+export declare function ShareButton({ title, text, className }: ShareButtonProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/features/products/components/ShareButton.js

@@ -0,0 +1,22 @@
+"use client";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+import { useState } from "react";
+export function ShareButton({ title, text, className = "" }) {
+    const [copied, setCopied] = useState(false);
+    const handleShare = async () => {
+        const url = window.location.href;
+        if (navigator.share) {
+            try {
+                await navigator.share({ title: title ?? document.title, text, url });
+                return;
+            }
+            catch {
+                // user cancelled or browser blocked — fall through to clipboard
+            }
+        }
+        navigator.clipboard.writeText(url).catch(() => { });
+        setCopied(true);
+        setTimeout(() => setCopied(false), 2000);
+    };
+    return (_jsxs("button", { type: "button", onClick: handleShare, className: `inline-flex items-center gap-1.5 rounded-lg border border-zinc-200 dark:border-zinc-700 px-3 py-1.5 text-sm font-medium text-zinc-700 dark:text-zinc-300 hover:bg-zinc-50 dark:hover:bg-zinc-800 transition-colors ${className}`, "aria-label": "Share this page", children: ["\uD83D\uDD17 ", copied ? "Link Copied!" : "Share"] }));
+}

package/dist/features/products/components/index.d.ts

@@ -30,6 +30,8 @@ export { PlaceBidForm } from "./PlaceBidForm";
 export type { PlaceBidFormProps } from "./PlaceBidForm";
 export { MakeOfferForm } from "./MakeOfferForm";
 export type { MakeOfferFormProps } from "./MakeOfferForm";
+export { MakeOfferButton } from "./MakeOfferButton";
+export type { MakeOfferButtonProps } from "./MakeOfferButton";
 export { RelatedProducts } from "./RelatedProducts";
 export type { RelatedProductsProps } from "./RelatedProducts";
 export { ProductGalleryClient } from "./ProductGalleryClient";

package/dist/features/products/components/index.js

@@ -15,6 +15,7 @@ export { ProductTabs } from "./ProductTabs";
 export { BidHistory } from "./BidHistory";
 export { PlaceBidForm } from "./PlaceBidForm";
 export { MakeOfferForm } from "./MakeOfferForm";
+export { MakeOfferButton } from "./MakeOfferButton";
 export { RelatedProducts } from "./RelatedProducts";
 export { ProductGalleryClient } from "./ProductGalleryClient";
 export { ProductTabsShell } from "./ProductTabsShell";

package/dist/features/products/hooks/useProducts.d.ts

@@ -2,6 +2,12 @@ import type { ProductItem, ProductListResponse, ProductListParams } from "../typ
 interface UseProductsOptions<T extends ProductItem = ProductItem> {
     initialData?: ProductListResponse;
     enabled?: boolean;
+    /**
+     * How long (ms) React Query considers the data fresh before background-refetching.
+     * Defaults to Infinity when `initialData` is supplied (SSR hydration — no refetch
+     * on mount). Callers can override with a lower value if live data is needed.
+     */
+    staleTime?: number;
     /**
      * Map each API item to a richer app-level type.
      * The API always returns `ProductItem`; use this to project it to your own
@@ -26,6 +32,7 @@ export declare function useProducts<T extends ProductItem = ProductItem>(params?
 interface UseProductOptions<T extends ProductItem = ProductItem> {
     initialData?: ProductItem;
     enabled?: boolean;
+    staleTime?: number;
     /**
      * Map the API item to a richer app-level type.
      * @example

package/dist/features/products/hooks/useProducts.js

@@ -23,8 +23,6 @@ export function useProducts(params = {}, opts) {
         sp.set("isAuction", String(params.isAuction));
     if (params.isPreOrder !== undefined)
         sp.set("isPreOrder", String(params.isPreOrder));
-    if (params.sellerId)
-        sp.set("sellerId", params.sellerId);
     if (params.storeId)
         sp.set("storeId", params.storeId);
     if (params.sort)
@@ -43,8 +41,10 @@ export function useProducts(params = {}, opts) {
         sp.set("dateFrom", params.dateFrom);
     if (params.dateTo)
         sp.set("dateTo", params.dateTo);
-    if (params.preOrderStatus)
-        sp.set("preOrderStatus", params.preOrderStatus);
+    if (params.preOrderProductionStatus)
+        sp.set("preOrderProductionStatus", params.preOrderProductionStatus);
+    if (params.brand)
+        sp.set("brand", params.brand);
     if (params.freeShipping !== undefined)
         sp.set("freeShipping", String(params.freeShipping));
     const qs = sp.toString();
@@ -52,6 +52,7 @@ export function useProducts(params = {}, opts) {
         queryKey: ["products", qs],
         queryFn: () => apiClient.get(`${PRODUCT_ENDPOINTS.LIST}${qs ? `?${qs}` : ""}`),
         initialData: opts?.initialData,
+        staleTime: opts?.staleTime ?? (opts?.initialData !== undefined ? Infinity : 0),
         enabled: opts?.enabled,
     });
     const rawItems = query.data?.items ?? [];
@@ -71,6 +72,7 @@ export function useProduct(slug, opts) {
         queryKey: ["products", slug],
         queryFn: () => apiClient.get(PRODUCT_ENDPOINTS.BY_SLUG(slug)),
         initialData: opts?.initialData,
+        staleTime: opts?.staleTime ?? (opts?.initialData !== undefined ? Infinity : 0),
         enabled: opts?.enabled !== false && !!slug,
     });
     const product = query.data && opts?.transform

package/dist/features/products/repository/products.repository.d.ts

@@ -14,7 +14,7 @@ export declare class ProductRepository extends BaseRepository<ProductDocument> {
     protected mapDoc<D = ProductDocument>(snap: DocumentSnapshot): D;
     update(id: string, data: Partial<ProductDocument>): Promise<ProductDocument>;
     create(input: ProductCreateInput): Promise<ProductDocument>;
-    findBySeller(sellerId: string): Promise<ProductDocument[]>;
+    findByStore(storeId: string): Promise<ProductDocument[]>;
     findByStatus(status: ProductStatus): Promise<ProductDocument[]>;
     findFeatured(): Promise<ProductDocument[]>;
     findByCategory(category: string): Promise<ProductDocument[]>;
@@ -29,7 +29,7 @@ export declare class ProductRepository extends BaseRepository<ProductDocument> {
     updateBid(productId: string, bidAmount: number, bidCount: number): Promise<void>;
     findAvailable(): Promise<ProductDocument[]>;
     findActiveAuctions(): Promise<ProductDocument[]>;
-    deleteBySeller(sellerId: string): Promise<number>;
+    deleteByStore(storeId: string): Promise<number>;
     delete(id: string): Promise<void>;
     static readonly SIEVE_FIELDS: {
         id: {
@@ -64,15 +64,11 @@ export declare class ProductRepository extends BaseRepository<ProductDocument> {
             canFilter: boolean;
             canSort: boolean;
         };
-        sellerId: {
-            canFilter: boolean;
-            canSort: boolean;
-        };
         storeId: {
             canFilter: boolean;
             canSort: boolean;
         };
-        sellerName: {
+        storeName: {
             canFilter: boolean;
             canSort: boolean;
         };
@@ -194,7 +190,7 @@ export declare class ProductRepository extends BaseRepository<ProductDocument> {
         };
     };
     list(model: SieveModel, opts?: {
-        sellerId?: string;
+        storeId?: string;
         status?: string;
         categoriesIn?: string[];
     }): Promise<FirebaseSieveResult<ProductDocument>>;

package/dist/features/products/repository/products.repository.js

@@ -2,11 +2,10 @@ import { increment, serverTimestamp } from "../../../contracts/field-ops";
 import { DatabaseError } from "../../../errors";
 import { BaseRepository, prepareForFirestore, } from "../../../providers/db-firebase";
 import { cacheManager } from "../../../core";
-import { decryptPiiFields, encryptPiiFields } from "../../../security";
 import { generateUniqueId, slugify } from "../../../utils";
-import { PRODUCT_COLLECTION, createAuctionId, createPreOrderId, createProductId, ProductStatusValues, } from "../schemas";
+import { PRODUCT_COLLECTION, ProductStatusValues, } from "../schemas";
 const PRODUCT_FIELDS = {
-    SELLER_ID: "sellerId",
+    STORE_ID: "storeId",
     STATUS: "status",
     FEATURED: "featured",
     CATEGORY: "category",
@@ -19,7 +18,6 @@ const PRODUCT_FIELDS = {
     AVAILABLE_QUANTITY: "availableQuantity",
     VIEW_COUNT: "viewCount",
 };
-const PRODUCT_PII_FIELDS = ["sellerName", "sellerEmail"];
 export class ProductRepository extends BaseRepository {
     constructor() {
         super(PRODUCT_COLLECTION);
@@ -56,47 +54,18 @@ export class ProductRepository extends BaseRepository {
         return product;
     }
     mapDoc(snap) {
-        const raw = super.mapDoc(snap);
-        return decryptPiiFields(raw, [
-            ...PRODUCT_PII_FIELDS,
-            "title", // decrypt legacy records where title was encrypted; passthrough if not encrypted
-        ]);
+        return super.mapDoc(snap);
     }
     async update(id, data) {
         this.cacheInvalidateForId(id);
-        const encrypted = encryptPiiFields(data, [...PRODUCT_PII_FIELDS]);
-        const updated = await super.update(id, encrypted);
+        const updated = await super.update(id, data);
         this.cacheSet(updated);
         return updated;
     }
     async create(input) {
-        const id = await generateUniqueId((count) => {
-            if (input.isAuction) {
-                return createAuctionId({
-                    name: input.title,
-                    category: input.category,
-                    condition: "new",
-                    sellerName: input.sellerName,
-                    count,
-                });
-            }
-            if (input.isPreOrder) {
-                return createPreOrderId({
-                    name: input.title,
-                    category: input.category,
-                    condition: "new",
-                    sellerName: input.sellerName,
-                    count,
-                });
-            }
-            return createProductId({
-                name: input.title,
-                category: input.category,
-                condition: "new",
-                sellerName: input.sellerName,
-                count,
-            });
-        }, async (candidateId) => {
+        // Slug = document ID: derive slug from title first, then ensure uniqueness.
+        const baseSlug = input.slug || slugify(input.title);
+        const id = await generateUniqueId((count) => (count === 0 ? baseSlug : `${baseSlug}-${count}`), async (candidateId) => {
             try {
                 const doc = await this.findById(candidateId);
                 return !!doc;
@@ -107,22 +76,21 @@ export class ProductRepository extends BaseRepository {
         });
         const productData = {
             ...input,
-            slug: input.slug || `${slugify(input.title)}-${Date.now()}`,
+            slug: id,
             availableQuantity: input.stockQuantity,
             createdAt: new Date(),
             updatedAt: new Date(),
         };
-        const encrypted = encryptPiiFields(productData, [...PRODUCT_PII_FIELDS]);
         await this.db
             .collection(this.collection)
             .doc(id)
-            .set(prepareForFirestore(encrypted));
+            .set(prepareForFirestore(productData));
         const created = { id, ...productData };
         this.cacheSet(created);
         return created;
     }
-    async findBySeller(sellerId) {
-        return this.findBy(PRODUCT_FIELDS.SELLER_ID, sellerId);
+    async findByStore(storeId) {
+        return this.findBy(PRODUCT_FIELDS.STORE_ID, storeId);
     }
     async findByStatus(status) {
         return this.findBy(PRODUCT_FIELDS.STATUS, status);
@@ -203,10 +171,10 @@ export class ProductRepository extends BaseRepository {
             .get();
         return snapshot.docs.map((doc) => this.mapDoc(doc));
     }
-    async deleteBySeller(sellerId) {
+    async deleteByStore(storeId) {
         try {
             const snapshot = await this.getCollection()
-                .where(PRODUCT_FIELDS.SELLER_ID, "==", sellerId)
+                .where(PRODUCT_FIELDS.STORE_ID, "==", storeId)
                 .get();
             if (snapshot.empty)
                 return 0;
@@ -216,7 +184,7 @@ export class ProductRepository extends BaseRepository {
             return snapshot.size;
         }
         catch (error) {
-            throw new DatabaseError(`Failed to delete products for seller: ${sellerId}`, error);
+            throw new DatabaseError(`Failed to delete products for store: ${storeId}`, error);
         }
     }
     async delete(id) {
@@ -228,8 +196,8 @@ export class ProductRepository extends BaseRepository {
         if (opts?.status) {
             baseQuery = baseQuery.where(PRODUCT_FIELDS.STATUS, "==", opts.status);
         }
-        if (opts?.sellerId) {
-            baseQuery = baseQuery.where(PRODUCT_FIELDS.SELLER_ID, "==", opts.sellerId);
+        if (opts?.storeId) {
+            baseQuery = baseQuery.where(PRODUCT_FIELDS.STORE_ID, "==", opts.storeId);
         }
         if (opts?.categoriesIn && opts.categoriesIn.length > 0) {
             baseQuery = baseQuery.where(PRODUCT_FIELDS.CATEGORY, "in", opts.categoriesIn);
@@ -313,9 +281,8 @@ ProductRepository.SIEVE_FIELDS = {
     brand: { canFilter: true, canSort: true },
     condition: { canFilter: true, canSort: false },
     status: { canFilter: true, canSort: true },
-    sellerId: { canFilter: true, canSort: false },
     storeId: { canFilter: true, canSort: false },
-    sellerName: { canFilter: true, canSort: true },
+    storeName: { canFilter: true, canSort: true },
     featured: { canFilter: true, canSort: false },
     isAuction: { canFilter: true, canSort: false },
     isPreOrder: { canFilter: true, canSort: false },

package/dist/features/products/schemas/firestore.d.ts

@@ -24,8 +24,10 @@ export interface ProductDocument {
     seoDescription?: string;
     seoKeywords?: string[];
     category: string;
+    categoryName?: string;
     subcategory?: string;
     brand?: string;
+    brandSlug?: string;
     price: number;
     currency: string;
     stockQuantity: number;
@@ -34,17 +36,15 @@ export interface ProductDocument {
     images: string[];
     video?: ProductVideoField;
     status: ProductStatus;
-    sellerId: string;
-    storeId?: string;
-    sellerName: string;
-    sellerEmail: string;
+    storeId: string;
+    storeName?: string;
     featured: boolean;
     tags: string[];
     specifications?: ProductSpecification[];
     features?: string[];
     shippingInfo?: string;
     returnPolicy?: string;
-    condition?: "new" | "used" | "refurbished" | "broken";
+    condition?: "new" | "used" | "refurbished" | "broken" | "graded";
     insurance?: boolean;
     insuranceCost?: number;
     shippingPaidBy?: "seller" | "buyer";
@@ -69,6 +69,8 @@ export interface ProductDocument {
     preOrderProductionStatus?: "upcoming" | "in_production" | "ready_to_ship";
     preOrderCancellable?: boolean;
     isPromoted?: boolean;
+    isOnSale?: boolean;
+    isSold?: boolean;
     promotionEndDate?: Date;
     pickupAddressId?: string;
     viewCount?: number;
@@ -95,15 +97,15 @@ export declare const ProductStatusValues: {
     readonly DISCONTINUED: "discontinued";
 };
 export declare const PRODUCT_COLLECTION: "products";
-export declare const PRODUCT_INDEXED_FIELDS: readonly ["sellerId", "status", "category", "featured", "isAuction", "isPreOrder", "isPromoted", "createdAt"];
+export declare const PRODUCT_INDEXED_FIELDS: readonly ["storeId", "status", "category", "featured", "isAuction", "isPreOrder", "isPromoted", "isOnSale", "isSold", "createdAt"];
 export declare const DEFAULT_PRODUCT_DATA: Partial<ProductDocument>;
-export declare const PRODUCT_PUBLIC_FIELDS: readonly ["id", "title", "description", "category", "subcategory", "brand", "price", "currency", "stockQuantity", "availableQuantity", "images", "status", "sellerName", "featured", "tags", "specifications", "features", "shippingInfo", "returnPolicy", "isAuction", "auctionEndDate", "startingBid", "currentBid", "bidCount", "reservePrice", "buyNowPrice", "minBidIncrement", "autoExtendable", "auctionExtensionMinutes", "auctionShippingPaidBy", "isPreOrder", "preOrderDeliveryDate", "preOrderDepositPercent", "preOrderDepositAmount", "preOrderMaxQuantity", "preOrderCurrentCount", "preOrderProductionStatus", "preOrderCancellable", "condition", "insurance", "insuranceCost", "shippingPaidBy", "isPromoted", "slug", "seoTitle", "seoDescription", "seoKeywords", "viewCount", "createdAt"];
-export declare const PRODUCT_UPDATABLE_FIELDS: readonly ["title", "description", "category", "subcategory", "brand", "price", "stockQuantity", "images", "status", "tags", "specifications", "features", "shippingInfo", "returnPolicy", "pickupAddressId", "condition", "insurance", "shippingPaidBy", "autoExtendable", "auctionExtensionMinutes", "auctionShippingPaidBy", "reservePrice", "buyNowPrice", "minBidIncrement", "isPreOrder", "preOrderDeliveryDate", "preOrderDepositPercent", "preOrderDepositAmount", "preOrderMaxQuantity", "preOrderProductionStatus", "preOrderCancellable", "seoTitle", "seoDescription", "seoKeywords"];
+export declare const PRODUCT_PUBLIC_FIELDS: readonly ["id", "title", "description", "category", "subcategory", "brand", "price", "currency", "stockQuantity", "availableQuantity", "images", "status", "storeName", "featured", "tags", "specifications", "features", "shippingInfo", "returnPolicy", "isAuction", "auctionEndDate", "startingBid", "currentBid", "bidCount", "reservePrice", "buyNowPrice", "minBidIncrement", "autoExtendable", "auctionExtensionMinutes", "auctionShippingPaidBy", "isPreOrder", "preOrderDeliveryDate", "preOrderDepositPercent", "preOrderDepositAmount", "preOrderMaxQuantity", "preOrderCurrentCount", "preOrderProductionStatus", "preOrderCancellable", "condition", "insurance", "insuranceCost", "shippingPaidBy", "isPromoted", "isOnSale", "isSold", "slug", "seoTitle", "seoDescription", "seoKeywords", "viewCount", "createdAt"];
+export declare const PRODUCT_UPDATABLE_FIELDS: readonly ["title", "description", "category", "subcategory", "brand", "price", "stockQuantity", "images", "status", "tags", "specifications", "features", "shippingInfo", "returnPolicy", "pickupAddressId", "condition", "insurance", "shippingPaidBy", "autoExtendable", "auctionExtensionMinutes", "auctionShippingPaidBy", "reservePrice", "buyNowPrice", "minBidIncrement", "isPreOrder", "preOrderDeliveryDate", "preOrderDepositPercent", "preOrderDepositAmount", "preOrderMaxQuantity", "preOrderProductionStatus", "preOrderCancellable", "isOnSale", "isSold", "seoTitle", "seoDescription", "seoKeywords"];
 export type ProductCreateInput = Omit<ProductDocument, "id" | "createdAt" | "updatedAt" | "availableQuantity" | "bidCount" | "currentBid" | "auctionOriginalEndDate">;
 export type ProductUpdateInput = Partial<Pick<ProductDocument, (typeof PRODUCT_UPDATABLE_FIELDS)[number]>>;
 export type ProductAdminUpdateInput = Partial<Omit<ProductDocument, "id" | "createdAt">>;
 export declare const productQueryHelpers: {
-    readonly bySeller: (sellerId: string) => readonly ["sellerId", "==", string];
+    readonly byStore: (storeId: string) => readonly ["storeId", "==", string];
     readonly byStatus: (status: ProductStatus) => readonly ["status", "==", ProductStatus];
     readonly byCategory: (category: string) => readonly ["category", "==", string];
     readonly featured: () => readonly ["featured", "==", true];