@mohasinac/appkit 4.13.1 → 4.15.0

package/dist/features/admin/components/AdminOffersView.js

@@ -0,0 +1,230 @@
+"use client";
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+/*
+ * WHY: Offers had a seller surface (/store/offers) and a buyer surface
+ *      (/user/offers) but no admin surface at all — despite the offers
+ *      collection carrying real money commitments, a 48h locked price, and a
+ *      lane that can block a buyer's whole cart. There was no way for support
+ *      to see an offer, let alone clear a stuck one.
+ * WHAT: The admin offers list. Cloned from SellerOffersView rather than
+ *       AdminBidsView: the seller view is already offer-shaped and already
+ *       satisfies `audit-listing-detail-affordance` (row click -> detail
+ *       modal), whereas AdminBidsView is itself still on the Root Cause #56
+ *       backlog and cloning it would have added a tenth violation.
+ *
+ * Two things differ from the seller view, both deliberate:
+ *  - the buyer's real name/email is shown UNMASKED (the seller view masks via
+ *    `maskOfferForSeller`) — an admin investigating a dispute needs identity;
+ *  - the only mutation is Cancel. Accepting or countering on a seller's behalf
+ *    is an authority nobody asked for, so `ADMIN_ROW_ACTIONS.offers` is
+ *    deliberately just [VIEW, CANCEL].
+ *
+ * EXPORTS:
+ *   AdminOffersView
+ *
+ * @tag domain:admin,offers
+ * @tag layer:feature-view
+ * @tag pattern:slot-shell
+ * @tag access:client
+ * @tag consumers:src/app/[locale]/admin/offers/page.tsx
+ * @tag sideEffects:network
+ */
+import { useApiMutation } from "@mohasinac/appkit/client";
+import { sieveFilter, SIEVE_OP } from "@mohasinac/appkit/client";
+import { sortBy } from "@mohasinac/appkit/client";
+import React, { useState } from "react";
+import { useQueryClient } from "@tanstack/react-query";
+import { FilterChipGroup, ListingLayout, RecordDetailModal, RowActionMenu, useToast, } from "../../../ui";
+import { ADMIN_ENDPOINTS } from "../../../constants/api-endpoints";
+import { ADMIN_OFFER_STATUS_TABS } from "../constants/filter-tabs";
+import { OfferPhaseTimeline } from "../../seller/components/OfferPhaseTimeline";
+import { QuickFormDrawer } from "../../shell/QuickFormDrawer";
+import { cancelOfferFormSchema } from "../../seller/schemas/offer-forms";
+import { ACTIONS } from "../../../_internal/shared/actions/action-registry";
+import { ROW_ACTION_META, ROW_ACTION_ID } from "../../products/constants/action-defs";
+import { ROUTES } from "../../../next/routing/route-map";
+import { toRecordArray, toRelativeDate, toCurrency, toStringValue, } from "../hooks/useAdminListingData";
+import { DataListingView } from "./DataListingView";
+import { apiClient } from "../../../http";
+import { normalizeError } from "../../../errors/normalize";
+/** Terminal states — an offer here has nothing left to cancel. */
+const TERMINAL_STATUSES = new Set(["paid", "declined", "expired", "withdrawn"]);
+export function AdminOffersView({ children, ...props }) {
+    const queryClient = useQueryClient();
+    const { showToast } = useToast();
+    const [detailRow, setDetailRow] = useState(null);
+    const [cancelOpen, setCancelOpen] = useState(false);
+    const [selectedRow, setSelectedRow] = useState(null);
+    /**
+     * Open on the SINGLE-ITEM response, not the row's cached list blob.
+     *
+     * Two reasons. The list payload has no `chain`, so a three-round negotiation
+     * would render as one orphan round; and a modal opened on a list snapshot
+     * shows whatever the last refetch happened to hold, which is the stale-editor
+     * shape of Root Cause #38.
+     *
+     * The row is shown immediately and enriched when the fetch lands, so the
+     * modal never blocks on the network.
+     */
+    const openDetail = async (row) => {
+        setDetailRow(row);
+        try {
+            const full = await apiClient.get(ADMIN_ENDPOINTS.OFFER_BY_ID(row.id));
+            const detail = (full?.data ?? full);
+            if (detail && typeof detail === "object") {
+                setDetailRow((prev) => (prev?.id === row.id ? { ...prev, detail } : prev));
+            }
+        }
+        catch (err) {
+            // The row's own data is already on screen, so this degrades to "no
+            // chain" rather than to an empty modal. Say so instead of failing silently.
+            const normalized = normalizeError(err);
+            showToast(normalized.message || "Couldn't load the full offer history.", "error");
+        }
+    };
+    const cancelMutation = useApiMutation({
+        mutationFn: async ({ offerId, reason }) => {
+            await apiClient.patch(ADMIN_ENDPOINTS.OFFER_BY_ID(offerId), {
+                status: "expired",
+                reason,
+            });
+        },
+        onSuccess: () => {
+            showToast("Offer cancelled and cleared from the buyer's cart.", "success");
+            queryClient.invalidateQueries({ queryKey: ["admin", "offers"] });
+            setCancelOpen(false);
+            setSelectedRow(null);
+        },
+        onError: (err) => {
+            showToast(err?.message ?? "Failed to cancel offer.", "error");
+        },
+    });
+    if (React.Children.count(children) > 0) {
+        return (_jsx(ListingLayout, { portal: "admin", ...props, children: children }));
+    }
+    const config = {
+        portal: "admin",
+        title: "Offers",
+        searchPlaceholder: "Search offers by product, buyer, or store",
+        emptyLabel: "No offers found",
+        filterKeys: ["status"],
+        defaultSort: sortBy("createdAt", "DESC"),
+        queryKey: ["admin", "offers", "listing"],
+        endpoint: ADMIN_ENDPOINTS.OFFERS,
+        sortOptions: [
+            { value: sortBy("createdAt", "DESC"), label: "Newest" },
+            { value: sortBy("createdAt", "ASC"), label: "Oldest" },
+            { value: sortBy("offerAmount", "DESC"), label: "Highest offer" },
+        ],
+        mapRows: (response) => toRecordArray(response.items).map((item, index) => ({
+            id: toStringValue(item.id, `offer-${index}`),
+            // The LISTING, not the offer id — a row identified only by
+            // `offer-…-20260819-x7y8z9` is unreadable at a glance (Root Cause #52).
+            primary: toStringValue(item.productTitle, "Untitled listing"),
+            // Admin sees both sides of the negotiation, unmasked.
+            secondary: [
+                `Offer: ${toCurrency(item.offerAmount)}`,
+                `Listed: ${toCurrency(item.listedPrice)}`,
+                `${toStringValue(item.buyerName, "Unknown buyer")} → ${toStringValue(item.storeName, "Unknown store")}`,
+            ].join(" · "),
+            status: toStringValue(item.status, "pending"),
+            updatedAt: toRelativeDate(item.updatedAt ?? item.createdAt),
+            detail: item,
+        })),
+        getTotal: (response, mappedRows) => typeof response.total === "number" ? response.total : mappedRows.length,
+        // A menu of pure mutations is not a detail affordance (Root Cause #56) —
+        // cancelling an offer without first reading it is acting blind.
+        onRowClick: (row) => void openDetail(row),
+        buildFilters: (state) => state.status && state.status !== "All"
+            ? sieveFilter("status", SIEVE_OP.EQ, state.status)
+            : undefined,
+        // No bulk actions, deliberately. There was a destructively-labelled
+        // "Cancel offer" entry here whose onClick only called clearSelection() — a
+        // registry-backed control that read as working and did nothing. Cancel now
+        // requires a per-offer reason, and one shared reason across a mixed
+        // selection is worse audit data than no bulk action at all.
+        renderRowActions: (row) => (_jsx(RowActionMenu, { actions: [
+                { label: ROW_ACTION_META[ROW_ACTION_ID.VIEW].label, onClick: () => void openDetail(row) },
+                {
+                    label: ACTIONS.ADMIN["cancel-offer"].label,
+                    destructive: true,
+                    disabled: TERMINAL_STATUSES.has(row.status),
+                    onClick: () => {
+                        setSelectedRow(row);
+                        setCancelOpen(true);
+                    },
+                },
+            ] })),
+        renderFilterPanel: ({ pendingFilters, setPendingFilters }) => (_jsx(FilterChipGroup, { label: "Status", tabs: ADMIN_OFFER_STATUS_TABS, value: pendingFilters.status ?? "", onChange: (id) => setPendingFilters((p) => ({ ...p, status: id })) })),
+    };
+    const d = detailRow?.detail ?? {};
+    const productSlug = toStringValue(d.productSlug ?? d.productId, "");
+    const paidOrderId = toStringValue(d.paidOrderId, "");
+    return (_jsxs(_Fragment, { children: [_jsx(DataListingView, { config: config }), _jsx(RecordDetailModal, { isOpen: detailRow !== null, onClose: () => setDetailRow(null), title: detailRow?.primary ?? "Offer", badges: detailRow ? [{ label: detailRow.status }] : undefined, description: toStringValue(d.buyerNote, ""), fields: [
+                    { label: "Buyer", value: toStringValue(d.buyerName, "Unknown buyer") },
+                    { label: "Buyer email", value: toStringValue(d.buyerEmail, "—") },
+                    { label: "Store", value: toStringValue(d.storeName, "Unknown store") },
+                    { label: "Listed price", value: toCurrency(d.listedPrice) },
+                    { label: "Offered", value: toCurrency(d.offerAmount) },
+                    ...(d.counterAmount
+                        ? [{ label: "Seller counter", value: toCurrency(d.counterAmount) }]
+                        : []),
+                    ...(d.lockedPrice
+                        ? [{ label: "Locked price", value: toCurrency(d.lockedPrice) }]
+                        : []),
+                    ...(d.sellerNote
+                        ? [{ label: "Seller note", value: toStringValue(d.sellerNote, "") }]
+                        : []),
+                    { label: "Offer expires", value: toRelativeDate(d.expiresAt) },
+                    ...(d.checkoutDeadline
+                        ? [{ label: "Buyer must pay by", value: toRelativeDate(d.checkoutDeadline) }]
+                        : []),
+                    { label: "Created", value: toRelativeDate(d.createdAt) },
+                    { label: "Offer ID", value: detailRow?.id ?? "—" },
+                ], items: detailRow
+                    ? {
+                        heading: "Listing",
+                        entries: [
+                            {
+                                image: toStringValue(d.productImageUrl, "") || undefined,
+                                title: detailRow.primary,
+                                subtitle: toStringValue(d.productId, ""),
+                                trailing: toCurrency(d.listedPrice),
+                                href: productSlug
+                                    ? String(ROUTES.PUBLIC.PRODUCT_DETAIL(productSlug))
+                                    : undefined,
+                            },
+                            // A paid offer became a real order — link to it, so the
+                            // "what happened next" question has an answer in one click.
+                            ...(paidOrderId
+                                ? [
+                                    {
+                                        title: `Order ${paidOrderId}`,
+                                        subtitle: "Placed from this offer",
+                                        href: String(ROUTES.ADMIN.ORDER_DETAIL(paidOrderId)),
+                                    },
+                                ]
+                                : []),
+                        ],
+                    }
+                    : undefined, extra: _jsx(OfferPhaseTimeline, { status: toStringValue(d.status, "pending"), timeline: d.timeline, timelineTruncated: d.timelineTruncated, superseded: Boolean(d.superseded), createdAt: toStringValue(d.createdAt, ""), respondedAt: toStringValue(d.respondedAt, ""), acceptedAt: toStringValue(d.acceptedAt, ""), paidAt: toStringValue(d.paidAt, ""), chain: d.chain }) }), _jsx(QuickFormDrawer, { isOpen: cancelOpen, onClose: () => {
+                    setCancelOpen(false);
+                    setSelectedRow(null);
+                }, title: ACTIONS.ADMIN["cancel-offer"].confirmation.title, schema: cancelOfferFormSchema, fields: [
+                    {
+                        name: "reason",
+                        label: "Reason for cancelling",
+                        type: "textarea",
+                        required: true,
+                        placeholder: "e.g. Listing withdrawn by the seller after a pricing error",
+                        helperText: `${ACTIONS.ADMIN["cancel-offer"].confirmation.body} The buyer sees this reason, and it is recorded in the audit log.`,
+                    },
+                ], submitLabel: ACTIONS.ADMIN["cancel-offer"].confirmation.confirmLabel, isLoading: cancelMutation.isPending, onSubmit: (values) => {
+                    if (!selectedRow)
+                        return;
+                    cancelMutation.mutate({
+                        offerId: selectedRow.id,
+                        reason: String(values.reason ?? ""),
+                    });
+                } })] }));
+}

