@extends('layouts.admin')

@section('title', 'Users')
@section('heading', 'Users')

@section('content')
<header class="rhead">
    <div class="rhead__id">
        <span class="rhead__ico" aria-hidden="true"><svg class="i i--lg"><use href="#i-users"/></svg></span>
        <div>
            <h2>Users</h2>
            <p><strong>{{ $users->count() }}</strong> {{ $users->count() === 1 ? 'person' : 'people' }} can sign in &middot; {{ $users->where('role', 'admin')->count() }} {{ $users->where('role', 'admin')->count() === 1 ? 'administrator' : 'administrators' }} &middot; {{ $users->where('is_active', true)->count() }} active</p>
        </div>
    </div>
    <div class="rhead__act">
        <a class="btn btn--green btn--sm" href="{{ route('admin.users.create') }}"><svg class="i" aria-hidden="true"><use href="#i-plus"/></svg>Add user</a>
    </div>
</header>

<p class="dnote ujust">Administrators can do everything. Editors can manage content and the inbox.</p>

@error('delete')<div class="alert alert--err" role="alert"><svg class="i" aria-hidden="true"><use href="#i-info"/></svg><p>{{ $message }}</p></div>@enderror

<ul class="tgrid ugrid">
    @foreach ($users as $u)
        <li @class(['tcard', 'ucard', 'is-off' => ! $u->is_active])>
            <span @class(['pill', 'pill--on' => $u->is_active, 'pill--off' => ! $u->is_active, 'tcard__pill'])>{{ $u->is_active ? 'Active' : 'Disabled' }}</span>
            <a class="tcard__photo" href="{{ route('admin.users.edit', $u) }}" aria-label="Edit {{ $u->name }}">
                <span class="tcard__init" aria-hidden="true">{{ mb_strtoupper(mb_substr((string) $u->name, 0, 1)) }}</span>
            </a>
            <a class="tcard__name" href="{{ route('admin.users.edit', $u) }}">{{ $u->name }}@if ($u->id === auth()->id()) <span class="pill ucard__you">You</span>@endif</a>
            <p class="tcard__role">{{ \App\Models\User::ROLES[$u->role] ?? $u->role }}</p>
            <ul class="ucard__info">
                <li><svg class="i" aria-hidden="true"><use href="#i-mail"/></svg><span>{{ $u->email }}</span></li>
                <li><svg class="i" aria-hidden="true"><use href="#i-lock"/></svg><span>{{ $u->last_login_at ? 'Signed in '.$u->last_login_at->diffForHumans() : 'Never signed in' }}</span></li>
            </ul>
            <div class="rowact tcard__act">
                <a class="btn btn--ghost btn--sm" href="{{ route('admin.users.edit', $u) }}"><svg class="i" aria-hidden="true"><use href="#i-pencil"/></svg>Edit</a>
                @if ($u->id !== auth()->id())
                    <form action="{{ route('admin.users.destroy', $u) }}" method="post" data-confirm="Delete {{ $u->name }}? They will no longer be able to sign in.">
                        @csrf @method('DELETE')
                        <button class="iconbtn iconbtn--danger" type="submit" aria-label="Delete {{ $u->name }}" title="Delete"><svg class="i" aria-hidden="true"><use href="#i-trash"/></svg></button>
                    </form>
                @endif
            </div>
        </li>
    @endforeach
</ul>
@endsection