pan-stack-cli 0.1.4 → 0.2.1

package/lib/stats/index.js

@@ -0,0 +1,189 @@
+"use strict";
+
+const fs = require("fs");
+const path = require("path");
+const os = require("os");
+const { findNearestWorkspace } = require("../discover");
+const { reposFromWorkspace, discoverGitRepos, scanAll } = require("./scan");
+const { resolveRange } = require("./range");
+const { loadAliasMap, canonicalEmail } = require("./identity");
+const { aggregate } = require("./aggregate");
+const { buildReport } = require("./report");
+const { serveHtml } = require("./serve");
+const { buildReviewMarkdown, writeReview } = require("./review");
+
+function parseArgs(argv) {
+  const o = { _: [], open: true, diff: true };
+  for (let i = 0; i < argv.length; i++) {
+    const a = argv[i];
+    if (a === "--since") o.since = argv[++i];
+    else if (a === "--from") o.from = argv[++i];
+    else if (a === "--to") o.to = argv[++i];
+    else if (a === "--member" || a === "-m") o.member = argv[++i];
+    else if (a === "--project" || a === "-p") o.project = argv[++i];
+    else if (a === "--port") o.port = parseInt(argv[++i], 10);
+    else if (a === "--out" || a === "-o") o.out = argv[++i];
+    else if (a === "--no-open") o.open = false;
+    else if (a === "--no-diff") o.diff = false;
+    else if (a === "--head-only") o.headOnly = true;
+    else if (a === "--max-diff-lines") o.maxDiffLines = parseInt(argv[++i], 10);
+    else if (a.startsWith("--since=")) o.since = a.slice(8);
+    else o._.push(a);
+  }
+  return o;
+}
+
+function dataDir() {
+  const dir = path.join(os.homedir(), ".pan-code-graph");
+  fs.mkdirSync(dir, { recursive: true });
+  return dir;
+}
+
+/**
+ * Nguồn repo để thống kê: ưu tiên .project.yaml; nếu không có thì fallback quét
+ * git quanh pwd (thư mục cha + tối đa 2 cấp).
+ * @returns {{repos:Array<{name,dir}>, source:string}}
+ */
+function resolveRepos() {
+  const ws = findNearestWorkspace();
+  if (ws) return { repos: reposFromWorkspace(ws), source: `.project.yaml (${ws.project})` };
+
+  const repos = discoverGitRepos(process.cwd());
+  if (!repos.length) {
+    throw new Error(
+      `Không tìm thấy pan-stack .project.yaml, cũng không thấy git repo nào từ ${process.cwd()} (đã quét pwd + 2 cấp con).`
+    );
+  }
+  console.log(`ℹ️  Không tìm thấy pan-stack .project.yaml — fallback quét git từ ${process.cwd()} (pwd + 2 cấp con).`);
+  return { repos, source: "fallback (quét từ pwd)" };
+}
+
+function printHelp() {
+  console.log(`pan stats — thống kê đóng góp Git từ .project.yaml
+(không có .project.yaml → fallback quét git từ pwd xuống 2 cấp con)
+
+lệnh:
+  pan stats [report]          Quét & mở báo cáo HTML (mặc định)
+  pan stats people            Liệt kê thành viên tham gia
+  pan stats review            Xuất Markdown 1 thành viên × 1 dự án cho AI review
+
+lọc thời gian (dùng chung):
+  --since <n>                 Preset ngày: 1 2 3 4 5 7 14 30 (30 = 1 tháng)
+  --from <YYYY-MM-DD> --to <YYYY-MM-DD>   Khoảng ngày tuỳ chọn
+
+options:
+  -m, --member <email|tên>    Lọc theo thành viên (review: bắt buộc)
+  -p, --project <tên repo>    Lọc theo dự án (review: bắt buộc)
+      --port <n>              Cổng serve (mặc định 4321)
+      --no-open               Không tự mở trình duyệt
+  -o, --out <file>            Đường dẫn file xuất
+      --no-diff               (review) chỉ tóm tắt, không kèm diff
+      --max-diff-lines <n>    (review) giới hạn dòng diff (mặc định 6000)
+      --head-only             Chỉ quét HEAD hiện tại (mặc định: --all — mọi nhánh
+                              local + remote-tracking + tags). Nếu commit ở remote
+                              chưa thấy, chạy 'pan fetch' trước.
+
+ví dụ:
+  pan stats --since 7
+  pan stats report --from 2026-07-01 --to 2026-07-22
+  pan stats people
+  pan stats review -m an@fpt.com -p csdl-cc-backend --since 7 -o review.md
+`);
+}
+
+async function runStats(argv) {
+  const o = parseArgs(argv);
+  const sub = ["report", "people", "review"].includes(o._[0]) ? o._.shift() : "report";
+
+  if (o._[0] === "help" || o.help) return printHelp();
+
+  if (sub === "review") return runReview(o);
+  if (sub === "people") return runPeople(o);
+  return runReport(o);
+}
+
+function loadAndScan(o) {
+  const { repos } = resolveRepos();
+  const range = resolveRange(o);
+  const allBranches = !o.headOnly;
+  const scope = allBranches ? "mọi nhánh" : "chỉ HEAD";
+  console.log(`🔍 Quét ${repos.length} repo · ${scope} · ${range.label}:`);
+  const { commits, repoStatus } = scanAll(repos, range, { allBranches });
+  const aliasMap = loadAliasMap(path.join(dataDir(), "alias-map.json"));
+  return { repos, range, commits, repoStatus, aliasMap };
+}
+
+function runReport(o) {
+  // Quét TOÀN BỘ lịch sử để nhúng commit thô → bộ lọc thời gian chạy phía client.
+  const { repos } = resolveRepos();
+  const fullRange = resolveRange({});
+  const allBranches = !o.headOnly;
+  const scope = allBranches ? "mọi nhánh" : "chỉ HEAD";
+  console.log(`🔍 Quét ${repos.length} repo · ${scope} · toàn bộ (lọc thời gian trong report):`);
+  const { commits, repoStatus } = scanAll(repos, fullRange, { allBranches });
+  const aliasMap = loadAliasMap(path.join(dataDir(), "alias-map.json"));
+
+  // Commit thô, gọn: e=email chuẩn, n=tên, t=ts(giây), r=repo, a=add, d=del
+  const rawCommits = commits.map((c) => ({
+    e: canonicalEmail(c.email, aliasMap),
+    n: c.name || c.email,
+    t: c.ts,
+    r: c.repoName,
+    a: c.additions,
+    d: c.deletions,
+  }));
+
+  const unavailable = repoStatus.filter((r) => !r.available).map((r) => ({ name: r.name, reason: r.reason }));
+  const initial = resolveRange(o); // range khởi tạo từ CLI (mặc định: toàn bộ)
+  const meta = {
+    reposTotal: repoStatus.length,
+    reposAvailable: repoStatus.filter((r) => r.available).length,
+    unavailable,
+    initialSince: o.since != null ? Number(o.since) : null,
+    initialFrom: o.from || null,
+    initialTo: o.to || null,
+    initialMembers: o.member ? [o.member] : [],
+  };
+
+  const html = buildReport(rawCommits, meta);
+  const outFile = o.out || path.join(dataDir(), "report.html");
+  fs.writeFileSync(outFile, html);
+  console.log(`💾 Đã ghi ${outFile} (${rawCommits.length} commit)`);
+  if (unavailable.length) console.log(`⚠️  ${unavailable.length} repo không đọc được (đã ghi cảnh báo trong report).`);
+  serveHtml(html, { port: o.port || 4321, open: o.open });
+}
+
+function runPeople(o) {
+  const { commits, aliasMap } = loadAndScan(o);
+  const { members } = aggregate(commits, aliasMap);
+  console.log(`\n👥 ${members.length} thành viên tham gia:\n`);
+  for (const m of members) {
+    console.log(`  ${String(m.commits).padStart(5)} commit  ${m.name} <${m.email}>`);
+  }
+}
+
+function runReview(o) {
+  if (!o.member || !o.project) {
+    throw new Error("review cần --member <email|tên> và --project <tên repo>.");
+  }
+  const { repos } = resolveRepos();
+  const repo = repos.find((r) => r.name === o.project);
+  if (!repo) throw new Error(`Không có dự án '${o.project}' (repo khả dụng: ${repos.map((r) => r.name).join(", ")}).`);
+  if (!fs.existsSync(repo.dir)) throw new Error(`Dự án '${o.project}' chưa clone (${repo.dir}).`);
+
+  const range = resolveRange(o);
+  console.log(`📝 Tạo review: ${o.member} × ${o.project} (${range.label})`);
+  const md = buildReviewMarkdown(repo, o.member, range, {
+    withDiff: o.diff,
+    maxDiffLines: o.maxDiffLines,
+    allBranches: !o.headOnly,
+  });
+
+  const safe = `${o.project}_${o.member.replace(/[^a-z0-9]+/gi, "-")}`.toLowerCase();
+  const outFile = o.out || path.join(dataDir(), `review-${safe}.md`);
+  writeReview(outFile, md);
+  console.log(`✅ Đã ghi ${outFile}`);
+  console.log(`   → Mở file này và nhờ AI review/chấm điểm.`);
+}
+
+module.exports = { runStats };

