refactor: Move document-related components into a dedicated documents subdirectory and update imports.

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

@@ -4,14 +4,14 @@ import { useParams, useRouter } from "next/navigation";
 import Link from 'next/link';
 import { useCallback, useEffect, useRef, useState } from 'react';
 import { useEPUB } from '@/contexts/EPUBContext';
-import { DocumentSkeleton } from '@/components/DocumentSkeleton';
+import { DocumentSkeleton } from '@/components/documents/DocumentSkeleton';
 import { EPUBViewer } from '@/components/views/EPUBViewer';
-import { DocumentSettings } from '@/components/DocumentSettings';
+import { DocumentSettings } from '@/components/documents/DocumentSettings';
 import { Header } from '@/components/Header';
 import { useTTS } from "@/contexts/TTSContext";
 import TTSPlayer from '@/components/player/TTSPlayer';
 import { RateLimitPauseButton } from '@/components/player/RateLimitPauseButton';
-import { DocumentHeaderMenu } from '@/components/DocumentHeaderMenu';
+import { DocumentHeaderMenu } from '@/components/documents/DocumentHeaderMenu';
 import { AudiobookExportModal } from '@/components/AudiobookExportModal';
 import type { TTSAudiobookChapter } from '@/types/tts';
 import type { AudiobookGenerationSettings } from '@/types/client';

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

@@ -4,15 +4,15 @@ import { useParams, useRouter } from "next/navigation";
 import Link from 'next/link';
 import { useCallback, useEffect, useRef, useState } from 'react';
 import { useHTML } from '@/contexts/HTMLContext';
-import { DocumentSkeleton } from '@/components/DocumentSkeleton';
+import { DocumentSkeleton } from '@/components/documents/DocumentSkeleton';
 import { HTMLViewer } from '@/components/views/HTMLViewer';
-import { DocumentSettings } from '@/components/DocumentSettings';
+import { DocumentSettings } from '@/components/documents/DocumentSettings';
 import { RateLimitPauseButton } from '@/components/player/RateLimitPauseButton';
 import { Header } from '@/components/Header';
 import { useTTS } from "@/contexts/TTSContext";
 import TTSPlayer from '@/components/player/TTSPlayer';
 import { resolveDocumentId } from '@/lib/dexie';
-import { DocumentHeaderMenu } from '@/components/DocumentHeaderMenu';
+import { DocumentHeaderMenu } from '@/components/documents/DocumentHeaderMenu';
 import { RateLimitBanner } from '@/components/auth/RateLimitBanner';
 import { useAuthRateLimit } from '@/contexts/AuthRateLimitContext';
 

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

@@ -5,10 +5,10 @@ import { usePDF } from '@/contexts/PDFContext';
 import { useParams, useRouter } from 'next/navigation';
 import Link from 'next/link';
 import { useCallback, useEffect, useRef, useState } from 'react';
-import { DocumentSkeleton } from '@/components/DocumentSkeleton';
+import { DocumentSkeleton } from '@/components/documents/DocumentSkeleton';
 import { useTTS } from '@/contexts/TTSContext';
-import { DocumentSettings } from '@/components/DocumentSettings';
+import { DocumentSettings } from '@/components/documents/DocumentSettings';
-import { DocumentHeaderMenu } from '@/components/DocumentHeaderMenu';
+import { DocumentHeaderMenu } from '@/components/documents/DocumentHeaderMenu';
 import { Header } from '@/components/Header';
 import { AudiobookExportModal } from '@/components/AudiobookExportModal';
 import type { TTSAudiobookChapter } from '@/types/tts';

src/components/HomeContent.tsx

@@ -1,6 +1,6 @@
 'use client';
 
-import { DocumentUploader } from '@/components/DocumentUploader';
+import { DocumentUploader } from '@/components/documents/DocumentUploader';
 import { DocumentList } from '@/components/doclist/DocumentList';
 import { DocumentListSkeleton } from '@/components/doclist/DocumentListSkeleton';
 import { useDocuments } from '@/contexts/DocumentContext';

src/components/SettingsModal.tsx

@@ -29,7 +29,7 @@ import { ConfirmDialog } from '@/components/ConfirmDialog';
 import { ProgressPopup } from '@/components/ProgressPopup';
 import { useTimeEstimation } from '@/hooks/useTimeEstimation';
 import { THEMES } from '@/contexts/ThemeContext';
-import { DocumentSelectionModal } from '@/components/DocumentSelectionModal';
+import { DocumentSelectionModal } from '@/components/documents/DocumentSelectionModal';
 import { BaseDocument } from '@/types/documents';
 import { getAuthClient } from '@/lib/auth-client';
 import { useAuthSession } from '@/hooks/useAuthSession';

src/components/doclist/DocumentList.tsx

