<?php
 
$source = $data['source'] ?? 'views';
$values = $data['values'] ?? [];
$labels = $data['labels'] ?? [];
$total = array_sum($values);
$max = !empty($values) ? max($values) : 0;
$min = !empty($values) ? min($values) : 0;
$avg = !empty($values) ? round(array_sum($values) / count($values)) : 0;
$today = !empty($values) ? end($values) : 0;
$yesterday = count($values) >= 2 ? $values[count($values) - 2] : 0;
$trend = ($yesterday > 0) ? round(($today - $yesterday) / $yesterday * 100) : 0;
$sourceLabel = $source === 'views' ? 'views' : 'uploads';
?>


<div class="grid grid-cols-4 gap-2 mb-3">
    <div class="text-center p-2 rounded-lg bg-blue-50/60">
        <div class="text-sm font-bold text-blue-700"><?= number_format($today) ?></div>
        <div class="text-[9px] text-blue-400 uppercase">Today</div>
    </div>
    <div class="text-center p-2 rounded-lg bg-gray-50">
        <div class="text-sm font-bold text-gray-700"><?= number_format($avg) ?></div>
        <div class="text-[9px] text-gray-400 uppercase">Avg/day</div>
    </div>
    <div class="text-center p-2 rounded-lg bg-gray-50">
        <div class="text-sm font-bold text-gray-700"><?= number_format($max) ?></div>
        <div class="text-[9px] text-gray-400 uppercase">Peak</div>
    </div>
    <div class="text-center p-2 rounded-lg bg-gray-50">
        <div class="text-sm font-bold text-gray-700"><?= number_format($total) ?></div>
        <div class="text-[9px] text-gray-400 uppercase">30d total</div>
    </div>
</div>

<div class="flex items-center justify-between mb-2">
    <span class="text-[11px] text-gray-400">Daily <?= $sourceLabel ?> — last 30 days</span>
    <?php if ($trend !== 0): ?>
    <span class="inline-flex items-center gap-0.5 text-[11px] font-medium <?= $trend > 0 ? 'text-green-600' : 'text-red-500' ?>">
        <i class="fa-solid fa-arrow-<?= $trend > 0 ? 'up' : 'down' ?> text-[9px]"></i>
        <?= abs($trend) ?>% vs yesterday
    </span>
    <?php endif; ?>
</div>
<div style="height: 200px;">
    <canvas id="viewsChart"></canvas>
</div>