package/lib/stats/parse.js

@@ -0,0 +1,46 @@
+"use strict";
+
+const US = "\x1f"; // Unit Separator — ranh giới field trong header
+const HEAD = "@@@"; // tiền tố dòng header commit
+
+// Header: @@@<hash>US<email>US<name>US<unixDate>US<subject>
+// Theo sau là các dòng numstat: "additions\tdeletions\tpath" (binary = "-").
+const PRETTY_FORMAT = `${HEAD}%H${US}%ae${US}%an${US}%ad${US}%s`;
+
+/**
+ * Parse output thô của `git log --numstat` thành mảng commit.
+ */
+function parseGitLog(raw) {
+  const commits = [];
+  let cur = null;
+
+  for (const line of raw.split("\n")) {
+    if (line.startsWith(HEAD)) {
+      if (cur) commits.push(cur);
+      const [hash, email, name, date, subject] = line.slice(HEAD.length).split(US);
+      cur = {
+        hash,
+        email: (email || "").toLowerCase().trim(),
+        name: (name || "").trim(),
+        ts: Number(date) || 0,
+        subject: subject || "",
+        additions: 0,
+        deletions: 0,
+        files: 0,
+      };
+      continue;
+    }
+    if (!cur || !line.trim()) continue;
+    const parts = line.split("\t");
+    if (parts.length < 3) continue;
+    const add = parts[0] === "-" ? 0 : parseInt(parts[0], 10) || 0;
+    const del = parts[1] === "-" ? 0 : parseInt(parts[1], 10) || 0;
+    cur.additions += add;
+    cur.deletions += del;
+    cur.files += 1;
+  }
+  if (cur) commits.push(cur);
+  return commits;
+}
+
+module.exports = { parseGitLog, PRETTY_FORMAT, US, HEAD };

