solution-erp/.claude/workflows/runs/2026-07-31-S164-4gd-khkk-fanout/sub-reviewer-gate-gd3d.md

GATE-GD3D: PASS-WITH-FLAGS-10 — Đúng phương án D, khuôn nguyên vẹn (SHA-pair identical), import sạch; 0 blocker, nhưng max-h của khuôn vượt chiều cao Panel-3 trên InboxPage (~26px) đẻ 2 thanh cuộn lồng nhau + 2 class khuôn chết âm thầm.

Sub-reviewer gate GĐ3-D (S168, 2026-08-01)

Scope: 3 file FE uncommitted, phương án D "cây thay chỗ Panel-3 khi chưa chọn HĐ". Spec nguồn: .claude/workflows/runs/2026-07-31-S164-4gd-khkk-fanout/sub-implfe-gd3.md §1 bảng 4 phương án (D). Vai: reviewer đối-kháng, propose-only — không sửa code, không commit.

---

Đo trước (baseline)

• git status --porcelain toàn repo: 5 M — .claude/WAL.md, .claude/agent-memory/memory-budget.json, + 3 file FE.
• git status --porcelain --untracked-files=all -- fe-admin/src fe-user/src: ĐÚNG 3 file, 0 untracked.
• git diff --stat: mỗi file FE 13 dòng đổi (+6/−7), tổng 3 file.

R1 — Đúng-D (điều kiện render) → PASS

Cả 3 file giữ NGUYÊN cặp điều kiện:

{!selectedId && <PipelineTreePanel currentStage={3} />}
{selectedId && detail.data && <WorkflowHistoryPanel contract={detail.data} />}

• Cây CHỈ render khi !selectedId — đúng D.
• Chọn HĐ → WorkflowHistoryPanel như cũ; vế điều kiện không đổi một ký tự.
• Trạng thái "đã chọn HĐ nhưng detail đang tải" render RỖNG ở CẢ bản cũ lẫn bản mới (bản cũ: !selectedId sai nên ô dashed tắt, detail.data chưa có nên panel trống) ⇒ hành vi loading giữa chừng KHÔNG đổi.
• currentStage={3} đúng GĐ Hợp đồng cho cả 3 trang (xem F-10 cho lưu ý riêng về InboxPage).

R2 — 0-đụng-khuôn → PASS

sha256sum (16 ký tự đầu), fe-admin ⟂ fe-user:

File	admin	user	Kết quả
components/pipeline/PipelineTreePanel.tsx	d70ac315bae485e6	d70ac315bae485e6	IDENTICAL
components/pipeline/PipelineStageFolders.tsx	bed52f39d595c86a	bed52f39d595c86a	IDENTICAL
hooks/usePipelineStages.ts	76e1823345d4e78b	76e1823345d4e78b	IDENTICAL

git status --porcelain trên 4 đường dẫn khuôn = RỖNG ⇒ khuôn chưa bị sửa. SHA-pair identical vừa chứng mirror 2 app còn khớp, vừa chứng không ai chạm vào khuôn trong đợt này.

R3 — Unused-import X → PASS

• Cây làm việc: 0 hit mã ở cả 3 file. Hit duy nhất là chuỗi type=X trong comment ContractsListPage.tsx:6 (không phải icon).
• Control-âm: cùng regex chạy trên git show HEAD:<file> cho 2 hit/file (dòng import … X … + <X className="mx-auto mb-2 h-5 w-5" />) ⇒ phép đo CÓ răng, không phải 0-hit vì regex hỏng.
• Không gỡ nhầm icon khác: FileText / Search / Plus / Inbox / AlertTriangle / Clock / ClipboardList đều còn nguyên trong dòng import mới.

---

FINDINGS

F-1 (MAJOR) — R4: max-h của khuôn hiệu-chỉnh cho host page-flow, vượt chiều cao Panel-3 trên InboxPage ⇒ 2 thanh cuộn lồng nhau

Chiều cao TỐI ĐA của khuôn khi đặt ở lg:

Thành phần	File:dòng	Lớp CSS	px
Đầu panel	PipelineTreePanel.tsx:181	px-3 py-2.5 (20) + icon-chip h-7! (28) + border-b (1)	49
Ô lọc	PipelineTreePanel.tsx:204	p-2 (16) + input h-8 (32) + border-b (1)	49
Thân cây	PipelineTreePanel.tsx:215	lg:max-h-[calc(100vh-16rem)]	100vh − 256
Tổng			100vh − 158

