@m5kdev/web-ui 0.7.0 → 0.8.2

package/dist/src/modules/auth/components/AdminUserManagement.js

@@ -1,422 +1,974 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { Button, Dropdown, DropdownItem, DropdownMenu, DropdownTrigger, Input, Modal, ModalBody, ModalContent, ModalFooter, ModalHeader, Select, SelectItem, Spinner, Table, TableBody, TableCell, TableColumn, TableHeader, TableRow, Tooltip, } from "@heroui/react";
-import { authClient } from "@m5kdev/frontend/modules/auth/auth.lib";
-import * as authAdmin from "@m5kdev/frontend/modules/auth/hooks/useAuthAdmin";
-import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
-import { BarChart3, CalendarClock, ChevronDown, ChevronUp, Copy, Filter, Info, Link2, List, MoreHorizontal, Search, UserPlus, X, } from "lucide-react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { BarChart3, CalendarClock, ChevronDown, ChevronUp, Copy, Filter, Info, Link2, List, MoreHorizontal, Search, UserPlus, X } from "lucide-react";
 import { useCallback, useEffect, useId, useState } from "react";
 import { useNavigate } from "react-router";
+import { Button, Dropdown, DropdownItem, DropdownMenu, DropdownTrigger, Input, Modal, ModalBody, ModalContent, ModalFooter, ModalHeader, Select, SelectItem, Spinner, Table, TableBody, TableCell, TableColumn, TableHeader, TableRow, Tooltip } from "@heroui/react";
 import { toast } from "sonner";
