cursor-guard 4.6.0 → 4.6.1

package/ROADMAP.md

@@ -3,8 +3,8 @@
 > 本文档描述 cursor-guard 从 V2 到 V7 的长期演进方向。
 > 每一代向下兼容，低版本功能永远不废弃。
 >
-> **当前版本**：`V4.6.0`  
-> **文档状态**：`V2` ~ `V4.6.0` 已完成交付（含 V5 intent/audit 基础），`V5` 主体规划中
+> **当前版本**：`V4.6.1`  
+> **文档状态**：`V2` ~ `V4.6.1` 已完成交付（含 V5 intent/audit 基础），`V5` 主体规划中
 
 ## 阅读导航
 
@@ -466,6 +466,7 @@ V4 经过 4 轮系统性代码审查，修复了以下关键问题：
 | V4.5.7 | **文件详情 Modal 修复 + Dashboard 端口复用**：见下方详细说明 | ✅ |
 | V4.5.8 | **Dashboard 版本更新检测 + 一键重启**：见下方详细说明 | ✅ |
 | V4.6.0 | **告警 UX 全面升级**：见下方详细说明 | ✅ |
+| V4.6.1 | **告警历史弹窗化**：见下方详细说明 | ✅ |
 
 #### V4.4.1 详细内容
 
@@ -698,6 +699,17 @@ V4 经过 4 轮系统性代码审查，修复了以下关键问题：
 | 告警历史常驻入口 | `buildAlertHistoryHtml()` 提取为独立函数，在活跃告警和无告警两种状态下都渲染"历史 N 条"折叠按钮，告警激活时也能查看历史 |
 | 告警历史 localStorage 持久化 | 新增 `loadAlertHistory()` / `saveAlertHistory()`，使用 `localStorage` key `cursorGuard_alertHistory` 持久化最近 20 条告警历史，刷新页面不丢失 |
 