Chiều cao KHẢ DỤNG của Panel-3 = 100vh − 4rem (vỏ trang) − đầu trang − dải phụ − p-4 (32):

Trang	Vỏ / đầu trang	Đầu trang	Dải phụ	Khả dụng	So với 100vh−158
fe-user/src/pages/contracts/MyContractsPage.tsx	:105 / :107 py-3 + Button size=md h-8 + border	57px	0	100vh − 153	thừa 5px (khít)
fe-admin/src/pages/contracts/ContractsListPage.tsx	:106 / :107 py-3 + h1 24px + border	49px	0	100vh − 145	thừa 13px
fe-user/src/pages/InboxPage.tsx	:166 / :168 py-3 + StatPill 34px (:50 px-3 py-1.5 + h-5) + border	59px	29px — dải "Vai trò bạn đang xử lý" :183-187 (py-1.5 + text-[11px] + border)	100vh − 184	THIẾU ~26px

Hệ quả trên /inbox: <aside className="hidden overflow-y-auto … p-4 lg:block"> mọc thanh cuộn dọc thứ hai bao ngoài thanh cuộn của thân cây, tức trong cột nội dung rộng 328px (360 − 2×16) có hai thanh cuộn lồng nhau. Nội dung vẫn với tới được (không vỡ layout, không mất dữ liệu), nhưng người dùng phải cuộn hai tầng, và đầu panel cùng ô lọc trôi khỏi tầm nhìn khi cuộn tầng ngoài.

Dải "Vai trò" chỉ render khi user?.roles.length — đo prod: /api/roles trả 13 vai, mọi tài khoản thật đều thuộc ít nhất một vai ⇒ nhánh này gần như LUÔN bật, không phải ca hiếm.

Hai trang còn lại chỉ thừa 5px và 13px ⇒ mong manh: bất kỳ thay đổi nào ở đầu trang (đổi Button sang size=lg = h-10, hoặc thêm một chip trạng thái làm flex-wrap xuống dòng ở bề rộng 1024px) đều đẩy chúng sang đúng trạng thái của InboxPage.

Tiêu chí nghiệm thu đề nghị: ở 1280×800 và 1366×768, mở /inbox khi chưa chọn HĐ — số thanh cuộn dọc trong vùng Panel-3 phải bằng 1, và cuộn tới đáy cây không cần cuộn <aside> ngoài. Lặp lại phép đo cho /my-contracts và fe-admin /contracts.

F-2 (MINOR) — R4: hai class của khuôn chết ÂM THẦM trong host mới

PipelineTreePanel.tsx:177 — cn('card-accent flex flex-col self-start overflow-hidden lg:sticky lg:top-4', className):

• self-start là align-self:flex-start, chỉ có tác dụng khi cha là flex hoặc grid. Host mới có cha là <aside … lg:block> ⇒ display:block ⇒ vô hiệu.
• lg:sticky lg:top-4: tổ tiên cuộn gần nhất chính là <aside overflow-y-auto>, mà cây lại là con DUY NHẤT của nó ⇒ khối chứa gần bằng chính nó ⇒ quãng "dính" xấp xỉ 0 ⇒ vô hiệu.

Ở ba host cũ (KhkkListPage.tsx:197 và HardCopiesPage.tsx:116, đều là lg:grid-cols-[19rem_minmax(0,1fr)]) cha là grid và trang cuộn ở <main className="flex-1 overflow-auto">, nên cả hai class đều sống. Đây không phải lỗi chức năng, nhưng là dấu hiệu khuôn đang chạy ngoài giả định thiết kế của nó — cùng gốc với F-1. Nên ghi một dòng chú thích ở chỗ cắm để người sau không tưởng rằng cây có bám dính ở đây.

F-3 (MINOR) — R4 / a11y: <aside> lồng trong <aside>

Host Panel-3 là <aside>, và gốc khuôn cũng là <aside> (PipelineTreePanel.tsx:176) có kèm aria-label="Cây toàn trình theo gói thầu" (:179). Theo HTML-AAM, một aside nằm trong sectioning content chỉ tụt xuống role=generic khi KHÔNG có tên khả truy cập; ở đây nó có tên nên giữ nguyên role=complementary ⇒ sinh ra hai landmark complementary lồng nhau. Điều này hợp lệ về HTML nhưng gây nhiễu khi người dùng điều hướng theo landmark bằng trình đọc màn hình. Ba host cũ không dính vì cha của chúng là <div className="grid …">.

