@props([
    'chats' => [],
    'emptyText' => 'No chats yet. Send a message to someone to see them here.',
    'showEmpty' => true,
])

<div {{ $attributes->merge(['class' => 'user-list user-list2']) }}>
    @forelse($chats as $chat)
        @php $partner = $chat['partner']; @endphp
        <a href="{{ route('gc.dashboard', $partner->id) }}"
           class="user-item chat-list-item"
           data-user-id="{{ $partner->id }}"
           data-conversation-id="{{ $chat['conversation']->id }}"
           data-unread="{{ $chat['unread'] }}"
           data-name="{{ strtolower($partner->name) }}">
            <span class="chat-list-check" aria-hidden="true"><i class="fa-solid fa-check"></i></span>
            <div class="avatar-wrap">
                <img src="{{ $partner->avatarUrl() }}" alt="">
                @if($partner->isOnlineNow())
                    <span class="online-dot"></span>
                @endif
            </div>
            <div class="user-content">
                <div class="user-row">
                    <h4>{{ $partner->name }}</h4>
                    @if($chat['last_message_at'])
                        <time datetime="{{ \App\Support\DateFormat::utcIso($chat['last_message_at']) }}"></time>
                    @endif
                </div>
                <p class="chat-preview">{{ $chat['preview'] ?? 'No messages yet' }}</p>
            </div>
            @if($chat['unread'] > 0)
                <span class="unread-badge">{{ $chat['unread'] }}</span>
            @endif
            @if($chat['pinned'])
                <i class="fa-solid fa-thumbtack pin-icon"></i>
            @endif
        </a>
    @empty
        @if($showEmpty)
            <p class="empty-note user-list2-empty">{{ $emptyText }}</p>
        @endif
    @endforelse
</div>