mirror of
https://github.com/Studio-Saelix/sencho.git
synced 2026-08-12 19:57:37 +00:00
refactor(masthead): remove stat-tile hover tooltips (#1319)
Drop the cursor-following hover tooltips from the masthead stat tiles: the RUNNING tile on the Home dashboard (the managed / external / exited breakdown) and the CONTAINERS tile on the Fleet view (the running / total split). Both revert to plain stat tiles, matching the CPU and MEM tiles beside them. The dashboard and fleet docs are updated to match and the orphaned screenshot is removed.
This commit is contained in:
@@ -1,11 +1,5 @@
|
||||
import { useEffect, useMemo, useState } from 'react';
|
||||
import { Bell } from 'lucide-react';
|
||||
import {
|
||||
CursorProvider,
|
||||
Cursor,
|
||||
CursorContainer,
|
||||
CursorFollow,
|
||||
} from '@/components/animate-ui/primitives/animate/cursor';
|
||||
import type { Stats, SystemStats, NotificationItem, HealthLevel } from './types';
|
||||
|
||||
interface HealthStatusBarProps {
|
||||
@@ -153,43 +147,7 @@ export function HealthStatusBar({
|
||||
|
||||
{/* Stats column */}
|
||||
<div className="hidden items-stretch justify-end gap-0 md:flex">
|
||||
<CursorProvider>
|
||||
<CursorContainer>
|
||||
<StatTile label="RUNNING" value={running} tone="value" />
|
||||
</CursorContainer>
|
||||
<Cursor>
|
||||
<span className="h-2 w-2 rounded-full bg-brand" />
|
||||
</Cursor>
|
||||
<CursorFollow
|
||||
side="bottom"
|
||||
sideOffset={8}
|
||||
align="center"
|
||||
transition={{ stiffness: 400, damping: 40, bounce: 0 }}
|
||||
>
|
||||
<div className="rounded-md border border-card-border bg-popover/95 backdrop-blur-[10px] backdrop-saturate-[1.15] px-3 py-2 shadow-md">
|
||||
<div className="flex items-center gap-3 font-mono text-xs tabular-nums">
|
||||
<span className="text-stat-value">
|
||||
{stats.managed}
|
||||
<span className="ml-1 font-sans text-stat-subtitle">managed</span>
|
||||
</span>
|
||||
<span className="text-stat-icon">·</span>
|
||||
<span className="text-stat-value">
|
||||
{stats.unmanaged}
|
||||
<span className="ml-1 font-sans text-stat-subtitle">external</span>
|
||||
</span>
|
||||
{stats.exited > 0 ? (
|
||||
<>
|
||||
<span className="text-stat-icon">·</span>
|
||||
<span className="text-destructive">
|
||||
{stats.exited}
|
||||
<span className="ml-1 font-sans text-stat-subtitle">exited</span>
|
||||
</span>
|
||||
</>
|
||||
) : null}
|
||||
</div>
|
||||
</div>
|
||||
</CursorFollow>
|
||||
</CursorProvider>
|
||||
<StatTile label="RUNNING" value={running} tone="value" />
|
||||
<StatTile label="CPU" value={cpuLabel} tone={parseFloat(systemStats?.cpu.usage || '0') >= 80 ? 'warn' : 'value'} divider />
|
||||
<StatTile label="MEM" value={memLabel} tone="value" divider />
|
||||
</div>
|
||||
|
||||
@@ -1,12 +1,5 @@
|
||||
import { useEffect, useMemo, useState } from 'react';
|
||||
import { Bell } from 'lucide-react';
|
||||
import {
|
||||
CursorProvider,
|
||||
Cursor,
|
||||
CursorContainer,
|
||||
CursorFollow,
|
||||
} from '@/components/animate-ui/primitives/animate/cursor';
|
||||
|
||||
type FleetHealth = 'healthy' | 'degraded' | 'critical';
|
||||
|
||||
interface FleetMastheadProps {
|
||||
@@ -145,40 +138,13 @@ export function FleetMasthead({
|
||||
tone="value"
|
||||
divider
|
||||
/>
|
||||
<CursorProvider>
|
||||
<CursorContainer>
|
||||
<StatTile
|
||||
label="CONTAINERS"
|
||||
value={`${activeContainers}`}
|
||||
sub={`of ${totalContainers} total`}
|
||||
tone="value"
|
||||
divider
|
||||
/>
|
||||
</CursorContainer>
|
||||
<Cursor>
|
||||
<span className="h-2 w-2 rounded-full bg-brand" />
|
||||
</Cursor>
|
||||
<CursorFollow
|
||||
side="bottom"
|
||||
sideOffset={8}
|
||||
align="center"
|
||||
transition={{ stiffness: 400, damping: 40, bounce: 0 }}
|
||||
>
|
||||
<div className="rounded-md border border-card-border bg-popover/95 backdrop-blur-[10px] backdrop-saturate-[1.15] px-3 py-2 shadow-md">
|
||||
<div className="flex items-center gap-3 font-mono text-xs tabular-nums">
|
||||
<span className="text-stat-value">
|
||||
{activeContainers}
|
||||
<span className="ml-1 font-sans text-stat-subtitle">running</span>
|
||||
</span>
|
||||
<span className="text-stat-icon">·</span>
|
||||
<span className="text-stat-value">
|
||||
{totalContainers}
|
||||
<span className="ml-1 font-sans text-stat-subtitle">total</span>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</CursorFollow>
|
||||
</CursorProvider>
|
||||
<StatTile
|
||||
label="CONTAINERS"
|
||||
value={`${activeContainers}`}
|
||||
sub={`of ${totalContainers} total`}
|
||||
tone="value"
|
||||
divider
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="flex items-center gap-2 pl-4">
|
||||
|
||||
Reference in New Issue
Block a user