fix(review): ESC 门控页面可见与深链两缺口对齐（批5）

Author: Aparencia

app/src/components/review/ReviewSessionPanel.test.tsx

@@ -95,4 +95,16 @@ describe("ReviewSessionPanel 复习流", () => {
     fireEvent.keyDown(window, { key: "Escape" });
     expect(onExit).toHaveBeenCalledTimes(2);
   });
+
+  it("active=false（页面隐藏保活期）→ ESC 不退出会话；active=true 后 ESC 恢复生效（审查 P2-11）", async () => {
+    const { onExit, rerender } = renderPanel({ active: false });
+    await screen.findByText("隔离霜作用");
+    // 隐藏期：别页 ESC 属他页语义，不得静默结束本会话
+    fireEvent.keyDown(window, { key: "Escape" });
+    expect(onExit).not.toHaveBeenCalled();
+    // 切回可见 → 监听随 active 重新注册
+    rerender(<ReviewSessionPanel groupId={null} groupName="全部组" active={true} onExit={onExit} />);
+    fireEvent.keyDown(window, { key: "Escape" });
+    expect(onExit).toHaveBeenCalledTimes(1);
+  });
 });

app/src/components/review/ReviewSessionPanel.tsx

@@ -38,11 +38,14 @@ interface Props {
   groupId: number | null;
   /** 会话范围名（头部展示：组名 / 全部组） */
   groupName: string;
+  /** 页面是否可见（ReviewPage active 透传——display:none 保活期不注册 ESC；
+   *  缺省 true=既有测试/独立宿主兼容） */
+  active?: boolean;
   /** 退出本轮（返回总览；头部按钮与 ESC 同义） */
   onExit: () => void;
 }
 
-export default function ReviewSessionPanel({ groupId, groupName, onExit }: Props) {
+export default function ReviewSessionPanel({ groupId, groupName, active = true, onExit }: Props) {
   const [queue, setQueue] = useState<Flashcard[]>([]);
   const [index, setIndex] = useState(0);
   const [revealed, setRevealed] = useState(false);
@@ -64,14 +67,21 @@ export default function ReviewSessionPanel({ groupId, groupName, onExit }: Props
 
   useEffect(() => { void loadQueue(); }, [loadQueue]);
 
-  // ESC 退出（复习中误触保护：原模态语义——直接退出本轮，未评分卡不算）
+  // ESC 退出（复习中误触保护：原模态语义——直接退出本轮，未评分卡不算）。
+  // 审查 P2-11：监听注册门控到 active——复习会话在页面隐藏期（display:none
+  // 保活）仍可能进行中，全局 window 监听会把**别页的 ESC** 误判为退出信号
+  // （静默结束隐藏中的复习会话）；仅可见期注册、隐藏期不注册，卸载清理照旧
   useEffect(() => {
+    if (!active) return;
     const handler = (e: KeyboardEvent) => {
-      if (e.key === "Escape") onExit();
+      // 长按自动重复（e.repeat）只退一次——首次已触发 onExit 卸载面板，
+      // 重复 keydown 属物理按键噪声（防抖口径与行菜单 ESC 一致）
+      if (e.key !== "Escape" || e.repeat) return;
+      onExit();
     };
     window.addEventListener("keydown", handler);
     return () => window.removeEventListener("keydown", handler);
-  }, [onExit]);
+  }, [active, onExit]);
 
   const current = queue[index] ?? null;
 

app/src/pages/ReviewPage.test.tsx

@@ -117,7 +117,9 @@ describe("ReviewPage 总览与组过滤器", () => {
     // 组 2 到期 0——chips 不列（到期>0 才可作范围），深链仍可达并显示范围空态
     render(<ReviewPage active={false} focusGroupId={2} />);
     const empty = await screen.findByTestId("review-empty");
-    expect(empty.textContent).toContain("该组当前没有到期卡片");
+    // 标题内嵌 scopeLabel 组名（审查 P3-5b：零到期深链只预选不弹窗，无组名时
+    // 用户看不出预选到了哪一组）
+    expect(empty.textContent).toContain("「手账 B」组当前没有到期卡片");
     expect(empty.textContent).toContain("其余组共 1 张到期");
   });
 });
