bing
4adafa1936
Add P7 Cytoscape relationship graph with setting CRUD, P9 cockpit analytics driven by writing_sessions, chapter POV selection, and full test coverage. Co-authored-by: Cursor <cursoragent@cursor.com>
24 lines
606 B
TypeScript
24 lines
606 B
TypeScript
interface HourlyHeatmapProps {
|
|
data: number[]
|
|
testId?: string
|
|
}
|
|
|
|
export function HourlyHeatmap({ data, testId }: HourlyHeatmapProps): React.JSX.Element {
|
|
const max = Math.max(...data, 1)
|
|
return (
|
|
<div className="hourly-heatmap" data-testid={testId}>
|
|
{data.map((value, hour) => (
|
|
<div
|
|
key={hour}
|
|
className="hourly-heatmap-cell"
|
|
title={`${hour}:00`}
|
|
style={{
|
|
opacity: value > 0 ? 0.35 + (value / max) * 0.65 : 0.2,
|
|
background: value > 0 ? 'var(--accent)' : undefined
|
|
}}
|
|
/>
|
|
))}
|
|
</div>
|
|
)
|
|
}
|