feat: clickable Velocity Per Capita chart with PR drilldown modal

Adds a debug-friendly modal to the org-wide Velocity Per Capita chart so
clicking a weekly point lists every PR contributing that week — with
complexity, developer, team, repo and source — sorted by complexity.

Wires _build_velocity_prs into chart_data and an openVelocityPrModal in
the JS template, paralleling the existing cycle-time drilldown.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

Author: OhadPerryBoomi

reports/chart_data.py

@@ -202,6 +202,55 @@ def _build_cycle_time_prs(df: pd.DataFrame) -> Dict[str, Any]:
     return result
 
 
+def _build_velocity_prs(df: pd.DataFrame) -> Dict[str, Any]:
+    """Lookup: scope -> week_start_str -> list[pr_dict] for velocity drilldown.
+
+    Scope is "_all" for the org-wide chart (excludes Bots/Unknown).
+    """
+    if df.empty or "date" not in df.columns:
+        return {}
+
+    vdf = df.copy()
+    vdf["_dt"] = pd.to_datetime(vdf["date"], format="mixed", utc=False, errors="coerce")
+    vdf = vdf.dropna(subset=["_dt"])
+    if vdf.empty:
+        return {}
+
+    vdf["_week"] = vdf["_dt"].dt.to_period("W").dt.start_time
+    vdf["_team"] = vdf.get("team", pd.Series([""] * len(vdf))).fillna("").replace("", "Unknown")
+    vdf = vdf[~vdf["_team"].isin(["Bots", "Unknown"])]
+    if vdf.empty:
+        return {}
+
+    dev_col = "developer" if "developer" in vdf.columns else "author"
+    vdf["_dev"] = vdf.get(dev_col, pd.Series([""] * len(vdf))).fillna("").astype(str)
+
+    result: Dict[str, Any] = {}
+    for _, row in vdf.iterrows():
+        week = row["_week"]
+        if pd.isna(week):
+            continue
+        week_key = week.strftime("%Y-%m-%d")
+
+        explanation = row.get("explanation", "")
+        explanation = "" if pd.isna(explanation) else str(explanation).strip()
+        pr_title = row.get("pr_title", "")
+        pr_title = "" if pd.isna(pr_title) else str(pr_title).strip()
+        pr_url = str(row.get("pr_url", "") or "")
+        title = explanation or pr_title or _pr_title_from_url(pr_url)
+
+        pr_dict = {
+            "title": title,
+            "url": pr_url,
+            "complexity": float(row.get("complexity", 0) or 0),
+            "developer": row["_dev"],
+            "team": row["_team"],
+        }
+        result.setdefault("_all", {}).setdefault(week_key, []).append(pr_dict)
+
+    return result
+
+
 def _extract_basic(df: pd.DataFrame) -> List[Dict[str, Any]]:
     charts = []
     df = _ensure_date(df)
@@ -236,12 +285,13 @@ def _extract_basic(df: pd.DataFrame) -> List[Dict[str, Any]]:
                 "id": "22",
                 "type": "line",
                 "title": "Velocity Per Capita (by Week)",
-                "subtitle": "Org-wide: total complexity / active developers",
+                "subtitle": "Org-wide: total complexity / active developers · click a dot to see PRs",
                 "overall_avg": avg_pc,
                 "overall_avg_unit": "avg / week",
                 "x": week_labels,
                 "y": per_capita,
                 "_section": "Velocity Metrics",
+                "_velocity_scope": "_all",
             })
 
     # 01: Complexity volume over time (bar)
@@ -1011,5 +1061,6 @@ def build_all_chart_data(df: pd.DataFrame) -> Dict[str, Any]:
         "leaderboard": _extract_leaderboard(df),
         "_team_dev_prs": _build_team_dev_prs(df),
         "_cycle_time_prs": _build_cycle_time_prs(df),
+        "_velocity_prs": _build_velocity_prs(df),
         "_hero_stats": _extract_hero_stats(df),
     }

reports/interactive_report.py

@@ -1655,6 +1655,7 @@ def build_interactive_report(
     const featuresRows = chartData['_features_rows'] || [];
     const teamDevPrs = chartData['_team_dev_prs'] || {{}};
     const cycleTimePrs = chartData['_cycle_time_prs'] || {{}};
+    const velocityPrs = chartData['_velocity_prs'] || {{}};
 
     tabOrder.forEach((key, i) => {{
       const panel = document.createElement('div');
@@ -2120,6 +2121,14 @@ def build_interactive_report(
                 if (prs.length > 0) openCycleTimePrModal(scope, week, prs);
               }});
             }}
