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 => (
)},
{ 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
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." />
);
}