@mohasinac/appkit 2.7.26 → 2.7.30

package/dist/features/categories/components/CategoryDetailPageView.js

@@ -2,7 +2,7 @@ import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-run
 import Link from "next/link";
 import { categoriesRepository, productRepository, } from "../../../repositories";
 import { ROUTES } from "../../../next";
-import { Container, Main, Section } from "../../../ui";
+import { Container, Heading, Main, Section, Text } from "../../../ui";
 import { CategoryDetailTabs } from "./CategoryDetailTabs";
 export async function CategoryDetailPageView({ slug }) {
     const category = await categoriesRepository
@@ -68,7 +68,7 @@ export async function CategoryDetailPageView({ slug }) {
     const totalCount = productCount + auctionCount + preOrderCount + prizeDrawCount + bundleCount;
     const coverImage = category?.display?.coverImage;
     const hasCover = Boolean(coverImage);
-    return (_jsxs(Main, { children: [_jsxs("section", { className: `relative overflow-hidden ${hasCover ? "min-h-[220px] md:min-h-[280px]" : "bg-zinc-50 dark:bg-zinc-900"}`, children: [hasCover && (_jsxs(_Fragment, { children: [_jsx("div", { className: "absolute inset-0 bg-center bg-cover", style: { backgroundImage: `url(${coverImage})` } }), _jsx("div", { className: "absolute inset-0 bg-black/55" })] })), _jsxs("div", { className: `relative z-10 max-w-7xl mx-auto px-4 ${hasCover ? "py-12" : "py-8"}`, children: [_jsxs("nav", { className: "flex items-center gap-1.5 text-sm mb-4", "aria-label": "Breadcrumb", children: [_jsx(Link, { href: String(ROUTES.HOME), className: hasCover ? "text-white/70 hover:text-white transition-colors" : "text-zinc-500 hover:text-primary-600 transition-colors", children: "Home" }), _jsx("span", { className: hasCover ? "text-white/40" : "text-zinc-400", children: "/" }), _jsx(Link, { href: String(ROUTES.PUBLIC.CATEGORIES), className: hasCover ? "text-white/70 hover:text-white transition-colors" : "text-zinc-500 hover:text-primary-600 transition-colors", children: "Categories" }), _jsx("span", { className: hasCover ? "text-white/40" : "text-zinc-400", children: "/" }), _jsx("span", { className: hasCover ? "text-white font-medium" : "text-zinc-900 dark:text-zinc-100 font-medium", children: category?.name ?? slug })] }), _jsx("h1", { className: `text-3xl md:text-4xl font-bold mb-2 ${hasCover ? "text-white" : "text-zinc-900 dark:text-zinc-50"}`, children: category?.name ?? slug }), category?.description && typeof category.description === "string" && !category.description.startsWith("{") && (_jsx("p", { className: `text-base max-w-2xl mb-4 ${hasCover ? "text-white/80" : "text-zinc-600 dark:text-zinc-400"}`, children: category.description })), _jsxs("div", { className: "flex flex-wrap gap-2", children: [productCount > 0 && (_jsxs("span", { className: `inline-flex items-center gap-1 text-xs font-medium px-2.5 py-1 rounded-full ${hasCover ? "bg-white/20 text-white backdrop-blur-sm" : "bg-primary/10 text-primary-700 dark:text-primary-400"}`, children: [productCount.toLocaleString(), " ", productCount === 1 ? "product" : "products"] })), auctionCount > 0 && (_jsxs("span", { className: `inline-flex items-center gap-1 text-xs font-medium px-2.5 py-1 rounded-full ${hasCover ? "bg-white/20 text-white backdrop-blur-sm" : "bg-amber-100 text-amber-700 dark:bg-amber-900/30 dark:text-amber-400"}`, children: [auctionCount.toLocaleString(), " ", auctionCount === 1 ? "auction" : "auctions"] })), preOrderCount > 0 && (_jsxs("span", { className: `inline-flex items-center gap-1 text-xs font-medium px-2.5 py-1 rounded-full ${hasCover ? "bg-white/20 text-white backdrop-blur-sm" : "bg-violet-100 text-violet-700 dark:bg-violet-900/30 dark:text-violet-400"}`, children: [preOrderCount.toLocaleString(), " ", preOrderCount === 1 ? "pre-order" : "pre-orders"] }))] })] })] }), childCategories.length > 0 && (_jsx("section", { className: "border-b border-zinc-100 dark:border-zinc-800 bg-white dark:bg-zinc-900", children: _jsx("div", { className: "max-w-7xl mx-auto px-4 py-3", children: _jsx("div", { className: "flex gap-2.5 overflow-x-auto pb-1", style: { scrollbarWidth: "none" }, children: childCategories.map((child) => (_jsxs(Link, { href: String(ROUTES.PUBLIC.CATEGORY_DETAIL(child.slug)), className: "flex-shrink-0 flex items-center gap-1.5 rounded-full border border-zinc-200 dark:border-zinc-700 bg-zinc-50 dark:bg-zinc-800 px-4 py-1.5 text-sm font-medium text-zinc-700 dark:text-zinc-200 hover:border-primary hover:text-primary transition-colors whitespace-nowrap", children: [child.display?.icon && (_jsx("span", { className: "text-base leading-none", children: child.display.icon })), child.name, (child.metrics?.productCount ?? 0) > 0 && (_jsx("span", { className: "text-xs text-zinc-400 dark:text-zinc-500", children: (child.metrics?.productCount ?? 0).toLocaleString() }))] }, child.id))) }) }) })), _jsx(Section, { className: "py-6", children: _jsx(Container, { size: "xl", children: _jsx(CategoryDetailTabs, { categorySlug: slug, categoryId: category?.id, initialProductsData: productsResult ?? undefined, initialBundles: bundlesResult ?? [], counts: {
+    return (_jsxs(Main, { children: [_jsxs(Section, { className: `relative overflow-hidden ${hasCover ? "min-h-[220px] md:min-h-[280px]" : "bg-zinc-50 dark:bg-zinc-900"}`, children: [hasCover && (_jsxs(_Fragment, { children: [_jsx("div", { className: "absolute inset-0 bg-center bg-cover", style: { backgroundImage: `url(${coverImage})` } }), _jsx("div", { className: "absolute inset-0 bg-black/55" })] })), _jsxs("div", { className: `relative z-10 max-w-7xl mx-auto px-4 ${hasCover ? "py-12" : "py-8"}`, children: [_jsxs("nav", { className: "flex items-center gap-1.5 text-sm mb-4", "aria-label": "Breadcrumb", children: [_jsx(Link, { href: String(ROUTES.HOME), className: hasCover ? "text-white/70 hover:text-white transition-colors" : "text-zinc-500 hover:text-primary-600 transition-colors", children: "Home" }), _jsx("span", { className: hasCover ? "text-white/40" : "text-zinc-400", children: "/" }), _jsx(Link, { href: String(ROUTES.PUBLIC.CATEGORIES), className: hasCover ? "text-white/70 hover:text-white transition-colors" : "text-zinc-500 hover:text-primary-600 transition-colors", children: "Categories" }), _jsx("span", { className: hasCover ? "text-white/40" : "text-zinc-400", children: "/" }), _jsx("span", { className: hasCover ? "text-white font-medium" : "text-zinc-900 dark:text-zinc-100 font-medium", children: category?.name ?? slug })] }), _jsx(Heading, { level: 1, className: `text-3xl md:text-4xl font-bold mb-2 ${hasCover ? "text-white" : "text-zinc-900 dark:text-zinc-50"}`, children: category?.name ?? slug }), category?.description && typeof category.description === "string" && !category.description.startsWith("{") && (_jsx(Text, { className: `text-base max-w-2xl mb-4 ${hasCover ? "text-white/80" : "text-zinc-600 dark:text-zinc-400"}`, children: category.description })), _jsxs("div", { className: "flex flex-wrap gap-2", children: [productCount > 0 && (_jsxs("span", { className: `inline-flex items-center gap-1 text-xs font-medium px-2.5 py-1 rounded-full ${hasCover ? "bg-white/20 text-white backdrop-blur-sm" : "bg-primary/10 text-primary-700 dark:text-primary-400"}`, children: [productCount.toLocaleString(), " ", productCount === 1 ? "product" : "products"] })), auctionCount > 0 && (_jsxs("span", { className: `inline-flex items-center gap-1 text-xs font-medium px-2.5 py-1 rounded-full ${hasCover ? "bg-white/20 text-white backdrop-blur-sm" : "bg-amber-100 text-amber-700 dark:bg-amber-900/30 dark:text-amber-400"}`, children: [auctionCount.toLocaleString(), " ", auctionCount === 1 ? "auction" : "auctions"] })), preOrderCount > 0 && (_jsxs("span", { className: `inline-flex items-center gap-1 text-xs font-medium px-2.5 py-1 rounded-full ${hasCover ? "bg-white/20 text-white backdrop-blur-sm" : "bg-violet-100 text-violet-700 dark:bg-violet-900/30 dark:text-violet-400"}`, children: [preOrderCount.toLocaleString(), " ", preOrderCount === 1 ? "pre-order" : "pre-orders"] }))] })] })] }), childCategories.length > 0 && (_jsx(Section, { className: "border-b border-zinc-100 dark:border-zinc-800 bg-white dark:bg-zinc-900", children: _jsx("div", { className: "max-w-7xl mx-auto px-4 py-3", children: _jsx("div", { className: "flex gap-2.5 overflow-x-auto pb-1", style: { scrollbarWidth: "none" }, children: childCategories.map((child) => (_jsxs(Link, { href: String(ROUTES.PUBLIC.CATEGORY_DETAIL(child.slug)), className: "flex-shrink-0 flex items-center gap-1.5 rounded-full border border-zinc-200 dark:border-zinc-700 bg-zinc-50 dark:bg-zinc-800 px-4 py-1.5 text-sm font-medium text-zinc-700 dark:text-zinc-200 hover:border-primary hover:text-primary transition-colors whitespace-nowrap", children: [child.display?.icon && (_jsx("span", { className: "text-base leading-none", children: child.display.icon })), child.name, (child.metrics?.productCount ?? 0) > 0 && (_jsx("span", { className: "text-xs text-zinc-400 dark:text-zinc-500", children: (child.metrics?.productCount ?? 0).toLocaleString() }))] }, child.id))) }) }) })), _jsx(Section, { className: "py-6", children: _jsx(Container, { size: "xl", children: _jsx(CategoryDetailTabs, { categorySlug: slug, categoryId: category?.id, initialProductsData: productsResult ?? undefined, initialBundles: bundlesResult ?? [], counts: {
                             products: productCount,
                             auctions: auctionCount,
                             preOrders: preOrderCount,

package/dist/features/categories/components/CategoryDetailTabs.js

@@ -1,5 +1,5 @@
 "use client";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import { useState } from "react";
 import { CategoryProductsListing } from "./CategoryProductsListing";
 import { AuctionsIndexListing } from "../../products/components/AuctionsIndexListing";
@@ -30,7 +30,7 @@ export function CategoryDetailTabs({ categorySlug, categoryId, initialProductsDa
                 return undefined;
         }
     };
-    return (_jsxs("div", { children: [_jsx("div", { className: "flex border-b border-zinc-200 dark:border-slate-700 mb-6 overflow-x-auto", children: CATEGORY_PAGE_TABS.map((t) => (_jsx("button", { type: "button", onClick: () => setActiveTab(t.id), className: `px-5 py-2.5 text-sm font-medium whitespace-nowrap transition-colors -mb-px border-b-2 ${activeTab === t.id
+    return (_jsxs(_Fragment, { children: [_jsx("div", { className: "flex border-b border-zinc-200 dark:border-slate-700 mb-6 overflow-x-auto", children: CATEGORY_PAGE_TABS.map((t) => (_jsx("button", { type: "button", onClick: () => setActiveTab(t.id), className: `px-5 py-2.5 text-sm font-medium whitespace-nowrap transition-colors -mb-px border-b-2 ${activeTab === t.id
                         ? "border-primary text-primary"
                         : "border-transparent text-zinc-500 hover:text-zinc-900 dark:hover:text-zinc-100"}`, children: tabLabel(t.label, countFor(t.id)) }, t.id))) }), activeTab === "products" && (_jsx(CategoryProductsListing, { categorySlug: categorySlug, categoryId: categoryId, initialData: initialProductsData })), activeTab === "auctions" && (_jsx(AuctionsIndexListing, { categorySlug: categorySlug })), activeTab === "pre-orders" && (_jsx(PreOrdersIndexListing, { categorySlug: categorySlug })), activeTab === "prize-draws" && (_jsx(PrizeDrawsIndexListing, { categorySlug: categorySlug })), activeTab === "bundles" && (_jsx(CategoryBundlesListing, { initialBundles: initialBundles }))] }));
 }

package/dist/features/categories/components/CategoryProductsListing.js

@@ -1,19 +1,27 @@
 "use client";
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useState, useCallback } from "react";
-import { Search, SlidersHorizontal, LayoutGrid, List, X } from "lucide-react";
 import { useUrlTable } from "../../../react/hooks/useUrlTable";
+import { usePendingTable } from "../../../react/hooks/usePendingTable";
 import { useProducts } from "../../products/hooks/useProducts";
-import { Pagination, SortDropdown, useToast, LoginRequiredModal } from "../../../ui";
+import { Pagination, useToast, ListingToolbar, FilterDrawer, LoginRequiredModal, } from "../../../ui";
 import { useAuthGate } from "../../../react/hooks/useAuthGate";
 import { ACTION_ID } from "../../products/constants/action-defs";
 import { ROUTES } from "../../../next";
 import { ProductGrid } from "../../products/components/ProductGrid";
-import { ProductFilters } from "../../products/components/ProductFilters";
-import { PRODUCT_PUBLIC_SORT_OPTIONS } from "../../products/components/ProductFilters";
+import { ProductFilters, PRODUCT_PUBLIC_SORT_OPTIONS } from "../../products/components/ProductFilters";
 import { useGuestCart } from "../../cart/hooks/useGuestCart";
 import { useGuestWishlist } from "../../wishlist/hooks/useGuestWishlist";
 import { pushCartOp, pushWishlistOp } from "../../cart/utils/pending-ops";
+const FILTER_KEYS = ["condition", "brand", "minPrice", "maxPrice"];
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+function renderCategoryProductGrid(props) {
+    const { isLoading, products, view, getProductHref, onWishlistToggle, wishlistedIds, onAddToCart } = props;
+    if (isLoading) {
+        return (_jsx("div", { className: "grid grid-cols-2 sm:grid-cols-3 lg:grid-cols-4 gap-6", children: Array.from({ length: 8 }).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))) }));
+    }
+    return (_jsx(ProductGrid, { products: products, getProductHref: getProductHref, view: view, emptyLabel: "No products found in this category.", onWishlistToggle: onWishlistToggle, wishlistedIds: wishlistedIds, onAddToCart: onAddToCart }));
+}
 export function CategoryProductsListing({ categorySlug, categoryId, brandName, initialData, }) {
     const table = useUrlTable({ defaults: { pageSize: "24", sort: "-createdAt" } });
     const { showToast } = useToast();
@@ -24,6 +32,7 @@ export function CategoryProductsListing({ categorySlug, categoryId, brandName, i
     const localCart = useGuestCart();
     const localWishlist = useGuestWishlist();
     const wishlistedIds = new Set(localWishlist.items.filter((i) => i.type === "product").map((i) => i.itemId));
+    const { pendingTable, filterActiveCount, onFilterApply, onFilterClear, onFilterReset } = usePendingTable(table, FILTER_KEYS);
     const params = {
         q: table.get("q") || undefined,
         category: categoryId || undefined,
@@ -36,11 +45,32 @@ export function CategoryProductsListing({ categorySlug, categoryId, brandName, i
         perPage: table.getNumber("pageSize", 24),
         listingType: "standard",
     };
-    const { products, total, totalPages, page, isLoading } = useProducts(params, { initialData });
+    const { products, totalPages, page, isLoading } = useProducts(params, { initialData });
     const commitSearch = useCallback(() => {
         table.set("q", searchInput.trim());
         table.setPage(1);
     }, [searchInput, table]);
+    const openFilters = useCallback(() => {
+        onFilterReset();
+        setFilterOpen(true);
+    }, [onFilterReset]);
+    const applyFilters = useCallback(() => {
+        onFilterApply();
+        setFilterOpen(false);
+    }, [onFilterApply]);
+    const handleViewToggle = (next) => {
+        setView(next);
+        table.set("view", next);
+    };
+    const resetAll = useCallback(() => {
+        table.setMany({ q: "", sort: "" });
+        onFilterClear();
+        setSearchInput("");
+    }, [table, onFilterClear]);
+    const activeFilterCount = FILTER_KEYS.filter((k) => !!table.get(k)).length;
+    const hasActiveState = !!table.get("q") ||
+        table.get("sort") !== "-createdAt" ||
+        activeFilterCount > 0;
     const handleWishlistToggle = useCallback((productId) => {
         const isWishlisted = wishlistedIds.has(productId);
         requireAuth(isWishlisted ? ACTION_ID.REMOVE_FROM_WISHLIST : ACTION_ID.ADD_TO_WISHLIST, () => {
@@ -62,13 +92,22 @@ export function CategoryProductsListing({ categorySlug, categoryId, brandName, i
             productImage: product.mainImage,
             price: product.price,
         });
-        pushCartOp({ op: "add", productId: product.id, quantity: 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 handleViewToggle = (next) => {
-        setView(next);
-        table.set("view", next);
-    };
-    const closeFilters = () => setFilterOpen(false);
-    return (_jsxs("div", { className: "min-h-[200px]", children: [_jsx("div", { className: "sticky top-[var(--header-height,0px)] 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: (e) => e.key === "Enter" && commitSearch(), placeholder: `Search in ${categorySlug.replace(/-/g, " ")}...`, 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); }, 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-6", children: Array.from({ length: 8 }).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, emptyLabel: "No products found in this category.", onWishlistToggle: handleWishlistToggle, wishlistedIds: wishlistedIds, onAddToCart: handleAddToCart })), 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" }) }), _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" }) })] })] })), _jsx(LoginRequiredModal, { isOpen: modalOpen, onClose: closeModal, message: modalMessage })] }));
+    return (_jsxs("div", { className: "min-h-[200px]", children: [_jsx(ListingToolbar, { filterCount: filterActiveCount, onFiltersClick: openFilters, searchValue: searchInput, searchPlaceholder: `Search in ${categorySlug.replace(/-/g, " ")}...`, onSearchChange: setSearchInput, onSearchCommit: commitSearch, sortValue: table.get("sort") || "-createdAt", sortOptions: PRODUCT_PUBLIC_SORT_OPTIONS, onSortChange: (v) => {
+                    table.set("sort", v);
+                }, view: view === "card" ? "grid" : "list", onViewChange: (v) => handleViewToggle(v === "grid" ? "card" : "list"), onResetAll: resetAll, hasActiveState: hasActiveState }), 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: renderCategoryProductGrid({
+                    isLoading, products: products, view,
+                    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+                    getProductHref: (p) => String(ROUTES.PUBLIC.PRODUCT_DETAIL(p.slug || p.id)),
+                    onWishlistToggle: handleWishlistToggle, wishlistedIds, onAddToCart: handleAddToCart,
+                }) }), _jsx(FilterDrawer, { open: filterOpen, onOpen: openFilters, onClose: () => setFilterOpen(false), onApply: applyFilters, onReset: onFilterClear, activeCount: filterActiveCount, hideTrigger: true, children: _jsx(ProductFilters, { table: pendingTable, currencyPrefix: "\u20B9" }) }), _jsx(LoginRequiredModal, { isOpen: modalOpen, onClose: closeModal, message: modalMessage })] }));
 }

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

@@ -30,6 +30,8 @@ export { BundleBuyNowCta } from "./BundleBuyNowCta";
 export type { BundleBuyNowCtaProps } from "./BundleBuyNowCta";
 export { BundleDynamicRuleEditor } from "./BundleDynamicRuleEditor";
 export type { BundleDynamicRuleEditorProps } from "./BundleDynamicRuleEditor";
+export { BundleCollage } from "./BundleCollage";
+export type { BundleCollageProps } from "./BundleCollage";
 export { BundleItemsPicker, defaultBundleItemsFetch, } from "./BundleItemsPicker";
 export type { BundleItemsPickerProps, BundleItemSearchResult, } from "./BundleItemsPicker";
 export { CategoryBundlesListing } from "./CategoryBundlesListing";

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

@@ -17,6 +17,7 @@ export { CategoryDetailTabs } from "./CategoryDetailTabs";
 export { BundleBuyNowCta } from "./BundleBuyNowCta";
 // S-SBUNI-5 2026-05-13 — admin dynamic-rule editor (paired with BundleItemsPicker).
 export { BundleDynamicRuleEditor } from "./BundleDynamicRuleEditor";
+export { BundleCollage } from "./BundleCollage";
 // S-SBUNI-4 2026-05-13 — multi-select product picker for bundle editor.
 export { BundleItemsPicker, defaultBundleItemsFetch, } from "./BundleItemsPicker";
 export { CategoryBundlesListing } from "./CategoryBundlesListing";

package/dist/features/categories/schemas/index.d.ts

@@ -115,13 +115,14 @@ export declare const categoryItemSchema: z.ZodObject<{
     updatedAt: z.ZodOptional<z.ZodString>;
 }, "strip", z.ZodTypeAny, {
     id: string;
-    name: string;
     slug: string;
+    name: string;
     tier: number;
     createdAt?: string | undefined;
     updatedAt?: string | undefined;
     path?: string | undefined;
     type?: "category" | "brand" | "collection" | "concern" | undefined;
+    description?: string | undefined;
     display?: {
         icon?: string | undefined;
         showInMenu?: boolean | undefined;
@@ -129,7 +130,6 @@ export declare const categoryItemSchema: z.ZodObject<{
     } | undefined;
     order?: number | undefined;
     isFeatured?: boolean | undefined;
-    description?: string | undefined;
     seo?: {
         title?: string | undefined;
         description?: string | undefined;
@@ -148,13 +148,14 @@ export declare const categoryItemSchema: z.ZodObject<{
     } | undefined;
 }, {
     id: string;
-    name: string;
     slug: string;
+    name: string;
     tier: number;
     createdAt?: string | undefined;
     updatedAt?: string | undefined;
     path?: string | undefined;
     type?: "category" | "brand" | "collection" | "concern" | undefined;
+    description?: string | undefined;
     display?: {
         icon?: string | undefined;
         showInMenu?: boolean | undefined;
@@ -162,7 +163,6 @@ export declare const categoryItemSchema: z.ZodObject<{
     } | undefined;
     order?: number | undefined;
     isFeatured?: boolean | undefined;
-    description?: string | undefined;
     seo?: {
         title?: string | undefined;
         description?: string | undefined;
@@ -192,16 +192,16 @@ export declare const categoryListParamsSchema: z.ZodObject<{
     perPage?: number | undefined;
     type?: "category" | "brand" | "collection" | "concern" | undefined;
     q?: string | undefined;
-    page?: number | undefined;
     featured?: boolean | undefined;
+    page?: number | undefined;
     tier?: number | undefined;
     parentId?: string | undefined;
 }, {
     perPage?: number | undefined;
     type?: "category" | "brand" | "collection" | "concern" | undefined;
     q?: string | undefined;
-    page?: number | undefined;
     featured?: boolean | undefined;
+    page?: number | undefined;
     tier?: number | undefined;
     parentId?: string | undefined;
 }>;

package/dist/features/checkout/actions/checkout-actions.js

@@ -11,6 +11,7 @@ import { serverLogger } from "../../../monitoring";
 import { sendEmail } from "../../contact/email";
 import { CONSENT_OTP_EXPIRY_MS, CONSENT_OTP_MAX_ATTEMPTS, hashOtp, maskEmail, generateOtpCode, buildConsentOtpEmail, enforceConsentOtpRateLimit, saveConsentOtp, readConsentOtp, patchConsentOtp, } from "../../auth/consent-otp";
 import { addressesRepository } from "../../addresses/repository/addresses.repository";
+const ERR_ADDRESS_NOT_FOUND = "Address not found.";
 async function findUserAddress(userId, addressId) {
     const address = await addressesRepository.findById(addressId);
     if (!address || address.ownerType !== "user" || address.ownerId !== userId) {
@@ -24,7 +25,7 @@ import { resolveDate } from "../../../utils";
 export async function sendCheckoutConsentOtp(userId, userEmail, addressId) {
     const address = await findUserAddress(userId, addressId);
     if (!address)
-        throw new ValidationError("Address not found.");
+        throw new ValidationError(ERR_ADDRESS_NOT_FOUND);
     await enforceConsentOtpRateLimit(userId);
     const code = generateOtpCode();
     const codeHash = hashOtp(code);
@@ -78,7 +79,7 @@ export async function grantCheckoutConsentViaSms(userId, userPhone, addressId) {
         throw new ValidationError("No phone number registered on your account.");
     const address = await findUserAddress(userId, addressId);
     if (!address)
-        throw new ValidationError("Address not found.");
+        throw new ValidationError(ERR_ADDRESS_NOT_FOUND);
     const normalizePhone = (s) => s.replace(/[^0-9]/g, "").slice(-10);
     if (normalizePhone(address.phone) !== normalizePhone(userPhone)) {
         throw new ValidationError("Phone number does not match the shipping address. Please use email verification for this address.");
@@ -107,7 +108,7 @@ export async function grantCheckoutConsentViaSms(userId, userPhone, addressId) {
 export async function grantAdminCheckoutBypass(userId, addressId, bypassingAdminUid) {
     const address = await findUserAddress(userId, addressId);
     if (!address)
-        throw new ValidationError("Address not found.");
+        throw new ValidationError(ERR_ADDRESS_NOT_FOUND);
     await saveConsentOtp(userId, addressId, {
         codeHash: "",
         expiresAt: new Date(Date.now() + CONSENT_OTP_EXPIRY_MS),

package/dist/features/checkout/hooks/usePaymentCheckout.js

@@ -3,6 +3,29 @@ import { useCallback, useRef, useState } from "react";
 import { getClientPaymentGateway } from "../../../contracts/client-payment-gateway";
 import { useCheckout as useCheckoutApi } from "../hooks/useCheckoutApi";
 import { usePaymentEvent, } from "../../payments/hooks/usePaymentEvent";
+// --- Helpers ---------------------------------------------------------------
+async function openGatewayStep(adapter, orderResponse, params) {
+    try {
+        await adapter.loadScript();
+        const response = await adapter.openPayment({
+            gatewayOrderId: orderResponse.gatewayOrderId,
+            publicKey: orderResponse.keyId,
+            amount: orderResponse.amount,
+            currency: orderResponse.currency,
+            merchantName: params.merchantName,
+            logoUrl: params.logoUrl,
+            prefill: params.prefill,
+            theme: params.themeColor ? { color: params.themeColor } : undefined,
+        });
+        return { response, cancelled: false, error: null };
+    }
+    catch (err) {
+        if (err instanceof Error && err.message.toLowerCase().includes("cancel")) {
+            return { response: null, cancelled: true, error: null };
+        }
+        return { response: null, cancelled: false, error: err instanceof Error ? err : new Error("Payment gateway error") };
+    }
+}
 // --- Hook ------------------------------------------------------------------
 const INITIAL_STATE = {
     step: "idle",
@@ -101,31 +124,17 @@ export function usePaymentCheckout(options) {
             return null;
         // Step 2: Open gateway modal
         setState((s) => ({ ...s, step: "awaiting_payment" }));
-        let gatewayResponse;
-        try {
-            const adapter = getAdapter();
-            await adapter.loadScript();
-            gatewayResponse = await adapter.openPayment({
-                gatewayOrderId: orderResponse.gatewayOrderId,
-                publicKey: orderResponse.keyId,
-                amount: orderResponse.amount,
-                currency: orderResponse.currency,
-                merchantName,
-                logoUrl,
-                prefill: params.prefill,
-                theme: themeColor ? { color: themeColor } : undefined,
-            });
+        const gatewayResult = await openGatewayStep(getAdapter(), orderResponse, { prefill: params.prefill, merchantName, logoUrl, themeColor });
+        if (gatewayResult.cancelled) {
+            setState((s) => ({ ...s, step: "cancelled", error: null }));
+            onCancel?.();
+            return null;
         }
-        catch (err) {
-            if (err instanceof Error &&
-                err.message.toLowerCase().includes("cancel")) {
-                setState((s) => ({ ...s, step: "cancelled", error: null }));
-                onCancel?.();
-                return null;
-            }
-            setError(err instanceof Error ? err : new Error("Payment gateway error"));
+        if (gatewayResult.error || !gatewayResult.response) {
+            setError(gatewayResult.error ?? new Error("Payment gateway error"));
             return null;
         }
+        const gatewayResponse = gatewayResult.response;
         if (abortRef.current)
             return null;
         // Step 3: Verify payment on server

package/dist/features/classified/components/ClassifiedFilters.d.ts

@@ -0,0 +1,8 @@
+import type { FacetOption } from "../../filters/FilterFacetSection";
+import type { UrlTable } from "../../filters/FilterPanel";
+export interface ClassifiedFiltersProps {
+    table: UrlTable;
+    categoryOptions?: FacetOption[];
+    currencyPrefix?: string;
+}
+export declare function ClassifiedFilters({ table, categoryOptions, currencyPrefix, }: ClassifiedFiltersProps): import("react/jsx-runtime").JSX.Element;

package/dist/features/classified/components/ClassifiedFilters.js

@@ -0,0 +1,19 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { FilterFacetSection } from "../../filters/FilterFacetSection";
+import { RangeFilter } from "../../filters/RangeFilter";
+import { Div } from "../../../ui";
+const NEGOTIABLE_OPTIONS = [
+    { value: "true", label: "Negotiable only" },
+];
+const SHIPPING_OPTIONS = [
+    { value: "true", label: "Accepts shipping" },
+];
+export function ClassifiedFilters({ table, categoryOptions = [], currencyPrefix = "₹", }) {
+    const selectedCategories = table.get("category")
+        ? table.get("category").split("|").filter(Boolean)
+        : [];
+    const selectedNegotiable = table.get("negotiable") ? [table.get("negotiable")] : [];
+    const selectedShipping = table.get("acceptsShipping") ? [table.get("acceptsShipping")] : [];
+    return (_jsxs(Div, { children: [categoryOptions.length > 0 && (_jsx(FilterFacetSection, { title: "Category", options: categoryOptions, selected: selectedCategories, onChange: (vals) => table.set("category", vals.join("|")), searchable: true, defaultCollapsed: categoryOptions.length > 6 })), _jsxs("div", { className: "border-t border-[var(--appkit-color-border)] pt-4 mt-4", children: [_jsx("label", { className: "block text-sm font-medium text-[var(--appkit-color-text)] mb-2", children: "City / Area" }), _jsx("input", { type: "text", value: table.get("city") || "", onChange: (e) => table.set("city", e.target.value), placeholder: "e.g. Mumbai", className: "w-full rounded-lg border border-[var(--appkit-color-border)] bg-[var(--appkit-color-surface)] px-3 py-2 text-sm text-[var(--appkit-color-text)] placeholder-[var(--appkit-color-text-faint)] focus:outline-none focus:ring-2 focus:ring-[var(--appkit-color-primary)]" })] }), _jsx(FilterFacetSection, { title: "Negotiable", options: NEGOTIABLE_OPTIONS, selected: selectedNegotiable, onChange: (vals) => table.set("negotiable", vals[0] ?? ""), searchable: false, selectionMode: "single", defaultCollapsed: false }), _jsx(FilterFacetSection, { title: "Shipping", options: SHIPPING_OPTIONS, selected: selectedShipping, onChange: (vals) => table.set("acceptsShipping", vals[0] ?? ""), searchable: false, selectionMode: "single", defaultCollapsed: false }), _jsx(RangeFilter, { title: "Asking Price", minValue: table.get("minPrice"), maxValue: table.get("maxPrice"), onMinChange: (v) => table.set("minPrice", v), onMaxChange: (v) => table.set("maxPrice", v), prefix: currencyPrefix, showSlider: true, minBound: 0, maxBound: 500000, step: 100, minPlaceholder: "Min price", maxPlaceholder: "Max price", defaultCollapsed: false })] }));
+}

package/dist/features/classified/components/ClassifiedIndexListing.d.ts

@@ -0,0 +1,4 @@
+export interface ClassifiedIndexListingProps {
+    initialData?: any;
+}
+export declare function ClassifiedIndexListing({ initialData }: ClassifiedIndexListingProps): import("react/jsx-runtime").JSX.Element;

package/dist/features/classified/components/ClassifiedIndexListing.js

@@ -0,0 +1,110 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState, useCallback } from "react";
+import { useUrlTable } from "../../../react/hooks/useUrlTable";
+import { useProducts } from "../../products/hooks/useProducts";
+import { BulkActionBar, FilterDrawer, ListingToolbar, LoginRequiredModal, Pagination, Text } from "../../../ui";
+import { usePendingTable } from "../../../react/hooks/usePendingTable";
+import { useAuthGate } from "../../../react/hooks/useAuthGate";
+import { useBulkSelection } from "../../../react/hooks/useBulkSelection";
+import { useGuestWishlist } from "../../wishlist/hooks/useGuestWishlist";
+import { pushWishlistOp } from "../../cart/utils/pending-ops";
+import { useCategoryTree, categoriesToFacetOptions } from "../../categories/hooks/useCategoryTree";
+import { TABLE_KEYS, VIEW_MODE } from "../../../constants/table-keys";
+import { sortBy } from "../../../constants/sort";
+import { PRODUCT_FIELDS } from "../../../constants/field-names";
+import { ROUTES } from "../../../next";
+import { InteractiveProductCard } from "../../products/components/InteractiveProductCard";
+import { ClassifiedFilters } from "./ClassifiedFilters";
+import { ACTION_ID } from "../../products/constants/action-defs";
+import { useToast } from "../../../ui";
+const DEFAULT_SORT = sortBy(PRODUCT_FIELDS.CREATED_AT);
+const SORT_OPTIONS = [
+    { value: sortBy(PRODUCT_FIELDS.CREATED_AT), label: "Newest First" },
+    { value: sortBy(PRODUCT_FIELDS.CREATED_AT, "ASC"), label: "Oldest First" },
+    { value: sortBy(PRODUCT_FIELDS.PRICE, "ASC"), label: "Price: Low to High" },
+    { value: sortBy(PRODUCT_FIELDS.PRICE), label: "Price: High to Low" },
+];
+const FILTER_KEYS = [
+    TABLE_KEYS.CATEGORY,
+    TABLE_KEYS.CITY,
+    TABLE_KEYS.MIN_PRICE,
+    TABLE_KEYS.MAX_PRICE,
+    TABLE_KEYS.NEGOTIABLE,
+    TABLE_KEYS.ACCEPTS_SHIPPING,
+];
+export function ClassifiedIndexListing({ initialData }) {
+    const table = useUrlTable({ defaults: { pageSize: "24", sort: DEFAULT_SORT } });
+    const { showToast } = useToast();
+    const { requireAuth, modalOpen, modalMessage, closeModal } = useAuthGate();
+    const [searchInput, setSearchInput] = useState(table.get(TABLE_KEYS.QUERY) || "");
+    const [filterOpen, setFilterOpen] = useState(false);
+    const [view, setView] = useState(table.get(TABLE_KEYS.VIEW) || VIEW_MODE.GRID);
+    const localWishlist = useGuestWishlist();
+    const { categories } = useCategoryTree();
+    const categoryOptions = categoriesToFacetOptions(categories);
+    const wishlistedIds = new Set(localWishlist.items.filter((i) => i.type === "classified").map((i) => i.itemId));
+    const { pendingTable, filterActiveCount, onFilterApply, onFilterClear, onFilterReset } = usePendingTable(table, FILTER_KEYS);
+    const openFilters = useCallback(() => {
+        onFilterReset();
+        setFilterOpen(true);
+    }, [onFilterReset]);
+    const applyFilters = useCallback(() => {
+        onFilterApply();
+        setFilterOpen(false);
+    }, [onFilterApply]);
+    const resetAll = useCallback(() => {
+        table.setMany({ [TABLE_KEYS.QUERY]: "", [TABLE_KEYS.SORT]: "" });
+        onFilterClear();
+        setSearchInput("");
+    }, [table, onFilterClear]);
+    const hasActiveState = !!table.get(TABLE_KEYS.QUERY) ||
+        table.get(TABLE_KEYS.SORT) !== DEFAULT_SORT ||
+        filterActiveCount > 0;
+    const params = {
+        q: table.get(TABLE_KEYS.QUERY) || undefined,
+        category: table.get(TABLE_KEYS.CATEGORY) || undefined,
+        minPrice: table.get(TABLE_KEYS.MIN_PRICE) ? Number(table.get(TABLE_KEYS.MIN_PRICE)) : undefined,
+        maxPrice: table.get(TABLE_KEYS.MAX_PRICE) ? Number(table.get(TABLE_KEYS.MAX_PRICE)) : undefined,
+        sort: table.get(TABLE_KEYS.SORT) || DEFAULT_SORT,
+        page: table.getNumber(TABLE_KEYS.PAGE, 1),
+        perPage: table.getNumber(TABLE_KEYS.PAGE_SIZE, 24),
+        listingType: "classified",
+    };
+    const { products, totalPages, page, isLoading } = useProducts(params, { initialData });
+    const commitSearch = useCallback(() => {
+        table.set(TABLE_KEYS.QUERY, searchInput.trim());
+    }, [searchInput, table]);
+    const selection = useBulkSelection({ items: products, keyExtractor: (p) => p.id });
+    const gridClass = "grid grid-cols-2 sm:grid-cols-3 lg:grid-cols-4 gap-4";
+    const wishlistActions = {
+        addToWishlist: (productId) => {
+            requireAuth(ACTION_ID.ADD_TO_WISHLIST, () => {
+                localWishlist.add(productId, "classified");
+                pushWishlistOp({ op: "add", itemId: productId, type: "classified" });
+                showToast("Added to wishlist", "success");
+            });
+            return Promise.resolve();
+        },
+        removeFromWishlist: (productId) => {
+            requireAuth(ACTION_ID.REMOVE_FROM_WISHLIST, () => {
+                localWishlist.remove(productId, "classified");
+                pushWishlistOp({ op: "remove", itemId: productId, type: "classified" });
+                showToast("Removed from wishlist", "info");
+            });
+            return Promise.resolve();
+        },
+        isWishlisted: (productId) => wishlistedIds.has(productId),
+    };
+    function handleToggleWishlist(id) {
+        if (wishlistActions.isWishlisted(id)) {
+            wishlistActions.removeFromWishlist(id);
+        }
+        else {
+            wishlistActions.addToWishlist(id);
+        }
+    }
+    return (_jsxs("div", { className: "min-h-screen", children: [_jsx(ListingToolbar, { filterCount: filterActiveCount, onFiltersClick: openFilters, searchValue: searchInput, searchPlaceholder: "Search classified listings\u2026", onSearchChange: setSearchInput, onSearchCommit: commitSearch, onSearchKeyDown: (e) => { if (e.key === "Enter")
+                    commitSearch(); }, sortValue: table.get(TABLE_KEYS.SORT) || DEFAULT_SORT, sortOptions: SORT_OPTIONS, onSortChange: (v) => { table.set(TABLE_KEYS.SORT, v); }, view: view, onViewChange: (v) => { if (v !== "table")
+                    setView(v); }, onResetAll: resetAll, hasActiveState: hasActiveState, bulkMode: selection.isSelecting, bulkSelectedCount: selection.selectedCount, bulkTotalCount: products.length, onBulkSelectAll: selection.toggleAll, onBulkClear: selection.clearSelection }), _jsx(BulkActionBar, { selectedCount: selection.selectedCount, onClearSelection: selection.clearSelection, actions: [] }), 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: gridClass, 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-4 bg-zinc-200 dark:bg-slate-700 rounded w-1/3" })] })] }, i))) })) : products.length === 0 ? (_jsx(Text, { className: "py-12 text-center text-sm text-zinc-500 dark:text-zinc-400", children: "No classified listings found." })) : (_jsx("div", { className: view === "list" ? "flex flex-col divide-y divide-zinc-100 dark:divide-zinc-800 rounded-xl border border-zinc-100 dark:border-zinc-800" : gridClass, children: products.map((product) => (_jsx(InteractiveProductCard, { product: product, href: String(ROUTES.PUBLIC.CLASSIFIED_DETAIL(product.id)), variant: view === "list" ? "list" : "grid", isWishlisted: wishlistActions.isWishlisted(product.id), onToggleWishlist: handleToggleWishlist, selectable: selection.isSelecting, isSelected: selection.isSelected(product.id), onSelect: (id) => selection.toggle(id) }, product.id))) })) }), _jsx(FilterDrawer, { open: filterOpen, onOpen: openFilters, onClose: () => setFilterOpen(false), onApply: applyFilters, onReset: onFilterClear, activeCount: filterActiveCount, hideTrigger: true, children: _jsx(ClassifiedFilters, { table: pendingTable, categoryOptions: categoryOptions }) }), _jsx(LoginRequiredModal, { isOpen: modalOpen, onClose: closeModal, message: modalMessage })] }));
+}

package/dist/features/classified/components/ClassifiedListView.d.ts

@@ -0,0 +1,6 @@
+type SearchParams = Record<string, string | string[]>;
+export interface ClassifiedListViewProps {
+    searchParams?: SearchParams;
+}
+export declare function ClassifiedListView({ searchParams }: ClassifiedListViewProps): Promise<import("react/jsx-runtime").JSX.Element>;
+export {};

package/dist/features/classified/components/ClassifiedListView.js

@@ -0,0 +1,43 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { productRepository } from "../../../repositories";
+import { Container, Heading, Main, Section } from "../../../ui";
+import { AdSlot } from "../../homepage/components/AdSlot";
+import { parseListingSearchParams } from "../../../utils/listing-params";
+import { ClassifiedIndexListing } from "./ClassifiedIndexListing";
+const DEFAULT_PAGE = 1;
+const DEFAULT_PAGE_SIZE = 24;
+const DEFAULT_SORT = "-createdAt";
+function sp(params, key) {
+    const v = params[key];
+    return Array.isArray(v) ? v[0] ?? "" : v ?? "";
+}
+function buildClassifiedFilters(params) {
+    const parts = ["status==published", "listingType==classified"];
+    const minPrice = sp(params, "minPrice");
+    const maxPrice = sp(params, "maxPrice");
+    if (minPrice)
+        parts.push(`price>=${minPrice}`);
+    if (maxPrice)
+        parts.push(`price<=${maxPrice}`);
+    const city = sp(params, "city");
+    if (city)
+        parts.push(`classifiedCity==${city}`);
+    const negotiable = sp(params, "negotiable");
+    if (negotiable === "true")
+        parts.push(`classifiedNegotiable==true`);
+    const acceptsShipping = sp(params, "acceptsShipping");
+    if (acceptsShipping === "true")
+        parts.push(`classifiedAcceptsShipping==true`);
+    return parts.join(",");
+}
+export async function ClassifiedListView({ searchParams = {} }) {
+    const std = parseListingSearchParams(searchParams);
+    const sort = std.sorts ?? DEFAULT_SORT;
+    const page = std.page ?? DEFAULT_PAGE;
+    const pageSize = std.pageSize ?? DEFAULT_PAGE_SIZE;
+    const filters = buildClassifiedFilters(searchParams);
+    const result = await productRepository
+        .list({ filters, sorts: sort, page, pageSize })
+        .catch(() => null);
+    return (_jsx(Main, { children: _jsx(Section, { className: "py-10", children: _jsxs(Container, { size: "xl", children: [_jsx(Heading, { level: 1, className: "mb-8 text-3xl font-semibold text-zinc-900", children: "Classifieds" }), _jsx(AdSlot, { id: "listing-sidebar-top", className: "mb-6" }), _jsx(ClassifiedIndexListing, { initialData: result ?? undefined }), _jsx(AdSlot, { id: "listing-sidebar-bottom", className: "mt-8" })] }) }) }));
+}

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

@@ -0,0 +1,6 @@
+export { ClassifiedListView } from "./ClassifiedListView";
+export type { ClassifiedListViewProps } from "./ClassifiedListView";
+export { ClassifiedIndexListing } from "./ClassifiedIndexListing";
+export type { ClassifiedIndexListingProps } from "./ClassifiedIndexListing";
+export { ClassifiedFilters } from "./ClassifiedFilters";
+export type { ClassifiedFiltersProps } from "./ClassifiedFilters";

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

@@ -0,0 +1,3 @@
+export { ClassifiedListView } from "./ClassifiedListView";
+export { ClassifiedIndexListing } from "./ClassifiedIndexListing";
+export { ClassifiedFilters } from "./ClassifiedFilters";