import { Search, Users2 } from 'lucide-react'; import { useRef } from 'react'; import { Head, Link } from '@inertiajs/react'; import { AdminDataTable } from '@/Components/admin/AdminDataTable'; import PageHeader from '@/Components/layout/PageHeader'; import { Badge } from '@/Components/ui/badge'; import { Breadcrumb, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, } from '@/Components/ui/breadcrumb'; import { Button } from '@/Components/ui/button'; import { ExportButton } from '@/Components/ui/export-button'; import { Input } from '@/Components/ui/input'; import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue, } from '@/Components/ui/select'; import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow, } from '@/Components/ui/table'; import { useAdminFilters } from '@/hooks/useAdminFilters'; import { useAdminKeyboardShortcuts } from '@/hooks/useAdminKeyboardShortcuts'; import { useNavigationState } from '@/hooks/useNavigationState'; import AdminLayout from '@/Layouts/AdminLayout'; import { formatRelativeTime } from '@/lib/format'; interface SiteMemberRow { id: number; site_id: number; site_name: string | null; site_domain: string | null; user_id: number | null; user_name: string | null; user_email: string | null; inviter_name: string | null; role: string; accepted_at: string | null; created_at: string; } interface PaginatedMembers { data: SiteMemberRow[]; current_page: number; last_page: number; from: number | null; to: number | null; total: number; } interface Props { members: PaginatedMembers; filters: { role: string; pending: string; search?: string }; } const roleVariant = (role: string): 'default' | 'secondary' | 'outline' => { switch (role) { case 'admin': return 'default'; case 'editor': return 'secondary'; default: return 'outline'; } }; export default function SiteMembersIndex({ members, filters }: Props) { const isNavigating = useNavigationState(); const searchRef = useRef(null); const { search, setSearch, updateFilter, handlePage } = useAdminFilters({ route: route('admin.site-members.index'), filters, }); useAdminKeyboardShortcuts({ onSearch: () => searchRef.current?.focus(), onNextPage: members.current_page < members.last_page ? () => handlePage(members.current_page + 1) : undefined, onPrevPage: members.current_page > 1 ? () => handlePage(members.current_page - 1) : undefined, }); const currentPage = members.current_page; const lastPage = members.last_page; useAdminKeyboardShortcuts({ onNextPage: currentPage < lastPage ? () => handlePage(currentPage + 1) : undefined, onPrevPage: currentPage > 1 ? () => handlePage(currentPage - 1) : undefined, }); return (

Admin Site Members

} />

setSearch(e.target.value)} className="pl-9 w-48" aria-label="Search site members" />

Member Site Role Invited By Status Accepted Invited {members.data.map((member) => (

{member.user_name ?? '—'}

{member.user_email}

{member.site_name}

{member.site_domain}

{member.role} {member.inviter_name ?? '—'} {member.accepted_at ? 'Accepted' : 'Pending'} {member.accepted_at ? formatRelativeTime(member.accepted_at) : '—'} {formatRelativeTime(member.created_at)} ))}

); }