F-4 (MINOR) — R5: !canPe đổi thông điệp Panel-3 từ chỉ dẫn sang than phiền quyền; đo prod cho thấy hiện chưa vai nào dính

Đường quyền, đọc thẳng từ mã chứ không suy:

• usePipelineStages.ts:83 — canPe = PE_MENU_KEYS.some(k => can(k)), với PE_MENU_KEYS ở :55 là ['PurchaseEvaluations','Pe_DuyetNcc_List','Pe_DuyetNccPhuongAn_List'].
• Khi canPe sai, PipelineTreePanel.tsx:111 đặt enabled: canPe nên truy vấn pipeline-pe-index không chạy ⇒ không sinh rác 403, đúng ý đồ đã khai ở usePipelineStages.ts:5-8.
• Nhưng Panel-3 khi đó hiển thị khung cây rỗng, huy hiệu "0 gói", và câu ở :216-220: "Bạn chưa có quyền xem phiếu Duyệt NCC nên cây toàn trình chưa hiển thị được." Câu này nằm trên trang Hợp đồng, thay cho câu cũ "Quy trình duyệt sẽ hiện khi chọn HĐ." ⇒ người dùng mất chỉ dẫn hữu ích và nhận về một lời than phiền lạc đề.

Đo prod /api/permissions/by-role/{id} trên 13 vai (tất cả trả http=200): PurchaseEvaluations.canRead bằng True ở 13/13 vai ⇒ nhánh !canPe hiện không xảy ra với vai nào. Control-âm của cùng phép đo: Permissions.canRead và Users.canRead bằng False ở 12/13 vai (chỉ Admin True; số dòng quyền là 169 so với 191) ⇒ phép đo có phân biệt thật, không phải "True tuốt vì đọc sai trường". Kết luận: F-4 là rủi ro tương lai (nếu ai đó gỡ quyền PE của một vai), không phải lỗi đang chảy máu. Không chặn commit.

F-5 (MINOR) — R5: cây bơm thêm tối đa ba truy vấn index vào lượt tải đầu của ba trang

PipelineTreePanel gọi usePipelineStages, hàm này gọi usePipelineLinkage, sinh ra ba truy vấn — pipeline-pe-index (PipelineTreePanel.tsx:100), pipeline-khkk-index (usePipelineStages.ts:90) và pipeline-contract-index (:108) — mỗi truy vấn lấy pageSize=200.

Trên InboxPage, MyContractsPage và ContractsListPage, truy vấn pipeline-contract-index gọi GET /contracts?pageSize=200 song song với truy vấn danh sách của chính trang (/contracts/inbox ở InboxPage.tsx:71, /contracts ở MyContractsPage) — cùng một tài nguyên nhưng khác queryKey, nên mỗi lần vào trang mà chưa chọn HĐ là hai lần nạp danh sách hợp đồng. Đo prod cho thấy 13/13 vai đều có đủ canPe, canKhkk và canContract ⇒ cả ba truy vấn đều bắn cho mọi vai, không vai nào được miễn. Mức này chấp nhận được vì staleTime là 60 giây và đây là hệ quả nội tại của phương án D, nhưng nên biết trước để không bất ngờ khi UAT phản ánh trang tải chậm hơn.

F-6 (MINOR) — R1 phụ: trade-off của D khai thiếu một vế — ô lọc cây mất chữ khi chọn HĐ rồi bỏ chọn

Vì điều kiện là {!selectedId && <PipelineTreePanel …>}, việc chọn một HĐ sẽ gỡ bỏ (unmount) component. Hệ quả:

• expandedSet sống sót nhờ localStorage (PipelineTreePanel.tsx:119-126 đọc, :170 ghi).
• search (:94) và mobileOpen (:95) là state thuần nên mất trắng: người dùng gõ "FLOCK" để lọc cây, bấm xem một HĐ, quay lại thì ô lọc rỗng và cây bung về nhánh mặc định.

Spec D ở sub-implfe-gd3.md §1 chỉ khai trade-off "cây nhảy chỗ khi chọn HĐ", không khai việc mất chữ đang lọc. Đề nghị bổ sung vế này khi báo owner để owner chốt trên thông tin đầy đủ.

F-7 (MINOR) — R8 mobile: không hồi quy, nhưng lệch với ba host cũ