+#### V4.6.1 详细内容
+
+**告警历史弹窗化**：
+
+| 改动 | 说明 |
+|------|------|
+| 历史按钮改为弹窗触发 | "历史 N 条"按钮点击后打开全屏 Modal（复用 `file-modal`），不再内联折叠展开 |
+| 历史表格化展示 | Modal 内以表格呈现所有历史告警：触发时间、详情、文件类型分布、文件列表按钮 |
+| 嵌套文件详情 | 每条历史告警的"查看文件"按钮可再打开文件详情 Modal，查看具体变更文件列表 |
+| 新增 i18n keys | `alert.col.detail` / `alert.col.breakdown` / `alert.col.files`（中英双语） |
+
 #### V4.5.x 新增配置参考
 
 | 字段 | 类型 | 默认值 | 引入版本 | 说明 |

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "cursor-guard",
-  "version": "4.6.0",
+  "version": "4.6.1",
   "description": "Protects code from accidental AI overwrite or deletion in Cursor IDE — mandatory pre-write snapshots, review-before-apply, local Git safety net, and deterministic recovery. | 保护代码免受 Cursor AI 代理意外覆写或删除——强制写前快照、预览再执行、本地 Git 安全网、确定性恢复。",
   "keywords": [
     "cursor",

package/references/dashboard/public/app.js

@@ -52,6 +52,9 @@ const I18N = {
     'alert.col.file':   'File',
     'alert.col.action': 'Action',
     'alert.col.changes':'Changes',
+    'alert.col.detail': 'Detail',
+    'alert.col.breakdown': 'Breakdown',
+    'alert.col.files': 'Files',
     'alert.action.modified': 'Modified',
     'alert.action.added':    'Added',
     'alert.action.deleted':  'Deleted',
@@ -276,6 +279,9 @@ const I18N = {
     'alert.col.file':   '文件',
     'alert.col.action': '操作',
     'alert.col.changes':'变化量',
+    'alert.col.detail': '详情',
+    'alert.col.breakdown': '文件类型',
+    'alert.col.files': '文件列表',
     'alert.action.modified': '修改',
     'alert.action.added':    '新增',
     'alert.action.deleted':  '删除',
@@ -913,24 +919,55 @@ function alertFileBreakdown(files) {
 function buildAlertHistoryHtml() {
   if (state.alertHistory.length === 0) return '';
   const count = state.alertHistory.length;
-  const rows = state.alertHistory.slice(-5).reverse().map(h => {
-    const breakdown = alertFileBreakdown(h.files);
-    return `<div class="alert-history-row text-sm text-muted">
-      <span class="alert-history-time">${esc(formatTime(h.timestamp))}</span>
-      <span>${t('alert.detail', { count: h.fileCount, window: h.windowSeconds, threshold: h.threshold })}</span>
-      ${breakdown ? `<span class="alert-history-breakdown">${esc(breakdown)}</span>` : ''}
-      <span class="badge badge-expired">${t('alert.expired')}</span>
-    </div>`;
-  }).join('');
   return `
     <div class="alert-history-toggle-wrap">
-      <button class="alert-history-toggle-btn text-sm text-muted" data-alert-history-toggle>${t('alert.historyCount', { n: count })}</button>
-    </div>
-    <div class="alert-history alert-history-collapsed">
-      <div class="alert-history-label text-sm">${t('alert.history')}</div>${rows}
+      <button class="alert-history-toggle-btn text-sm text-muted" data-alert-history-modal>${t('alert.historyCount', { n: count })}</button>
     </div>`;
 }
 
+function openAlertHistoryModal() {
+  const list = [...state.alertHistory].reverse();
+  if (list.length === 0) return;
+  $('#file-modal-title').textContent = t('alert.history');
+  const body = $('#file-modal-body');
+
+  const rows = list.map((h, i) => {
+    const breakdown = alertFileBreakdown(h.files);
+    const fileCount = Array.isArray(h.files) ? h.files.length : 0;
+    return `<tr>
+      <td class="text-mono">${esc(formatTime(h.timestamp))}</td>
+      <td>${t('alert.detail', { count: h.fileCount, window: h.windowSeconds, threshold: h.threshold })}</td>
+      <td>${breakdown ? esc(breakdown) : '-'}</td>
+      <td>${fileCount > 0 ? `<button class="modal-restore-btn" data-history-files="${i}">${t('alert.viewFiles', { n: fileCount })}</button>` : '-'}</td>
+    </tr>`;
+  }).join('');
+
+  body.innerHTML = `<table>
+    <thead><tr>
+      <th>${t('alert.triggered')}</th>
+      <th>${t('alert.col.detail')}</th>
+      <th>${t('alert.col.breakdown')}</th>
+      <th>${t('alert.col.files')}</th>
+    </tr></thead>
+    <tbody>${rows}</tbody>
+  </table>`;
+
+  body.addEventListener('click', (e) => {
+    const btn = e.target.closest('[data-history-files]');
+    if (btn) {
+      const idx = parseInt(btn.dataset.historyFiles);
+      const h = list[idx];
+      if (h?.files?.length > 0) {
+        const proj = state.pageData?.dashboard?.watcher?.path || '';
+        openFileModal(t('modal.alertFiles'), h.files, proj, '');
+      }
+    }
+  });
+
+  $('#file-modal-overlay').classList.add('active');
+  document.body.style.overflow = 'hidden';
+}
+
 function renderAlertCard(alerts) {
   const el = $('#card-alert');
   if (!alerts?.active) {
@@ -1573,13 +1610,11 @@ function setupEvents() {
     if (backup) openRestoreDrawer(backup);
   });
 
-  // Alert history toggle + file modal (event delegation)
+  // Alert history modal + file modal (event delegation)
   $('#card-alert').addEventListener('click', (e) => {
-    const historyToggle = e.target.closest('[data-alert-history-toggle]');
-    if (historyToggle) {
-      const card = historyToggle.closest('#card-alert');
-      const history = card?.querySelector('.alert-history');
-      if (history) history.classList.toggle('alert-history-collapsed');
+    const historyBtn = e.target.closest('[data-alert-history-modal]');
+    if (historyBtn) {
+      openAlertHistoryModal();
       return;
     }
     const modalBtn = e.target.closest('[data-alert-files-modal]');