+            if (c._velocity_scope) {{
+              ch.on('click', function(params) {{
+                const week = params.name;
+                const scope = c._velocity_scope;
+                const prs = (velocityPrs[scope] || {{}})[week] || [];
+                if (prs.length > 0) openVelocityPrModal(scope, week, prs);
+              }});
+            }}
             if (c.type === 'scatter' && c._pr_examples) {{
               ch.on('click', function(params) {{
                 const linesChanged = params.data[0];
@@ -2434,6 +2443,70 @@ def build_interactive_report(
       ddOverlay.classList.add('open');
     }}
 
+    function openVelocityPrModal(scope, week, prs) {{
+      const ddOverlay = document.getElementById('drilldown-overlay');
+      const ddTitle = document.getElementById('dd-title');
+      const ddBody = document.getElementById('dd-body');
+      const weekDate = new Date(week + 'T00:00:00');
+      const weekFmt = weekDate.toLocaleDateString('en-US', {{month: 'short', day: 'numeric', year: 'numeric'}});
+      const totalCx = prs.reduce((s, p) => s + (p.complexity || 0), 0);
+      const devSet = new Set(prs.map(p => p.developer).filter(Boolean));
+      const perCapita = devSet.size > 0 ? (totalCx / devSet.size).toFixed(2) : '0';
+      const scopeLabel = scope === '_all' ? 'All Teams' : scope;
+      ddTitle.innerHTML = `Velocity Per Capita — ${{scopeLabel}} — week of ${{weekFmt}}<span class="dd-count">${{prs.length}} PR${{prs.length !== 1 ? 's' : ''}} · ${{devSet.size}} dev${{devSet.size !== 1 ? 's' : ''}} · total cx ${{totalCx}} · per-capita ${{perCapita}}</span>`;
+
+      const cxColor = (v) => v >= 8 ? '#991b1b' : v >= 5 ? '#92400e' : '#065f46';
+      const cxBg = (v) => v >= 8 ? '#fee2e2' : v >= 5 ? '#fef3c7' : '#d1fae5';
+
+      const sorted = prs.slice().sort((a, b) => (b.complexity || 0) - (a.complexity || 0));
+
+      let tableHtml = `<table class="dd-table">
+        <thead><tr>
+          <th>PR</th><th>Complexity</th><th>Developer</th><th>Team</th><th>Repo</th><th>Source</th><th>Link</th>
+        </tr></thead><tbody>`;
+
+      sorted.forEach(pr => {{
+        const title = pr.title || pr.url || '—';
+        const displayTitle = title.length > 60 ? title.slice(0, 60) + '…' : title;
+        const cx = pr.complexity || 0;
+        const cxBadge = `<span style="display:inline-block;font-size:0.7rem;font-family:'Syne',sans-serif;font-weight:600;padding:0.12rem 0.45rem;border-radius:4px;background:${{cxBg(cx)}};color:${{cxColor(cx)}}">${{cx}}</span>`;
+        const link = pr.url ? `<a href="${{pr.url}}" target="_blank" rel="noopener" style="color:var(--accent);font-size:0.85rem">→ Open PR</a>` : '—';
+        const dev = pr.developer || '—';
+        const team = pr.team || '—';
+
+        let repoName = '—';
+        let source = '—';
+        if (pr.url) {{
+          try {{
+            const url = new URL(pr.url);
+            if (url.hostname.includes('github.com')) {{
+              source = '<span style="display:inline-block;font-size:0.7rem;font-family:\\'Syne\\',sans-serif;font-weight:600;padding:0.12rem 0.45rem;border-radius:4px;background:#dbeafe;color:#1e40af">GitHub</span>';
+              const pathParts = url.pathname.split('/').filter(p => p);
+              if (pathParts.length >= 2) repoName = pathParts[1];
+            }} else if (url.hostname.includes('bitbucket.org')) {{
+              source = '<span style="display:inline-block;font-size:0.7rem;font-family:\\'Syne\\',sans-serif;font-weight:600;padding:0.12rem 0.45rem;border-radius:4px;background:#e0e7ff;color:#4338ca">Bitbucket</span>';
+              const pathParts = url.pathname.split('/').filter(p => p);
+              if (pathParts.length >= 2) repoName = pathParts[1];
+            }}
+          }} catch (e) {{}}
+        }}
+
+        tableHtml += `<tr>
+          <td class="cell-name" title="${{title}}"><span class="name-text">${{displayTitle}}</span></td>
+          <td>${{cxBadge}}</td>
+          <td style="font-size:0.85rem">${{dev}}</td>
+          <td style="font-size:0.85rem">${{team}}</td>
+          <td style="font-size:0.85rem">${{repoName}}</td>
+          <td>${{source}}</td>
+          <td>${{link}}</td>
+        </tr>`;
+      }});
+
+      tableHtml += '</tbody></table>';
+      ddBody.innerHTML = tableHtml;
+      ddOverlay.classList.add('open');
+    }}
+
     function openScatterPrModal(linesChanged, complexity, prs) {{
       const ddTitle = document.getElementById('dev-drill-title');
       const ddBody = document.getElementById('dev-drill-body');