@extends('layouts.admin')
@section('header', 'Users Management')
@section('content')
<div class='p-6'>
    <div class='flex justify-between items-center mb-6'>
        <h1 class='text-2xl font-semibold text-gray-900 dark:text-white'>Users</h1>
        <a href='{{ route("admin.users.create") }}' class='text-white bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:ring-blue-300 font-medium rounded-lg text-sm px-5 py-2.5 dark:bg-blue-600 dark:hover:bg-blue-700 focus:outline-none dark:focus:ring-blue-800'>Add New User</a>
    </div>
    <div class='bg-white dark:bg-gray-800 shadow-md rounded-lg overflow-x-auto'>
        <table class='min-w-full divide-y divide-gray-200 dark:divide-gray-700'>
            <thead class='bg-gray-50 dark:bg-gray-700'>
                <tr>
                    <th scope='col' class='px-6 py-3 text-left text-xs font-medium text-gray-500 dark:text-gray-300 uppercase tracking-wider'>ID</th>
                    <th scope='col' class='px-6 py-3 text-left text-xs font-medium text-gray-500 dark:text-gray-300 uppercase tracking-wider'>Name</th>
                    <th scope='col' class='px-6 py-3 text-left text-xs font-medium text-gray-500 dark:text-gray-300 uppercase tracking-wider'>Email</th>
                    <th scope='col' class='px-6 py-3 text-left text-xs font-medium text-gray-500 dark:text-gray-300 uppercase tracking-wider'>Role</th>
                    <th scope='col' class='px-6 py-3 text-left text-xs font-medium text-gray-500 dark:text-gray-300 uppercase tracking-wider'>Created</th>
                    <th scope='col' class='px-6 py-3 text-left text-xs font-medium text-gray-500 dark:text-gray-300 uppercase tracking-wider'>Actions</th>
                </tr>
            </thead>
            <tbody class='bg-white dark:bg-gray-800 divide-y divide-gray-200 dark:divide-gray-700'>
                @foreach ($users as $user)
                    <tr>
                        <td class='px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900 dark:text-gray-100'>{{ $user->id }}</td>
                        <td class='px-6 py-4 whitespace-nowrap text-sm text-gray-900 dark:text-gray-100'>{{ $user->name }}</td>
                        <td class='px-6 py-4 whitespace-nowrap text-sm text-gray-900 dark:text-gray-100'>{{ $user->email }}</td>
                        <td class='px-6 py-4 whitespace-nowrap text-sm text-gray-900 dark:text-gray-100'>
                            @if($user->is_admin)
                                <span class='px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-purple-100 text-purple-800 dark:bg-purple-700 dark:text-purple-100'>Admin</span>
                            @else
                                <span class='px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-blue-100 text-blue-800 dark:bg-blue-700 dark:text-blue-100'>User</span>
                            @endif
                        </td>
                        <td class='px-6 py-4 whitespace-nowrap text-sm text-gray-500 dark:text-gray-300'>{{ $user->created_at && $user->created_at instanceof \DateTime ? $user->created_at->format("M d, Y") : "N/A" }}</td>
                        <td class='px-6 py-4 whitespace-nowrap text-sm font-medium space-x-2'>
                            <a href='{{ route("admin.users.show", $user->id) }}' class='text-indigo-600 hover:text-indigo-900 dark:text-indigo-400 dark:hover:text-indigo-200'>View</a>
                            <a href='{{ route("admin.users.edit", $user->id) }}' class='text-yellow-600 hover:text-yellow-900 dark:text-yellow-400 dark:hover:text-yellow-200'>Edit</a>
                            <form action='{{ route("admin.users.destroy", $user->id) }}' method='POST' class='inline-block' onsubmit="return confirm('Are you sure you want to delete this user?');">
                                @csrf
                                @method("DELETE")
                                <button type='submit' class='text-red-600 hover:text-red-900 dark:text-red-400 dark:hover:text-red-200'>Delete</button>
                            </form>
                        </td>
                    </tr>
                @endforeach
            </tbody>
        </table>
    </div>
    @if($users->hasPages())
        <div class='mt-6'>
            {{ $users->links() }}
        </div>
    @endif
</div>
@endsection