{{--
    User profile — docs/wireframes-v12/view-user.html, content region for content
    region, minus everything CR-13 §0 removes.

    v12's order, top to bottom: a profile header card (64px initials circle, the
    name, a badge row, and the action buttons on the right), a `.grid-2` of two
    detail cards, an Assigned Permissions card, and a `.grid-2` holding Recent
    Activity and Performance Summary.

    ## Deliberate differences from the wireframe

      * **The "Reset Password" button is gone** (decision D2; line 92). The
        client's edit-password rule makes the edit form's optional password
        fields the one mechanism, and a second writer of the same column is
        exactly what that decision avoids.
      * **Delete is NOT on this page**, because v12 does not draw it here. It
        lives on the listing row, where the wireframe's own action group is.
      * **The Account Details card loses two rows** — Username (client, §0.3;
        line 143) and Two-Factor Auth (client, §0.5; line 167) — and **Failed
        Login Attempts** goes with them (decision D4; line 171), because nothing
        counts them. Five rows are left and every one of them is real.
      * **The Assigned Permissions grid is this application's own permissions**
        (decision D5): all thirty-two entries of
        RolePermissionSeeder::PERMISSIONS, in the seeder's order, each ticked or
        crossed by asking `$user->can()`. v12's sixteen checkboxes name features
        NREMS does not have ("Manage Visits", "Export Data"), and a grid of
        labels nothing could ever grant would be furniture. Asking the GATE
        rather than reading the pivot is what makes a Super Admin show every box
        ticked while holding no permission at all — which is the truth about
        what they can do.
      * **Recent Activity is real spatie rows** the user CAUSED, newest first,
        capped at ten. v12's six entries are mock-ups, and they are prose over a
        log that stores an event, a subject and a properties bag — so this
        renders those three things and fabricates no sentence.
      * **Performance Summary draws THREE tiles, not four.** "Revenue Generated"
        is removed (financials are excluded by a standing client rule) and the
        fourth cell is left empty rather than filled with a metric invented to
        occupy it. The "This month" / "Above avg" trend lines go too: they name
        periods nothing computes, and these values are all-time.

    Every blank is an em-dash, which is this application's blank.
--}}
@extends('layouts.app')

@section('title', __('users.show_title', ['name' => $user->name]))

@section('breadcrumbs')
    <x-breadcrumbs :items="[
        __('users.title') => route('users.index'),
        __('users.breadcrumb.show') => null,
    ]" />
@endsection

