claude-bot/EJClaw
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(dashboard): trim health view noise

Browse Source
This commit is contained in:
Eyejoker
2026-04-26 23:57:23 +09:00
committed by GitHub
parent e195bf8824
commit 8624c8c122
3 changed files with 73 additions and 52 deletions
Download Patch File Download Diff File Expand all files Collapse all files

64
apps/dashboard/src/App.tsx
View File

@@ -701,15 +701,13 @@ function HealthPanel({
).length;
const healthLevel: HealthLevel =
down > 0 ? 'down' : stale > 0 || ciFailures > 0 ? 'stale' : 'ok';
const affectedServices = serviceLevels.filter((item) => item.level !== 'ok');
return (
<div className="health-board">
<section className={`health-overview health-${healthLevel}`}>
<div>
<span className="eyebrow">{t.health.system}</span>
<strong>{t.health.levels[healthLevel]}</strong>
</div>
<p>{t.health.summary}</p>
<span className="eyebrow">{t.health.system}</span>
<strong>{t.health.levels[healthLevel]}</strong>
</section>
<section className="health-signals" aria-label={t.health.signals}>
@@ -745,32 +743,36 @@ function HealthPanel({
{services.length === 0 ? (
<EmptyState>{t.service.empty}</EmptyState>
) : (
<div className="health-service-list">
{serviceLevels.map(({ service, level, age }) => (
<article className="health-service" key={service.serviceId}>
<div>
<span className="eyebrow">{service.agentType}</span>
<strong>{service.assistantName}</strong>
<small>{service.serviceId}</small>
</div>
<span className={`pill pill-${level}`}>
{t.health.levels[level]}
</span>
<div>
<small>{t.service.updated}</small>
<strong>{formatDate(service.updatedAt, locale)}</strong>
<em>{formatDuration(age, t)}</em>
</div>
<div>
<small>{t.service.rooms}</small>
<strong>
{service.activeRooms}/{service.totalRooms}
</strong>
</div>
</article>
))}
</div>
) : affectedServices.length === 0 ? null : (
<details className="health-service-details">
<summary>
{t.health.affectedServices}
<strong>{affectedServices.length}</strong>
</summary>
<div className="health-service-list">
{affectedServices.map(({ service, level, age }) => (
<article className="health-service" key={service.serviceId}>
<div>
<strong>{service.assistantName || service.serviceId}</strong>
</div>
<span className={`pill pill-${level}`}>
{t.health.levels[level]}
</span>
<div>
<small>{t.service.updated}</small>
<strong>{formatDate(service.updatedAt, locale)}</strong>
<em>{formatDuration(age, t)}</em>
</div>
<div>
<small>{t.service.rooms}</small>
<strong>
{service.activeRooms}/{service.totalRooms}
</strong>
</div>
</article>
))}
</div>
</details>
)}
</div>
);

16
apps/dashboard/src/i18n.ts
View File

@@ -65,13 +65,13 @@ export interface Messages {
};
health: {
system: string;
summary: string;
signals: string;
services: string;
fresh: string;
stale: string;
queue: string;
ciFailures: string;
affectedServices: string;
levels: {
ok: string;
stale: string;
@@ -259,13 +259,13 @@ export const messages = {
},
health: {
system: '시스템',
summary: '헬스는 heartbeat, 큐, CI 실패를 합산합니다.',
signals: '헬스 신호',
services: '서비스',
fresh: '정상 heartbeat',
fresh: '정상',
stale: '지연',
queue: '큐',
ciFailures: 'CI 실패',
affectedServices: '이상 서비스',
levels: {
ok: '정상',
stale: '주의',
@@ -437,13 +437,13 @@ export const messages = {
},
health: {
system: 'System',
summary: 'Health combines heartbeat, queue, and CI failures.',
signals: 'Health signals',
services: 'Services',
fresh: 'fresh heartbeat',
fresh: 'Fresh',
stale: 'stale',
queue: 'Queue',
ciFailures: 'CI failures',
affectedServices: 'Affected services',
levels: {
ok: 'OK',
stale: 'Watch',
@@ -615,13 +615,13 @@ export const messages = {
},
health: {
system: '系统',
summary: '健康状态汇总心跳、队列和 CI 失败。',
signals: '健康信号',
services: '服务',
fresh: '心跳正常',
stale: '延迟',
queue: '队列',
ciFailures: 'CI 失败',
affectedServices: '异常服务',
levels: {
ok: '正常',
stale: '关注',
@@ -793,13 +793,13 @@ export const messages = {
},
health: {
system: 'システム',
summary: '状態はハートビート、キュー、CI失敗を集計します。',
signals: '状態シグナル',
services: 'サービス',
fresh: '正常ハートビート',
fresh: '正常',
stale: '遅延',
queue: 'キュー',
ciFailures: 'CI失敗',
affectedServices: '異常サービス',
levels: {
ok: '正常',
stale: '注意',

45
apps/dashboard/src/styles.css
View File

@@ -813,7 +813,8 @@ progress::-moz-progress-bar {
.health-signals div,
.health-overview,
.inbox-card,
.health-service {
.health-service,
.health-service-details {
border: 1px solid rgba(43, 55, 38, 0.1);
border-radius: 18px;
background: rgba(255, 250, 240, 0.64);
@@ -954,23 +955,17 @@ progress::-moz-progress-bar {
}
.health-overview {
display: grid;
grid-template-columns: minmax(0, 0.42fr) minmax(0, 1fr);
gap: 14px;
display: flex;
gap: 10px;
align-items: center;
padding: 16px;
justify-content: space-between;
padding: 11px 12px;
}
.health-overview strong {
display: block;
margin-top: 4px;
font-size: clamp(24px, 3vw, 40px);
letter-spacing: -0.05em;
}
.health-overview p {
margin: 0;
color: var(--muted);
font-size: clamp(20px, 2vw, 28px);
letter-spacing: -0.04em;
}
.health-down {
@@ -986,6 +981,30 @@ progress::-moz-progress-bar {
gap: 8px;
}
.health-service-details {
padding: 10px;
}
.health-service-details summary {
display: flex;
min-height: 34px;
cursor: pointer;
align-items: center;
justify-content: space-between;
color: var(--bg-ink);
font-size: 13px;
font-weight: 900;
list-style: none;
}
.health-service-details summary::-webkit-details-marker {
display: none;
}
.health-service-details[open] summary {
margin-bottom: 8px;
}
.health-service {
grid-template-columns: minmax(0, 1.2fr) auto minmax(0, 0.9fr) minmax(
64px,