construprogress/resources/views/livewire/admin-users.blade.php

<div>

    @if(session('notify'))
        <div class="alert alert-success mb-4">
            <x-heroicon-o-check-circle class="w-5 h-5" />
            {{ session('notify') }}
        </div>
    @endif

    {{-- ── Cabecera ─────────────────────────────────────────────────────────── --}}
    <div class="flex flex-col sm:flex-row sm:items-center gap-3 mb-4">
        <label class="input input-bordered input-sm flex items-center gap-2 flex-1 max-w-sm">
            <x-heroicon-o-magnifying-glass class="w-4 h-4 opacity-50" />
            <input type="text" wire:model.live.debounce.300ms="search"
                   class="grow" placeholder="Buscar por nombre o email…" />
        </label>
        <a href="{{ route('admin.users.create') }}" class="btn btn-primary btn-sm gap-1 shrink-0" wire:navigate>
            <x-heroicon-o-plus class="w-4 h-4" />
            Nuevo usuario
        </a>
    </div>

    {{-- ── Tabla ────────────────────────────────────────────────────────────── --}}
    <div class="overflow-x-auto">
        <table class="table table-zebra w-full">
            <thead>
                <tr>
                    <th>Usuario</th>
                    <th>Rol</th>
                    <th>Verificado</th>
                    <th class="w-24"></th>
                </tr>
            </thead>
            <tbody>
                @forelse($this->users as $u)
                    <tr wire:key="user-{{ $u->id }}">
                        <td>
                            <div class="flex items-center gap-3">
                                <div class="avatar placeholder">
                                    <div class="bg-neutral text-neutral-content rounded-full w-8">
                                        <span class="text-xs">{{ strtoupper(substr($u->name, 0, 1)) }}</span>
                                    </div>
                                </div>
                                <div>
                                    <p class="font-semibold text-sm">{{ $u->name }}</p>
                                    <p class="text-xs text-gray-500">{{ $u->email }}</p>
                                </div>
                            </div>
                        </td>
                        <td>
                            <div class="flex flex-wrap gap-1">
                                @foreach($u->roles as $role)
                                    <span class="badge badge-sm {{ $role->name === 'Admin' ? 'badge-error' : 'badge-primary' }}">
                                        {{ $role->name }}
                                    </span>
                                @endforeach
                                @if($u->roles->isEmpty())
                                    <span class="badge badge-sm badge-ghost">Sin rol</span>
                                @endif
                            </div>
                        </td>
                        <td>
                            @if($u->email_verified_at)
                                <x-heroicon-o-check-circle class="w-5 h-5 text-success" />
                            @else
                                <x-heroicon-o-clock class="w-5 h-5 text-warning" />
                            @endif
                        </td>
                        <td>
                            <div class="flex justify-end gap-1">
                                <a href="{{ route('admin.users.show', $u) }}"
                                   class="btn btn-xs btn-outline" title="Ver" wire:navigate>
                                    <x-heroicon-o-eye class="w-3.5 h-3.5" />
                                </a>
                                <a href="{{ route('admin.users.edit', $u) }}"
                                   class="btn btn-xs btn-outline btn-info" title="Editar" wire:navigate>
                                    <x-heroicon-o-pencil class="w-3.5 h-3.5" />
                                </a>
                                @if($u->id !== auth()->id())
                                    <button wire:click="deleteUser({{ $u->id }})"
                                            wire:confirm="¿Eliminar a '{{ $u->name }}'? Se perderán todos sus datos."
                                            class="btn btn-xs btn-outline btn-error" title="Eliminar">
                                        <x-heroicon-o-trash class="w-3.5 h-3.5" />
                                    </button>
                                @endif
                            </div>
                        </td>
                    </tr>
                @empty
                    <tr>
                        <td colspan="4" class="text-center text-gray-400 py-8">
                            <x-heroicon-o-users class="w-10 h-10 mx-auto mb-1 opacity-25" />
                            <p class="text-sm">No se encontraron usuarios</p>
                        </td>
                    </tr>
                @endforelse
            </tbody>
        </table>
    </div>

</div>