@section('content')
    @php
        $dateFormat = (string) config('nrems.date_format');

        $actor = auth()->user();
        $actor = $actor instanceof \App\Models\User ? $actor : null;

        // The same two predicates the listing's row actions use — see
        // users/partials/actions.blade.php. Hiding is the visible half of
        // guard §4.6; UserController answers 403 on the same conditions.
        $canEdit = $user->isManageableBy($actor);
        $canToggleStatus = $user->isDestructibleBy($actor);

        $activating = $user->status === \App\Enums\UserStatus::Inactive;
    @endphp

    {{-- The profile header. v12 puts this inside a `.card-body` rather than
         using the `.card-header` idiom, because the row is a portrait and not a
         heading. --}}
    <div class="card mb-4">
        <div class="card-body">
            <div class="d-flex justify-between align-center">
                <div class="d-flex align-center usr-profile-identity">
                    <div class="usr-avatar" aria-hidden="true">{{ $user->initials() }}</div>
                    <div>
                        <h3 class="usr-name">{{ $user->name }}</h3>
                        <div class="d-flex align-center gap-2">
                            @include('users.partials.status', ['model' => $user])
                            @include('users.partials.role', ['model' => $user])
                            <span class="usr-code">{{ $user->code ?? '—' }}</span>
                        </div>
                    </div>
                </div>

                <div class="d-flex gap-2">
                    @can('users.edit')
                        @if ($canEdit)
                            <a href="{{ route('users.edit', $user) }}" class="btn btn-primary">
                                <i class="fa-solid fa-pen" aria-hidden="true"></i>{{ __('users.actions.edit_user') }}
                            </a>
                        @endif
                    @endcan

                    @can('users.edit')
                        @if ($canToggleStatus)
                            {{-- A real POST form and never a link: a GET that
                                 changes state would be triggered by any crawler
                                 or prefetch. The confirmation goes through
                                 Js::from(), which emits the name as a JSON
                                 string literal — `{{ }}` escapes for HTML and
                                 not for Javascript. Both directions are
                                 confirmed (decision D1). --}}
                            <x-form.open id="nrems_user_profile_status_form" :action="route('users.status', $user)"
                                         method="POST" :novalidate="false"
                                         onsubmit="return confirm({{ Js::from(__($activating ? 'users.confirm.activate' : 'users.confirm.deactivate', ['name' => $user->name])) }});" />
                                <button type="submit" class="btn btn-outline {{ $activating ? 'usr-btn-activate' : 'usr-btn-deactivate' }}">
                                    <i class="fa-solid {{ $activating ? 'fa-user-check' : 'fa-user-slash' }}" aria-hidden="true"></i>{{ __($activating ? 'users.actions.activate' : 'users.actions.deactivate') }}
                                </button>
                            <x-form.close />
                        @endif
                    @endcan
                </div>
            </div>
        </div>
    </div>

    <div class="grid-2 mb-4">
        <x-card :title="__('users.show.personal')" icon="fa-solid fa-user">
            <div class="detail-grid">
                <div class="detail-item">
                    <span class="label">{{ __('users.show.full_name') }}</span>
                    <span class="value">{{ $user->name }}</span>
                </div>
                <div class="detail-item">
                    <span class="label">{{ __('users.fields.email') }}</span>
                    <span class="value">{{ $user->email }}</span>
                </div>
                <div class="detail-item">
                    <span class="label">{{ __('users.fields.phone') }}</span>
                    <span class="value">{{ $user->phone ?? '—' }}</span>
                </div>
                <div class="detail-item">
                    <span class="label">{{ __('users.fields.gender') }}</span>
                    <span class="value">{{ $user->gender?->label() ?? '—' }}</span>
                </div>
                <div class="detail-item">
                    <span class="label">{{ __('users.fields.date_of_joining') }}</span>
                    <span class="value">{{ $user->date_of_joining?->format($dateFormat) ?? '—' }}</span>
                </div>
                <div class="detail-item">
                    <span class="label">{{ __('users.fields.department') }}</span>
                    <span class="value">{{ $user->department?->label() ?? '—' }}</span>
                </div>
            </div>
        </x-card>

        <x-card :title="__('users.show.account')" icon="fa-solid fa-lock">
            <div class="detail-grid">
                <div class="detail-item">
                    <span class="label">{{ __('users.fields.role') }}</span>
                    <span class="value">{{ $roleName ?? '—' }}</span>
                </div>
                <div class="detail-item">
                    <span class="label">{{ __('users.activity.created_at') }}</span>
                    <span class="value">{{ $user->created_at?->format($dateFormat) ?? '—' }}</span>
                </div>
                <div class="detail-item">
                    <span class="label">{{ __('users.activity.last_login') }}</span>
                    <span class="value">{{ $user->last_login_at?->format($dateFormat.', g:i A') ?? '—' }}</span>
                </div>
                <div class="detail-item">
                    <span class="label">{{ __('users.activity.total_logins') }}</span>
                    <span class="value">{{ $totalLogins }}</span>
                </div>
                <div class="detail-item">
                    <span class="label">{{ __('users.activity.password_changed_at') }}</span>
                    <span class="value">{{ $user->password_changed_at?->format($dateFormat) ?? '—' }}</span>
                </div>
            </div>
        </x-card>
    </div>

    <x-card :title="__('users.show.permissions')" icon="fa-solid fa-shield-halved" class="mb-4">
        <div class="grid-4">
            @foreach ($permissions as $permission)
                {{-- The lang key is built from the permission NAME, which is why
                     lang/en/users.php nests its labels by resource: __() splits
                     its key on dots, so 'users.permissions.projects.view'
                     resolves through ['permissions']['projects']['view']. A
                     permission added to the seeder's constant therefore appears
                     here with nothing to change but its label. --}}
                <div class="usr-permission @if (! $permission['granted']) is-denied @endif">
                    <i class="fa-solid {{ $permission['granted'] ? 'fa-circle-check text-success' : 'fa-circle-xmark text-muted' }}" aria-hidden="true"></i>
                    {{ __('users.permissions.'.$permission['name']) }}
                </div>
            @endforeach
        </div>
    </x-card>

    <div class="grid-2">
        <x-card :title="__('users.show.recent_activity')" icon="fa-solid fa-clock-rotate-left">
            @if ($activities === [])
                <p class="text-secondary">{{ __('users.show.no_activity') }}</p>
            @else
                {{-- Composed here rather than in the controller because it is
                     *wording*, and the controller hands over four facts per row:
                     the formatted time, the log's event name, the description
                     spatie wrote, and the subject's code where the subject has
                     one.

                     No sentence is invented. An event this application names —
                     the three HasAudit writes plus the module events CR-9, CR-12
                     and CR-13 log by hand — reads as its lang string; anything
                     else degrades to the raw word, and to the raw DESCRIPTION
                     when even that is empty, because a timeline entry with no
                     sentence is a dot with nothing beside it. Both are escaped
                     like everything else here. --}}
                <div class="timeline">
                    @foreach ($activities as $entry)
                        @php
                            $word = $entry['event'] !== '' ? $entry['event'] : $entry['description'];
                            $sentence = ucfirst(str_replace('_', ' ', $word));
                        @endphp
                        <div class="timeline-item">
                            <div class="time">{{ $entry['time'] }}</div>
                            <div class="event">
                                <span class="fw-600">{{ $sentence }}</span>@if ($entry['subject'] !== null) <strong>{{ $entry['subject'] }}</strong>@endif
                            </div>
                        </div>
                    @endforeach
                </div>
            @endif
        </x-card>

        <x-card :title="__('users.show.performance')" icon="fa-solid fa-chart-line">
            {{-- v12's inner `.grid-2` at a 20px gap, with the wireframe's own
                 bordered stat tiles. THREE of them: Revenue Generated is
                 removed and its cell is simply not drawn, so the two rows are
                 2 + 1 rather than 2 + 2. --}}
            <div class="grid-2 usr-perf-grid">
                <div class="stat-card usr-perf-tile">
                    <div class="stat-icon blue"><i class="fa-solid fa-phone" aria-hidden="true"></i></div>
                    <div class="stat-value">{{ $performance['inquiries'] }}</div>
                    <div class="stat-label">{{ __('users.show.inquiries_handled') }}</div>
                </div>
                <div class="stat-card usr-perf-tile">
                    <div class="stat-icon green"><i class="fa-solid fa-file-contract" aria-hidden="true"></i></div>
                    <div class="stat-value">{{ $performance['bookings'] }}</div>
                    <div class="stat-label">{{ __('users.show.bookings_closed') }}</div>
                </div>
                <div class="stat-card usr-perf-tile">
                    <div class="stat-icon purple"><i class="fa-solid fa-percent" aria-hidden="true"></i></div>
                    {{-- An em-dash and not "0%" when they have handled no
                         inquiries: a rate over zero is not zero, it is nothing. --}}
                    <div class="stat-value">{{ $performance['conversion'] === null ? '—' : $performance['conversion'].'%' }}</div>
                    <div class="stat-label">{{ __('users.show.conversion_rate') }}</div>
                </div>
            </div>
        </x-card>
    </div>
@endsection