@extends('admin/layouts/admin')
@section('title', __($translatePrefix . '.show.title', ['name' => $item->username]))
@section('scripts')
    <script src="{{ Vite::asset('resources/global/js/clipboard.js') }}" type="module"></script>
    <script src="{{ Vite::asset('resources/global/js/flatpickr.js') }}" type="module"></script>
@endsection
@section('content')
    @include('admin/shared/alerts')
    <div class="flex flex-col md:flex-row gap-4">
        <div class="md:w-2/3">
            <div class="flex flex-col">
                <div class="-m-1.5 overflow-x-auto">
                    <div class="p-1.5 min-w-full inline-block align-middle">
                        <div class="card">
                            <div class="card-heading">
                                <div>
                                    <h2 class="text-xl font-semibold text-gray-800 dark:text-gray-200">
                                        {{ __($translatePrefix . '.show.title', ['name' => $item->username]) }}
                                    </h2>
                                    <p class="text-sm text-gray-600 dark:text-gray-400">
                                        {{ __($translatePrefix . '.show.subheading', ['date' => $item->created_at != null ? $item->created_at->format('d/m/y') : 'None']) }}
                                    </p>
                                </div>
                                <div class="mt-4 flex items-center space-x-4 sm:mt-0">
                                    <button class="btn btn-primary" type="submit" form="admin-profile-form">
                                        {{ __('admin.updatedetails') }}
                                    </button>
                                </div>
                            </div>
                            <div class="grid grid-cols-1 md:grid-cols-3 gap-4">
                            <form id="admin-profile-form" class="contents" method="POST" action="{{ route($routePath . '.profile') }}">
                                @csrf
                                @method('PUT')
                                <div>
                                    @include('admin/shared/input', [
                                        'name' => 'username',
                                        'label' => __('global.username'),
                                        'value' => old('username', $item->username),
                                    ])
                                </div>

                                <div>
                                    @include('admin/shared/input', [
                                        'name' => 'firstname',
                                        'label' => __('global.firstname'),
                                        'value' => old('firstname', $item->firstname),
                                    ])
                                </div>

                                <div>
                                    @include('admin/shared/input', [
                                        'name' => 'lastname',
                                        'label' => __('global.lastname'),
                                        'value' => old('lastname', $item->lastname),
                                    ])
                                </div>
                                <div>
                                    @include('admin/shared/input', [
                                        'name' => 'email',
                                        'label' => __('global.email'),
                                        'value' => old('email', $item->email),
                                        'type' => 'email',
                                    ])
                                    @include('admin/shared/select', [
                                        'name' => 'locale',
                                        'label' => __('global.locale'),
                                        'options' => $locales,
                                        'value' => old('locale', $item->locale),
                                    ])
                                </div>

                                <div>
                                    @include('admin/shared/textarea', [
                                        'name' => 'signature',
                                        'label' => __('admin.admins.signature'),
                                        'value' => old('signature', $item->signature),
                                    ])
                                </div>
                            </form>
                            <x-avatar-editor
                                :user="$item"
                                :upload-route="route('admin.profile.avatar.upload')"
                                :delete-route="route('admin.profile.avatar.delete')"
                                input-id="admin-avatar"
                                variant="field"
                            />
                            </div>
                        </div>
                        <div class="card mt-4">
                            <div class="card-heading">
                                <div>
                                    <h2 class="text-xl font-semibold text-gray-800 dark:text-gray-200">
                                        {{ __('client.profile.security.title') }}
                                    </h2>
                                    <p class="text-sm text-gray-600 dark:text-gray-400">
                                        {{ __('client.profile.security.subheading') }}
                                    </p>
                                </div>
                            </div>
                            <form method="POST" action="{{ route('admin.profile.password') }}">
                                @csrf
                                @method('PUT')
                                <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
                                    <div>
                                        @include('admin/shared/password', [
                                            'name' => 'current_password',
                                            'label' => __('client.profile.security.currentpassword'),
                                            'required' => true,
                                        ])
                                    </div>
                                    <div></div>
                                    <div>
                                        @include('admin/shared/password', [
                                            'name' => 'password',
                                            'label' => __('client.profile.security.newpassword'),
                                            'required' => true,
                                        ])
                                    </div>
                                    <div>
                                        @include('admin/shared/password', [
                                            'name' => 'password_confirmation',
                                            'label' => __('client.profile.security.newpassword_confirmation'),
                                            'required' => true,
                                        ])
                                    </div>
                                    @if ($item->hasSecurityQuestion())
                                        <div class="md:col-span-2">
                                            @include('admin/shared/input', [
                                                'name' => 'security_answer',
                                                'label' => $item->securityQuestion->getTranslatedQuestion(),
                                                'help' => __('client.profile.security_question.answer_help'),
                                                'required' => true,
                                            ])
                                        </div>
                                    @endif
                                </div>
                                <div class="mt-4">
                                    <button class="btn btn-primary">
                                        {{ __('global.save') }}
                                    </button>
                                </div>
                            </form>
                        </div>
                        <div class="card">
                            <h4 class="text-lg font-semibold text-gray-800 dark:text-gray-200 mb-2">
                                {{ __($translatePrefix . '.show.login') }}</h4>
                            @include('admin/core/actionslog/usertable', ['logs' => $logs])
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="md:w-1/3">
            <div class="card">
                <h4 class="text-lg font-semibold text-gray-800 dark:text-gray-200 mt-2">
                    {{ __($translatePrefix . '.show.details') }}</h4>
                <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
                    <div>
                        @include('admin/shared/input', [
                            'name' => 'last_ip',
                            'label' => __('admin.customers.show.last_ip'),
                            'value' => old('last_ip', $item->last_login_ip),
                            'disabled' => true,
                        ])
                    </div>
                    <div>
                        @include('admin/shared/input', [
                            'name' => 'last_login',
                            'label' => __('admin.customers.show.last_login'),
                            'value' => old('last_login', $item->last_login),
                            'disabled' => true,
                        ])
                    </div>
                </div>

                <h2 class="text-lg font-semibold text-gray-800 dark:text-gray-200 mt-2">
                    {{ __('client.profile.2fa.title') }}
                </h2>
                @if (!auth('admin')->user()->twoFactorEnabled())
                    <p class="text-sm text-gray-600 dark:text-gray-400">
                        {{ __('client.profile.2fa.info') }}
                    </p>
                @else
                    <p class="text-sm text-gray-600 dark:text-gray-400">
                        {!! __('client.profile.2fa.download_codes', ['url' => route('admin.profile.2fa_codes')]) !!}
                    </p>
                @endif

                <form method="POST" action="{{ route('admin.profile.2fa') }}" class="mt-2">
                    @csrf
                    @if (!auth('admin')->user()->twoFactorEnabled())
                        {!! $qrcode !!}
                        @include('shared/input', [
                            'name' => '2fa',
                            'label' => __('client.profile.2fa.code'),
                            'help' => $code,
                        ])
                    @else
                        @include('shared/input', [
                            'name' => '2fa',
                            'label' => __('client.profile.2fa.code'),
                        ])
                    @endif
                    <button
                        class="btn {{ auth('admin')->user()->twoFactorEnabled() ? 'bg-red-600 text-white' : 'bg-primary text-gray-200' }} mt-4">{{ __(auth('admin')->user()->twoFactorEnabled() ? 'global.delete' : 'global.save') }}</button>
                </form>

                <form method="POST" action="{{ route('admin.profile.2fa_options') }}" class="mt-4">
                    @csrf
                    @include('shared/checkbox', [
                        'name' => '2fa_email_new_ip',
                        'label' => __('client.profile.2fa.email_new_ip'),
                        'checked' => auth('admin')->user()->twoFactorEmailOnNewIpEnabled(),
                    ])
                    <button class="btn btn-secondary mt-3">{{ __('global.save') }}</button>
                </form>

                @php
                    $trustedDevices = auth('admin')->user()->twoFactorTrustedIps();
                    $currentIp = request()->ip();
                @endphp
                <section class="mt-6 border-t border-gray-200 pt-5 dark:border-gray-700"
                         aria-labelledby="admin-trusted-devices-heading">
                    <header class="flex items-baseline justify-between gap-3">
                        <h3 id="admin-trusted-devices-heading"
                            class="text-base font-semibold text-gray-800 dark:text-gray-200">
                            {{ __('client.profile.2fa.trusted_devices_heading') }}
                        </h3>
                        @if (count($trustedDevices) > 0)
                            <form method="POST"
                                  action="{{ route('admin.profile.2fa_trusted_revoke_all') }}"
                                  onsubmit="return confirm('{{ __('client.profile.2fa.trusted_devices_revoke_all') }} ?');">
                                @csrf
                                <button type="submit"
                                        class="text-sm text-red-600 underline-offset-2 hover:underline focus-visible:underline focus-visible:outline-none dark:text-red-400">
                                    {{ __('client.profile.2fa.trusted_devices_revoke_all') }}
                                </button>
                            </form>
                        @endif
                    </header>
                    <p class="mt-1 text-sm text-gray-600 dark:text-gray-400">
                        {{ __('client.profile.2fa.trusted_devices_description') }}
                    </p>

                    @if (count($trustedDevices) === 0)
                        <p class="mt-4 text-sm italic text-gray-500 dark:text-gray-500">
                            {{ __('client.profile.2fa.trusted_devices_empty') }}
                        </p>
                    @else
                        <ul class="mt-4 space-y-2" role="list">
                            @foreach ($trustedDevices as $device)
                                <li class="flex items-center justify-between gap-3 rounded-lg border border-gray-200 bg-white p-3 dark:border-gray-700 dark:bg-gray-800">
                                    <div class="min-w-0 flex-1">
                                        <p class="flex flex-wrap items-center gap-2 text-sm font-medium text-gray-900 dark:text-gray-100">
                                            <span>{{ \App\Support\UserAgentLabel::summarize($device['user_agent']) }}</span>
                                            @if ($device['ip'] === $currentIp)
                                                <span class="inline-flex items-center rounded-full bg-green-100 px-2 py-0.5 text-xs font-medium text-green-800 dark:bg-green-900/40 dark:text-green-300">
                                                    <i class="bi bi-check-circle-fill mr-1" aria-hidden="true"></i>
                                                    {{ __('client.profile.2fa.current_device') }}
                                                </span>
                                            @endif
                                        </p>
                                        <p class="mt-0.5 text-xs text-gray-500 dark:text-gray-400">
                                            <span class="font-mono">{{ $device['ip'] }}</span>
                                            &middot;
                                            @if ($device['until'])
                                                {{ __('client.profile.2fa.trusted_device_expires_at', ['date' => $device['until']]) }}
                                            @else
                                                {{ __('client.profile.2fa.trusted_device_expires_never') }}
                                            @endif
                                        </p>
                                    </div>
                                    <form method="POST"
                                          action="{{ route('admin.profile.2fa_trusted_revoke') }}"
                                          class="flex-shrink-0">
                                        @csrf
                                        <input type="hidden" name="ip" value="{{ $device['ip'] }}">
                                        <button type="submit"
                                                class="inline-flex min-h-[36px] items-center gap-1.5 rounded-md border border-red-300 px-3 py-1.5 text-sm font-medium text-red-700 hover:bg-red-50 focus-visible:ring-2 focus-visible:ring-red-400 focus-visible:outline-none dark:border-red-700 dark:text-red-300 dark:hover:bg-red-900/20"
                                                aria-label="{{ __('client.profile.2fa.trusted_device_revoke') }} {{ $device['ip'] }}">
                                            <i class="bi bi-x-lg" aria-hidden="true"></i>
                                            <span>{{ __('client.profile.2fa.trusted_device_revoke') }}</span>
                                        </button>
                                    </form>
                                </li>
                            @endforeach
                        </ul>
                    @endif
                </section>

                @if ($securityQuestionsEnabled)
                    <h2 class="text-lg font-semibold text-gray-800 dark:text-gray-200 mt-4">
                        {{ __('client.profile.security_question.title') }}
                    </h2>
                    @if ($item->hasSecurityQuestion())
                        <p class="text-sm text-gray-600 dark:text-gray-400 mb-2">
                            {{ __('client.profile.security_question.current') }}:
                            <strong>{{ $item->securityQuestion?->getTranslatedQuestion() }}</strong>
                        </p>
                    @else
                        <form method="POST" action="{{ route('admin.profile.security_question') }}" class="mt-2">
                            @csrf
                            @include('admin/shared/select', [
                                'name' => 'security_question_id',
                                'label' => __('client.profile.security_question.select'),
                                'options' => $securityQuestions,
                                'value' => old('security_question_id', $item->security_question_id),
                                'placeholder' => __('client.profile.security_question.choose'),
                            ])
                            @include('admin/shared/input', [
                                'name' => 'security_answer',
                                'label' => __('client.profile.security_question.answer'),
                                'help' => __('client.profile.security_question.answer_help'),
                            ])
                            @include('shared/password', [
                                'name' => 'currentpassword_sq',
                                'label' => __('client.profile.security.currentpassword'),
                            ])

                            <div class="flex gap-2 mt-4">
                                <button type="submit" class="btn btn-primary">
                                    {{ __('global.save') }}
                                </button>
                            </div>
                        </form>
                    @endif
                @endif

                @if ($item->role->is_admin)
                    <h4 class="text-lg font-semibold text-gray-800 dark:text-gray-200 mt-2">
                        {{ __('permissions.staff_permissions') }}</h4>

                    <h4 class="text-sm text-gray-600 dark:text-gray-400">{{ $item->role->name }} <i
                            class="bi bi-star text-amber-400"></i></h4>
                @endif
                @if ($item->role->permissions->count() > 0)
                    <h4 class="text-lg font-semibold text-gray-800 dark:text-gray-200 mt-2">
                        {{ __('permissions.staff_permissions') }}</h4>
                    <div class="grid grid-cols-2 gap-3">
                        @foreach ($item->role->permissions->chunk(3) as $row)
                            <ul class="space-y-3 text-sm">

                                @foreach ($row as $permission)
                                    <li class="flex space-x-3">
                                        <span
                                            class="size-5 flex justify-center items-center rounded-full bg-blue-50 text-blue-600 dark:bg-blue-800/30 dark:text-blue-500">
                                            <svg class="flex-shrink-0 size-3.5" xmlns="http://www.w3.org/2000/svg"
                                                width="24" height="24" viewBox="0 0 24 24" fill="none"
                                                stroke="currentColor" stroke-width="2" stroke-linecap="round"
                                                stroke-linejoin="round">
                                                <polyline points="20 6 9 17 4 12" />
                                            </svg>
                                        </span>
                                        <span class="text-gray-800 dark:text-gray-400">
                                            {{ $permission->translate() }}
                                        </span>
                                    </li>
                                @endforeach
                            </ul>
                        @endforeach
                    </div>
                @endif
            </div>
            @if (staff_has_permission('admin.show_metadata'))
                <button class="btn btn-secondary w-full text-left mt-2" type="button" data-hs-overlay="#metadata-overlay">
                    <i class="bi bi-database mr-2"></i>
                    {{ __('admin.metadata.title') }}
                </button>
            @endif
        </div>
    </div>
    @include('admin/metadata/overlay', ['item' => $item])

@endsection