/** Chart-in-Card pattern — populate chart data */

const monthlyRevenue = [
  { month: 'Jan', revenue: 3200 }, { month: 'Feb', revenue: 4500 },
  { month: 'Mar', revenue: 2800 }, { month: 'Apr', revenue: 6200 },
  { month: 'May', revenue: 5500 }, { month: 'Jun', revenue: 7100 },
  { month: 'Jul', revenue: 5200 }, { month: 'Aug', revenue: 4800 },
  { month: 'Sep', revenue: 5500 }, { month: 'Oct', revenue: 6100 },
  { month: 'Nov', revenue: 6800 }, { month: 'Dec', revenue: 5400 },
];

const sessions = [
  { day: 'Mon', sessions: 620 }, { day: 'Tue', sessions: 710 },
  { day: 'Wed', sessions: 580 }, { day: 'Thu', sessions: 830 },
  { day: 'Fri', sessions: 790 }, { day: 'Sat', sessions: 420 },
  { day: 'Sun', sessions: 360 },
];

const sparkline = (vals) => vals.map((v, i) => ({ d: i, v }));

export default function setup(router) {
  const views = router.querySelector('#pat-spark-views');
  if (views) views.data = sparkline([42, 38, 45, 50, 48, 55, 52, 60, 58, 65, 62, 70]);

  const revenue = router.querySelector('#pat-revenue');
  if (revenue) revenue.data = monthlyRevenue;

  const mrr = router.querySelector('#pat-mrr');
  if (mrr) mrr.data = monthlyRevenue;

  const sess = router.querySelector('#pat-sessions');
  if (sess) sess.data = sessions;

  const trend = router.querySelector('#pat-trend-revenue');
  if (trend) trend.data = monthlyRevenue.slice(0, 3);

  const statSpark = router.querySelector('#pat-stat-spark');
  if (statSpark) statSpark.data = [
    { month: 'Jan', value: 30 }, { month: 'Feb', value: 42 },
    { month: 'Mar', value: 38 }, { month: 'Apr', value: 55 },
    { month: 'May', value: 62 }, { month: 'Jun', value: 71 },
  ];

  const filterSess = router.querySelector('#pat-filter-sessions');
  if (filterSess) filterSess.data = sessions;
}
