fix: end markers only show for nearby sections (page proximity filter)

webapp/tipitaka-api/app/services/page_service.py

@@ -70,7 +70,7 @@ class PageService:
                 return None
 
             cursor.execute("""
-                SELECT c.title, c.level
+                SELECT c.title, c.level, c.page_number
                 FROM contents c
                 WHERE c.volume_id = ?
                   AND c.page_number <= ?
@@ -88,9 +88,10 @@ class PageService:
                 # Clean section range suffix: ๓.-๑๐. → ๓.
                 title = re.sub(r'^([\u0E50-\u0E59]+)\.-[\u0E50-\u0E59]+\.\s*', r'\1. ', title)
                 level = r["level"]
+                sec_page = r["page_number"]
                 if level not in seen_levels and title:
                     seen_levels.add(level)
-                    sections.append({"title": title, "level": level})
+                    sections.append({"title": title, "level": level, "page_number": sec_page})
             sections.sort(key=lambda s: s["level"])
             cleaned = self.search_service.clean_text(row["content_text"])
             is_blank = self._is_blank_page(cleaned)

webapp/tipitaka-web/src/components/layout/ReaderPanel.tsx

@@ -17,12 +17,17 @@ const SHELL_STYLES: Record<string, string> = {
   classic: 'bg-[#f5edd8]',
 };
 
-const renderContent = (html: string, fontSize: number, sections: {title: string; level: number}[]) => {
+const renderContent = (html: string, fontSize: number, sections: {title: string; level: number; page_number?: number}[], currentPage?: number) => {
   // Sections with "จบ" → end marker below content
-  // Skip if already rendered as <h4> inside content body (from <B> tag)
+  // Only if section's page_number is close to current page (within 5 pages)
   const endMarkers = sections.filter(s => {
     const title = s.title.trim();
     if (!(title.endsWith('จบ') || title.includes('จบ'))) return false;
+    // Skip if this end marker belongs to a faraway page
+    if (s.page_number !== undefined && currentPage !== undefined) {
+      if (currentPage - s.page_number > 5) return false;
+    }
+    // Skip if already rendered as <h4> inside content body (from <B> tag)
     if (html && html.includes(title)) return false;
     return true;
   });
@@ -193,7 +198,7 @@ const ReaderPanel: React.FC = () => {
                     ))}
                   </header>
                   <div className="border-b border-[#c8860a]/15 mb-5" />
-                  {renderContent(content.content_html_formatted || content.content_html || '', fontSize, content.sections || [])}
+                  {renderContent(content.content_html_formatted || content.content_html || '', fontSize, content.sections || [], content.page_number)}
                 </>
               )}