@mohasinac/appkit 2.7.59 → 2.8.0

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

@@ -1,42 +1,26 @@
 "use client";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useState, useCallback } from "react";
-import { useUrlTable } from "../../../react/hooks/useUrlTable";
-import { useBulkSelection } from "../../../react/hooks/useBulkSelection";
-import { BulkActionBar, ListingToolbar, Pagination } from "../../../ui";
-import { useBottomActions } from "../../layout";
+import { jsx as _jsx } from "react/jsx-runtime";
 import { ADMIN_ENDPOINTS } from "../../../constants/api-endpoints";
 import { ACTIONS } from "../../../_internal/shared/actions/action-registry";
 import { buildBulkAction } from "../../../_internal/shared/actions/bulk-helpers";
-import { toRecordArray, toRelativeDate, toStringValue, useAdminListingData, } from "../hooks/useAdminListingData";
-import { DataTable } from "./DataTable";
-const PAGE_SIZE = 25;
-const DEFAULT_SORT = "name";
-const SORT_OPTIONS = [
-    { value: "name", label: "Name A–Z" },
-    { value: "-name", label: "Name Z–A" },
-    { value: "-productCount", label: "Most listings" },
-    { value: "-createdAt", label: "Newest" },
-];
-export function AdminSublistingCategoriesView({ onBulkDelete }) {
-    const [view, setView] = useState("table");
-    const table = useUrlTable({ defaults: { pageSize: String(PAGE_SIZE), sort: DEFAULT_SORT } });
-    const [searchInput, setSearchInput] = useState(table.get("q") || "");
-    const commitSearch = useCallback(() => {
-        table.set("q", searchInput.trim());
-    }, [searchInput, table]);
-    const resetAll = useCallback(() => {
-        table.setMany({ q: "", sort: "" });
-        setSearchInput("");
-    }, [table]);
-    const hasActiveState = !!table.get("q") || table.get("sort") !== DEFAULT_SORT;
-    const { rows, total, isLoading, errorMessage } = useAdminListingData({
+import { toRecordArray, toRelativeDate, toStringValue, } from "../hooks/useAdminListingData";
+import { DataListingView } from "./DataListingView";
+export function AdminSublistingCategoriesView({ onBulkDelete, }) {
+    const config = {
+        portal: "admin",
+        title: "Sub-listing Categories",
+        searchPlaceholder: "Search sub-listing categories…",
+        emptyLabel: "No sub-listing categories found",
+        filterKeys: [],
+        defaultSort: "name",
         queryKey: ["admin", "sublisting-categories", "listing"],
         endpoint: ADMIN_ENDPOINTS.SUBLISTING_CATEGORIES,
-        page: table.getNumber("page", 1),
-        pageSize: PAGE_SIZE,
-        sorts: table.get("sort") || DEFAULT_SORT,
-        q: table.get("q") || undefined,
+        sortOptions: [
+            { value: "name", label: "Name A–Z" },
+            { value: "-name", label: "Name Z–A" },
+            { value: "-productCount", label: "Most listings" },
+            { value: "-createdAt", label: "Newest" },
+        ],
         mapRows: (response) => toRecordArray(response.items).map((item, index) => ({
             id: toStringValue(item.id, `sc-${index}`),
             primary: toStringValue(item.name, "Untitled"),
@@ -50,15 +34,15 @@ export function AdminSublistingCategoriesView({ onBulkDelete }) {
             updatedAt: toRelativeDate(item.updatedAt ?? item.createdAt),
         })),
         getTotal: (response, mappedRows) => typeof response.total === "number" ? response.total : mappedRows.length,
-    });
-    const currentPage = table.getNumber("page", 1);
-    const totalPages = Math.ceil(total / PAGE_SIZE);
-    const selection = useBulkSelection({ items: rows ?? [], keyExtractor: (r) => r.id });
-    const bulkActions = [
-        ...(onBulkDelete ? [buildBulkAction(ACTIONS.ADMIN["delete-sublisting-category"], async () => { await onBulkDelete(selection.selectedIds); selection.clearSelection(); })] : []),
-    ];
-    useBottomActions(selection.selectedCount > 0 ? { bulk: { selectedCount: selection.selectedCount, onClearSelection: selection.clearSelection, actions: bulkActions } } : {});
-    return (_jsxs("div", { className: "min-h-screen", children: [_jsx(ListingToolbar, { searchValue: searchInput, searchPlaceholder: "Search sub-listing categories\u2026", onSearchChange: setSearchInput, onSearchCommit: commitSearch, sortValue: table.get("sort") || DEFAULT_SORT, sortOptions: SORT_OPTIONS, onSortChange: (v) => {
-                    table.set("sort", v);
-                }, showTableView: true, view: view, onViewChange: (v) => setView(v), onResetAll: resetAll, hasActiveState: hasActiveState }), selection.selectedCount > 0 && bulkActions.length > 0 && (_jsx(BulkActionBar, { selectedCount: selection.selectedCount, actions: bulkActions, onClearSelection: selection.clearSelection })), totalPages > 1 && (_jsx("div", { className: "sticky top-[calc(var(--header-height,0px)+44px)] z-10 flex justify-center bg-white/95 dark:bg-slate-900/95 backdrop-blur-sm border-b border-zinc-200 dark:border-slate-700 px-3 py-1.5", children: _jsx(Pagination, { currentPage: currentPage, totalPages: totalPages, onPageChange: (p) => table.setPage(p) }) })), _jsxs("div", { className: "py-4 px-3 sm:px-4", children: [errorMessage && (_jsx("div", { className: "mb-4 rounded-xl border border-red-200 bg-error-surface px-4 py-3 text-sm text-error dark:border-red-900/60", children: errorMessage })), _jsx(DataTable, { rows: rows, isLoading: isLoading, emptyLabel: "No sub-listing categories found" })] })] }));
+        buildFilters: () => undefined,
+        buildBulkActions: onBulkDelete
+            ? (selection) => [
+                buildBulkAction(ACTIONS.ADMIN["delete-sublisting-category"], async () => {
+                    await onBulkDelete(selection.selectedIds);
+                    selection.clearSelection();
+                }),
+            ]
+            : undefined,
+    };
+    return _jsx(DataListingView, { config: config });
 }

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

@@ -5,6 +5,13 @@ interface TicketMessageClient {
     body?: string;
     createdAt?: string;
 }
+interface RelatedPartiesClient {
+    userId?: string;
+    storeId?: string;
+    orderId?: string;
+    productId?: string;
+    bidId?: string;
+}
 export interface AdminSupportTicketDetailViewProps {
     open: boolean;
     onClose: () => void;
@@ -18,6 +25,8 @@ export interface AdminSupportTicketDetailViewProps {
     messages?: TicketMessageClient[];
     internalNotes?: string;
     orderId?: string;
+    /** ST-6 — current relatedParties snapshot from the ticket document. */
+    relatedParties?: RelatedPartiesClient;
 }
-export declare function AdminSupportTicketDetailView({ open, onClose, ticketId, subject, userDisplayName, category, currentStatus, currentPriority, description, messages, internalNotes, orderId, }: AdminSupportTicketDetailViewProps): import("react/jsx-runtime").JSX.Element;
+export declare function AdminSupportTicketDetailView({ open, onClose, ticketId, subject, userDisplayName, category, currentStatus, currentPriority, description, messages, internalNotes, orderId, relatedParties, }: AdminSupportTicketDetailViewProps): import("react/jsx-runtime").JSX.Element;
 export {};

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

@@ -1,8 +1,8 @@
 "use client";
-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 React from "react";
 import { useMutation, useQueryClient } from "@tanstack/react-query";
-import { Button, Div, FormActions, Select, SideDrawer, Text, useToast, } from "../../../ui";
+import { Button, Div, FormActions, Input, Row, Select, SideDrawer, Text, Toggle, useToast, } from "../../../ui";
 import { apiClient } from "../../../http";
 import { ADMIN_ENDPOINTS } from "../../../constants/api-endpoints";
 const STATUS_OPTIONS = [
@@ -30,28 +30,46 @@ const ROLE_LABEL = {
     support: "Support",
     admin: "Admin",
 };
-export function AdminSupportTicketDetailView({ open, onClose, ticketId, subject, userDisplayName, category, currentStatus, currentPriority, description, messages = [], internalNotes, orderId, }) {
+export function AdminSupportTicketDetailView({ open, onClose, ticketId, subject, userDisplayName, category, currentStatus, currentPriority, description, messages = [], internalNotes, orderId, relatedParties, }) {
     const queryClient = useQueryClient();
     const { showToast } = useToast();
     const [status, setStatus] = React.useState(currentStatus ?? "open");
     const [priority, setPriority] = React.useState(currentPriority ?? "normal");
     const [notes, setNotes] = React.useState(internalNotes ?? "");
     const [replyBody, setReplyBody] = React.useState("");
+    // ST-6 — local edits for the linked-parties panel
+    const [parties, setParties] = React.useState(relatedParties ?? {});
     React.useEffect(() => {
         if (open) {
             setStatus(currentStatus ?? "open");
             setPriority(currentPriority ?? "normal");
             setNotes(internalNotes ?? "");
             setReplyBody("");
+            setParties(relatedParties ?? {});
         }
-    }, [open, currentStatus, currentPriority, internalNotes]);
+    }, [open, currentStatus, currentPriority, internalNotes, relatedParties]);
     const invalidate = () => queryClient.invalidateQueries({ queryKey: ["admin", "support-tickets"] });
+    const cleanedParties = React.useMemo(() => {
+        const out = {};
+        if (parties.userId?.trim())
+            out.userId = parties.userId.trim();
+        if (parties.storeId?.trim())
+            out.storeId = parties.storeId.trim();
+        if (parties.orderId?.trim())
+            out.orderId = parties.orderId.trim();
+        if (parties.productId?.trim())
+            out.productId = parties.productId.trim();
+        if (parties.bidId?.trim())
+            out.bidId = parties.bidId.trim();
+        return out;
+    }, [parties]);
     const updateMutation = useMutation({
         mutationFn: async () => {
             await apiClient.patch(ADMIN_ENDPOINTS.SUPPORT_TICKET_BY_ID(ticketId), {
                 status,
                 priority,
                 internalNotes: notes || undefined,
+                relatedParties: Object.keys(cleanedParties).length > 0 ? cleanedParties : undefined,
             });
         },
         onSuccess: () => {
@@ -77,7 +95,175 @@ export function AdminSupportTicketDetailView({ open, onClose, ticketId, subject,
             showToast(err?.message ?? "Failed to send reply.", "error");
         },
     });
+    // ST-4 — Apply Store Change action (only relevant for store_change_request)
+    const [storeStatus, setStoreStatus] = React.useState("active");
+    const [storeIsVerified, setStoreIsVerified] = React.useState(false);
+    const [storeIsFeatured, setStoreIsFeatured] = React.useState(false);
+    const linkedStoreId = parties.storeId?.trim();
+    const isStoreChangeRequest = category === "store_change_request";
+    const applyStoreChange = useMutation({
+        mutationFn: async () => {
+            if (!linkedStoreId)
+                throw new Error("No linked store on this ticket.");
+            await apiClient.patch(ADMIN_ENDPOINTS.STORE_BY_ID(linkedStoreId), {
+                storeStatus,
+                isVerified: storeIsVerified,
+                isFeatured: storeIsFeatured,
+            });
+        },
+        onSuccess: () => {
+            showToast("Store change applied.", "success");
+            // Append an internal note marking the action; non-fatal if it fails.
+            apiClient
+                .patch(ADMIN_ENDPOINTS.SUPPORT_TICKET_BY_ID(ticketId), {
+                internalNotes: (notes ? notes + "\n" : "") +
+                    `[${new Date().toISOString()}] Applied store change to ${linkedStoreId}: status=${storeStatus}, verified=${storeIsVerified}, featured=${storeIsFeatured}`,
+            })
+                .catch(() => { });
+            invalidate();
+        },
+        onError: (err) => {
+            showToast(err?.message ?? "Failed to apply store change.", "error");
+        },
+    });
+    // ST-3 — Modify Order Items panel (fetches current items on demand, lets
+    // admin edit quantity per line + remove lines, then PATCHes the order).
+    const [orderItemsOpen, setOrderItemsOpen] = React.useState(false);
+    const [orderItems, setOrderItems] = React.useState([]);
+    const linkedOrderId = parties.orderId?.trim() || orderId;
+    const isOrderModificationRequest = category === "order_modification_request" || category === "order_issue";
+    const loadOrderItems = useMutation({
+        mutationFn: async () => {
+            if (!linkedOrderId)
+                throw new Error("No linked order on this ticket.");
+            const res = await apiClient.get(ADMIN_ENDPOINTS.ORDER_BY_ID(linkedOrderId));
+            const items = Array.isArray(res?.items) ? res.items : [];
+            setOrderItems(items.map((it) => ({
+                productId: String(it.productId ?? ""),
+                productTitle: String(it.productTitle ?? ""),
+                quantity: Number(it.quantity ?? 0),
+                unitPrice: Number(it.unitPrice ?? 0),
+                totalPrice: Number(it.totalPrice ?? 0),
+            })));
+            setOrderItemsOpen(true);
+        },
+        onError: (err) => {
+            showToast(err?.message ?? "Failed to load order.", "error");
+        },
+    });
+    // ST-5 — Lift Ban actions for unban_request tickets
+    const linkedUserId = parties.userId?.trim();
+    const isUnbanRequest = category === "unban_request";
+    const liftHardBan = useMutation({
+        mutationFn: async () => {
+            if (!linkedUserId)
+                throw new Error("No linked user on this ticket.");
+            await apiClient.post(ADMIN_ENDPOINTS.USER_UNBAN(linkedUserId), {});
+        },
+        onSuccess: () => {
+            showToast("Hard ban lifted.", "success");
+            apiClient
+                .patch(ADMIN_ENDPOINTS.SUPPORT_TICKET_BY_ID(ticketId), {
+                internalNotes: (notes ? notes + "\n" : "") +
+                    `[${new Date().toISOString()}] Lifted hard ban for ${linkedUserId}`,
+                status: "resolved",
+            })
+                .catch(() => { });
+            invalidate();
+        },
+        onError: (err) => {
+            showToast(err?.message ?? "Failed to lift hard ban.", "error");
+        },
+    });
+    const liftSoftBanTickets = useMutation({
+        mutationFn: async () => {
+            if (!linkedUserId)
+                throw new Error("No linked user on this ticket.");
+            await apiClient.delete(ADMIN_ENDPOINTS.USER_SOFT_BAN_LIFT(linkedUserId, "create_support_tickets"));
+        },
+        onSuccess: () => {
+            showToast("Ticket-creation soft ban lifted.", "success");
+            apiClient
+                .patch(ADMIN_ENDPOINTS.SUPPORT_TICKET_BY_ID(ticketId), {
+                internalNotes: (notes ? notes + "\n" : "") +
+                    `[${new Date().toISOString()}] Lifted create_support_tickets soft ban for ${linkedUserId}`,
+                status: "resolved",
+            })
+                .catch(() => { });
+            invalidate();
+        },
+        onError: (err) => {
+            showToast(err?.message ?? "Failed to lift soft ban.", "error");
+        },
+    });
+    const applyOrderItems = useMutation({
+        mutationFn: async () => {
+            if (!linkedOrderId)
+                throw new Error("No linked order on this ticket.");
+            // Recalculate totalPrice per line from quantity × unitPrice so qty edits
+            // flow through. Lines with quantity 0 are dropped.
+            const items = orderItems
+                .filter((it) => it.quantity > 0)
+                .map((it) => ({
+                productId: it.productId,
+                productTitle: it.productTitle,
+                quantity: it.quantity,
+                unitPrice: it.unitPrice,
+                totalPrice: it.quantity * it.unitPrice,
+            }));
+            await apiClient.patch(ADMIN_ENDPOINTS.ORDER_BY_ID(linkedOrderId), {
+                items,
+            });
+        },
+        onSuccess: () => {
+            showToast("Order items updated.", "success");
+            apiClient
+                .patch(ADMIN_ENDPOINTS.SUPPORT_TICKET_BY_ID(ticketId), {
+                internalNotes: (notes ? notes + "\n" : "") +
+                    `[${new Date().toISOString()}] Modified order ${linkedOrderId} items: ${orderItems
+                        .filter((it) => it.quantity > 0)
+                        .map((it) => `${it.productId}x${it.quantity}`)
+                        .join(", ")}`,
+            })
+                .catch(() => { });
+            invalidate();
+            setOrderItemsOpen(false);
+        },
+        onError: (err) => {
+            showToast(err?.message ?? "Failed to update order items.", "error");
+        },
+    });
     return (_jsx(SideDrawer, { isOpen: open, onClose: onClose, title: subject ?? "Support Ticket", children: _jsxs(Div, { className: "flex flex-col gap-4 p-4", children: [_jsxs(Div, { className: "flex flex-wrap items-center gap-2", children: [_jsx("span", { className: `inline-flex rounded-full px-2.5 py-1 text-xs font-medium ${STATUS_COLOR[currentStatus ?? "open"] ?? STATUS_COLOR.open}`, children: (currentStatus ?? "open").replace(/_/g, " ") }), _jsx("span", { className: "rounded-full bg-zinc-100 px-2.5 py-1 text-xs text-zinc-600 dark:bg-zinc-800 dark:text-zinc-300", children: category }), orderId && (_jsxs("span", { className: "rounded-full bg-zinc-100 px-2.5 py-1 text-xs text-zinc-600 dark:bg-zinc-800 dark:text-zinc-300", children: ["Order: ", orderId] }))] }), _jsxs(Div, { className: "text-sm text-zinc-500 dark:text-zinc-400", children: ["From: ", _jsx("span", { className: "font-medium text-zinc-700 dark:text-zinc-200", children: userDisplayName })] }), description && (_jsxs(Div, { className: "rounded-lg border border-zinc-200 bg-zinc-50 p-3 dark:border-zinc-700 dark:bg-zinc-900/40", children: [_jsx(Text, { className: "mb-1 text-xs font-semibold text-zinc-500 dark:text-zinc-400 uppercase tracking-wide", children: "Description" }), _jsx(Text, { className: "whitespace-pre-wrap text-sm text-zinc-700 dark:text-zinc-200", children: description })] })), messages.length > 0 && (_jsxs(Div, { className: "space-y-2", children: [_jsxs(Text, { className: "text-xs font-semibold text-zinc-500 dark:text-zinc-400 uppercase tracking-wide", children: ["Messages (", messages.length, ")"] }), _jsx("div", { className: "space-y-2 max-h-64 overflow-y-auto", children: messages.map((msg, i) => (_jsxs("div", { className: `rounded-lg p-3 text-sm ${msg.authorRole === "user"
                                     ? "bg-zinc-50 border border-zinc-200 dark:bg-zinc-900/40 dark:border-zinc-700"
-                                    : "bg-info-surface border border-blue-200 dark:border-blue-800"}`, children: [_jsxs("div", { className: "mb-1 flex items-center gap-2 text-xs text-zinc-400 dark:text-zinc-400", children: [_jsx("span", { className: "font-medium text-zinc-600 dark:text-zinc-300", children: ROLE_LABEL[msg.authorRole ?? "user"] ?? msg.authorRole }), msg.createdAt && (_jsx("span", { children: new Date(msg.createdAt).toLocaleString() }))] }), _jsx(Text, { className: "whitespace-pre-wrap text-zinc-700 dark:text-zinc-200", children: msg.body })] }, msg.id ?? i))) })] })), _jsxs(Div, { className: "flex flex-col gap-1", children: [_jsx("label", { className: "text-xs font-semibold text-zinc-500 dark:text-zinc-400 uppercase tracking-wide", children: "Reply to user" }), _jsx("textarea", { value: replyBody, onChange: (e) => setReplyBody(e.target.value), rows: 3, placeholder: "Type a reply\u2026", className: "w-full rounded-lg border border-zinc-300 dark:border-zinc-700 bg-white dark:bg-zinc-800 px-3 py-2 text-sm text-zinc-900 dark:text-zinc-100 placeholder-zinc-400 focus:outline-none focus:ring-2 focus:ring-primary-500" }), _jsx(Button, { type: "button", variant: "primary", size: "sm", isLoading: replyMutation.isPending, disabled: !replyBody.trim() || !ticketId || replyMutation.isPending, onClick: () => replyMutation.mutate(), children: "Send reply" })] }), _jsx("hr", { className: "border-zinc-200 dark:border-zinc-700" }), _jsx(Select, { label: "Status", options: STATUS_OPTIONS, value: status, onValueChange: setStatus }), _jsx(Select, { label: "Priority", options: PRIORITY_OPTIONS, value: priority, onValueChange: setPriority }), _jsxs(Div, { className: "flex flex-col gap-1", children: [_jsx("label", { className: "text-xs font-semibold text-zinc-500 dark:text-zinc-400 uppercase tracking-wide", children: "Internal notes (staff only)" }), _jsx("textarea", { value: notes, onChange: (e) => setNotes(e.target.value), rows: 3, placeholder: "Notes visible only to admins and employees\u2026", className: "w-full rounded-lg border border-zinc-300 dark:border-zinc-700 bg-white dark:bg-zinc-800 px-3 py-2 text-sm text-zinc-900 dark:text-zinc-100 placeholder-zinc-400 focus:outline-none focus:ring-2 focus:ring-primary-500" })] }), _jsxs(FormActions, { align: "right", children: [_jsx(Button, { type: "button", variant: "secondary", onClick: onClose, children: "Cancel" }), _jsx(Button, { type: "button", isLoading: updateMutation.isPending, disabled: !ticketId || updateMutation.isPending, onClick: () => updateMutation.mutate(), children: "Save changes" })] })] }) }));
+                                    : "bg-info-surface border border-blue-200 dark:border-blue-800"}`, children: [_jsxs("div", { className: "mb-1 flex items-center gap-2 text-xs text-zinc-400 dark:text-zinc-400", children: [_jsx("span", { className: "font-medium text-zinc-600 dark:text-zinc-300", children: ROLE_LABEL[msg.authorRole ?? "user"] ?? msg.authorRole }), msg.createdAt && (_jsx("span", { children: new Date(msg.createdAt).toLocaleString() }))] }), _jsx(Text, { className: "whitespace-pre-wrap text-zinc-700 dark:text-zinc-200", children: msg.body })] }, msg.id ?? i))) })] })), _jsxs(Div, { className: "flex flex-col gap-1", children: [_jsx("label", { className: "text-xs font-semibold text-zinc-500 dark:text-zinc-400 uppercase tracking-wide", children: "Reply to user" }), _jsx("textarea", { value: replyBody, onChange: (e) => setReplyBody(e.target.value), rows: 3, placeholder: "Type a reply\u2026", className: "w-full rounded-lg border border-zinc-300 dark:border-zinc-700 bg-white dark:bg-zinc-800 px-3 py-2 text-sm text-zinc-900 dark:text-zinc-100 placeholder-zinc-400 focus:outline-none focus:ring-2 focus:ring-primary-500" }), _jsx(Button, { type: "button", variant: "primary", size: "sm", isLoading: replyMutation.isPending, disabled: !replyBody.trim() || !ticketId || replyMutation.isPending, onClick: () => replyMutation.mutate(), children: "Send reply" })] }), _jsx("hr", { className: "border-zinc-200 dark:border-zinc-700" }), _jsx(Select, { label: "Status", options: STATUS_OPTIONS, value: status, onValueChange: setStatus }), _jsx(Select, { label: "Priority", options: PRIORITY_OPTIONS, value: priority, onValueChange: setPriority }), _jsxs(Div, { className: "flex flex-col gap-1", children: [_jsx("label", { className: "text-xs font-semibold text-zinc-500 dark:text-zinc-400 uppercase tracking-wide", children: "Internal notes (staff only)" }), _jsx("textarea", { value: notes, onChange: (e) => setNotes(e.target.value), rows: 3, placeholder: "Notes visible only to admins and employees\u2026", className: "w-full rounded-lg border border-zinc-300 dark:border-zinc-700 bg-white dark:bg-zinc-800 px-3 py-2 text-sm text-zinc-900 dark:text-zinc-100 placeholder-zinc-400 focus:outline-none focus:ring-2 focus:ring-primary-500" })] }), _jsxs(Div, { padding: "sm", className: "flex flex-col gap-2 rounded-lg border border-zinc-200 dark:border-zinc-700", children: [_jsx(Text, { className: "text-xs font-semibold text-zinc-500 dark:text-zinc-400 uppercase tracking-wide", children: "Linked parties" }), _jsx(Text, { className: "text-xs text-zinc-500 dark:text-zinc-400", children: "Tag the buyer / store / order / product / bid this ticket concerns." }), [
+                            ["userId", "User slug"],
+                            ["storeId", "Store slug"],
+                            ["orderId", "Order ID"],
+                            ["productId", "Product slug"],
+                            ["bidId", "Bid ID"],
+                        ].map(([key, label]) => (_jsx(Input, { label: label, type: "text", value: parties[key] ?? "", onChange: (e) => setParties((p) => ({ ...p, [key]: e.target.value })), placeholder: label }, key)))] }), isOrderModificationRequest && (_jsx(OrderItemsPanel, { linkedOrderId: linkedOrderId, orderItemsOpen: orderItemsOpen, setOrderItemsOpen: setOrderItemsOpen, orderItems: orderItems, setOrderItems: setOrderItems, loadOrderItems: loadOrderItems, applyOrderItems: applyOrderItems })), isStoreChangeRequest && (_jsx(StoreChangePanel, { linkedStoreId: linkedStoreId, storeStatus: storeStatus, setStoreStatus: setStoreStatus, storeIsVerified: storeIsVerified, setStoreIsVerified: setStoreIsVerified, storeIsFeatured: storeIsFeatured, setStoreIsFeatured: setStoreIsFeatured, applyStoreChange: applyStoreChange })), isUnbanRequest && (_jsx(UnbanRequestPanel, { linkedUserId: linkedUserId, liftHardBan: liftHardBan, liftSoftBanTickets: liftSoftBanTickets })), _jsxs(FormActions, { align: "right", children: [_jsx(Button, { type: "button", variant: "secondary", onClick: onClose, children: "Cancel" }), _jsx(Button, { type: "button", isLoading: updateMutation.isPending, disabled: !ticketId || updateMutation.isPending, onClick: () => updateMutation.mutate(), children: "Save changes" })] })] }) }));
+}
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+function OrderItemsPanel(props) {
+    const { linkedOrderId, orderItemsOpen, setOrderItemsOpen, orderItems, setOrderItems, loadOrderItems, applyOrderItems, } = props;
+    const updateQty = (idx, raw) => {
+        const q = Math.max(0, parseInt(raw, 10) || 0);
+        setOrderItems((prev) => prev.map((p, i) => (i === idx ? { ...p, quantity: q } : p)));
+    };
+    return (_jsxs(Div, { padding: "sm", className: "flex flex-col gap-2 rounded-lg border border-info/40 bg-info-surface/40", children: [_jsx(Text, { className: "text-xs font-semibold text-info uppercase tracking-wide", children: "Modify order items" }), linkedOrderId ? (_jsxs(_Fragment, { children: [_jsxs(Text, { className: "text-xs text-zinc-600 dark:text-zinc-300", children: ["Editing order: ", _jsx("code", { className: "font-mono", children: linkedOrderId })] }), !orderItemsOpen ? (_jsx(Button, { type: "button", variant: "secondary", size: "sm", isLoading: loadOrderItems.isPending, disabled: loadOrderItems.isPending, onClick: () => loadOrderItems.mutate(), children: "Load current items" })) : (_jsxs(_Fragment, { children: [orderItems.length === 0 ? (_jsx(Text, { className: "text-xs text-zinc-500 dark:text-zinc-400", children: "Order has no items." })) : (_jsx(Div, { className: "flex flex-col gap-2", children: orderItems.map((it, idx) => (_jsxs(Div, { className: "flex items-center gap-2 rounded border border-zinc-200 dark:border-zinc-700 px-2 py-1", children: [_jsxs(Div, { className: "flex-1 min-w-0", children: [_jsx(Text, { className: "text-xs font-medium truncate", children: it.productTitle }), _jsxs(Text, { size: "xs", color: "muted", children: [it.productId, " \u00B7 \u20B9", (it.unitPrice / 100).toFixed(2), "/ea"] })] }), _jsx("input", { type: "number", min: "0", value: it.quantity, onChange: (e) => updateQty(idx, e.target.value), className: "w-16 rounded border border-zinc-300 dark:border-zinc-700 bg-white dark:bg-zinc-800 px-2 py-1 text-xs" })] }, `${it.productId}-${idx}`))) })), _jsxs(Row, { gap: "sm", children: [_jsx(Button, { type: "button", variant: "secondary", size: "sm", onClick: () => setOrderItemsOpen(false), children: "Cancel" }), _jsx(Button, { type: "button", variant: "primary", size: "sm", isLoading: applyOrderItems.isPending, disabled: applyOrderItems.isPending, onClick: () => applyOrderItems.mutate(), children: "Apply changes" })] })] }))] })) : (_jsxs(Text, { className: "text-xs text-zinc-600 dark:text-zinc-300", children: ["Set the", " ", _jsx(Text, { as: "span", weight: "semibold", children: "Order ID" }), " ", "field in the Linked parties panel above to enable this action."] }))] }));
+}
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+function StoreChangePanel(props) {
+    const { linkedStoreId, storeStatus, setStoreStatus, storeIsVerified, setStoreIsVerified, storeIsFeatured, setStoreIsFeatured, applyStoreChange, } = props;
+    return (_jsxs(Div, { padding: "sm", className: "flex flex-col gap-2 rounded-lg border border-warning/40 bg-warning-surface/40", children: [_jsx(Text, { className: "text-xs font-semibold text-warning uppercase tracking-wide", children: "Apply store change" }), linkedStoreId ? (_jsxs(_Fragment, { children: [_jsxs(Text, { className: "text-xs text-zinc-600 dark:text-zinc-300", children: ["Editing store: ", _jsx("code", { className: "font-mono", children: linkedStoreId })] }), _jsx(Select, { label: "Store status", options: [
+                            { label: "Active", value: "active" },
+                            { label: "Pending", value: "pending" },
+                            { label: "Suspended", value: "suspended" },
+                            { label: "Rejected", value: "rejected" },
+                        ], value: storeStatus, onValueChange: setStoreStatus }), _jsx(Toggle, { label: "Verified badge", checked: storeIsVerified, onChange: setStoreIsVerified }), _jsx(Toggle, { label: "Featured store", checked: storeIsFeatured, onChange: setStoreIsFeatured }), _jsx(Button, { type: "button", variant: "primary", size: "sm", isLoading: applyStoreChange.isPending, disabled: applyStoreChange.isPending, onClick: () => applyStoreChange.mutate(), children: "Apply store change" })] })) : (_jsxs(Text, { className: "text-xs text-zinc-600 dark:text-zinc-300", children: ["Set the", " ", _jsx(Text, { as: "span", weight: "semibold", children: "Store slug" }), " ", "field in the Linked parties panel above to enable this action."] }))] }));
+}
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+function UnbanRequestPanel(props) {
+    const { linkedUserId, liftHardBan, liftSoftBanTickets } = props;
+    return (_jsxs(Div, { padding: "sm", className: "flex flex-col gap-2 rounded-lg border border-error/40 bg-error-surface/40", children: [_jsx(Text, { className: "text-xs font-semibold text-error uppercase tracking-wide", children: "Lift account ban" }), linkedUserId ? (_jsxs(_Fragment, { children: [_jsxs(Text, { className: "text-xs text-zinc-600 dark:text-zinc-300", children: ["Appellant: ", _jsx("code", { className: "font-mono", children: linkedUserId })] }), _jsx(Text, { size: "xs", color: "muted", children: "Resolves the ticket and appends an audit note on success." }), _jsxs(Row, { gap: "sm", children: [_jsx(Button, { type: "button", variant: "primary", size: "sm", isLoading: liftHardBan.isPending, disabled: liftHardBan.isPending, onClick: () => liftHardBan.mutate(), children: "Lift hard ban" }), _jsx(Button, { type: "button", variant: "secondary", size: "sm", isLoading: liftSoftBanTickets.isPending, disabled: liftSoftBanTickets.isPending, onClick: () => liftSoftBanTickets.mutate(), children: "Lift ticket soft ban" })] })] })) : (_jsxs(Text, { className: "text-xs text-zinc-600 dark:text-zinc-300", children: ["Set the", " ", _jsx(Text, { as: "span", weight: "semibold", children: "User slug" }), " ", "field in the Linked parties panel above to enable these actions."] }))] }));
 }

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

@@ -1,4 +1,3 @@
-import type { ListingViewShellProps } from "../../../ui";
-export interface AdminSupportTicketsViewProps extends ListingViewShellProps {
-}
+import type { ListingLayoutProps } from "../../../ui";
+export type AdminSupportTicketsViewProps = ListingLayoutProps;
 export declare function AdminSupportTicketsView({ children, ...props }: AdminSupportTicketsViewProps): import("react/jsx-runtime").JSX.Element;

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

@@ -1,23 +1,13 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import React, { useState, useCallback } from "react";
-import { useUrlTable } from "../../../react/hooks/useUrlTable";
-import { useBulkSelection } from "../../../react/hooks/useBulkSelection";
-import { FilterChipGroup, ListingToolbar, ListingViewShell, Pagination, RowActionMenu, Text, ListingFilterDrawer } from "../../../ui";
+import React, { useState } from "react";
+import { FilterChipGroup, ListingLayout, RowActionMenu, Text } from "../../../ui";
 import { ADMIN_ENDPOINTS } from "../../../constants/api-endpoints";
 import { ROW_ACTION_META, ROW_ACTION_ID } from "../../../features/products/constants/action-defs";
 import { ADMIN_SUPPORT_TICKET_STATUS_TABS, ADMIN_SUPPORT_TICKET_PRIORITY_TABS, } from "../constants/filter-tabs";
-import { toRecordArray, toRelativeDate, toStringValue, useAdminListingData, } from "../hooks/useAdminListingData";
-import { DataTable } from "./DataTable";
+import { toRecordArray, toRelativeDate, toStringValue, } from "../hooks/useAdminListingData";
+import { DataListingView } from "./DataListingView";
 import { AdminSupportTicketDetailView } from "./AdminSupportTicketDetailView";
-const PAGE_SIZE = 25;
-const FILTER_KEYS = ["status", "priority"];
-const DEFAULT_SORT = "-createdAt";
-const SORT_OPTIONS = [
-    { value: "-createdAt", label: "Newest" },
-    { value: "createdAt", label: "Oldest" },
-    { value: "-updatedAt", label: "Recently updated" },
-];
 const PRIORITY_BADGE = {
     urgent: "bg-error-surface text-error",
     high: "bg-warning-surface text-warning",
@@ -31,81 +21,49 @@ const STATUS_BADGE = {
     resolved: "bg-success-surface text-success",
     closed: "bg-zinc-100 text-zinc-600 dark:bg-zinc-800 dark:text-zinc-400",
 };
-function buildTicketColumns(setSelectedRow, setDrawerOpen) {
-    return [
-        {
-            key: "primary",
-            header: "Subject",
-            render: (row) => {
-                const priority = toStringValue(row._raw?.priority, "normal");
-                return (_jsxs("div", { className: "space-y-1", children: [_jsx(Text, { className: "font-medium text-zinc-900 dark:text-zinc-100", children: row.primary }), row.secondary ? _jsx(Text, { className: "text-xs text-zinc-500 dark:text-zinc-400", children: row.secondary }) : null, _jsx("span", { className: `inline-flex rounded-full px-2 py-0.5 text-xs font-medium ${PRIORITY_BADGE[priority] ?? PRIORITY_BADGE.normal}`, children: priority })] }));
-            },
-        },
-        {
-            key: "status",
-            header: "Status",
-            className: "w-36",
-            render: (row) => (_jsx("span", { className: `inline-flex rounded-full px-2.5 py-1 text-xs font-medium ${STATUS_BADGE[row.status] ?? STATUS_BADGE.open}`, children: row.status.replace(/_/g, " ") })),
+const TICKET_COLUMNS = [
+    {
+        key: "primary",
+        header: "Subject",
+        render: (row) => {
+            const priority = toStringValue(row._raw?.priority, "normal");
+            return (_jsxs("div", { className: "space-y-1", children: [_jsx(Text, { className: "font-medium text-zinc-900 dark:text-zinc-100", children: row.primary }), row.secondary ? (_jsx(Text, { className: "text-xs text-zinc-500 dark:text-zinc-400", children: row.secondary })) : null, _jsx("span", { className: `inline-flex rounded-full px-2 py-0.5 text-xs font-medium ${PRIORITY_BADGE[priority] ?? PRIORITY_BADGE.normal}`, children: priority })] }));
         },
-        {
-            key: "updatedAt",
-            header: "Updated",
-            className: "w-32",
-            render: (row) => (_jsx("span", { className: "text-sm text-zinc-500 dark:text-zinc-400", children: row.updatedAt })),
-        },
-    ];
-}
+    },
+    {
+        key: "status",
+        header: "Status",
+        className: "w-36",
+        render: (row) => (_jsx("span", { className: `inline-flex rounded-full px-2.5 py-1 text-xs font-medium ${STATUS_BADGE[row.status] ?? STATUS_BADGE.open}`, children: row.status.replace(/_/g, " ") })),
+    },
+    {
+        key: "updatedAt",
+        header: "Updated",
+        className: "w-32",
+        render: (row) => (_jsx("span", { className: "text-sm text-zinc-500 dark:text-zinc-400", children: row.updatedAt })),
+    },
+];
 export function AdminSupportTicketsView({ children, ...props }) {
-    const hasChildren = React.Children.count(children) > 0;
-    const [view, setView] = useState("table");
-    const table = useUrlTable({ defaults: { pageSize: String(PAGE_SIZE), sort: DEFAULT_SORT } });
-    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 [drawerOpen, setDrawerOpen] = useState(false);
     const [selectedRow, setSelectedRow] = useState(null);
-    const openFilters = useCallback(() => {
-        setPendingFilters(Object.fromEntries(FILTER_KEYS.map((k) => [k, table.get(k)])));
-        setFilterOpen(true);
-    }, [table]);
-    const applyFilters = useCallback(() => {
-        const updates = { page: "1" };
-        for (const k of FILTER_KEYS)
-            updates[k] = pendingFilters[k] ?? "";
-        table.setMany(updates);
-        setFilterOpen(false);
-    }, [pendingFilters, table]);
-    const clearFilters = useCallback(() => {
-        setPendingFilters(Object.fromEntries(FILTER_KEYS.map((k) => [k, ""])));
-    }, []);
-    const resetAll = useCallback(() => {
-        const updates = { q: "", sort: "" };
-        for (const k of FILTER_KEYS)
-            updates[k] = "";
-        table.setMany(updates);
-        setSearchInput("");
-    }, [table]);
-    const commitSearch = useCallback(() => {
-        table.set("q", searchInput.trim());
-    }, [searchInput, table]);
-    const activeFilterCount = FILTER_KEYS.filter((k) => !!table.get(k)).length;
-    const hasActiveState = !!table.get("q") || table.get("sort") !== DEFAULT_SORT || activeFilterCount > 0;
-    const filterParts = [];
-    const statusRaw = table.get("status");
-    if (statusRaw && statusRaw !== "All")
-        filterParts.push(`status==${statusRaw}`);
-    const priorityRaw = table.get("priority");
-    if (priorityRaw && priorityRaw !== "All")
-        filterParts.push(`priority==${priorityRaw}`);
-    const filters = filterParts.join(",") || undefined;
-    const { rows, total, isLoading, errorMessage } = useAdminListingData({
+    if (React.Children.count(children) > 0) {
+        return (_jsx(ListingLayout, { portal: "admin", ...props, children: children }));
+    }
+    const config = {
+        portal: "admin",
+        title: "Support Tickets",
+        searchPlaceholder: "Search by subject",
+        emptyLabel: "No support tickets found",
+        filterKeys: ["status", "priority"],
+        defaultSort: "-createdAt",
         queryKey: ["admin", "support-tickets", "listing"],
         endpoint: ADMIN_ENDPOINTS.SUPPORT_TICKETS,
-        page: table.getNumber("page", 1),
-        pageSize: PAGE_SIZE,
-        sorts: table.get("sort") || DEFAULT_SORT,
-        filters,
-        q: table.get("q") || undefined,
+        sortOptions: [
+            { value: "-createdAt", label: "Newest" },
+            { value: "createdAt", label: "Oldest" },
+            { value: "-updatedAt", label: "Recently updated" },
+        ],
+        columns: TICKET_COLUMNS,
         mapRows: (response) => toRecordArray(response.tickets).map((item, index) => ({
             id: toStringValue(item.id, `ticket-${index}`),
             primary: toStringValue(item.subject, "No subject"),
@@ -129,18 +87,29 @@ export function AdminSupportTicketsView({ children, ...props }) {
                 return response.total;
             return mappedRows.length;
         },
-    });
-    const currentPage = table.getNumber("page", 1);
-    const totalPages = Math.ceil(total / PAGE_SIZE);
-    const selection = useBulkSelection({ items: rows, keyExtractor: (r) => r.id });
-    if (hasChildren) {
-        return (_jsx(ListingViewShell, { portal: "admin", ...props, children: children }));
-    }
-    return (_jsxs(_Fragment, { children: [_jsxs("div", { className: "min-h-screen", children: [_jsx(ListingToolbar, { filterCount: activeFilterCount, onFiltersClick: openFilters, searchValue: searchInput, searchPlaceholder: "Search by subject", onSearchChange: setSearchInput, onSearchCommit: commitSearch, sortValue: table.get("sort") || DEFAULT_SORT, sortOptions: SORT_OPTIONS, onSortChange: (v) => {
-                            table.set("sort", v);
-                        }, showTableView: true, view: view, onViewChange: (v) => setView(v), onResetAll: resetAll, hasActiveState: hasActiveState }), totalPages > 1 && (_jsx("div", { className: "sticky top-[calc(var(--header-height,0px)+44px)] z-10 flex justify-center bg-white/95 dark:bg-slate-900/95 backdrop-blur-sm border-b border-zinc-200 dark:border-slate-700 px-3 py-1.5", children: _jsx(Pagination, { currentPage: currentPage, totalPages: totalPages, onPageChange: (p) => table.setPage(p) }) })), _jsxs("div", { className: "py-4 px-3 sm:px-4", children: [errorMessage && (_jsx("div", { className: "mb-4 rounded-xl border border-red-200 bg-error-surface px-4 py-3 text-sm text-error dark:border-red-900/60", children: errorMessage })), _jsx(DataTable, { rows: rows, isLoading: isLoading, emptyLabel: "No support tickets found", renderRowActions: (row) => (_jsx(RowActionMenu, { actions: [
-                                        { label: ROW_ACTION_META[ROW_ACTION_ID.VIEW].label, onClick: () => { setSelectedRow(row); setDrawerOpen(true); } },
-                                    ] })), columns: buildTicketColumns(setSelectedRow, setDrawerOpen) })] }), _jsxs(ListingFilterDrawer, { open: filterOpen, onClose: () => setFilterOpen(false), onApply: applyFilters, onClear: clearFilters, activeCount: activeFilterCount, children: [_jsx(FilterChipGroup, { label: "Status", tabs: ADMIN_SUPPORT_TICKET_STATUS_TABS, value: pendingFilters.status ?? "", onChange: (id) => setPendingFilters((p) => ({ ...p, status: id })) }), _jsx(FilterChipGroup, { label: "Priority", tabs: ADMIN_SUPPORT_TICKET_PRIORITY_TABS, value: pendingFilters.priority ?? "", onChange: (id) => setPendingFilters((p) => ({ ...p, priority: id })) })] })] }), _jsx(AdminSupportTicketDetailView, { open: drawerOpen, onClose: () => setDrawerOpen(false), ticketId: selectedRow?.id, subject: selectedRow?.primary, userDisplayName: toStringValue(selectedRow?._raw?.userDisplayName, ""), category: toStringValue(selectedRow?._raw?.category, "general"), currentStatus: selectedRow?.status, currentPriority: toStringValue(selectedRow?._raw?.priority, "normal"), description: toStringValue(selectedRow?._raw?.description, ""), messages: Array.isArray(selectedRow?._raw?.messages)
+        buildFilters: (f) => {
+            const parts = [];
+            if (f.status && f.status !== "All")
+                parts.push(`status==${f.status}`);
+            if (f.priority && f.priority !== "All")
+                parts.push(`priority==${f.priority}`);
+            return parts.join(",") || undefined;
+        },
+        renderRowActions: (row) => (_jsx(RowActionMenu, { actions: [
+                {
+                    label: ROW_ACTION_META[ROW_ACTION_ID.VIEW].label,
+                    onClick: () => {
+                        setSelectedRow(row);
+                        setDrawerOpen(true);
+                    },
+                },
+            ] })),
+        renderFilterPanel: ({ pendingFilters, setPendingFilters }) => (_jsxs(_Fragment, { children: [_jsx(FilterChipGroup, { label: "Status", tabs: ADMIN_SUPPORT_TICKET_STATUS_TABS, value: pendingFilters.status ?? "", onChange: (id) => setPendingFilters((p) => ({ ...p, status: id })) }), _jsx(FilterChipGroup, { label: "Priority", tabs: ADMIN_SUPPORT_TICKET_PRIORITY_TABS, value: pendingFilters.priority ?? "", onChange: (id) => setPendingFilters((p) => ({ ...p, priority: id })) })] })),
+    };
+    return (_jsxs(_Fragment, { children: [_jsx(DataListingView, { config: config }), _jsx(AdminSupportTicketDetailView, { open: drawerOpen, onClose: () => setDrawerOpen(false), ticketId: selectedRow?.id, subject: selectedRow?.primary, userDisplayName: toStringValue(selectedRow?._raw?.userDisplayName, ""), category: toStringValue(selectedRow?._raw?.category, "general"), currentStatus: selectedRow?.status, currentPriority: toStringValue(selectedRow?._raw?.priority, "normal"), description: toStringValue(selectedRow?._raw?.description, ""), messages: Array.isArray(selectedRow?._raw?.messages)
                     ? selectedRow._raw.messages
-                    : [], internalNotes: toStringValue(selectedRow?._raw?.internalNotes, "") || undefined, orderId: toStringValue(selectedRow?._raw?.orderId, "") || undefined })] }));
+                    : [], internalNotes: toStringValue(selectedRow?._raw?.internalNotes, "") || undefined, orderId: toStringValue(selectedRow?._raw?.orderId, "") || undefined, relatedParties: selectedRow?._raw?.relatedParties &&
+                    typeof selectedRow._raw.relatedParties === "object"
+                    ? selectedRow._raw.relatedParties
+                    : undefined })] }));
 }

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

@@ -1,5 +1,5 @@
-import type { ListingViewShellProps } from "../../../ui";
-export interface AdminTeamViewProps extends ListingViewShellProps {
+import type { ListingLayoutProps } from "../../../ui";
+export interface AdminTeamViewProps extends ListingLayoutProps {
     onBulkRemove?: (ids: string[]) => Promise<void>;
 }
 export declare function AdminTeamView({ children, onBulkRemove, ...props }: AdminTeamViewProps): import("react/jsx-runtime").JSX.Element;