@props(['comments' => []])
<div data-is-loading="true" class="comments-container mt-2 space-y-2 max-h-40 overflow-y-auto data-[is-loading=true]:h-10">
    @forelse($comments as $comment)
        <x-dashboard.user.deal-comment.item :comment="$comment"/>
    @empty
        <div class="rounded-lg bg-white border border-gray-200 py-2 px-3">
            <p class="text-center text-accent-600">No comments posted !</p>
        </div>
    @endforelse
</div>