@mohasinac/appkit 4.53.1 → 4.53.2

package/dist/_internal/server/features/products/listing-tab-counts.js

@@ -11,9 +11,10 @@
  *       the tab bar renders, so a tenth listing type is counted automatically.
  *
  * EXPORTS:
- *   ListingTabScope   — the surface's scope (category / brand / store)
- *   ListingTabCounts  — tabSlug -> count, `undefined` meaning "query failed"
- *   listingTabCounts  — resolve every tab's count in one parallel batch
+ *   ListingTabScope       — the surface's scope (category / brand / store)
+ *   ListingTabCounts      — tabSlug -> count, `undefined` meaning "unknown"
+ *   ListingTabCountResult — the AVAILABLE and TOTAL maps, see below
+ *   listingTabCounts      — resolve every tab's counts in one parallel batch
  *
  * @tag domain:products,categories,stores
  * @tag layer:server
@@ -25,6 +26,11 @@
 import { categoriesRepository, productRepository } from "../../../../repositories/index.js";
 import { serverLogger } from "../../../../monitoring/index.js";
 import { normalizeError } from "../../../../errors/normalize.js";
+import { sieveAnd, sieveFilter, SIEVE_OP, sortBy } from "../../../../utils/sieve-builder.js";
+import { PRODUCT_FIELDS } from "../../../../constants/field-names.js";
+import { isListingRowAvailable, unavailableClausesFor, } from "../../../shared/listing-types/_registry.js";
+import { normalizeListingType } from "../../../../features/products/utils/listing-type.js";
+import { clauseToSieve, PUBLIC_PRODUCT_MAX_PAGE_SIZE } from "./list-public.js";
 const DEFAULT_STATUS = "published";
 /** Bundles a category owns, resolved by the same rule the bundles tab renders. */
 async function countBundles(scope) {
@@ -65,6 +71,101 @@ function bundleMatchesScope(bundle, scope) {
     }
     return true;
 }
+/**
+ * How many rows in scope are NOT available, per listing type.
+ *
+ * ── 🛑 WHY THIS IS NOT AN AGGREGATE COUNT ─────────────────────────────────
+ *
+ * Two independent reasons, either of which alone is disqualifying.
+ *
+ * 1. Unavailability is an OR across DIFFERENT fields (`availableQuantity == 0`
+ *    OR `isSold == true` OR `prizeRevealStatus == closed` …). Firestore cannot
+ *    express that in one query, and counting each clause separately and adding
+ *    them double-counts every row matching two of them.
+ *
+ * 2. A clause selects a SUPERSET, deliberately. `madeToOrder` is pointedly NOT
+ *    a clause (see the note in `availability.ts`), so a print-on-demand sticker
+ *    sitting at `availableQuantity: 0` matches `availableQuantity == 0` and is
+ *    nevertheless AVAILABLE. Only `isListingRowAvailable` knows that, and it is
+ *    a per-row predicate. Measured on the category that prompted this work,
+ *    a clause-count would have badged "Art & Stickers 2" over three available
+ *    rows — trading one wrong number for another.
+ *
+ * So this is Path C of `listPublicProducts` reused in miniature: one bounded
+ * query per DISTINCT clause, in parallel, merged and deduped by id, then every
+ * surviving row confirmed with the real predicate. Nine listing types collapse
+ * to five clauses, so the whole tab bar costs ~5 × 50 documents in one parallel
+ * round — the same fan-out and the same budget that scope already spends.
+ *
+ * 🛑 The queries are NOT narrowed to the tab's listing types. Firestore permits
+ * one array operator per query and the category scope already spends it on
+ * `categorySlugs array-contains-any`, so adding `listingType in (…)` risks an
+ * INVALID_ARGUMENT for no gain: unavailable rows are sparse, and tallying each
+ * row by its own `listingType` afterwards answers every tab from one pass.
+ */
+async function unavailableByType(scope, types, now) {
+    const byType = new Map();
+    const clauses = unavailableClausesFor(types);
+    if (clauses.length === 0)
+        return { byType, truncated: false };
+    const status = scope.status ?? DEFAULT_STATUS;
+    const results = await Promise.all(clauses.map(async (clause) => {
+        // An inequality must be ordered by its own field — Firestore appends it
+        // to the `orderBy` implicitly, so any other sort demands a composite
+        // index nobody declared (Root Cause #59).
+        const sorts = clause.op === "lt" && clause.sortField
+            ? sortBy(clause.sortField, "DESC")
+            : sortBy(PRODUCT_FIELDS.CREATED_AT, "DESC");
+        try {
+            return await productRepository.list({
+                filters: sieveAnd(sieveFilter(PRODUCT_FIELDS.STATUS, SIEVE_OP.EQ, status), clauseToSieve(clause, now)),
+                sorts,
+                page: 1,
+                pageSize: PUBLIC_PRODUCT_MAX_PAGE_SIZE,
+            }, {
+                storeId: scope.storeId,
+                categoriesIn: scope.categoriesIn,
+                brandName: scope.brandName,
+            });
+        }
+        catch (error) {
+            const e = normalizeError(error);
+            // ERROR, not warn: a clause that cannot run is almost always a missing
+            // composite index — a permanent, silent skew of every badge on the
+            // page rather than a transient blip.
+            serverLogger.error(`listingTabCounts: unavailable clause failed (${clause.field} ${clause.op}); badges fall back to totals`, { field: clause.field, op: clause.op, error: e.message });
+            return null;
+        }
+    }));
+    const merged = new Map();
+    let truncated = false;
+    for (const result of results) {
+        if (!result) {
+            truncated = true;
+            continue;
+        }
+        const rows = result.items;
+        if (rows.length >= PUBLIC_PRODUCT_MAX_PAGE_SIZE)
+            truncated = true;
+        for (const row of rows) {
+            const id = typeof row.id === "string" ? row.id : JSON.stringify(row.id);
+            if (!merged.has(id))
+                merged.set(id, row);
+        }
+    }
+    for (const row of merged.values()) {
+        // The clause matched a superset; this is the real answer.
+        if (isListingRowAvailable(row, now))
+            continue;
+        const type = normalizeListingType(row);
+        byType.set(type, (byType.get(type) ?? 0) + 1);
+    }
+    return { byType, truncated };
+}
+/** The listing types one tab spans — `"art|stickers"` is a pipe OR-group. */
+function typesOf(tab) {
+    return String(tab.listingType).split("|").filter(Boolean);
+}
 /**
  * Count every tab in `tabs` within `scope`, in one parallel batch.
  *
@@ -75,10 +176,12 @@ function bundleMatchesScope(bundle, scope) {
  * `stores` is not counted here: only the category page has that tab and it
  * already resolves its store list eagerly to render the tab body.
  */
