@mohasinac/appkit 2.3.2 → 2.4.1

package/dist/core/hooks/useSyncManager.js

@@ -0,0 +1,83 @@
+"use client";
+/**
+ * useSyncManager
+ *
+ * Local-first cart + wishlist architecture.
+ *
+ * Every SYNC_INTERVAL_MS (30 s default), if the user is logged in, replays all
+ * pending cart/wishlist ops against the server and clears the queue.
+ *
+ * If not logged in: ops stay in the queue (persisted to localStorage) and
+ * will be replayed the next time the user logs in.
+ *
+ * This hook NEVER makes GET /api/cart or GET /api/user/wishlist calls.
+ * The local store (guest-cart / guest-wishlist) is always the source of truth.
+ */
+import { useEffect, useRef } from "react";
+import { apiClient } from "../../http";
+import { getCartOps, clearCartOps, getWishlistOps, clearWishlistOps, } from "../../features/cart/utils/pending-ops";
+const SYNC_INTERVAL_MS = 30000;
+async function replayCartOps() {
+    const ops = getCartOps();
+    if (ops.length === 0)
+        return;
+    // Replay in chronological order; ignore individual failures (non-fatal)
+    for (const op of ops) {
+        if (op.op === "add") {
+            await apiClient
+                .post("/api/cart", {
+                productId: op.productId,
+                quantity: op.quantity ?? 1,
+            })
+                .catch(() => { });
+        }
+        else if (op.op === "remove") {
+            await apiClient
+                .delete(`/api/cart/${op.productId}`)
+                .catch(() => { });
+        }
+    }
+    clearCartOps();
+}
+async function replayWishlistOps() {
+    const ops = getWishlistOps();
+    if (ops.length === 0)
+        return;
+    for (const op of ops) {
+        if (op.type !== "product")
+            continue; // server wishlist is product-only
+        if (op.op === "add") {
+            await apiClient
+                .post("/api/user/wishlist", { productId: op.itemId })
+                .catch(() => { });
+        }
+        else if (op.op === "remove") {
+            await apiClient
+                .delete(`/api/user/wishlist/${op.itemId}`)
+                .catch(() => { });
+        }
+    }
+    clearWishlistOps();
+}
+export function useSyncManager(userId) {
+    const isSyncing = useRef(false);
+    useEffect(() => {
+        if (!userId)
+            return; // Guest — keep ops in queue, don't sync
+        const sync = async () => {
+            if (isSyncing.current)
+                return;
+            isSyncing.current = true;
+            try {
+                await Promise.all([replayCartOps(), replayWishlistOps()]);
+            }
+            finally {
+                isSyncing.current = false;
+            }
+        };
+        // Sync once immediately on login so the server is updated right away
+        sync();
+        const id = setInterval(sync, SYNC_INTERVAL_MS);
+        return () => clearInterval(id);
+    }, [userId]);
+}

package/dist/core/integration-keys.d.ts

@@ -4,6 +4,10 @@ export interface ResolvedKeys {
     razorpayWebhookSecret: string;
     resendApiKey: string;
     whatsappApiKey: string;
+    whatsappPhoneNumberId: string;
+    whatsappCloudApiToken: string;
+    /** Comma-separated digits-only numbers, e.g. "919876543210,918765432109" */
+    whatsappAdminNotifyNumbers: string;
 }
 /** Drops the in-process cache. Call this after admin saves new credentials. */
 export declare function invalidateIntegrationKeysCache(): void;

package/dist/core/integration-keys.js

@@ -20,6 +20,9 @@ const EMPTY_KEYS = {
     razorpayWebhookSecret: "",
     resendApiKey: "",
     whatsappApiKey: "",
+    whatsappPhoneNumberId: "",
+    whatsappCloudApiToken: "",
+    whatsappAdminNotifyNumbers: "",
 };
 let _cache = null;
 const CACHE_TTL_MS = 60000; // 1 minute
@@ -48,6 +51,11 @@ export async function resolveKeys() {
         razorpayWebhookSecret: db.razorpayWebhookSecret || process.env.RAZORPAY_WEBHOOK_SECRET || "",
         resendApiKey: db.resendApiKey || process.env.RESEND_API_KEY || "",
         whatsappApiKey: db.whatsappApiKey || process.env.WHATSAPP_API_KEY || "",
+        whatsappPhoneNumberId: db.whatsappPhoneNumberId || process.env.WHATSAPP_PHONE_NUMBER_ID || "",
+        whatsappCloudApiToken: db.whatsappCloudApiToken || process.env.WHATSAPP_CLOUD_API_TOKEN || "",
+        whatsappAdminNotifyNumbers: db.whatsappAdminNotifyNumbers ||
+            process.env.WHATSAPP_ADMIN_NOTIFY_NUMBERS ||
+            "",
     };
     _cache = { value, expiresAt: Date.now() + CACHE_TTL_MS };
     return value;

package/dist/features/about/components/FAQPageView.js

@@ -1,22 +1,20 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { ROUTES } from "../../../constants";
 import { THEME_CONSTANTS } from "../../../tokens";