-export function AdminUserManagement({ useTRPC }) {
-    const banReasonInputId = useId();
-    const customDurationId = useId();
-    const nameInputId = useId();
-    const emailInputId = useId();
-    const passwordInputId = useId();
-    const roleSelectId = useId();
-    const [page, setPage] = useState(0);
-    const [limit] = useState(10);
-    const [userToDelete, setUserToDelete] = useState(null);
-    const [userToBan, setUserToBan] = useState(null);
-    const [banReason, setBanReason] = useState("");
-    const [banExpiry, setBanExpiry] = useState("never"); // "never", "1d", "7d", "30d", "custom"
-    const [customBanDays, setCustomBanDays] = useState(1);
-    const [isBanningUser, setIsBanningUser] = useState(false);
-    const [isUnbanningUser, setIsUnbanningUser] = useState({});
-    const [isImpersonatingUser, setIsImpersonatingUser] = useState(false);
-    const [searchQuery, setSearchQuery] = useState("");
-    const [statusFilter, setStatusFilter] = useState("all");
-    const [sortField, setSortField] = useState("createdAt");
-    const [sortOrder, setSortOrder] = useState("desc");
-    const [debouncedSearchQuery, setDebouncedSearchQuery] = useState("");
-    const [isCreateUserModalOpen, setIsCreateUserModalOpen] = useState(false);
-    const [newUserData, setNewUserData] = useState({
-        name: "",
-        email: "",
-        password: "",
-        role: "user",
-    });
-    const [isCreatingUser, setIsCreatingUser] = useState(false);
-    const [userForUsage, setUserForUsage] = useState(null);
-    const [userForMagicLink, setUserForMagicLink] = useState(null);
-    const [claimEmail, setClaimEmail] = useState("");
-    const [generatedMagicLink, setGeneratedMagicLink] = useState(null);
-    const [isGeneratingMagicLink, setIsGeneratingMagicLink] = useState(false);
-    const navigate = useNavigate();
-    const magicLinkEmailInputId = useId();
-    const generatedMagicLinkInputId = useId();
-    // AI Usage query
-    const trpc = useTRPC?.();
-    const queryClient = useQueryClient();
-    const usageQueryEnabled = !!userForUsage && !!trpc;
-    const usageQueryOptions = trpc?.ai.getUserUsage.queryOptions({ userId: userForUsage?.id ?? "" });
-    const usageQuery = useQuery({
-        ...(usageQueryOptions ?? {
-            queryKey: [["ai", "getUserUsage"], { input: { userId: "" } }],
-            queryFn: () => Promise.resolve({ inputTokens: null, outputTokens: null, totalTokens: null, cost: null }),
-        }),
-        enabled: usageQueryEnabled,
-    });
-    const usageData = usageQuery.data;
-    const isLoadingUsage = usageQuery.isLoading;
-    const refetchUsage = () => {
-        if (usageQueryOptions) {
-            queryClient.invalidateQueries({ queryKey: usageQueryOptions.queryKey });
-        }
-    };
-    // Reset page on filter change
-    const resetPage = useCallback(() => {
-        setPage(0);
-    }, []);
-    // Debounce search query
-    useEffect(() => {
-        const timer = setTimeout(() => {
-            setDebouncedSearchQuery(searchQuery);
-            resetPage();
-        }, 300);
-        return () => clearTimeout(timer);
-    }, [searchQuery, resetPage]);
-    // Handle status filter change
-    const handleStatusFilterChange = useCallback((value) => {
-        setStatusFilter(value);
-        resetPage();
-    }, [resetPage]);
-    const { data: listUsers = {
-        users: [],
-        total: 0,
-    }, isLoading, refetch, } = authAdmin.useListUsers({
-        query: {
-            searchField: "name",
-            searchOperator: "contains",
-            searchValue: debouncedSearchQuery,
-            limit,
-            offset: page * limit,
-            sortBy: sortField,
-            sortDirection: sortOrder,
-        },
-    });
-    const { users, total: totalUsers } = listUsers;
-    const { mutate: deleteUser, isPending: isDeleting } = authAdmin.useRemoveUser({
-        onSuccess: () => {
-            toast.success("User deleted successfully");
-            refetch();
-        },
-        onError: (error) => {
-            toast.error(`Error deleting user: ${error.message}`);
-        },
-    });
-    const { mutate: updateUser } = authAdmin.useUpdateUser({
-        onSuccess: () => {
-            toast.success("User updated successfully");
-            refetch();
-        },
-        onError: (error) => {
-            toast.error(`Error updating user: ${error.message}`);
-        },
-    });
-    const totalPages = totalUsers ? Math.ceil(totalUsers / limit) : 0;
-    const confirmDelete = (userId) => {
-        setUserToDelete(userId);
-    };
-    const handleDelete = () => {
-        if (userToDelete) {
-            deleteUser({ id: userToDelete });
-            setUserToDelete(null);
-        }
-    };
-    const openBanModal = (userId, userName) => {
-        setUserToBan({ id: userId, name: userName });
-        setBanReason("");
-        setBanExpiry("never");
-        setCustomBanDays(1);
-    };
-    const getBanExpiryInSeconds = () => {
-        switch (banExpiry) {
-            case "never":
-                return undefined; // No expiry
-            case "1d":
-                return 60 * 60 * 24; // 1 day in seconds
-            case "7d":
-                return 60 * 60 * 24 * 7; // 7 days in seconds
-            case "30d":
-                return 60 * 60 * 24 * 30; // 30 days in seconds
-            case "custom":
-                return 60 * 60 * 24 * customBanDays; // Custom days in seconds
-            default:
-                return undefined;
-        }
-    };
-    const formatBanExpiry = (expiryTimestamp) => {
-        if (!expiryTimestamp)
-            return "Never";
-        const expiryDate = new Date(expiryTimestamp);
-        const now = new Date();
-        // If it's expired, return that
-        if (expiryDate < now)
-            return "Expired";
-        // Format the date
-        const dateString = expiryDate.toLocaleDateString(undefined, {
-            year: "numeric",
-            month: "short",
-            day: "numeric",
-        });
-        // Calculate time remaining
-        const timeRemaining = expiryDate.getTime() - now.getTime();
-        const daysRemaining = Math.ceil(timeRemaining / (1000 * 60 * 60 * 24));
-        return `${dateString} (${daysRemaining} days)`;
-    };
-    const handleBanUser = async () => {
-        if (!userToBan)
-            return;
-        try {
-            setIsBanningUser(true);
-            await authClient.admin.banUser({
-                userId: userToBan.id,
-                banReason: banReason || "No reason provided",
-                banExpiresIn: getBanExpiryInSeconds(),
-            });
-            toast.success(`User ${userToBan.name} has been banned`);
-            setUserToBan(null);
-            await refetch();
-        }
-        catch (error) {
-            toast.error(`Failed to ban user: ${error instanceof Error ? error.message : String(error)}`);
-        }
-        finally {
-            setIsBanningUser(false);
-        }
-    };
-    const handleUnbanUser = async (userId) => {
-        try {
-            setIsUnbanningUser((prev) => ({ ...prev, [userId]: true }));
-            await authClient.admin.unbanUser({
-                userId,
-            });
-            toast.success("User has been unbanned");
-            await refetch();
-        }
-        catch (error) {
-            toast.error(`Failed to unban user: ${error instanceof Error ? error.message : String(error)}`);
-        }
-        finally {
-            setIsUnbanningUser((prev) => ({ ...prev, [userId]: false }));
-        }
-    };
-    const handleSetOnboardingUser = async (userId) => {
-        const onboardingStep = window.prompt(`Set onboarding step for user ${userId}`, "4");
-        const onboardingStepNumber = Number.parseInt(onboardingStep || "0");
-        if (onboardingStepNumber) {
-            updateUser({
-                userId,
-                data: { onboarding: onboardingStepNumber },
-            });
-        }
-    };
-    const handleImpersonateUser = async (userId) => {
-        try {
-            setIsImpersonatingUser(true);
-            await authClient.admin.impersonateUser({
-                userId,
-            });
-            toast.success("Now impersonating user");
-            window.location.assign("/"); // Force full reload to apply impersonated session immediately
-        }
-        catch (error) {
-            setIsImpersonatingUser(false);
-            toast.error(`Failed to impersonate user: ${error instanceof Error ? error.message : String(error)}`);
-        }
-    };
-    const handlePageChange = (newPage) => {
-        if (newPage >= 0 && newPage < totalPages) {
-            setPage(newPage);
-        }
-    };
-    const handleSort = (field) => {
-        if (sortField === field) {
-            // Toggle order if same field
-            setSortOrder(sortOrder === "asc" ? "desc" : "asc");
-        }
-        else {
-            // Set new field and default to ascending
-            setSortField(field);
-            setSortOrder("asc");
-        }
-    };
-    const renderSortIcon = (field) => {
-        if (sortField !== field)
-            return null;
-        return sortOrder === "asc" ? (_jsx(ChevronUp, { className: "h-4 w-4 inline ml-1" })) : (_jsx(ChevronDown, { className: "h-4 w-4 inline ml-1" }));
-    };
-    const clearFilters = () => {
-        setSearchQuery("");
-        setStatusFilter("all");
-        setSortField("createdAt");
-        setSortOrder("desc");
-    };
-    const openCreateUserModal = () => {
-        setNewUserData({
-            name: "",
-            email: "",
-            password: "",
-            role: "user",
-        });
-        setIsCreateUserModalOpen(true);
-    };
-    const handleCreateUser = async () => {
-        if (!newUserData.name || !newUserData.email || !newUserData.password) {
-            toast.error("Please fill in all required fields");
-            return;
-        }
-        try {
-            setIsCreatingUser(true);
-            await authClient.admin.createUser({
-                name: newUserData.name,
-                email: newUserData.email,
-                password: newUserData.password,
-                role: newUserData.role,
-            });
-            toast.success(`User ${newUserData.name} has been created`);
-            setIsCreateUserModalOpen(false);
-            await refetch();
-        }
-        catch (error) {
-            toast.error(`Failed to create user: ${error instanceof Error ? error.message : String(error)}`);
-        }
-        finally {
-            setIsCreatingUser(false);
-        }
-    };
-    const handleNewUserDataChange = (field, value) => {
-        setNewUserData((prev) => ({
-            ...prev,
-            [field]: value,
-        }));
-    };
-    const openUsageModal = (userId, userName) => {
-        setUserForUsage({ id: userId, name: userName });
-        refetchUsage();
-    };
-    const formatTokenCount = (count) => {
-        if (count === null || count === undefined)
-            return "—";
-        return count.toLocaleString();
-    };
-    const formatCost = (cost) => {
-        if (cost === null || cost === undefined)
-            return "—";
-        return `$${cost.toFixed(4)}`;
-    };
-    const createAccountClaimCodeMutation = useMutation(trpc
-        ? trpc.auth.createAccountClaimCode.mutationOptions()
-        : {
-            mutationFn: async () => {
-                throw new Error("Account claim actions are not available in this app");
-            },
-        });
-    const generateAccountClaimMagicLinkMutation = useMutation(trpc
-        ? trpc.auth.generateAccountClaimMagicLink.mutationOptions()
-        : {
-            mutationFn: async () => {
-                throw new Error("Account claim actions are not available in this app");
-            },
-        });
-    const openMagicLinkModal = (userId, userName, userEmail) => {
-        setUserForMagicLink({ id: userId, name: userName, email: userEmail });
-        setClaimEmail(userEmail ?? "");
-        setGeneratedMagicLink(null);
-    };
-    const handleGenerateMagicLink = async () => {
-        if (!trpc) {
-            toast.error("Account claim actions are not available in this app");
-            return;
-        }
-        if (!userForMagicLink)
-            return;
-        const normalizedEmail = claimEmail.trim().toLowerCase();
-        if (!normalizedEmail) {
-            toast.error("Email is required");
-            return;
-        }
-        const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
-        if (!emailRegex.test(normalizedEmail)) {
-            toast.error("Please enter a valid email address");
-            return;
-        }
-        try {
-            setIsGeneratingMagicLink(true);
-            const claim = await createAccountClaimCodeMutation.mutateAsync({
-                userId: userForMagicLink.id,
-            });
-            const link = await generateAccountClaimMagicLinkMutation.mutateAsync({
-                claimId: claim.id,
-                email: normalizedEmail,
-            });
-            setGeneratedMagicLink(link.url);
-            toast.success("Magic login link generated");
-        }
-        catch (error) {
-            toast.error(`Failed to generate magic link: ${error instanceof Error ? error.message : String(error)}`);
-        }
-        finally {
-            setIsGeneratingMagicLink(false);
-        }
-    };
-    const copyGeneratedMagicLink = async () => {
-        if (!generatedMagicLink)
-            return;
-        try {
-            await navigator.clipboard.writeText(generatedMagicLink);
-            toast.success("Magic link copied");
-        }
-        catch {
-            toast.error("Failed to copy link");
-        }
-    };
-    if (isLoading) {
-        return (_jsx("div", { className: "flex justify-center p-8", children: _jsx(Spinner, {}) }));
-    }
-    const openWaitlistModal = () => {
-        navigate("/admin/waitlist");
-    };
-    const hasActiveFilters = debouncedSearchQuery ||
-        statusFilter !== "all" ||
-        sortField !== "createdAt" ||
-        sortOrder !== "desc";
-    return (_jsxs("div", { className: "space-y-4 p-4", children: [_jsxs("div", { className: "flex justify-between items-center", children: [_jsx("h2", { className: "text-xl font-semibold", children: "User Management" }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsxs(Button, { onPress: openWaitlistModal, size: "sm", children: [_jsx(List, { className: "h-4 w-4 mr-2" }), "Waitlist"] }), _jsxs(Button, { onPress: openCreateUserModal, size: "sm", children: [_jsx(UserPlus, { className: "h-4 w-4 mr-2" }), "Create User"] }), _jsxs("div", { className: "text-sm text-muted-foreground", children: ["Total users: ", totalUsers || 0] })] })] }), _jsxs("div", { className: "flex flex-col sm:flex-row gap-3 items-start sm:items-center", children: [_jsxs("form", { className: "relative flex-1", onSubmit: (e) => {
-                            e.preventDefault();
-                            setDebouncedSearchQuery(searchQuery);
-                            resetPage();
-                        }, children: [_jsx(Search, { className: "absolute left-2.5 top-2.5 h-4 w-4 text-muted-foreground" }), _jsx(Input, { "aria-label": "Search users", placeholder: "Search users by name or email...", className: "pl-8 w-full", value: searchQuery, onChange: (e) => setSearchQuery(e.target.value), variant: "bordered" }), searchQuery && (_jsx("button", { type: "button", onClick: () => setSearchQuery(""), className: "absolute right-2.5 top-2.5 text-muted-foreground hover:text-foreground", "aria-label": "Clear search", children: _jsx(X, { className: "h-4 w-4" }) }))] }), _jsxs("div", { className: "flex gap-2", children: [_jsxs(Select, { "aria-label": "Status filter", selectedKeys: new Set([statusFilter]), onSelectionChange: (keys) => handleStatusFilterChange(Array.from(keys)[0]), className: "w-[160px]", startContent: _jsx(Filter, { className: "mr-1 h-4 w-4" }), children: [_jsx(SelectItem, { children: "All Users" }, "all"), _jsx(SelectItem, { children: "Active Only" }, "active"), _jsx(SelectItem, { children: "Banned Only" }, "banned")] }), hasActiveFilters && (_jsxs(Button, { variant: "bordered", size: "sm", onPress: clearFilters, children: [_jsx(X, { className: "mr-1 h-4 w-4" }), "Clear Filters"] }))] })] }), _jsx("div", { className: "border rounded-lg overflow-hidden", children: _jsxs(Table, { "aria-label": "Users table", removeWrapper: true, children: [_jsxs(TableHeader, { children: [_jsx(TableColumn, { children: "ID" }), _jsxs(TableColumn, { className: "cursor-pointer", onClick: () => handleSort("name"), children: ["Name ", renderSortIcon("name")] }), _jsxs(TableColumn, { className: "cursor-pointer", onClick: () => handleSort("email"), children: ["Email ", renderSortIcon("email")] }), _jsxs(TableColumn, { className: "cursor-pointer", onClick: () => handleSort("role"), children: ["Role ", renderSortIcon("role")] }), _jsx(TableColumn, { children: "Status" }), _jsx(TableColumn, { children: "Onboarding" }), _jsxs(TableColumn, { className: "cursor-pointer", onClick: () => handleSort("createdAt"), children: ["Created At ", renderSortIcon("createdAt")] }), _jsx(TableColumn, { className: "text-right", children: "Actions" })] }), _jsx(TableBody, { items: users ?? [], emptyContent: hasActiveFilters ? "No users found matching your filters" : "No users found", children: (user) => {
-                                const onboarding = user.onboarding;
-                                return (_jsxs(TableRow, { children: [_jsx(TableCell, { className: "font-mono text-xs", children: user.id }), _jsx(TableCell, { children: user.name }), _jsx(TableCell, { children: user.email }), _jsx(TableCell, { children: user.role || "user" }), _jsx(TableCell, { children: user.banned ? (_jsx(Tooltip, { content: _jsxs("div", { className: "space-y-1 text-xs", children: [_jsxs("p", { children: [_jsx("strong", { children: "Reason:" }), " ", user.banReason || "No reason provided"] }), user.banExpires && (_jsxs("p", { className: "flex items-center gap-1", children: [_jsx(CalendarClock, { className: "h-3 w-3" }), _jsxs("span", { children: [_jsx("strong", { children: "Expires:" }), " ", formatBanExpiry(user.banExpires.getTime())] })] }))] }), children: _jsxs("span", { className: "inline-flex items-center gap-1 px-2.5 py-0.5 rounded-full text-xs font-medium bg-red-100 text-red-800", children: ["Banned", user.banReason && _jsx(Info, { className: "h-3 w-3" })] }) })) : (_jsx("span", { className: "inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-green-100 text-green-800", children: "Active" })) }), _jsx(TableCell, { children: onboarding ?? "—" }), _jsx(TableCell, { children: user.createdAt ? new Date(user.createdAt).toLocaleDateString() : "N/A" }), _jsx(TableCell, { className: "text-right", children: _jsxs(Dropdown, { placement: "bottom-end", children: [_jsx(DropdownTrigger, { children: _jsx(Button, { variant: "light", size: "sm", isIconOnly: true, children: _jsx(MoreHorizontal, { className: "h-4 w-4" }) }) }), _jsxs(DropdownMenu, { "aria-label": "User actions", children: [_jsx(DropdownItem, { onClick: () => handleSetOnboardingUser(user.id), children: "Set Onboarding" }, "onboarding"), _jsx(DropdownItem, { onClick: () => openUsageModal(user.id, user.name), className: useTRPC ? "" : "hidden", children: _jsxs("span", { className: "flex items-center gap-2", children: [_jsx(BarChart3, { className: "h-4 w-4" }), "View AI Usage"] }) }, "usage"), _jsx(DropdownItem, { onClick: () => handleImpersonateUser(user.id), isDisabled: user.banned || isImpersonatingUser, children: isImpersonatingUser ? (_jsxs(_Fragment, { children: [_jsx(Spinner, { className: "mr-2 h-3 w-3" }), "Impersonating..."] })) : ("Impersonate") }, "impersonate"), _jsx(DropdownItem, { onClick: () => openMagicLinkModal(user.id, user.name, user.email ?? null), className: trpc ? "" : "hidden", children: _jsxs("span", { className: "flex items-center gap-2", children: [_jsx(Link2, { className: "h-4 w-4" }), "Generate Magic Login Link"] }) }, "magic-link"), user.banned ? (_jsx(DropdownItem, { onClick: () => handleUnbanUser(user.id), isDisabled: isUnbanningUser[user.id], children: isUnbanningUser[user.id] ? (_jsxs(_Fragment, { children: [_jsx(Spinner, { className: "mr-2 h-3 w-3" }), "Unbanning..."] })) : ("Unban") }, "unban")) : (_jsx(DropdownItem, { onClick: () => openBanModal(user.id, user.name), children: "Ban" }, "ban")), _jsx(DropdownItem, { onClick: () => confirmDelete(user.id), children: "Remove" }, "remove")] })] }) })] }, user.id));
-                            } })] }) }), totalPages > 0 && (_jsxs("div", { className: "flex items-center justify-end space-x-2 py-4", children: [_jsx(Button, { variant: "bordered", size: "sm", onClick: () => handlePageChange(page - 1), isDisabled: page === 0, children: "Previous" }), _jsxs("div", { className: "text-sm text-muted-foreground", children: ["Page ", page + 1, " of ", totalPages] }), _jsx(Button, { variant: "bordered", size: "sm", onClick: () => handlePageChange(page + 1), isDisabled: page === totalPages - 1, children: "Next" })] })), _jsx(Modal, { isOpen: !!userToDelete, onOpenChange: (open) => {
-                    if (!open)
-                        setUserToDelete(null);
-                }, children: _jsx(ModalContent, { children: (onClose) => (_jsxs(_Fragment, { children: [_jsxs(ModalHeader, { className: "flex flex-col gap-1", children: [_jsx("p", { className: "text-lg font-semibold", children: "Are you sure?" }), _jsx("p", { className: "text-sm text-default-600", children: "This action cannot be undone. This will permanently delete the user and all their data." })] }), _jsxs(ModalFooter, { children: [_jsx(Button, { variant: "bordered", onPress: onClose, children: "Cancel" }), _jsx(Button, { color: "danger", onPress: handleDelete, isLoading: isDeleting, children: "Delete" })] })] })) }) }), _jsx(Modal, { isOpen: !!userToBan, onOpenChange: (open) => {
-                    if (!open)
-                        setUserToBan(null);
-                }, children: _jsx(ModalContent, { children: (onClose) => (_jsxs("form", { onSubmit: (e) => {
-                            e.preventDefault();
-                            handleBanUser();
-                        }, className: "space-y-4", children: [_jsxs(ModalHeader, { className: "flex flex-col gap-1", children: [_jsx("p", { className: "text-lg font-semibold", children: "Ban User" }), _jsx("p", { className: "text-sm text-default-600", children: userToBan &&
-                                            `You are about to ban ${userToBan.name}. This will prevent them from signing in.` })] }), _jsxs(ModalBody, { className: "space-y-4", children: [_jsxs("div", { className: "space-y-2", children: [_jsx("label", { htmlFor: banReasonInputId, className: "text-sm font-medium", children: "Ban Reason" }), _jsx(Input, { id: banReasonInputId, placeholder: "Enter reason for ban", value: banReason, onChange: (e) => setBanReason(e.target.value), variant: "bordered", labelPlacement: "outside", label: "Ban Reason" })] }), _jsxs("div", { className: "space-y-2", children: [_jsx("p", { className: "text-sm font-medium", children: "Ban Duration" }), _jsxs("div", { className: "grid grid-cols-2 gap-2", children: [_jsx(Button, { type: "button", variant: banExpiry === "never" ? "solid" : "bordered", onClick: () => setBanExpiry("never"), children: "Permanent" }), _jsx(Button, { type: "button", variant: banExpiry === "1d" ? "solid" : "bordered", onClick: () => setBanExpiry("1d"), children: "1 Day" }), _jsx(Button, { type: "button", variant: banExpiry === "7d" ? "solid" : "bordered", onClick: () => setBanExpiry("7d"), children: "7 Days" }), _jsx(Button, { type: "button", variant: banExpiry === "30d" ? "solid" : "bordered", onClick: () => setBanExpiry("30d"), children: "30 Days" })] })] }), _jsxs("div", { className: "space-y-2", children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx("input", { type: "checkbox", id: customDurationId, checked: banExpiry === "custom", onChange: (e) => e.target.checked ? setBanExpiry("custom") : setBanExpiry("never") }), _jsx("label", { htmlFor: customDurationId, className: "text-sm font-medium", children: "Custom Duration" })] }), banExpiry === "custom" && (_jsxs("div", { className: "flex items-center gap-2", children: [_jsx(Input, { type: "number", min: "1", value: customBanDays.toString(), onChange: (e) => setCustomBanDays(Number(e.target.value)), variant: "bordered", labelPlacement: "outside", label: "Custom duration (days)" }), _jsx("span", { className: "text-sm", children: "Days" })] }))] })] }), _jsxs(ModalFooter, { children: [_jsx(Button, { variant: "bordered", type: "button", onPress: onClose, children: "Cancel" }), _jsxs(Button, { color: "danger", type: "submit", isDisabled: isBanningUser, children: [isBanningUser ? _jsx(Spinner, { className: "mr-2 h-4 w-4" }) : null, isBanningUser ? "Banning..." : "Ban User"] })] })] })) }) }), _jsx(Modal, { isOpen: isCreateUserModalOpen, onOpenChange: (open) => {
-                    if (!open)
-                        setIsCreateUserModalOpen(false);
-                }, children: _jsx(ModalContent, { children: (onClose) => (_jsxs("form", { onSubmit: (e) => {
-                            e.preventDefault();
-                            handleCreateUser();
-                        }, className: "space-y-4", children: [_jsxs(ModalHeader, { className: "flex flex-col gap-1", children: [_jsx("p", { className: "text-lg font-semibold", children: "Create New User" }), _jsx("p", { className: "text-sm text-default-600", children: "Fill in the details below to create a new user account." })] }), _jsxs(ModalBody, { className: "space-y-4", children: [_jsx("div", { className: "space-y-2", children: _jsx(Input, { id: nameInputId, label: "Name *", labelPlacement: "outside", placeholder: "Enter user's name", value: newUserData.name, onChange: (e) => handleNewUserDataChange("name", e.target.value), variant: "bordered" }) }), _jsx("div", { className: "space-y-2", children: _jsx(Input, { id: emailInputId, label: "Email *", labelPlacement: "outside", type: "email", placeholder: "Enter user's email", value: newUserData.email, onChange: (e) => handleNewUserDataChange("email", e.target.value), variant: "bordered" }) }), _jsx("div", { className: "space-y-2", children: _jsx(Input, { id: passwordInputId, label: "Password *", labelPlacement: "outside", type: "password", placeholder: "Enter password", value: newUserData.password, onChange: (e) => handleNewUserDataChange("password", e.target.value), variant: "bordered" }) }), _jsxs("div", { className: "space-y-2", children: [_jsx("p", { className: "text-sm font-medium", id: roleSelectId, children: "Role" }), _jsxs(Select, { "aria-label": "Select role", "aria-labelledby": roleSelectId, selectedKeys: new Set([newUserData.role]), onSelectionChange: (keys) => handleNewUserDataChange("role", Array.from(keys)[0]), children: [_jsx(SelectItem, { children: "User" }, "user"), _jsx(SelectItem, { children: "Admin" }, "admin")] })] })] }), _jsxs(ModalFooter, { children: [_jsx(Button, { variant: "bordered", type: "button", onPress: onClose, children: "Cancel" }), _jsxs(Button, { type: "submit", color: "primary", isDisabled: isCreatingUser, children: [isCreatingUser ? _jsx(Spinner, { className: "mr-2 h-4 w-4" }) : null, isCreatingUser ? "Creating..." : "Create User"] })] })] })) }) }), _jsx(Modal, { isOpen: !!userForUsage, onOpenChange: (open) => {
-                    if (!open)
-                        setUserForUsage(null);
-                }, children: _jsx(ModalContent, { children: (onClose) => (_jsxs(_Fragment, { children: [_jsxs(ModalHeader, { className: "flex flex-col gap-1", children: [_jsxs("p", { className: "text-lg font-semibold flex items-center gap-2", children: [_jsx(BarChart3, { className: "h-5 w-5" }), "AI Usage"] }), _jsx("p", { className: "text-sm text-default-600", children: userForUsage && `Usage statistics for ${userForUsage.name}` })] }), _jsx(ModalBody, { children: isLoadingUsage ? (_jsx("div", { className: "flex justify-center py-8", children: _jsx(Spinner, {}) })) : usageData ? (_jsx("div", { className: "space-y-4", children: _jsxs("div", { className: "grid grid-cols-2 gap-4", children: [_jsxs("div", { className: "p-4 rounded-lg bg-default-100", children: [_jsx("p", { className: "text-sm text-default-600", children: "Input Tokens" }), _jsx("p", { className: "text-2xl font-semibold", children: formatTokenCount(usageData.inputTokens) })] }), _jsxs("div", { className: "p-4 rounded-lg bg-default-100", children: [_jsx("p", { className: "text-sm text-default-600", children: "Output Tokens" }), _jsx("p", { className: "text-2xl font-semibold", children: formatTokenCount(usageData.outputTokens) })] }), _jsxs("div", { className: "p-4 rounded-lg bg-default-100", children: [_jsx("p", { className: "text-sm text-default-600", children: "Total Tokens" }), _jsx("p", { className: "text-2xl font-semibold", children: formatTokenCount(usageData.totalTokens) })] }), _jsxs("div", { className: "p-4 rounded-lg bg-primary-100", children: [_jsx("p", { className: "text-sm text-primary-600", children: "Estimated Cost" }), _jsx("p", { className: "text-2xl font-semibold text-primary", children: formatCost(usageData.cost) })] })] }) })) : (_jsx("div", { className: "text-center py-8 text-default-600", children: "No usage data available" })) }), _jsx(ModalFooter, { children: _jsx(Button, { variant: "bordered", onPress: onClose, children: "Close" }) })] })) }) }), _jsx(Modal, { isOpen: !!userForMagicLink, onOpenChange: (open) => {
-                    if (!open) {
-                        setUserForMagicLink(null);
-                        setGeneratedMagicLink(null);
-                        setClaimEmail("");
-                    }
-                }, children: _jsx(ModalContent, { children: (onClose) => (_jsxs("form", { onSubmit: (e) => {
-                            e.preventDefault();
-                            handleGenerateMagicLink();
-                        }, className: "space-y-4", children: [_jsxs(ModalHeader, { className: "flex flex-col gap-1", children: [_jsx("p", { className: "text-lg font-semibold", children: "Generate Magic Login Link" }), _jsx("p", { className: "text-sm text-default-600", children: userForMagicLink &&
-                                            `Generate a one-time claim sign-in link for ${userForMagicLink.name}.` })] }), _jsxs(ModalBody, { className: "space-y-4", children: [_jsx(Input, { id: magicLinkEmailInputId, label: "Claim email", labelPlacement: "outside", type: "email", placeholder: "person@example.com", value: claimEmail, onChange: (e) => setClaimEmail(e.target.value), variant: "bordered", description: "This email is used for provider linking and future sign-ins." }), _jsx(Input, { id: generatedMagicLinkInputId, label: "Generated link", labelPlacement: "outside", value: generatedMagicLink ?? "", readOnly: true, variant: "bordered", placeholder: "Generate link to see it here" })] }), _jsxs(ModalFooter, { children: [_jsx(Button, { variant: "bordered", type: "button", onPress: onClose, children: "Close" }), _jsxs(Button, { variant: "bordered", type: "button", onPress: copyGeneratedMagicLink, isDisabled: !generatedMagicLink, children: [_jsx(Copy, { className: "h-4 w-4 mr-2" }), "Copy Link"] }), _jsxs(Button, { color: "primary", type: "submit", isDisabled: isGeneratingMagicLink, children: [isGeneratingMagicLink ? _jsx(Spinner, { className: "mr-2 h-4 w-4" }) : null, isGeneratingMagicLink ? "Generating..." : "Generate Link"] })] })] })) }) })] }));
+import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
+import { authClient } from "@m5kdev/frontend/modules/auth/auth.lib";
+import * as authAdmin from "@m5kdev/frontend/modules/auth/hooks/useAuthAdmin";
+//#region src/modules/auth/components/AdminUserManagement.tsx
+function AdminUserManagement({ useTRPC }) {
+	const banReasonInputId = useId();
+	const customDurationId = useId();
+	const nameInputId = useId();
+	const emailInputId = useId();
+	const passwordInputId = useId();
+	const roleSelectId = useId();
+	const [page, setPage] = useState(0);
+	const [limit] = useState(10);
+	const [userToDelete, setUserToDelete] = useState(null);
+	const [userToBan, setUserToBan] = useState(null);
+	const [banReason, setBanReason] = useState("");
+	const [banExpiry, setBanExpiry] = useState("never");
+	const [customBanDays, setCustomBanDays] = useState(1);
+	const [isBanningUser, setIsBanningUser] = useState(false);
+	const [isUnbanningUser, setIsUnbanningUser] = useState({});
+	const [isImpersonatingUser, setIsImpersonatingUser] = useState(false);
+	const [searchQuery, setSearchQuery] = useState("");
+	const [statusFilter, setStatusFilter] = useState("all");
+	const [sortField, setSortField] = useState("createdAt");
+	const [sortOrder, setSortOrder] = useState("desc");
+	const [debouncedSearchQuery, setDebouncedSearchQuery] = useState("");
+	const [isCreateUserModalOpen, setIsCreateUserModalOpen] = useState(false);
+	const [newUserData, setNewUserData] = useState({
+		name: "",
+		email: "",
+		password: "",
+		role: "user"
+	});
+	const [isCreatingUser, setIsCreatingUser] = useState(false);
+	const [userForUsage, setUserForUsage] = useState(null);
+	const [userForMagicLink, setUserForMagicLink] = useState(null);
+	const [claimEmail, setClaimEmail] = useState("");
+	const [generatedMagicLink, setGeneratedMagicLink] = useState(null);
+	const [isGeneratingMagicLink, setIsGeneratingMagicLink] = useState(false);
+	const navigate = useNavigate();
+	const magicLinkEmailInputId = useId();
+	const generatedMagicLinkInputId = useId();
+	const trpc = useTRPC?.();
+	const queryClient = useQueryClient();
+	const usageQueryEnabled = !!userForUsage && !!trpc;
+	const usageQueryOptions = trpc?.ai.getUserUsage.queryOptions({ userId: userForUsage?.id ?? "" });
+	const usageQuery = useQuery({
+		...usageQueryOptions ?? {
+			queryKey: [["ai", "getUserUsage"], { input: { userId: "" } }],
+			queryFn: () => Promise.resolve({
+				inputTokens: null,
+				outputTokens: null,
+				totalTokens: null,
+				cost: null
+			})
+		},
+		enabled: usageQueryEnabled
+	});
+	const usageData = usageQuery.data;
+	const isLoadingUsage = usageQuery.isLoading;
+	const refetchUsage = () => {
+		if (usageQueryOptions) queryClient.invalidateQueries({ queryKey: usageQueryOptions.queryKey });
+	};
+	const resetPage = useCallback(() => {
+		setPage(0);
+	}, []);
+	useEffect(() => {
+		const timer = setTimeout(() => {
+			setDebouncedSearchQuery(searchQuery);
+			resetPage();
+		}, 300);
+		return () => clearTimeout(timer);
+	}, [searchQuery, resetPage]);
+	const handleStatusFilterChange = useCallback((value) => {
+		setStatusFilter(value);
+		resetPage();
+	}, [resetPage]);
+	const { data: listUsers = {
+		users: [],
+		total: 0
+	}, isLoading, refetch } = authAdmin.useListUsers({ query: {
+		searchField: "name",
+		searchOperator: "contains",
+		searchValue: debouncedSearchQuery,
+		limit,
+		offset: page * limit,
+		sortBy: sortField,
+		sortDirection: sortOrder
+	} });
+	const { users, total: totalUsers } = listUsers;
+	const { mutate: deleteUser, isPending: isDeleting } = authAdmin.useRemoveUser({
+		onSuccess: () => {
+			toast.success("User deleted successfully");
+			refetch();
+		},
+		onError: (error) => {
+			toast.error(`Error deleting user: ${error.message}`);
+		}
+	});
+	const { mutate: updateUser } = authAdmin.useUpdateUser({
+		onSuccess: () => {
+			toast.success("User updated successfully");
+			refetch();
+		},
+		onError: (error) => {
+			toast.error(`Error updating user: ${error.message}`);
+		}
+	});
+	const totalPages = totalUsers ? Math.ceil(totalUsers / limit) : 0;
+	const confirmDelete = (userId) => {
+		setUserToDelete(userId);
+	};
+	const handleDelete = () => {
+		if (userToDelete) {
+			deleteUser({ id: userToDelete });
+			setUserToDelete(null);
+		}
+	};
+	const openBanModal = (userId, userName) => {
+		setUserToBan({
+			id: userId,
+			name: userName
+		});
+		setBanReason("");
+		setBanExpiry("never");
+		setCustomBanDays(1);
+	};
+	const getBanExpiryInSeconds = () => {
+		switch (banExpiry) {
+			case "never": return;
+			case "1d": return 3600 * 24;
+			case "7d": return 3600 * 24 * 7;
+			case "30d": return 3600 * 24 * 30;
+			case "custom": return 3600 * 24 * customBanDays;
+			default: return;
+		}
+	};
+	const formatBanExpiry = (expiryTimestamp) => {
+		if (!expiryTimestamp) return "Never";
+		const expiryDate = new Date(expiryTimestamp);
+		const now = /* @__PURE__ */ new Date();
+		if (expiryDate < now) return "Expired";
+		const dateString = expiryDate.toLocaleDateString(void 0, {
+			year: "numeric",
+			month: "short",
+			day: "numeric"
+		});
+		const timeRemaining = expiryDate.getTime() - now.getTime();
+		return `${dateString} (${Math.ceil(timeRemaining / (1e3 * 60 * 60 * 24))} days)`;
+	};
+	const handleBanUser = async () => {
+		if (!userToBan) return;
+		try {
+			setIsBanningUser(true);
+			await authClient.admin.banUser({
+				userId: userToBan.id,
+				banReason: banReason || "No reason provided",
+				banExpiresIn: getBanExpiryInSeconds()
+			});
+			toast.success(`User ${userToBan.name} has been banned`);
+			setUserToBan(null);
+			await refetch();
+		} catch (error) {
+			toast.error(`Failed to ban user: ${error instanceof Error ? error.message : String(error)}`);
+		} finally {
+			setIsBanningUser(false);
+		}
+	};
+	const handleUnbanUser = async (userId) => {
+		try {
+			setIsUnbanningUser((prev) => ({
+				...prev,
+				[userId]: true
+			}));
+			await authClient.admin.unbanUser({ userId });
+			toast.success("User has been unbanned");
+			await refetch();
+		} catch (error) {
+			toast.error(`Failed to unban user: ${error instanceof Error ? error.message : String(error)}`);
+		} finally {
+			setIsUnbanningUser((prev) => ({
+				...prev,
+				[userId]: false
+			}));
+		}
+	};
+	const handleSetOnboardingUser = async (userId) => {
+		const onboardingStep = window.prompt(`Set onboarding step for user ${userId}`, "4");
+		const onboardingStepNumber = Number.parseInt(onboardingStep || "0");
+		if (onboardingStepNumber) updateUser({
+			userId,
+			data: { onboarding: onboardingStepNumber }
+		});
+	};
+	const handleImpersonateUser = async (userId) => {
+		try {
+			setIsImpersonatingUser(true);
+			await authClient.admin.impersonateUser({ userId });
+			toast.success("Now impersonating user");
+			window.location.assign("/");
+		} catch (error) {
+			setIsImpersonatingUser(false);
+			toast.error(`Failed to impersonate user: ${error instanceof Error ? error.message : String(error)}`);
+		}
+	};
+	const handlePageChange = (newPage) => {
+		if (newPage >= 0 && newPage < totalPages) setPage(newPage);
+	};
+	const handleSort = (field) => {
+		if (sortField === field) setSortOrder(sortOrder === "asc" ? "desc" : "asc");
+		else {
+			setSortField(field);
+			setSortOrder("asc");
+		}
+	};
+	const renderSortIcon = (field) => {
+		if (sortField !== field) return null;
+		return sortOrder === "asc" ? /* @__PURE__ */ jsx(ChevronUp, { className: "h-4 w-4 inline ml-1" }) : /* @__PURE__ */ jsx(ChevronDown, { className: "h-4 w-4 inline ml-1" });
+	};
+	const clearFilters = () => {
+		setSearchQuery("");
+		setStatusFilter("all");
+		setSortField("createdAt");
+		setSortOrder("desc");
+	};
+	const openCreateUserModal = () => {
+		setNewUserData({
+			name: "",
+			email: "",
+			password: "",
+			role: "user"
+		});
+		setIsCreateUserModalOpen(true);
+	};
+	const handleCreateUser = async () => {
+		if (!newUserData.name || !newUserData.email || !newUserData.password) {
+			toast.error("Please fill in all required fields");
+			return;
+		}
+		try {
+			setIsCreatingUser(true);
+			await authClient.admin.createUser({
+				name: newUserData.name,
+				email: newUserData.email,
+				password: newUserData.password,
+				role: newUserData.role
+			});
+			toast.success(`User ${newUserData.name} has been created`);
+			setIsCreateUserModalOpen(false);
+			await refetch();
+		} catch (error) {
+			toast.error(`Failed to create user: ${error instanceof Error ? error.message : String(error)}`);
+		} finally {
+			setIsCreatingUser(false);
+		}
+	};
+	const handleNewUserDataChange = (field, value) => {
+		setNewUserData((prev) => ({
+			...prev,
+			[field]: value
+		}));
+	};
+	const openUsageModal = (userId, userName) => {
+		setUserForUsage({
+			id: userId,
+			name: userName
+		});
+		refetchUsage();
+	};
+	const formatTokenCount = (count) => {
+		if (count === null || count === void 0) return "—";
+		return count.toLocaleString();
+	};
+	const formatCost = (cost) => {
+		if (cost === null || cost === void 0) return "—";
+		return `$${cost.toFixed(4)}`;
+	};
+	const createAccountClaimCodeMutation = useMutation(trpc ? trpc.auth.createAccountClaimCode.mutationOptions() : { mutationFn: async () => {
+		throw new Error("Account claim actions are not available in this app");
+	} });
+	const generateAccountClaimMagicLinkMutation = useMutation(trpc ? trpc.auth.generateAccountClaimMagicLink.mutationOptions() : { mutationFn: async () => {
+		throw new Error("Account claim actions are not available in this app");
+	} });
+	const openMagicLinkModal = (userId, userName, userEmail) => {
+		setUserForMagicLink({
+			id: userId,
+			name: userName,
+			email: userEmail
+		});
+		setClaimEmail(userEmail ?? "");
+		setGeneratedMagicLink(null);
+	};
+	const handleGenerateMagicLink = async () => {
+		if (!trpc) {
+			toast.error("Account claim actions are not available in this app");
+			return;
+		}
+		if (!userForMagicLink) return;
+		const normalizedEmail = claimEmail.trim().toLowerCase();
+		if (!normalizedEmail) {
+			toast.error("Email is required");
+			return;
+		}
+		if (!/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(normalizedEmail)) {
+			toast.error("Please enter a valid email address");
+			return;
+		}
+		try {
+			setIsGeneratingMagicLink(true);
+			const claim = await createAccountClaimCodeMutation.mutateAsync({ userId: userForMagicLink.id });
+			setGeneratedMagicLink((await generateAccountClaimMagicLinkMutation.mutateAsync({
+				claimId: claim.id,
+				email: normalizedEmail
+			})).url);
+			toast.success("Magic login link generated");
+		} catch (error) {
+			toast.error(`Failed to generate magic link: ${error instanceof Error ? error.message : String(error)}`);
+		} finally {
+			setIsGeneratingMagicLink(false);
+		}
+	};
+	const copyGeneratedMagicLink = async () => {
+		if (!generatedMagicLink) return;
+		try {
+			await navigator.clipboard.writeText(generatedMagicLink);
+			toast.success("Magic link copied");
+		} catch {
+			toast.error("Failed to copy link");
+		}
+	};
+	if (isLoading) return /* @__PURE__ */ jsx("div", {
+		className: "flex justify-center p-8",
+		children: /* @__PURE__ */ jsx(Spinner, {})
+	});
+	const openWaitlistModal = () => {
+		navigate("/admin/waitlist");
+	};
+	const hasActiveFilters = debouncedSearchQuery || statusFilter !== "all" || sortField !== "createdAt" || sortOrder !== "desc";
+	return /* @__PURE__ */ jsxs("div", {
+		className: "space-y-4 p-4",
+		children: [
+			/* @__PURE__ */ jsxs("div", {
+				className: "flex justify-between items-center",
+				children: [/* @__PURE__ */ jsx("h2", {
+					className: "text-xl font-semibold",
+					children: "User Management"
+				}), /* @__PURE__ */ jsxs("div", {
+					className: "flex items-center gap-2",
+					children: [
+						/* @__PURE__ */ jsxs(Button, {
+							onPress: openWaitlistModal,
+							size: "sm",
+							children: [/* @__PURE__ */ jsx(List, { className: "h-4 w-4 mr-2" }), "Waitlist"]
+						}),
+						/* @__PURE__ */ jsxs(Button, {
+							onPress: openCreateUserModal,
+							size: "sm",
+							children: [/* @__PURE__ */ jsx(UserPlus, { className: "h-4 w-4 mr-2" }), "Create User"]
+						}),
+						/* @__PURE__ */ jsxs("div", {
+							className: "text-sm text-muted-foreground",
+							children: ["Total users: ", totalUsers || 0]
+						})
+					]
+				})]
+			}),
+			/* @__PURE__ */ jsxs("div", {
+				className: "flex flex-col sm:flex-row gap-3 items-start sm:items-center",
+				children: [/* @__PURE__ */ jsxs("form", {
+					className: "relative flex-1",
+					onSubmit: (e) => {
+						e.preventDefault();
+						setDebouncedSearchQuery(searchQuery);
+						resetPage();
+					},
+					children: [
+						/* @__PURE__ */ jsx(Search, { className: "absolute left-2.5 top-2.5 h-4 w-4 text-muted-foreground" }),
+						/* @__PURE__ */ jsx(Input, {
+							"aria-label": "Search users",
+							placeholder: "Search users by name or email...",
+							className: "pl-8 w-full",
+							value: searchQuery,
+							onChange: (e) => setSearchQuery(e.target.value),
+							variant: "bordered"
+						}),
+						searchQuery && /* @__PURE__ */ jsx("button", {
+							type: "button",
+							onClick: () => setSearchQuery(""),
+							className: "absolute right-2.5 top-2.5 text-muted-foreground hover:text-foreground",
+							"aria-label": "Clear search",
+							children: /* @__PURE__ */ jsx(X, { className: "h-4 w-4" })
+						})
+					]
+				}), /* @__PURE__ */ jsxs("div", {
+					className: "flex gap-2",
+					children: [/* @__PURE__ */ jsxs(Select, {
+						"aria-label": "Status filter",
+						selectedKeys: new Set([statusFilter]),
+						onSelectionChange: (keys) => handleStatusFilterChange(Array.from(keys)[0]),
+						className: "w-[160px]",
+						startContent: /* @__PURE__ */ jsx(Filter, { className: "mr-1 h-4 w-4" }),
+						children: [
+							/* @__PURE__ */ jsx(SelectItem, { children: "All Users" }, "all"),
+							/* @__PURE__ */ jsx(SelectItem, { children: "Active Only" }, "active"),
+							/* @__PURE__ */ jsx(SelectItem, { children: "Banned Only" }, "banned")
+						]
+					}), hasActiveFilters && /* @__PURE__ */ jsxs(Button, {
+						variant: "bordered",
+						size: "sm",
+						onPress: clearFilters,
+						children: [/* @__PURE__ */ jsx(X, { className: "mr-1 h-4 w-4" }), "Clear Filters"]
+					})]
+				})]
+			}),
+			/* @__PURE__ */ jsx("div", {
+				className: "border rounded-lg overflow-hidden",
+				children: /* @__PURE__ */ jsxs(Table, {
+					"aria-label": "Users table",
+					removeWrapper: true,
+					children: [/* @__PURE__ */ jsxs(TableHeader, { children: [
+						/* @__PURE__ */ jsx(TableColumn, { children: "ID" }),
+						/* @__PURE__ */ jsxs(TableColumn, {
+							className: "cursor-pointer",
+							onClick: () => handleSort("name"),
+							children: ["Name ", renderSortIcon("name")]
+						}),
+						/* @__PURE__ */ jsxs(TableColumn, {
+							className: "cursor-pointer",
+							onClick: () => handleSort("email"),
+							children: ["Email ", renderSortIcon("email")]
+						}),
+						/* @__PURE__ */ jsxs(TableColumn, {
+							className: "cursor-pointer",
+							onClick: () => handleSort("role"),
+							children: ["Role ", renderSortIcon("role")]
+						}),
+						/* @__PURE__ */ jsx(TableColumn, { children: "Status" }),
+						/* @__PURE__ */ jsx(TableColumn, { children: "Onboarding" }),
+						/* @__PURE__ */ jsxs(TableColumn, {
+							className: "cursor-pointer",
+							onClick: () => handleSort("createdAt"),
+							children: ["Created At ", renderSortIcon("createdAt")]
+						}),
+						/* @__PURE__ */ jsx(TableColumn, {
+							className: "text-right",
+							children: "Actions"
+						})
+					] }), /* @__PURE__ */ jsx(TableBody, {
+						items: users ?? [],
+						emptyContent: hasActiveFilters ? "No users found matching your filters" : "No users found",
+						children: (user) => {
+							const onboarding = user.onboarding;
+							return /* @__PURE__ */ jsxs(TableRow, { children: [
+								/* @__PURE__ */ jsx(TableCell, {
+									className: "font-mono text-xs",
+									children: user.id
+								}),
+								/* @__PURE__ */ jsx(TableCell, { children: user.name }),
+								/* @__PURE__ */ jsx(TableCell, { children: user.email }),
+								/* @__PURE__ */ jsx(TableCell, { children: user.role || "user" }),
+								/* @__PURE__ */ jsx(TableCell, { children: user.banned ? /* @__PURE__ */ jsx(Tooltip, {
+									content: /* @__PURE__ */ jsxs("div", {
+										className: "space-y-1 text-xs",
+										children: [/* @__PURE__ */ jsxs("p", { children: [
+											/* @__PURE__ */ jsx("strong", { children: "Reason:" }),
+											" ",
+											user.banReason || "No reason provided"
+										] }), user.banExpires && /* @__PURE__ */ jsxs("p", {
+											className: "flex items-center gap-1",
+											children: [/* @__PURE__ */ jsx(CalendarClock, { className: "h-3 w-3" }), /* @__PURE__ */ jsxs("span", { children: [
+												/* @__PURE__ */ jsx("strong", { children: "Expires:" }),
+												" ",
+												formatBanExpiry(user.banExpires.getTime())
+											] })]
+										})]
+									}),
+									children: /* @__PURE__ */ jsxs("span", {
+										className: "inline-flex items-center gap-1 px-2.5 py-0.5 rounded-full text-xs font-medium bg-red-100 text-red-800",
+										children: ["Banned", user.banReason && /* @__PURE__ */ jsx(Info, { className: "h-3 w-3" })]
+									})
+								}) : /* @__PURE__ */ jsx("span", {
+									className: "inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-green-100 text-green-800",
+									children: "Active"
+								}) }),
+								/* @__PURE__ */ jsx(TableCell, { children: onboarding ?? "—" }),
+								/* @__PURE__ */ jsx(TableCell, { children: user.createdAt ? new Date(user.createdAt).toLocaleDateString() : "N/A" }),
+								/* @__PURE__ */ jsx(TableCell, {
+									className: "text-right",
+									children: /* @__PURE__ */ jsxs(Dropdown, {
+										placement: "bottom-end",
+										children: [/* @__PURE__ */ jsx(DropdownTrigger, { children: /* @__PURE__ */ jsx(Button, {
+											variant: "light",
+											size: "sm",
+											isIconOnly: true,
+											children: /* @__PURE__ */ jsx(MoreHorizontal, { className: "h-4 w-4" })
+										}) }), /* @__PURE__ */ jsxs(DropdownMenu, {
+											"aria-label": "User actions",
+											children: [
+												/* @__PURE__ */ jsx(DropdownItem, {
+													onClick: () => handleSetOnboardingUser(user.id),
+													children: "Set Onboarding"
+												}, "onboarding"),
+												/* @__PURE__ */ jsx(DropdownItem, {
+													onClick: () => openUsageModal(user.id, user.name),
+													className: useTRPC ? "" : "hidden",
+													children: /* @__PURE__ */ jsxs("span", {
+														className: "flex items-center gap-2",
+														children: [/* @__PURE__ */ jsx(BarChart3, { className: "h-4 w-4" }), "View AI Usage"]
+													})
+												}, "usage"),
+												/* @__PURE__ */ jsx(DropdownItem, {
+													onClick: () => handleImpersonateUser(user.id),
+													isDisabled: user.banned || isImpersonatingUser,
+													children: isImpersonatingUser ? /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(Spinner, { className: "mr-2 h-3 w-3" }), "Impersonating..."] }) : "Impersonate"
+												}, "impersonate"),
+												/* @__PURE__ */ jsx(DropdownItem, {
+													onClick: () => openMagicLinkModal(user.id, user.name, user.email ?? null),
+													className: trpc ? "" : "hidden",
+													children: /* @__PURE__ */ jsxs("span", {
+														className: "flex items-center gap-2",
+														children: [/* @__PURE__ */ jsx(Link2, { className: "h-4 w-4" }), "Generate Magic Login Link"]
+													})
+												}, "magic-link"),
+												user.banned ? /* @__PURE__ */ jsx(DropdownItem, {
+													onClick: () => handleUnbanUser(user.id),
+													isDisabled: isUnbanningUser[user.id],
+													children: isUnbanningUser[user.id] ? /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(Spinner, { className: "mr-2 h-3 w-3" }), "Unbanning..."] }) : "Unban"
+												}, "unban") : /* @__PURE__ */ jsx(DropdownItem, {
+													onClick: () => openBanModal(user.id, user.name),
+													children: "Ban"
+												}, "ban"),
+												/* @__PURE__ */ jsx(DropdownItem, {
+													onClick: () => confirmDelete(user.id),
+													children: "Remove"
+												}, "remove")
+											]
+										})]
+									})
+								})
+							] }, user.id);
+						}
+					})]
+				})
+			}),
+			totalPages > 0 && /* @__PURE__ */ jsxs("div", {
+				className: "flex items-center justify-end space-x-2 py-4",
+				children: [
+					/* @__PURE__ */ jsx(Button, {
+						variant: "bordered",
+						size: "sm",
+						onClick: () => handlePageChange(page - 1),
+						isDisabled: page === 0,
+						children: "Previous"
+					}),
+					/* @__PURE__ */ jsxs("div", {
+						className: "text-sm text-muted-foreground",
+						children: [
+							"Page ",
+							page + 1,
+							" of ",
+							totalPages
+						]
+					}),
+					/* @__PURE__ */ jsx(Button, {
+						variant: "bordered",
+						size: "sm",
+						onClick: () => handlePageChange(page + 1),
+						isDisabled: page === totalPages - 1,
+						children: "Next"
+					})
+				]
+			}),
+			/* @__PURE__ */ jsx(Modal, {
+				isOpen: !!userToDelete,
+				onOpenChange: (open) => {
+					if (!open) setUserToDelete(null);
+				},
+				children: /* @__PURE__ */ jsx(ModalContent, { children: (onClose) => /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsxs(ModalHeader, {
+					className: "flex flex-col gap-1",
+					children: [/* @__PURE__ */ jsx("p", {
+						className: "text-lg font-semibold",
+						children: "Are you sure?"
+					}), /* @__PURE__ */ jsx("p", {
+						className: "text-sm text-default-600",
+						children: "This action cannot be undone. This will permanently delete the user and all their data."
+					})]
+				}), /* @__PURE__ */ jsxs(ModalFooter, { children: [/* @__PURE__ */ jsx(Button, {
+					variant: "bordered",
+					onPress: onClose,
+					children: "Cancel"
+				}), /* @__PURE__ */ jsx(Button, {
+					color: "danger",
+					onPress: handleDelete,
+					isLoading: isDeleting,
+					children: "Delete"
+				})] })] }) })
+			}),
+			/* @__PURE__ */ jsx(Modal, {
+				isOpen: !!userToBan,
+				onOpenChange: (open) => {
+					if (!open) setUserToBan(null);
+				},
+				children: /* @__PURE__ */ jsx(ModalContent, { children: (onClose) => /* @__PURE__ */ jsxs("form", {
+					onSubmit: (e) => {
+						e.preventDefault();
+						handleBanUser();
+					},
+					className: "space-y-4",
+					children: [
+						/* @__PURE__ */ jsxs(ModalHeader, {
+							className: "flex flex-col gap-1",
+							children: [/* @__PURE__ */ jsx("p", {
+								className: "text-lg font-semibold",
+								children: "Ban User"
+							}), /* @__PURE__ */ jsx("p", {
+								className: "text-sm text-default-600",
+								children: userToBan && `You are about to ban ${userToBan.name}. This will prevent them from signing in.`
+							})]
+						}),
+						/* @__PURE__ */ jsxs(ModalBody, {
+							className: "space-y-4",
+							children: [
+								/* @__PURE__ */ jsxs("div", {
+									className: "space-y-2",
+									children: [/* @__PURE__ */ jsx("label", {
+										htmlFor: banReasonInputId,
+										className: "text-sm font-medium",
+										children: "Ban Reason"
+									}), /* @__PURE__ */ jsx(Input, {
+										id: banReasonInputId,
+										placeholder: "Enter reason for ban",
+										value: banReason,
+										onChange: (e) => setBanReason(e.target.value),
+										variant: "bordered",
+										labelPlacement: "outside",
+										label: "Ban Reason"
+									})]
+								}),
+								/* @__PURE__ */ jsxs("div", {
+									className: "space-y-2",
+									children: [/* @__PURE__ */ jsx("p", {
+										className: "text-sm font-medium",
+										children: "Ban Duration"
+									}), /* @__PURE__ */ jsxs("div", {
+										className: "grid grid-cols-2 gap-2",
+										children: [
+											/* @__PURE__ */ jsx(Button, {
+												type: "button",
+												variant: banExpiry === "never" ? "solid" : "bordered",
+												onClick: () => setBanExpiry("never"),
+												children: "Permanent"
+											}),
+											/* @__PURE__ */ jsx(Button, {
+												type: "button",
+												variant: banExpiry === "1d" ? "solid" : "bordered",
+												onClick: () => setBanExpiry("1d"),
+												children: "1 Day"
+											}),
+											/* @__PURE__ */ jsx(Button, {
+												type: "button",
+												variant: banExpiry === "7d" ? "solid" : "bordered",
+												onClick: () => setBanExpiry("7d"),
+												children: "7 Days"
+											}),
+											/* @__PURE__ */ jsx(Button, {
+												type: "button",
+												variant: banExpiry === "30d" ? "solid" : "bordered",
+												onClick: () => setBanExpiry("30d"),
+												children: "30 Days"
+											})
+										]
+									})]
+								}),
+								/* @__PURE__ */ jsxs("div", {
+									className: "space-y-2",
+									children: [/* @__PURE__ */ jsxs("div", {
+										className: "flex items-center gap-2",
+										children: [/* @__PURE__ */ jsx("input", {
+											type: "checkbox",
+											id: customDurationId,
+											checked: banExpiry === "custom",
+											onChange: (e) => e.target.checked ? setBanExpiry("custom") : setBanExpiry("never")
+										}), /* @__PURE__ */ jsx("label", {
+											htmlFor: customDurationId,
+											className: "text-sm font-medium",
+											children: "Custom Duration"
+										})]
+									}), banExpiry === "custom" && /* @__PURE__ */ jsxs("div", {
+										className: "flex items-center gap-2",
+										children: [/* @__PURE__ */ jsx(Input, {
+											type: "number",
+											min: "1",
+											value: customBanDays.toString(),
+											onChange: (e) => setCustomBanDays(Number(e.target.value)),
+											variant: "bordered",
+											labelPlacement: "outside",
+											label: "Custom duration (days)"
+										}), /* @__PURE__ */ jsx("span", {
+											className: "text-sm",
+											children: "Days"
+										})]
+									})]
+								})
+							]
+						}),
+						/* @__PURE__ */ jsxs(ModalFooter, { children: [/* @__PURE__ */ jsx(Button, {
+							variant: "bordered",
+							type: "button",
+							onPress: onClose,
+							children: "Cancel"
+						}), /* @__PURE__ */ jsxs(Button, {
+							color: "danger",
+							type: "submit",
+							isDisabled: isBanningUser,
+							children: [isBanningUser ? /* @__PURE__ */ jsx(Spinner, { className: "mr-2 h-4 w-4" }) : null, isBanningUser ? "Banning..." : "Ban User"]
+						})] })
+					]
+				}) })
+			}),
+			/* @__PURE__ */ jsx(Modal, {
+				isOpen: isCreateUserModalOpen,
+				onOpenChange: (open) => {
+					if (!open) setIsCreateUserModalOpen(false);
+				},
+				children: /* @__PURE__ */ jsx(ModalContent, { children: (onClose) => /* @__PURE__ */ jsxs("form", {
+					onSubmit: (e) => {
+						e.preventDefault();
+						handleCreateUser();
+					},
+					className: "space-y-4",
+					children: [
+						/* @__PURE__ */ jsxs(ModalHeader, {
+							className: "flex flex-col gap-1",
+							children: [/* @__PURE__ */ jsx("p", {
+								className: "text-lg font-semibold",
+								children: "Create New User"
+							}), /* @__PURE__ */ jsx("p", {
+								className: "text-sm text-default-600",
+								children: "Fill in the details below to create a new user account."
+							})]
+						}),
+						/* @__PURE__ */ jsxs(ModalBody, {
+							className: "space-y-4",
+							children: [
+								/* @__PURE__ */ jsx("div", {
+									className: "space-y-2",
+									children: /* @__PURE__ */ jsx(Input, {
+										id: nameInputId,
+										label: "Name *",
+										labelPlacement: "outside",
+										placeholder: "Enter user's name",
+										value: newUserData.name,
+										onChange: (e) => handleNewUserDataChange("name", e.target.value),
+										variant: "bordered"
+									})
+								}),
+								/* @__PURE__ */ jsx("div", {
+									className: "space-y-2",
+									children: /* @__PURE__ */ jsx(Input, {
+										id: emailInputId,
+										label: "Email *",
+										labelPlacement: "outside",
+										type: "email",
+										placeholder: "Enter user's email",
+										value: newUserData.email,
+										onChange: (e) => handleNewUserDataChange("email", e.target.value),
+										variant: "bordered"
+									})
+								}),
+								/* @__PURE__ */ jsx("div", {
+									className: "space-y-2",
+									children: /* @__PURE__ */ jsx(Input, {
+										id: passwordInputId,
+										label: "Password *",
+										labelPlacement: "outside",
+										type: "password",
+										placeholder: "Enter password",
+										value: newUserData.password,
+										onChange: (e) => handleNewUserDataChange("password", e.target.value),
+										variant: "bordered"
+									})
+								}),
+								/* @__PURE__ */ jsxs("div", {
+									className: "space-y-2",
+									children: [/* @__PURE__ */ jsx("p", {
+										className: "text-sm font-medium",
+										id: roleSelectId,
+										children: "Role"
+									}), /* @__PURE__ */ jsxs(Select, {
+										"aria-label": "Select role",
+										"aria-labelledby": roleSelectId,
+										selectedKeys: new Set([newUserData.role]),
+										onSelectionChange: (keys) => handleNewUserDataChange("role", Array.from(keys)[0]),
+										children: [/* @__PURE__ */ jsx(SelectItem, { children: "User" }, "user"), /* @__PURE__ */ jsx(SelectItem, { children: "Admin" }, "admin")]
+									})]
+								})
+							]
+						}),
+						/* @__PURE__ */ jsxs(ModalFooter, { children: [/* @__PURE__ */ jsx(Button, {
+							variant: "bordered",
+							type: "button",
+							onPress: onClose,
+							children: "Cancel"
+						}), /* @__PURE__ */ jsxs(Button, {
+							type: "submit",
+							color: "primary",
+							isDisabled: isCreatingUser,
+							children: [isCreatingUser ? /* @__PURE__ */ jsx(Spinner, { className: "mr-2 h-4 w-4" }) : null, isCreatingUser ? "Creating..." : "Create User"]
+						})] })
+					]
+				}) })
+			}),
+			/* @__PURE__ */ jsx(Modal, {
+				isOpen: !!userForUsage,
+				onOpenChange: (open) => {
+					if (!open) setUserForUsage(null);
+				},
+				children: /* @__PURE__ */ jsx(ModalContent, { children: (onClose) => /* @__PURE__ */ jsxs(Fragment, { children: [
+					/* @__PURE__ */ jsxs(ModalHeader, {
+						className: "flex flex-col gap-1",
+						children: [/* @__PURE__ */ jsxs("p", {
+							className: "text-lg font-semibold flex items-center gap-2",
+							children: [/* @__PURE__ */ jsx(BarChart3, { className: "h-5 w-5" }), "AI Usage"]
+						}), /* @__PURE__ */ jsx("p", {
+							className: "text-sm text-default-600",
+							children: userForUsage && `Usage statistics for ${userForUsage.name}`
+						})]
+					}),
+					/* @__PURE__ */ jsx(ModalBody, { children: isLoadingUsage ? /* @__PURE__ */ jsx("div", {
+						className: "flex justify-center py-8",
+						children: /* @__PURE__ */ jsx(Spinner, {})
+					}) : usageData ? /* @__PURE__ */ jsx("div", {
+						className: "space-y-4",
+						children: /* @__PURE__ */ jsxs("div", {
+							className: "grid grid-cols-2 gap-4",
+							children: [
+								/* @__PURE__ */ jsxs("div", {
+									className: "p-4 rounded-lg bg-default-100",
+									children: [/* @__PURE__ */ jsx("p", {
+										className: "text-sm text-default-600",
+										children: "Input Tokens"
+									}), /* @__PURE__ */ jsx("p", {
+										className: "text-2xl font-semibold",
+										children: formatTokenCount(usageData.inputTokens)
+									})]
+								}),
+								/* @__PURE__ */ jsxs("div", {
+									className: "p-4 rounded-lg bg-default-100",
+									children: [/* @__PURE__ */ jsx("p", {
+										className: "text-sm text-default-600",
+										children: "Output Tokens"
+									}), /* @__PURE__ */ jsx("p", {
+										className: "text-2xl font-semibold",
+										children: formatTokenCount(usageData.outputTokens)
+									})]
+								}),
+								/* @__PURE__ */ jsxs("div", {
+									className: "p-4 rounded-lg bg-default-100",
+									children: [/* @__PURE__ */ jsx("p", {
+										className: "text-sm text-default-600",
+										children: "Total Tokens"
+									}), /* @__PURE__ */ jsx("p", {
+										className: "text-2xl font-semibold",
+										children: formatTokenCount(usageData.totalTokens)
+									})]
+								}),
+								/* @__PURE__ */ jsxs("div", {
+									className: "p-4 rounded-lg bg-primary-100",
+									children: [/* @__PURE__ */ jsx("p", {
+										className: "text-sm text-primary-600",
+										children: "Estimated Cost"
+									}), /* @__PURE__ */ jsx("p", {
+										className: "text-2xl font-semibold text-primary",
+										children: formatCost(usageData.cost)
+									})]
+								})
+							]
+						})
+					}) : /* @__PURE__ */ jsx("div", {
+						className: "text-center py-8 text-default-600",
+						children: "No usage data available"
+					}) }),
+					/* @__PURE__ */ jsx(ModalFooter, { children: /* @__PURE__ */ jsx(Button, {
+						variant: "bordered",
+						onPress: onClose,
+						children: "Close"
+					}) })
+				] }) })
+			}),
+			/* @__PURE__ */ jsx(Modal, {
+				isOpen: !!userForMagicLink,
+				onOpenChange: (open) => {
+					if (!open) {
+						setUserForMagicLink(null);
+						setGeneratedMagicLink(null);
+						setClaimEmail("");
+					}
+				},
+				children: /* @__PURE__ */ jsx(ModalContent, { children: (onClose) => /* @__PURE__ */ jsxs("form", {
+					onSubmit: (e) => {
+						e.preventDefault();
+						handleGenerateMagicLink();
+					},
+					className: "space-y-4",
+					children: [
+						/* @__PURE__ */ jsxs(ModalHeader, {
+							className: "flex flex-col gap-1",
+							children: [/* @__PURE__ */ jsx("p", {
+								className: "text-lg font-semibold",
+								children: "Generate Magic Login Link"
+							}), /* @__PURE__ */ jsx("p", {
+								className: "text-sm text-default-600",
+								children: userForMagicLink && `Generate a one-time claim sign-in link for ${userForMagicLink.name}.`
+							})]
+						}),
+						/* @__PURE__ */ jsxs(ModalBody, {
+							className: "space-y-4",
+							children: [/* @__PURE__ */ jsx(Input, {
+								id: magicLinkEmailInputId,
+								label: "Claim email",
+								labelPlacement: "outside",
+								type: "email",
+								placeholder: "person@example.com",
+								value: claimEmail,
+								onChange: (e) => setClaimEmail(e.target.value),
+								variant: "bordered",
+								description: "This email is used for provider linking and future sign-ins."
+							}), /* @__PURE__ */ jsx(Input, {
+								id: generatedMagicLinkInputId,
+								label: "Generated link",
+								labelPlacement: "outside",
+								value: generatedMagicLink ?? "",
+								readOnly: true,
+								variant: "bordered",
+								placeholder: "Generate link to see it here"
+							})]
+						}),
+						/* @__PURE__ */ jsxs(ModalFooter, { children: [
+							/* @__PURE__ */ jsx(Button, {
+								variant: "bordered",
+								type: "button",
+								onPress: onClose,
+								children: "Close"
+							}),
+							/* @__PURE__ */ jsxs(Button, {
+								variant: "bordered",
+								type: "button",
+								onPress: copyGeneratedMagicLink,
+								isDisabled: !generatedMagicLink,
+								children: [/* @__PURE__ */ jsx(Copy, { className: "h-4 w-4 mr-2" }), "Copy Link"]
+							}),
+							/* @__PURE__ */ jsxs(Button, {
+								color: "primary",
+								type: "submit",
+								isDisabled: isGeneratingMagicLink,
+								children: [isGeneratingMagicLink ? /* @__PURE__ */ jsx(Spinner, { className: "mr-2 h-4 w-4" }) : null, isGeneratingMagicLink ? "Generating..." : "Generate Link"]
+							})
+						] })
+					]
+				}) })
+			})
+		]
+	});
 }
+//#endregion
+export { AdminUserManagement };
+
+//# sourceMappingURL=AdminUserManagement.js.map