/** Retention Cohort pattern — identical cell renderer used for all three tables. */

const formatPct = (v) => {
  if (v == null) return '';
  const n = Math.round(v);
  const variant = n >= 60 ? 'success' : n >= 30 ? 'warning' : 'muted';
  return `<badge-ui text="${n}%" variant="${variant}"></badge-ui>`;
};

const columns = [
  { key: 'week',  label: 'Signup week' },
  { key: 'size',  label: 'Users' },
  { key: 'w1',    label: 'W1',  render: formatPct },
  { key: 'w2',    label: 'W2',  render: formatPct },
  { key: 'w3',    label: 'W3',  render: formatPct },
  { key: 'w4',    label: 'W4',  render: formatPct },
  { key: 'w8',    label: 'W8',  render: formatPct },
  { key: 'w12',   label: 'W12', render: formatPct },
];

const data = [
  { week: 'Jan 6',  size: 420, w1: 100, w2: 78, w3: 62, w4: 54, w8: 41, w12: 32 },
  { week: 'Jan 13', size: 480, w1: 100, w2: 82, w3: 68, w4: 58, w8: 45, w12: null },
  { week: 'Jan 20', size: 510, w1: 100, w2: 80, w3: 66, w4: 57, w8: null, w12: null },
  { week: 'Jan 27', size: 612, w1: 100, w2: 84, w3: 70, w4: null, w8: null, w12: null },
  { week: 'Feb 3',  size: 584, w1: 100, w2: 81, w3: null, w4: null, w8: null, w12: null },
  { week: 'Feb 10', size: 640, w1: 100, w2: null, w3: null, w4: null, w8: null, w12: null },
];

export default function setup(router) {
  for (const id of ['pat-retention-default', 'pat-retention-legend', 'pat-retention-stats']) {
    const table = router.querySelector(`#${id}`);
    if (!table) continue;
    table.columns = columns;
    table.data = data;
  }
}