-import { Heading, Text, Section, Stack } from "../../../ui";
+import { Heading, Text, Section, Stack, RichTextRenderer } from "../../../ui";
 import { TextLink } from "../../../ui";
 import { HelpCircle, ChevronRight } from "lucide-react";
 const DEFAULT_HERO_CLASS = "bg-gradient-to-br from-violet-700 to-indigo-700 dark:from-violet-800 dark:to-indigo-800";
 export async function FAQPageView({ category, heroBannerClass = DEFAULT_HERO_CLASS, } = {}) {
     const { themed, flex, page } = THEME_CONSTANTS;
-    const { getTranslations } = await import("next-intl/server");
+    const { getTranslations, getMessages } = await import("next-intl/server");
     const t = await getTranslations("faqs");
-    // Each FAQ namespace must export:
-    //   title, subtitle, searchPlaceholder
-    //   categories: [{ slug, label, icon }]
-    //   items (or per-category items keyed by category slug): [{ question, answer }]
-    const rawCategories = t.raw("categories");
-    const categories = Array.isArray(rawCategories) ? rawCategories : [];
-    const rawItems = t.raw("items");
-    const allItems = Array.isArray(rawItems) ? rawItems : [];
+    const messages = await getMessages();
+    const faqMessages = messages.faqs;
+    const categories = Array.isArray(faqMessages?.categories)
+        ? faqMessages.categories
+        : [];
+    const allItems = Array.isArray(faqMessages?.items) ? faqMessages.items : [];
     const visibleItems = category
         ? allItems.filter((item) => item.category === category)
         : allItems;
@@ -25,5 +23,5 @@ export async function FAQPageView({ category, heroBannerClass = DEFAULT_HERO_CLA
                                                 ? "bg-primary/10 text-primary font-semibold"
                                                 : "hover:bg-neutral-100 dark:hover:bg-neutral-800"}`, children: [_jsxs("span", { className: `${flex.row} gap-2`, children: [_jsx(HelpCircle, { className: "w-4 h-4" }), t("allCategories")] }), _jsx(ChevronRight, { className: "w-3.5 h-3.5 opacity-50" })] }), categories.map((cat) => (_jsxs(TextLink, { href: String(ROUTES.PUBLIC.FAQ_CATEGORY(cat.slug)), className: `flex items-center justify-between px-3 py-2 rounded-lg text-sm transition-colors ${category === cat.slug
                                                 ? "bg-primary/10 text-primary font-semibold"
-                                                : "hover:bg-neutral-100 dark:hover:bg-neutral-800"}`, children: [_jsxs("span", { className: `${flex.row} gap-2`, children: [_jsx("span", { children: cat.icon }), cat.label] }), _jsx(ChevronRight, { className: "w-3.5 h-3.5 opacity-50" })] }, cat.slug)))] })] })), _jsxs("div", { className: "flex-1 min-w-0", "data-section": "faqpageview-div-97", children: [visibleItems.length === 0 ? (_jsxs(Section, { className: `text-center py-16 rounded-2xl border ${themed.border} ${themed.bgSecondary}`, children: [_jsx(HelpCircle, { className: "w-10 h-10 mx-auto mb-3 text-neutral-300 dark:text-neutral-600" }), _jsx(Heading, { level: 3, className: "mb-2 text-base", children: t("emptyTitle") }), _jsx(Text, { variant: "secondary", className: "text-sm", children: t("emptyText") })] })) : (_jsx(Stack, { gap: "sm", className: "space-y-3", children: visibleItems.map((item, i) => (_jsxs("details", { className: `group rounded-xl border ${themed.border} ${themed.bgPrimary} overflow-hidden`, children: [_jsxs("summary", { className: `flex items-center justify-between px-5 py-4 cursor-pointer list-none select-none font-medium text-sm hover:bg-neutral-50 dark:hover:bg-neutral-800/50 transition-colors`, children: [_jsx("span", { children: item.question }), _jsx(ChevronRight, { className: "w-4 h-4 flex-shrink-0 ml-3 transition-transform group-open:rotate-90" })] }), _jsx("div", { className: "px-5 pb-5 pt-1", "data-section": "faqpageview-div-98", children: _jsx(Text, { variant: "secondary", className: "text-sm leading-relaxed whitespace-pre-line", children: item.answer }) })] }, i))) })), _jsxs(Section, { className: `mt-10 rounded-2xl p-6 text-center border ${themed.border} ${themed.bgSecondary}`, children: [_jsx(Heading, { level: 3, className: "mb-2 text-base", children: t("stillNeedHelpTitle") }), _jsx(Text, { variant: "secondary", className: "text-sm mb-4", children: t("stillNeedHelpText") }), _jsxs("div", { className: `${flex.center} gap-4 flex-wrap`, "data-section": "faqpageview-div-99", children: [_jsx(TextLink, { href: String(ROUTES.PUBLIC.HELP), children: t("helpCenter") }), _jsx(TextLink, { href: String(ROUTES.PUBLIC.CONTACT), variant: "muted", children: t("contactUs") })] })] })] })] }) })] }));
+                                                : "hover:bg-neutral-100 dark:hover:bg-neutral-800"}`, children: [_jsxs("span", { className: `${flex.row} gap-2`, children: [_jsx("span", { children: cat.icon }), cat.label] }), _jsx(ChevronRight, { className: "w-3.5 h-3.5 opacity-50" })] }, cat.slug)))] })] })), _jsxs("div", { className: "flex-1 min-w-0", "data-section": "faqpageview-div-97", children: [visibleItems.length === 0 ? (_jsxs(Section, { className: `text-center py-16 rounded-2xl border ${themed.border} ${themed.bgSecondary}`, children: [_jsx(HelpCircle, { className: "w-10 h-10 mx-auto mb-3 text-neutral-300 dark:text-neutral-600" }), _jsx(Heading, { level: 3, className: "mb-2 text-base", children: t("emptyTitle") }), _jsx(Text, { variant: "secondary", className: "text-sm", children: t("emptyText") })] })) : (_jsx(Stack, { gap: "sm", className: "space-y-3", children: visibleItems.map((item, i) => (_jsxs("details", { className: `group rounded-xl border ${themed.border} ${themed.bgPrimary} overflow-hidden`, children: [_jsxs("summary", { className: `flex items-center justify-between px-5 py-4 cursor-pointer list-none select-none font-medium text-sm hover:bg-neutral-50 dark:hover:bg-neutral-800/50 transition-colors`, children: [_jsx("span", { children: item.question }), _jsx(ChevronRight, { className: "w-4 h-4 flex-shrink-0 ml-3 transition-transform group-open:rotate-90" })] }), _jsx("div", { className: "px-5 pb-5 pt-1", "data-section": "faqpageview-div-98", children: _jsx(RichTextRenderer, { html: item.answer, proseClass: "prose prose-sm max-w-none dark:prose-invert", className: "text-neutral-600 dark:text-neutral-300" }) })] }, i))) })), _jsxs(Section, { className: `mt-10 rounded-2xl p-6 text-center border ${themed.border} ${themed.bgSecondary}`, children: [_jsx(Heading, { level: 3, className: "mb-2 text-base", children: t("stillNeedHelpTitle") }), _jsx(Text, { variant: "secondary", className: "text-sm mb-4", children: t("stillNeedHelpText") }), _jsxs("div", { className: `${flex.center} gap-4 flex-wrap`, "data-section": "faqpageview-div-99", children: [_jsx(TextLink, { href: String(ROUTES.PUBLIC.HELP), children: t("helpCenter") }), _jsx(TextLink, { href: String(ROUTES.PUBLIC.CONTACT), variant: "muted", children: t("contactUs") })] })] })] })] }) })] }));
 }

package/dist/features/about/components/PolicyPageView.js

@@ -1,21 +1,37 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { ROUTES } from "../../../constants";
 import { THEME_CONSTANTS } from "../../../tokens";
 import { Heading, Text, Section, Stack } from "../../../ui";
 import { TextLink } from "../../../ui";
+import { siteSettingsRepository } from "../../../repositories";
 const DEFAULT_HERO_CLASS = "bg-gradient-to-br from-violet-700 to-indigo-700 dark:from-violet-800 dark:to-indigo-800";