-export async function listingTabCounts(tabs, scope) {
+export async function listingTabCounts(tabs, scope, opts) {
+    const now = opts?.now ?? new Date();
     const listingTabs = tabs.filter((tab) => Boolean(tab.listingType));
     const wantsBundles = tabs.some((tab) => tab.collection === "bundles");
-    const [typeCounts, bundleCount] = await Promise.all([
+    const allTypes = [...new Set(listingTabs.flatMap(typesOf))];
+    const [typeCounts, bundleCount, unavailable] = await Promise.all([
         productRepository.countByListingTypes(listingTabs.map((tab) => String(tab.listingType)), {
             status: scope.status ?? DEFAULT_STATUS,
             storeId: scope.storeId,
@@ -86,12 +189,27 @@ export async function listingTabCounts(tabs, scope) {
             brandName: scope.brandName,
         }),
         wantsBundles ? countBundles(scope) : Promise.resolve(undefined),
+        unavailableByType(scope, allTypes, now),
     ]);
-    const counts = {};
+    const total = {};
+    const available = {};
     for (const tab of listingTabs) {
-        counts[tab.id] = typeCounts[String(tab.listingType)];
+        const totalForTab = typeCounts[String(tab.listingType)];
+        total[tab.id] = totalForTab;
+        if (totalForTab === undefined || unavailable.truncated) {
+            // Unknown beats a number that is quietly too high. Falling back to the
+            // total reproduces the pre-2026-10-20 badge rather than inventing one.
+            available[tab.id] = totalForTab;
+            continue;
+        }
+        const gone = typesOf(tab).reduce((sum, type) => sum + (unavailable.byType.get(type) ?? 0), 0);
+        available[tab.id] = Math.max(0, totalForTab - gone);
+    }
+    if (wantsBundles) {
+        // A bundle has no availability scope of its own — the bundles tab renders
+        // active bundle ROWS, not products, so the two numbers are one number.
+        total.bundles = bundleCount;
+        available.bundles = bundleCount;
     }
-    if (wantsBundles)
-        counts.bundles = bundleCount;
-    return counts;
+    return { available, total };
 }

package/dist/_internal/server/features/stores/tabs.d.ts

@@ -1,5 +1,5 @@
 import { isListingTypeEnabled } from "../../../shared/listing-types/feature-flags";
-import { type ListingTabCounts } from "../products/listing-tab-counts";
+import { type ListingTabCountResult } from "../products/listing-tab-counts";
 type SiteSettingsSnapshot = Parameters<typeof isListingTypeEnabled>[1];
 export interface StoreTabLink {
     value: string;
@@ -11,7 +11,12 @@ export interface ResolvedStoreTabs {
     dropdownTabs: StoreTabLink[];
     /** Coupons (if any), Reviews (if any), About — always non-empty. */
     tabs: StoreTabLink[];
-    listingCounts: ListingTabCounts;
+    /**
+     * Both numbers, because they answer different questions: `available` is what
+     * each tab badges, `total` is what decides whether the tab exists at all.
+     * See `ListingTabCountResult`.
+     */
+    listingCounts: ListingTabCountResult;
     couponsCount: number;
     reviewsCount: number;
 }

package/dist/_internal/server/features/stores/tabs.js

@@ -73,7 +73,7 @@ export async function resolveStoreTabs(storeSlug, storeId, settings) {
                 .then((r) => r.total)
                 .catch(() => 0),
         ])
-        : [{}, 0, 0];
+        : [{ available: {}, total: {} }, 0, 0];
     const visibleStoreTabs = STORE_PAGE_TABS.filter((tab) => {
         if (tab.id === "bundles") {
             if (!isCategoryTypeEnabled("bundle", settings))
@@ -92,12 +92,14 @@ export async function resolveStoreTabs(storeSlug, storeId, settings) {
         // that leads to an empty page. `undefined` means the count query FAILED,
         // not zero, so the tab stays visible rather than hiding real stock
         // behind a swallowed error (Root Cause #59).
-        const count = listingCounts[tab.id];
+        // TOTAL, not the badge: a tab whose rows have all ended still has an
+        // archive behind the Ended/All scopes, and hiding it would strand that.
+        const count = listingCounts.total[tab.id];
         return count === undefined || count > 0;
     });
     const dropdownTabs = visibleStoreTabs.map((tab) => ({
         value: tab.id,
-        label: tabLabel(tab.label, listingCounts[tab.id]),
+        label: tabLabel(tab.label, listingCounts.available[tab.id]),
         href: STORE_LISTING_HREF[tab.id](storeSlug),
     }));
     const tabs = [

package/dist/_internal/shared/search/match.js

@@ -119,6 +119,30 @@ export function prepareIndex(artifact) {
         };
     });
 }
+/**
+ * The shortest term allowed to match MID-WORD.
+ *
+ * 🛑 This exists because of a reported bug, and the mechanism is worth stating:
+ * the substring tier is `flat.includes(term)`, and for a one-character term
+ * that is satisfied by almost every record in the artifact. A category's
+ * `detail` is its " › "-joined path, so `"g"` matches
+ * `"Spinning Tops › Beyblade Original › Dragoon Line"` on the `g` in
+ * "Spinning". AND semantics then cannot narrow anything: `"dragoon g"` scored
+ * identically to `"dragoon"` and returned every Dragoon in the catalogue —
+ * which is the "even if I type dragoon g the results show everything"
+ * complaint, and it was never the AND logic's fault.
+ *
+ * 🛑 It does NOT reintroduce a minimum query length. This module's header is
+ * explicit that typing `"d"` and seeing something is what a local index is FOR,
+ * and it still does: the EXACT and PREFIX tiers are untouched, so a
+ * one-character term still matches any word starting with it. Only the mid-word
+ * tier is gated, because one character appearing somewhere inside a string is
+ * not evidence of intent.
+ *
+ * Two rather than three: `"cx"`, `"bu"`, `"gt"` and `"1b"` are real product
+ * vocabulary a collector types, and they discriminate.
+ */
+const MIN_SUBSTRING_TERM = 2;
 /** Best match quality for one term against one field. 0 means no match. */
 function fieldScore(term, words, flat) {
     if (!flat)
@@ -129,8 +153,10 @@ function fieldScore(term, words, flat) {
     for (const w of words)
         if (w.startsWith(term))
             return S_PREFIX;
-    // Mid-word. The capability the token index cannot have.
-    if (flat.includes(term))
+    // Mid-word. The capability the token index cannot have — but see
+    // MIN_SUBSTRING_TERM: for a single character it is not a capability, it is a
+    // match against everything.
+    if (term.length >= MIN_SUBSTRING_TERM && flat.includes(term))
         return S_SUBSTRING;
     return 0;
 }

package/dist/constants/api-endpoints.d.ts

@@ -301,6 +301,13 @@ export declare const TOOL_ENDPOINTS: {
      * is the multi-get `searchPriceIndex` otherwise pays for every lookup.
      */
     readonly PRICE_INDEX_BANDS: (ids: readonly string[]) => string;
+    /**
+     * The competitor-crawl market band for the same leaves — SIGNED-IN ONLY, and
+     * therefore a separate request from `PRICE_INDEX_BANDS` rather than more
+     * fields on it. That route is public and edge-cached; this one must not be,
+     * or one signed-in lookup populates an entry every guest reads.
+     */
+    readonly PRICE_INDEX_MARKET: (ids: readonly string[]) => string;
 };
 /**
  * The sticker-sheet kiss-cut tracer. Admin-only, every route behind

package/dist/constants/api-endpoints.js

@@ -348,6 +348,13 @@ export const TOOL_ENDPOINTS = {
      * is the multi-get `searchPriceIndex` otherwise pays for every lookup.
      */
     PRICE_INDEX_BANDS: (ids) => `/api/tools/price-index/bands?ids=${ids.map(encodeURIComponent).join(",")}`,
+    /**
+     * The competitor-crawl market band for the same leaves — SIGNED-IN ONLY, and
+     * therefore a separate request from `PRICE_INDEX_BANDS` rather than more
+     * fields on it. That route is public and edge-cached; this one must not be,
+     * or one signed-in lookup populates an entry every guest reads.
+     */
+    PRICE_INDEX_MARKET: (ids) => `/api/tools/price-index/market?ids=${ids.map(encodeURIComponent).join(",")}`,
 };
 /**
  * The sticker-sheet kiss-cut tracer. Admin-only, every route behind

package/dist/features/auctions/components/AuctionDetailPageView.js

@@ -27,6 +27,7 @@ import { RelatedProducts } from "../../products/components/RelatedProducts.js";
 import { ProductGalleryClient } from "../../products/components/ProductGalleryClient.js";
 import { ProductFeatureBadges } from "../../products/components/ProductFeatureBadges.js";
 import { FeatureBadgeList } from "../../products/components/FeatureBadge.js";
+import { productImageUrls } from "../../products/schemas/firestore.js";
 import { HistoryTracker } from "../../history/components/HistoryTracker.js";
 import { ShareButton } from "../../products/components/ShareButton.js";
 import { MarketplaceAuctionGrid } from "./MarketplaceAuctionGrid.js";
@@ -149,8 +150,12 @@ export async function AuctionDetailPageView({ id, initialAuction, onPlaceBid, on
             ? p.price
             : 0;
     const minBidIncrementOverride = typeof p.minBidIncrement === "number" ? p.minBidIncrement : undefined;
-    const images = Array.isArray(p.images)
-        ? p.images
+    // `images` is `ProductImage[]` since A6 — `productImageUrls` is the one
+    // normaliser (it also accepts the legacy `string[]`). Casting it to
+    // `string[]` handed the gallery objects and rendered a placeholder.
+    const galleryUrls = productImageUrls(p.images);
+    const images = galleryUrls.length > 0
+        ? galleryUrls
         : typeof p.mainImage === "string"
             ? [p.mainImage]
             : [];
@@ -206,11 +211,7 @@ export async function AuctionDetailPageView({ id, initialAuction, onPlaceBid, on
     });
     return (_jsxs(Main, { children: [_jsx(HistoryTracker, { productId: String(p.id ?? p.slug ?? ""), productType: "auction", snapshot: {
                     title: typeof p.title === "string" ? p.title : undefined,
-                    thumb: typeof p.mainImage === "string"
-                        ? p.mainImage
-                        : Array.isArray(p.images) && typeof p.images[0] === "string"
-                            ? p.images[0]
-                            : undefined,
+                    thumb: typeof p.mainImage === "string" ? p.mainImage : images[0],
                     price: typeof p.price === "number" ? p.price : undefined,
                     storeId: typeof p.storeId === "string" ? p.storeId : undefined,
                     storeName: typeof p.storeName === "string" ? p.storeName : undefined,

package/dist/features/categories/api/[id]/price-guidance/route.js

@@ -43,30 +43,7 @@ import { getProviders } from "../../../../../contracts/index.js";
 import { categoriesRepository } from "../../../repository/categories.repository.js";
 import { isAdminUser } from "../../../../auth/role-predicates.js";
 import { priceGuidanceOnSellerBasis, describePriceGuidanceBasis, } from "../../../../../_internal/shared/features/categories/price-guidance.js";
-const MAX_ANCESTORS = 8;
-/**
- * Nearest-first ancestor walk for `priceGuidance`, same shape as
- * `description-template/route.ts`'s `resolveInherited` — the leaf's own band
- * wins, and only a leaf with none falls back to the nearest ancestor that has
- * one. ONE bounded `findByIds`, not a sequential walk: a seller form hitting
- * this on every category change should not pay up to eight round trips for it.
- */
-async function resolveInheritedGuidance(leaf) {
-    if (leaf.productDefaults?.priceGuidance)
-        return leaf.productDefaults.priceGuidance;
-    const parentIds = (leaf.parentIds ?? []).slice(0, MAX_ANCESTORS);
-    if (parentIds.length === 0)
-        return undefined;
-    const nearestFirst = [...parentIds].reverse();
-    const ancestors = await categoriesRepository.findByIds(nearestFirst);
-    const byId = new Map(ancestors.map((a) => [a.id, a]));
-    for (const pid of nearestFirst) {
-        const guidance = byId.get(pid)?.productDefaults?.priceGuidance;
-        if (guidance)
-            return guidance;
-    }
-    return undefined;
-}
+import { resolveInheritedGuidance, } from "../../../../../_internal/server/features/categories/price-guidance-resolve.js";
 export const GET = createRouteHandler({
     roles: ["seller", "admin", "moderator"],
     handler: async ({ user, params }) => {

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

@@ -60,7 +60,7 @@ export async function BrandDetailPageView({ slug, initialBrand }) {
         // therefore never hide, however empty the brand was.
         brandName
             ? listingTabCounts(CATEGORY_PAGE_TABS, { brandName })
-            : Promise.resolve({}),
+            : Promise.resolve({ available: {}, total: {} }),
         // SB-UNI-D — bundles are categoryType:"bundle" rows on the categories
         // collection, tagged to a brand via the real brandSlug field (added
         // 2026-08-21 — previously a fragile seo.keywords string-match heuristic).
@@ -108,15 +108,23 @@ export async function BrandDetailPageView({ slug, initialBrand }) {
     // Keyed by tabSlug. `bundles` is overridden with the brand-scoped figure —
     // `listingTabCounts` cannot narrow bundles by brand (a bundle's brand lives on
     // `brandSlug`, which this page already filters on locally).
+    // Badge = available scope; hiding + the header pill = total. See the same
+    // split in `CategoryDetailPageView` and `ListingTabCountResult`.
     const counts = {
-        ...tabCounts,
-        products: tabCounts.products ?? brand?.metrics?.productCount ?? 0,
-        auctions: tabCounts.auctions ?? brand?.metrics?.auctionCount ?? 0,
+        ...tabCounts.available,
+        products: tabCounts.available.products ?? brand?.metrics?.productCount ?? 0,
+        auctions: tabCounts.available.auctions ?? brand?.metrics?.auctionCount ?? 0,
+        bundles: brandBundles.length,
+    };
+    const totals = {
+        ...tabCounts.total,
+        products: tabCounts.total.products ?? brand?.metrics?.productCount ?? 0,
+        auctions: tabCounts.total.auctions ?? brand?.metrics?.auctionCount ?? 0,
         bundles: brandBundles.length,
     };
     // Header total — `?? 0` is right here (a pill just doesn't render), unlike the
     // tab bar where an unknown count must keep its tab visible.
-    const totalItems = Object.values(counts).reduce((sum, n) => sum + (n ?? 0), 0);
+    const totalItems = Object.values(totals).reduce((sum, n) => sum + (n ?? 0), 0);
     /*
      * ── D4: structured data on the brand page ───────────────────────────────
      *
@@ -168,5 +176,5 @@ export async function BrandDetailPageView({ slug, initialBrand }) {
     const ldFaq = brand?.faqs && brand.faqs.length > 0
         ? faqJsonLd(brand.faqs.map((f) => ({ question: f.question, answer: f.answer })))
         : null;
-    return (_jsxs(Main, { children: [_jsx("script", { type: "application/ld+json", dangerouslySetInnerHTML: { __html: JSON.stringify(ldBreadcrumb) } }), _jsx("script", { type: "application/ld+json", dangerouslySetInnerHTML: { __html: JSON.stringify(ldCollection) } }), ldFaq && (_jsx("script", { type: "application/ld+json", dangerouslySetInnerHTML: { __html: JSON.stringify(ldFaq) } })), _jsxs(Section, { className: `relative ${__O.hidden} ${hasCover ? "min-h-[220px] md:min-h-[280px]" : "bg-[var(--appkit-color-bg)]"}`, children: [hasCover && (_jsxs(_Fragment, { children: [_jsx(Div, { className: "absolute inset-0", children: _jsx(MediaImage, { src: coverImage, alt: "", size: "banner" }) }), _jsx(Div, { surface: "overlay-md", className: "absolute inset-0" })] })), !hasCover && (_jsx(DynamicBgDiv, { color: brandColor, className: "absolute inset-0 opacity-10" })), _jsxs(Div, { className: "relative z-10 max-w-7xl mx-auto", paddingY: hasCover ? "y-3xl" : "y-xl", padding: "x-md", children: [_jsxs(Nav, { layout: "flex", gap: "2xs", textSize: "sm", className: "mb-4", "aria-label": "Breadcrumb", children: [_jsx(Link, { href: String(ROUTES.HOME), className: hasCover ? "text-white/70 hover:text-white transition-colors" : "text-[var(--appkit-color-text-muted)] hover:text-primary-600 dark:hover:text-primary-400 transition-colors", children: "Home" }), _jsx(Span, { className: hasCover ? "text-white/40" : "text-zinc-400", children: "/" }), _jsx(Link, { href: String(ROUTES.PUBLIC.BRANDS), className: hasCover ? "text-white/70 hover:text-white transition-colors" : "text-[var(--appkit-color-text-muted)] hover:text-primary-600 dark:hover:text-primary-400 transition-colors", children: "Brands" }), _jsx(Span, { className: hasCover ? "text-white/40" : "text-zinc-400", children: "/" }), _jsx(Span, { weight: "medium", className: hasCover ? "text-white" : "text-[var(--appkit-color-text)]", children: brand?.name ?? slug })] }), _jsxs(Row, { className: "mb-3", align: "center", gap: "md", children: [brand?.display?.icon && (_jsx(Span, { className: "leading-none", size: "5xl", children: brand.display.icon })), _jsxs(_Fragment, { children: [_jsx(Heading, { color: "inverse", level: 1, className: `${hasCover ? "" : "text-[var(--appkit-color-text)]"}`, size: "3xl", mdSize: "4xl", weight: "bold", children: brand?.name ?? slug }), brand?.description && typeof brand.description === "string" && !brand.description.startsWith("{") && (_jsx(Text, { color: hasCover ? "inverse" : "muted", className: `max-w-2xl mt-1 ${hasCover ? "/80" : ""}`, size: "base", children: brand.description }))] })] }), _jsxs(Row, { gap: "sm", wrap: true, className: "mt-3", children: [(counts.products ?? 0) > 0 && (_jsxs(Span, { layout: "inline-flex", gap: "xs", color: "inverse", size: "xs", weight: "medium", className: `${hasCover ? "bg-[rgba(255,255,255,0.2)] backdrop-blur-sm" : "bg-primary/10 text-primary-700 dark:text-primary-400"}`, rounded: "full", padding: "pill-sm-tall", children: [counts.products.toLocaleString(), " ", counts.products === 1 ? "product" : "products"] })), (counts.auctions ?? 0) > 0 && (_jsxs(Span, { layout: "inline-flex", gap: "xs", color: hasCover ? "inverse" : "warning", surface: hasCover ? undefined : "warning-surface", size: "xs", weight: "medium", className: hasCover ? "bg-[rgba(255,255,255,0.2)] backdrop-blur-sm" : "", rounded: "full", padding: "pill-sm-tall", children: [counts.auctions.toLocaleString(), " ", counts.auctions === 1 ? "auction" : "auctions"] })), (counts["pre-orders"] ?? 0) > 0 && (_jsxs(Span, { layout: "inline-flex", gap: "xs", color: hasCover ? "inverse" : "info", surface: hasCover ? undefined : "info-surface", size: "xs", weight: "medium", className: hasCover ? "bg-[rgba(255,255,255,0.2)] backdrop-blur-sm" : "", rounded: "full", padding: "pill-sm-tall", children: [counts["pre-orders"].toLocaleString(), " ", counts["pre-orders"] === 1 ? "pre-order" : "pre-orders"] })), totalItems === 0 && (_jsx(Span, { size: "sm", className: hasCover ? "text-white/60" : "text-zinc-400", children: "No items listed yet" }))] })] })] }), (brand?.brandWebsite || brand?.brandCountry || brand?.brandFounded) && (_jsx(Section, { border: "subtle", surface: "default", className: "border-b", padding: "y-md", children: _jsx(Container, { size: "xl", children: _jsxs(Stack, { gap: "sm", children: [_jsx(Heading, { level: 2, size: "sm", weight: "semibold", color: "muted", transform: "uppercase", children: "About this brand" }), _jsxs(Dl, { divide: "subtle", rounded: "xl", border: "subtle", className: "overflow-hidden max-w-lg", children: [brand?.brandWebsite && (_jsxs(Row, { gap: "md", oddEven: "zebra", surface: "default", padding: "inline", children: [_jsx(Dt, { className: "w-32 flex-shrink-0", color: "primary", weight: "medium", children: "Website" }), _jsx(Dd, { className: "flex-1", children: _jsx(Anchor, { href: brand.brandWebsite, tone: "brand", underline: "hover", children: brand.brandWebsite }) })] })), brand?.brandCountry && (_jsxs(Row, { gap: "md", oddEven: "zebra", surface: "default", padding: "inline", children: [_jsx(Dt, { className: "w-32 flex-shrink-0", color: "primary", weight: "medium", children: "Country" }), _jsx(Dd, { className: "flex-1", color: "muted", children: brand.brandCountry })] })), brand?.brandFounded && (_jsxs(Row, { gap: "md", oddEven: "zebra", surface: "default", padding: "inline", children: [_jsx(Dt, { className: "w-32 flex-shrink-0", color: "primary", weight: "medium", children: "Founded" }), _jsx(Dd, { className: "flex-1", color: "muted", children: brand.brandFounded })] }))] })] }) }) })), brandContentBody && brandContentBody.trim().length > 0 && (_jsx(Section, { padding: "y-lg", children: _jsx(Container, { size: "xl", children: _jsx(RichTextRenderer, { html: brandContentBody }) }) })), _jsx(CategoryHighlightsAndFaqSection, { highlights: brand?.highlights, faqs: brand?.faqs }), _jsx(Section, { padding: "y-lg", children: _jsx(Container, { size: "xl", children: brandName ? (_jsx(BrandDetailTabs, { brandName: brandName, initialProductsData: productsResult ?? undefined, initialBundles: brandBundles, counts: counts, enabledListingTypes: enabledListingTypes(settings), enabledCategoryTypes: enabledCategoryTypes(settings) })) : (_jsx(Text, { paddingY: "3xl", color: "muted", size: "sm", align: "start", children: "Brand not found." })) }) }), groupedListings.length > 0 && (_jsx(Section, { padding: "y-lg", children: _jsx(Container, { size: "xl", children: _jsx(GroupedListingsCarousel, { groups: groupedListings }) }) })), relatedBrands.length > 0 && (_jsx(Section, { border: "subtle", surface: "default", className: "border-t", padding: "y-lg", children: _jsxs(Container, { size: "xl", children: [_jsx(Heading, { level: 2, className: "mb-4", size: "xl", weight: "semibold", children: "Related Brands" }), _jsx(CategoryGrid, { categories: relatedBrands, getHref: (b) => String(ROUTES.PUBLIC.BRAND_DETAIL(b.slug)) })] }) }))] }));
+    return (_jsxs(Main, { children: [_jsx("script", { type: "application/ld+json", dangerouslySetInnerHTML: { __html: JSON.stringify(ldBreadcrumb) } }), _jsx("script", { type: "application/ld+json", dangerouslySetInnerHTML: { __html: JSON.stringify(ldCollection) } }), ldFaq && (_jsx("script", { type: "application/ld+json", dangerouslySetInnerHTML: { __html: JSON.stringify(ldFaq) } })), _jsxs(Section, { className: `relative ${__O.hidden} ${hasCover ? "min-h-[220px] md:min-h-[280px]" : "bg-[var(--appkit-color-bg)]"}`, children: [hasCover && (_jsxs(_Fragment, { children: [_jsx(Div, { className: "absolute inset-0", children: _jsx(MediaImage, { src: coverImage, alt: "", size: "banner" }) }), _jsx(Div, { surface: "overlay-md", className: "absolute inset-0" })] })), !hasCover && (_jsx(DynamicBgDiv, { color: brandColor, className: "absolute inset-0 opacity-10" })), _jsxs(Div, { className: "relative z-10 max-w-7xl mx-auto", paddingY: hasCover ? "y-3xl" : "y-xl", padding: "x-md", children: [_jsxs(Nav, { layout: "flex", gap: "2xs", textSize: "sm", className: "mb-4", "aria-label": "Breadcrumb", children: [_jsx(Link, { href: String(ROUTES.HOME), className: hasCover ? "text-white/70 hover:text-white transition-colors" : "text-[var(--appkit-color-text-muted)] hover:text-primary-600 dark:hover:text-primary-400 transition-colors", children: "Home" }), _jsx(Span, { className: hasCover ? "text-white/40" : "text-zinc-400", children: "/" }), _jsx(Link, { href: String(ROUTES.PUBLIC.BRANDS), className: hasCover ? "text-white/70 hover:text-white transition-colors" : "text-[var(--appkit-color-text-muted)] hover:text-primary-600 dark:hover:text-primary-400 transition-colors", children: "Brands" }), _jsx(Span, { className: hasCover ? "text-white/40" : "text-zinc-400", children: "/" }), _jsx(Span, { weight: "medium", className: hasCover ? "text-white" : "text-[var(--appkit-color-text)]", children: brand?.name ?? slug })] }), _jsxs(Row, { className: "mb-3", align: "center", gap: "md", children: [brand?.display?.icon && (_jsx(Span, { className: "leading-none", size: "5xl", children: brand.display.icon })), _jsxs(_Fragment, { children: [_jsx(Heading, { color: "inverse", level: 1, className: `${hasCover ? "" : "text-[var(--appkit-color-text)]"}`, size: "3xl", mdSize: "4xl", weight: "bold", children: brand?.name ?? slug }), brand?.description && typeof brand.description === "string" && !brand.description.startsWith("{") && (_jsx(Text, { color: hasCover ? "inverse" : "muted", className: `max-w-2xl mt-1 ${hasCover ? "/80" : ""}`, size: "base", children: brand.description }))] })] }), _jsxs(Row, { gap: "sm", wrap: true, className: "mt-3", children: [(counts.products ?? 0) > 0 && (_jsxs(Span, { layout: "inline-flex", gap: "xs", color: "inverse", size: "xs", weight: "medium", className: `${hasCover ? "bg-[rgba(255,255,255,0.2)] backdrop-blur-sm" : "bg-primary/10 text-primary-700 dark:text-primary-400"}`, rounded: "full", padding: "pill-sm-tall", children: [counts.products.toLocaleString(), " ", counts.products === 1 ? "product" : "products"] })), (counts.auctions ?? 0) > 0 && (_jsxs(Span, { layout: "inline-flex", gap: "xs", color: hasCover ? "inverse" : "warning", surface: hasCover ? undefined : "warning-surface", size: "xs", weight: "medium", className: hasCover ? "bg-[rgba(255,255,255,0.2)] backdrop-blur-sm" : "", rounded: "full", padding: "pill-sm-tall", children: [counts.auctions.toLocaleString(), " ", counts.auctions === 1 ? "auction" : "auctions"] })), (counts["pre-orders"] ?? 0) > 0 && (_jsxs(Span, { layout: "inline-flex", gap: "xs", color: hasCover ? "inverse" : "info", surface: hasCover ? undefined : "info-surface", size: "xs", weight: "medium", className: hasCover ? "bg-[rgba(255,255,255,0.2)] backdrop-blur-sm" : "", rounded: "full", padding: "pill-sm-tall", children: [counts["pre-orders"].toLocaleString(), " ", counts["pre-orders"] === 1 ? "pre-order" : "pre-orders"] })), totalItems === 0 && (_jsx(Span, { size: "sm", className: hasCover ? "text-white/60" : "text-zinc-400", children: "No items listed yet" }))] })] })] }), (brand?.brandWebsite || brand?.brandCountry || brand?.brandFounded) && (_jsx(Section, { border: "subtle", surface: "default", className: "border-b", padding: "y-md", children: _jsx(Container, { size: "xl", children: _jsxs(Stack, { gap: "sm", children: [_jsx(Heading, { level: 2, size: "sm", weight: "semibold", color: "muted", transform: "uppercase", children: "About this brand" }), _jsxs(Dl, { divide: "subtle", rounded: "xl", border: "subtle", className: "overflow-hidden max-w-lg", children: [brand?.brandWebsite && (_jsxs(Row, { gap: "md", oddEven: "zebra", surface: "default", padding: "inline", children: [_jsx(Dt, { className: "w-32 flex-shrink-0", color: "primary", weight: "medium", children: "Website" }), _jsx(Dd, { className: "flex-1", children: _jsx(Anchor, { href: brand.brandWebsite, tone: "brand", underline: "hover", children: brand.brandWebsite }) })] })), brand?.brandCountry && (_jsxs(Row, { gap: "md", oddEven: "zebra", surface: "default", padding: "inline", children: [_jsx(Dt, { className: "w-32 flex-shrink-0", color: "primary", weight: "medium", children: "Country" }), _jsx(Dd, { className: "flex-1", color: "muted", children: brand.brandCountry })] })), brand?.brandFounded && (_jsxs(Row, { gap: "md", oddEven: "zebra", surface: "default", padding: "inline", children: [_jsx(Dt, { className: "w-32 flex-shrink-0", color: "primary", weight: "medium", children: "Founded" }), _jsx(Dd, { className: "flex-1", color: "muted", children: brand.brandFounded })] }))] })] }) }) })), brandContentBody && brandContentBody.trim().length > 0 && (_jsx(Section, { padding: "y-lg", children: _jsx(Container, { size: "xl", children: _jsx(RichTextRenderer, { html: brandContentBody }) }) })), _jsx(CategoryHighlightsAndFaqSection, { highlights: brand?.highlights, faqs: brand?.faqs }), _jsx(Section, { padding: "y-lg", children: _jsx(Container, { size: "xl", children: brandName ? (_jsx(BrandDetailTabs, { brandName: brandName, initialProductsData: productsResult ?? undefined, initialBundles: brandBundles, counts: counts, totals: totals, enabledListingTypes: enabledListingTypes(settings), enabledCategoryTypes: enabledCategoryTypes(settings) })) : (_jsx(Text, { paddingY: "3xl", color: "muted", size: "sm", align: "start", children: "Brand not found." })) }) }), groupedListings.length > 0 && (_jsx(Section, { padding: "y-lg", children: _jsx(Container, { size: "xl", children: _jsx(GroupedListingsCarousel, { groups: groupedListings }) }) })), relatedBrands.length > 0 && (_jsx(Section, { border: "subtle", surface: "default", className: "border-t", padding: "y-lg", children: _jsxs(Container, { size: "xl", children: [_jsx(Heading, { level: 2, className: "mb-4", size: "xl", weight: "semibold", children: "Related Brands" }), _jsx(CategoryGrid, { categories: relatedBrands, getHref: (b) => String(ROUTES.PUBLIC.BRAND_DETAIL(b.slug)) })] }) }))] }));
 }

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

@@ -10,10 +10,16 @@ export interface BrandDetailTabsProps {
      * inventory (Root Cause #59). Keyed by tab id; the previous hand-named shape
      * covered only 5 of 9 tabs (Root Cause #61).
      */
+    /** Badge counts — what the default (available) scope will render. */
     counts?: Record<string, number | undefined>;
+    /**
+     * Every published row per tab, all availability scopes. Drives hide-at-zero
+     * and the "N ended — show all" hint; see `ListingTabCountResult`.
+     */
+    totals?: Record<string, number | undefined>;
     /** Enabled listing types (e.g. ["standard","auction"]). When omitted, all tabs shown. */
     enabledListingTypes?: string[];
     /** Enabled category types (e.g. ["category","brand","bundle"]). When omitted, all tabs shown. */
     enabledCategoryTypes?: string[];
 }
-export declare function BrandDetailTabs({ brandName, initialProductsData, initialBundles, counts, enabledListingTypes, enabledCategoryTypes, }: BrandDetailTabsProps): React.JSX.Element;
+export declare function BrandDetailTabs({ brandName, initialProductsData, initialBundles, counts, totals, enabledListingTypes, enabledCategoryTypes, }: BrandDetailTabsProps): React.JSX.Element;

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

@@ -2,6 +2,7 @@
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import { useState } from "react";
 import { EmptyState, Tabs, TabsList, TabsTrigger } from "../../../ui/index.js";
+import { AvailabilityScopeHint } from "../../products/components/AvailabilityScopeHint.js";
 import { CategoryProductsListing } from "./CategoryProductsListing.js";
 import { AuctionsIndexListing } from "../../products/components/AuctionsIndexListing.js";
 import { PreOrdersIndexListing } from "../../pre-orders/components/PreOrdersIndexListing.js";
@@ -28,6 +29,18 @@ const TAB_TYPE_MAP = {
     ])),
     bundles: { kind: "category", type: "bundle" },
 };
+/**
+ * The listing types a tab spans, for the availability-scope hint. Derived
+ * from the same maps the tabs render from, never hand-written (Root Cause
+ * #61).
+ */
+function typesForTab(id) {
+    const generic = GENERIC_TAB_LISTING_TYPES[id];
+    if (generic)
+        return generic;
+    const mapping = TAB_TYPE_MAP[id];
+    return mapping?.kind === "listing" ? [mapping.type] : [];
+}
 /** Listing types rendered by the shared products listing rather than a dedicated one. */
 const GENERIC_TAB_LISTING_TYPES = {
     [pluginFor("standard").tabSlug]: ["standard"],
@@ -46,8 +59,9 @@ const GENERIC_TAB_LISTING_TYPES = {
      */
     [pluginFor("spares").tabSlug]: ["spares"],
 };
-export function BrandDetailTabs({ brandName, initialProductsData, initialBundles = [], counts, enabledListingTypes, enabledCategoryTypes, }) {
+export function BrandDetailTabs({ brandName, initialProductsData, initialBundles = [], counts, totals, enabledListingTypes, enabledCategoryTypes, }) {
     const countFor = (id) => counts?.[id];
+    const totalFor = (id) => totals?.[id] ?? counts?.[id];
     const visibleTabs = CATEGORY_PAGE_TABS.filter((t) => {
         const mapping = TAB_TYPE_MAP[t.id];
         // A tab with no mapping has no render branch below and would show a blank
@@ -67,7 +81,8 @@ export function BrandDetailTabs({ brandName, initialProductsData, initialBundles
         // Hide a tab only when its count is known and explicitly zero. `undefined`
         // now means the count query FAILED (every tab is counted), so the tab stays
         // visible rather than hiding real listings behind a swallowed error.
-        const count = countFor(t.id);
+        // TOTAL, not the badge — see the same note in CategoryDetailTabs.
+        const count = totalFor(t.id);
         return count === undefined || count > 0;
     });
     const firstTabId = (visibleTabs[0]?.id ?? "products");
@@ -75,5 +90,5 @@ export function BrandDetailTabs({ brandName, initialProductsData, initialBundles
     if (visibleTabs.length === 0) {
         return (_jsx(EmptyState, { title: "Nothing listed here yet", description: "This brand has no active listings right now. Check back soon." }));
     }
-    return (_jsxs(_Fragment, { children: [_jsx(Tabs, { value: activeTab, onChange: (v) => setActiveTab(v), className: "mb-6", children: _jsx(TabsList, { children: visibleTabs.map((t) => (_jsx(TabsTrigger, { value: t.id, badge: countFor(t.id), children: t.label }, t.id))) }) }), GENERIC_TAB_LISTING_TYPES[activeTab] && (_jsx(CategoryProductsListing, { categorySlug: "", brandName: brandName, listingTypes: GENERIC_TAB_LISTING_TYPES[activeTab], initialData: activeTab === pluginFor("standard").tabSlug ? initialProductsData : undefined })), activeTab === pluginFor("auction").tabSlug && (_jsx(AuctionsIndexListing, { brandName: brandName })), activeTab === pluginFor("pre-order").tabSlug && (_jsx(PreOrdersIndexListing, { brandName: brandName })), activeTab === pluginFor("prize-draw").tabSlug && (_jsx(PrizeDrawsIndexListing, { brandName: brandName })), activeTab === "bundles" && (_jsx(CategoryBundlesListing, { initialBundles: initialBundles, brandName: brandName }))] }));
+    return (_jsxs(_Fragment, { children: [_jsx(Tabs, { value: activeTab, onChange: (v) => setActiveTab(v), className: "mb-6", children: _jsx(TabsList, { children: visibleTabs.map((t) => (_jsx(TabsTrigger, { value: t.id, badge: countFor(t.id), children: t.label }, t.id))) }) }), _jsx(AvailabilityScopeHint, { total: totalFor(activeTab), available: countFor(activeTab), types: typesForTab(activeTab) }), GENERIC_TAB_LISTING_TYPES[activeTab] && (_jsx(CategoryProductsListing, { categorySlug: "", brandName: brandName, listingTypes: GENERIC_TAB_LISTING_TYPES[activeTab], initialData: activeTab === pluginFor("standard").tabSlug ? initialProductsData : undefined })), activeTab === pluginFor("auction").tabSlug && (_jsx(AuctionsIndexListing, { brandName: brandName })), activeTab === pluginFor("pre-order").tabSlug && (_jsx(PreOrdersIndexListing, { brandName: brandName })), activeTab === pluginFor("prize-draw").tabSlug && (_jsx(PrizeDrawsIndexListing, { brandName: brandName })), activeTab === "bundles" && (_jsx(CategoryBundlesListing, { initialBundles: initialBundles, brandName: brandName }))] }));
 }

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

@@ -16,10 +16,11 @@ import { MediaImage } from "../../media/MediaImage.js";
 import { ImageLightbox } from "../../../ui/components/ImageLightbox.js";
 import { ROUTES } from "../../../next/routing/route-map.js";
 import { formatCurrency } from "../../../utils/number.formatter.js";
+import { productImageUrls } from "../../products/schemas/firestore.js";
 const PLACEHOLDER_EMOJI = "📦";
 function toGalleryImages(members, canSeePrices) {
     return members.map((p, i) => ({
-        src: p.mainImage ?? p.images?.[0] ?? "",
+        src: p.mainImage || productImageUrls(p.images)[0] || "",
         alt: p.title,
         badge: `#${i + 1}`,
         caption: p.title,
@@ -46,7 +47,7 @@ export function BundleCollage({ members, onItemClick }) {
         return null;
     const galleryImages = toGalleryImages(members, canSeePrices);
     return (_jsxs(_Fragment, { children: [_jsx(Grid, { cols: "categoryCards", gap: "3", children: members.map((p, idx) => {
-                    const cover = p.mainImage ?? p.images?.[0];
+                    const cover = p.mainImage || productImageUrls(p.images)[0];
                     const href = String(ROUTES.PUBLIC.PRODUCT_DETAIL?.(p.slug ?? p.id) ?? "#");
                     return (_jsxs(Div, { layout: "flex-col", className: "group relative overflow-hidden border border-[var(--appkit-color-border)] bg-[var(--appkit-color-surface)] transition-transform hover:scale-[1.01]", rounded: "lg", children: [_jsx(Button, { variant: "ghost", type: "button", onClick: makeBundleItemClickHandler(p, idx, onItemClick, setLightboxIndex), paddingX: "none", paddingY: "none", rounded: "none", className: "relative aspect-square w-full overflow-hidden focus-visible:ring-2 focus-visible:ring-[var(--appkit-color-primary)]", "aria-label": `View ${p.title} in lightbox`, children: _jsxs(Div, { className: "relative aspect-square w-full", children: [cover ? (_jsx(MediaImage, { src: cover, alt: p.title, size: "card", className: "transition-transform group-hover:scale-105" })) : (_jsx(Row, { textSize: "3xl", surface: "muted", className: "absolute inset-0", align: "center", justify: "center", children: PLACEHOLDER_EMOJI })), _jsxs(Div, { textWeight: "semibold", textSize: "xs", surface: "overlay-xl", padding: "chip-2xs", className: "absolute left-2 top-2 text-white", rounded: "default", children: ["#", idx + 1] })] }) }), _jsxs(Div, { padding: "xs", children: [_jsx(Link, { href: href, className: "line-clamp-2 text-[length:var(--appkit-text-sm)] font-medium hover:underline", children: p.title }), _jsx(Text, { className: "mt-0.5 text-[var(--appkit-color-text-muted)]", size: "xs", children: _jsx(GatedPrice, { children: formatCurrency(p.price ?? 0, p.currency ?? "INR") }) })] })] }, p.id));
                 }) }), _jsx(ImageLightbox, { images: galleryImages, activeIndex: lightboxIndex, onClose: () => setLightboxIndex(null), onNavigate: (i) => setLightboxIndex(i), showThumbnails: true })] }));

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

@@ -18,6 +18,7 @@ import { Badge, Button, Checkbox, Div, Input, Row, Stack, Text } from "../../../
 import { BUNDLE_MAX_ITEMS, BUNDLE_MIN_ITEMS, } from "../../../_internal/shared/features/categories/bundle-config.js";
 import { BUNDLE_COPY } from "../../../_internal/shared/features/categories/bundle-copy.js";
 import { PRODUCT_ENDPOINTS } from "../../../constants/api-endpoints.js";
+import { productImageUrls } from "../../products/schemas/firestore.js";
 const __P = {
     p3: "p-[var(--appkit-space-3)]",
 };
@@ -137,11 +138,9 @@ export async function defaultBundleItemsFetch(query) {
         return {
             id,
             title,
-            image: typeof rec.mainImage === "string"
+            image: typeof rec.mainImage === "string" && rec.mainImage
                 ? rec.mainImage
-                : Array.isArray(rec.images) && typeof rec.images[0] === "string"
-                    ? rec.images[0]
-                    : undefined,
+                : productImageUrls(rec.images)[0],
             price: typeof rec.price === "number" ? rec.price : undefined,
             storeId: typeof rec.storeId === "string" ? rec.storeId : undefined,
         };