@@ -13,7 +13,7 @@ import { SortControls } from '@/components/doclist/SortControls';
 import { CreateFolderDialog } from '@/components/doclist/CreateFolderDialog';
 import { DocumentListSkeleton } from '@/components/doclist/DocumentListSkeleton';
 import { Button } from '@headlessui/react';
-import { DocumentUploader } from '@/components/DocumentUploader';
+import { DocumentUploader } from '@/components/documents/DocumentUploader';
 
 type DocumentToDelete = {
   id: string;
@@ -318,7 +318,7 @@ export function DocumentList() {
             onViewModeChange={setViewMode}
           />
         </div>
-        
+
         <p className="text-xs text-muted mb-2" data-doc-summary>
           {summaryParts.join(' • ')}{summaryParts.length ? ' • ' : ''}{totalSizeMB} MB total
         </p>

src/components/documents/DocumentHeaderMenu.tsx

@@ -3,7 +3,7 @@
 import { Menu, MenuButton, MenuItem, MenuItems, Transition } from '@headlessui/react';
 import { Fragment } from 'react';
 import { DotsVerticalIcon, FileSettingsIcon, DownloadIcon } from '@/components/icons/Icons';
-import { ZoomControl } from '@/components/ZoomControl';
+import { ZoomControl } from '@/components/documents/ZoomControl';
 import { UserMenu } from '@/components/auth/UserMenu';
 
 interface DocumentHeaderMenuProps {

src/components/views/EPUBViewer.tsx

@@ -5,7 +5,7 @@ import dynamic from 'next/dynamic';
 import { useEPUB } from '@/contexts/EPUBContext';
 import { useTTS } from '@/contexts/TTSContext';
 import { useConfig } from '@/contexts/ConfigContext';
-import { DocumentSkeleton } from '@/components/DocumentSkeleton';
+import { DocumentSkeleton } from '@/components/documents/DocumentSkeleton';
 import { useEPUBTheme, getThemeStyles } from '@/hooks/epub/useEPUBTheme';
 import { useEPUBResize } from '@/hooks/epub/useEPUBResize';
 import { DotsVerticalIcon, ChevronLeftIcon, ChevronRightIcon } from '@/components/icons/Icons';

src/components/views/HTMLViewer.tsx

@@ -4,7 +4,7 @@ import { useRef } from 'react';
 import ReactMarkdown from 'react-markdown';
 import remarkGfm from 'remark-gfm';
 import { useHTML } from '@/contexts/HTMLContext';
-import { DocumentSkeleton } from '@/components/DocumentSkeleton';
+import { DocumentSkeleton } from '@/components/documents/DocumentSkeleton';
 
 interface HTMLViewerProps {
   className?: string;
@@ -19,21 +19,21 @@ export function HTMLViewer({ className = '' }: HTMLViewerProps) {
   }
 
   // Check if the file is a txt file
-    const isTxtFile = currDocName?.toLowerCase().endsWith('.txt');
+  const isTxtFile = currDocName?.toLowerCase().endsWith('.txt');
 
-    return (
+  return (
-      <div className={`flex flex-col h-full ${className}`} ref={containerRef}>
+    <div className={`flex flex-col h-full ${className}`} ref={containerRef}>
-        <div className="flex-1 overflow-auto">
+      <div className="flex-1 overflow-auto">
-          <div className={`html-container min-w-full px-4 py-4 ${isTxtFile ? 'whitespace-pre-wrap font-mono text-sm' : 'prose prose-base'}`}>
+        <div className={`html-container min-w-full px-4 py-4 ${isTxtFile ? 'whitespace-pre-wrap font-mono text-sm' : 'prose prose-base'}`}>
-            {isTxtFile ? (
+          {isTxtFile ? (
-              currDocData
+            currDocData
-            ) : (
+          ) : (
-              <ReactMarkdown remarkPlugins={[remarkGfm]}>
+            <ReactMarkdown remarkPlugins={[remarkGfm]}>
-                {currDocData}
+              {currDocData}
-              </ReactMarkdown>
+            </ReactMarkdown>
-            )}
+          )}
-          </div>
         </div>
       </div>
+    </div>
   );
 }

src/components/views/PDFViewer.tsx

@@ -5,7 +5,7 @@ import { Document, Page } from 'react-pdf';
 import type { Dest } from 'react-pdf/src/shared/types.js';
 import 'react-pdf/dist/Page/AnnotationLayer.css';
 import 'react-pdf/dist/Page/TextLayer.css';
-import { DocumentSkeleton } from '@/components/DocumentSkeleton';
+import { DocumentSkeleton } from '@/components/documents/DocumentSkeleton';
 import { useTTS } from '@/contexts/TTSContext';
 import { usePDF } from '@/contexts/PDFContext';
 import { useConfig } from '@/contexts/ConfigContext';