Skip to content

GitLab

Open
Created by Pornpavit Tantilavasute@joe_qaMaintainer0 of 5 tasks completed0/5 tasks

[QA Brain MVP] T7: Web UI Feed, Quick Entry Modal, and Lead Verification Dashboard

สรุปงาน (Summary)

พัฒนาหน้าจอ Web User Interface ใน apps/web และ Backend Endpoint POST /api/v1/workspaces/:wsId/brain/create สำหรับระบบ QA Brain เพื่อให้ทีม QA และผู้บริหารสามารถเข้าถึง, ค้นหา, บันทึกบทเรียนใหม่อย่างรวดเร็วผ่าน Quick Entry Modal, ตรวจรับรองบทเรียน (Verification Review), ดูแท็บ Deprecated และยกระดับบทเรียนที่มีประโยชน์สู่ส่วนกลาง (Workspace Promotion) ภายใต้การควบคุมสิทธิ์ที่ถูกต้อง

อ้างอิงข้อกำหนดสถาปัตยกรรม: RFC v4.1 (Section 2.3, 5.5)
ลำดับการทำงาน (Dependency): ขึ้นต่อกับ T1, T2, T3, T4, T5

ขอบเขตและงานที่ต้องทำ (Scope of Work)

1. Backend Contract สำหรับ Web Create

  • พัฒนา Endpoint POST /api/v1/workspaces/:wsId/brain/create:
    • สิทธิ์: สมาชิกที่มีสิทธิ์ QA_MEMBER+ ในโปรเจกต์นั้น
    • Payload: projectId, title, what, evidenceType, evidenceRef, evidenceDetail, howToApply, tags, idempotencyKey
    • การทำงาน:
      • กำหนด channel = 'WEB_UI', actorUserId = user.id, authorType = 'HUMAN'
      • ตรวจ Typed Evidence (RUN_RESULT ตรวจสอบ Run Case ในโปรเจกต์จริง)
      • ส่งข้อมูลผ่าน Pre-Ingress Sanitizer (Policy v1.0.0) เพื่อตัด Secret/PII
      • ตรวจสอบ Atomic Idempotency
      • บันทึกลงฐานข้อมูลเป็นสถานะ DRAFT และบันทึก appendAudit

2. เส้นทางและโครงสร้างหน้าจอ (Routes & Views)

  • Project QA Brain View: /qa/[projectKey]/brain
    • แสดงบทเรียนเฉพาะของโปรเจกต์นั้น + บทเรียนส่วนกลางของ Workspace
  • Workspace QA Brain View: /workspace/brain (หรือแท็บใน Workspace Settings)
    • แสดงบทเรียนส่วนกลางของ Workspace สำหรับ QA Lead/Admin บริหารจัดการ

3. คอมโพเนนต์หน้าจอหลัก (Key UI Components)

  • Gotcha Feed & Filter Panel:
    • แสดง Badge สถานะที่ชัดเจน:
      • DRAFT: สีเหลือง/ส้ม (Pending Review)
      • VERIFIED: สีเขียว (Verified by Lead)
      • DEPRECATED: สีเทา
    • แท็บตัวกรอง: "All", "Verified Only", "Pending Review (Drafts)", "Deprecated" (ดึงด้วย includeDeprecated: true)
    • กล่องค้นหา (Search Bar) ค้นหาครอบคลุม Title, What, Tags และ EvidenceRef
  • Quick Entry Modal:
    • ฟอร์มสำหรับให้ QA บันทึกบทเรียนใหม่ เชื่อมโยงกับ Endpoint /create
  • Verification & Review Dashboard (สำหรับ QA Lead / Admin):
    • แสดงรายการ Draft ที่รอการตรวจรับรอง
    • หน้าต่างเปรียบเทียบประวัติการแก้ไข (Revision Diff)
    • ปุ่ม Action: Verify, Edit, Deprecate
  • Workspace Promotion Modal (สำหรับ Workspace QA Lead / Admin):
    • สิทธิ์การมองเห็นและการกด: จำกัดเฉพาะผู้ใช้ที่มีบทบาท WORKSPACE_QA_LEAD หรือ WORKSPACE_ADMIN เท่านั้น (ผู้ใช้ที่เป็นเพียง Lead ระดับโปรเจกต์จะมองไม่เห็นปุ่มนี้)
    • ฟอร์มยกระดับบทเรียนสู่ระดับ Workspace พร้อมหน้าพรีวิวฟิลด์กลาง (neutral*) ที่ผ่านการ Sanitize แล้ว

เกณฑ์การตรวจรับ (Acceptance Criteria)

  • Role-Based Visibility: เฉพาะ WORKSPACE_QA_LEAD หรือ WORKSPACE_ADMIN จึงจะมองเห็นและกดปุ่ม Promote to Workspace ได้
  • Web Create Endpoint สกัด Secret/PII: การกรอกรหัสผ่านหรือ API Key ลงใน Quick Entry Form ต้องถูก Sanitizer ทำการ Mask ก่อนบันทึกลงฐานข้อมูลจริง
  • แท็บ "Deprecated" สามารถดึง Gotcha ที่ถูกยกเลิกมาแสดงผลได้ถูกต้อง
  • เมื่อเกิด Version Conflict หน้าจอแสดง Banner แจ้งเตือนอย่างสุภาพและเปิดให้โหลดข้อมูลใหม่โดยข้อมูลฟอร์มไม่หาย
  • UI ออกแบบสอดคล้องกับ Design System ของ Happy QA (Tailwind / Radix UI / Shadcn)
Edited by Pornpavit Tantilavasute