@mohasinac/appkit 2.3.2 → 2.4.1

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

@@ -0,0 +1,52 @@
+"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 { ListingToolbar, Pagination } from "../../../ui";
+import { toRecordArray, toStringValue, useAdminListingData, } from "../hooks/useAdminListingData";
+import { DataTable } from "./DataTable";
+import { ADMIN_ENDPOINTS } from "../../../constants/api-endpoints";
+const PAGE_SIZE = 25;
+const DEFAULT_SORT = "storeId";
+const SORT_OPTIONS = [
+    { value: "storeId", label: "Store ID" },
+    { value: "city", label: "City A–Z" },
+];
+export function AdminStoreAddressesView({ children: _children }) {
+    const table = useUrlTable({ defaults: { pageSize: String(PAGE_SIZE), sort: DEFAULT_SORT } });
+    const [searchInput, setSearchInput] = useState(table.get("q") || "");
+    const resetAll = useCallback(() => {
+        table.setMany({ q: "", sort: "" });
+        setSearchInput("");
+    }, [table]);
+    const commitSearch = useCallback(() => {
+        table.set("q", searchInput.trim());
+    }, [searchInput, table]);
+    const hasActiveState = !!table.get("q") || table.get("sort") !== DEFAULT_SORT;
+    const { rows, total, isLoading, errorMessage } = useAdminListingData({
+        queryKey: ["admin", "store-addresses", "listing"],
+        endpoint: ADMIN_ENDPOINTS.STORE_ADDRESSES,
+        page: table.getNumber("page", 1),
+        pageSize: PAGE_SIZE,
+        sorts: table.get("sort") || DEFAULT_SORT,
+        q: table.get("q") || undefined,
+        mapRows: (response) => toRecordArray(response.items).map((item, index) => ({
+            id: toStringValue(item.id, `addr-${index}`),
+            primary: [
+                toStringValue(item.label, "Address"),
+                toStringValue(item.city, ""),
+                toStringValue(item.state, ""),
+            ].filter(Boolean).join(", "),
+            secondary: [
+                toStringValue(item.storeId ?? item.storeName, "Unknown store"),
+                toStringValue(item.pincode, ""),
+            ].filter(Boolean).join(" · "),
+            status: item.isPickupLocation ? "pickup" : "standard",
+            updatedAt: toStringValue(item.storeId, ""),
+        })),
+        getTotal: (response, mappedRows) => typeof response.total === "number" ? response.total : mappedRows.length,
+    });
+    const currentPage = table.getNumber("page", 1);
+    const totalPages = Math.ceil(total / PAGE_SIZE);
+    return (_jsxs("div", { className: "min-h-screen", children: [_jsx(ListingToolbar, { filterCount: 0, searchValue: searchInput, searchPlaceholder: "Search by label, city, or store ID", onSearchChange: setSearchInput, onSearchCommit: commitSearch, sortValue: table.get("sort") || DEFAULT_SORT, sortOptions: SORT_OPTIONS, onSortChange: (v) => { table.set("sort", v); table.setPage(1); }, hideViewToggle: true, onResetAll: resetAll, hasActiveState: hasActiveState }), totalPages > 1 && (_jsx("div", { className: "sticky top-[calc(var(--header-height,0px)+44px)] z-10 flex justify-center bg-white/95 dark:bg-slate-900/95 backdrop-blur-sm border-b border-zinc-200 dark:border-slate-700 px-3 py-1.5", children: _jsx(Pagination, { currentPage: currentPage, totalPages: totalPages, onPageChange: (p) => table.setPage(p) }) })), _jsxs("div", { className: "py-4 px-3 sm:px-4", children: [errorMessage && (_jsx("div", { className: "mb-4 rounded-xl border border-red-200 bg-red-50 px-4 py-3 text-sm text-red-700 dark:border-red-900/60 dark:bg-red-950/40 dark:text-red-200", children: errorMessage })), _jsx(DataTable, { rows: rows, isLoading: isLoading, emptyLabel: "No store addresses found" })] })] }));
+}

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

@@ -0,0 +1,9 @@
+export interface AdminStoreEditorViewProps {
+    open: boolean;
+    onClose: () => void;
+    storeId?: string;
+    storeName?: string;
+    currentStatus?: string;
+    currentIsVerified?: boolean;
+}
+export declare function AdminStoreEditorView({ open, onClose, storeId, storeName, currentStatus, currentIsVerified, }: AdminStoreEditorViewProps): import("react/jsx-runtime").JSX.Element;

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