package/lib/stats/range.js

@@ -0,0 +1,38 @@
+"use strict";
+
+const PRESET_DAYS = new Set([1, 2, 3, 4, 5, 7, 14, 30]);
+
+/**
+ * Chuẩn hoá khoảng thời gian từ options.
+ * --since <n> (preset ngày) HOẶC --from/--to (YYYY-MM-DD). Không có → toàn bộ.
+ * @returns {{from:number,to:number,label:string}} unix giây
+ */
+function resolveRange({ since, from, to } = {}) {
+  const nowSec = Math.floor(Date.now() / 1000);
+
+  if (from || to) {
+    const fromSec = from ? Math.floor(Date.parse(from + "T00:00:00") / 1000) : -Infinity;
+    const toSec = to ? Math.floor(Date.parse(to + "T23:59:59") / 1000) : nowSec;
+    const label = `${from || "…"} → ${to || "nay"}`;
+    return { from: fromSec, to: toSec, label };
+  }
+
+  if (since != null && since !== "") {
+    const n = Number(since);
+    if (!Number.isFinite(n) || n <= 0) {
+      throw new Error(`--since không hợp lệ: ${since} (dùng 1 2 3 4 5 7 14 30)`);
+    }
+    const label = n === 30 ? "1 tháng gần đây" : `${n} ngày gần đây`;
+    return { from: nowSec - n * 86400, to: nowSec, label };
+  }
+
+  return { from: -Infinity, to: Infinity, label: "Toàn bộ lịch sử" };
+}
+
+/** ISO date (giây) cho git --since/--until; -Infinity/Infinity → null. */
+function toGitDate(sec) {
+  if (!Number.isFinite(sec)) return null;
+  return new Date(sec * 1000).toISOString();
+}
+
+module.exports = { resolveRange, toGitDate, PRESET_DAYS };

package/lib/stats/report.js