package/dist/features/admin/components/AdminOrdersView.js

@@ -12,6 +12,7 @@ import { ROUTES } from "../../../next/routing/route-map";
 import { ADMIN_BULK_ACTIONS, ROW_ACTION_META, ROW_ACTION_ID } from "../../products/constants/action-defs";
 import { ADMIN_ORDER_STATUS_TABS, ADMIN_ORDER_PAYMENT_REVIEW_TABS } from "../constants/filter-tabs";
 import { isManualPaymentMethod, isPaymentReviewQueueMode } from "../../orders/constants/payment-window";
+import { useOrderScope } from "../../orders/components/OrderScopeTabs";
 import { toRecordArray, toRelativeDate, toCurrency, toStringValue, } from "../hooks/useAdminListingData";
 import { DataListingView } from "./DataListingView";
 import { AdminOrderEditorView } from "./AdminOrderEditorView";
@@ -80,6 +81,7 @@ export function AdminOrdersView({ children, ...props }) {
     if (React.Children.count(children) > 0) {
         return (_jsx(ListingLayout, { portal: "admin", ...props, children: children }));
     }
+    const orderScope = useOrderScope();
     const config = {
         portal: "admin",
         title: "Orders",
@@ -147,7 +149,14 @@ export function AdminOrdersView({ children, ...props }) {
                 return undefined;
             return f.status && f.status !== "All" ? sieveFilter("status", SIEVE_OP.EQ, f.status) : undefined;
         },
-        buildExtraParams: (f) => isPaymentReviewQueueMode(f.paymentReview ?? "") ? { paymentReview: f.paymentReview } : undefined,
+        // The payment-review queue is its own mode — it already ignores `status`
+        // (see buildFilters above), so it must ignore the lifecycle scope too, or
+        // an admin opening the queue from the default Active tab would see it
+        // silently narrowed.
+        buildExtraParams: (f) => isPaymentReviewQueueMode(f.paymentReview ?? "")
+            ? { paymentReview: f.paymentReview }
+            : orderScope.extraParams,
+        renderAboveContent: orderScope.renderAboveContent,
         // Mirrors the row action's "View full details" entry so the row itself
         // is clickable, not just the overflow menu.
         onRowClick: (row) => {

package/dist/features/admin/components/AdminPaymentMethodsView.js

@@ -1,9 +1,10 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { sortBy } from "@mohasinac/appkit/client";
+import { useState } from "react";
 import { useUrlTable } from "../../../react/hooks/useUrlTable";
 import { useQueryClient } from "@tanstack/react-query";
-import { Badge, Div, FilterChipGroup, Span, Stack, Text, useToast } from "../../../ui";
+import { Badge, Div, FilterChipGroup, Span, Stack, Text, useToast, RecordDetailModal, } from "../../../ui";
 import { ADMIN_ENDPOINTS } from "../../../constants/api-endpoints";
 import { ACTIONS } from "../../../_internal/shared/actions/action-registry";
 import { toRecordArray, toRelativeDate, toStringValue } from "../hooks/useAdminListingData";
@@ -44,7 +45,10 @@ const PM_COLUMNS = [
         render: (row) => _jsx(Span, { size: "sm", color: "muted", children: row.updatedAt }),
     },
 ];
-function buildConfig(onAction) {
+function buildConfig(onAction, 
+// Threaded in rather than closed over: this factory sits OUTSIDE the
+// component, so the component's state setter is not in scope here.
+onOpen) {
     return {
         portal: "admin",
         title: "Payment Methods",
@@ -65,6 +69,9 @@ function buildConfig(onAction) {
             { value: "type", label: "Type" },
         ],
         columns: PM_COLUMNS,
+        // Opening a row is what makes the destructive actions beside it
+        // safe to offer at all.
+        onRowClick: onOpen,
         mapRows: (response) => toRecordArray(response.items).map((item, index) => ({
             id: toStringValue(item.id, `pm-${index}`),
             primary: `${toStringValue(item.type, "unknown").toUpperCase()} · ${toStringValue(item.displayLabel, "—")}`,
@@ -72,6 +79,7 @@ function buildConfig(onAction) {
             status: toStringValue(item.banStatus, ""),
             updatedAt: toRelativeDate(item.bannedAt ?? item.updatedAt),
             _raw: item,
+            detail: item,
         })),
         getTotal: (response, rows) => typeof response.total === "number" ? response.total : rows.length,
         buildFilters: () => undefined,
@@ -111,6 +119,7 @@ function buildConfig(onAction) {
     };
 }
 export function AdminPaymentMethodsView(_props) {
+    const [detail, setDetail] = useState(null);
     // Independent useUrlTable() against the same URL param the listing reads
     // via filterKeys (Root Cause #35 pattern).
     const chipTable = useUrlTable({ defaults: {} });
@@ -132,6 +141,17 @@ export function AdminPaymentMethodsView(_props) {
     const handleAction = (id, action) => {
         actionMutation.mutate({ id, action });
     };
-    const config = buildConfig(handleAction);
-    return (_jsxs(Stack, { gap: "md", children: [_jsx(Div, { padding: "inline", border: "default", className: "border-b", children: _jsx(FilterChipGroup, { label: "Status", tabs: BAN_STATUS_TABS, value: banStatus, onChange: (v) => chipTable.set("banStatus", v) }) }), _jsx(DataListingView, { config: config })] }));
+    const config = buildConfig(handleAction, setDetail);
+    return (_jsxs(Stack, { gap: "md", children: [_jsx(RecordDetailModal, { isOpen: detail !== null, onClose: () => setDetail(null), title: toStringValue(detail?.detail?.displayLabel, "Payment method"), fields: (() => {
+                    const d = (detail?.detail ?? {});
+                    return detail ? [
+                        { label: "Type", value: toStringValue(d.type, "—").toUpperCase() },
+                        { label: "Label", value: toStringValue(d.displayLabel, "—") },
+                        { label: "Owner", value: toStringValue(d.userId, "—") },
+                        { label: "Ban status", value: toStringValue(d.banStatus, "Not banned") },
+                        { label: "Ban reason", value: toStringValue(d.banReason, "—") },
+                        { label: "Banned at", value: toRelativeDate(d.bannedAt) },
+                        { label: "Method ID", value: detail?.id ?? "—" },
+                    ] : undefined;
+                })() }), _jsx(Div, { padding: "inline", border: "default", className: "border-b", children: _jsx(FilterChipGroup, { label: "Status", tabs: BAN_STATUS_TABS, value: banStatus, onChange: (v) => chipTable.set("banStatus", v) }) }), _jsx(DataListingView, { config: config })] }));
 }

package/dist/features/admin/components/AdminPrizeDrawsView.js

@@ -11,6 +11,8 @@ import { ADMIN_PRODUCT_STATUS_TABS } from "../constants/filter-tabs";
 import { ROUTES } from "../../../constants";
 import { toRecordArray, toRelativeDate, toCurrency, toStringValue, } from "../hooks/useAdminListingData";
 import { DataListingView } from "./DataListingView";
+import { useAvailabilityScope } from "../../products/hooks/useAvailabilityScope";
+const PRIZE_DRAW_TYPES = ["prize-draw"];
 const STATUS_VARIANT = {
     published: "success",
     active: "success",
@@ -57,6 +59,7 @@ export function AdminPrizeDrawsView({ children, ...props }) {
     if (React.Children.count(children) > 0) {
         return (_jsx(ListingLayout, { portal: "admin", ...props, children: children }));
     }
+    const scope = useAvailabilityScope(PRIZE_DRAW_TYPES);
     const config = {
         portal: "admin",
         title: "Prize Draws",
@@ -94,6 +97,8 @@ export function AdminPrizeDrawsView({ children, ...props }) {
             const status = state.status && state.status !== "All" ? sieveFilter("status", SIEVE_OP.EQ, state.status) : null;
             return ["listingType==prize-draw", status].filter(Boolean).join(",");
         },
+        buildExtraParams: () => scope.extraParams,
+        renderAboveContent: scope.renderAboveContent,
         rowHrefTemplate: String(ROUTES.ADMIN.PRIZE_DRAWS_EDIT("{id}")),
         // Rule #7: bulk-action array sourced from the ADMIN_BULK_ACTIONS preset.
         buildBulkActions: (selection) => ADMIN_BULK_ACTIONS.prizeDraws.map((id) => ({

package/dist/features/admin/components/AdminProductsView.js

@@ -16,6 +16,8 @@ import { AdminProductEditorView } from "./AdminProductEditorView";
 import { QuickEditMenu } from "./QuickEditMenu";
 import { ADMIN_BULK_ACTIONS, ROW_ACTION_META, ROW_ACTION_ID } from "../../products/constants/action-defs";
 import { parseSelectedListingTypes } from "../../products/utils/listing-type";
+import { useAvailabilityScope } from "../../products/hooks/useAvailabilityScope";
+import { ALL_LISTING_TYPES } from "../../../_internal/shared/listing-types/feature-flags";
 const FLAG_DEFS = [
     { key: "featured", label: "Featured" },
     { key: "isPromoted", label: "Promoted" },
@@ -95,16 +97,15 @@ export function AdminProductsView({ children, ...props }) {
                     void handleToggle(row.id, key, v);
                 } }, key))) })),
     };
-    // We need showSold state to be derived from URL — read it via a small inner component
-    // that uses the listing's own table state. To keep things simple, use a ref into the
-    // config's render-prop chain via `renderAboveContent` which has no useUrlTable.
-    // Simplest: use buildFilters which gets the full filterState, and add showSold to filterKeys.
+    // Spans every listing type unless the Type chips narrow it, which is what
+    // makes the middle tab read "Sold & Ended" here rather than one or the other.
+    const scope = useAvailabilityScope(ALL_LISTING_TYPES);
     const config = {
         portal: "admin",
         title: "Products",
         searchPlaceholder: "Search products, SKUs, or seller names",
         emptyLabel: "No products found",
-        filterKeys: ["status", "type", "showSold", "showEnded", "showClosed"],
+        filterKeys: ["status", "type"],
         defaultSort: sortBy("createdAt", "DESC"),
         queryKey: ["admin", "products", "listing"],
         endpoint: ADMIN_ENDPOINTS.PRODUCTS,
@@ -169,8 +170,6 @@ export function AdminProductsView({ children, ...props }) {
         getTotal: (response, mappedRows) => typeof response.total === "number" ? response.total : mappedRows.length,
         buildFilters: (state) => {
             const parts = [];
-            if (state.showSold !== "true")
-                parts.push("isSold==false");
             if (state.status && state.status !== "All")
                 parts.push(sieveFilter("status", SIEVE_OP.EQ, state.status));
             // `state.type` is a pipe-joined set of canonical ListingType values
@@ -181,20 +180,17 @@ export function AdminProductsView({ children, ...props }) {
             if (selectedTypes.length > 0) {
                 parts.push(sieveFilter("listingType", SIEVE_OP.EQ, selectedTypes.join("|")));
             }
-            // Ended/closed are per-type predicates: `auctionEndDate` and
-            // `prizeRevealWindowEnd` only exist on auctions and prize-draws. Apply
-            // each only when its type is the ONLY one selected — with a mixed
-            // selection the inequality would exclude every row of the other types
-            // (they have no such field at all), which reads as "no results".
-            const onlyType = selectedTypes.length === 1 ? selectedTypes[0] : null;
-            if (onlyType === "auction" && state.showEnded !== "true") {
-                parts.push(sieveFilter("auctionEndDate", SIEVE_OP.GTE, new Date().toISOString()));
-            }
-            if (onlyType === "prize-draw" && state.showClosed !== "true") {
-                parts.push(sieveFilter("prizeRevealWindowEnd", SIEVE_OP.GTE, new Date().toISOString()));
-            }
+            // Three drawer chips (Sold / Ended / Closed) used to live here, each
+            // emitting its own clause and each guarded by an `onlyType` check
+            // because `auctionEndDate` and `prizeRevealWindowEnd` do not exist on
+            // the other seven types. That guard meant the ended/closed filters
+            // silently did nothing on any mixed selection. The scope param replaces
+            // all three, and resolves the per-type meaning server-side — so it works
+            // across a mixed selection, which is the common case here.
             return parts.join(",") || undefined;
         },
+        buildExtraParams: () => scope.extraParams,
+        renderAboveContent: scope.renderAboveContent,
         primaryAction: {
             label: "Add Product",
             onClick: ({ openCreatePanel }) => openCreatePanel(),
@@ -263,16 +259,7 @@ export function AdminProductsView({ children, ...props }) {
                     submitLabel: "Save",
                 },
             ] })),
-        renderFilterPanel: ({ pendingFilters, setPendingFilters }) => (_jsxs(_Fragment, { children: [_jsx(FilterChipGroup, { label: "Status", tabs: ADMIN_PRODUCT_STATUS_TABS, value: pendingFilters.status ?? "", onChange: (id) => setPendingFilters((p) => ({ ...p, status: id })) }), _jsx(FilterChipGroup, { multiple: true, label: "Type", tabs: ADMIN_PRODUCT_LISTING_TYPE_TABS, value: pendingFilters.type ?? "", onChange: (ids) => setPendingFilters((p) => ({ ...p, type: ids })) }), _jsx(FilterChipGroup, { label: "Sold", tabs: [
-                        { id: "", label: "Hide sold" },
-                        { id: "true", label: "Show sold" },
-                    ], value: pendingFilters.showSold ?? "", onChange: (id) => setPendingFilters((p) => ({ ...p, showSold: id })), allId: "" }), _jsx(FilterChipGroup, { label: "Ended", tabs: [
-                        { id: "", label: "Hide ended" },
-                        { id: "true", label: "Show ended" },
-                    ], value: pendingFilters.showEnded ?? "", onChange: (id) => setPendingFilters((p) => ({ ...p, showEnded: id })), allId: "" }), _jsx(FilterChipGroup, { label: "Closed", tabs: [
-                        { id: "", label: "Hide closed" },
-                        { id: "true", label: "Show closed" },
-                    ], value: pendingFilters.showClosed ?? "", onChange: (id) => setPendingFilters((p) => ({ ...p, showClosed: id })), allId: "" })] })),
+        renderFilterPanel: ({ pendingFilters, setPendingFilters }) => (_jsxs(_Fragment, { children: [_jsx(FilterChipGroup, { label: "Status", tabs: ADMIN_PRODUCT_STATUS_TABS, value: pendingFilters.status ?? "", onChange: (id) => setPendingFilters((p) => ({ ...p, status: id })) }), _jsx(FilterChipGroup, { multiple: true, label: "Type", tabs: ADMIN_PRODUCT_LISTING_TYPE_TABS, value: pendingFilters.type ?? "", onChange: (ids) => setPendingFilters((p) => ({ ...p, type: ids })) })] })),
         renderEditor: ({ editId, closePanel }) => (_jsx(AdminProductEditorView, { productId: editId ?? undefined, initialData: editId ? rawByIdRef.current[editId] : undefined, onSaved: closePanel, onDeleted: closePanel, embedded: true })),
         resolveEditorTitle: ({ isCreate }) => (isCreate ? "Add Product" : "Edit Product"),
     };

package/dist/features/admin/components/AdminScammerEditorView.d.ts

@@ -1,4 +1,5 @@
 import React from "react";
+import { type ScammerStatus } from "../../scams/schemas/firestore";
 export interface AdminScammerEditorViewProps {
     open: boolean;
     onClose: () => void;
@@ -8,7 +9,7 @@ export interface AdminScammerEditorViewProps {
     description?: string;
     phones?: string[];
     upiIds?: string[];
-    currentStatus?: string;
+    currentStatus?: ScammerStatus;
     verificationNote?: string;
     reportedBy?: string;
     reportedByAnon?: boolean;

package/dist/features/admin/components/AdminScammerEditorView.js

@@ -6,23 +6,13 @@ import { useQueryClient } from "@tanstack/react-query";
 import { Button, Code, Div, FormActions, HorizontalRule, Label, Row, Select, SideDrawer, Span, Stack, Text, Textarea, useToast } from "../../../ui";
 import { apiClient } from "../../../http";
 import { ADMIN_ENDPOINTS } from "../../../constants/api-endpoints";
+import { ScammerStatusValues, } from "../../scams/schemas/firestore";
+import { SCAMMER_STATUS_BADGE, SCAMMER_STATUS_LABEL, SCAMMER_STATUS_OPTIONS, } from "../../scams/constants/scammer-status-display";
 const __P = {
     p3: "p-[var(--appkit-space-3)]",
     p4: "p-[var(--appkit-space-4)]",
 };
 const CLS_SECTION_LABEL = "text-[length:var(--appkit-text-xs)] font-medium text-[var(--appkit-color-text-muted)] uppercase tracking-wide";
-const STATUS_OPTIONS = [
-    { label: "Pending review", value: "pending_review" },
-    { label: "Verified", value: "verified" },
-    { label: "Rejected", value: "rejected" },
-    { label: "Removed", value: "removed" },
-];
-const STATUS_COLOR = {
-    pending_review: "bg-warning-surface text-warning",
-    verified: "bg-success-surface text-success",
-    rejected: "bg-error-surface text-error",
-    removed: "bg-[var(--appkit-color-surface)] text-[var(--appkit-color-text-muted)] bg-[var(--appkit-color-surface-elevated)] text-[var(--appkit-color-text-muted)]",
-};
 export function AdminScammerEditorView({ open, onClose, scammerId, displayNames = [], scamType, description, phones = [], upiIds = [], currentStatus, verificationNote, reportedBy, reportedByAnon, }) {
     const queryClient = useQueryClient();
     const { showToast } = useToast();
@@ -63,5 +53,5 @@ export function AdminScammerEditorView({ open, onClose, scammerId, displayNames
             showToast(err?.message ?? "Failed to delete profile.", "error");
         },
     });
-    return (_jsx(SideDrawer, { isOpen: open, onClose: onClose, title: displayNames.length > 0 ? displayNames[0] : "Scammer Profile", children: _jsxs(Stack, { className: `${__P.p4}`, gap: "md", children: [_jsxs(Row, { align: "center", gap: "sm", children: [_jsx(Span, { size: "xs", weight: "medium", className: `inline-flex ${STATUS_COLOR[currentStatus ?? "pending_review"] ?? STATUS_COLOR.pending_review}`, rounded: "full", padding: "pill-sm-tall", children: (currentStatus ?? "pending_review").replace(/_/g, " ") }), scamType && (_jsx(Span, { size: "xs", rounded: "full", padding: "pill-sm-tall", surface: "subtle", color: "muted", children: scamType.replace(/_/g, " ") }))] }), displayNames.length > 0 && (_jsxs(Div, { children: [_jsx(Text, { className: "mb-1 tracking-wide", color: "muted", size: "xs", weight: "semibold", transform: "uppercase", children: "Names / Aliases" }), _jsx(Row, { wrap: true, gap: "xs", children: displayNames.map((name, i) => (_jsx(Span, { size: "xs", rounded: "full", surface: "subtle", padding: "pill-sm", children: name }, i))) })] })), (phones.length > 0 || upiIds.length > 0) && (_jsxs(Div, { className: `${__P.p3}`, rounded: "lg", surface: "muted", border: "default", children: [phones.length > 0 && (_jsxs(Div, { className: "mb-2", children: [_jsx(Text, { className: CLS_SECTION_LABEL, children: "Phone numbers" }), _jsx(Row, { wrap: true, gap: "xs", children: phones.map((p, i) => (_jsx(Code, { size: "xs", rounded: "default", padding: "sm", surface: "subtle", children: p }, i))) })] })), upiIds.length > 0 && (_jsxs(_Fragment, { children: [_jsx(Text, { className: CLS_SECTION_LABEL, children: "UPI IDs" }), _jsx(Row, { wrap: true, gap: "xs", children: upiIds.map((u, i) => (_jsx(Code, { size: "xs", rounded: "default", padding: "sm", surface: "subtle", children: u }, i))) })] }))] })), description && (_jsxs(Div, { className: `${__P.p3}`, rounded: "lg", surface: "muted", border: "default", children: [_jsx(Text, { className: CLS_SECTION_LABEL, children: "Description" }), _jsx(Text, { className: "whitespace-pre-wrap", color: "primary", size: "sm", children: description })] })), _jsxs(Div, { textSize: "xs", color: "muted", children: ["Reported by:", " ", _jsx(Span, { weight: "medium", color: "muted", children: reportedByAnon ? "Anonymous" : (reportedBy ?? "Unknown") })] }), _jsx(HorizontalRule, { tone: "subtle", spacing: "comfortable" }), _jsx(Select, { label: "Status", options: STATUS_OPTIONS, value: status, onValueChange: setStatus }), _jsxs(Stack, { gap: "xs", children: [_jsx(Label, { className: "uppercase tracking-wide", color: "muted", size: "xs", weight: "semibold", children: "Verification note (internal)" }), _jsx(Textarea, { value: note, onChange: (e) => setNote(e.target.value), rows: 3, placeholder: "e.g. Verified via 3 independent reports\u2026" })] }), _jsxs(FormActions, { align: "right", children: [_jsx(Button, { type: "button", variant: "danger", size: "sm", disabled: !scammerId, isLoading: deleteMutation.isPending, onClick: () => deleteMutation.mutate(), children: "Delete" }), _jsx(Button, { type: "button", variant: "secondary", onClick: onClose, children: "Cancel" }), _jsx(Button, { type: "button", isLoading: updateMutation.isPending, disabled: !scammerId || updateMutation.isPending, onClick: () => updateMutation.mutate(), children: "Save changes" })] })] }) }));
+    return (_jsx(SideDrawer, { isOpen: open, onClose: onClose, title: displayNames.length > 0 ? displayNames[0] : "Scammer Profile", children: _jsxs(Stack, { className: `${__P.p4}`, gap: "md", children: [_jsxs(Row, { align: "center", gap: "sm", children: [_jsx(Span, { size: "xs", weight: "medium", className: `inline-flex ${SCAMMER_STATUS_BADGE[currentStatus ?? ScammerStatusValues.PENDING_REVIEW]}`, rounded: "full", padding: "pill-sm-tall", children: SCAMMER_STATUS_LABEL[currentStatus ?? ScammerStatusValues.PENDING_REVIEW] }), scamType && (_jsx(Span, { size: "xs", rounded: "full", padding: "pill-sm-tall", surface: "subtle", color: "muted", children: scamType.replace(/_/g, " ") }))] }), displayNames.length > 0 && (_jsxs(Div, { children: [_jsx(Text, { className: "mb-1 tracking-wide", color: "muted", size: "xs", weight: "semibold", transform: "uppercase", children: "Names / Aliases" }), _jsx(Row, { wrap: true, gap: "xs", children: displayNames.map((name, i) => (_jsx(Span, { size: "xs", rounded: "full", surface: "subtle", padding: "pill-sm", children: name }, i))) })] })), (phones.length > 0 || upiIds.length > 0) && (_jsxs(Div, { className: `${__P.p3}`, rounded: "lg", surface: "muted", border: "default", children: [phones.length > 0 && (_jsxs(Div, { className: "mb-2", children: [_jsx(Text, { className: CLS_SECTION_LABEL, children: "Phone numbers" }), _jsx(Row, { wrap: true, gap: "xs", children: phones.map((p, i) => (_jsx(Code, { size: "xs", rounded: "default", padding: "sm", surface: "subtle", children: p }, i))) })] })), upiIds.length > 0 && (_jsxs(_Fragment, { children: [_jsx(Text, { className: CLS_SECTION_LABEL, children: "UPI IDs" }), _jsx(Row, { wrap: true, gap: "xs", children: upiIds.map((u, i) => (_jsx(Code, { size: "xs", rounded: "default", padding: "sm", surface: "subtle", children: u }, i))) })] }))] })), description && (_jsxs(Div, { className: `${__P.p3}`, rounded: "lg", surface: "muted", border: "default", children: [_jsx(Text, { className: CLS_SECTION_LABEL, children: "Description" }), _jsx(Text, { className: "whitespace-pre-wrap", color: "primary", size: "sm", children: description })] })), _jsxs(Div, { textSize: "xs", color: "muted", children: ["Reported by:", " ", _jsx(Span, { weight: "medium", color: "muted", children: reportedByAnon ? "Anonymous" : (reportedBy ?? "Unknown") })] }), _jsx(HorizontalRule, { tone: "subtle", spacing: "comfortable" }), _jsx(Select, { label: "Status", options: SCAMMER_STATUS_OPTIONS, value: status, onValueChange: setStatus }), _jsxs(Stack, { gap: "xs", children: [_jsx(Label, { className: "uppercase tracking-wide", color: "muted", size: "xs", weight: "semibold", children: "Verification note (internal)" }), _jsx(Textarea, { value: note, onChange: (e) => setNote(e.target.value), rows: 3, placeholder: "e.g. Verified via 3 independent reports\u2026" })] }), _jsxs(FormActions, { align: "right", children: [_jsx(Button, { type: "button", variant: "danger", size: "sm", disabled: !scammerId, isLoading: deleteMutation.isPending, onClick: () => deleteMutation.mutate(), children: "Delete" }), _jsx(Button, { type: "button", variant: "secondary", onClick: onClose, children: "Cancel" }), _jsx(Button, { type: "button", isLoading: updateMutation.isPending, disabled: !scammerId || updateMutation.isPending, onClick: () => updateMutation.mutate(), children: "Save changes" })] })] }) }));
 }

package/dist/features/admin/components/AdminScammersView.js

@@ -12,12 +12,7 @@ import { ADMIN_SCAMMER_STATUS_TABS } from "../constants/filter-tabs";
 import { toRecordArray, toRelativeDate, toStringValue, } from "../hooks/useAdminListingData";
 import { DataListingView } from "./DataListingView";
 import { AdminScammerEditorView } from "./AdminScammerEditorView";
-const STATUS_BADGE = {
-    pending_review: "bg-warning-surface text-warning",
-    verified: "bg-success-surface text-success",
-    rejected: "bg-error-surface text-error",
-    removed: "bg-[var(--appkit-color-surface)] text-[var(--appkit-color-text-muted)] bg-[var(--appkit-color-surface-elevated)] text-[var(--appkit-color-text-muted)]",
-};
+import { SCAMMER_STATUS_BADGE, SCAMMER_STATUS_LABEL, toScammerStatus, } from "../../scams/constants/scammer-status-display";
 const SCAMMER_COLUMNS = [
     {
         key: "primary",
@@ -28,7 +23,7 @@ const SCAMMER_COLUMNS = [
         key: "status",
         header: "Status",
         className: "w-36",
-        render: (row) => (_jsx(Span, { className: `inline-flex ${STATUS_BADGE[row.status] ?? STATUS_BADGE.pending_review}`, size: "xs", weight: "medium", rounded: "full", padding: "pill-sm-tall", children: row.status.replace(/_/g, " ") })),
+        render: (row) => (_jsx(Span, { className: `inline-flex ${SCAMMER_STATUS_BADGE[row.status]}`, size: "xs", weight: "medium", rounded: "full", padding: "pill-sm-tall", children: SCAMMER_STATUS_LABEL[row.status] })),
     },
     {
         key: "updatedAt",
@@ -72,7 +67,7 @@ export function AdminScammersView({ children, ...props }) {
             ]
                 .filter(Boolean)
                 .join(" · "),
-            status: toStringValue(item.status, "pending_review"),
+            status: toScammerStatus(item.status),
             updatedAt: toRelativeDate(item.updatedAt ?? item.createdAt),
             _raw: item,
         })),