+const namespaceMap = {
+    privacy: "privacy",
+    terms: "terms",
+    cookies: "cookies",
+    refund: "refundPolicy",
+};
+const firestoreFieldMap = {
+    privacy: "privacy",
+    terms: "terms",
+    cookies: "cookies",
+    refund: "refundPolicy",
+};
 export async function PolicyPageView({ policy, heroBannerClass = DEFAULT_HERO_CLASS, }) {
     const { themed, page } = THEME_CONSTANTS;
     const { getTranslations } = await import("next-intl/server");
-    const namespaceMap = {
-        privacy: "privacyPolicy",
-        terms: "termsOfService",
-        cookies: "cookiePolicy",
-        refund: "refundPolicy",
-    };
     const t = await getTranslations(namespaceMap[policy]);
-    // Each policy namespace must export: title, lastUpdated, intro, sections (JSON array)
-    // sections: [{ heading: string, body: string }]
+    // Check Firestore for admin-overridden HTML content
+    let adminHtml = "";
+    try {
+        const settings = await siteSettingsRepository.getSingleton();
+        const legalPages = settings.legalPages ?? {};
+        adminHtml = legalPages[firestoreFieldMap[policy]] ?? "";
+    }
+    catch {
+        // Firestore unavailable — fall back to i18n
+    }
+    // i18n fallback sections
     const rawSections = t.raw("sections");
     const sections = Array.isArray(rawSections) ? rawSections : [];
     const relatedLinks = [
@@ -23,6 +39,11 @@ export async function PolicyPageView({ policy, heroBannerClass = DEFAULT_HERO_CL
         { label: t("relatedTerms"), href: String(ROUTES.PUBLIC.TERMS) },
         { label: t("relatedCookies"), href: String(ROUTES.PUBLIC.COOKIE_POLICY) },
         { label: t("relatedRefund"), href: String(ROUTES.PUBLIC.REFUND_POLICY) },
-    ].filter((l) => !l.href.includes(`/${policy}`));
-    return (_jsxs("div", { className: "-mx-4 md:-mx-6 lg:-mx-8 -mt-6 sm:-mt-8 lg:-mt-10", "data-section": "policypageview-div-181", children: [_jsx(Section, { className: `${heroBannerClass} text-white py-14 md:py-16 lg:py-20`, children: _jsxs("div", { className: `${page.container.sm}`, "data-section": "policypageview-div-182", children: [_jsx(Heading, { level: 1, variant: "none", className: "mb-3 text-white", children: t("title") }), _jsx(Text, { variant: "none", className: "text-white/80 text-sm", children: t("lastUpdated") })] }) }), _jsxs("div", { className: `${page.container.sm} py-10 md:py-12 lg:py-16`, "data-section": "policypageview-div-183", children: [t("intro") && (_jsx(Text, { variant: "secondary", className: "mb-10 text-base leading-relaxed", children: t("intro") })), _jsx(Stack, { gap: "xl", className: "space-y-10", children: sections.map((section, i) => (_jsxs(Section, { children: [_jsx(Heading, { level: 2, className: "mb-3", children: section.heading }), _jsx(Text, { variant: "secondary", className: "leading-relaxed whitespace-pre-line", children: section.body })] }, i))) }), relatedLinks.length > 0 && (_jsxs("div", { className: `mt-14 pt-8 border-t ${themed.border}`, "data-section": "policypageview-div-184", children: [_jsx(Heading, { level: 3, className: "text-sm font-semibold mb-3 uppercase tracking-wide text-neutral-500", children: t("relatedTitle") }), _jsx("div", { className: "flex flex-wrap gap-4", "data-section": "policypageview-div-185", children: relatedLinks.map((l) => (_jsx(TextLink, { href: l.href, variant: "muted", className: "text-sm", children: l.label }, l.href))) })] }))] })] }));
+    ].filter((l) => {
+        const policyPath = { privacy: "/privacy", terms: "/terms", cookies: "/cookies", refund: "/refund-policy" }[policy];
+        return !l.href.endsWith(policyPath ?? "");
+    });
+    return (_jsxs("div", { className: "-mx-4 md:-mx-6 lg:-mx-8 -mt-6 sm:-mt-8 lg:-mt-10", "data-section": "policypageview-div-181", children: [_jsx(Section, { className: `${heroBannerClass} text-white py-14 md:py-16 lg:py-20`, children: _jsxs("div", { className: `${page.container.sm}`, "data-section": "policypageview-div-182", children: [_jsx(Heading, { level: 1, variant: "none", className: "mb-3 text-white", children: t("title") }), _jsx(Text, { variant: "none", className: "text-white/80 text-sm", children: t("lastUpdated") })] }) }), _jsxs("div", { className: `${page.container.sm} py-10 md:py-12 lg:py-16`, "data-section": "policypageview-div-183", children: [adminHtml ? (
+                    /* Admin-set HTML takes priority */
+                    _jsx("div", { className: "prose prose-neutral dark:prose-invert max-w-none", dangerouslySetInnerHTML: { __html: adminHtml } })) : (_jsxs(_Fragment, { children: [t("intro") && (_jsx(Text, { variant: "secondary", className: "mb-10 text-base leading-relaxed", children: t("intro") })), _jsx(Stack, { gap: "xl", className: "space-y-10", children: sections.map((section, i) => (_jsxs(Section, { children: [_jsx(Heading, { level: 2, className: "mb-3", children: section.heading }), _jsx(Text, { variant: "secondary", className: "leading-relaxed whitespace-pre-line", children: section.body })] }, i))) })] })), relatedLinks.length > 0 && (_jsxs("div", { className: `mt-14 pt-8 border-t ${themed.border}`, "data-section": "policypageview-div-184", children: [_jsx(Heading, { level: 3, className: "text-sm font-semibold mb-3 uppercase tracking-wide text-neutral-500", children: t("relatedTitle") }), _jsx("div", { className: "flex flex-wrap gap-4", "data-section": "policypageview-div-185", children: relatedLinks.map((l) => (_jsx(TextLink, { href: l.href, variant: "muted", className: "text-sm", children: l.label }, l.href))) })] }))] })] }));
 }

package/dist/features/about/components/PublicProfileView.js

@@ -1,21 +1,87 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import Link from "next/link";
+import { getPublicUserProfile, getProfileStoreProducts, getSellerReviews } from "../../auth/actions/profile-actions";
 import { ROUTES } from "../../../constants";
 import { THEME_CONSTANTS } from "../../../tokens";
 import { Heading, Text, Section } from "../../../ui";
-import { TextLink } from "../../../ui";
-import { User, Star, ShoppingBag, MessageCircle } from "lucide-react";
+import { ProductCard } from "../../products/components/ProductGrid";
+import { ReviewCard } from "../../reviews/components/ReviewsList";
+import { User, Star, ShoppingBag, Package, Trophy, Globe, MapPin, ExternalLink } from "lucide-react";
 const DEFAULT_HERO_CLASS = "bg-gradient-to-br from-neutral-800 to-neutral-900 dark:from-neutral-900 dark:to-black";
+function toProductItem(p) {
+    return {
+        id: p.id,
+        title: p.title,
+        slug: p.slug,
+        description: p.description,
+        price: p.price,
+        currency: p.currency,
+        mainImage: p.mainImage,
+        images: p.images,
+        status: p.status,
+        condition: p.condition,
+        isAuction: p.isAuction,
+        isPreOrder: p.isPreOrder,
+        isOnSale: p.isOnSale,
+        isSold: p.isSold,
+        isPromoted: p.isPromoted,
+        featured: p.featured,
+        category: p.category,
+        categoryName: p.categoryName,
+        brand: p.brand,
+        brandSlug: p.brandSlug,
+        storeId: p.storeId,
+        storeName: p.storeName,
+        currentBid: p.currentBid,
+        availableQuantity: p.availableQuantity,
+        tags: p.tags,
+        createdAt: p.createdAt instanceof Date ? p.createdAt.toISOString() : undefined,
+    };
+}
+function getProductHref(p) {
+    if (p.isAuction)
+        return String(ROUTES.PUBLIC.AUCTION_DETAIL(p.id));
+    if (p.isPreOrder)
+        return String(ROUTES.PUBLIC.PRE_ORDER_DETAIL(p.id));
+    return String(ROUTES.PUBLIC.PRODUCT_DETAIL(p.id));
+}
 export async function PublicProfileView({ userId, heroBannerClass = DEFAULT_HERO_CLASS, }) {
     const { themed, flex, page } = THEME_CONSTANTS;
     const { getTranslations } = await import("next-intl/server");
     const t = await getTranslations("publicProfile");
-    void userId; // userId used by consumer to fetch profile data and pass as props
-    // This is a layout shell — data (displayName, avatarUrl, reviewCount, listingCount, joinedAt)
-    // is injected by the consumer page via server-fetched props.
-    // The view renders a consistent shell; in Phase 3 consumers pass data.
-    return (_jsxs("div", { className: "-mx-4 md:-mx-6 lg:-mx-8 -mt-6 sm:-mt-8 lg:-mt-10", "data-section": "publicprofileview-div-186", children: [_jsx(Section, { className: `${heroBannerClass} text-white py-10 md:py-14`, children: _jsx("div", { className: `${page.container.md}`, "data-section": "publicprofileview-div-187", children: _jsxs("div", { className: "flex flex-col sm:flex-row items-center sm:items-end gap-5", "data-section": "publicprofileview-div-188", children: [_jsx("div", { className: `w-20 h-20 rounded-full bg-white/20 ${flex.center} flex-shrink-0`, "data-section": "publicprofileview-div-189", children: _jsx(User, { className: "w-10 h-10 text-white/60" }) }), _jsxs("div", { className: "text-center sm:text-left", "data-section": "publicprofileview-div-190", children: [_jsx(Heading, { level: 1, variant: "none", className: "text-white mb-1", children: t("profileTitle") }), _jsx(Text, { variant: "none", className: "text-white/60 text-sm", children: t("memberSince") })] })] }) }) }), _jsxs("div", { className: `${page.container.md} py-10 md:py-12 space-y-10`, "data-section": "publicprofileview-div-191", children: [_jsx("div", { className: `grid grid-cols-3 gap-4`, "data-section": "publicprofileview-div-192", children: [
-                            { icon: ShoppingBag, label: t("statListings"), value: "—" },
-                            { icon: Star, label: t("statReviews"), value: "—" },
-                            { icon: MessageCircle, label: t("statMessages"), value: "—" },
-                        ].map(({ icon: Icon, label, value }) => (_jsxs("div", { className: `rounded-xl border ${themed.border} ${themed.bgPrimary} p-4 text-center`, "data-section": "publicprofileview-div-193", children: [_jsx("div", { className: `${flex.center} mb-1`, "data-section": "publicprofileview-div-194", children: _jsx(Icon, { className: "w-4 h-4 text-neutral-400" }) }), _jsx(Text, { className: "text-lg font-bold", children: value }), _jsx(Text, { variant: "secondary", className: "text-xs", children: label })] }, label))) }), _jsxs(Section, { children: [_jsx(Heading, { level: 2, className: "mb-4", children: t("listingsTitle") }), _jsxs("div", { className: `rounded-2xl border ${themed.border} ${themed.bgSecondary} p-12 text-center`, "data-section": "publicprofileview-div-195", children: [_jsx(ShoppingBag, { className: "w-10 h-10 mx-auto mb-3 text-neutral-300 dark:text-neutral-600" }), _jsx(Text, { variant: "secondary", className: "text-sm", children: t("noListings") })] })] }), _jsxs(Section, { children: [_jsx(Heading, { level: 2, className: "mb-4", children: t("reviewsTitle") }), _jsxs("div", { className: `rounded-2xl border ${themed.border} ${themed.bgSecondary} p-12 text-center`, "data-section": "publicprofileview-div-196", children: [_jsx(Star, { className: "w-10 h-10 mx-auto mb-3 text-neutral-300 dark:text-neutral-600" }), _jsx(Text, { variant: "secondary", className: "text-sm", children: t("noReviews") })] })] }), _jsx("div", { className: "flex justify-center pt-2", "data-section": "publicprofileview-div-197", children: _jsxs(TextLink, { href: String(ROUTES.HOME), variant: "muted", className: "text-sm", children: ["\u2190 ", t("backHome")] }) })] })] }));
+    const profile = await getPublicUserProfile(userId).catch(() => null);
+    const storeId = profile?.storeSlug ?? null;
+    const [products, reviews] = await Promise.all([
+        storeId ? getProfileStoreProducts(storeId).catch(() => []) : Promise.resolve([]),
+        storeId ? getSellerReviews(storeId).catch(() => []) : Promise.resolve([]),
+    ]);
+    const displayName = profile?.displayName ?? t("profileTitle");
+    const photoURL = profile?.photoURL ?? null;
+    const isSeller = profile?.role === "seller" || profile?.role === "admin";
+    const memberSince = profile?.createdAt
+        ? `Member since ${profile.createdAt.toLocaleDateString("en", { month: "long", year: "numeric" })}`
+        : t("memberSince");
+    const pub = profile?.publicProfile;
+    const stats = profile?.stats;
+    const listingCount = products.length;
+    const reviewCount = reviews.length;
+    const itemsSold = stats?.itemsSold ?? 0;
+    const auctionsWon = stats?.auctionsWon ?? 0;
+    const totalOrders = stats?.totalOrders ?? 0;
+    const storeSlug = profile?.storeSlug;
+    const storeName = pub?.storeName ?? displayName;
+    const storeDescription = pub?.storeDescription;
+    return (_jsxs("div", { className: "-mx-4 md:-mx-6 lg:-mx-8 -mt-6 sm:-mt-8 lg:-mt-10", "data-section": "publicprofileview-div-186", children: [_jsx(Section, { className: `${heroBannerClass} text-white py-10 md:py-14`, children: _jsx("div", { className: `${page.container.md}`, children: _jsxs("div", { className: "flex flex-col sm:flex-row items-center sm:items-end gap-5", children: [_jsx("div", { className: `w-20 h-20 rounded-full bg-white/20 ${flex.center} flex-shrink-0 overflow-hidden`, children: photoURL ? (_jsx("img", { src: photoURL, alt: displayName, className: "w-full h-full object-cover" })) : (_jsx(User, { className: "w-10 h-10 text-white/60" })) }), _jsxs("div", { className: "text-center sm:text-left", children: [_jsxs("div", { className: "flex items-center gap-2 flex-wrap justify-center sm:justify-start", children: [_jsx(Heading, { level: 1, variant: "none", className: "text-white mb-0", children: displayName }), isSeller && (_jsx("span", { className: "rounded-full bg-white/20 px-2.5 py-0.5 text-xs font-semibold text-white/90", children: t("roleSeller") }))] }), _jsx(Text, { variant: "none", className: "text-white/60 text-sm mt-1", children: memberSince })] }), isSeller && storeSlug && (_jsx("div", { className: "sm:ml-auto", children: _jsxs(Link, { href: String(ROUTES.PUBLIC.STORE_DETAIL(storeSlug)), className: "inline-flex items-center gap-1.5 rounded-full border border-white/30 bg-white/10 hover:bg-white/20 px-4 py-2 text-sm font-medium text-white transition-colors", children: [_jsx(ExternalLink, { className: "w-3.5 h-3.5" }), t("visitStore")] }) }))] }) }) }), _jsxs("div", { className: `${page.container.md} py-10 md:py-12 space-y-10`, children: [_jsx("div", { className: "grid grid-cols-2 sm:grid-cols-4 gap-4", children: [
+                            { icon: ShoppingBag, label: t("statListings"), value: String(listingCount) },
+                            { icon: Star, label: t("statReviews"), value: String(reviewCount) },
+                            ...(isSeller
+                                ? [
+                                    { icon: Package, label: t("statSold"), value: String(itemsSold) },
+                                    { icon: Trophy, label: t("statAuctions"), value: String(auctionsWon) },
+                                ]
+                                : [
+                                    { icon: Trophy, label: t("statAuctions"), value: String(auctionsWon) },
+                                    { icon: Package, label: t("statOrders"), value: String(totalOrders) },
+                                ]),
+                        ].map(({ icon: Icon, label, value }) => (_jsxs("div", { className: `rounded-xl border ${themed.border} ${themed.bgPrimary} p-4 text-center`, children: [_jsx("div", { className: `${flex.center} mb-1`, children: _jsx(Icon, { className: "w-4 h-4 text-neutral-400" }) }), _jsx(Text, { className: "text-lg font-bold", children: value }), _jsx(Text, { variant: "secondary", className: "text-xs", children: label })] }, label))) }), (pub?.bio || pub?.location || pub?.website) && (_jsx(Section, { children: _jsxs("div", { className: `rounded-2xl border ${themed.border} ${themed.bgPrimary} p-6 space-y-3`, children: [pub.bio && (_jsx(Text, { className: "text-sm leading-relaxed text-neutral-700 dark:text-zinc-300", children: pub.bio })), _jsxs("div", { className: "flex flex-wrap gap-4", children: [pub.location && (_jsxs("span", { className: "flex items-center gap-1.5 text-sm text-neutral-500 dark:text-zinc-400", children: [_jsx(MapPin, { className: "w-4 h-4" }), pub.location] })), pub.website && (_jsxs("a", { href: pub.website, target: "_blank", rel: "noopener noreferrer", className: "flex items-center gap-1.5 text-sm text-primary hover:underline", children: [_jsx(Globe, { className: "w-4 h-4" }), pub.website.replace(/^https?:\/\//, "")] }))] })] }) })), isSeller && storeSlug && storeDescription && (_jsx(Section, { children: _jsxs("div", { className: `rounded-2xl border ${themed.border} ${themed.bgSecondary} p-6`, children: [_jsx(Heading, { level: 3, className: "mb-2", children: storeName }), _jsx(Text, { variant: "secondary", className: "text-sm leading-relaxed", children: storeDescription }), _jsxs(Link, { href: String(ROUTES.PUBLIC.STORE_DETAIL(storeSlug)), className: "mt-3 inline-flex items-center gap-1 text-sm font-medium text-primary hover:underline", children: [t("visitStore"), " \u2192"] })] }) })), _jsxs(Section, { children: [_jsx(Heading, { level: 2, className: "mb-4", children: t("listingsTitle") }), products.length === 0 ? (_jsxs("div", { className: `rounded-2xl border ${themed.border} ${themed.bgSecondary} p-12 text-center`, children: [_jsx(ShoppingBag, { className: "w-10 h-10 mx-auto mb-3 text-neutral-300 dark:text-neutral-600" }), _jsx(Text, { variant: "secondary", className: "text-sm", children: t("noListings") })] })) : (_jsx("div", { className: "grid grid-cols-2 sm:grid-cols-3 lg:grid-cols-4 gap-4", children: products.slice(0, 8).map((p) => (_jsx(ProductCard, { product: toProductItem(p), href: getProductHref(p) }, p.id))) })), products.length > 8 && storeSlug && (_jsx("div", { className: "mt-4 text-center", children: _jsx(Link, { href: String(ROUTES.PUBLIC.STORE_PRODUCTS(storeSlug)), className: "text-sm font-medium text-primary hover:underline", children: t("viewAllListings", { count: products.length }) }) }))] }), _jsxs(Section, { children: [_jsx(Heading, { level: 2, className: "mb-4", children: t("reviewsTitle") }), reviews.length === 0 ? (_jsxs("div", { className: `rounded-2xl border ${themed.border} ${themed.bgSecondary} p-12 text-center`, children: [_jsx(Star, { className: "w-10 h-10 mx-auto mb-3 text-neutral-300 dark:text-neutral-600" }), _jsx(Text, { variant: "secondary", className: "text-sm", children: t("noReviews") })] })) : (_jsx("div", { className: "grid grid-cols-1 sm:grid-cols-2 gap-4", children: reviews.slice(0, 6).map((review) => (_jsx(ReviewCard, { review: review }, review.id))) })), reviews.length > 6 && storeSlug && (_jsx("div", { className: "mt-4 text-center", children: _jsx(Link, { href: String(ROUTES.PUBLIC.STORE_REVIEWS(storeSlug)), className: "text-sm font-medium text-primary hover:underline", children: t("viewAllReviews", { count: reviews.length }) }) }))] }), _jsx("div", { className: "flex justify-center pt-2", children: _jsxs(Link, { href: String(ROUTES.HOME), className: "text-sm text-neutral-400 dark:text-zinc-500 hover:text-neutral-600 dark:hover:text-zinc-300", children: ["\u2190 ", t("backHome")] }) })] })] }));
 }

package/dist/features/account/components/AddressesIndexListing.js

@@ -1,51 +1,76 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { useState } from "react";
-import { Search, SlidersHorizontal, X } from "lucide-react";
+import { useState, useCallback, useMemo } from "react";
+import { X } from "lucide-react";
+import { useUrlTable } from "../../../react/hooks/useUrlTable";
 import { useAddresses } from "../hooks/useAddresses";
+import { ListingToolbar } from "../../../ui";
 import { AddressBook } from "./AddressBook";
 import { AddressFilters } from "./AddressFilters";
-function createLocalTable(params, setParams) {
-    return {
-        get: (key) => params[key] ?? "",
-        set: (key, value) => setParams({ ...params, [key]: value }),
-        setMany: (updates) => setParams({ ...params, ...updates }),
-        getNumber: (key, def) => {
-            const v = params[key];
-            return v ? Number(v) : def;
+const FILTER_KEYS = ["addressType", "verified", "activeOnly"];
+export function AddressesIndexListing({ onAdd, onEdit, onDelete, }) {
+    const table = useUrlTable({ defaults: {} });
+    const [searchInput, setSearchInput] = useState(table.get("q") || "");
+    const [filterOpen, setFilterOpen] = useState(false);
+    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;
         },
-        setPage: (page) => setParams({ ...params, page: String(page) }),
-        setSort: (sort) => setParams({ ...params, sort }),
-        setPageSize: (size) => setParams({ ...params, pageSize: String(size) }),
+        set: (key, value) => setPendingFilters((p) => ({ ...p, [key]: value })),
+        setMany: (updates) => setPendingFilters((p) => ({ ...p, ...updates })),
         clear: (keys) => {
-            const next = { ...params };
-            (Array.isArray(keys) ? keys : [keys]).forEach((k) => delete next[k]);
-            setParams(next);
+            const ks = keys ?? FILTER_KEYS;
+            setPendingFilters((p) => ({
+                ...p,
+                ...Object.fromEntries(ks.map((k) => [k, ""])),
+            }));
         },
-        buildSieveParams: () => ({}),
-        buildSearchParams: () => new URLSearchParams(),
-    };
-}
-export function AddressesIndexListing({ onAdd, onEdit, onDelete, }) {
-    const [searchInput, setSearchInput] = useState("");
-    const [activeSearch, setActiveSearch] = useState("");
-    const [filterOpen, setFilterOpen] = useState(false);
-    const [filterParams, setFilterParams] = useState({});
-    const table = createLocalTable(filterParams, setFilterParams);
+        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 = {};
+        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: "" };
+        for (const k of FILTER_KEYS)
+            updates[k] = "";
+        table.setMany(updates);
+        setSearchInput("");
+    }, [table]);
+    const commitSearch = useCallback(() => {
+        table.set("q", searchInput.trim());
+    }, [searchInput, table]);
+    const activeFilterCount = FILTER_KEYS.filter((k) => !!table.get(k)).length;
+    const hasActiveState = !!table.get("q") || activeFilterCount > 0;
     const { data: addresses = [], isLoading } = useAddresses({
         filters: {
-            q: activeSearch || undefined,
-            addressType: filterParams.addressType || undefined,
-            verified: filterParams.verified === "true" || undefined,
-            activeOnly: filterParams.activeOnly === "true" || undefined,
+            q: table.get("q") || undefined,
+            addressType: table.get("addressType") || undefined,
+            verified: table.get("verified") === "true" || undefined,
+            activeOnly: table.get("activeOnly") === "true" || undefined,
         },
     });
-    const commitSearch = () => {
-        setActiveSearch(searchInput.trim());
-    };
-    const closeFilters = () => setFilterOpen(false);
-    if (isLoading) {
-        return (_jsx("div", { className: "grid sm:grid-cols-2 gap-4", children: Array.from({ length: 4 }).map((_, i) => (_jsxs("div", { className: "rounded-xl border border-zinc-200 dark:border-slate-700 animate-pulse p-4 space-y-2", children: [_jsx("div", { className: "h-4 bg-zinc-200 dark:bg-slate-700 rounded w-1/3" }), _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" })] }, i))) }));
-    }
-    return (_jsxs("div", { className: "space-y-4", children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsxs("button", { type: "button", onClick: () => setFilterOpen(true), className: "flex shrink-0 items-center gap-1.5 rounded-lg border border-zinc-300 dark:border-slate-600 px-3 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 by address, postcode or label...", 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" }), searchInput && (_jsx("button", { type: "button", onClick: () => { setSearchInput(""); setActiveSearch(""); }, className: "px-2 text-zinc-400 hover:text-zinc-600 dark:hover:text-zinc-300", "aria-label": "Clear", children: _jsx(X, { className: "h-3.5 w-3.5" }) })), _jsx("button", { type: "button", onClick: commitSearch, className: "flex shrink-0 items-center justify-center px-3 py-2 text-zinc-400 hover:text-primary transition-colors", "aria-label": "Search", children: _jsx(Search, { className: "h-4 w-4" }) })] })] }), addresses.length === 0 ? (_jsx("p", { className: "py-8 text-center text-sm text-zinc-500 dark:text-zinc-400", children: activeSearch ? `No addresses matching "${activeSearch}"` : "No saved addresses." })) : (_jsx(AddressBook, { addresses: addresses, onEdit: onEdit, onDelete: onDelete, onAdd: onAdd })), 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(AddressFilters, { table: table }) }), _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" }) })] })] }))] }));
+    return (_jsxs("div", { className: "space-y-4", children: [_jsx(ListingToolbar, { filterCount: activeFilterCount, onFiltersClick: openFilters, searchValue: searchInput, searchPlaceholder: "Search by address, postcode or label...", onSearchChange: setSearchInput, onSearchCommit: commitSearch, hideViewToggle: true, onResetAll: resetAll, hasActiveState: hasActiveState }), _jsx("div", { className: "px-3 sm:px-4", children: isLoading ? (_jsx("div", { className: "grid sm:grid-cols-2 gap-4", children: Array.from({ length: 4 }).map((_, i) => (_jsxs("div", { className: "rounded-xl border border-zinc-200 dark:border-slate-700 animate-pulse p-4 space-y-2", children: [_jsx("div", { className: "h-4 bg-zinc-200 dark:bg-slate-700 rounded w-1/3" }), _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" })] }, i))) })) : addresses.length === 0 ? (_jsx("p", { className: "py-8 text-center text-sm text-zinc-500 dark:text-zinc-400", children: table.get("q") ? `No addresses matching "${table.get("q")}"` : "No saved addresses." })) : (_jsx(AddressBook, { addresses: addresses, onEdit: onEdit, onDelete: onDelete, onAdd: onAdd })) }), 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(AddressFilters, { table: pendingTable }) }), _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/account/components/UserOffersPanel.d.ts

@@ -0,0 +1,8 @@
+export interface UserOffersPanelProps {
+    fetchEndpoint?: string;
+    onAcceptCounter: (offerId: string) => Promise<void>;
+    onWithdraw: (offerId: string) => Promise<void>;
+    onCheckout?: (offerId: string) => Promise<void>;
+    className?: string;
+}
+export declare function UserOffersPanel({ fetchEndpoint, onAcceptCounter, onWithdraw, onCheckout, className, }: UserOffersPanelProps): import("react/jsx-runtime").JSX.Element;

package/dist/features/account/components/UserOffersPanel.js

@@ -0,0 +1,81 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useCallback, useEffect, useState, useTransition } from "react";
+import { Alert, Badge, Button, Div, Heading, Spinner, Text } from "../../../ui";
+function formatRupees(amount) {
+    if (amount === undefined || amount === null)
+        return "—";
+    return `₹${amount.toLocaleString("en-IN")}`;
+}
+function relativeTime(date) {
+    if (!date)
+        return "";
+    const d = date instanceof Date ? date : new Date(date);
+    const diff = Date.now() - d.getTime();
+    const mins = Math.floor(diff / 60000);
+    if (mins < 60)
+        return `${mins}m ago`;
+    const hrs = Math.floor(diff / 3600000);
+    if (hrs < 24)
+        return `${hrs}h ago`;
+    return `${Math.floor(diff / 86400000)}d ago`;
+}
+function statusVariant(status) {
+    switch (status) {
+        case "pending": return "warning";
+        case "accepted": return "success";
+        case "declined": return "danger";
+        case "countered": return "info";
+        case "expired": return "default";
+        case "withdrawn": return "default";
+        case "paid": return "success";
+        default: return "default";
+    }
+}
+function BuyerOfferCard({ offer, onAcceptCounter, onWithdraw, onCheckout, onUpdate }) {
+    const [error, setError] = useState("");
+    const [isPending, startTransition] = useTransition();
+    const [confirming, setConfirming] = useState(null);
+    function act(fn, patch) {
+        setError("");
+        startTransition(async () => {
+            try {
+                await fn();
+                onUpdate(offer.id, patch);
+                setConfirming(null);
+            }
+            catch (err) {
+                setError(err instanceof Error ? err.message : "Something went wrong.");
+            }
+        });
+    }
+    return (_jsxs(Div, { className: "rounded-xl border border-zinc-200 dark:border-zinc-700 bg-white dark:bg-zinc-900 p-4 space-y-3", children: [_jsxs(Div, { className: "flex items-start justify-between gap-2 flex-wrap", children: [_jsxs(Div, { className: "min-w-0", children: [_jsx(Text, { className: "font-semibold text-sm text-zinc-900 dark:text-zinc-100 truncate", children: offer.productTitle ?? "Unknown Product" }), _jsx(Text, { className: "text-xs text-zinc-500 dark:text-zinc-400 mt-0.5", children: relativeTime(offer.createdAt) })] }), _jsx(Badge, { variant: statusVariant(offer.status), className: "shrink-0 capitalize text-xs", children: offer.status })] }), _jsxs(Div, { className: "flex gap-4 flex-wrap", children: [_jsxs(Div, { children: [_jsx(Text, { className: "text-xs text-zinc-400 dark:text-zinc-500 uppercase tracking-wide", children: "Listed" }), _jsx(Text, { className: "text-sm font-medium text-zinc-700 dark:text-zinc-300", children: formatRupees(offer.listedPrice) })] }), _jsxs(Div, { children: [_jsx(Text, { className: "text-xs text-zinc-400 dark:text-zinc-500 uppercase tracking-wide", children: "Your Offer" }), _jsx(Text, { className: "text-sm font-semibold text-zinc-900 dark:text-zinc-100", children: formatRupees(offer.offerAmount) })] }), offer.counterAmount != null && (_jsxs(Div, { children: [_jsx(Text, { className: "text-xs text-zinc-400 dark:text-zinc-500 uppercase tracking-wide", children: "Seller Counter" }), _jsx(Text, { className: "text-sm font-semibold text-blue-600 dark:text-blue-400", children: formatRupees(offer.counterAmount) })] })), offer.lockedPrice != null && (_jsxs(Div, { children: [_jsx(Text, { className: "text-xs text-zinc-400 dark:text-zinc-500 uppercase tracking-wide", children: "Agreed Price" }), _jsx(Text, { className: "text-sm font-semibold text-emerald-600 dark:text-emerald-400", children: formatRupees(offer.lockedPrice) })] }))] }), offer.sellerNote && (_jsxs(Text, { className: "text-xs text-zinc-500 dark:text-zinc-400 italic", children: ["Seller note: \"", offer.sellerNote, "\""] })), offer.status === "countered" && (_jsxs(Div, { className: "space-y-2", children: [_jsxs(Text, { className: "text-xs text-blue-600 dark:text-blue-400 font-medium", children: ["Seller countered at ", formatRupees(offer.counterAmount), ". Accept or withdraw your offer."] }), _jsxs(Div, { className: "flex gap-2 flex-wrap", children: [_jsx(Button, { size: "sm", variant: "primary", onClick: () => act(() => onAcceptCounter(offer.id), { status: "accepted", lockedPrice: offer.counterAmount }), disabled: isPending, children: isPending ? "Accepting…" : `Accept ${formatRupees(offer.counterAmount)}` }), _jsx(Button, { size: "sm", variant: "ghost", onClick: () => setConfirming("withdraw"), disabled: isPending, className: "text-red-600 dark:text-red-400 border border-red-200 dark:border-red-800", children: "Withdraw" })] })] })), offer.status === "accepted" && onCheckout && (_jsx(Button, { size: "sm", variant: "primary", onClick: () => act(() => onCheckout(offer.id), { status: "paid" }), disabled: isPending, children: isPending ? "Processing…" : "Checkout at Agreed Price" })), offer.status === "pending" && (_jsx(Button, { size: "sm", variant: "ghost", onClick: () => setConfirming("withdraw"), disabled: isPending, className: "text-red-600 dark:text-red-400 border border-red-200 dark:border-red-800 text-xs", children: "Withdraw Offer" })), confirming === "withdraw" && (_jsxs(Div, { className: "flex gap-2", children: [_jsx(Button, { size: "sm", variant: "ghost", onClick: () => act(() => onWithdraw(offer.id), { status: "withdrawn" }), disabled: isPending, className: "text-red-600 dark:text-red-400 border border-red-200 dark:border-red-800", children: isPending ? "Withdrawing…" : "Confirm Withdraw" }), _jsx(Button, { size: "sm", variant: "ghost", onClick: () => setConfirming(null), disabled: isPending, children: "Cancel" })] })), error && _jsx(Alert, { variant: "error", children: _jsx(Text, { className: "text-xs", children: error }) })] }));
+}
+export function UserOffersPanel({ fetchEndpoint = "/api/user/offers", onAcceptCounter, onWithdraw, onCheckout, className = "", }) {
+    const [offers, setOffers] = useState([]);
+    const [loading, setLoading] = useState(true);
+    const [fetchError, setFetchError] = useState("");
+    const loadOffers = useCallback(async () => {
+        setLoading(true);
+        setFetchError("");
+        try {
+            const res = await fetch(fetchEndpoint);
+            if (!res.ok)
+                throw new Error(`Error ${res.status}`);
+            const json = (await res.json());
+            const items = Array.isArray(json) ? json : (json.items ?? []);
+            setOffers(items);
+        }
+        catch (err) {
+            setFetchError(err instanceof Error ? err.message : "Failed to load offers.");
+        }
+        finally {
+            setLoading(false);
+        }
+    }, [fetchEndpoint]);
+    useEffect(() => { void loadOffers(); }, [loadOffers]);
+    function handleUpdate(id, patch) {
+        setOffers((prev) => prev.map((o) => (o.id === id ? { ...o, ...patch } : o)));
+    }
+    return (_jsxs(Div, { className: `space-y-4 ${className}`, children: [_jsxs(Div, { className: "flex items-center justify-between", children: [_jsx(Heading, { level: 2, className: "text-lg font-semibold text-zinc-900 dark:text-zinc-100", children: "My Offers" }), _jsx(Button, { size: "sm", variant: "ghost", onClick: loadOffers, disabled: loading, className: "border border-zinc-300 dark:border-zinc-600 text-xs", children: loading ? "Refreshing…" : "Refresh" })] }), fetchError && _jsx(Alert, { variant: "error", children: _jsx(Text, { className: "text-sm", children: fetchError }) }), loading && (_jsx(Div, { className: "flex justify-center py-12", children: _jsx(Spinner, { size: "lg" }) })), !loading && offers.length === 0 && (_jsx(Div, { className: "text-center py-12", children: _jsx(Text, { className: "text-zinc-400 dark:text-zinc-500 text-sm", children: "No offers yet" }) })), !loading && offers.length > 0 && (_jsx(Div, { className: "space-y-3", children: offers.map((offer) => (_jsx(BuyerOfferCard, { offer: offer, onAcceptCounter: onAcceptCounter, onWithdraw: onWithdraw, onCheckout: onCheckout, onUpdate: handleUpdate }, offer.id))) }))] }));
+}

package/dist/features/account/components/UserSettingsView.d.ts

@@ -11,5 +11,6 @@ export interface UserSettingsViewProps extends Omit<StackedViewShellProps, "sect
     renderPhoneVerification?: () => React.ReactNode;
     renderPasswordForm?: () => React.ReactNode;
     renderMessage?: () => React.ReactNode;
+    renderAppearance?: () => React.ReactNode;
 }
-export declare function UserSettingsView({ labels, renderAccountInfo, renderProfileForm, renderEmailVerification, renderPhoneVerification, renderPasswordForm, renderMessage, ...rest }: UserSettingsViewProps): import("react/jsx-runtime").JSX.Element;
+export declare function UserSettingsView({ labels, renderAccountInfo, renderProfileForm, renderEmailVerification, renderPhoneVerification, renderPasswordForm, renderMessage, renderAppearance, ...rest }: UserSettingsViewProps): import("react/jsx-runtime").JSX.Element;

package/dist/features/account/components/UserSettingsView.js

@@ -1,8 +1,9 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { StackedViewShell } from "../../../ui";
-export function UserSettingsView({ labels = {}, renderAccountInfo, renderProfileForm, renderEmailVerification, renderPhoneVerification, renderPasswordForm, renderMessage, ...rest }) {
+export function UserSettingsView({ labels = {}, renderAccountInfo, renderProfileForm, renderEmailVerification, renderPhoneVerification, renderPasswordForm, renderMessage, renderAppearance, ...rest }) {
     return (_jsx(StackedViewShell, { portal: "user", ...rest, title: labels.title, sections: [
             renderMessage?.(),
+            renderAppearance?.(),
             renderAccountInfo?.(),
             renderProfileForm?.(),
             renderEmailVerification?.(),

package/dist/features/account/components/UserSidebar.d.ts

@@ -14,6 +14,11 @@ export interface UserSidebarProps {
     groups?: UserNavGroup[];
     mobileOpen?: boolean;
     onCloseMobile?: () => void;
+    desktopOpen?: boolean;
+    /** Toggle callback for the desktop sidebar tab (open ↔ close). */
+    onToggle?: () => void;
     className?: string;
+    /** "sidebar" = left slide-over panel on desktop; "overlay" = right slide-over portal (default) */
+    variant?: "sidebar" | "overlay";
 }
-export declare function UserSidebar({ items, groups, mobileOpen, onCloseMobile, className, }: UserSidebarProps): import("react/jsx-runtime").JSX.Element;
+export declare function UserSidebar({ items, groups, mobileOpen, onCloseMobile, desktopOpen, onToggle, variant }: UserSidebarProps): import("react/jsx-runtime").JSX.Element;