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

{{--
    Server Status Indicator Component - shadcn-style
    
    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-warning',
        'danger' => 'text-danger',
        'info' => 'text-info',
        'muted' => 'text-muted-foreground',
    ];
    
    $bgClasses = [
        'success' => 'bg-success/10',
        'warning' => 'bg-warning/10',
        'danger' => 'bg-danger/10',
        'info' => 'bg-info/10',
        'muted' => 'bg-muted',
    ];
    
    $dotColorClasses = [
        'success' => 'bg-success',
        'warning' => 'bg-warning',
        'danger' => 'bg-danger',
        'info' => 'bg-info',
        'muted' => 'bg-muted-foreground',
    ];
    
    $sizeClasses = [
        'sm' => 'text-xs px-2 py-1 gap-1.5',
        'md' => 'text-sm px-2.5 py-1.5 gap-2',
        'lg' => 'text-base px-3 py-2 gap-2',
    ];
    
    $dotSizes = [
        'sm' => 'size-1.5',
        'md' => 'size-2',
        'lg' => 'size-2.5',
    ];
    
    $textSizes = [
        'sm' => 'text-xs',
        'md' => 'text-sm',
        'lg' => 'text-base',
    ];
@endphp

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