@@ -0,0 +1,55 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React from "react";
+import { useMutation, useQueryClient } from "@tanstack/react-query";
+import { Button, Form, FormActions, Select, SideDrawer, Toggle, useToast, } from "../../../ui";
+import { apiClient } from "../../../http";
+import { ADMIN_ENDPOINTS } from "../../../constants/api-endpoints";
+const STATUS_OPTIONS = [
+    { label: "Active", value: "active" },
+    { label: "Pending", value: "pending" },
+    { label: "Suspended", value: "suspended" },
+    { label: "Rejected", value: "rejected" },
+];
+// --- Component ---------------------------------------------------------------
+export function AdminStoreEditorView({ open, onClose, storeId, storeName, currentStatus, currentIsVerified, }) {
+    const queryClient = useQueryClient();
+    const { showToast } = useToast();
+    const [storeStatus, setStoreStatus] = React.useState(currentStatus ?? "pending");
+    const [adminNotes, setAdminNotes] = React.useState("");
+    const [isFeatured, setIsFeatured] = React.useState(false);
+    const [isVerified, setIsVerified] = React.useState(currentIsVerified ?? false);
+    const [suspensionReason, setSuspensionReason] = React.useState("");
+    React.useEffect(() => {
+        if (open) {
+            setStoreStatus(currentStatus ?? "pending");
+            setAdminNotes("");
+            setIsFeatured(false);
+            setIsVerified(currentIsVerified ?? false);
+            setSuspensionReason("");
+        }
+    }, [open, currentStatus, currentIsVerified]);
+    const saveMutation = useMutation({
+        mutationFn: async () => {
+            await apiClient.patch(ADMIN_ENDPOINTS.STORE_BY_ID(storeId), {
+                storeStatus,
+                adminNotes: adminNotes || undefined,
+                isFeatured,
+                isVerified,
+                suspensionReason: storeStatus === "suspended" ? (suspensionReason || undefined) : undefined,
+            });
+        },
+        onSuccess: () => {
+            showToast("Store updated.", "success");
+            queryClient.invalidateQueries({ queryKey: ["admin", "stores"] });
+            onClose();
+        },
+        onError: (err) => {
+            showToast(err?.message ?? "Failed to update store.", "error");
+        },
+    });
+    return (_jsx(SideDrawer, { isOpen: open, onClose: onClose, title: storeName ? `Manage: ${storeName}` : "Manage Store", children: _jsxs(Form, { onSubmit: (e) => {
+                e.preventDefault();
+                saveMutation.mutate();
+            }, className: "space-y-4 p-4", children: [_jsx(Select, { label: "Store status", options: STATUS_OPTIONS, value: storeStatus, onValueChange: setStoreStatus }), _jsxs("div", { className: "flex flex-col gap-1", children: [_jsx("label", { className: "text-sm font-medium text-zinc-700 dark:text-zinc-300", children: "Admin notes (optional)" }), _jsx("textarea", { value: adminNotes, onChange: (e) => setAdminNotes(e.target.value), rows: 3, placeholder: "e.g. Reason for suspension, approval notes\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(Toggle, { label: "Verified store", checked: isVerified, onChange: setIsVerified }), _jsx(Toggle, { label: "Featured store", checked: isFeatured, onChange: setIsFeatured }), storeStatus === "suspended" && (_jsxs("div", { className: "flex flex-col gap-1", children: [_jsx("label", { className: "text-sm font-medium text-zinc-700 dark:text-zinc-300", children: "Suspension reason (optional)" }), _jsx("textarea", { value: suspensionReason, onChange: (e) => setSuspensionReason(e.target.value), rows: 2, placeholder: "e.g. Policy violation, fraudulent activity\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: "submit", isLoading: saveMutation.isPending, disabled: !storeId || saveMutation.isPending, children: "Save changes" })] })] }) }));
+}

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

@@ -1,23 +1,66 @@
 "use client";
-import { jsx as _jsx } from "react/jsx-runtime";
-import React from "react";
-import { ListingViewShell } from "../../../ui";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import React, { useState, useCallback } from "react";
+import { X } from "lucide-react";
+import { useUrlTable } from "../../../react/hooks/useUrlTable";
+import { ListingToolbar, Pagination, ListingViewShell, RowActionMenu } from "../../../ui";
 import { ADMIN_ENDPOINTS } from "../../../constants/api-endpoints";
 import { toRecordArray, toRelativeDate, toStringValue, useAdminListingData, } from "../hooks/useAdminListingData";
