@mohasinac/appkit 2.3.1 → 2.4.0

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

@@ -48,8 +48,8 @@ export interface CouponDocument {
     description: string;
     type: CouponType;
     scope: "admin" | "seller";
-    sellerId?: string;
-    storeSlug?: string;
+    /** For seller-scoped coupons: the storeId (= storeSlug = store.id) of the issuing store */
+    storeId?: string;
     applicableToAuctions?: boolean;
     discount: DiscountConfig;
     bxgy?: BXGYConfig;
@@ -73,6 +73,34 @@ export interface CouponUsageDocument {
 export declare const COUPONS_COLLECTION: "coupons";
 export declare const COUPON_USAGE_SUBCOLLECTION: "couponUsage";
 export declare const COUPONS_INDEXED_FIELDS: readonly ["code", "validity.isActive", "validity.startDate", "validity.endDate", "type", "createdBy"];
+export declare const COUPON_FIELDS: {
+    readonly CODE: "code";
+    readonly TYPE: "type";
+    readonly SCOPE: "scope";
+    readonly CREATED_BY: "createdBy";
+    readonly STORE_ID: "storeId";
+    readonly CREATED_AT: "createdAt";
+    readonly UPDATED_AT: "updatedAt";
+    readonly VALIDITY: {
+        readonly IS_ACTIVE: "validity.isActive";
+        readonly START_DATE: "validity.startDate";
+        readonly END_DATE: "validity.endDate";
+    };
+    readonly USAGE: {
+        readonly CURRENT_USAGE: "usage.currentUsage";
+        readonly TOTAL_LIMIT: "usage.totalLimit";
+    };
+    readonly TYPE_VALUES: {
+        readonly PERCENTAGE: CouponType;
+        readonly FIXED: CouponType;
+        readonly FREE_SHIPPING: CouponType;
+        readonly BUY_X_GET_Y: CouponType;
+    };
+    readonly SCOPE_VALUES: {
+        readonly ADMIN: "admin";
+        readonly SELLER: "seller";
+    };
+};
 export declare const COUPON_TYPE_LABELS: Record<CouponType, string>;
 export declare const DEFAULT_COUPON_DATA: Partial<CouponDocument>;
 export declare const COUPONS_PUBLIC_FIELDS: readonly ["id", "code", "name", "description", "type", "discount", "validity.startDate", "validity.endDate", "usage.totalLimit", "usage.perUserLimit"];
@@ -93,6 +121,7 @@ export declare const couponQueryHelpers: {
     readonly inactive: () => readonly ["validity.isActive", "==", false];
     readonly byType: (type: CouponType) => readonly ["type", "==", CouponType];
     readonly byCreator: (userId: string) => readonly ["createdBy", "==", string];
+    readonly byStore: (storeId: string) => readonly ["storeId", "==", string];
     readonly expiringSoon: (days?: number) => readonly ["validity.endDate", "<=", Date];
 };
 export declare function createCouponId(code: string): string;

package/dist/features/promotions/schemas/firestore.js

@@ -12,6 +12,34 @@ export const COUPONS_INDEXED_FIELDS = [
     "type",
     "createdBy",
 ];
+export const COUPON_FIELDS = {
+    CODE: "code",
+    TYPE: "type",
+    SCOPE: "scope",
+    CREATED_BY: "createdBy",
+    STORE_ID: "storeId",
+    CREATED_AT: "createdAt",
+    UPDATED_AT: "updatedAt",
+    VALIDITY: {
+        IS_ACTIVE: "validity.isActive",
+        START_DATE: "validity.startDate",
+        END_DATE: "validity.endDate",
+    },
+    USAGE: {
+        CURRENT_USAGE: "usage.currentUsage",
+        TOTAL_LIMIT: "usage.totalLimit",
+    },
+    TYPE_VALUES: {
+        PERCENTAGE: "percentage",
+        FIXED: "fixed",
+        FREE_SHIPPING: "free_shipping",
+        BUY_X_GET_Y: "buy_x_get_y",
+    },
+    SCOPE_VALUES: {
+        ADMIN: "admin",
+        SELLER: "seller",
+    },
+};
 export const COUPON_TYPE_LABELS = {
     percentage: "Percentage Discount",
     fixed: "Fixed Amount Discount",
@@ -52,6 +80,7 @@ export const couponQueryHelpers = {
     inactive: () => ["validity.isActive", "==", false],
     byType: (type) => ["type", "==", type],
     byCreator: (userId) => ["createdBy", "==", userId],
+    byStore: (storeId) => ["storeId", "==", storeId],
     expiringSoon: (days = 7) => {
         const futureDate = new Date();
         futureDate.setDate(futureDate.getDate() + days);

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

@@ -31,7 +31,6 @@ export declare const couponItemSchema: z.ZodObject<{
     getQuantity: z.ZodOptional<z.ZodNumber>;
     applicableProductIds: z.ZodOptional<z.ZodArray<z.ZodString, "many">>;
     applicableCategoryIds: z.ZodOptional<z.ZodArray<z.ZodString, "many">>;
-    sellerId: z.ZodOptional<z.ZodString>;
     storeId: z.ZodOptional<z.ZodString>;
     isPublic: z.ZodBoolean;
     isActive: z.ZodBoolean;
@@ -49,17 +48,16 @@ export declare const couponItemSchema: z.ZodObject<{
     updatedAt: string;
     isActive: boolean;
     description: string;
-    isPublic: boolean;
     discountValue: number;
+    isPublic: boolean;
     usageCount: number;
-    sellerId?: string | undefined;
-    startsAt?: string | undefined;
     storeId?: string | undefined;
+    startsAt?: string | undefined;
+    perUserLimit?: number | undefined;
     expiresAt?: string | undefined;
     minOrderAmount?: number | undefined;
     maxDiscountAmount?: number | undefined;
     maxUsageCount?: number | undefined;
-    perUserLimit?: number | undefined;
     buyQuantity?: number | undefined;
     getQuantity?: number | undefined;
     applicableProductIds?: string[] | undefined;
@@ -74,17 +72,16 @@ export declare const couponItemSchema: z.ZodObject<{
     updatedAt: string;
     isActive: boolean;
     description: string;
-    isPublic: boolean;
     discountValue: number;
+    isPublic: boolean;
     usageCount: number;
-    sellerId?: string | undefined;
-    startsAt?: string | undefined;
     storeId?: string | undefined;
+    startsAt?: string | undefined;
+    perUserLimit?: number | undefined;
     expiresAt?: string | undefined;
     minOrderAmount?: number | undefined;
     maxDiscountAmount?: number | undefined;
     maxUsageCount?: number | undefined;
-    perUserLimit?: number | undefined;
     buyQuantity?: number | undefined;
     getQuantity?: number | undefined;
     applicableProductIds?: string[] | undefined;
@@ -93,7 +90,7 @@ export declare const couponItemSchema: z.ZodObject<{
 export declare const promotionsListParamsSchema: z.ZodObject<{
     scope: z.ZodOptional<z.ZodEnum<["admin", "seller"]>>;
     isActive: z.ZodOptional<z.ZodBoolean>;
-    sellerId: z.ZodOptional<z.ZodString>;
+    storeId: z.ZodOptional<z.ZodString>;
     page: z.ZodOptional<z.ZodNumber>;
     pageSize: z.ZodOptional<z.ZodNumber>;
     filters: z.ZodOptional<z.ZodString>;
@@ -105,7 +102,7 @@ export declare const promotionsListParamsSchema: z.ZodObject<{
     page?: number | undefined;
     pageSize?: number | undefined;
     filters?: string | undefined;
-    sellerId?: string | undefined;
+    storeId?: string | undefined;
 }, {
     sort?: string | undefined;
     scope?: "admin" | "seller" | undefined;
@@ -113,5 +110,5 @@ export declare const promotionsListParamsSchema: z.ZodObject<{
     page?: number | undefined;
     pageSize?: number | undefined;
     filters?: string | undefined;
-    sellerId?: string | undefined;
+    storeId?: string | undefined;
 }>;

package/dist/features/promotions/schemas/index.js

@@ -38,7 +38,6 @@ export const couponItemSchema = z.object({
     getQuantity: z.number().optional(),
     applicableProductIds: z.array(z.string()).optional(),
     applicableCategoryIds: z.array(z.string()).optional(),
-    sellerId: z.string().optional(),
     storeId: z.string().optional(),
     isPublic: z.boolean(),
     isActive: z.boolean(),
@@ -50,7 +49,7 @@ export const couponItemSchema = z.object({
 export const promotionsListParamsSchema = z.object({
     scope: couponScopeSchema.optional(),
     isActive: z.coerce.boolean().optional(),
-    sellerId: z.string().optional(),
+    storeId: z.string().optional(),
     page: z.coerce.number().optional(),
     pageSize: z.coerce.number().optional(),
     filters: z.string().optional(),

package/dist/features/promotions/types/index.d.ts

@@ -17,7 +17,6 @@ export interface CouponItem {
     getQuantity?: number;
     applicableProductIds?: string[];
     applicableCategoryIds?: string[];
-    sellerId?: string;
     storeId?: string;
     isPublic: boolean;
     isActive: boolean;
@@ -43,7 +42,7 @@ export interface PromotionsListResponse {
 export interface PromotionsListParams {
     scope?: CouponScope;
     isActive?: boolean;
-    sellerId?: string;
+    storeId?: string;
     page?: number;
     pageSize?: number;
     filters?: string;

package/dist/features/reviews/actions/review-actions.js

@@ -29,7 +29,8 @@ export async function createReview(userId, input) {
     return reviewRepository.create({
         productId: input.productId,
         productTitle: product.title,
-        sellerId: product.sellerId,
+        storeId: product.storeId,
+        storeName: product.storeName,
         userId,
         userName: profile?.displayName ?? "Anonymous",
         userAvatar: profile?.photoURL ?? "",
@@ -159,7 +160,7 @@ export async function listAdminReviews(params) {
     return reviewRepository.listAll(sieve);
 }
 export async function listReviewsBySeller(sellerId) {
-    const products = await productRepository.findBySeller(sellerId);
+    const products = await productRepository.findByStore(sellerId);
     const productIds = products
         .filter((product) => product.status === ProductStatusValues.PUBLISHED)
         .map((product) => product.id);

package/dist/features/reviews/components/ReviewDetailPageView.d.ts

@@ -0,0 +1,4 @@
+export interface ReviewDetailPageViewProps {
+    id: string;
+}
+export declare function ReviewDetailPageView({ id }: ReviewDetailPageViewProps): Promise<import("react/jsx-runtime").JSX.Element>;

package/dist/features/reviews/components/ReviewDetailPageView.js

@@ -0,0 +1,16 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import Link from "next/link";
+import { reviewRepository } from "../../../repositories";
+import { Container, Main, Section } from "../../../ui";
+import { ROUTES } from "../../../next";
+import { ReviewDetailShell } from "./ReviewDetailShell";
+export async function ReviewDetailPageView({ id }) {
+    const doc = await reviewRepository.findById(id).catch(() => null);
+    const review = doc;
+    // storeId === storeSlug for stores in this project (pure slug IDs)
+    const storeSlug = doc?.storeId ?? null;
+    if (!review || review.status !== "approved") {
+        return (_jsx(Main, { children: _jsx(Section, { className: "py-24", children: _jsx(Container, { size: "sm", children: _jsxs("div", { className: "text-center", children: [_jsx("p", { className: "text-5xl mb-4", "aria-hidden": "true", children: "\uD83D\uDD0D" }), _jsx("h1", { className: "text-2xl font-bold text-neutral-900 dark:text-white mb-2", children: "Review not found" }), _jsx("p", { className: "text-sm text-neutral-500 dark:text-zinc-400 mb-6", children: "This review may have been removed or is no longer available." }), _jsx(Link, { href: String(ROUTES.PUBLIC.REVIEWS), className: "inline-flex items-center gap-2 rounded-lg bg-primary px-5 py-2.5 text-sm font-medium text-white hover:bg-primary-600 transition-colors", children: "\u2190 Back to Reviews" })] }) }) }) }));
+    }
+    return (_jsxs(Main, { children: [_jsx("div", { className: "border-b border-neutral-100 dark:border-zinc-800 bg-neutral-50 dark:bg-zinc-950 py-2.5 px-4", children: _jsxs("nav", { className: "mx-auto max-w-3xl flex items-center gap-1.5 text-xs text-neutral-400 dark:text-zinc-500", "aria-label": "Breadcrumb", children: [_jsx(Link, { href: String(ROUTES.HOME), className: "hover:text-primary transition-colors", children: "Home" }), _jsx("span", { children: "/" }), _jsx(Link, { href: String(ROUTES.PUBLIC.REVIEWS), className: "hover:text-primary transition-colors", children: "Reviews" }), _jsx("span", { children: "/" }), _jsx("span", { className: "text-neutral-700 dark:text-zinc-300 truncate max-w-[200px]", children: review.title ?? review.id })] }) }), _jsx(ReviewDetailShell, { review: review, storeHref: storeSlug ? String(ROUTES.PUBLIC.STORE_DETAIL(storeSlug)) : null })] }));
+}

package/dist/features/reviews/components/ReviewDetailShell.d.ts

@@ -0,0 +1,7 @@
+import type { Review } from "../types";
+interface ReviewDetailShellProps {
+    review: Review;
+    storeHref?: string | null;
+}
+export declare function ReviewDetailShell({ review, storeHref }: ReviewDetailShellProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/features/reviews/components/ReviewDetailShell.js

@@ -0,0 +1,80 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useState, useEffect, useCallback } from "react";
+import Link from "next/link";
+import { StarRating } from "../../../ui";
+import { RichText } from "../../../ui";
+import { maskName } from "../../../security";
+import { getDefaultLocale } from "../../../core/baseline-resolver";
+import { normalizeRichTextHtml } from "../../../utils/string.formatter";
+import { ROUTES } from "../../../next";
+import { apiClient } from "../../../http";
+import { REVIEW_ENDPOINTS } from "../../../constants/api-endpoints";
+export function ReviewDetailShell({ review, storeHref }) {
+    const displayName = maskName(review.userName);
+    const initials = displayName.charAt(0).toUpperCase();
+    const date = review.createdAt
+        ? new Date(review.createdAt).toLocaleDateString(getDefaultLocale(), {
+            year: "numeric",
+            month: "long",
+            day: "numeric",
+        })
+        : "";
+    // ── Lightbox ────────────────────────────────────────────────────────────────
+    const images = review.images ?? [];
+    const [lightboxIdx, setLightboxIdx] = useState(null);
+    const closeLightbox = useCallback(() => setLightboxIdx(null), []);
+    const prevImage = useCallback(() => setLightboxIdx((i) => (i === null ? null : (i - 1 + images.length) % images.length)), [images.length]);
+    const nextImage = useCallback(() => setLightboxIdx((i) => (i === null ? null : (i + 1) % images.length)), [images.length]);
+    useEffect(() => {
+        if (lightboxIdx === null)
+            return;
+        const onKey = (e) => {
+            if (e.key === "Escape")
+                closeLightbox();
+            if (e.key === "ArrowLeft")
+                prevImage();
+            if (e.key === "ArrowRight")
+                nextImage();
+        };
+        window.addEventListener("keydown", onKey);
+        return () => window.removeEventListener("keydown", onKey);
+    }, [lightboxIdx, closeLightbox, prevImage, nextImage]);
+    // ── Helpful vote ────────────────────────────────────────────────────────────
+    const storageKey = `review_voted_${review.id}`;
+    const [helpfulCount, setHelpfulCount] = useState(review.helpfulCount ?? 0);
+    const [voted, setVoted] = useState(false);
+    const [voting, setVoting] = useState(false);
+    useEffect(() => {
+        setVoted(localStorage.getItem(storageKey) === "1");
+    }, [storageKey]);
+    const handleVote = async () => {
+        if (voted || voting)
+            return;
+        setVoting(true);
+        try {
+            await apiClient.post(`${REVIEW_ENDPOINTS.LIST}/${review.id}/vote`, {});
+            setHelpfulCount((c) => c + 1);
+            setVoted(true);
+            localStorage.setItem(storageKey, "1");
+        }
+        catch {
+            // silently fail
+        }
+        finally {
+            setVoting(false);
+        }
+    };
+    // ── Links ───────────────────────────────────────────────────────────────────
+    const productHref = review.productId
+        ? String(ROUTES.PUBLIC.PRODUCT_DETAIL(review.productId))
+        : null;
+    const sellerHref = storeHref ?? null;
+    const reviewerHref = String(ROUTES.PUBLIC.PROFILE(review.userId));
+    const currentImage = lightboxIdx !== null ? images[lightboxIdx] : null;
+    return (_jsxs(_Fragment, { children: [_jsx("div", { className: "border-b border-neutral-200 dark:border-zinc-800 bg-white dark:bg-zinc-900 pb-8 pt-10", children: _jsxs("div", { className: "mx-auto max-w-3xl px-4", children: [_jsxs("div", { className: "mb-4 flex items-center gap-3", children: [_jsx(StarRating, { value: review.rating, size: "lg", readOnly: true }), _jsxs("span", { className: "text-2xl font-bold text-neutral-900 dark:text-white", children: [review.rating, ".0"] }), review.verified && (_jsx("span", { className: "inline-flex items-center gap-1 rounded-full bg-emerald-100 px-3 py-1 text-xs font-semibold text-emerald-700 dark:bg-emerald-900/30 dark:text-emerald-400", children: "\u2713 Verified Purchase" })), review.featured && (_jsx("span", { className: "inline-flex items-center gap-1 rounded-full bg-yellow-100 px-3 py-1 text-xs font-semibold text-yellow-700 dark:bg-yellow-900/30 dark:text-yellow-400", children: "\u2605 Featured" }))] }), review.title && (_jsx("h1", { className: "text-2xl font-bold text-neutral-900 dark:text-white mb-4 leading-snug", children: review.title })), _jsxs("div", { className: "flex items-center gap-3", children: [review.userAvatar ? (_jsx("div", { role: "img", "aria-label": displayName, className: "h-11 w-11 flex-shrink-0 rounded-full bg-center bg-cover ring-2 ring-white dark:ring-zinc-800", style: { backgroundImage: `url(${review.userAvatar})` } })) : (_jsx("div", { className: "flex h-11 w-11 flex-shrink-0 items-center justify-center rounded-full bg-primary/10 text-base font-bold text-primary ring-2 ring-white dark:ring-zinc-800", children: initials })), _jsxs("div", { className: "min-w-0", children: [_jsx(Link, { href: reviewerHref, className: "text-sm font-semibold text-neutral-900 dark:text-white hover:text-primary transition-colors", children: displayName }), date && (_jsx("p", { className: "text-xs text-neutral-400 dark:text-zinc-500 mt-0.5", children: date }))] })] })] }) }), _jsxs("div", { className: "mx-auto max-w-3xl px-4 py-8 space-y-8", children: [review.comment && (_jsx("section", { children: _jsx(RichText, { html: normalizeRichTextHtml(review.comment), proseClass: "prose prose-neutral dark:prose-invert max-w-none prose-p:leading-relaxed prose-headings:font-semibold prose-img:rounded-lg prose-a:text-primary", className: "text-neutral-700 dark:text-zinc-300" }) })), images.length > 0 && (_jsxs("section", { children: [_jsxs("h2", { className: "text-sm font-semibold uppercase tracking-wide text-neutral-400 dark:text-zinc-500 mb-3", children: ["Photos (", images.length, ")"] }), _jsx("div", { className: "grid grid-cols-3 sm:grid-cols-4 gap-2", children: images.map((img, i) => (_jsxs("button", { type: "button", onClick: () => setLightboxIdx(i), "aria-label": `View photo ${i + 1}`, className: "group relative aspect-square overflow-hidden rounded-xl border border-neutral-200 dark:border-zinc-700 bg-neutral-100 dark:bg-zinc-800 focus:outline-none focus-visible:ring-2 focus-visible:ring-primary", children: [_jsx("div", { className: "h-full w-full bg-center bg-cover transition-transform duration-300 group-hover:scale-105", style: { backgroundImage: `url(${img.thumbnailUrl ?? img.url})` } }), _jsx("div", { className: "absolute inset-0 flex items-center justify-center opacity-0 group-hover:opacity-100 transition-opacity bg-black/30", children: _jsx("span", { className: "text-white text-xl", children: "\uD83D\uDD0D" }) })] }, i))) })] })), review.video && (_jsxs("section", { children: [_jsx("h2", { className: "text-sm font-semibold uppercase tracking-wide text-neutral-400 dark:text-zinc-500 mb-3", children: "Video" }), _jsx("div", { className: "overflow-hidden rounded-xl border border-neutral-200 dark:border-zinc-700 bg-black aspect-video", children: _jsx("video", { src: review.video.url, poster: review.video.thumbnailUrl, controls: true, className: "h-full w-full", preload: "metadata" }) })] })), _jsxs("section", { className: "flex items-center gap-4 py-4 border-t border-neutral-100 dark:border-zinc-800", children: [_jsx("div", { className: "text-sm text-neutral-500 dark:text-zinc-400", children: helpfulCount > 0 && (_jsxs("span", { children: [_jsx("strong", { className: "text-neutral-900 dark:text-white", children: helpfulCount }), " ", helpfulCount === 1 ? "person" : "people", " found this helpful"] })) }), _jsxs("button", { type: "button", onClick: handleVote, disabled: voted || voting, className: `ml-auto flex items-center gap-2 rounded-lg border px-4 py-2 text-sm font-medium transition-colors ${voted
+                                    ? "border-emerald-200 bg-emerald-50 text-emerald-600 dark:border-emerald-800 dark:bg-emerald-900/20 dark:text-emerald-400 cursor-default"
+                                    : "border-neutral-300 dark:border-zinc-600 text-neutral-700 dark:text-zinc-200 hover:border-primary hover:text-primary dark:hover:border-primary dark:hover:text-primary disabled:opacity-50"}`, children: [_jsx("span", { "aria-hidden": "true", children: voted ? "✓" : "👍" }), voted ? "Marked helpful" : voting ? "Saving…" : "Helpful?"] })] }), _jsxs("section", { className: "grid gap-3 sm:grid-cols-3", children: [productHref && (_jsxs(Link, { href: productHref, className: "group flex items-center gap-3 rounded-xl border border-neutral-200 dark:border-zinc-700 bg-white dark:bg-zinc-900 p-4 hover:border-primary hover:shadow-sm transition-all", children: [_jsx("span", { className: "flex h-10 w-10 flex-shrink-0 items-center justify-center rounded-lg bg-orange-100 dark:bg-orange-900/30 text-xl", children: "\uD83D\uDCE6" }), _jsxs("div", { className: "min-w-0", children: [_jsx("p", { className: "text-xs text-neutral-400 dark:text-zinc-500 mb-0.5", children: "Product" }), _jsx("p", { className: "text-sm font-medium text-neutral-900 dark:text-white truncate group-hover:text-primary transition-colors", children: review.productTitle ?? "View Product" })] })] })), sellerHref && (_jsxs(Link, { href: sellerHref, className: "group flex items-center gap-3 rounded-xl border border-neutral-200 dark:border-zinc-700 bg-white dark:bg-zinc-900 p-4 hover:border-primary hover:shadow-sm transition-all", children: [_jsx("span", { className: "flex h-10 w-10 flex-shrink-0 items-center justify-center rounded-lg bg-blue-100 dark:bg-blue-900/30 text-xl", children: "\uD83C\uDFEA" }), _jsxs("div", { className: "min-w-0", children: [_jsx("p", { className: "text-xs text-neutral-400 dark:text-zinc-500 mb-0.5", children: "Seller" }), _jsx("p", { className: "text-sm font-medium text-neutral-900 dark:text-white truncate group-hover:text-primary transition-colors", children: "View Seller" })] })] })), _jsxs(Link, { href: reviewerHref, className: "group flex items-center gap-3 rounded-xl border border-neutral-200 dark:border-zinc-700 bg-white dark:bg-zinc-900 p-4 hover:border-primary hover:shadow-sm transition-all", children: [_jsx("span", { className: "flex h-10 w-10 flex-shrink-0 items-center justify-center rounded-lg bg-purple-100 dark:bg-purple-900/30 text-xl", children: "\uD83D\uDC64" }), _jsxs("div", { className: "min-w-0", children: [_jsx("p", { className: "text-xs text-neutral-400 dark:text-zinc-500 mb-0.5", children: "Reviewer" }), _jsx("p", { className: "text-sm font-medium text-neutral-900 dark:text-white truncate group-hover:text-primary transition-colors", children: displayName })] })] })] })] }), lightboxIdx !== null && currentImage && (_jsxs("div", { className: "fixed inset-0 z-50 flex items-center justify-center bg-black/95", onClick: closeLightbox, role: "dialog", "aria-modal": "true", "aria-label": "Image lightbox", children: [_jsx("button", { type: "button", onClick: closeLightbox, "aria-label": "Close lightbox", className: "absolute top-4 right-4 z-10 flex h-10 w-10 items-center justify-center rounded-full bg-white/10 text-white hover:bg-white/20 transition-colors text-xl", children: "\u00D7" }), _jsxs("div", { className: "absolute top-4 left-1/2 -translate-x-1/2 text-white/70 text-sm", children: [lightboxIdx + 1, " / ", images.length] }), images.length > 1 && (_jsx("button", { type: "button", onClick: (e) => { e.stopPropagation(); prevImage(); }, "aria-label": "Previous image", className: "absolute left-4 top-1/2 -translate-y-1/2 z-10 flex h-12 w-12 items-center justify-center rounded-full bg-white/10 text-white hover:bg-white/25 transition-colors text-2xl", children: "\u2039" })), _jsx("div", { className: "max-h-[85vh] max-w-[85vw] flex items-center justify-center", onClick: (e) => e.stopPropagation(), children: _jsx("img", { src: currentImage.url, alt: `Review photo ${lightboxIdx + 1}`, className: "max-h-[85vh] max-w-[85vw] rounded-lg object-contain shadow-2xl" }) }), images.length > 1 && (_jsx("button", { type: "button", onClick: (e) => { e.stopPropagation(); nextImage(); }, "aria-label": "Next image", className: "absolute right-4 top-1/2 -translate-y-1/2 z-10 flex h-12 w-12 items-center justify-center rounded-full bg-white/10 text-white hover:bg-white/25 transition-colors text-2xl", children: "\u203A" })), images.length > 1 && (_jsx("div", { className: "absolute bottom-4 left-0 right-0 flex justify-center gap-2 px-4", children: images.map((img, i) => (_jsx("button", { type: "button", onClick: (e) => { e.stopPropagation(); setLightboxIdx(i); }, "aria-label": `Go to image ${i + 1}`, className: `h-12 w-12 flex-shrink-0 rounded-md bg-center bg-cover border-2 transition-all ${i === lightboxIdx
+                                ? "border-white scale-110"
+                                : "border-transparent opacity-60 hover:opacity-100"}`, style: { backgroundImage: `url(${img.thumbnailUrl ?? img.url})` } }, i))) }))] }))] }));
+}

package/dist/features/reviews/components/ReviewFilters.d.ts

@@ -2,9 +2,9 @@ import type { FacetOption } from "../../filters/FilterFacetSection";
 import type { UrlTable } from "../../filters/FilterPanel";
 export type ReviewFilterVariant = "admin" | "seller" | "public";
 export declare const REVIEW_FILTER_KEYS: {
-    readonly admin: readonly ["status", "rating", "brand", "verified", "featured"];
-    readonly seller: readonly ["status", "rating", "brand"];
-    readonly public: readonly ["rating", "brand"];
+    readonly admin: readonly ["status", "rating", "brand", "verified", "featured", "dateFrom", "dateTo"];
+    readonly seller: readonly ["status", "rating", "brand", "dateFrom", "dateTo"];
+    readonly public: readonly ["rating", "brand", "dateFrom", "dateTo"];
 };
 export declare const REVIEW_ADMIN_SORT_OPTIONS: readonly [{
     readonly value: "-createdAt";

package/dist/features/reviews/components/ReviewFilters.js

@@ -1,12 +1,13 @@
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import { useTranslations } from "next-intl";
 import { FilterFacetSection } from "../../filters/FilterFacetSection";
+import { RangeFilter } from "../../filters/RangeFilter";
 import { SwitchFilter } from "../../filters/SwitchFilter";
 import { Div } from "../../../ui";
 export const REVIEW_FILTER_KEYS = {
-    admin: ["status", "rating", "brand", "verified", "featured"],
-    seller: ["status", "rating", "brand"],
-    public: ["rating", "brand"],
+    admin: ["status", "rating", "brand", "verified", "featured", "dateFrom", "dateTo"],
+    seller: ["status", "rating", "brand", "dateFrom", "dateTo"],
+    public: ["rating", "brand", "dateFrom", "dateTo"],
 };
 export const REVIEW_ADMIN_SORT_OPTIONS = [
     { value: "-createdAt", key: "sortNewest" },
@@ -55,5 +56,5 @@ export function ReviewFilters({ table, variant = "admin", brandOptions, }) {
         : [];
     const isAdmin = variant === "admin";
     const showStatus = variant !== "public";
-    return (_jsxs(Div, { children: [showStatus && (_jsx(FilterFacetSection, { title: t("status"), options: statusOptions, selected: selectedStatus, onChange: (vals) => table.set("status", vals.join("|")), searchable: false, defaultCollapsed: false })), _jsx(FilterFacetSection, { title: t("rating"), options: ratingOptions, selected: selectedRating, onChange: (vals) => table.set("rating", vals.join("|")), searchable: false, defaultCollapsed: variant === "admin" }), brandOptions && brandOptions.length > 0 && (_jsx(FilterFacetSection, { title: t("brand"), options: brandOptions, selected: table.get("brand") ? [table.get("brand")] : [], onChange: (vals) => table.set("brand", vals[0] ?? ""), searchable: brandOptions.length > 6, selectionMode: "single", defaultCollapsed: true })), isAdmin && (_jsxs(_Fragment, { children: [_jsx(SwitchFilter, { title: t("verified"), label: t("showVerifiedOnly"), checked: table.get("verified") === "true", onChange: (v) => table.set("verified", v ? "true" : ""), defaultCollapsed: true }), _jsx(SwitchFilter, { title: t("featured"), label: t("showFeaturedOnly"), checked: table.get("featured") === "true", onChange: (v) => table.set("featured", v ? "true" : ""), defaultCollapsed: true })] }))] }));
+    return (_jsxs(Div, { children: [showStatus && (_jsx(FilterFacetSection, { title: t("status"), options: statusOptions, selected: selectedStatus, onChange: (vals) => table.set("status", vals.join("|")), searchable: false, defaultCollapsed: false })), _jsx(FilterFacetSection, { title: t("rating"), options: ratingOptions, selected: selectedRating, onChange: (vals) => table.set("rating", vals.join("|")), searchable: false, defaultCollapsed: variant === "admin" }), brandOptions && brandOptions.length > 0 && (_jsx(FilterFacetSection, { title: t("brand"), options: brandOptions, selected: table.get("brand") ? [table.get("brand")] : [], onChange: (vals) => table.set("brand", vals[0] ?? ""), searchable: brandOptions.length > 6, selectionMode: "single", defaultCollapsed: true })), _jsx(RangeFilter, { title: t("dateRange"), type: "date", minValue: table.get("dateFrom"), maxValue: table.get("dateTo"), onMinChange: (v) => table.set("dateFrom", v), onMaxChange: (v) => table.set("dateTo", v), minPlaceholder: t("minDate"), maxPlaceholder: t("maxDate"), defaultCollapsed: true }), isAdmin && (_jsxs(_Fragment, { children: [_jsx(SwitchFilter, { title: t("verified"), label: t("showVerifiedOnly"), checked: table.get("verified") === "true", onChange: (v) => table.set("verified", v ? "true" : "") }), _jsx(SwitchFilter, { title: t("featured"), label: t("showFeaturedOnly"), checked: table.get("featured") === "true", onChange: (v) => table.set("featured", v ? "true" : "") })] })), _jsx(RangeFilter, { title: t("votesRange"), minValue: table.get("minVotes"), maxValue: table.get("maxVotes"), onMinChange: (v) => table.set("minVotes", v), onMaxChange: (v) => table.set("maxVotes", v), minBound: 0, maxBound: 10000, step: 1, minPlaceholder: t("minVotes"), maxPlaceholder: t("maxVotes"), defaultCollapsed: true })] }));
 }

package/dist/features/reviews/components/ReviewsIndexListing.d.ts

@@ -1,5 +1,6 @@
-import type { Review } from "../types";
+import type { ReviewListResponse } from "../types";
 export interface ReviewsIndexListingProps {
-    reviews: Review[];
+    initialData?: ReviewListResponse;
+    variant?: "admin" | "seller" | "public";
 }
-export declare function ReviewsIndexListing({ reviews }: ReviewsIndexListingProps): import("react/jsx-runtime").JSX.Element;
+export declare function ReviewsIndexListing({ initialData, variant, }: ReviewsIndexListingProps): import("react/jsx-runtime").JSX.Element;

package/dist/features/reviews/components/ReviewsIndexListing.js

@@ -1,55 +1,90 @@
 "use client";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useMemo, useState } from "react";
-import { Div, Grid, Pagination, SlottedListingView, SortDropdown, Stack, Text, } from "../../../ui";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useState, useCallback, useMemo } from "react";
+import { X } from "lucide-react";
+import { useUrlTable } from "../../../react/hooks/useUrlTable";
+import { Pagination, ListingToolbar } from "../../../ui";
 import { ReviewCard } from "./ReviewsList";
+import { ReviewFilters, REVIEW_PUBLIC_SORT_OPTIONS } from "./ReviewFilters";
+import { useReviews } from "../hooks/useReviews";
 const PAGE_SIZE = 12;
-const SORT_OPTIONS = [
-    { value: "-createdAt", label: "Newest First" },
-    { value: "createdAt", label: "Oldest First" },
-    { value: "-rating", label: "Highest Rating" },
-    { value: "rating", label: "Lowest Rating" },
-];
-const STAR_OPTIONS = [
-    { value: "", label: "All Ratings" },
-    { value: "5", label: "5 Stars" },
-    { value: "4", label: "4 Stars" },
-    { value: "3", label: "3 Stars" },
-    { value: "2", label: "2 Stars" },
-    { value: "1", label: "1 Star" },
-];
-export function ReviewsIndexListing({ reviews }) {
-    const [sort, setSort] = useState("-createdAt");
-    const [starFilter, setStarFilter] = useState("");
-    const [page, setPage] = useState(1);
-    const filtered = useMemo(() => {
-        let result = [...reviews];
-        if (starFilter) {
-            const star = parseInt(starFilter, 10);
-            result = result.filter((r) => r.rating === star);
-        }
-        result.sort((a, b) => {
-            if (sort === "-rating")
-                return b.rating - a.rating;
-            if (sort === "rating")
-                return a.rating - b.rating;
-            const aTime = a.createdAt ? new Date(a.createdAt).getTime() : 0;
-            const bTime = b.createdAt ? new Date(b.createdAt).getTime() : 0;
-            return sort === "createdAt" ? aTime - bTime : bTime - aTime;
-        });
-        return result;
-    }, [reviews, sort, starFilter]);
-    const totalPages = Math.max(1, Math.ceil(filtered.length / PAGE_SIZE));
-    const paginated = filtered.slice((page - 1) * PAGE_SIZE, page * PAGE_SIZE);
-    const handleSort = (val) => {
-        setSort(val);
-        setPage(1);
-    };
-    const handleStarFilter = (val) => {
-        setStarFilter(val);
-        setPage(1);
-    };
-    return (_jsx(Div, { className: "min-h-screen", children: _jsx(SlottedListingView, { portal: "public", manageSearch: false, manageSort: false, inlineToolbar: true, renderSort: () => (_jsx(SortDropdown, { value: sort, onChange: handleSort, options: SORT_OPTIONS })), renderFilters: () => (_jsxs(Div, { className: "space-y-2 p-4", children: [_jsx(Text, { className: "text-sm font-semibold text-zinc-700 dark:text-zinc-300", children: "Filter by Rating" }), STAR_OPTIONS.map((opt) => (_jsx("button", { type: "button", onClick: () => handleStarFilter(opt.value), className: `block w-full rounded-lg px-3 py-2 text-left text-sm transition ${starFilter === opt.value
-                            ? "bg-zinc-900 text-white dark:bg-zinc-100 dark:text-zinc-900"
-                            : "text-zinc-700 hover:bg-zinc-100 dark:text-zinc-300 dark:hover:bg-slate-800"}`, children: opt.label }, opt.value)))] })), renderTable: () => paginated.length === 0 ? (_jsx(Stack, { align: "center", gap: "3", className: "justify-center py-24 text-center", children: _jsx(Text, { className: "text-xl font-medium text-zinc-900 dark:text-zinc-50", children: "No reviews found" }) })) : (_jsx(Grid, { cols: 3, gap: "md", children: paginated.map((review) => (_jsx(ReviewCard, { review: review }, review.id))) })), renderPagination: () => totalPages > 1 ? (_jsx(Pagination, { currentPage: page, totalPages: totalPages, onPageChange: setPage })) : null, total: filtered.length, isLoading: false }) }));
+const FILTER_KEYS = ["rating", "dateFrom", "dateTo", "minVotes", "maxVotes"];
+export function ReviewsIndexListing({ initialData, variant = "public", }) {
+    const table = useUrlTable({ defaults: { pageSize: String(PAGE_SIZE), sort: "-createdAt" } });
+    const [searchInput, setSearchInput] = useState(table.get("q") || "");
+    const [filterOpen, setFilterOpen] = useState(false);
+    const sort = table.get("sort") || "-createdAt";
+    const currentPage = table.getNumber("page", 1);
+    // 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(() => {
+        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: "" };
+        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("sort") !== "-createdAt" ||
+        activeFilterCount > 0;
+    const commitSearch = useCallback(() => {
+        table.set("q", searchInput.trim());
+        table.setPage(1);
+    }, [searchInput, table]);
+    const { reviews, total, totalPages, isLoading } = useReviews({
+        q: table.get("q") || undefined,
+        rating: table.get("rating") || undefined,
+        dateFrom: table.get("dateFrom") || undefined,
+        dateTo: table.get("dateTo") || undefined,
+        minVotes: table.get("minVotes") ? Number(table.get("minVotes")) : undefined,
+        maxVotes: table.get("maxVotes") ? Number(table.get("maxVotes")) : undefined,
+        sort,
+        page: currentPage,
+        perPage: PAGE_SIZE,
+    }, { initialData });
+    const sortOptions = REVIEW_PUBLIC_SORT_OPTIONS.map((opt) => ({
+        value: opt.value,
+        label: opt.key,
+    }));
+    return (_jsxs("div", { className: "min-h-screen", children: [_jsx(ListingToolbar, { filterCount: activeFilterCount, onFiltersClick: openFilters, searchValue: searchInput, searchPlaceholder: "Search reviews by product name...", onSearchChange: setSearchInput, onSearchCommit: commitSearch, sortValue: sort, sortOptions: sortOptions, onSortChange: (v) => { table.set("sort", v); table.setPage(1); }, hideViewToggle: true, 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: currentPage, totalPages: totalPages, onPageChange: (p) => table.setPage(p) }) })), _jsx("div", { className: "py-6", children: isLoading ? (_jsx("div", { className: "grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-6", children: Array.from({ length: 6 }).map((_, i) => (_jsx("div", { className: "rounded-xl border border-zinc-100 dark:border-slate-700 overflow-hidden animate-pulse", children: _jsxs("div", { className: "p-4 space-y-3", children: [_jsx("div", { className: "h-4 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-full" }), _jsx("div", { className: "h-3 bg-zinc-200 dark:bg-slate-700 rounded w-2/3" })] }) }, i))) })) : reviews.length === 0 ? (_jsx("p", { className: "py-12 text-center text-sm text-zinc-500 dark:text-zinc-400", children: "No reviews found." })) : (_jsx("div", { className: "grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-6", children: reviews.map((review) => (_jsx(ReviewCard, { review: review }, review.id))) })) }), 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: [_jsx("span", { className: "flex items-center gap-2 text-base font-semibold text-zinc-900 dark:text-zinc-100", children: "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(ReviewFilters, { table: pendingTable, variant: variant }) }), _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/reviews/components/ReviewsIndexPageView.d.ts

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