• Host là <aside className="hidden overflow-y-auto … lg:block"> nên dưới 1024px Panel-3 không render. Bản cũ (ô dashed) nằm trong đúng cùng <aside> đó, vì vậy không có hồi quy trên mobile.
• Nhưng khuôn có sẵn cả một nhánh mobile riêng: nút "Hiện cây / Ẩn cây" gắn lg:hidden (:193-200), state mobileOpen khống chế thân cây (:203), và max-h-[28rem] dành cho mobile (:215). Trong host này toàn bộ nhánh mobile của khuôn chết.
• Hệ quả nghiệp vụ: người dùng mobile CÓ cây ở GĐ2 (KhkkListPage) và GĐ4 (HardCopiesPage, hai trang page-flow nên cây xếp ở trên), nhưng không có cây ở GĐ3.

Điều này đúng chủ đích của HOST (bố cục 3-panel vốn chỉ dành cho desktop) nhưng lệch chủ đích của KHUÔN. Owner cần biết để chốt, đây không phải lỗi code.

F-8 (INFO — phán quyết: lead ĐÚNG) — R6: WorkflowMatrixViewPage không áp D là quyết định đúng

fe-user/src/pages/pe/WorkflowMatrixViewPage.tsx:104 cho thấy gốc trang là <div className="space-y-4 px-2 py-5">: đây là trang page-flow, không có <aside>, không có lưới 3-panel, không có Panel-3. Vì vậy "cây thay chỗ Panel-3" không có chỗ cắm, và bỏ qua trang này là đúng theo đúng định nghĩa của phương án D. Đây không phải chỗ lead bỏ sót.

Tuy nhiên có một câu cần owner chốt: trang này được mount ở ba route (fe-user/src/App.tsx:71 là /purchase-evaluations/workflow-matrix, :73 là /contracts/workflow-matrix, :83 là /khkk/workflow-matrix), tức nó là trang giai đoạn của cả ba GĐ. Nếu ý owner khi nói "(a) cứ mở rộng" là "mọi trang giai đoạn đều phải có cây", thì đây là trang duy nhất còn thiếu, và cách cắm đúng phải là lưới page-flow theo khuôn KhkkListPage.tsx:197 chứ không phải D. Việc này nằm ngoài phạm vi wave hiện tại, nêu ra để owner quyết.

F-9 (INFO — phán quyết: KHÔNG mâu thuẫn K6) — R7: sửa trang đang bị ẩn khỏi sidebar

• fe-admin/src/components/Layout.tsx:227-240 — tập ADMIN_HIDDEN_KEYS có chứa 'Contracts'; thêm nữa, :248 trong isAdminHidden còn chặn mọi key bắt đầu bằng Ct_. Vì vậy admin không nhìn thấy mục Hợp đồng ở sidebar.
• Route thì vẫn sống: fe-admin/src/App.tsx:82 map /contracts sang ContractsListPage, kèm :83 cho /contracts/new và :84 cho /contracts/:id.
• Có tiền lệ khớp: key 'HopDongCung' cũng nằm trong ADMIN_HIDDEN_KEYS (:231), vậy mà HardCopiesPage bên fe-admin vẫn được S162 cắm cây (fe-admin/src/pages/contracts/HardCopiesPage.tsx:117) và route của nó vẫn sống (App.tsx:87).

Kết luận: K6 ẩn phần hiển thị, chứ không xoá trang. Sửa một trang bị ẩn chính là giữ mirror theo docs/rules.md §3.9, nên không có mâu thuẫn. Một lưu ý thực dụng: thay đổi bên fe-admin gần như vô hình với admin vì phải gõ thẳng URL mới tới được. Giá trị của nó là parity giữa hai app, nên đừng tính nó vào "ba trang người dùng nhìn thấy" khi báo owner, và UAT phải làm ở fe-user chứ không phải fe-admin.

F-10 (INFO) — R1 phụ: currentStage={3} trên InboxPage, trong khi hộp thư trộn GĐ1 và GĐ3

fe-user/src/pages/InboxPage.tsx:71 gọi /contracts/inbox và :79 gọi /purchase-evaluations/inbox, nên trang liệt kê cả hợp đồng lẫn phiếu Duyệt NCC (bấm vào phiếu PE thì :283 điều hướng sang /purchase-evaluations/:id). Giá trị currentStage={3} làm cây mở sẵn folder GĐ3.

Cách đặt này vẫn hợp lý, vì Panel-3 là chỗ dành cho HĐ đang chọn (selectedId được dùng cho /contracts/${selectedId} ở :84), tức ngữ cảnh của panel đúng là GĐ3. Nêu ra để tránh hiểu nhầm nếu sau này owner coi Inbox là trang GĐ1. Không tính là lỗi.

---

