refactor(ui): streamline document cleanup and navigation logic in doc pages

Remove redundant clearCurrDoc calls from navigation links and ensure document cleanup occurs on component unmount for EPUB, HTML, and PDF pages. Simplify PDF back navigation by eliminating sidebar delay logic. Refactor DocumentListItem to avoid unnecessary router usage and consolidate document link handling. These changes improve maintainability and consistency in document lifecycle management across the UI.

src/app/(app)/epub/[id]/page.tsx

@@ -102,6 +102,12 @@ export default function EPUBPage() {
     loadDocument();
   }, [loadDocument, isLoading]);
 
+  useEffect(() => {
+    return () => {
+      clearCurrDoc();
+    };
+  }, [clearCurrDoc]);
+
   // Compute available height = viewport - (header height + tts bar height)
   useEffect(() => {
     const compute = () => {
@@ -170,7 +176,6 @@ export default function EPUBPage() {
         <p className="text-red-500 mb-4">{error}</p>
         <Link
           href="/app"
-          onClick={() => clearCurrDoc()}
           className="inline-flex items-center px-3 py-1 bg-base text-foreground rounded-lg hover:bg-offbase transition-all duration-200 ease-in-out hover:scale-[1.04] hover:text-accent"
         >
           <svg className="w-4 h-4 mr-2 text-muted" fill="none" stroke="currentColor" viewBox="0 0 24 24">
@@ -188,7 +193,6 @@ export default function EPUBPage() {
         left={
           <Link
             href="/app"
-            onClick={() => clearCurrDoc()}
             className="inline-flex items-center py-1 px-2 rounded-md border border-offbase bg-base text-foreground text-xs hover:bg-offbase transition-all duration-200 ease-in-out hover:scale-[1.04] hover:text-accent"
             aria-label="Back to documents"
           >

src/app/(app)/html/[id]/page.tsx

@@ -102,6 +102,12 @@ export default function HTMLPage() {
     loadDocument();
   }, [loadDocument, isLoading]);
 
+  useEffect(() => {
+    return () => {
+      clearCurrDoc();
+    };
+  }, [clearCurrDoc]);
+
   // Compute available height = viewport - (header height + tts bar height)
   useEffect(() => {
     const compute = () => {
@@ -157,7 +163,6 @@ export default function HTMLPage() {
         <p className="text-red-500 mb-4">{error}</p>
         <Link
           href="/app"
-          onClick={() => { clearCurrDoc(); }}
           className="inline-flex items-center px-3 py-1 bg-base text-foreground rounded-lg hover:bg-offbase transition-all duration-200 ease-in-out hover:scale-[1.04] hover:text-accent"
         >
           <svg className="w-4 h-4 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
@@ -175,7 +180,6 @@ export default function HTMLPage() {
         left={
           <Link
             href="/app"
-            onClick={() => clearCurrDoc()}
             className="inline-flex items-center py-1 px-2 rounded-md border border-offbase bg-base text-foreground text-xs hover:bg-offbase transition-all duration-200 ease-in-out hover:scale-[1.04] hover:text-accent"
             aria-label="Back to documents"
           >

src/app/(app)/pdf/[id]/page.tsx

@@ -72,7 +72,6 @@ export default function PDFViewerPage() {
   const [containerHeight, setContainerHeight] = useState<string>('auto');
   const inFlightDocIdRef = useRef<string | null>(null);
   const loadedDocIdRef = useRef<string | null>(null);
-  const backNavTimeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null);
   const clearCurrDocRef = useRef(clearCurrDoc);
   const [isNavigatingBack, setIsNavigatingBack] = useState(false);
   const parseUiState: NonNullable<typeof parseStatus> = parseStatus ?? 'pending';
@@ -160,9 +159,6 @@ export default function PDFViewerPage() {
 
   useEffect(() => {
     return () => {
-      if (backNavTimeoutRef.current) {
-        clearTimeout(backNavTimeoutRef.current);
-      }
       clearCurrDocRef.current();
     };
   }, []);
@@ -222,16 +218,9 @@ export default function PDFViewerPage() {
     if (isNavigatingBack) return;
     setIsNavigatingBack(true);
     stop();
-    const hadOpenSidebar = activeSidebar !== null;
     setActiveSidebar(null);
-    const delayMs = hadOpenSidebar ? 220 : 0;
-    if (backNavTimeoutRef.current) {
-      clearTimeout(backNavTimeoutRef.current);
-    }
-    backNavTimeoutRef.current = setTimeout(() => {
-      router.push('/app');
-    }, delayMs);
-  }, [isNavigatingBack, stop, activeSidebar, router]);
+    router.push('/app');
+  }, [isNavigatingBack, stop, router]);
 
   const requestForceReparse = useCallback(() => {
     if (forceReparseDisabled) return;

src/components/doclist/DocumentListItem.tsx

@@ -1,6 +1,5 @@
 import Link from 'next/link';
 import { DragEvent, useState } from 'react';
-import { useRouter } from 'next/navigation';
 import { Button } from '@headlessui/react';
 import { PDFIcon, EPUBIcon, FileIcon } from '@/components/icons/Icons';
 import { DocumentListDocument } from '@/types/documents';
@@ -35,9 +34,9 @@ export function DocumentListItem({
   viewMode,
 }: DocumentListItemProps) {
   const [loading, setLoading] = useState(false);
-  const router = useRouter();
   const { authEnabled } = useAuthConfig();
   const { data: session } = useAuthSession();
+  const href = `/${doc.type}/${encodeURIComponent(doc.id)}`;
 
   // Only allow drag and drop interactions for documents not in folders
   const isDraggable = dragEnabled && !doc.folderId;
@@ -45,10 +44,8 @@ export function DocumentListItem({
   const isAnonymousAuthed = Boolean(authEnabled && session?.user?.isAnonymous);
   const showDeleteButton = !(isAnonymousAuthed && doc.scope === 'unclaimed');
 
-  const handleDocumentClick = (e: React.MouseEvent) => {
-    e.preventDefault();
+  const handleDocumentClick = () => {
     setLoading(true);
-    router.push(`/${doc.type}/${encodeURIComponent(doc.id)}`);
   };
 
   return (
@@ -81,7 +78,7 @@ export function DocumentListItem({
       {viewMode === 'grid' ? (
         <>
           <Link
-            href={`/${doc.type}/${encodeURIComponent(doc.id)}`}
+            href={href}
             draggable={false}
             className="block"
             aria-label="Open document preview"
@@ -91,7 +88,7 @@ export function DocumentListItem({
           </Link>
           <div className="flex items-center w-full px-1.5 py-1.5">
             <Link
-              href={`/${doc.type}/${encodeURIComponent(doc.id)}`}
+              href={href}
               draggable={false}
               className="document-link flex items-center gap-2 flex-1 min-w-0 rounded-md py-0.5 px-0.5"
               onClick={handleDocumentClick}
@@ -134,7 +131,7 @@ export function DocumentListItem({
       ) : (
         <div className="flex items-center w-full">
           <Link
-            href={`/${doc.type}/${encodeURIComponent(doc.id)}`}
+            href={href}
             draggable={false}
             className="document-link flex items-center align-center gap-2 flex-1 min-w-0 rounded-md py-0.5 px-0.5"
             onClick={handleDocumentClick}