Virtnet.bond/extensions/Servers/Proxmox/views/components/ui/server-status.blade.php

{{--
    Server Status Indicator Component - LucentUI Theme
    Migrated from AdminLTE to Tailwind
    
    Usage:
    <x-proxmox::ui.server-status status="running" />
    <x-proxmox::ui.server-status status="stopped" showLabel />
    <x-proxmox::ui.server-status status="running" minimal />
--}}

@props([
    'status',
    'showLabel' => true,
    'size' => 'md',
    'minimal' => false,
])

@php
    $statusConfig = [
        'running' => [
            'color' => 'success',
            'label' => 'Running',
            'pulse' => true,
        ],
        'stopped' => [
            'color' => 'muted',
            'label' => 'Stopped',
            'pulse' => false,
        ],
        'paused' => [
            'color' => 'warning',
            'label' => 'Paused',
            'pulse' => false,
        ],
        'suspended' => [
            'color' => 'warning',
            'label' => 'Suspended',
            'pulse' => false,
        ],
        'migrating' => [
            'color' => 'info',
            'label' => 'Migrating',
            'pulse' => true,
        ],
        'starting' => [
            'color' => 'info',
            'label' => 'Starting',
            'pulse' => true,
        ],
        'stopping' => [
            'color' => 'warning',
            'label' => 'Stopping',
            'pulse' => true,
        ],
        'unknown' => [
            'color' => 'danger',
            'label' => 'Unknown',
            'pulse' => false,
        ],
    ];
    
    $config = $statusConfig[strtolower($status)] ?? $statusConfig['unknown'];
    
    $colorClasses = [
        'success' => 'text-success',
        'warning' => 'text-yellow-600 dark:text-yellow-400',
        'danger' => 'text-error',
        'info' => 'text-info',
        'muted' => 'text-secondary dark:text-gray-400',
    ];
    
    $bgClasses = [
        'success' => 'bg-success/10',
        'warning' => 'bg-warning/15',
        'danger' => 'bg-error/10',
        'info' => 'bg-info/10',
        'muted' => 'bg-neutral/20 dark:bg-gray-700',
    ];
    
    $dotClasses = [
        'success' => 'bg-success',
        'warning' => 'bg-warning',
        'danger' => 'bg-error',
        'info' => 'bg-info',
        'muted' => 'bg-neutral',
    ];
    
    $sizeClasses = [
        'sm' => 'text-xs px-2 py-1',
        'md' => 'text-xs px-2.5 py-1.5',
        'lg' => 'text-sm px-3 py-2',
    ];
    
    $dotSizeClasses = [
        'sm' => 'w-1.5 h-1.5',
        'md' => 'w-2 h-2',
        'lg' => 'w-2.5 h-2.5',
    ];
@endphp

@if($minimal)
    {{-- Minimal dot-only variant --}}
    <div 
        {{ $attributes->class(['inline-flex items-center', $showLabel ? 'gap-1.5' : '']) }}
    >
        <span class="relative flex {{ $dotSizeClasses[$size] ?? $dotSizeClasses['md'] }}">
            @if($config['pulse'])
                <span class="absolute inline-flex w-full h-full rounded-full {{ $dotClasses[$config['color']] ?? $dotClasses['muted'] }} opacity-60 animate-ping"></span>
            @endif
            <span class="relative inline-flex rounded-full {{ $dotSizeClasses[$size] ?? $dotSizeClasses['md'] }} {{ $dotClasses[$config['color']] ?? $dotClasses['muted'] }}"></span>
        </span>
        @if($showLabel)
            <span class="font-medium {{ $colorClasses[$config['color']] ?? $colorClasses['muted'] }}">{{ $config['label'] }}</span>
        @endif
    </div>
@else
    {{-- Full badge variant --}}
    <div 
        {{ $attributes->class([
            'inline-flex items-center gap-2 font-medium rounded-full',
            $bgClasses[$config['color']] ?? $bgClasses['muted'],
            $colorClasses[$config['color']] ?? $colorClasses['muted'],
            $sizeClasses[$size] ?? $sizeClasses['md'],
        ]) }}
    >
        <span class="relative flex {{ $dotSizeClasses[$size] ?? $dotSizeClasses['md'] }}">
            @if($config['pulse'])
                <span class="absolute inline-flex w-full h-full rounded-full bg-current opacity-60 animate-ping"></span>
            @endif
            <span class="relative inline-flex rounded-full {{ $dotSizeClasses[$size] ?? $dotSizeClasses['md'] }} bg-current"></span>
        </span>
        @if($showLabel)
            <span>{{ $config['label'] }}</span>
        @endif
    </div>
@endif