@@ -157,9 +159,12 @@ describe("ReviewPage 刷新与深链", () => {
     // 先在全量范围开会话
     fireEvent.click(await screen.findByTestId("review-start"));
     await screen.findByTestId("session-exit");
-    // 深链到组 2：会话退出回总览 + 组 2 预选
+    const before = dueCalls();
+    // 深链到组 2：会话退出回总览 + 组 2 预选——退出与手动同一出口（token++
+    // 重载到期统计，审查 P3-5a：裸清 session 会残留会话前的过期统计）
     rerender(<ReviewPage active={false} focusGroupId={2} />);
     await waitFor(() => expect(screen.queryByTestId("session-exit")).toBeNull());
+    await waitFor(() => expect(dueCalls()).toBeGreaterThan(before));
     await screen.findByTestId("review-scope-all");
     const start = screen.getByTestId("review-start") as HTMLButtonElement;
     expect(start.textContent).toContain("1");

app/src/pages/ReviewPage.tsx

@@ -84,13 +84,22 @@ export default function ReviewPage({ active, focusGroupId, onFocusGroupConsumed
 
   useEffect(() => { void load(); }, [load, token]);
 
-  // 跨页深链消费：预选组 + 退出进行中的会话（新意图优先）+ 通知父层清空
+  // 会话退出/完成：回总览并重载到期统计（评分已改变到期分布）。useCallback
+  // 化供深链打断复用（审查 P3-5a：两处退出必须同语义——裸 setSession(null)
+  // 会残留旧到期统计，深链新意图就位后展示的是会话前的过期数字）
+  const exitSession = useCallback(() => {
+    setSession(null);
+    setToken((t) => t + 1);
+  }, []);
+
+  // 跨页深链消费：预选组 + 退出进行中的会话（新意图优先）+ 通知父层清空。
+  // 退出走 exitSession（token++ 重载——与手动退出/完成同出口，防旧统计残留）
   useEffect(() => {
     if (focusGroupId == null) return;
-    setSession(null);
+    exitSession();
     setSelGroupId(focusGroupId);
     onFocusGroupConsumed?.();
-  }, [focusGroupId, onFocusGroupConsumed]);
+  }, [focusGroupId, onFocusGroupConsumed, exitSession]);
 
   // 到期>0 的组行（chips 数据源；纯归约见 utils/reviewStats）
   const dueRows = useMemo(() => dueGroupRows(groups, byGroupDue), [groups, byGroupDue]);
@@ -103,28 +112,26 @@ export default function ReviewPage({ active, focusGroupId, onFocusGroupConsumed
     setSession({ groupId: selGroupId, groupName: scopeName });
   };
 
-  // 会话退出/完成：回总览并重载到期统计（评分已改变到期分布）
-  const exitSession = () => {
-    setSession(null);
-    setToken((t) => t + 1);
-  };
-
   if (session) {
     return (
       <div style={{ height: "calc(100vh - 56px)", display: "flex", flexDirection: "column", minHeight: 0, background: "#fff" }}>
         <ReviewSessionPanel
           groupId={session.groupId}
           groupName={session.groupName}
+          // 审查 P2-11：ESC 监听门控到页面可见（隐藏期保活会话不被别页 ESC 误退）
+          active={active}
           onExit={exitSession}
         />
       </div>
     );
   }
 
-  // 空态文案分支：全局无到期 / 本组无到期但别组有（引导换范围，避免困惑）
+  // 空态文案分支：全局无到期 / 本组无到期但别组有（引导换范围，避免困惑）。
+  // 审查 P3-5b：范围空态标题内嵌 scopeLabel 组名——零到期深链（focusGroupId
+  // 指向无到期组）只预选不弹窗，标题不带组名时用户看不出"预选到了哪一组"
   const emptyTitle = totalDue === 0
     ? "当前没有到期卡片 🎉"
-    : "该组当前没有到期卡片";
+    : `「${scopeName}」组当前没有到期卡片`;
   const emptyBody = totalDue === 0
     ? "闪卡由笔记组产出（组 ⓘ 管理「⚙ 生成闪卡」/「＋ 概念卡」/碎片升卡），到期时间由 FSRS 间隔调度——到期后再来复习（弹性承诺，不追债）。若从未生成过闪卡：到「📝 笔记」页任一组点 ⓘ →「⚙ 生成闪卡」起步。"
     : `其余组共 ${totalDue} 张到期——切换上方范围即可复习。`;