import { useId, type JSX, type ReactNode } from 'react'
import { useDeckTooltip } from './DeckTooltip'
import { formatRelativeTime } from './format'
export interface ProjectGroupSummary { key: string; label: string; plans: number; running: number; needYou: number; failed: number; lastActivityMs: number | null }
export type ProjectGroupColumnKey = 'label' | 'plans' | 'running' | 'needYou' | 'failed' | 'lastActivityMs'
function MetricChip(props: { value: number; label: string; className?: string }): JSX.Element | null {
if (props.value === 0) return null
return {props.value} {props.label}
}
export function ProjectGroupRow(props: { group: ProjectGroupSummary; expanded: boolean; onToggle(): void; children?: ReactNode }): JSX.Element {
const detailId = useId()
const hasActivity = props.group.lastActivityMs !== null && Number.isFinite(props.group.lastActivityMs)
const absolute = hasActivity ? new Date(props.group.lastActivityMs!).toISOString() : ''
const tooltip = useDeckTooltip(absolute, 'Last recorded project activity')
return {props.group.needYou > 0 && }last activity {hasActivity ? formatRelativeTime(props.group.lastActivityMs!) : '—'}
{props.expanded && {props.children}
}
}