remco/EpicNext-Cms
1
1 Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

style: format code with prettier
Local Build and Deploy / deploy (push) Successful in 49s
Details

Browse Source
This commit is contained in:
openhands committed 2026-07-12 21:07:34 +02:00
1 parent e85e4d74ea
commit 2e4ed76121
378 files changed
+22404 -20686
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

src/components/admin/peak-hours-heatmap.tsx
+19 -23
View File
@@ -1,24 +1,24 @@
'use client'
"use client";
import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'
import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from '@/components/ui/tooltip'
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "@/components/ui/tooltip";
interface PeakHoursData {
/** [dayOfWeek (0=Mon..6=Sun)][hour (0..23)] = count */
grid: number[][]
max: number
grid: number[][];
max: number;
}
const DAYS = ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
const HOURS = Array.from({ length: 24 }, (_, i) => i)
const DAYS = ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"];
const HOURS = Array.from({ length: 24 }, (_, i) => i);
function getColor(value: number, max: number) {
if (max === 0 || value === 0) return 'bg-muted'
const ratio = value / max
if (ratio < 0.25) return 'bg-[var(--admin-success)]/20'
if (ratio < 0.5) return 'bg-[var(--admin-success)]/55'
if (ratio < 0.75) return 'bg-[var(--admin-success)] dark:bg-[var(--admin-success)]'
return 'bg-[var(--admin-success-strong,var(--admin-success))]'
if (max === 0 || value === 0) return "bg-muted";
const ratio = value / max;
if (ratio < 0.25) return "bg-[var(--admin-success)]/20";
if (ratio < 0.5) return "bg-[var(--admin-success)]/55";
if (ratio < 0.75) return "bg-[var(--admin-success)] dark:bg-[var(--admin-success)]";
return "bg-[var(--admin-success-strong,var(--admin-success))]";
}
export function PeakHoursHeatmap({ data }: { data: PeakHoursData }) {
@@ -26,9 +26,7 @@ export function PeakHoursHeatmap({ data }: { data: PeakHoursData }) {
<Card>
<CardHeader className="pb-2">
<CardTitle className="text-sm font-medium">Peak Hours</CardTitle>
<p className="text-xs text-muted-foreground">
User activity by day &amp; hour (last 7 days)
</p>
<p className="text-xs text-muted-foreground">User activity by day &amp; hour (last 7 days)</p>
</CardHeader>
<CardContent>
<div className="overflow-x-auto">
@@ -37,19 +35,17 @@ export function PeakHoursHeatmap({ data }: { data: PeakHoursData }) {
<div className="flex gap-px ml-10 mb-1">
{HOURS.map((h) => (
<div key={h} className="flex-1 text-center text-[10px] text-muted-foreground">
{h % 3 === 0 ? `${h}` : ''}
{h % 3 === 0 ? `${h}` : ""}
</div>
))}
</div>
{/* Rows */}
{DAYS.map((day, dayIdx) => (
<div key={day} className="flex items-center gap-px mb-px">
<span className="w-10 text-xs text-muted-foreground text-right pr-2 shrink-0">
{day}
</span>
<span className="w-10 text-xs text-muted-foreground text-right pr-2 shrink-0">{day}</span>
<TooltipProvider delayDuration={0}>
{HOURS.map((hour) => {
const count = data.grid[dayIdx]?.[hour] ?? 0
const count = data.grid[dayIdx]?.[hour] ?? 0;
return (
<Tooltip key={hour}>
<TooltipTrigger asChild>
@@ -61,7 +57,7 @@ export function PeakHoursHeatmap({ data }: { data: PeakHoursData }) {
{day} {hour}:00 — {count} users
</TooltipContent>
</Tooltip>
)
);
})}
</TooltipProvider>
</div>
@@ -80,5 +76,5 @@ export function PeakHoursHeatmap({ data }: { data: PeakHoursData }) {
</div>
</CardContent>
</Card>
)
);
}