-import { AdminListingScaffold } from "./AdminListingScaffold";
+import { DataTable } from "./DataTable";
+import { AdminStoreEditorView } from "./AdminStoreEditorView";
+const PAGE_SIZE = 25;
+const FILTER_KEYS = ["status"];
+const DEFAULT_SORT = "-createdAt";
+const SORT_OPTIONS = [
+    { value: "-createdAt", label: "Newest" },
+    { value: "createdAt", label: "Oldest" },
+    { value: "storeName", label: "Name A–Z" },
+];
+const STATUS_OPTIONS = ["All", "active", "pending", "suspended", "rejected"];
 export function AdminStoresView({ children, ...props }) {
     const hasChildren = React.Children.count(children) > 0;
-    const [q, setQ] = React.useState("");
-    const [statusFilter, setStatusFilter] = React.useState("");
-    const filterParts = [];
-    if (statusFilter && statusFilter !== "All")
-        filterParts.push(`status==${statusFilter}`);
-    const filters = filterParts.join(",") || undefined;
+    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 statusRaw = table.get("status");
+    const filters = statusRaw && statusRaw !== "All" ? `status==${statusRaw}` : undefined;
     const { rows, total, isLoading, errorMessage } = useAdminListingData({
-        queryKey: ["admin", "stores", "listing", q, filters ?? ""],
+        queryKey: ["admin", "stores", "listing"],
         endpoint: ADMIN_ENDPOINTS.STORES,
+        page: table.getNumber("page", 1),
+        pageSize: PAGE_SIZE,
+        sorts: table.get("sort") || DEFAULT_SORT,
         filters,
-        q,
+        q: table.get("q") || undefined,
         mapRows: (response) => toRecordArray(response.items).map((item, index) => ({
             id: toStringValue(item.id, `store-${index}`),
             primary: toStringValue(item.storeName, "Unnamed store"),
@@ -27,18 +70,17 @@ export function AdminStoresView({ children, ...props }) {
             ].join(" · "),
             status: toStringValue(item.status, "Pending"),
             updatedAt: toRelativeDate(item.updatedAt ?? item.createdAt),
+            _raw: item,
         })),
         getTotal: (response, mappedRows) => typeof response.total === "number" ? response.total : mappedRows.length,
     });
+    const currentPage = table.getNumber("page", 1);
+    const totalPages = Math.ceil(total / PAGE_SIZE);
     if (hasChildren) {
         return _jsx(ListingViewShell, { portal: "admin", ...props, children: children });
     }
-    return (_jsx(AdminListingScaffold, { portal: "admin", ...props, title: "Store Directory", subtitle: "Review seller storefront health, verification, and merchandising quality from the shared listing shell.", actionLabel: "Approve store", searchPlaceholder: "Search stores, slugs, or owner names", onSearch: setQ, searchValue: q, rows: rows, isLoading: isLoading, errorMessage: errorMessage, emptyLabel: "No stores found", resultSummary: `Showing ${rows.length} of ${total} stores`, filterGroups: [
-            {
-                title: "Status",
-                options: ["All", "active", "pending", "suspended", "rejected"],
-                active: statusFilter || "All",
-                onSelect: (opt) => setStatusFilter(opt === "All" ? "" : opt),
-            },
-        ] }));
+    return (_jsxs(_Fragment, { children: [_jsxs("div", { className: "min-h-screen", children: [_jsx(ListingToolbar, { filterCount: activeFilterCount, onFiltersClick: openFilters, searchValue: searchInput, searchPlaceholder: "Search stores, slugs, or owner names", onSearchChange: setSearchInput, onSearchCommit: commitSearch, sortValue: table.get("sort") || DEFAULT_SORT, sortOptions: SORT_OPTIONS, onSortChange: (v) => { table.set("sort", v); table.setPage(1); }, hideViewToggle: true, onResetAll: resetAll, hasActiveState: hasActiveState }), totalPages > 1 && (_jsx("div", { className: "sticky top-[calc(var(--header-height,0px)+44px)] z-10 flex justify-center bg-white/95 dark:bg-slate-900/95 backdrop-blur-sm border-b border-zinc-200 dark:border-slate-700 px-3 py-1.5", children: _jsx(Pagination, { currentPage: currentPage, totalPages: totalPages, onPageChange: (p) => table.setPage(p) }) })), _jsxs("div", { className: "py-4 px-3 sm:px-4", children: [errorMessage && (_jsx("div", { className: "mb-4 rounded-xl border border-red-200 bg-red-50 px-4 py-3 text-sm text-red-700 dark:border-red-900/60 dark:bg-red-950/40 dark:text-red-200", children: errorMessage })), _jsx(DataTable, { rows: rows, isLoading: isLoading, emptyLabel: "No stores found", renderRowActions: (row) => (_jsx(RowActionMenu, { actions: [{
+                                            label: "Manage",
+                                            onClick: () => { setSelectedRow(row); setDrawerOpen(true); },
+                                        }] })) })] }), filterOpen && (_jsxs(_Fragment, { children: [_jsx("div", { className: "fixed inset-0 z-40 bg-black/40", "aria-hidden": "true", onClick: () => setFilterOpen(false) }), _jsxs("div", { className: "fixed inset-y-0 left-0 z-50 flex w-80 flex-col bg-white dark:bg-slate-900 shadow-2xl", children: [_jsxs("div", { className: "flex items-center justify-between border-b border-zinc-200 dark:border-slate-700 px-4 py-3.5", children: [_jsx("span", { className: "text-base font-semibold text-zinc-900 dark:text-zinc-100", children: "Filters" }), _jsxs("div", { className: "flex items-center gap-2", children: [activeFilterCount > 0 && (_jsx("button", { type: "button", onClick: clearFilters, className: "text-xs text-zinc-500 hover:text-rose-500 dark:text-zinc-400 transition-colors", children: "Clear all" })), _jsx("button", { type: "button", onClick: () => setFilterOpen(false), "aria-label": "Close", className: "rounded-lg p-1.5 text-zinc-500 hover:bg-zinc-100 dark:hover:bg-slate-800 transition-colors", children: _jsx(X, { className: "h-5 w-5" }) })] })] }), _jsx("div", { className: "flex-1 overflow-y-auto px-4 py-4 space-y-5", children: _jsxs("div", { className: "space-y-2", children: [_jsx("p", { className: "text-xs font-semibold uppercase tracking-widest text-zinc-500 dark:text-zinc-400", children: "Status" }), _jsx("div", { className: "flex flex-wrap gap-2", children: STATUS_OPTIONS.map((opt) => (_jsx("button", { type: "button", onClick: () => setPendingFilters((p) => ({ ...p, status: opt === "All" ? "" : opt })), className: `rounded-full px-3 py-1 text-xs font-medium border transition-colors ${(pendingFilters.status || "All") === opt ? "bg-primary text-white border-primary" : "border-zinc-300 dark:border-slate-600 text-zinc-700 dark:text-zinc-300 hover:bg-zinc-50 dark:hover:bg-slate-800"}`, children: opt }, opt))) })] }) }), _jsx("div", { className: "border-t border-zinc-200 dark:border-slate-700 px-4 py-3.5", children: _jsxs("button", { type: "button", onClick: applyFilters, className: "w-full rounded-lg bg-primary py-2.5 text-sm font-semibold text-white hover:bg-primary-600 transition-colors active:scale-[0.98]", children: ["Apply Filters", activeFilterCount > 0 ? ` (${activeFilterCount})` : ""] }) })] })] }))] }), _jsx(AdminStoreEditorView, { open: drawerOpen, onClose: () => setDrawerOpen(false), storeId: selectedRow?.id, storeName: selectedRow?.primary, currentStatus: selectedRow?.status?.toLowerCase(), currentIsVerified: Boolean(selectedRow?._raw?.isVerified) })] }));
 }

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

