import AppLayout from '@/Layouts/AppLayout'; import { Head, router } from '@inertiajs/react'; import { Users, Shield, Plus, Edit, Trash2, UserCheck } from 'lucide-react'; import { GlassCard, StatCard } from '@/Components/ui/GlassCard'; import { Button } from '@/Components/ui/Button'; import { DataTable } from '@/Components/ui/DataTable'; import { StatusBadge } from '@/Components/ui/StatusBadge'; import { timeAgo } from '@/lib/utils'; import { Tabs, TabsList, TabsTrigger, TabsContent } from '@radix-ui/react-tabs'; import { cn } from '@/lib/utils'; import { useState } from 'react'; export default function AclIndex({ users, roles }) { const [tab, setTab] = useState('users'); const userColumns = [ { header: 'User', accessor: 'name', render: row => (
{row.name}

{row.name}

{row.email}

)}, { header: 'Auth', accessor: 'auth_source', render: row => ( {row.auth_source} )}, { header: 'Roles', key: 'roles', render: row => (
{(row.roles ?? []).map(r => ( {r} ))}
)}, { header: 'Status', accessor: 'is_active', render: row => ( )}, { header: 'Last Login', accessor: 'last_login_at', render: row => ( {timeAgo(row.last_login_at)} )}, { header: '', key: 'actions', render: row => (
e.stopPropagation()}>
)}, ]; const roleColumns = [ { header: 'Role', accessor: 'name', render: row => (

{row.name}

{row.permissions_count ?? 0} permissions

)}, { header: 'Users', key: 'users', render: row => ( {row.users_count ?? 0} )}, { header: '', key: 'actions', render: row => (
)}, ]; return (

Access Control

Users, roles, and permissions management

{tab === 'users' && } {tab === 'roles' && }
u.is_active).length ?? 0} icon={UserCheck} color="green" /> u.auth_source === 'ldap').length ?? 0} icon={Shield} color="purple" />
{[{ value: 'users', label: 'Users' }, { value: 'roles', label: 'Roles & Permissions' }].map(t => ( {t.label} ))} router.visit(`/acl/users/${row.id}/edit`)} emptyMessage="No users found." />
); }