fix(web): до первого ответа метрик показывать прочерк вместо нулей
Ноль — такое же значение нагрузки, поэтому до прихода первой порции данных индикаторы и блоки диска показывают «—», а не 0 %: иначе интерфейс мигал нулевой нагрузкой при открытии раздела.
This commit is contained in:
@@ -18,6 +18,8 @@ export function InstanceDashboard({ state }: InstanceDashboardProps) {
|
||||
const { t, i18n } = useTranslation();
|
||||
const locale = i18n.resolvedLanguage ?? 'ru';
|
||||
const metrics = state.metrics;
|
||||
// До первого ответа показываем прочерк, а не нули: ноль — это тоже значение.
|
||||
const pending = metrics === undefined ? '—' : undefined;
|
||||
|
||||
return (
|
||||
<Card data-testid="instance-dashboard">
|
||||
@@ -33,20 +35,28 @@ export function InstanceDashboard({ state }: InstanceDashboardProps) {
|
||||
testId="gauge-cpu"
|
||||
value={metrics?.cpu.percent ?? 0}
|
||||
label={t('settings.instance.dashboard.cpu')}
|
||||
display={formatPercent(metrics?.cpu.percent ?? 0, locale)}
|
||||
caption={t('settings.instance.dashboard.cpuCaption', {
|
||||
count: Math.round(metrics?.cpu.cores ?? 0),
|
||||
})}
|
||||
display={pending ?? formatPercent(metrics?.cpu.percent ?? 0, locale)}
|
||||
caption={
|
||||
metrics === undefined
|
||||
? undefined
|
||||
: t('settings.instance.dashboard.cpuCaption', {
|
||||
count: Math.round(metrics.cpu.cores),
|
||||
})
|
||||
}
|
||||
/>
|
||||
<Gauge
|
||||
testId="gauge-memory"
|
||||
value={metrics?.memory.percent ?? 0}
|
||||
label={t('settings.instance.dashboard.memory')}
|
||||
display={formatPercent(metrics?.memory.percent ?? 0, locale)}
|
||||
caption={`${formatBytes(metrics?.memory.used_bytes ?? 0, locale)} / ${formatBytes(
|
||||
metrics?.memory.total_bytes ?? 0,
|
||||
display={pending ?? formatPercent(metrics?.memory.percent ?? 0, locale)}
|
||||
caption={
|
||||
metrics === undefined
|
||||
? undefined
|
||||
: `${formatBytes(metrics.memory.used_bytes, locale)} / ${formatBytes(
|
||||
metrics.memory.total_bytes,
|
||||
locale,
|
||||
)}`}
|
||||
)}`
|
||||
}
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -54,10 +64,14 @@ export function InstanceDashboard({ state }: InstanceDashboardProps) {
|
||||
{/* Подписи не показываем: они раскрываются при наведении на значение. */}
|
||||
<DiskStat
|
||||
testId="disk-usage"
|
||||
value={`${formatBytes(metrics?.disk.used_bytes ?? 0, locale)} / ${formatBytes(
|
||||
metrics?.disk.total_bytes ?? 0,
|
||||
value={
|
||||
metrics === undefined
|
||||
? '— / —'
|
||||
: `${formatBytes(metrics.disk.used_bytes, locale)} / ${formatBytes(
|
||||
metrics.disk.total_bytes,
|
||||
locale,
|
||||
)}`}
|
||||
)}`
|
||||
}
|
||||
title={t('settings.instance.dashboard.diskHint', {
|
||||
free: formatBytes(metrics?.disk.free_bytes ?? 0, locale),
|
||||
})}
|
||||
|
||||
Reference in New Issue
Block a user