@extends('mainlayout.layout')

@section('title', config('app.name') . ' | Users')
@section('topbar-search', 'enabled')

@section('content')
<main class="portal-workspace portal-light-type" data-async-directory>
    <header class="portal-page-header">
        <div>
            <span class="portal-eyebrow">Access management</span>
            <h1>Users</h1>
            <p>Review portal accounts, roles, activity and invitation status.</p>
        </div>
        @role('superadmin')
            <div class="portal-header-actions">
                <a href="/users/import_users" class="btn btn-mlk-outline"><i class="bx bx-import"></i> Import users</a>
                <a href="/users/add_user" class="btn btn-mlk-primary"><i class="bx bx-user-plus"></i> Add user</a>
            </div>
        @endrole
    </header>

    <section class="portal-kpi-grid portal-kpi-grid--three" aria-label="User overview" data-async-summary>
        <article class="portal-kpi-card"><span class="portal-kpi-icon"><i class="bx bx-group"></i></span><span class="portal-kpi-label">Total accounts</span><strong>{{ number_format($metrics['total']) }}</strong></article>
        <article class="portal-kpi-card"><span class="portal-kpi-icon tone-dark"><i class="bx bx-id-card"></i></span><span class="portal-kpi-label">{{ $selectedRole !== '' ? 'Selected role · ' . Str::headline($selectedRole) : 'All roles' }}</span><strong>{{ number_format($metrics['role_count']) }}</strong></article>
        <article class="portal-kpi-card"><span class="portal-kpi-icon tone-orange"><i class="bx bx-calendar-plus"></i></span><span class="portal-kpi-label">Added in 30 days <small>{{ $selectedRole !== '' ? '· ' . Str::headline($selectedRole) : '· All roles' }}</small></span><strong>{{ number_format($metrics['recent']) }}</strong></article>
    </section>

    <section class="portal-card" data-async-list>
        <form class="portal-filter-bar portal-filter-bar--list" action="{{ url('/users/view_user') }}" method="GET" data-async-filter>
            @if(request()->filled('per_page'))<input type="hidden" name="per_page" value="{{ request('per_page') }}">@endif
            <label class="portal-search-field">
                <i class="bx bx-search"></i>
                <input type="search" name="search" value="{{ $search }}" placeholder="Search name, email, phone or role" aria-label="Search users" autocomplete="off" data-auto-submit>
            </label>
            <select name="role" aria-label="Filter users by role" data-auto-change>
                <option value="">All roles</option>
                @foreach($roles as $role)
                    <option value="{{ $role->name }}" @selected($selectedRole === $role->name)>{{ Str::headline($role->name) }}</option>
                @endforeach
            </select>
            <button class="btn btn-mlk-primary" type="submit"><i class="bx bx-search"></i> Search</button>
            @if($search !== '' || $selectedRole !== '')
                <a class="btn btn-mlk-outline" href="{{ url('/users/view_user') }}" data-async-clear>Clear</a>
            @endif
        </form>

        <header class="portal-card-header">
            <div>
                <h2>{{ $search !== '' || $selectedRole !== '' ? 'Matching users' : 'Recent users' }}</h2>
                <p>{{ $search !== '' || $selectedRole !== '' ? 'All matching accounts, with adjustable page sizes.' : 'Newest accounts first. Choose how many results to show per page.' }}</p>
            </div>
            <span class="portal-status portal-status--neutral">
                @if($users->total()) {{ number_format($users->firstItem()) }}–{{ number_format($users->lastItem()) }} of {{ number_format($users->total()) }} @else 0 users @endif
            </span>
        </header>

        <div class="portal-directory-progress" data-async-progress role="status" aria-live="polite"><span></span> Loading users…</div>
        <div class="table-responsive">
            <table class="table portal-table">
                <thead><tr><th>User</th><th>Contact</th><th>Role</th><th>Account status</th><th>Last sign-in</th><th>Created</th></tr></thead>
                <tbody>
                @forelse($users as $user)
                    @php
                        $userUrl = url('/users/view_user/' . encrypt($user->uid));
                        $name = trim($user->first_name . ' ' . $user->middle_name . ' ' . $user->last_name);
                        $roles = $user->roles->pluck('name')->map(fn ($role) => ucfirst($role))->join(', ');
                        $invitationPending = (bool) $user->invitation_pending;
                        $statusLabel = $user->trashed()
                            ? 'Deleted · purges ' . optional($user->permanent_deletion_at)->format('d M Y')
                            : ($user->is_banned
                                ? 'Banned'
                                : ($invitationPending ? 'Invitation pending' : ($user->status_description ?: (($user->status === 0 || $user->status === '0') ? 'Inactive' : 'Active'))));
                        $statusClass = $user->trashed() || $user->is_banned || $invitationPending ? 'portal-status--neutral' : 'portal-status--success';
                    @endphp
                    <tr class="portal-clickable-row" data-href="{{ $userUrl }}" tabindex="0" role="link" aria-label="View user {{ $name ?: $user->email }}">
                        <td><a href="{{ $userUrl }}">{{ $name ?: 'Unnamed user' }}</a><small>Account #{{ $user->uid }}</small></td>
                        <td>{{ $user->phone ?: 'Phone not available' }}<small>{{ $user->email ?: 'Email not available' }}</small></td>
                        <td>{{ $roles ?: 'No role assigned' }}</td>
                        <td><span class="portal-status {{ $statusClass }}">{{ $statusLabel }}</span></td>
                        <td>{{ optional($user->last_logon)->format('d M Y') ?: 'Never' }}<small>{{ optional($user->last_logon)->format('H:i') }}</small></td>
                        <td>{{ optional($user->created_at)->format('d M Y') ?: '—' }}<small>{{ optional($user->created_at)->format('H:i') }}</small></td>
                    </tr>
                @empty
                    <tr><td colspan="6"><div class="portal-empty portal-empty--muted compact">No users match the current search.</div></td></tr>
                @endforelse
                </tbody>
            </table>
        </div>

        @include('partials.directory-pagination', ['paginator' => $users])
    </section>
</main>
@endsection

@push('scripts')
<script src="{{ asset('/web/assets/js/portal-async-directory.js') }}?v=2" defer></script>
@endpush