export+sidebar: กรองตามรายคนที่เลือกดูครบทั้งจอและ export + REDACTION คงไว้เสมอ (คำขอผู้ใช้ 2026-09-22)

export PDF (F8):
- route รับ ?user=<userId> เพิ่ม: กรอง annotation ตาม userId นั้น ยกเว้น REDACTION
  ติดไปเสมอ (D4 — กล่องดำหาย = เนื้อหาที่ปิดกั้นกลับมาอ่านได้) และ bookmarks → PDF
  outline กรองตามผู้บันทึกด้วย (หัวข้อแม่โดนกรองแต่ลูกยังอยู่ ลูกขึ้น root ตามตรรกะ
  buildOutline เดิม) ไม่ส่ง param = ทั้งหมด เหมือนเดิม
- ชื่อไฟล์เติมชื่อผู้ใช้ท้าย: <title>-annotated-<ชื่อ>.pdf — ชื่อจาก user_name ที่
  mirror ในตาราง (ไม่รับ text จาก client) ผ่าน encodeRFC5987 รองรับชื่อไทย
- PDFViewer handleExportPdf: resolve filter ปัจจุบันก่อนยิง route (mine →
  user.userId) ส่ง &user= เมื่อไม่ใช่ ทุกคน

จอ (F4):
- visibleAnnotations คง REDACTION ของทุกคนไว้เสมอแม้กรองดูของคนอื่น — สูตรเดียวกับ
  export: กันเนื้อหาที่ปิดกั้นกลับมาอ่านได้บนจอ (เดิมหายไปตาม filter) และจอตรงกับ
  ไฟล์ export / ผลค้นหา F14 (visibleSearchResults) ใช้สูตรเดียวกัน
- sidebar แท็บ Bookmark กรองตามเจ้าของหมายเหตุเหมือน annotation (เดิม F4 คุมแค่
  annotation — bug report 2026-09-22): ต้นไม้ ตามหัวข้อ มุมมอง ตามหน้า ตัวเลข
  แท็บ และ badge จำนวนลูก ใช้ visibleBookmarks ชุดเดียวกัน — ลูกที่แม่โดนกรองขึ้น
  root เหมือน export; empty state แยก ไม่มีที่คั่นหน้าของเจ้าของหมายเหตุที่เลือก
  ออกจากไฟล์ว่างจริง
- popup ย้ายหัวข้อ (movableTo) และ bookmarkById ยังเห็นต้นไม้เต็ม — ย้ายไปใต้หัวข้อ
  ของคนอื่นได้ตามเดิม

verify: tsc + Playwright e2e (สร้าง redaction จริงเป็น user1 → สลับ user3 กรองของ
ตัวเอง: rect ดำของ user1 ยัง render ครบ, tab Bookmark (10)→(2) และแถวต้นไม้ 2 ตรง
DB เป๊ะ, ลบ redaction ทดสอบทิ้งจน DB เหลือ 0) + export จริง 4 filter นับ PDF outline
ตรงจำนวน bookmarks ของผู้ใช้นั้นใน DB ทุกแบบ — sync docs/PLAN-FEAT.md §F8

Co-Authored-By: Claude Code <noreply@anthropic.com>

app/api/annotations/export/route.ts

@@ -14,7 +14,7 @@ import {
   type PDFPage,
   type PDFRef,
 } from "pdf-lib";
-import { asc, eq, inArray } from "drizzle-orm";
+import { and, asc, eq, inArray } from "drizzle-orm";
 
 import { db } from "@/db";
 import { PdfPathError, readPublicPdf } from "@/lib/server-pdf";
