Heatmap

"use client";

import { ChartCard, Heatmap } from "@waveinno/ui";

const HEAT = Array.from({ length: 7 }, (_, d) =>
  Array.from({ length: 24 }, (_, h) => {
    const rush = Math.exp(-((h - 9) ** 2) / 6) * 60 + Math.exp(-((h - 18) ** 2) / 5) * 70;
    const base = h >= 7 && h <= 22 ? 12 : 2;
    return Math.round((base + rush) * (d === 6 ? 0.45 : 1) * (0.85 + ((d * 7 + h) % 5) * 0.06));
  }),
);

export default function HeatmapExample() {
  return (
    <ChartCard title="Entries by hour" height={210}>
      <Heatmap
        rows={["Sat", "Sun", "Mon", "Tue", "Wed", "Thu", "Fri"]}
        columns={Array.from({ length: 24 }, (_, h) => String(h).padStart(2, "0"))}
        values={HEAT}
        showColumnEvery={3}
        format={(v) => `${v} cars`}
      />
    </ChartCard>
  );
}