@extends('layouts.admin')

@section('title', __('Login history'))

@section('content')
    <div class="mb-6">
        <h1 class="text-2xl font-bold text-gray-900 dark:text-white">{{ __('Login history') }}</h1>
        <p class="text-gray-500 dark:text-gray-400 text-sm mt-1">{{ __('Successful logins and failed attempts (web).') }}</p>
    </div>

    <form method="GET" action="{{ route('admin.login-history.index') }}" class="mb-6 flex flex-wrap gap-3 items-end bg-white dark:bg-dark-800 rounded-xl border border-gray-200 dark:border-dark-700 p-4">
        <div>
            <label class="block text-xs font-medium text-gray-500 dark:text-gray-400 mb-1">{{ __('Result') }}</label>
            <select name="success" class="rounded-lg border border-gray-300 dark:border-dark-600 bg-white dark:bg-dark-700 text-sm text-gray-900 dark:text-white px-3 py-2">
                <option value="">{{ __('All') }}</option>
                <option value="1" @selected(request('success') === '1')>{{ __('Success') }}</option>
                <option value="0" @selected(request('success') === '0')>{{ __('Failed') }}</option>
            </select>
        </div>
        <div>
            <label class="block text-xs font-medium text-gray-500 dark:text-gray-400 mb-1">{{ __('User') }}</label>
            <select name="user_id" class="rounded-lg border border-gray-300 dark:border-dark-600 bg-white dark:bg-dark-700 text-sm text-gray-900 dark:text-white px-3 py-2 min-w-[10rem]">
                <option value="">{{ __('All users') }}</option>
                @foreach($users as $u)
                    <option value="{{ $u->id }}" @selected((string)request('user_id') === (string)$u->id)>{{ $u->name }} ({{ $u->email }})</option>
                @endforeach
            </select>
        </div>
        <div>
            <label class="block text-xs font-medium text-gray-500 dark:text-gray-400 mb-1">{{ __('Email / login') }}</label>
            <input type="text" name="identifier" value="{{ request('identifier') }}" placeholder="{{ __('Search…') }}" class="rounded-lg border border-gray-300 dark:border-dark-600 bg-white dark:bg-dark-700 text-sm text-gray-900 dark:text-white px-3 py-2 w-48">
        </div>
        <div>
            <label class="block text-xs font-medium text-gray-500 dark:text-gray-400 mb-1">{{ __('From') }}</label>
            <input type="date" name="from" value="{{ request('from') }}" class="rounded-lg border border-gray-300 dark:border-dark-600 bg-white dark:bg-dark-700 text-sm text-gray-900 dark:text-white px-3 py-2">
        </div>
        <div>
            <label class="block text-xs font-medium text-gray-500 dark:text-gray-400 mb-1">{{ __('To') }}</label>
            <input type="date" name="to" value="{{ request('to') }}" class="rounded-lg border border-gray-300 dark:border-dark-600 bg-white dark:bg-dark-700 text-sm text-gray-900 dark:text-white px-3 py-2">
        </div>
        <button type="submit" class="px-4 py-2 rounded-lg bg-primary-600 hover:bg-primary-700 text-white text-sm font-medium">{{ __('Filter') }}</button>
        <a href="{{ route('admin.login-history.index') }}" class="px-4 py-2 rounded-lg border border-gray-300 dark:border-dark-600 text-sm text-gray-700 dark:text-gray-300">{{ __('Reset') }}</a>
    </form>

    <div class="bg-white dark:bg-dark-800 rounded-xl border border-gray-200 dark:border-dark-700 overflow-hidden">
        <div class="overflow-x-auto">
            <table class="min-w-full text-sm">
                <thead class="bg-gray-50 dark:bg-dark-700/50 text-left text-xs font-semibold text-gray-500 dark:text-gray-400 uppercase tracking-wider">
                    <tr>
                        <th class="px-4 py-3">{{ __('When') }}</th>
                        <th class="px-4 py-3">{{ __('Result') }}</th>
                        <th class="px-4 py-3">{{ __('User') }}</th>
                        <th class="px-4 py-3">{{ __('Identifier') }}</th>
                        <th class="px-4 py-3">{{ __('Note') }}</th>
                        <th class="px-4 py-3">{{ __('IP') }}</th>
                    </tr>
                </thead>
                <tbody class="divide-y divide-gray-200 dark:divide-dark-700">
                    @forelse($histories as $h)
                        <tr class="hover:bg-gray-50 dark:hover:bg-dark-700/30">
                            <td class="px-4 py-3 whitespace-nowrap text-gray-600 dark:text-gray-300">
                                {{ $h->created_at->format('d.m.Y H:i:s') }}
                            </td>
                            <td class="px-4 py-3">
                                @if($h->success)
                                    <span class="text-green-600 dark:text-green-400 font-medium">{{ __('Success') }}</span>
                                @else
                                    <span class="text-red-600 dark:text-red-400 font-medium">{{ __('Failed') }}</span>
                                @endif
                            </td>
                            <td class="px-4 py-3 text-gray-900 dark:text-white">
                                {{ $h->user?->name ?? '—' }}
                            </td>
                            <td class="px-4 py-3 font-mono text-xs text-gray-700 dark:text-gray-300">{{ $h->identifier }}</td>
                            <td class="px-4 py-3 text-gray-500 dark:text-gray-400 text-xs">{{ $h->failure_reason ?? '—' }}</td>
                            <td class="px-4 py-3 font-mono text-xs text-gray-500">{{ $h->ip_address ?? '—' }}</td>
                        </tr>
                    @empty
                        <tr>
                            <td colspan="6" class="px-4 py-12 text-center text-gray-500 dark:text-gray-400">{{ __('No entries found.') }}</td>
                        </tr>
                    @endforelse
                </tbody>
            </table>
        </div>
        @if($histories->hasPages())
            <div class="px-4 py-3 border-t border-gray-200 dark:border-dark-700">
                {{ $histories->links() }}
            </div>
        @endif
    </div>
@endsection
