Add an application Internal access section that loads the running container hostname (skipped for Compose apps), densify configuration diff and popup-small defaults, dock the server-timing HUD into the mobile top bar, restyle the 2FA challenge with the auth shell, and enforce 16px mobile form fonts to prevent iOS zoom.
82 lines
3.8 KiB
PHP
82 lines
3.8 KiB
PHP
@props([
|
|
'server',
|
|
'proxyStatus' => null,
|
|
'showSentinelStatus' => false,
|
|
])
|
|
|
|
@php
|
|
$serverReady = $server->isFunctional();
|
|
$proxyNeedsAttention = $server->proxySet() && ! in_array($proxyStatus, ['running'], true);
|
|
$sentinelNeedsAttention = $showSentinelStatus && ! $server->isSentinelLive();
|
|
|
|
[$summaryLabel, $summaryType] = match (true) {
|
|
! $serverReady => ['Unavailable', 'error'],
|
|
$proxyNeedsAttention || $sentinelNeedsAttention => ['Attention required', 'warning'],
|
|
default => ['Ready', 'success'],
|
|
};
|
|
@endphp
|
|
|
|
<div class="relative shrink-0" x-data="{ open: false }" @click.outside="open = false"
|
|
@keydown.escape.window="open = false">
|
|
<x-status-badge as="button" dynamic @click="open = !open" x-bind:aria-expanded="open" aria-haspopup="menu"
|
|
class="cursor-pointer">
|
|
<span @class([
|
|
'size-1.5 shrink-0 rounded-full',
|
|
'bg-success' => $summaryType === 'success',
|
|
'bg-warning' => $summaryType === 'warning',
|
|
'bg-error' => $summaryType === 'error',
|
|
])></span>
|
|
<span class="truncate">{{ $summaryLabel }}</span>
|
|
<span class="inline-flex transition-transform" :class="open && 'rotate-180'">
|
|
<x-reicon name="chevron-down" class="size-3 opacity-55" />
|
|
</span>
|
|
</x-status-badge>
|
|
|
|
<div x-cloak x-show="open" x-transition.origin.top.right
|
|
class="listbox-panel top-8! right-0! left-auto! z-[90]! w-64! min-w-64!" role="menu">
|
|
<div class="px-3 py-2 text-[11px] font-medium text-neutral-400 dark:text-fg-faint">System status</div>
|
|
<div class="listbox-option cursor-default! gap-2.5!">
|
|
<span @class([
|
|
'size-1.5 shrink-0 rounded-full',
|
|
'bg-success' => $serverReady,
|
|
'bg-error' => ! $serverReady,
|
|
])></span>
|
|
<span class="flex-1">Server</span>
|
|
<span>{{ $serverReady ? 'Ready' : 'Unavailable' }}</span>
|
|
</div>
|
|
@if ($server->proxySet())
|
|
<div class="listbox-option cursor-default! gap-2.5!">
|
|
<span @class([
|
|
'size-1.5 shrink-0 rounded-full',
|
|
'bg-success' => $proxyStatus === 'running',
|
|
'bg-warning' => in_array($proxyStatus, ['starting', 'restarting', 'stopping'], true),
|
|
'bg-error' => ! in_array($proxyStatus, ['running', 'starting', 'restarting', 'stopping'], true),
|
|
])></span>
|
|
<span class="flex-1">Proxy</span>
|
|
<span>{{ str($proxyStatus ?: 'unknown')->headline() }}</span>
|
|
</div>
|
|
@endif
|
|
@if ($showSentinelStatus)
|
|
<div class="listbox-option cursor-default! gap-2.5!">
|
|
<span class="size-1.5 shrink-0 rounded-full {{ $server->isSentinelLive() ? 'bg-success' : 'bg-error' }}"></span>
|
|
<span class="flex-1">Sentinel</span>
|
|
<span>{{ $server->isSentinelLive() ? 'In sync' : 'Out of sync' }}</span>
|
|
</div>
|
|
@endif
|
|
@if ($server->proxySet())
|
|
<button type="button"
|
|
class="listbox-option justify-start! min-h-0! h-7! gap-1.5! px-2! py-1! text-[11px] text-neutral-500 dark:text-fg-muted"
|
|
wire:click="checkProxyStatus" wire:loading.attr="disabled" wire:target="checkProxyStatus"
|
|
role="menuitem">
|
|
<span class="contents" wire:loading.remove wire:target="checkProxyStatus">
|
|
<x-reicon name="refresh" class="size-2.5 opacity-70" />
|
|
Refresh status
|
|
</span>
|
|
<span class="hidden items-center gap-1.5" wire:loading.flex wire:target="checkProxyStatus">
|
|
<x-loading compact />
|
|
Refreshing status
|
|
</span>
|
|
</button>
|
|
@endif
|
|
</div>
|
|
</div>
|