mirror of
https://github.com/tiennm99/coolify.git
synced 2026-10-27 14:19:27 +00:00
Andras Bacsai
85613b01ba
Move proxy, sentinel, resources, and terminal into the server sidebar with nested routes and icons; extract navbar status into a shared status-summary component; add full-width service links and compact loading support.
81 lines
3.7 KiB
PHP
81 lines
3.7 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! gap-2.5!" 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-3 opacity-70" />
|
|
Refresh status
|
|
</span>
|
|
<span class="hidden items-center gap-2.5" wire:loading.flex wire:target="checkProxyStatus">
|
|
<x-loading compact />
|
|
Refreshing status
|
|
</span>
|
|
</button>
|
|
@endif
|
|
</div>
|
|
</div>
|