26 lines
1,010 B
TypeScript
26 lines
1,010 B
TypeScript
|
'use client';
|
|||
|
|
|
|||
|
|
/* EngagementSummaryCard — phase 07 (ENG-03).
|
|||
|
|
* Purpose: Single summary card with big number + label, stacked single-column.
|
|||
|
|
* Used 4× on the page: Active users, Total Graph hours, Total Autotask hours, Hours / active user (D-08).
|
|||
|
|
* Card has no shadow, only border (matches FinanceRow density per D-10).
|
|||
|
|
* Props: value (display string), label (display string). */
|
|||
|
|
|
|||
|
|
import { Card, CardContent } from '@/components/ui/card';
|
|||
|
|
|
|||
|
|
export interface EngagementSummaryCardProps {
|
|||
|
|
value: string; // pre-formatted: "42", "128.5h", "—"
|
|||
|
|
label: string; // "Active users", "Total Graph hours", etc.
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
export function EngagementSummaryCard({ value, label }: EngagementSummaryCardProps) {
|
|||
|
|
return (
|
|||
|
|
<Card className="py-0 shadow-none">
|
|||
|
|
<CardContent className="px-4 py-4">
|
|||
|
|
<p className="text-2xl font-semibold text-foreground leading-none">{value}</p>
|
|||
|
|
<p className="text-xs text-muted-foreground mt-2">{label}</p>
|
|||
|
|
</CardContent>
|
|||
|
|
</Card>
|
|||
|
|
);
|
|||
|
|
}
|