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