Developer
109e74db41
Web UI rework. Shared-components slice (drift prevention): - Migrate SectionCard, SelectionRailCard, TabbedCard, MetricCard, DiskSpaceCard, HoverEditButton, DialogFooter, ConfirmDialog, LibraryOverview, NowPlaying, SessionActivityPanel off @mui - HoverEditButton: MUI IconButton + EditOutlined -> Button + lucide Pencil - Status mapping uses the success Badge variant (chart-2) for healthy - Exported APIs preserved so consuming pages still compile (no page edits) - 11 behavioral Vitest component tests added Gate: build + lint + test green.
31 lines
897 B
TypeScript
31 lines
897 B
TypeScript
import { Card, CardContent } from "@/components/ui/card";
|
|
|
|
interface Props {
|
|
label: string;
|
|
value: string;
|
|
subtext?: string;
|
|
}
|
|
|
|
/**
|
|
* Compact metric tile: label / value / optional subtext on the comfortable
|
|
* density ramp (label `text-sm`, value `text-lg font-semibold`, subtext
|
|
* `text-xs text-muted-foreground`). Same exported props as the MUI version.
|
|
*/
|
|
export function MetricCard({ label, value, subtext }: Props) {
|
|
return (
|
|
<Card className="h-full">
|
|
<CardContent className="flex h-full flex-col gap-1.5">
|
|
<span className="text-sm uppercase leading-tight tracking-wide text-muted-foreground">
|
|
{label}
|
|
</span>
|
|
<span className="text-lg font-semibold leading-tight">{value}</span>
|
|
{subtext ? (
|
|
<span className="whitespace-pre-line text-xs leading-relaxed text-muted-foreground">
|
|
{subtext}
|
|
</span>
|
|
) : null}
|
|
</CardContent>
|
|
</Card>
|
|
);
|
|
}
|