@@ -274,9 +274,21 @@ export async function GET(req: Request) {
     .from(annotations)
     .where(eq(annotations.fileId, fileId))
     .orderBy(asc(annotations.createdAt));
+  // F4: export ตาม filter รายคนที่กำลังดู (?user=<userId> จาก sidebar — ไม่ส่ง = ทั้งหมด)
+  // REDACTION ติดไปเสมอแม้กรองคนอื่น (D4 — กล่องดำหายไป = เนื้อหาที่ปิดกั้นกลับมาอ่านได้)
+  const userParam = url.searchParams.get("user");
+  const filteredRows = userParam
+    ? rows.filter((r) => r.userId === userParam || r.type === "REDACTION")
+    : rows;
+  // ชื่อผู้ใช้เติมท้ายชื่อไฟล์ (mirror ในตาราง — ไม่รับ text จาก client) — กรองแล้ว
+  // ผู้นั้นยังไม่มีรายการเลย = ใช้ userId ตรง ๆ
+  const filterName = userParam
+    ? (rows.find((r) => r.userId === userParam && r.userName)?.userName ??
+      userParam)
+    : null;
   // sort แยกตามชนิดก่อนวาด (stable ภายในชนิดด้วย createdAt) — กัน REDACTION เก่าโดน
   // HIGHLIGHT/DRAW ที่สร้างทีหลังทับจนข้อความง้ำกลับมาอ่านได้ (D4)
-  const dtos = rows
+  const dtos = filteredRows
     .map(toAnnotationDTO)
     .sort((a, b) => TYPE_ORDER[a.type] - TYPE_ORDER[b.type]);
 
@@ -634,10 +646,16 @@ export async function GET(req: Request) {
 
   // bookmarks → PDF outline (แผง Bookmarks ของ reader กดกระโดดไปหน้า + yOffset)
   // เรียงตามลำดับหน้าเหมือน sidebar (byPageOrder ของ N5: หน้า → ตำแหน่งบนหน้า → เวลาสร้าง)
+  // กรองตามรายคนเหมือน annotation (คำขอผู้ใช้ 2026-09-22) — หัวข้อแม่โดนกรองแต่ลูกยังอยู่
+  // ลูกขึ้น root (buildOutline จัดการ parent หายเคสนี้อยู่แล้ว)
   const bookmarkRows = await db
     .select()
     .from(bookmarks)
-    .where(eq(bookmarks.fileId, fileId))
+    .where(
+      userParam
+        ? and(eq(bookmarks.fileId, fileId), eq(bookmarks.userId, userParam))
+        : eq(bookmarks.fileId, fileId),
+    )
     .orderBy(
       asc(bookmarks.pageIndex),
       asc(bookmarks.yOffset),
@@ -646,7 +664,9 @@ export async function GET(req: Request) {
   buildOutline(doc, bookmarkRows);
 
   const out = await doc.save();
-  const filename = encodeRFC5987(`${file.title}-annotated.pdf`);
+  const filename = encodeRFC5987(
+    `${file.title}-annotated${filterName ? `-${filterName}` : ""}.pdf`,
+  );
   return new Response(new Uint8Array(out), {
     headers: {
       "content-type": "application/pdf",

components/pdf/PDFViewer.tsx

@@ -1322,11 +1322,15 @@ export default function PDFViewer({
     return Array.from(seen, ([userId, userName]) => ({ userId, userName }));
   }, [optimisticAnnotations, user]);
 
-  // F4: กรองฝั่ง client ล้วน — ไม่แตะข้อมูลใน DB (A3)
+  // F4: กรองฝั่ง client ล้วน — ไม่แตะข้อมูลใน DB (A3) — REDACTION คงไว้เสมอแม้
+  // กรองดูของคนอื่น (D4 สูตรเดียวกับ export: กล่องดำหายจากจอ = เนื้อหาที่ปิดกั้น
+  // กลับมาอ่านได้ และจอจะไม่ตรงกับไฟล์ export ที่คงกล่องไว้)
   const visibleAnnotations = useMemo(() => {
     if (userFilter === "all") return optimisticAnnotations;
     const target = userFilter === "mine" ? user?.userId : userFilter;
-    return optimisticAnnotations.filter((a) => a.userId === target);
+    return optimisticAnnotations.filter(
+      (a) => a.userId === target || a.type === "REDACTION",
+    );
   }, [optimisticAnnotations, userFilter, user]);
 
   // FIX-8: bbox (หน่วย %) ของรายการที่ hover ตรวจได้ — เดิน paths
@@ -1490,7 +1494,19 @@ export default function PDFViewer({
     setExporting(true);
     setExportError(null);
     try {
-      const res = await fetch(withBasePath(`/api/annotations/export?fileId=${file.id}`));
+      // F4: export ตาม filter รายคนที่กำลังดู ("mine" resolve เป็น userId จริงก่อนส่ง —
+      // route กรองฝั่ง server + เติมชื่อผู้ใช้ท้ายชื่อไฟล์, REDACTION ติดไปเสมอ)
+      const filterUser =
+        userFilter === "all"
+          ? null
+          : userFilter === "mine"
+            ? (user?.userId ?? null)
+            : userFilter;
+      const res = await fetch(
+        withBasePath(
+          `/api/annotations/export?fileId=${file.id}${filterUser ? `&user=${encodeURIComponent(filterUser)}` : ""}`,
+        ),
+      );
       if (!res.ok) {
         const text = await res.text().catch(() => "");
         throw new Error(text || `HTTP ${res.status}`);

components/sidebar/AnnotationSidebar.tsx

@@ -374,13 +374,14 @@ export default function AnnotationSidebar({
   }
 
   /** ผลการค้นหา F14 หลังกรองตามเจ้าของหมายเหตุ (F4) ฝั่ง client — searchAnnotations
-   *  ไม่รับ userId และห้ามแต้ server action: สูตรเดียวกับ visibleAnnotations ของ
+   *  ไม่รับ userId และห้ามแต้ server action: สูตรเดียวกันกับ visibleAnnotations ของ
-   *  PDFViewer — เปลี่ยนตัวกรองหลังค้นแล้ว ผลกรองทันทีไม่ต้องค้นใหม่ */
+   *  PDFViewer (รวม REDACTION ของทุกคนไว้เสมอ — D4) — เปลี่ยนตัวกรองหลังค้นแล้ว
+   *  ผลกรองทันทีไม่ต้องค้นใหม่ */
   const visibleSearchResults = useMemo(() => {
     if (searchResults === null) return null;
     if (userFilter === "all") return searchResults;
     const target = userFilter === "mine" ? userId : userFilter;
-    return searchResults.filter((a) => a.userId === target);
+    return searchResults.filter((a) => a.userId === target || a.type === "REDACTION");
   }, [searchResults, userFilter, userId]);
 
   // ─── F19/A7: ประวัติ/กู้คืน — dialog ต่อรายการ (แสดงเฉพาะรายการของตัวเอง) ─────
@@ -435,9 +436,25 @@ export default function AnnotationSidebar({
   const pendingItems = annotations.filter((a) => a.type !== "COMMENT" || !a.resolved);
   const resolvedItems = annotations.filter((a) => a.type === "COMMENT" && a.resolved);
 
+  // F4: bookmarks ที่แสดง กรองตามเจ้าของหมายเหตุเหมือน annotation (คำขอผู้ใช้
+  // 2026-09-22 ให้ตรงกับ export ที่กรอง PDF outline ตามผู้บันทึก) — หัวข้อแม่โดนกรอง
+  // แต่ลูกยังอยู่ ลูกขึ้น root (พฤติกรรมเดียวกับ buildOutline ของ export) — ใช้เฉพาะจุด
+  // แสดงผล (ต้นไม้/กลุ่มหน้า/ตัวเลขแท็บ): popup ย้ายหัวข้อ (movableTo) กับ bookmarkById
+  // ยังเห็นต้นไม้เต็ม ย้ายไปใต้หัวข้อของคนอื่นได้ตามเดิม
+  const keptBookmarks =
+    userFilter === "all"
+      ? bookmarks
+      : bookmarks.filter(
+          (b) => b.userId === (userFilter === "mine" ? userId : userFilter),
+        );
+  const keptIds = new Set(keptBookmarks.map((b) => b.id));
+  const visibleBookmarks = keptBookmarks.map((b) =>
+    b.parentId && !keptIds.has(b.parentId) ? { ...b, parentId: null } : b,
+  );
+
   // มุมมอง "ตามหน้า": จัดกลุ่มตามหน้า เรียงน้อย→มาก — bookmark เอาเฉพาะ root
   // (sub ดูในต้นไม้ "ตามหัวข้อ") / annotation เก็บลำดับเดิมตามเวลาสร้าง
-  const bmRootPages = groupByPage(bookmarks.filter((b) => !b.parentId).sort(byPageOrder));
+  const bmRootPages = groupByPage(visibleBookmarks.filter((b) => !b.parentId).sort(byPageOrder));
   const annPages = groupByPage(annotations);
 
   // F12/C4: คัดลอก deep link ไปยัง annotation นี้ (?page= + ?ann=)
@@ -715,7 +732,7 @@ export default function AnnotationSidebar({
   }
 
   const renderBookmarkNode = (b: BookmarkDTO, depth: number) => {
-    const children = bookmarks.filter((x) => x.parentId === b.id).sort(byPageOrder);
+    const children = visibleBookmarks.filter((x) => x.parentId === b.id).sort(byPageOrder);
     const hasChildren = children.length > 0;
     const collapsed = collapsedIds.has(b.id);
     const editing = editBookmark?.id === b.id;
@@ -1027,7 +1044,7 @@ export default function AnnotationSidebar({
       <div role="tablist" aria-label="รายการในแผงข้าง" className="flex shrink-0 border-b border-slate-200">
         {(
           [
-            ["bookmarks", `Bookmark (${bookmarks.length})`],
+            ["bookmarks", `Bookmark (${visibleBookmarks.length})`],
             ["annotations", `Annotation (${annotations.length})`],
           ] as const
         ).map(([key, label]) => (
@@ -1318,6 +1335,10 @@ export default function AnnotationSidebar({
             <p className="p-4 text-center text-xs text-slate-500">
               ยังไม่มีที่คั่นหน้า — กดปุ่มคั่นหน้าบนแถบเครื่องมือเพื่อเพิ่ม
             </p>
+          ) : visibleBookmarks.length === 0 ? (
+            <p className="p-4 text-center text-xs text-slate-500">
+              ไม่มีที่คั่นหน้าของเจ้าของหมายเหตุที่เลือก
+            </p>
           ) : (
             <>
               {/* สลับมุมมองแท็บนี้: ต้นไม้หัวข้อ ↔ root แยกตามหน้า */}
@@ -1345,7 +1366,7 @@ export default function AnnotationSidebar({
                       {!collapsed && (
                         <ul className="space-y-0.5">
                           {roots.map((b) => {
-                            const childCount = bookmarks.filter(
+                            const childCount = visibleBookmarks.filter(
                               (x) => x.parentId === b.id,
                             ).length;
                             return (
@@ -1388,7 +1409,7 @@ export default function AnnotationSidebar({
               ) : (
                 <ul className="space-y-0.5">
                   {/* N2: root = หมุดหัวข้อใหญ่ เรียงตามลำดับหน้า (N5) — sub render ซ้อนใต้ผ่าน renderBookmarkNode */}
-                  {bookmarks
+                  {visibleBookmarks
                     .filter((b) => !b.parentId)
                     .sort(byPageOrder)
                     .map((b) => renderBookmarkNode(b, 1))}

docs/PLAN-FEAT.md

@@ -150,7 +150,7 @@ Index: `(file_id)`
 - **REDACTION บนจอ:** วาดบน InkLayer เป็น `<rect>` fill `#000` (z-3 อยู่เหนือ textLayer → บังข้อความจริงบนจอ); ปุ่ม tool แยกจาก shape
 - **Export:** `app/api/annotations/export/route.ts` (GET `?fileId=`) — dep ใหม่ `pdf-lib` + `@pdf-lib/fontkit`:
   1. อ่านข้อมูลไฟล์จาก DB → อ่าน PDF ต้นฉบับจาก `path.join(process.cwd(), "public", pdfUrl)` — **อ่านอย่างเดียว ห้ามเขียนทับ** (invariant #1) + guard path ต้อง resolve อยู่ใน `public/` กัน path traversal
-  2. โหลด annotations ทั้งหมด (ทุก user) → วาดลง `PDFDocument` ต่อหน้าด้วยพิกัด % × ขนาดจริงของหน้านั้น (`page.getSize()` + แปลงตาม `page.getRotation()` กรณี /Rotate 90/180/270)
+  2. โหลด annotations ทั้งหมด (ทุก user) → วาดลง `PDFDocument` ต่อหน้าด้วยพิกัด % × ขนาดจริงของหน้านั้น (`page.getSize()` + แปลงตาม `page.getRotation()` กรณี /Rotate 90/180/270) — เพิ่มพารามิเตอร์ `&user=<userId>` (2026-09-22): export ตาม filter รายคน F4 ที่กำลังดู ("mine" resolve เป็น userId ฝั่ง client ก่อนส่ง) — กรองเฉพาะ annotation ของ userId นั้น **ยกเว้น REDACTION ติดไปเสมอ** (D4) และเติมชื่อผู้ใช้ (จาก `user_name` ที่ mirror ในตาราง) ท้ายชื่อไฟล์ `…-annotated-<ชื่อ>.pdf`; bookmarks outline กรองตามผู้บันทึกด้วย (คำขอผู้ใช้ 2026-09-22) — หัวข้อแม่โดนกรองแต่ลูกยังอยู่ ลูกขึ้น root
   3. ลำดับวาดต่อหน้า: HIGHLIGHT rect (fill alpha ~0.35) → DRAW polyline (strokeWidth % → pt) → SHAPE → REDACTION **ดำทึบ #000 ทับจริง** → TEXTBOX/STAMP ถ้าทำแล้ว (F17/F18)
   4. COMMENT = **sticky note จริงของ PDF** (annotation dict `/Subtype /Text` — คลิกหมุดที่ reader แล้วเปิด popup อ่าน): `/Contents` = message + replies ต่อท้ายทีละบรรทัด (`— ชื่อ: ข้อความ`, F9), `/T` = ผู้เขียน, `/C` สีเหลืองเดียวกับหมุดบนจอ, `/M` เวลาแก้ไขล่าสุด, `/F 4` (Print); ไม่วาดข้อความ flatten ทับหน้ากระดาษ (annotation object อยู่เหนือ content เสมอ ไม่โดนกลบ) — และ `note` ของ annotation ชนิดอื่น (N1 ทุกชนิดยกเว้น COMMENT) ได้ sticky note เล็กแนบมุมขวาบนของ bbox ของรายการนั้น (Chrome/Edge hover แสดง tooltip จาก `/Contents`, Acrobat คลิกเปิด popup)
   5. Bookmarks (N2) → **PDF outline** (แผง Bookmarks ของ reader กดกระโดดได้): ต่อ `/Outlines` dict เอง (pdf-lib ไม่มี API ระดับสูง) — โครงสร้างตาม `parent_id` เรียงตาม `createdAt` เหมือน sidebar, `/Title` เป็น PDFHexString (ภาษาไทยได้), `/Dest [pageRef /XYZ x y null]` จาก pageIndex + yOffset (แปลงผ่าน `displayToPdfPoint`) ใช้ตำแหน่ง yOffset **เป๊ะ ๆ** — yOffset ของ bookmark มีนิยามเป็น "จุดจริงบนหน้า" เหมือนพิกัด annotation (เก็บจากขอบบนของแถบมองเห็นใต้ header ตอนสร้าง และกดในเว็บแล้วจุดถูกดันกลับมาชิดใต้ header ผ่าน `scrollToBelowHeader` แบบเดียวกับ `goToAnnotation`) ซึ่งตรงกับพฤติกรรม `/XYZ` ของ PDF ที่วางจุดยึดติดขอบบน viewport โดยไม่ต้องชดเชย, เชื่อม First/Last/Prev/Next ครบ และ Count เป็นบวก = แผงเปิดทั้งหมดตอนเปิดไฟล์