@@ -0,0 +1,10 @@
+export interface AdminUserEditorViewProps {
+    open: boolean;
+    onClose: () => void;
+    userId?: string;
+    displayName?: string;
+    currentRole?: string;
+    currentIsDisabled?: boolean;
+    currentEmailVerified?: boolean;
+}
+export declare function AdminUserEditorView({ open, onClose, userId, displayName, currentRole, currentIsDisabled, currentEmailVerified, }: AdminUserEditorViewProps): import("react/jsx-runtime").JSX.Element;

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

@@ -0,0 +1,72 @@
+"use client";
+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, ConfirmDeleteModal, Form, FormActions, Select, SideDrawer, Toggle, useToast, } from "../../../ui";
+import { apiClient } from "../../../http";
+import { ADMIN_ENDPOINTS } from "../../../constants/api-endpoints";
+const ROLE_OPTIONS = [
+    { label: "User (buyer)", value: "user" },
+    { label: "Seller", value: "seller" },
+    { label: "Admin", value: "admin" },
+];
+// --- Component ---------------------------------------------------------------
+export function AdminUserEditorView({ open, onClose, userId, displayName, currentRole, currentIsDisabled, currentEmailVerified, }) {
+    const queryClient = useQueryClient();
+    const { showToast } = useToast();
+    const [role, setRole] = React.useState(currentRole ?? "user");
+    const [isDisabled, setIsDisabled] = React.useState(currentIsDisabled ?? false);
+    const [banReason, setBanReason] = React.useState("");
+    const [emailVerified, setEmailVerified] = React.useState(currentEmailVerified ?? false);
+    const [adminNotes, setAdminNotes] = React.useState("");
+    const [deleteOpen, setDeleteOpen] = React.useState(false);
+    React.useEffect(() => {
+        if (open) {
+            setRole(currentRole ?? "user");
+            setIsDisabled(currentIsDisabled ?? false);
+            setBanReason("");
+            setEmailVerified(currentEmailVerified ?? false);
+            setAdminNotes("");
+        }
+    }, [open, currentRole, currentIsDisabled, currentEmailVerified]);
+    const saveMutation = useMutation({
+        mutationFn: async () => {
+            await apiClient.patch(ADMIN_ENDPOINTS.USER_BY_ID(userId), {
+                role,
+                isDisabled,
+                emailVerified,
+                adminNotes: adminNotes || undefined,
+            });
+        },
+        onSuccess: () => {
+            showToast("User updated.", "success");
+            queryClient.invalidateQueries({ queryKey: ["admin", "users"] });
+            onClose();
+        },
+        onError: (err) => {
+            showToast(err?.message ?? "Failed to update user.", "error");
+        },
+    });
+    const deleteMutation = useMutation({
+        mutationFn: async () => {
+            await apiClient.delete(ADMIN_ENDPOINTS.USER_BY_ID(userId));
+        },
+        onSuccess: () => {
+            showToast("User deleted.", "success");
+            queryClient.invalidateQueries({ queryKey: ["admin", "users"] });
+            setDeleteOpen(false);
+            onClose();
+        },
+        onError: (err) => {
+            showToast(err?.message ?? "Failed to delete user.", "error");
+        },
+    });
+    return (_jsxs(_Fragment, { children: [_jsx(SideDrawer, { isOpen: open, onClose: onClose, title: displayName ? `Manage: ${displayName}` : "Manage User", children: _jsxs(Form, { onSubmit: (e) => {
+                        e.preventDefault();
+                        saveMutation.mutate();
+                    }, className: "space-y-4 p-4", children: [_jsx(Select, { label: "Role", options: ROLE_OPTIONS, value: role, onValueChange: setRole }), _jsx(Toggle, { label: "Account disabled (banned)", checked: isDisabled, onChange: (val) => {
+                                setIsDisabled(val);
+                                if (!val)
+                                    setBanReason("");
+                            } }), isDisabled && (_jsxs("div", { className: "flex flex-col gap-1", children: [_jsx("label", { className: "text-sm font-medium text-zinc-700 dark:text-zinc-300", children: "Ban reason (optional)" }), _jsx("textarea", { value: banReason, onChange: (e) => setBanReason(e.target.value), rows: 2, placeholder: "e.g. Repeated policy violations, fraudulent activity\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(Toggle, { label: "Email verified", checked: emailVerified, onChange: setEmailVerified }), _jsxs("div", { className: "flex flex-col gap-1", children: [_jsx("label", { className: "text-sm font-medium text-zinc-700 dark:text-zinc-300", children: "Admin notes (optional)" }), _jsx("textarea", { value: adminNotes, onChange: (e) => setAdminNotes(e.target.value), rows: 3, placeholder: "Internal notes about this user\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: "danger", onClick: () => setDeleteOpen(true), disabled: !userId, children: "Delete user" }), _jsx(Button, { type: "button", variant: "secondary", onClick: onClose, children: "Cancel" }), _jsx(Button, { type: "submit", isLoading: saveMutation.isPending, disabled: !userId || saveMutation.isPending, children: "Save changes" })] })] }) }), _jsx(ConfirmDeleteModal, { isOpen: deleteOpen, onClose: () => setDeleteOpen(false), onConfirm: () => deleteMutation.mutate(), isDeleting: deleteMutation.isPending, title: `Delete ${displayName ?? "user"}?`, message: "This action cannot be undone. The user's account and all associated data will be permanently removed.", confirmText: "Delete user", variant: "danger" })] }));
+}

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

@@ -1,27 +1,74 @@
 "use client";
-import { jsx as _jsx } from "react/jsx-runtime";
-import React from "react";
-import { ListingViewShell } from "../../../ui";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import React, { useState, useCallback } from "react";
+import { X } from "lucide-react";
+import { useUrlTable } from "../../../react/hooks/useUrlTable";
+import { ListingToolbar, Pagination, ListingViewShell, RowActionMenu } from "../../../ui";
 import { ADMIN_ENDPOINTS } from "../../../constants/api-endpoints";
 import { toRecordArray, toRelativeDate, toStringValue, useAdminListingData, } from "../hooks/useAdminListingData";
-import { AdminListingScaffold } from "./AdminListingScaffold";
+import { DataTable } from "./DataTable";
+import { AdminUserEditorView } from "./AdminUserEditorView";
+const PAGE_SIZE = 25;
+const FILTER_KEYS = ["status", "role"];
+const DEFAULT_SORT = "-createdAt";
+const SORT_OPTIONS = [
+    { value: "-createdAt", label: "Newest" },
+    { value: "createdAt", label: "Oldest" },
+    { value: "displayName", label: "Name A–Z" },
+];
+const STATUS_OPTIONS = ["All", "Active", "Disabled"];
+const ROLE_OPTIONS = ["All", "admin", "seller", "buyer", "moderator"];
 export function AdminUsersView({ children, ...props }) {
     const hasChildren = React.Children.count(children) > 0;
-    const [q, setQ] = React.useState("");
-    const [statusFilter, setStatusFilter] = React.useState("");
-    const [roleFilter, setRoleFilter] = React.useState("");
+    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 = [];
-    if (statusFilter && statusFilter !== "All") {
-        filterParts.push(statusFilter === "Active" ? "disabled==false" : "disabled==true");
+    const statusRaw = table.get("status");
+    if (statusRaw && statusRaw !== "All") {
+        filterParts.push(statusRaw === "Active" ? "disabled==false" : "disabled==true");
     }
-    if (roleFilter && roleFilter !== "All")
-        filterParts.push(`role==${roleFilter}`);
+    const roleRaw = table.get("role");
+    if (roleRaw && roleRaw !== "All")
+        filterParts.push(`role==${roleRaw}`);
     const filters = filterParts.join(",") || undefined;
     const { rows, total, isLoading, errorMessage } = useAdminListingData({
-        queryKey: ["admin", "users", "listing", q, filters ?? ""],
+        queryKey: ["admin", "users", "listing"],
         endpoint: ADMIN_ENDPOINTS.USERS,
+        page: table.getNumber("page", 1),
+        pageSize: PAGE_SIZE,
+        sorts: table.get("sort") || DEFAULT_SORT,
         filters,
-        q,
+        q: table.get("q") || undefined,
         mapRows: (response) => toRecordArray(response.users).map((item, index) => ({
             id: toStringValue(item.id ?? item.uid, `user-${index}`),
             primary: toStringValue(item.displayName, "Unnamed user"),
@@ -29,38 +76,25 @@ export function AdminUsersView({ children, ...props }) {
                 toStringValue(item.email, "No email"),
                 toStringValue(item.role, "Unknown role"),
             ].join(" · "),
-            status: typeof item.disabled === "boolean"
-                ? item.disabled
-                    ? "Disabled"
-                    : "Active"
-                : "Active",
+            status: typeof item.disabled === "boolean" ? (item.disabled ? "Disabled" : "Active") : "Active",
             updatedAt: toRelativeDate(item.lastLoginAt ?? item.createdAt),
+            _raw: item,
         })),
         getTotal: (response, mappedRows) => {
-            if (typeof response.meta?.total === "number") {
+            if (typeof response.meta?.total === "number")
                 return response.meta.total;
-            }
-            if (typeof response.total === "number") {
+            if (typeof response.total === "number")
                 return response.total;
-            }
             return mappedRows.length;
         },
     });
+    const currentPage = table.getNumber("page", 1);
+    const totalPages = Math.ceil(total / PAGE_SIZE);
     if (hasChildren) {
         return _jsx(ListingViewShell, { portal: "admin", ...props, children: children });
     }
-    return (_jsx(AdminListingScaffold, { portal: "admin", ...props, title: "User Management", subtitle: "Audit onboarding, verification, and role changes without leaving the admin listing shell.", actionLabel: "Invite user", searchPlaceholder: "Search users, email, or seller handles", onSearch: setQ, searchValue: q, rows: rows, isLoading: isLoading, errorMessage: errorMessage, emptyLabel: "No users found", resultSummary: `Showing ${rows.length} of ${total} users`, filterGroups: [
-            {
-                title: "Status",
-                options: ["All", "Active", "Disabled"],
-                active: statusFilter || "All",
-                onSelect: (opt) => setStatusFilter(opt === "All" ? "" : opt),
-            },
-            {
-                title: "Role",
-                options: ["All", "admin", "seller", "buyer", "moderator"],
-                active: roleFilter || "All",
-                onSelect: (opt) => setRoleFilter(opt === "All" ? "" : opt),
-            },
-        ] }));
+    return (_jsxs(_Fragment, { children: [_jsxs("div", { className: "min-h-screen", children: [_jsx(ListingToolbar, { filterCount: activeFilterCount, onFiltersClick: openFilters, searchValue: searchInput, searchPlaceholder: "Search users, email, or seller handles", onSearchChange: setSearchInput, onSearchCommit: commitSearch, sortValue: table.get("sort") || DEFAULT_SORT, sortOptions: SORT_OPTIONS, onSortChange: (v) => { table.set("sort", v); table.setPage(1); }, hideViewToggle: true, onResetAll: resetAll, hasActiveState: hasActiveState }), totalPages > 1 && (_jsx("div", { className: "sticky top-[calc(var(--header-height,0px)+44px)] z-10 flex justify-center bg-white/95 dark:bg-slate-900/95 backdrop-blur-sm border-b border-zinc-200 dark:border-slate-700 px-3 py-1.5", children: _jsx(Pagination, { currentPage: currentPage, totalPages: totalPages, onPageChange: (p) => table.setPage(p) }) })), _jsxs("div", { className: "py-4 px-3 sm:px-4", children: [errorMessage && (_jsx("div", { className: "mb-4 rounded-xl border border-red-200 bg-red-50 px-4 py-3 text-sm text-red-700 dark:border-red-900/60 dark:bg-red-950/40 dark:text-red-200", children: errorMessage })), _jsx(DataTable, { rows: rows, isLoading: isLoading, emptyLabel: "No users found", renderRowActions: (row) => (_jsx(RowActionMenu, { actions: [{
+                                            label: "Manage",
+                                            onClick: () => { setSelectedRow(row); setDrawerOpen(true); },
+                                        }] })) })] }), filterOpen && (_jsxs(_Fragment, { children: [_jsx("div", { className: "fixed inset-0 z-40 bg-black/40", "aria-hidden": "true", onClick: () => setFilterOpen(false) }), _jsxs("div", { className: "fixed inset-y-0 left-0 z-50 flex w-80 flex-col bg-white dark:bg-slate-900 shadow-2xl", children: [_jsxs("div", { className: "flex items-center justify-between border-b border-zinc-200 dark:border-slate-700 px-4 py-3.5", children: [_jsx("span", { className: "text-base font-semibold text-zinc-900 dark:text-zinc-100", children: "Filters" }), _jsxs("div", { className: "flex items-center gap-2", children: [activeFilterCount > 0 && (_jsx("button", { type: "button", onClick: clearFilters, className: "text-xs text-zinc-500 hover:text-rose-500 dark:text-zinc-400 transition-colors", children: "Clear all" })), _jsx("button", { type: "button", onClick: () => setFilterOpen(false), "aria-label": "Close", className: "rounded-lg p-1.5 text-zinc-500 hover:bg-zinc-100 dark:hover:bg-slate-800 transition-colors", children: _jsx(X, { className: "h-5 w-5" }) })] })] }), _jsxs("div", { className: "flex-1 overflow-y-auto px-4 py-4 space-y-5", children: [_jsxs("div", { className: "space-y-2", children: [_jsx("p", { className: "text-xs font-semibold uppercase tracking-widest text-zinc-500 dark:text-zinc-400", children: "Status" }), _jsx("div", { className: "flex flex-wrap gap-2", children: STATUS_OPTIONS.map((opt) => (_jsx("button", { type: "button", onClick: () => setPendingFilters((p) => ({ ...p, status: opt === "All" ? "" : opt })), className: `rounded-full px-3 py-1 text-xs font-medium border transition-colors ${(pendingFilters.status || "All") === opt ? "bg-primary text-white border-primary" : "border-zinc-300 dark:border-slate-600 text-zinc-700 dark:text-zinc-300 hover:bg-zinc-50 dark:hover:bg-slate-800"}`, children: opt }, opt))) })] }), _jsxs("div", { className: "space-y-2", children: [_jsx("p", { className: "text-xs font-semibold uppercase tracking-widest text-zinc-500 dark:text-zinc-400", children: "Role" }), _jsx("div", { className: "flex flex-wrap gap-2", children: ROLE_OPTIONS.map((opt) => (_jsx("button", { type: "button", onClick: () => setPendingFilters((p) => ({ ...p, role: opt === "All" ? "" : opt })), className: `rounded-full px-3 py-1 text-xs font-medium border transition-colors ${(pendingFilters.role || "All") === opt ? "bg-primary text-white border-primary" : "border-zinc-300 dark:border-slate-600 text-zinc-700 dark:text-zinc-300 hover:bg-zinc-50 dark:hover:bg-slate-800"}`, children: opt }, opt))) })] })] }), _jsx("div", { className: "border-t border-zinc-200 dark:border-slate-700 px-4 py-3.5", children: _jsxs("button", { type: "button", onClick: applyFilters, className: "w-full rounded-lg bg-primary py-2.5 text-sm font-semibold text-white hover:bg-primary-600 transition-colors active:scale-[0.98]", children: ["Apply Filters", activeFilterCount > 0 ? ` (${activeFilterCount})` : ""] }) })] })] }))] }), _jsx(AdminUserEditorView, { open: drawerOpen, onClose: () => setDrawerOpen(false), userId: selectedRow?.id, displayName: selectedRow?.primary, currentRole: toStringValue(selectedRow?._raw?.role, "user"), currentIsDisabled: selectedRow?.status === "Disabled", currentEmailVerified: Boolean(selectedRow?._raw?.emailVerified) })] }));
 }

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

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

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

@@ -0,0 +1,53 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React, { useState, useCallback } from "react";
+import { useUrlTable } from "../../../react/hooks/useUrlTable";
+import { ListingToolbar, Pagination, ListingViewShell } from "../../../ui";
+import { ADMIN_ENDPOINTS } from "../../../constants/api-endpoints";
+import { toRecordArray, toRelativeDate, toRupees, toStringValue, useAdminListingData, } from "../hooks/useAdminListingData";
+import { DataTable } from "./DataTable";
+const PAGE_SIZE = 25;
+const FILTER_KEYS = [];
+const DEFAULT_SORT = "-addedAt";
+const SORT_OPTIONS = [
+    { value: "-addedAt", label: "Newest" },
+    { value: "addedAt", label: "Oldest" },
+];
+export function AdminWishlistsView({ children, ...props }) {
+    const hasChildren = React.Children.count(children) > 0;
+    const table = useUrlTable({ defaults: { pageSize: String(PAGE_SIZE), sort: DEFAULT_SORT } });
+    const [searchInput, setSearchInput] = useState(table.get("q") || "");
+    const resetAll = useCallback(() => {
+        table.setMany({ q: "", sort: "" });
+        setSearchInput("");
+    }, [table]);
+    const commitSearch = useCallback(() => {
+        table.set("q", searchInput.trim());
+    }, [searchInput, table]);
+    const hasActiveState = !!table.get("q") || table.get("sort") !== DEFAULT_SORT;
+    const { rows, total, isLoading, errorMessage } = useAdminListingData({
+        queryKey: ["admin", "wishlists", "listing"],
+        endpoint: ADMIN_ENDPOINTS.ADMIN_WISHLISTS,
+        page: table.getNumber("page", 1),
+        pageSize: PAGE_SIZE,
+        sorts: table.get("sort") || DEFAULT_SORT,
+        q: table.get("q") || undefined,
+        mapRows: (response) => toRecordArray(response.items).map((item, index) => ({
+            id: toStringValue(item.id, `wish-${index}`),
+            primary: toStringValue(item.productTitle ?? item.productId, "Unknown product"),
+            secondary: [
+                toStringValue(item.userId, ""),
+                toRupees(item.priceAtAdd),
+            ].filter(Boolean).join(" · "),
+            status: "—",
+            updatedAt: toRelativeDate(item.addedAt ?? 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);
+    if (hasChildren) {
+        return _jsx(ListingViewShell, { portal: "admin", ...props, children: children });
+    }
+    return (_jsxs("div", { className: "min-h-screen", children: [_jsx(ListingToolbar, { filterCount: 0, searchValue: searchInput, searchPlaceholder: "Search by product or user ID", onSearchChange: setSearchInput, onSearchCommit: commitSearch, sortValue: table.get("sort") || DEFAULT_SORT, sortOptions: SORT_OPTIONS, onSortChange: (v) => { table.set("sort", v); table.setPage(1); }, hideViewToggle: true, onResetAll: resetAll, hasActiveState: hasActiveState }), totalPages > 1 && (_jsx("div", { className: "sticky top-[calc(var(--header-height,0px)+44px)] z-10 flex justify-center bg-white/95 dark:bg-slate-900/95 backdrop-blur-sm border-b border-zinc-200 dark:border-slate-700 px-3 py-1.5", children: _jsx(Pagination, { currentPage: currentPage, totalPages: totalPages, onPageChange: (p) => table.setPage(p) }) })), _jsxs("div", { className: "py-4 px-3 sm:px-4", children: [errorMessage && (_jsx("div", { className: "mb-4 rounded-xl border border-red-200 bg-red-50 px-4 py-3 text-sm text-red-700 dark:border-red-900/60 dark:bg-red-950/40 dark:text-red-200", children: errorMessage })), _jsx(DataTable, { rows: rows, isLoading: isLoading, emptyLabel: "No wishlist items found" })] })] }));
+}

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

@@ -0,0 +1,5 @@
+export interface BrandQuickCreateFormProps {
+    onSaved: (id: string, name: string) => void;
+    onCancel: () => void;
+}
+export declare function BrandQuickCreateForm({ onSaved, onCancel }: BrandQuickCreateFormProps): import("react/jsx-runtime").JSX.Element;

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

@@ -0,0 +1,36 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React from "react";
+import { useMutation } from "@tanstack/react-query";
+import { Button, Form, Input, Toggle, useToast } from "../../../ui";
+import { apiClient } from "../../../http";
+import { ADMIN_ENDPOINTS } from "../../../constants/api-endpoints";
+function toBrandSlug(str) {
+    const base = str.toLowerCase().trim().replace(/[^a-z0-9]+/g, "-").replace(/^-+|-+$/g, "");
+    return base.startsWith("brand-") ? base : `brand-${base}`;
+}
+export function BrandQuickCreateForm({ onSaved, onCancel }) {
+    const [name, setName] = React.useState("");
+    const [description, setDescription] = React.useState("");
+    const [isActive, setIsActive] = React.useState(true);
+    const { showToast } = useToast();
+    const mutation = useMutation({
+        mutationFn: async () => apiClient.post(ADMIN_ENDPOINTS.BRANDS, {
+            name,
+            slug: toBrandSlug(name),
+            description: description || undefined,
+            isActive,
+        }),
+        onSuccess: (res) => {
+            const id = res?.data?.id ?? res?.id ?? "";
+            onSaved(id, name);
+        },
+        onError: (err) => {
+            showToast(err?.message ?? "Failed to create brand.", "error");
+        },
+    });
+    return (_jsxs(Form, { onSubmit: (e) => {
+            e.preventDefault();
+            mutation.mutate();
+        }, className: "space-y-4", children: [_jsx(Input, { label: "Brand name", value: name, onChange: (e) => setName(e.target.value), required: true, placeholder: "e.g. Hot Wheels", autoFocus: true }), _jsx(Input, { label: "Description", value: description, onChange: (e) => setDescription(e.target.value), placeholder: "Optional brief description" }), _jsx(Toggle, { label: "Active", checked: isActive, onChange: setIsActive }), _jsxs("div", { className: "flex gap-3 pt-2", children: [_jsx(Button, { type: "submit", isLoading: mutation.isPending, disabled: !name || mutation.isPending, children: "Create brand" }), _jsx(Button, { type: "button", variant: "ghost", onClick: onCancel, children: "Cancel" })] })] }));
+}

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

@@ -0,0 +1,5 @@
+export interface CategoryQuickCreateFormProps {
+    onSaved: (id: string, name: string) => void;
+    onCancel: () => void;
+}
+export declare function CategoryQuickCreateForm({ onSaved, onCancel }: CategoryQuickCreateFormProps): import("react/jsx-runtime").JSX.Element;

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

@@ -0,0 +1,35 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React from "react";
+import { useMutation } from "@tanstack/react-query";
+import { Button, Form, Input, Toggle, useToast } from "../../../ui";
+import { apiClient } from "../../../http";
+import { ADMIN_ENDPOINTS } from "../../../constants/api-endpoints";
+function toCategorySlug(str) {
+    return str.toLowerCase().trim().replace(/[^a-z0-9]+/g, "-").replace(/^-+|-+$/g, "");
+}
+export function CategoryQuickCreateForm({ onSaved, onCancel }) {
+    const [name, setName] = React.useState("");
+    const [description, setDescription] = React.useState("");
+    const [isActive, setIsActive] = React.useState(true);
+    const { showToast } = useToast();
+    const mutation = useMutation({
+        mutationFn: async () => apiClient.post(ADMIN_ENDPOINTS.CATEGORIES, {
+            name,
+            slug: toCategorySlug(name),
+            description: description || undefined,
+            isActive,
+        }),
+        onSuccess: (res) => {
+            const id = res?.data?.id ?? res?.id ?? "";
+            onSaved(id, name);
+        },
+        onError: (err) => {
+            showToast(err?.message ?? "Failed to create category.", "error");
+        },
+    });
+    return (_jsxs(Form, { onSubmit: (e) => {
+            e.preventDefault();
+            mutation.mutate();
+        }, className: "space-y-4", children: [_jsx(Input, { label: "Category name", value: name, onChange: (e) => setName(e.target.value), required: true, placeholder: "e.g. Trading Cards", autoFocus: true }), _jsx(Input, { label: "Description", value: description, onChange: (e) => setDescription(e.target.value), placeholder: "Optional brief description" }), _jsx(Toggle, { label: "Active", checked: isActive, onChange: setIsActive }), _jsxs("div", { className: "flex gap-3 pt-2", children: [_jsx(Button, { type: "submit", isLoading: mutation.isPending, disabled: !name || mutation.isPending, children: "Create category" }), _jsx(Button, { type: "button", variant: "ghost", onClick: onCancel, children: "Cancel" })] })] }));
+}