feat(ui): add "Initialisierung" (pending) server status
New `pending` status renders cyan (dot + pill, soft ping) instead of red, for freshly created servers that have not been contacted yet. Wired into the status-pill/dot components, the fleet list, and server-item, with a bilingual `servers.status_pending` label. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>feat/v1-foundation
parent
e26921f33a
commit
615f440515
|
|
@ -10,6 +10,7 @@ return [
|
|||
'status_online' => 'Online',
|
||||
'status_warning' => 'Warnung',
|
||||
'status_offline' => 'Offline',
|
||||
'status_pending' => 'Initialisierung',
|
||||
|
||||
// ── Index: header ─────────────────────────────────────────────────────
|
||||
'fleet_eyebrow' => 'Flotte',
|
||||
|
|
|
|||
|
|
@ -10,6 +10,7 @@ return [
|
|||
'status_online' => 'Online',
|
||||
'status_warning' => 'Warning',
|
||||
'status_offline' => 'Offline',
|
||||
'status_pending' => 'Initializing',
|
||||
|
||||
// ── Index: header ─────────────────────────────────────────────────────
|
||||
'fleet_eyebrow' => 'Fleet',
|
||||
|
|
|
|||
|
|
@ -1,9 +1,9 @@
|
|||
@props(['name', 'ip', 'status' => 'online', 'cpu' => 0, 'mem' => 0, 'os' => null])
|
||||
@php
|
||||
$label = ['online' => __('common.online'), 'warning' => __('common.warning'), 'offline' => __('common.offline')][$status] ?? ucfirst($status);
|
||||
$label = ['online' => __('common.online'), 'warning' => __('common.warning'), 'offline' => __('common.offline'), 'pending' => __('servers.status_pending')][$status] ?? ucfirst($status);
|
||||
@endphp
|
||||
<a href="#" class="flex items-center gap-3 rounded-md border border-line bg-inset px-3 py-2.5 transition-colors hover:border-line-strong">
|
||||
<x-status-dot :status="$status" :ping="$status === 'online'" />
|
||||
<x-status-dot :status="$status" :ping="in_array($status, ['online', 'pending'], true)" />
|
||||
<div class="min-w-0 flex-1">
|
||||
<p class="truncate text-sm text-ink">{{ $name }}</p>
|
||||
<p class="truncate font-mono text-[11px] text-ink-3">{{ $ip }}@if ($os) · {{ $os }}@endif</p>
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
@props(['status' => 'offline', 'ping' => false])
|
||||
@php
|
||||
$c = ['online' => 'bg-online', 'warning' => 'bg-warning', 'offline' => 'bg-offline'][$status] ?? 'bg-ink-4';
|
||||
$glow = ['online' => 'shadow-[0_0_6px_var(--color-online)]', 'warning' => 'shadow-[0_0_5px_var(--color-warning)]'][$status] ?? '';
|
||||
$c = ['online' => 'bg-online', 'warning' => 'bg-warning', 'offline' => 'bg-offline', 'pending' => 'bg-cyan'][$status] ?? 'bg-ink-4';
|
||||
$glow = ['online' => 'shadow-[0_0_6px_var(--color-online)]', 'warning' => 'shadow-[0_0_5px_var(--color-warning)]', 'pending' => 'shadow-[0_0_5px_var(--color-cyan)]'][$status] ?? '';
|
||||
@endphp
|
||||
<span {{ $attributes->merge(['class' => 'relative inline-flex h-2 w-2 shrink-0']) }}>
|
||||
@if ($ping)
|
||||
|
|
|
|||
|
|
@ -4,9 +4,10 @@
|
|||
'online' => 'text-online border-online/20 bg-online/10',
|
||||
'warning' => 'text-warning border-warning/20 bg-warning/10',
|
||||
'offline' => 'text-offline border-offline/20 bg-offline/10',
|
||||
'pending' => 'text-cyan border-cyan/20 bg-cyan/10',
|
||||
][$status] ?? 'text-ink-3 border-line bg-line';
|
||||
@endphp
|
||||
<span {{ $attributes->merge(['class' => "inline-flex items-center gap-1.5 rounded-sm border px-2 py-0.5 font-mono text-xs $c"]) }}>
|
||||
<x-status-dot :status="$status" :ping="$status === 'online'" />
|
||||
<x-status-dot :status="$status" :ping="in_array($status, ['online', 'pending'], true)" />
|
||||
{{ $slot }}
|
||||
</span>
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
@php
|
||||
$label = ['online' => __('servers.status_online'), 'warning' => __('servers.status_warning'), 'offline' => __('servers.status_offline')];
|
||||
$label = ['online' => __('servers.status_online'), 'warning' => __('servers.status_warning'), 'offline' => __('servers.status_offline'), 'pending' => __('servers.status_pending')];
|
||||
@endphp
|
||||
|
||||
<div class="space-y-4">
|
||||
|
|
@ -56,7 +56,7 @@
|
|||
wire:navigate
|
||||
class="flex min-h-11 items-center gap-3 px-4 py-3 transition-colors hover:bg-raised sm:px-5"
|
||||
>
|
||||
<x-status-dot :status="$server->status" :ping="$server->status === 'online'" />
|
||||
<x-status-dot :status="$server->status" :ping="in_array($server->status, ['online', 'pending'], true)" />
|
||||
|
||||
<div class="min-w-0 flex-1">
|
||||
<p class="truncate text-sm text-ink">{{ $server->name }}</p>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,22 @@
|
|||
<?php
|
||||
|
||||
namespace Tests\Feature;
|
||||
|
||||
use Illuminate\Support\Facades\Blade;
|
||||
use Tests\TestCase;
|
||||
|
||||
class StatusComponentTest extends TestCase
|
||||
{
|
||||
public function test_pending_pill_uses_cyan_tone(): void
|
||||
{
|
||||
$html = Blade::render('<x-status-pill status="pending">Init</x-status-pill>');
|
||||
$this->assertStringContainsString('text-cyan', $html);
|
||||
$this->assertStringContainsString('bg-cyan/10', $html);
|
||||
}
|
||||
|
||||
public function test_pending_dot_uses_cyan(): void
|
||||
{
|
||||
$html = Blade::render('<x-status-dot status="pending" :ping="true" />');
|
||||
$this->assertStringContainsString('bg-cyan', $html);
|
||||
}
|
||||
}
|
||||
Loading…
Reference in New Issue