@@ -0,0 +1,264 @@
+"use strict";
+
+/**
+ * Dựng file HTML self-contained (Tailwind CDN, bảng màu FPT).
+ * Nhúng commit thô → lọc thời gian + chọn thành viên chạy hoàn toàn phía client.
+ * @param {Array} commits  [{e,n,t,r,a,d}]  (email, name, ts giây, repo, add, del)
+ * @param {object} meta     { reposTotal, reposAvailable, unavailable[], initial* }
+ */
+function buildReport(commits, meta = {}) {
+  const payload = JSON.stringify({ commits, meta });
+  return `<!doctype html>
+<html lang="vi">
+<head>
+<meta charset="utf-8" />
+<meta name="viewport" content="width=device-width, initial-scale=1" />
+<title>pan stats — Thống kê đóng góp</title>
+<script src="https://cdn.tailwindcss.com"></script>
+<script>
+  tailwind.config = { theme: { extend: { colors: {
+    fptOrange: '#F37021', fptGreen: '#4EB748', fptBlue: '#0066B3', fptRed: '#E5484D'
+  } } } };
+</script>
+</head>
+<body class="bg-slate-50 text-slate-800">
+<header class="bg-gradient-to-r from-fptOrange to-fptBlue text-white">
+  <div class="max-w-7xl mx-auto px-6 py-6">
+    <h1 class="text-2xl font-bold">Thống kê đóng góp Git — pan stats</h1>
+    <p id="meta" class="text-white/90 text-sm mt-1"></p>
+
+    <div class="mt-4 flex flex-wrap gap-2 items-center">
+      <span class="text-white/80 text-sm mr-1">Khoảng:</span>
+      <div id="presets" class="flex flex-wrap gap-1"></div>
+      <span class="text-white/70 mx-1">·</span>
+      <input id="from" type="date" class="px-2 py-1.5 rounded-lg text-slate-800 text-sm outline-none" />
+      <span class="text-white/70">→</span>
+      <input id="to" type="date" class="px-2 py-1.5 rounded-lg text-slate-800 text-sm outline-none" />
+      <button id="applyDates" class="px-3 py-1.5 rounded-lg bg-white/90 text-fptBlue font-semibold text-sm hover:bg-white">Áp dụng</button>
+    </div>
+
+    <div class="mt-3 flex flex-wrap gap-2 items-center">
+      <div class="relative">
+        <button id="memberBtn" class="px-3 py-2 rounded-lg bg-white text-slate-800 text-sm font-medium min-w-56 text-left flex items-center justify-between gap-2">
+          <span id="memberLabel">Tất cả thành viên</span><span class="text-slate-400">▾</span>
+        </button>
+        <div id="memberMenu" class="hidden absolute z-20 mt-1 w-72 max-h-72 overflow-auto bg-white text-slate-800 rounded-lg shadow-xl border border-slate-200 p-2">
+          <div class="flex gap-2 mb-2">
+            <button id="mAll" class="text-xs px-2 py-1 rounded bg-slate-100 hover:bg-slate-200">Chọn tất cả</button>
+            <button id="mNone" class="text-xs px-2 py-1 rounded bg-slate-100 hover:bg-slate-200">Bỏ chọn</button>
+          </div>
+          <div id="memberList" class="space-y-1"></div>
+        </div>
+      </div>
+      <button id="toggleAll" class="px-4 py-2 rounded-lg bg-white text-fptBlue font-semibold text-sm hover:bg-white/90">Mở tất cả</button>
+    </div>
+  </div>
+</header>
+
+<main class="max-w-7xl mx-auto px-6 py-8">
+  <div id="warnBox" class="hidden mb-6 rounded-xl border border-amber-300 bg-amber-50 text-amber-900 px-4 py-3 text-sm"></div>
+
+  <section id="kpis" class="grid grid-cols-2 md:grid-cols-4 gap-3 mb-6"></section>
+
+  <section id="cards" class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4"></section>
+
+  <h2 class="mt-10 mb-3 text-lg font-bold text-fptBlue">Bảng tổng hợp</h2>
+  <div class="overflow-x-auto rounded-xl border border-slate-200 bg-white">
+    <table class="w-full text-sm">
+      <thead class="bg-slate-100 text-slate-600"><tr>
+        <th class="text-left px-4 py-2">Thành viên</th>
+        <th class="text-right px-4 py-2">Dự án</th>
+        <th class="text-right px-4 py-2">Commit</th>
+        <th class="text-right px-4 py-2">Thêm (+)</th>
+        <th class="text-right px-4 py-2">Xoá (−)</th>
+      </tr></thead>
+      <tbody id="summaryBody"></tbody>
+      <tfoot class="font-bold bg-slate-50 border-t-2 border-slate-200"><tr id="summaryTotal"></tr></tfoot>
+    </table>
+  </div>
+</main>
+
+<script>
+const PAYLOAD = ${payload};
+const COMMITS = PAYLOAD.commits;
+const META = PAYLOAD.meta;
+const nf = new Intl.NumberFormat('vi-VN');
+const PRESETS = [1,2,3,4,5,7,14,30];
+
+let expanded = false;
+let range = { from: -Infinity, to: Infinity, label: 'Toàn bộ lịch sử' };
+let selected = new Set(); // rỗng = tất cả
+
+function initials(n){ return (n||'?').trim().split(/\\s+/).map(w=>w[0]).slice(0,2).join('').toUpperCase(); }
+
+// Danh sách thành viên (từ toàn bộ commit) để đổ vào dropdown
+const ALL_MEMBERS = (() => {
+  const m = new Map();
+  for (const c of COMMITS){ if(!m.has(c.e)) m.set(c.e, c.n); else m.set(c.e, c.n); }
+  return [...m.entries()].map(([e,n])=>({email:e,name:n})).sort((a,b)=>a.name.localeCompare(b.name));
+})();
+
+// Tổng hợp theo range + selected
+function aggregate(){
+  const byEmail = new Map();
+  const projectSet = new Set();
+  for (const c of COMMITS){
+    if (c.t < range.from || c.t > range.to) continue;
+    if (selected.size && !selected.has(c.e)) continue;
+    projectSet.add(c.r);
+    if (!byEmail.has(c.e)) byEmail.set(c.e, { email:c.e, name:c.n, commits:0, additions:0, deletions:0, projects:new Map() });
+    const m = byEmail.get(c.e);
+    m.commits++; m.additions+=c.a; m.deletions+=c.d; if(c.n) m.name=c.n;
+    if(!m.projects.has(c.r)) m.projects.set(c.r,{name:c.r,commits:0,additions:0,deletions:0});
+    const p=m.projects.get(c.r); p.commits++; p.additions+=c.a; p.deletions+=c.d;
+  }
+  const members=[...byEmail.values()].map(m=>({...m,projects:[...m.projects.values()].sort((a,b)=>b.commits-a.commits)})).sort((a,b)=>b.commits-a.commits);
+  const totals=members.reduce((s,m)=>{s.commits+=m.commits;s.additions+=m.additions;s.deletions+=m.deletions;return s;},{members:members.length,projects:projectSet.size,commits:0,additions:0,deletions:0});
+  return {members,totals};
+}
+
+function kpi(label, value, sub, color){
+  return \`<div class="rounded-xl bg-white border border-slate-200 p-4 shadow-sm">
+    <div class="text-xs uppercase tracking-wide text-slate-500">\${label}</div>
+    <div class="mt-1 text-2xl font-bold \${color||''} tabular-nums">\${value}</div>
+    <div class="text-xs text-slate-400 mt-0.5">\${sub||''}</div>
+  </div>\`;
+}
+
+function projectRow(p){
+  return \`<div class="flex items-center justify-between text-sm py-1 border-b border-slate-100 last:border-0">
+    <span class="text-fptBlue font-medium truncate mr-2">\${p.name}</span>
+    <span class="shrink-0 tabular-nums text-slate-500">\${nf.format(p.commits)} commit ·
+      <span class="text-fptGreen">+\${nf.format(p.additions)}</span>
+      <span class="text-fptRed">−\${nf.format(p.deletions)}</span></span></div>\`;
+}
+function card(m){
+  return \`<article class="member-card bg-white rounded-xl border border-slate-200 p-4 shadow-sm">
+    <header class="flex items-center gap-3 cursor-pointer select-none toggle-card">
+      <div class="w-10 h-10 rounded-full bg-fptOrange text-white grid place-items-center font-bold">\${initials(m.name)}</div>
+      <div class="min-w-0"><div class="font-semibold truncate">\${m.name}</div><div class="text-xs text-slate-500 truncate">\${m.email}</div></div>
+    </header>
+    <div class="mt-3 flex gap-4 text-sm"><span><b>\${nf.format(m.commits)}</b> commit</span>
+      <span class="text-fptGreen">+\${nf.format(m.additions)}</span>
+      <span class="text-fptRed">−\${nf.format(m.deletions)}</span>
+      <span class="text-slate-400">\${m.projects.length} dự án</span></div>
+    <div class="projects mt-3 \${expanded?'':'hidden'}">\${m.projects.map(projectRow).join('')}</div></article>\`;
+}
+function summaryRow(m){
+  return \`<tr class="border-t border-slate-100">
+    <td class="px-4 py-2">\${m.name} <span class="text-slate-400 text-xs">\${m.email}</span></td>
+    <td class="px-4 py-2 text-right">\${m.projects.length}</td>
+    <td class="px-4 py-2 text-right tabular-nums">\${nf.format(m.commits)}</td>
+    <td class="px-4 py-2 text-right tabular-nums text-fptGreen">+\${nf.format(m.additions)}</td>
+    <td class="px-4 py-2 text-right tabular-nums text-fptRed">−\${nf.format(m.deletions)}</td></tr>\`;
+}
+
+function render(){
+  const {members,totals}=aggregate();
+  const totalMembers = ALL_MEMBERS.length;
+  const filtering = selected.size > 0;
+  document.getElementById('meta').textContent =
+    \`\${range.label} · \${META.reposAvailable}/\${META.reposTotal} dự án đọc được\${filtering ? ' · đang lọc ' + selected.size + '/' + totalMembers + ' thành viên' : ''}\`;
+
+  document.getElementById('kpis').innerHTML = [
+    kpi('Thành viên', nf.format(totals.members), (filtering ? 'lọc ' + selected.size + '/' + totalMembers : 'trên tổng ' + totalMembers), 'text-fptBlue'),
+    kpi('Dự án có commit', nf.format(totals.projects), META.reposAvailable + '/' + META.reposTotal + ' đọc được', 'text-fptOrange'),
+    kpi('Commit', nf.format(totals.commits), range.label, 'text-slate-800'),
+    kpi('Dòng thay đổi', '<span class="text-fptGreen">+' + nf.format(totals.additions) + '</span> <span class="text-slate-300">/</span> <span class="text-fptRed">−' + nf.format(totals.deletions) + '</span>', 'add / del', ''),
+  ].join('');
+
+  document.getElementById('cards').innerHTML = members.length ? members.map(card).join('')
+    : '<p class="text-slate-400 col-span-full">Không có dữ liệu trong khoảng/chọn hiện tại.</p>';
+  document.getElementById('summaryBody').innerHTML = members.map(summaryRow).join('');
+  document.getElementById('summaryTotal').innerHTML =
+    \`<td class="px-4 py-2">TỔNG</td><td class="px-4 py-2 text-right">—</td>
+     <td class="px-4 py-2 text-right tabular-nums">\${nf.format(totals.commits)}</td>
+     <td class="px-4 py-2 text-right tabular-nums text-fptGreen">+\${nf.format(totals.additions)}</td>
+     <td class="px-4 py-2 text-right tabular-nums text-fptRed">−\${nf.format(totals.deletions)}</td>\`;
+  document.querySelectorAll('.toggle-card').forEach(h=>h.addEventListener('click',()=>h.parentElement.querySelector('.projects').classList.toggle('hidden')));
+}
+
+// ── Bộ lọc thời gian ──
+function setPreset(n){
+  const now=Math.floor(Date.now()/1000);
+  range={from:now-n*86400,to:now,label:(n===30?'1 tháng gần đây':n+' ngày gần đây')};
+  document.getElementById('from').value=''; document.getElementById('to').value='';
+  markPreset(n); render();
+}
+function setAllTime(){ range={from:-Infinity,to:Infinity,label:'Toàn bộ lịch sử'}; markPreset(null); render(); }
+function setCustom(){
+  const f=document.getElementById('from').value, t=document.getElementById('to').value;
+  if(!f&&!t){ setAllTime(); return; }
+  const from=f?Math.floor(Date.parse(f+'T00:00:00')/1000):-Infinity;
+  const to=t?Math.floor(Date.parse(t+'T23:59:59')/1000):Math.floor(Date.now()/1000);
+  range={from,to,label:(f||'…')+' → '+(t||'nay')}; markPreset(null); render();
+}
+function markPreset(n){
+  document.querySelectorAll('#presets [data-p]').forEach(b=>{
+    const on = String(n)===b.dataset.p;
+    b.className='px-2.5 py-1.5 rounded-lg text-sm '+(on?'bg-white text-fptBlue font-semibold':'bg-white/20 text-white hover:bg-white/30');
+  });
+}
+
+// ── Dropdown thành viên (multi-select) ──
+function renderMemberMenu(){
+  document.getElementById('memberList').innerHTML = ALL_MEMBERS.map(m=>\`
+    <label class="flex items-center gap-2 px-1 py-0.5 rounded hover:bg-slate-50 cursor-pointer text-sm">
+      <input type="checkbox" class="m-chk" value="\${m.email}" \${selected.has(m.email)?'checked':''}/>
+      <span class="truncate"><b>\${m.name}</b> <span class="text-slate-400 text-xs">\${m.email}</span></span>
+    </label>\`).join('');
+  document.querySelectorAll('.m-chk').forEach(chk=>chk.addEventListener('change',()=>{
+    if(chk.checked) selected.add(chk.value); else selected.delete(chk.value);
+    updateMemberLabel(); render();
+  }));
+}
+function updateMemberLabel(){
+  const el=document.getElementById('memberLabel');
+  el.textContent = selected.size===0 ? 'Tất cả thành viên'
+    : selected.size===1 ? (ALL_MEMBERS.find(m=>selected.has(m.email))||{}).name || '1 thành viên'
+    : selected.size+' thành viên';
+}
+
+// init
+function init(){
+  document.getElementById('presets').innerHTML =
+    '<button data-p="all" class="px-2.5 py-1.5 rounded-lg text-sm bg-white text-fptBlue font-semibold">Tất cả</button>' +
+    PRESETS.map(n=>\`<button data-p="\${n}" class="px-2.5 py-1.5 rounded-lg text-sm bg-white/20 text-white hover:bg-white/30">\${n===30?'1 tháng':n+'n'}</button>\`).join('');
+  document.querySelector('#presets [data-p="all"]').addEventListener('click',setAllTime);
+  PRESETS.forEach(n=>document.querySelector('#presets [data-p="'+n+'"]').addEventListener('click',()=>setPreset(n)));
+  document.getElementById('applyDates').addEventListener('click',setCustom);
+
+  const un=META.unavailable||[];
+  if(un.length){
+    const w=document.getElementById('warnBox'); w.classList.remove('hidden');
+    w.innerHTML='<b>⚠️ '+un.length+' dự án không thống kê được</b> (chưa clone / không đọc được — pan-stack là vỏ bọc, cần đủ quyền):<ul class="list-disc ml-5 mt-1">'+un.map(u=>'<li><b>'+u.name+'</b> — '+u.reason+'</li>').join('')+'</ul>';
+  }
+
+  document.getElementById('memberBtn').addEventListener('click',()=>document.getElementById('memberMenu').classList.toggle('hidden'));
+  document.addEventListener('click',(e)=>{ if(!e.target.closest('#memberBtn')&&!e.target.closest('#memberMenu')) document.getElementById('memberMenu').classList.add('hidden'); });
+  document.getElementById('mAll').addEventListener('click',()=>{selected=new Set(ALL_MEMBERS.map(m=>m.email));renderMemberMenu();updateMemberLabel();render();});
+  document.getElementById('mNone').addEventListener('click',()=>{selected=new Set();renderMemberMenu();updateMemberLabel();render();});
+
+  document.getElementById('toggleAll').addEventListener('click',(e)=>{
+    expanded=!expanded;
+    document.querySelectorAll('.projects').forEach(p=>p.classList.toggle('hidden',!expanded));
+    e.target.textContent=expanded?'Thu gọn tất cả':'Mở tất cả';
+  });
+
+  // giá trị khởi tạo từ CLI
+  if(META.initialMembers && META.initialMembers.length){
+    for(const q of META.initialMembers){ const lo=q.toLowerCase(); ALL_MEMBERS.filter(m=>m.email.includes(lo)||m.name.toLowerCase().includes(lo)).forEach(m=>selected.add(m.email)); }
+  }
+  renderMemberMenu(); updateMemberLabel();
+
+  if(META.initialFrom||META.initialTo){ document.getElementById('from').value=META.initialFrom||''; document.getElementById('to').value=META.initialTo||''; setCustom(); }
+  else if(META.initialSince){ setPreset(META.initialSince); }
+  else { setAllTime(); }
+}
+init();
+</script>
+</body>
+</html>`;
+}
+
+module.exports = { buildReport };