feat(ux): Hostname in Sidebar + CPU-Anzahl neben Load Average
- Sidebar: Hostname unter der Versionsnummer (aus /system/health); 10px, gedimmt — beim Verwalten mehrerer Boxen sofort erkennbar - /system/resources: neues Feld num_cpus (via runtime.NumCPU) - Dashboard Resources-Card: Load-Average-Label zeigt "(N CPU)" — 1.80 auf 1 CPU ist saturiert, auf 4 CPUs ist es harmlos Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -112,13 +112,16 @@ export default function Sidebar({ isOpen, onClose }: SidebarProps) {
|
||||
queryKey: ['system', 'health'],
|
||||
queryFn: async () => {
|
||||
const r = await apiClient.get('/system/health')
|
||||
return isEnvelope(r.data) ? (r.data.data as { version?: string }) : { version: '' }
|
||||
return isEnvelope(r.data)
|
||||
? (r.data.data as { version?: string; hostname?: string })
|
||||
: { version: '' }
|
||||
},
|
||||
refetchInterval: 60_000,
|
||||
refetchOnWindowFocus: true,
|
||||
staleTime: 30_000,
|
||||
})
|
||||
const version = health?.version || '…'
|
||||
const version = health?.version || '…'
|
||||
const hostname = health?.hostname || null
|
||||
|
||||
return (
|
||||
<nav className={`sidebar${isOpen ? ' open' : ''}`}>
|
||||
@@ -162,7 +165,14 @@ export default function Sidebar({ isOpen, onClose }: SidebarProps) {
|
||||
</div>
|
||||
))}
|
||||
|
||||
<div className="sidebar-version">v{version}</div>
|
||||
<div className="sidebar-version">
|
||||
{hostname && (
|
||||
<div style={{ fontSize: 10, opacity: 0.6, marginBottom: 2, overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap' }}>
|
||||
{hostname}
|
||||
</div>
|
||||
)}
|
||||
v{version}
|
||||
</div>
|
||||
</nav>
|
||||
)
|
||||
}
|
||||
|
||||
@@ -89,6 +89,7 @@ interface ServiceStatus {
|
||||
}
|
||||
interface Resources {
|
||||
load_avg_1: number; load_avg_5: number; load_avg_15: number
|
||||
num_cpus?: number
|
||||
mem_total_kb: number; mem_avail_kb: number; mem_used_pct: number
|
||||
disk_total_gb: number; disk_free_gb: number; disk_used_pct: number
|
||||
conntrack_count: number; conntrack_max: number
|
||||
@@ -664,7 +665,10 @@ function ResourcesCard({ r }: { r?: Resources | null }) {
|
||||
<Card size="small">
|
||||
<Row gutter={[16, 8]}>
|
||||
<Col xs={12} sm={6} md={4}>
|
||||
<Text type="secondary" style={{ fontSize: 11, textTransform: 'uppercase' }}>{t('dashboard.resCard.load')}</Text>
|
||||
<Text type="secondary" style={{ fontSize: 11, textTransform: 'uppercase' }}>
|
||||
{t('dashboard.resCard.load')}
|
||||
{r.num_cpus != null && <span style={{ fontWeight: 400, opacity: 0.7 }}> ({r.num_cpus} CPU)</span>}
|
||||
</Text>
|
||||
<div style={{ fontSize: 18, fontWeight: 600 }}>
|
||||
{r.load_avg_1.toFixed(2)} / {r.load_avg_5.toFixed(2)} / {r.load_avg_15.toFixed(2)}
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user