@php use App\Enums\ConnectionStatusEnum; @endphp
@props(['status'])
@php
    if (!$status instanceof ConnectionStatusEnum){
        $status = ConnectionStatusEnum::tryFrom($status);
    }
@endphp

<div class="flex gap-x-2 items-center text-sm">
    <div
        @class([
        "w-2 h-2 rounded-full",
        'bg-green-400' => $status === ConnectionStatusEnum::Connected,
        'bg-gray-400' => $status === ConnectionStatusEnum::Disconnected,
        'bg-yellow-400' => $status === ConnectionStatusEnum::Pending,
        'bg-red-400' => $status === ConnectionStatusEnum::Error,
        ])
    ></div>
    {{ $status->name }}
</div>