@extends('layouts.app')
@section('title', 'Users')

@section('content')
@php
    $pills = filter_pills([
        'role_id' => ['Role', fn ($id) => optional($roles->firstWhere('id', $id))->name ?? $id],
        'status' => ['Status', ['active' => 'Active', 'inactive' => 'Deactivated']],
    ]);
    $filtered = count($pills) > 0 || request()->filled('q');
@endphp
<x-page-header title="Users" subtitle="Who can sign in, and what their role lets them do">
    <a href="{{ route('roles.index') }}" class="btn btn-ghost"><i class="bi bi-shield-lock" aria-hidden="true"></i> Roles</a>
    <a href="{{ route('users.create') }}" class="btn btn-primary"><i class="bi bi-person-plus" aria-hidden="true"></i> Add user</a>
</x-page-header>

<div class="chip-row mb-3">
    <a class="chip {{ ! request('status') ? 'active' : '' }}" href="{{ request()->fullUrlWithQuery(['status' => null, 'page' => null]) }}">All <span class="n">{{ $counts['all'] }}</span></a>
    <a class="chip {{ request('status') === 'active' ? 'active' : '' }}" href="{{ request()->fullUrlWithQuery(['status' => 'active', 'page' => null]) }}">Active <span class="n">{{ $counts['active'] }}</span></a>
    <a class="chip {{ request('status') === 'inactive' ? 'active' : '' }}" href="{{ request()->fullUrlWithQuery(['status' => 'inactive', 'page' => null]) }}">Deactivated <span class="n">{{ $counts['inactive'] }}</span></a>
</div>

<x-filter-bar placeholder="Search name or email…" :pills="$pills" :keep="['status', 'sort', 'dir', 'per_page']">
    <x-slot:panel>
        <div class="col-md-4">
            <label class="form-label" for="f-role">Role</label>
            <select id="f-role" name="role_id" class="form-select"><option value="">Any role</option>@foreach ($roles as $r)<option value="{{ $r->id }}" @selected(request('role_id') == $r->id)>{{ $r->name }}</option>@endforeach</select>
        </div>
    </x-slot:panel>
</x-filter-bar>

<div class="card">
    <div class="table-wrap">
        <table class="table table-modern table-cards align-middle">
            <thead><tr>
                <x-sort-th column="name" label="User" :default="true" />
                <x-sort-th column="role" label="Role" />
                <th scope="col">Status</th>
                <x-sort-th column="last_login" label="Last sign-in" defaultDir="desc" />
                <th scope="col"><span class="visually-hidden">Actions</span></th>
            </tr></thead>
            <tbody>
            @forelse ($users as $u)
                <tr class="{{ $u->is_active ? '' : 'opacity-75' }}">
                    <td class="cell-title" data-label="User">
                        <div class="d-flex align-items-center gap-3">
                            <x-avatar :name="$u->name" :size="36" />
                            <div class="min-w-0">
                                <a href="{{ route('users.edit', $u) }}" class="cell-main text-decoration-none">{{ $u->name }}</a>
                                @if ($u->is(auth()->user()))<span class="badge-soft badge-soft-primary no-dot ms-1">You</span>@endif
                                <span class="cell-sub">{{ $u->email }}</span>
                            </div>
                        </div>
                    </td>
                    <td data-label="Role">
                        @if ($u->role)<span class="badge-soft badge-soft-{{ $u->role->is_owner ? 'warning' : 'primary' }} no-dot">@if ($u->role->is_owner)<i class="bi bi-star-fill" aria-hidden="true"></i>@endif{{ $u->role->name }}</span>
                        @else<span class="badge-soft badge-soft-danger no-dot">No role</span>@endif
                    </td>
                    <td data-label="Status"><span class="badge-soft badge-soft-{{ $u->is_active ? 'success' : 'secondary' }}">{{ $u->is_active ? 'Active' : 'Deactivated' }}</span></td>
                    <td data-label="Last sign-in">{{ $u->last_login_at ? $u->last_login_at->diffForHumans() : 'Never' }}</td>
                    <td class="actions-col">
                        <x-row-actions :label="'Actions for '.$u->name">
                            <li><a class="dropdown-item" href="{{ route('users.edit', $u) }}"><i class="bi bi-pencil"></i>Edit / reset password</a></li>
                            @unless ($u->is(auth()->user()))
                                <li><hr class="dropdown-divider"></li>
                                <li><x-delete-button item :action="route('users.destroy', $u)" :title="'Delete '.$u->name.'?'" confirm="They can no longer sign in. Entries they made stay in the books. To keep their record, deactivate them instead." /></li>
                            @endunless
                        </x-row-actions>
                    </td>
                </tr>
            @empty
                <tr class="empty-row"><td colspan="5"><x-empty icon="people" title="No users found" :filtered="$filtered" /></td></tr>
            @endforelse
            </tbody>
        </table>
    </div>
    <x-table-foot :paginator="$users" />
</div>
@endsection