Tổng kết theo trục

Trục	Kết quả	Ghi chú
R1 Đúng-D + loading không đổi	PASS	điều kiện render không đổi một ký tự; kèm F-6 và F-10 dạng thông tin
R2 0-đụng-khuôn + SHA-pair	PASS	3/3 cặp IDENTICAL, git status trên khuôn rỗng
R3 Unused-import X	PASS	0 hit mã, control-âm cho 2 hit/file ở HEAD
R4 Ngữ cảnh render / CSS	FLAG	F-1 (MAJOR), F-2, F-3
R5 Permission-path / 403 rác	PASS có cờ	không sinh rác 403; F-4 là rủi ro tương lai (prod 13/13 chưa dính), F-5 là chi phí truy vấn
R6 Trang không áp	PASS	F-8 — quyết định của lead là đúng
R7 fe-admin ẩn sidebar	PASS	F-9 — không mâu thuẫn K6, có tiền lệ HardCopiesPage
R8 Mobile	PASS	F-7 — không hồi quy, nhưng nhánh mobile của khuôn chết trong host này

Blocker: 0. Không finding nào chặn commit. F-1 là thứ đáng xử lý nhất trước khi UAT, hoặc phải khai rõ với owner như một trade-off đã biết.

Ranh vai: không sửa file mã nào, không commit, không push. Mọi finding đều ở dạng mô tả vấn đề kèm tiêu chí nghiệm thu.

END sub-reviewer-gate-gd3d — VERDICT=PASS-WITH-FLAGS-10 — TOTAL=10 finding

---

LEAD DISPOSITION @S168 (từng dòng — không số tổng)

F	Xử	Chi tiết
F-1 MAJOR	✅ VÁ	Nới khuôn đúng ngoại-lệ "thiếu prop cho GĐ3" artifact lane khoanh: PipelineTreePanel +prop bodyMaxHClass? (default GIỮ NGUYÊN — 3 host giấy-cuộn cũ 0 đổi hành vi), 3 host Panel-3 pass max-h-[28rem] lg:max-h-none ⇒ panel cuộn = đúng 1 thanh, bền mọi trang (không phụ thuộc 5px/13px mong manh). Mirror ×2 app SHA-pair mới 7baf6247af3d. Lệch tiêu-chí-CHỮ của gate ("cuộn tới đáy cây không cần cuộn aside ngoài") — đạt tiêu-chí-Ý (1 thanh cuộn, không lồng): chọn panel-cuộn thay cây-tự-cuộn vì bền cấu-trúc, đầu cây + ô lọc trôi theo là trade-off khai
F-2 MINOR	✅ VÁ (comment)	Chú thích tại 3 chỗ cắm: sticky/self-start vô hiệu ở host display:block — by-design
F-3 MINOR	🔸 CHẤP NHẬN-khai	aside-lồng-aside 2 landmark complementary: hợp lệ HTML, nhiễu screen-reader — không đổi khuôn lượt này (đổi root khuôn = đụng 4 host); ghi nợ a11y cùng lô a11y-<a>-label K5
F-4 MINOR	🔸 CHẤP NHẬN	!canPe than-phiền-quyền thay chỉ-dẫn: prod 13/13 vai có PE.Read (gate đo + control-âm) — rủi ro tương lai, không chảy máu
F-5 MINOR	🔸 CHẤP NHẬN	+tối đa 3 query index lượt tải đầu (staleTime 60s, enabled canPe) — giá của D
F-6 MINOR	🔸 CHẤP NHẬN-khai	chọn HĐ → cây unmount → bỏ chọn → ô lọc mất chữ (state trong component) — trade-off D "cây nhảy chỗ" đã khai với owner
F-7 MINOR	🔸 CHẤP NHẬN	mobile: panel-3 hidden dưới lg = khuôn 3-panel by-design (mobile đi fullpage route)
F-8 INFO	✓ (gate phán lead ĐÚNG)	WorkflowMatrixView không áp D
F-9 INFO	✓ (gate phán KHÔNG mâu-thuẫn K6)	fe-admin /contracts ẩn sidebar — route sống, tiền lệ HardCopiesPage
F-10 INFO	🔸 GIỮ currentStage={3}	/inbox trộn GĐ1+GĐ3 nhưng trang chủ-đích là HĐ Pending; PE item navigate sang trang PE riêng

Vá F-1/F-2 nằm trong commit GĐ3-D (build+test re-verify sau vá). 6 finding chấp-nhận đi vào UAT-NÓI-TRƯỚC.