Resolve merge conflicts for PR #25: customizable mobile reading experience

- Backend: Replace PR's Book-only models with main's full models
  (EBook, BookChapter, DownloadRecord, ReadingProgress, ReadingSettings)
- Backend: Add reader app (ReadingSettings model, serializer, view, URL)
- Frontend: Port reader feature files from web/ to frontend/ (api, hooks,
  components/reader/, pages/ReadingPage, types/reader, reader.css)
- Frontend: Add /read/:id route to App.tsx for chapter-based reading view
- All imports adjusted for frontend/src directory structure

README.md

@@ -1,90 +1,38 @@
 # Cloud Reader
 
-A full-stack e-book reader application with cross-device sync. Upload EPUB/PDF files, track reading progress, bookmark passages, take notes, and customize your reading experience.
+A full-stack cloud-based e-book reader application with cross-device synchronization.
 
 ## Architecture
 
-```
+- **Backend**: Django 5.x + Django REST Framework
-cloud-reader/
+- **Frontend**: React with TypeScript
-├── backend/         # Django REST API (canonical backend)
+- **Database**: PostgreSQL
-│   ├── config/      # Django project settings
+- **Monorepo**: Yarn workspaces
-│   ├── apps/
-│   │   ├── users/       # User auth (JWT)
-│   │   ├── books/       # Books, e-books, reading progress, settings
-│   │   └── annotations/ # Bookmarks and notes
-│   ├── manage.py
-│   └── requirements.txt
-├── frontend/        # React + Vite + TypeScript (web frontend)
-│   ├── src/
-│   │   ├── api/         # API client (axios with JWT refresh)
-│   │   ├── components/  # Reusable components
-│   │   ├── context/     # Auth and annotations context
-│   │   ├── hooks/       # Custom hooks
-│   │   ├── pages/       # Route pages (Library, Reader, AddBook, Auth, Settings)
-│   │   └── types/       # TypeScript type definitions
-│   └── package.json
-├── mobile/          # Expo React Native app (mobile frontend)
-│   ├── src/
-│   │   ├── api/         # API client (axios with JWT refresh via AsyncStorage)
-│   │   ├── components/  # Reusable UI components
-│   │   ├── context/     # Auth context
-│   │   ├── hooks/       # Custom hooks
-│   │   ├── navigation/  # React Navigation (Auth stack + Main tabs)
-│   │   ├── screens/     # Screen-level components (Login, Library, etc.)
-│   │   └── types/       # Mobile-specific types
-│   ├── App.tsx
-│   └── app.json
-├── packages/
-│   └── shared/       # @cloud-reader/shared — domain types & utilities
-│       └── src/
-│           ├── types.ts   # Shared domain types (Book, User, Bookmark, Note, etc.)
-│           └── utils.ts   # Date formatting, validation, API endpoint constants
-├── package.json      # Root — yarn workspaces config
-└── docker-compose.yml
-```
 
-## Quick Start
+## Getting Started
 
-### Docker (recommended)
+### Prerequisites
-```bash
+- Python 3.12+
-docker compose up --build
+- Node.js 20+
-```
+- PostgreSQL 15+
-- **Frontend:** http://localhost:5173
-- **Backend API:** http://localhost:8000/api/
 
-### Backend (standalone)
+### Backend Setup
 ```bash
 cd backend
+python -m venv .venv
+source .venv/bin/activate
 pip install -r requirements.txt
 python manage.py migrate
 python manage.py runserver
 ```
 
-### Frontend (standalone)
+### Frontend Setup
 ```bash
 cd frontend
 yarn install
 yarn dev
 ```
 
-### Mobile (Expo)
+## Projects
-```bash
-# From monorepo root — installs all workspaces including mobile
-yarn install
 
-# Start Expo dev server
+See [Gitea Issues](https://gitea-dev.codescripters.org/crisleo-hermes/cloud-reader/issues) for the full roadmap.
-yarn workspace @cloud-reader/mobile start
-
-# Or cd into mobile and run directly
-cd mobile
-npx expo start
-```
-
-> The mobile app requires the backend to be running. Set `EXPO_PUBLIC_API_URL` environment variable in your shell or `.env` file to point to the backend (defaults to `http://10.0.2.2:8000` for Android emulator).
-
-## Migration Notes
-Consolidated from duplicate `api/` + `web/` into single `backend/` + `frontend/` canonical structure.
-- `backend/` kept as canonical; `api/` features (e-book uploads, reading progress, reading settings) merged in.
-- `frontend/` kept as canonical; `web/` pages (Library, Reader, AddBook, Auth, Settings) merged in.
-- `api/` and `web/` directories removed.
-- `mobile/` added as Expo React Native app with shared `@cloud-reader/shared` package.

api/Dockerfile

@@ -6,10 +6,10 @@ RUN apt-get update && apt-get install -y --no-install-recommends \
     libpq-dev gcc && \
     rm -rf /var/lib/apt/lists/*
 
-COPY requirements.txt ./
+COPY pyproject.toml ./
-RUN pip install --no-cache-dir -r requirements.txt
+RUN pip install uv && uv sync --frozen
 
-COPY . ./
+COPY . .
 
 RUN mkdir -p media
 

api/books/admin.py

@@ -0,0 +1,20 @@
+from django.contrib import admin
+
+from books.models import Book, ReadingProgress, ReadingSettings
+
+
+@admin.register(Book)
+class BookAdmin(admin.ModelAdmin):
+    list_display = ["title", "author", "user", "created_at"]
+    list_filter = ["created_at", "user"]
+    search_fields = ["title", "author"]
+
+
+@admin.register(ReadingProgress)
+class ReadingProgressAdmin(admin.ModelAdmin):
+    list_display = ["book", "user", "current_position", "updated_at"]
+
+
+@admin.register(ReadingSettings)
+class ReadingSettingsAdmin(admin.ModelAdmin):
+    list_display = ["user", "font_size", "font_style", "background_color"]

api/books/apps.py

@@ -0,0 +1,6 @@
+from django.apps import AppConfig
+
+
+class BooksConfig(AppConfig):
+    default_auto_field = "django.db.models.BigAutoField"
+    name = "books"

api/books/management/__init__.py

@@ -0,0 +1 @@
+# management/__init__.py

api/books/management/commands/__init__.py

@@ -0,0 +1 @@
+# management/commands/__init__.py

api/books/management/commands/seed_books.py

@@ -0,0 +1,134 @@
+"""
+Management command to seed sample book data for development and testing.
+"""
+from __future__ import annotations
+
+from typing import Any
+
+from django.core.management.base import BaseCommand
+
+from books.models import Book, ReadingStatus
+
+SAMPLE_BOOKS: list[dict[str, Any]] = [
+    {
+        "title": "The Great Gatsby",
+        "author": "F. Scott Fitzgerald",
+        "genre": "Classic Literature",
+        "description": "A story of the mysteriously wealthy Jay Gatsby and his love for the beautiful Daisy Buchanan.",
+        "reading_status": ReadingStatus.FINISHED,
+    },
+    {
+        "title": "To Kill a Mockingbird",
+        "author": "Harper Lee",
+        "genre": "Classic Literature",
+        "description": "The unforgettable novel of a childhood in a sleepy Southern town and the crisis of conscience that rocked it.",
+        "reading_status": ReadingStatus.FINISHED,
+    },
+    {
+        "title": "1984",
+        "author": "George Orwell",
+        "genre": "Science Fiction",
+        "description": "A dystopian social science fiction novel and cautionary tale about the future of totalitarianism.",
+        "reading_status": ReadingStatus.READING,
+    },
+    {
+        "title": "Dune",
+        "author": "Frank Herbert",
+        "genre": "Science Fiction",
+        "description": "Set on the desert planet Arrakis, it is one of the world's best-selling science fiction novels.",
+        "reading_status": ReadingStatus.FINISHED,
+    },
+    {
+        "title": "The Hobbit",
+        "author": "J.R.R. Tolkien",
+        "genre": "Fantasy",
+        "description": "Bilbo Baggins is swept into a quest to reclaim the lost Dwarf Kingdom of Erebor from the fearsome dragon Smaug.",
+        "reading_status": ReadingStatus.FINISHED,
+    },
+    {
+        "title": "Pride and Prejudice",
+        "author": "Jane Austen",
+        "genre": "Romance",
+        "description": "A romantic novel of manners that follows the character development of Elizabeth Bennet.",
+        "reading_status": ReadingStatus.WANT_TO_READ,
+    },
+    {
+        "title": "The Martian",
+        "author": "Andy Weir",
+        "genre": "Science Fiction",
+        "description": "An astronaut becomes stranded alone on Mars and must find a way to signal that he is alive.",
+        "reading_status": ReadingStatus.READING,
+    },
+    {
+        "title": "The Catcher in the Rye",
+        "author": "J.D. Salinger",
+        "genre": "Classic Literature",
+        "description": "The story of Holden Caulfield's experiences in New York City after being expelled from prep school.",
+        "reading_status": ReadingStatus.DNF,
+    },
+    {
+        "title": "The Alchemist",
+        "author": "Paulo Coelho",
+        "genre": "Philosophy",
+        "description": "A young Andalusian shepherd follows his dream to find treasure at the Egyptian pyramids.",
+        "reading_status": ReadingStatus.WANT_TO_READ,
+    },
+    {
+        "title": "Neuromancer",
+        "author": "William Gibson",
+        "genre": "Science Fiction",
+        "description": "The novel that launched the cyberpunk genre, following washed-up computer hacker Henry Case.",
+        "reading_status": ReadingStatus.FINISHED,
+    },
+    {
+        "title": "The Name of the Wind",
+        "author": "Patrick Rothfuss",
+        "genre": "Fantasy",
+        "description": "The tale of the magically gifted young man who grows to be the most notorious wizard his world has ever seen.",
+        "reading_status": ReadingStatus.READING,
+    },
+    {
+        "title": "Gone Girl",
+        "author": "Gillian Flynn",
+        "genre": "Thriller",
+        "description": "A mystery thriller about a wife's disappearance on the day of her fifth wedding anniversary.",
+        "reading_status": ReadingStatus.FINISHED,
+    },
+    {
+        "title": "Sapiens",
+        "author": "Yuval Noah Harari",
+        "genre": "Non-Fiction",
+        "description": "A brief history of humankind, exploring how biology and history have defined us.",
+        "reading_status": ReadingStatus.FINISHED,
+    },
+    {
+        "title": "The Road",
+        "author": "Cormac McCarthy",
+        "genre": "Post-Apocalyptic",
+        "description": "A father and his young son walk alone through burned America heading toward the coast.",
+        "reading_status": ReadingStatus.WANT_TO_READ,
+    },
+    {
+        "title": "The Three-Body Problem",
+        "author": "Cixin Liu",
+        "genre": "Science Fiction",
+        "description": "The first novel in the Remembrance of Earth's Past trilogy, a blend of physics and alien contact.",
+        "reading_status": ReadingStatus.READING,
+    },
+]
+
+
+class Command(BaseCommand):
+    """Seed the database with sample books."""
+
+    help = "Seeds the database with sample books for development and testing."
+
+    def handle(self, *args: Any, **options: Any) -> str | None:
+        for i, book_data in enumerate(SAMPLE_BOOKS):
+            Book.objects.get_or_create(
+                title=book_data["title"],
+                author=book_data["author"],
+                defaults=book_data,
+            )
+        count = Book.objects.count()
+        self.stdout.write(self.style.SUCCESS(f"Seeded {count} books into the database."))

api/books/migrations/0001_initial.py

@@ -0,0 +1,56 @@
+import django.db.models.deletion
+from django.db import migrations, models
+
+
+class Migration(migrations.Migration):
+
+    initial = True
+
+    dependencies: list = []
+
+    operations = [
+        migrations.CreateModel(
+            name="Book",
+            fields=[
+                (
+                    "id",
+                    models.BigAutoField(
+                        auto_created=True,
+                        primary_key=True,
+                        serialize=False,
+                        verbose_name="ID",
+                    ),
+                ),
+                ("title", models.CharField(db_index=True, max_length=500)),
+                ("author", models.CharField(db_index=True, max_length=300)),
+                ("genre", models.CharField(db_index=True, max_length=100)),
+                ("description", models.TextField(blank=True, default="")),
+                (
+                    "reading_status",
+                    models.CharField(
+                        choices=[
+                            ("want_to_read", "Want to Read"),
+                            ("reading", "Reading"),
+                            ("finished", "Finished"),
+                            ("dnf", "Did Not Finish"),
+                        ],
+                        db_index=True,
+                        default="want_to_read",
+                        max_length=20,
+                    ),
+                ),
+                ("cover_url", models.URLField(blank=True, default="")),
+                ("created_at", models.DateTimeField(auto_now_add=True)),
+                ("updated_at", models.DateTimeField(auto_now=True)),
+            ],
+            options={
+                "ordering": ["title"],
+                "indexes": [
+                    models.Index(
+                        fields=["title", "author", "genre"],
+                        name="books_book_title_2cc25e_idx",
+                    )
+                ],
+            },
+        ),
+    ]

api/books/migrations/__init__.py

@@ -0,0 +1 @@
+# migrations/__init__.py

api/books/models.py

@@ -0,0 +1,111 @@
+from enum import StrEnum
+from pathlib import Path
+
+from django.conf import settings
+from django.core.validators import FileExtensionValidator
+from django.db import models
+from django.db.models.signals import post_delete
+from django.dispatch import receiver
+
+
+class FontStyle(StrEnum):
+    SANS_SERIF = "sans-serif"
+    SERIF = "serif"
+    MONOSPACE = "monospace"
+
+
+class BackgroundColor(StrEnum):
+    WHITE = "#ffffff"
+    SEPIA = "#f4e4c1"
+    DARK = "#1a1a2e"
+    GREEN = "#c7edcc"
+
+
+class Book(models.Model):
+    user = models.ForeignKey(
+        settings.AUTH_USER_MODEL,
+        on_delete=models.CASCADE,
+        related_name="books",
+    )
+    title = models.CharField(max_length=512)
+    author = models.CharField(max_length=256, blank=True, default="")
+    file = models.FileField(
+        upload_to="books/%Y/%m/%d/",
+        validators=[FileExtensionValidator(allowed_extensions=["epub", "pdf"])],
+    )
+    cover_image = models.ImageField(upload_to="covers/%Y/%m/%d/", blank=True, null=True)
+    created_at = models.DateTimeField(auto_now_add=True)
+    updated_at = models.DateTimeField(auto_now=True)
+
+    class Meta:
+        ordering = ["-created_at"]
+        indexes = [
+            models.Index(fields=["user", "-created_at"]),
+        ]
+
+    def __str__(self) -> str:
+        return self.title
+
+    def filename(self) -> str:
+        return Path(self.file.name).name
+
+
+@receiver(post_delete, sender=Book)
+def _auto_delete_file_on_delete(sender: type[Book], instance: Book, **kwargs: object) -> None:
+    """Delete the uploaded file when the Book record is deleted."""
+    if instance.file:
+        instance.file.delete(save=False)
+    if instance.cover_image:
+        instance.cover_image.delete(save=False)
+
+
+class ReadingProgress(models.Model):
+    user = models.ForeignKey(
+        settings.AUTH_USER_MODEL,
+        on_delete=models.CASCADE,
+        related_name="reading_progress",
+    )
+    book = models.OneToOneField(
+        Book,
+        on_delete=models.CASCADE,
+        related_name="reading_progress",
+    )
+    current_position = models.FloatField(default=0.0)
+    """Position in the book as a percentage (0.0 to 100.0)"""
+    last_page = models.IntegerField(default=0)
+    """Last page/paragraph index for granular tracking"""
+    updated_at = models.DateTimeField(auto_now=True)
+
+    class Meta:
+        verbose_name_plural = "reading progress"
+        unique_together = [("user", "book")]
+
+    def __str__(self) -> str:
+        return f"{self.book.title} — {self.current_position:.1f}%"
+
+
+class ReadingSettings(models.Model):
+    user = models.OneToOneField(
+        settings.AUTH_USER_MODEL,
+        on_delete=models.CASCADE,
+        related_name="reading_settings",
+    )
+    font_size = models.IntegerField(default=18)
+    """Font size in pixels (min 12, max 36)"""
+    font_style = models.CharField(
+        max_length=20,
+        choices=[(s.value, s.name.replace("_", " ").title()) for s in FontStyle],
+        default=FontStyle.SANS_SERIF.value,
+    )
+    background_color = models.CharField(
+        max_length=7,
+        choices=[(c.value, c.name.title()) for c in BackgroundColor],
+        default=BackgroundColor.WHITE.value,
+    )
+    updated_at = models.DateTimeField(auto_now=True)
+
+    class Meta:
+        verbose_name_plural = "reading settings"
+
+    def __str__(self) -> str:
+        return f"Settings for {self.user}"

api/books/serializers.py

@@ -0,0 +1,136 @@
+from rest_framework import serializers
+
+from books.models import Book, FontStyle, BackgroundColor, ReadingProgress, ReadingSettings
+
+
+class BookListSerializer(serializers.ModelSerializer):
+    """Lightweight serializer for the library listing — no file or progress data."""
+
+    filename = serializers.CharField(read_only=True)
+    progress = serializers.SerializerMethodField()
+
+    class Meta:
+        model = Book
+        fields = [
+            "id",
+            "title",
+            "author",
+            "filename",
+            "cover_image",
+            "created_at",
+            "progress",
+        ]
+
+    def get_progress(self, obj: Book) -> float | None:
+        try:
+            return obj.reading_progress.current_position
+        except ReadingProgress.DoesNotExist:
+            return None
+
+
+class BookDetailSerializer(serializers.ModelSerializer):
+    """Full serializer for the reader view — includes file URL and progress."""
+
+    filename = serializers.CharField(read_only=True)
+    file_url = serializers.SerializerMethodField()
+    progress = serializers.SerializerMethodField()
+
+    class Meta:
+        model = Book
+        fields = [
+            "id",
+            "title",
+            "author",
+            "filename",
+            "file_url",
+            "cover_image",
+            "created_at",
+            "updated_at",
+            "progress",
+        ]
+
+    def get_file_url(self, obj: Book) -> str:
+        request = self.context.get("request")
+        if request and obj.file:
+            return request.build_absolute_uri(obj.file.url)
+        return ""
+
+    def get_progress(self, obj: Book) -> dict | None:
+        try:
+            rp = obj.reading_progress
+            return {
+                "current_position": rp.current_position,
+                "last_page": rp.last_page,
+            }
+        except ReadingProgress.DoesNotExist:
+            return None
+
+
+class BookUploadSerializer(serializers.ModelSerializer):
+    """Serializer for uploading a new book."""
+
+    class Meta:
+        model = Book
+        fields = ["title", "author", "file", "cover_image"]
+        extra_kwargs = {
+            "title": {"required": True},
+            "file": {"required": True},
+        }
+
+    def validate_file(self, value: object) -> object:
+        import os
+        if isinstance(value, type(None)):
+            return value
+        ext = os.path.splitext(str(getattr(value, 'name', '')))[1].lower()
+        if ext not in (".epub", ".pdf"):
+            raise serializers.ValidationError(
+                "Only EPUB and PDF files are supported."
+            )
+        return value
+
+    def create(self, validated_data: dict) -> Book:
+        validated_data["user"] = self.context["request"].user
+        return super().create(validated_data)
+
+
+class ReadingProgressSerializer(serializers.ModelSerializer):
+    class Meta:
+        model = ReadingProgress
+        fields = ["current_position", "last_page"]
+        extra_kwargs = {
+            "current_position": {"required": True, "min_value": 0.0, "max_value": 100.0},
+        }
+
+    def validate_current_position(self, value: float) -> float:
+        if value < 0.0 or value > 100.0:
+            raise serializers.ValidationError(
+                "Position must be between 0.0 and 100.0."
+            )
+        return value
+
+
+class ReadingSettingsSerializer(serializers.ModelSerializer):
+    class Meta:
+        model = ReadingSettings
+        fields = ["font_size", "font_style", "background_color"]
+
+    def validate_font_size(self, value: int) -> int:
+        if value < 12 or value > 36:
+            raise serializers.ValidationError("Font size must be between 12 and 36.")
+        return value
+
+    def validate_font_style(self, value: str) -> str:
+        valid = [s.value for s in FontStyle]
+        if value not in valid:
+            raise serializers.ValidationError(
+                f"Font style must be one of: {', '.join(valid)}"
+            )
+        return value
+
+    def validate_background_color(self, value: str) -> str:
+        valid = [c.value for c in BackgroundColor]
+        if value not in valid:
+            raise serializers.ValidationError(
+                f"Background color must be one of: {', '.join(valid)}"
+            )
+        return value

api/books/urls.py

@@ -0,0 +1,15 @@
+from django.urls import include, path
+from rest_framework.routers import DefaultRouter
+
+from books.views import BookViewSet, ReadingSettingsViewSet
+
+router = DefaultRouter()
+router.register(r"books", BookViewSet, basename="book")
+
+urlpatterns = [
+    path("", include(router.urls)),
+    path("settings/", ReadingSettingsViewSet.as_view({
+        "get": "list",
+        "patch": "partial_update",
+    }), name="reading-settings"),
+]

api/books/views.py

@@ -0,0 +1,88 @@
+from django.shortcuts import get_object_or_404
+from rest_framework import parsers, permissions, status, viewsets
+from rest_framework.decorators import action
+from rest_framework.request import Request
+from rest_framework.response import Response
+
+from books.models import Book, ReadingProgress, ReadingSettings
+from books.serializers import (
+    BookDetailSerializer,
+    BookListSerializer,
+    BookUploadSerializer,
+    ReadingProgressSerializer,
+    ReadingSettingsSerializer,
+)
+
+
+class IsBookOwner(permissions.BasePermission):
+    """Only the owner of a book can access it."""
+
+    def has_object_permission(
+        self, request: Request, view: object, obj: Book
+    ) -> bool:
+        return obj.user == request.user
+
+
+class BookViewSet(viewsets.ModelViewSet):
+    """API endpoint for managing user books."""
+
+    parser_classes = [parsers.MultiPartParser, parsers.FormParser, parsers.JSONParser]
+    permission_classes = [permissions.IsAuthenticated, IsBookOwner]
+
+    def get_serializer_class(self) -> type:
+        if self.action == "create":
+            return BookUploadSerializer
+        if self.action == "list":
+            return BookListSerializer
+        return BookDetailSerializer
+
+    def get_queryset(self):
+        return (
+            Book.objects.filter(user=self.request.user)
+            .select_related("reading_progress", "user")
+            .prefetch_related()
+        )
+
+    @action(detail=True, methods=["get", "patch"])
+    def progress(self, request: Request, pk: int | None = None) -> Response:
+        """Get or update reading progress for a specific book."""
+        book = self.get_object()
+        progress, _created = ReadingProgress.objects.get_or_create(
+            user=request.user,
+            book=book,
+        )
+
+        if request.method == "GET":
+            serializer = ReadingProgressSerializer(progress)
+            return Response(serializer.data)
+
+        serializer = ReadingProgressSerializer(progress, data=request.data, partial=True)
+        serializer.is_valid(raise_exception=True)
+        serializer.save()
+        return Response(serializer.data)
+
+
+class ReadingSettingsViewSet(viewsets.GenericViewSet):
+    """API endpoint for user reading settings."""
+
+    permission_classes = [permissions.IsAuthenticated]
+    serializer_class = ReadingSettingsSerializer
+
+    def get_queryset(self):
+        return ReadingSettings.objects.filter(user=self.request.user)
+
+    def list(self, request: Request) -> Response:
+        settings, _created = ReadingSettings.objects.get_or_create(
+            user=request.user,
+        )
+        serializer = self.get_serializer(settings)
+        return Response(serializer.data)
+
+    def partial_update(self, request: Request) -> Response:
+        settings, _created = ReadingSettings.objects.get_or_create(
+            user=request.user,
+        )
+        serializer = self.get_serializer(settings, data=request.data, partial=True)
+        serializer.is_valid(raise_exception=True)
+        serializer.save()
+        return Response(serializer.data)

api/manage.py

@@ -0,0 +1,21 @@
+#!/usr/bin/env python
+"""Django's command-line utility for administrative tasks."""
+import os
+import sys
+
+
+def main() -> None:
+    os.environ.setdefault("DJANGO_SETTINGS_MODULE", "project.settings")
+    try:
+        from django.core.management import execute_from_command_line
+    except ImportError as exc:
+        raise ImportError(
+            "Couldn't import Django. Are you sure it's installed and "
+            "available on your PYTHONPATH environment variable? Did you "
+            "forget to activate a virtual environment?"
+        ) from exc
+    execute_from_command_line(sys.argv)
+
+
+if __name__ == "__main__":
+    main()

api/project/settings.py

@@ -0,0 +1,109 @@
+import os
+from pathlib import Path
+
+BASE_DIR = Path(__file__).resolve().parent.parent
+
+SECRET_KEY = os.environ.get("DJANGO_SECRET_KEY", "django-insecure-dev-change-me")
+DEBUG = os.environ.get("DJANGO_DEBUG", "True").lower() in ("true", "1", "yes")
+ALLOWED_HOSTS: list[str] = ["*"]
+
+INSTALLED_APPS = [
+    "django.contrib.admin",
+    "django.contrib.auth",
+    "django.contrib.contenttypes",
+    "django.contrib.sessions",
+    "django.contrib.messages",
+    "django.contrib.staticfiles",
+    # Third-party
+    "rest_framework",
+    "rest_framework.authtoken",
+    "corsheaders",
+    # Local
+    "books",
+]
+
+MIDDLEWARE = [
+    "corsheaders.middleware.CorsMiddleware",
+    "django.middleware.security.SecurityMiddleware",
+    "django.contrib.sessions.middleware.SessionMiddleware",
+    "django.middleware.common.CommonMiddleware",
+    "django.middleware.csrf.CsrfViewMiddleware",
+    "django.contrib.auth.middleware.AuthenticationMiddleware",
+    "django.contrib.messages.middleware.MessageMiddleware",
+    "django.middleware.clickjacking.XFrameOptionsMiddleware",
+]
+
+ROOT_URLCONF = "project.urls"
+
+TEMPLATES = [
+    {
+        "BACKEND": "django.template.backends.django.DjangoTemplates",
+        "DIRS": [],
+        "APP_DIRS": True,
+        "OPTIONS": {
+            "context_processors": [
+                "django.template.context_processors.debug",
+                "django.template.context_processors.request",
+                "django.contrib.auth.context_processors.auth",
+                "django.contrib.messages.context_processors.messages",
+            ],
+        },
+    },
+]
+
+WSGI_APPLICATION = "project.wsgi.application"
+
+# ── Database ──────────────────────────────────────────────
+_database_url = os.environ.get(
+    "DATABASE_URL",
+    "postgres://cloudreader:cloudreader@localhost:5432/cloudreader",
+)
+_db_parts = _database_url.replace("postgres://", "").split("@")
+_credentials, _host_db = _db_parts[0], _db_parts[1]
+_db_user, _db_pass = _credentials.split(":")
+_host_port, _db_name = _host_db.split("/")
+_db_host = _host_port.split(":")[0]
+_db_port = _host_port.split(":")[1] if ":" in _host_port else "5432"
+
+DATABASES = {
+    "default": {
+        "ENGINE": "django.db.backends.postgresql",
+        "NAME": _db_name,
+        "USER": _db_user,
+        "PASSWORD": _db_pass,
+        "HOST": _db_host,
+        "PORT": _db_port,
+    }
+}
+
+DEFAULT_AUTO_FIELD = "django.db.models.BigAutoField"
+
+# ── Auth / Password Validation ────────────────────────────
+AUTH_PASSWORD_VALIDATORS = [
+    {"NAME": "django.contrib.auth.password_validation.MinimumLengthValidator"},
+]
+
+# ── DRF ───────────────────────────────────────────────────
+REST_FRAMEWORK = {
+    "DEFAULT_AUTHENTICATION_CLASSES": [
+        "rest_framework.authentication.TokenAuthentication",
+        "rest_framework.authentication.SessionAuthentication",
+    ],
+    "DEFAULT_PERMISSION_CLASSES": [
+        "rest_framework.permissions.IsAuthenticated",
+    ],
+}
+
+# ── CORS ──────────────────────────────────────────────────
+CORS_ALLOW_ALL_ORIGINS = True  # dev only
+
+# ── Media / Uploads ───────────────────────────────────────
+MEDIA_URL = "/media/"
+MEDIA_ROOT = BASE_DIR / "media"
+
+# ── i18n / Static ─────────────────────────────────────────
+LANGUAGE_CODE = "en-us"
+TIME_ZONE = "UTC"
+USE_I18N = True
+USE_TZ = True
+STATIC_URL = "static/"

api/project/urls.py

@@ -0,0 +1,7 @@
+from django.contrib import admin
+from django.urls import include, path
+
+urlpatterns = [
+    path("admin/", admin.site.urls),
+    path("api/", include("books.urls")),
+]

api/project/wsgi.py

@@ -0,0 +1,6 @@
+import os
+
+from django.core.wsgi import get_wsgi_application
+
+os.environ.setdefault("DJANGO_SETTINGS_MODULE", "project.settings")
+application = get_wsgi_application()

api/pyproject.toml

@@ -0,0 +1,21 @@
+[project]
+name = "api"
+version = "1.0.0"
+description = "Cloud Reader API — Book Search and Discovery"
+requires-python = ">=3.12"
+dependencies = [
+    "django>=5.1,<6.0",
+    "djangorestframework>=3.15,<4.0",
+    "django-cors-headers>=4.4,<5.0",
+    "django-filter>=24.3,<25.0",
+    "psycopg2-binary>=2.9,<3.0",
+    "pydantic>=2.0,<3.0",
+    "pydantic-settings>=2.0,<3.0",
+]
+
+[build-system]
+requires = ["setuptools"]
+build-backend = "setuptools.build_meta"
+
+[tool.setuptools.packages.find]
+include = ["books*", "project*"]

api/uv.lock

@@ -0,0 +1,290 @@
+version = 1
+revision = 3
+requires-python = ">=3.12"
+
+[[package]]
+name = "annotated-types"
+version = "0.7.0"
+source = { registry = "https://pypi.org/simple" }
+sdist = { url = "https://files.pythonhosted.org/packages/ee/67/531ea369ba64dcff5ec9c3402f9f51bf748cec26dde048a2f973a4eea7f5/annotated_types-0.7.0.tar.gz", hash = "sha256:aff07c09a53a08bc8cfccb9c85b05f1aa9a2a6f23728d790723543408344ce89", size = 16081, upload-time = "2024-05-20T21:33:25.928Z" }
+wheels = [
+    { url = "https://files.pythonhosted.org/packages/78/b6/6307fbef88d9b5ee7421e68d78a9f162e0da4900bc5f5793f6d3d0e34fb8/annotated_types-0.7.0-py3-none-any.whl", hash = "sha256:1f02e8b43a8fbbc3f3e0d4f0f4bfc8131bcb4eebe8849b8e5c773f3a1c582a53", size = 13643, upload-time = "2024-05-20T21:33:24.1Z" },
+]
+
+[[package]]
+name = "api"
+version = "1.0.0"
+source = { editable = "." }
+dependencies = [
+    { name = "django" },
+    { name = "django-cors-headers" },
+    { name = "django-filter" },
+    { name = "djangorestframework" },
+    { name = "psycopg2-binary" },
+    { name = "pydantic" },
+    { name = "pydantic-settings" },
+]
+
+[package.metadata]
+requires-dist = [
+    { name = "django", specifier = ">=5.1,<6.0" },
+    { name = "django-cors-headers", specifier = ">=4.4,<5.0" },
+    { name = "django-filter", specifier = ">=24.3,<25.0" },
+    { name = "djangorestframework", specifier = ">=3.15,<4.0" },
+    { name = "psycopg2-binary", specifier = ">=2.9,<3.0" },
+    { name = "pydantic", specifier = ">=2.0,<3.0" },
+    { name = "pydantic-settings", specifier = ">=2.0,<3.0" },
+]
+
+[[package]]
+name = "asgiref"
+version = "3.11.1"
+source = { registry = "https://pypi.org/simple" }
+sdist = { url = "https://files.pythonhosted.org/packages/63/40/f03da1264ae8f7cfdbf9146542e5e7e8100a4c66ab48e791df9a03d3f6c0/asgiref-3.11.1.tar.gz", hash = "sha256:5f184dc43b7e763efe848065441eac62229c9f7b0475f41f80e207a114eda4ce", size = 38550, upload-time = "2026-02-03T13:30:14.33Z" }
+wheels = [
+    { url = "https://files.pythonhosted.org/packages/5c/0a/a72d10ed65068e115044937873362e6e32fab1b7dce0046aeb224682c989/asgiref-3.11.1-py3-none-any.whl", hash = "sha256:e8667a091e69529631969fd45dc268fa79b99c92c5fcdda727757e52146ec133", size = 24345, upload-time = "2026-02-03T13:30:13.039Z" },
+]
+
+[[package]]
+name = "django"
+version = "5.2.14"
+source = { registry = "https://pypi.org/simple" }
+dependencies = [
+    { name = "asgiref" },
+    { name = "sqlparse" },
+    { name = "tzdata", marker = "sys_platform == 'win32'" },
+]
+sdist = { url = "https://files.pythonhosted.org/packages/65/95/95f7faa0950867afaa0bef2460c6263afd6a2c78cc9434046ed28160b015/django-5.2.14.tar.gz", hash = "sha256:58a63ba841662e5c686b57ba1fec52ddd68c0b93bd96ac3029d55728f00bf8a2", size = 10895118, upload-time = "2026-05-05T13:57:31.104Z" }
+wheels = [
+    { url = "https://files.pythonhosted.org/packages/14/44/f172870cf87aa25afef48fb72adba89ee8b77fcab6f3b23d240b923f1528/django-5.2.14-py3-none-any.whl", hash = "sha256:6f712143bd3064310d1f50fac859c3e9a274bdcfc9595339853be7779297fc76", size = 8311320, upload-time = "2026-05-05T13:57:25.795Z" },
+]
+
+[[package]]
+name = "django-cors-headers"
+version = "4.9.0"
+source = { registry = "https://pypi.org/simple" }
+dependencies = [
+    { name = "asgiref" },
+    { name = "django" },
+]
+sdist = { url = "https://files.pythonhosted.org/packages/21/39/55822b15b7ec87410f34cd16ce04065ff390e50f9e29f31d6d116fc80456/django_cors_headers-4.9.0.tar.gz", hash = "sha256:fe5d7cb59fdc2c8c646ce84b727ac2bca8912a247e6e68e1fb507372178e59e8", size = 21458, upload-time = "2025-09-18T10:40:52.326Z" }
+wheels = [
+    { url = "https://files.pythonhosted.org/packages/30/d8/19ed1e47badf477d17fb177c1c19b5a21da0fd2d9f093f23be3fb86c5fab/django_cors_headers-4.9.0-py3-none-any.whl", hash = "sha256:15c7f20727f90044dcee2216a9fd7303741a864865f0c3657e28b7056f61b449", size = 12809, upload-time = "2025-09-18T10:40:50.843Z" },
+]
+
+[[package]]
+name = "django-filter"
+version = "24.3"
+source = { registry = "https://pypi.org/simple" }
+dependencies = [
+    { name = "django" },
+]
+sdist = { url = "https://files.pythonhosted.org/packages/50/bc/dc19ae39c235332926dd0efe0951f663fa1a9fc6be8430737ff7fd566b20/django_filter-24.3.tar.gz", hash = "sha256:d8ccaf6732afd21ca0542f6733b11591030fa98669f8d15599b358e24a2cd9c3", size = 144444, upload-time = "2024-08-02T13:27:58.132Z" }
+wheels = [
+    { url = "https://files.pythonhosted.org/packages/09/b1/92f1c30b47c1ebf510c35a2ccad9448f73437e5891bbd2b4febe357cc3de/django_filter-24.3-py3-none-any.whl", hash = "sha256:c4852822928ce17fb699bcfccd644b3574f1a2d80aeb2b4ff4f16b02dd49dc64", size = 95011, upload-time = "2024-08-02T13:27:55.616Z" },
+]
+
+[[package]]
+name = "djangorestframework"
+version = "3.17.1"
+source = { registry = "https://pypi.org/simple" }
+dependencies = [
+    { name = "django" },
+]
+sdist = { url = "https://files.pythonhosted.org/packages/ca/d7/c016e69fac19ff8afdc89db9d31d9ae43ae031e4d1993b20aca179b8301a/djangorestframework-3.17.1.tar.gz", hash = "sha256:a6def5f447fe78ff853bff1d47a3c59bf38f5434b031780b351b0c73a62db1a5", size = 905742, upload-time = "2026-03-24T16:58:33.705Z" }
+wheels = [
+    { url = "https://files.pythonhosted.org/packages/5a/e1/2c516bdc83652b1a60c6119366ac2c0607b479ed05cd6093f916ca8928f8/djangorestframework-3.17.1-py3-none-any.whl", hash = "sha256:c3c74dd3e83a5a3efc37b3c18d92bd6f86a6791c7b7d4dff62bb068500e76457", size = 898844, upload-time = "2026-03-24T16:58:31.845Z" },
+]
+
+[[package]]
+name = "psycopg2-binary"
+version = "2.9.12"
+source = { registry = "https://pypi.org/simple" }
+sdist = { url = "https://files.pythonhosted.org/packages/2a/60/a3624f79acea344c16fbef3a94d28b89a8042ddfb8f3e4ca83f538671409/psycopg2_binary-2.9.12.tar.gz", hash = "sha256:5ac9444edc768c02a6b6a591f070b8aae28ff3a99be57560ac996001580f294c", size = 379686, upload-time = "2026-04-21T09:40:34.304Z" }
+wheels = [
+    { url = "https://files.pythonhosted.org/packages/e2/9f/ef4ef3c8e15083df90ca35265cfd1a081a2f0cc07bb229c6314c6af817f4/psycopg2_binary-2.9.12-cp312-cp312-macosx_10_13_x86_64.whl", hash = "sha256:5cdc05117180c5fa9c40eea8ea559ce64d73824c39d928b7da9fb5f6a9392433", size = 3712459, upload-time = "2026-04-20T23:34:30.549Z" },
+    { url = "https://files.pythonhosted.org/packages/b5/01/3dd14e46ba48c1e1a6ec58ee599fa1b5efa00c246d5046cd903d0eeb1af1/psycopg2_binary-2.9.12-cp312-cp312-macosx_11_0_arm64.whl", hash = "sha256:d3227a3bc228c10d21011a99245edca923e4e8bf461857e869a507d9a41fe9f6", size = 3822936, upload-time = "2026-04-20T23:34:32.77Z" },
+    { url = "https://files.pythonhosted.org/packages/a6/f7/0640e4901119d8a9f7a1784b927f494e2198e213ceb593753d1f2c8b1b30/psycopg2_binary-2.9.12-cp312-cp312-manylinux2014_ppc64le.manylinux_2_17_ppc64le.whl", hash = "sha256:995ce929eede89db6254b50827e2b7fd61e50d11f0b116b29fffe4a2e53c4580", size = 4578676, upload-time = "2026-04-20T23:34:35.18Z" },
+    { url = "https://files.pythonhosted.org/packages/b0/55/44df3965b5f297c50cc0b1b594a31c67d6127a9d133045b8a66611b14dfb/psycopg2_binary-2.9.12-cp312-cp312-manylinux2014_x86_64.manylinux_2_17_x86_64.whl", hash = "sha256:9fe06d93e72f1c048e731a2e3e7854a5bfaa58fc736068df90b352cefe66f03f", size = 4274917, upload-time = "2026-04-20T23:34:37.982Z" },
+    { url = "https://files.pythonhosted.org/packages/b0/4b/74535248b1eac0c9336862e8617c765ac94dac76f9e25d7c4a79588c8907/psycopg2_binary-2.9.12-cp312-cp312-manylinux_2_27_aarch64.manylinux_2_28_aarch64.whl", hash = "sha256:40e7b28b63aaf737cb3a1edc3a9bbc9a9f4ad3dcb7152e8c1130e4050eddcb7d", size = 5894843, upload-time = "2026-04-20T23:34:40.856Z" },
+    { url = "https://files.pythonhosted.org/packages/f2/ba/f1bf8d2ae71868ad800b661099086ee52bc0f8d9f05be1acd8ebb06757cc/psycopg2_binary-2.9.12-cp312-cp312-manylinux_2_38_riscv64.manylinux_2_39_riscv64.whl", hash = "sha256:89d19a9f7899e8eb0656a2b3a08e0da04c720a06db6e0033eab5928aabe60fa9", size = 4110556, upload-time = "2026-04-20T23:34:44.016Z" },
+    { url = "https://files.pythonhosted.org/packages/45/46/c15706c338403b7c420bcc0c2905aad116cc064545686d8bf85f1999ea00/psycopg2_binary-2.9.12-cp312-cp312-musllinux_1_2_aarch64.whl", hash = "sha256:612b965daee295ae2da8f8218ce1d274645dc76ef3f1abf6a0a94fd57eff876d", size = 3655714, upload-time = "2026-04-20T23:34:46.233Z" },
+    { url = "https://files.pythonhosted.org/packages/b3/7c/a2d5dc09b64a4564db242a0fe418fde7d33f6f8259dd2c5b9d7def00fb5a/psycopg2_binary-2.9.12-cp312-cp312-musllinux_1_2_ppc64le.whl", hash = "sha256:b9a339b79d37c1b45f3235265f07cdeb0cb5ad7acd2ac7720a5920989c17c24e", size = 3301154, upload-time = "2026-04-20T23:34:49.528Z" },
+    { url = "https://files.pythonhosted.org/packages/c0/e8/cc8c9a4ce71461f9ec548d38cadc41dc184b34c73e6455450775a9334ccd/psycopg2_binary-2.9.12-cp312-cp312-musllinux_1_2_riscv64.whl", hash = "sha256:3471336e1acfd9c7fe507b8bad5af9317b6a89294f9eb37bd9a030bb7bebcdc6", size = 3048882, upload-time = "2026-04-20T23:34:51.86Z" },
+    { url = "https://files.pythonhosted.org/packages/19/6a/31e2296bc0787c5ab75d3d118e40b239db8151b5192b90b77c72bc9256e9/psycopg2_binary-2.9.12-cp312-cp312-musllinux_1_2_x86_64.whl", hash = "sha256:7af18183109e23502c8b2ae7f6926c0882766f35b5175a4cd737ad825e4d7a1b", size = 3351298, upload-time = "2026-04-20T23:34:54.124Z" },
+    { url = "https://files.pythonhosted.org/packages/5f/a8/75f4e3e11203b590150abed2cf7794b9c9c9f7eceddae955191138b44dde/psycopg2_binary-2.9.12-cp312-cp312-win_amd64.whl", hash = "sha256:398fcd4db988c7d7d3713e2b8e18939776fd3fb447052daae4f24fa39daede4c", size = 2757230, upload-time = "2026-04-20T23:34:56.242Z" },
+    { url = "https://files.pythonhosted.org/packages/91/bb/4608c96f970f6e0c56572e87027ef4404f709382a3503e9934526d7ba051/psycopg2_binary-2.9.12-cp313-cp313-macosx_10_13_x86_64.whl", hash = "sha256:7c729a73c7b1b84de3582f73cdd27d905121dc2c531f3d9a3c32a3011033b965", size = 3712419, upload-time = "2026-04-20T23:34:58.754Z" },
+    { url = "https://files.pythonhosted.org/packages/5e/af/48f76af9d50d61cf390f8cd657b503168b089e2e9298e48465d029fcc713/psycopg2_binary-2.9.12-cp313-cp313-macosx_11_0_arm64.whl", hash = "sha256:4413d0caef93c5cf50b96863df4c2efe8c269bf2267df353225595e7e15e8df7", size = 3822990, upload-time = "2026-04-20T23:35:00.821Z" },
+    { url = "https://files.pythonhosted.org/packages/7a/df/aba0f99397cd811d32e06fc0cc781f1f3ce98bc0e729cb423925085d781a/psycopg2_binary-2.9.12-cp313-cp313-manylinux2014_ppc64le.manylinux_2_17_ppc64le.whl", hash = "sha256:4dfcf8e45ebb0c663be34a3442f65e17311f3367089cd4e5e3a3e8e62c978777", size = 4578696, upload-time = "2026-04-20T23:35:03.409Z" },
+    { url = "https://files.pythonhosted.org/packages/95/9c/eaa74021ac4e4d5c2f83d82fc6615a63f4fe6c94dc4e94c3990427053f67/psycopg2_binary-2.9.12-cp313-cp313-manylinux2014_x86_64.manylinux_2_17_x86_64.whl", hash = "sha256:c41321a14dd74aceb6a9a643b9253a334521babfa763fa873e33d89cfa122fb5", size = 4274982, upload-time = "2026-04-20T23:35:05.583Z" },
+    { url = "https://files.pythonhosted.org/packages/35/ed/c25deff98bd26187ba48b3b250a3ffc3037c46c5b89362534a15d200e0db/psycopg2_binary-2.9.12-cp313-cp313-manylinux_2_27_aarch64.manylinux_2_28_aarch64.whl", hash = "sha256:83946ba43979ebfdc99a3cd0ee775c89f221df026984ba19d46133d8d75d3cd9", size = 5894867, upload-time = "2026-04-20T23:35:07.902Z" },
+    { url = "https://files.pythonhosted.org/packages/9a/81/8d0e21ca77373c6c9589e5c4528f6e8f0c08c62cafc76fb0bddb7a2cee22/psycopg2_binary-2.9.12-cp313-cp313-manylinux_2_38_riscv64.manylinux_2_39_riscv64.whl", hash = "sha256:411e85815652d13560fbe731878daa5d92378c4995a22302071890ec3397d019", size = 4110578, upload-time = "2026-04-20T23:35:10.149Z" },
+    { url = "https://files.pythonhosted.org/packages/00/fc/f481e2435bd8f742d0123309174aae4165160ad3ef17c1b99c3622c241d2/psycopg2_binary-2.9.12-cp313-cp313-musllinux_1_2_aarch64.whl", hash = "sha256:1c8ad4c08e00f7679559eaed7aff1edfffc60c086b976f93972f686384a95e2c", size = 3655816, upload-time = "2026-04-20T23:35:12.56Z" },
+    { url = "https://files.pythonhosted.org/packages/53/79/b9f46466bdbe9f239c96cde8be33c1aace4842f06013b47b730dc9759187/psycopg2_binary-2.9.12-cp313-cp313-musllinux_1_2_ppc64le.whl", hash = "sha256:00814e40fa23c2b37ef0a1e3c749d89982c73a9cb5046137f0752a22d432e82f", size = 3301307, upload-time = "2026-04-20T23:35:15.029Z" },
+    { url = "https://files.pythonhosted.org/packages/3f/19/7dc003b32fe35024df89b658104f7c8538a8b2dcbde7a4e746ce929742e7/psycopg2_binary-2.9.12-cp313-cp313-musllinux_1_2_riscv64.whl", hash = "sha256:98062447aebc20ed20add1f547a364fd0ef8933640d5372ff1873f8deb9b61be", size = 3048968, upload-time = "2026-04-20T23:35:16.757Z" },
+    { url = "https://files.pythonhosted.org/packages/91/58/2dbd7db5c604d45f4950d988506aae672a14126ec22998ced5021cbb76bb/psycopg2_binary-2.9.12-cp313-cp313-musllinux_1_2_x86_64.whl", hash = "sha256:66a7685d7e548f10fb4ce32fb01a7b7f4aa702134de92a292c7bd9e0d3dbd290", size = 3351369, upload-time = "2026-04-20T23:35:18.933Z" },
+    { url = "https://files.pythonhosted.org/packages/42/ee/dee8dcaad07f735824de3d6563bc67119fa6c28257b17977a8d624f02fab/psycopg2_binary-2.9.12-cp313-cp313-win_amd64.whl", hash = "sha256:b6937f5fe4e180aeee87de907a2fa982ded6f7f15d7218f78a083e4e1d68f2a0", size = 2757347, upload-time = "2026-04-20T23:35:21.283Z" },
+    { url = "https://files.pythonhosted.org/packages/13/1b/708c0dca874acfad6d65314271859899a79007686f3a1f74e82a2ed4b645/psycopg2_binary-2.9.12-cp314-cp314-macosx_10_15_x86_64.whl", hash = "sha256:6f3b3de8a74ef8db215f22edffb19e32dc6fa41340456de7ec99efdc8a7b3ec2", size = 3712428, upload-time = "2026-04-20T23:35:23.453Z" },
+    { url = "https://files.pythonhosted.org/packages/d6/39/ddbea9d4b4de6aca9431b6ed253f530f8a02d3b8f9bcfd0dbfe2b3de6fe4/psycopg2_binary-2.9.12-cp314-cp314-macosx_11_0_arm64.whl", hash = "sha256:1006fb62f0f0bc5ce256a832356c6262e91be43f5e4eb15b5eaf38079464caf2", size = 3823184, upload-time = "2026-04-20T23:35:25.92Z" },
+    { url = "https://files.pythonhosted.org/packages/bf/a0/bc2fef74b106fa345567122a0659e6d94512ed7dc0131ec44c9e5aba3725/psycopg2_binary-2.9.12-cp314-cp314-manylinux2014_ppc64le.manylinux_2_17_ppc64le.whl", hash = "sha256:840066105706cd2eb29b9a1c2329620056582a4bf3e8169dec5c447042d0869f", size = 4579157, upload-time = "2026-04-20T23:35:28.542Z" },
+    { url = "https://files.pythonhosted.org/packages/57/d7/d4e3b2005d3de607ca4fbb0e8742e248056e52184a6b94ebda3c1c2c329b/psycopg2_binary-2.9.12-cp314-cp314-manylinux2014_x86_64.manylinux_2_17_x86_64.whl", hash = "sha256:863f5d12241ebe1c76a72a04c2113b6dc905f90b9cef0e9be0efd994affd9354", size = 4274970, upload-time = "2026-04-20T23:35:30.418Z" },
+    { url = "https://files.pythonhosted.org/packages/2e/42/c9853f8db3967fe08bcde11f53d53b85d351750cae726ce001cb68afa9c1/psycopg2_binary-2.9.12-cp314-cp314-manylinux_2_27_aarch64.manylinux_2_28_aarch64.whl", hash = "sha256:a99eaab34a9010f1a086b126de467466620a750634d114d20455f3a824aae033", size = 5895175, upload-time = "2026-04-20T23:35:33.584Z" },
+    { url = "https://files.pythonhosted.org/packages/eb/fd/b82b5601a97630308bef079f545ffec481bbbc795c2ba5ec416a01d03f60/psycopg2_binary-2.9.12-cp314-cp314-manylinux_2_38_riscv64.manylinux_2_39_riscv64.whl", hash = "sha256:ffdd7dc5463ccd61845ac37b7012d0f35a1548df9febe14f8dd549be4a0bc81e", size = 4110658, upload-time = "2026-04-20T23:35:35.638Z" },
+    { url = "https://files.pythonhosted.org/packages/62/8c/32ca69b0389ef25dd22937bf9e8fbe2ce27aea20b05ded48c4ce4cb42475/psycopg2_binary-2.9.12-cp314-cp314-musllinux_1_2_aarch64.whl", hash = "sha256:54a0dfecab1b48731f934e06139dfe11e24219fb6d0ceb32177cf0375f14c7b5", size = 3656251, upload-time = "2026-04-20T23:35:37.854Z" },
+    { url = "https://files.pythonhosted.org/packages/c4/29/96992a2b59e3b9d730fcf9612d0a387305025dc867a9fc490a9e496e074e/psycopg2_binary-2.9.12-cp314-cp314-musllinux_1_2_ppc64le.whl", hash = "sha256:96937c9c5d891f772430f418a7a8b4691a90c3e6b93cf72b5bd7cad8cbca32a5", size = 3301810, upload-time = "2026-04-20T23:35:39.927Z" },
+    { url = "https://files.pythonhosted.org/packages/56/ad/44b06659949b243ae10112cd3b20a197f9bf3e81d5651379b9eb889bfaad/psycopg2_binary-2.9.12-cp314-cp314-musllinux_1_2_riscv64.whl", hash = "sha256:77b348775efd4cdab410ec6609d81ccecd1139c90265fa583a7255c8064bc03d", size = 3048977, upload-time = "2026-04-20T23:35:41.806Z" },
+    { url = "https://files.pythonhosted.org/packages/1d/f2/10a1bcebadb6aa55e280e1f58975c36a7b560ea525184c7aa4064c466633/psycopg2_binary-2.9.12-cp314-cp314-musllinux_1_2_x86_64.whl", hash = "sha256:527e6342b3e44c2f0544f6b8e927d60de7f163f5723b8f1dfa7d2a84298738cd", size = 3351466, upload-time = "2026-04-20T23:35:43.993Z" },
+    { url = "https://files.pythonhosted.org/packages/20/be/b732c8418ffa5bcfda002890f5dc4c869fc17db66ff11f53b17cfe44afc0/psycopg2_binary-2.9.12-cp314-cp314-win_amd64.whl", hash = "sha256:f12ae41fcafadb39b2785e64a40f9db05d6de2ac114077457e0e7c597f3af980", size = 2848762, upload-time = "2026-04-20T23:35:46.421Z" },
+]
+
+[[package]]
+name = "pydantic"
+version = "2.13.4"
+source = { registry = "https://pypi.org/simple" }
+dependencies = [
+    { name = "annotated-types" },
+    { name = "pydantic-core" },
+    { name = "typing-extensions" },
+    { name = "typing-inspection" },
+]
+sdist = { url = "https://files.pythonhosted.org/packages/18/a5/b60d21ac674192f8ab0ba4e9fd860690f9b4a6e51ca5df118733b487d8d6/pydantic-2.13.4.tar.gz", hash = "sha256:c40756b57adaa8b1efeeced5c196f3f3b7c435f90e84ea7f443901bec8099ef6", size = 844775, upload-time = "2026-05-06T13:43:05.343Z" }
+wheels = [
+    { url = "https://files.pythonhosted.org/packages/fd/7b/122376b1fd3c62c1ed9dc80c931ace4844b3c55407b6fb2d199377c9736f/pydantic-2.13.4-py3-none-any.whl", hash = "sha256:45a282cde31d808236fd7ea9d919b128653c8b38b393d1c4ab335c62924d9aba", size = 472262, upload-time = "2026-05-06T13:43:02.641Z" },
+]
+
+[[package]]
+name = "pydantic-core"
+version = "2.46.4"
+source = { registry = "https://pypi.org/simple" }
+dependencies = [
+    { name = "typing-extensions" },
+]
+sdist = { url = "https://files.pythonhosted.org/packages/9d/56/921726b776ace8d8f5db44c4ef961006580d91dc52b803c489fafd1aa249/pydantic_core-2.46.4.tar.gz", hash = "sha256:62f875393d7f270851f20523dd2e29f082bcc82292d66db2b64ea71f64b6e1c1", size = 471464, upload-time = "2026-05-06T13:37:06.98Z" }
+wheels = [
+    { url = "https://files.pythonhosted.org/packages/ce/8c/af022f0af448d7747c5154288d46b5f2bc5f17366eaa0e23e9aa04d59f3b/pydantic_core-2.46.4-cp312-cp312-macosx_10_12_x86_64.whl", hash = "sha256:3245406455a5d98187ec35530fd772b1d799b26667980872c8d4614991e2c4a2", size = 2106158, upload-time = "2026-05-06T13:38:57.215Z" },
+    { url = "https://files.pythonhosted.org/packages/19/95/6195171e385007300f0f5574592e467c568becce2d937a0b6804f218bc49/pydantic_core-2.46.4-cp312-cp312-macosx_11_0_arm64.whl", hash = "sha256:962ccbab7b642487b1d8b7df90ef677e03134cf1fd8880bf698649b22a69371f", size = 1951724, upload-time = "2026-05-06T13:37:02.697Z" },
+    { url = "https://files.pythonhosted.org/packages/8e/bc/f47d1ff9cbb1620e1b5b697eef06010035735f07820180e74178226b27b3/pydantic_core-2.46.4-cp312-cp312-manylinux_2_17_aarch64.manylinux2014_aarch64.whl", hash = "sha256:8233f2947cf85404441fd7e0085f53b10c93e0ee78611099b5c7237e36aacbf7", size = 1975742, upload-time = "2026-05-06T13:37:09.448Z" },
+    { url = "https://files.pythonhosted.org/packages/5b/11/9b9a5b0306345664a2da6410877af6e8082481b5884b3ddd78d47c6013ce/pydantic_core-2.46.4-cp312-cp312-manylinux_2_17_armv7l.manylinux2014_armv7l.whl", hash = "sha256:3a233125ac121aa3ffba9a2b59edfc4a985a76092dc8279586ab4b71390875e7", size = 2052418, upload-time = "2026-05-06T13:37:38.234Z" },
+    { url = "https://files.pythonhosted.org/packages/f1/b7/a65fec226f5d78fc39f4a13c4cc0c768c22b113438f60c14adc9d2865038/pydantic_core-2.46.4-cp312-cp312-manylinux_2_17_ppc64le.manylinux2014_ppc64le.whl", hash = "sha256:5b712b53160b79a5850310b912a5ef8e57e56947c8ad690c227f5c9d7e561712", size = 2232274, upload-time = "2026-05-06T13:38:27.753Z" },
+    { url = "https://files.pythonhosted.org/packages/68/f0/92039db98b907ef49269a8271f67db9cb78ae2fc68062ef7e4e77adb5f61/pydantic_core-2.46.4-cp312-cp312-manylinux_2_17_s390x.manylinux2014_s390x.whl", hash = "sha256:9401557acd873c3a7f3eb9383edef8ac4968f9510e340f4808d427e75667e7b4", size = 2309940, upload-time = "2026-05-06T13:38:05.353Z" },
+    { url = "https://files.pythonhosted.org/packages/5f/97/2aab507d3d00ca626e8e57c1eac6a79e4e5fbcc63eb99733ff55d1717f65/pydantic_core-2.46.4-cp312-cp312-manylinux_2_17_x86_64.manylinux2014_x86_64.whl", hash = "sha256:926c9541b14b12b1681dca8a0b75feb510b06c6341b70a8e500c2fdcff837cce", size = 2094516, upload-time = "2026-05-06T13:39:10.577Z" },
+    { url = "https://files.pythonhosted.org/packages/22/37/a8aca44d40d737dde2bc05b3c6c07dff0de07ce6f82e9f3167aeaf4d5dea/pydantic_core-2.46.4-cp312-cp312-manylinux_2_31_riscv64.whl", hash = "sha256:56cb4851bcaf3d117eddcef4fe66afd750a50274b0da8e22be256d10e5611987", size = 2136854, upload-time = "2026-05-06T13:40:22.59Z" },
+    { url = "https://files.pythonhosted.org/packages/24/99/fcef1b79238c06a8cbec70819ac722ba76e02bc8ada9b0fd66eba40da01b/pydantic_core-2.46.4-cp312-cp312-manylinux_2_5_i686.manylinux1_i686.whl", hash = "sha256:c68fcd102d71ea85c5b2dfac3f4f8476eff42a9e078fd5faefff6d145063536b", size = 2180306, upload-time = "2026-05-06T13:40:10.666Z" },
+    { url = "https://files.pythonhosted.org/packages/ae/6c/fc44000918855b42779d007ae63b0532794739027b2f417321cddbc44f6a/pydantic_core-2.46.4-cp312-cp312-musllinux_1_1_aarch64.whl", hash = "sha256:b2f69dec1725e79a012d920df1707de5caf7ed5e08f3be4435e25803efc47458", size = 2190044, upload-time = "2026-05-06T13:40:43.231Z" },
+    { url = "https://files.pythonhosted.org/packages/6b/65/d9cadc9f1920d7a127ad2edba16c1db7916e59719285cd6c94600b0080ba/pydantic_core-2.46.4-cp312-cp312-musllinux_1_1_armv7l.whl", hash = "sha256:8d0820e8192167f80d88d64038e609c31452eeca865b4e1d9950a27a4609b00b", size = 2329133, upload-time = "2026-05-06T13:39:57.365Z" },
+    { url = "https://files.pythonhosted.org/packages/d0/cf/c873d91679f3a30bcf5e7ac280ce5573483e72295307685120d0d5ad3416/pydantic_core-2.46.4-cp312-cp312-musllinux_1_1_x86_64.whl", hash = "sha256:fbdb89b3e1c94a30cc5edfce477c6e6a5dc4d8f84665b455c27582f211a1c72c", size = 2374464, upload-time = "2026-05-06T13:38:06.976Z" },
+    { url = "https://files.pythonhosted.org/packages/47/bd/6f2fc8188f31bf10590f1e98e7b306336161fac930a8c514cd7bd828c7dc/pydantic_core-2.46.4-cp312-cp312-win32.whl", hash = "sha256:9aa768456404a8bf48a4406685ac2bec8e72b62c69313734fa3b73cf33b3a894", size = 1974823, upload-time = "2026-05-06T13:40:47.985Z" },
+    { url = "https://files.pythonhosted.org/packages/40/8c/985c1d41ea1107c2534abd9870e4ed5c8e7669b5c308297835c001e7a1c4/pydantic_core-2.46.4-cp312-cp312-win_amd64.whl", hash = "sha256:e9c26f834c65f5752f3f06cb08cb86a913ceb7274d0db6e267808a708b46bc89", size = 2072919, upload-time = "2026-05-06T13:39:21.153Z" },
+    { url = "https://files.pythonhosted.org/packages/c4/ba/f463d006e0c47373ca7ec5e1a261c59dc01ef4d62b2657af925fb0deee3a/pydantic_core-2.46.4-cp312-cp312-win_arm64.whl", hash = "sha256:4fc73cb559bdb54b1134a706a2802a4cddd27a0633f5abb7e53056268751ac6a", size = 2027604, upload-time = "2026-05-06T13:39:03.753Z" },
+    { url = "https://files.pythonhosted.org/packages/51/a2/5d30b469c5267a17b39dec53208222f76a8d351dfac4af661888c5aee77d/pydantic_core-2.46.4-cp313-cp313-macosx_10_12_x86_64.whl", hash = "sha256:5d5902252db0d3cedf8d4a1bc68f70eeb430f7e4c7104c8c476753519b423008", size = 2106306, upload-time = "2026-05-06T13:37:48.029Z" },
+    { url = "https://files.pythonhosted.org/packages/c1/81/4fa520eaffa8bd7d1525e644cd6d39e7d60b1592bc5b516693c7340b50f1/pydantic_core-2.46.4-cp313-cp313-macosx_11_0_arm64.whl", hash = "sha256:c94f0688e7b8d0a67abf40e57a7eaaecd17cc9586706a31b76c031f63df052b4", size = 1951906, upload-time = "2026-05-06T13:37:17.012Z" },
+    { url = "https://files.pythonhosted.org/packages/03/d5/fd02da45b659668b05923b17ba3a0100a0a3d5541e3bd8fcc4ecb711309e/pydantic_core-2.46.4-cp313-cp313-manylinux_2_17_aarch64.manylinux2014_aarch64.whl", hash = "sha256:f027324c56cd5406ca49c124b0db10e56c69064fec039acc571c29020cc87c76", size = 1976802, upload-time = "2026-05-06T13:37:35.113Z" },
+    { url = "https://files.pythonhosted.org/packages/21/f2/95727e1368be3d3ed485eaab7adbd7dda408f33f7a36e8b48e0144002b91/pydantic_core-2.46.4-cp313-cp313-manylinux_2_17_armv7l.manylinux2014_armv7l.whl", hash = "sha256:e739fee756ba1010f8bcccb534252e85a35fe45ae92c295a06059ce58b74ccd3", size = 2052446, upload-time = "2026-05-06T13:37:12.313Z" },
+    { url = "https://files.pythonhosted.org/packages/9c/86/5d99feea3f77c7234b8718075b23db11532773c1a0dbd9b9490215dc2eeb/pydantic_core-2.46.4-cp313-cp313-manylinux_2_17_ppc64le.manylinux2014_ppc64le.whl", hash = "sha256:9d56801be94b86a9da183e5f3766e6310752b99ff647e38b09a9500d88e46e76", size = 2232757, upload-time = "2026-05-06T13:39:01.149Z" },
+    { url = "https://files.pythonhosted.org/packages/d2/3a/508ac615935ef7588cf6d9e9b91309fdc2da751af865e02a9098de88258c/pydantic_core-2.46.4-cp313-cp313-manylinux_2_17_s390x.manylinux2014_s390x.whl", hash = "sha256:2412e734dcb48da14d4e4006b82b46b74f2518b8a26ee7e58c6844a6cd6d03c4", size = 2309275, upload-time = "2026-05-06T13:37:41.406Z" },
+    { url = "https://files.pythonhosted.org/packages/07/f8/41db9de19d7987d6b04715a02b3b40aea467000275d9d758ffaa31af7d50/pydantic_core-2.46.4-cp313-cp313-manylinux_2_17_x86_64.manylinux2014_x86_64.whl", hash = "sha256:9551187363ffc0de2a00b2e47c25aeaeb1020b69b668762966df15fc5659dd5a", size = 2094467, upload-time = "2026-05-06T13:39:18.847Z" },
+    { url = "https://files.pythonhosted.org/packages/2c/e2/f35033184cb11d0052daf4416e8e10a502ea2ac006fc4f459aee872727d1/pydantic_core-2.46.4-cp313-cp313-manylinux_2_31_riscv64.whl", hash = "sha256:0186750b482eefa11d7f435892b09c5c606193ef3375bcf94aa00ae6bfb66262", size = 2134417, upload-time = "2026-05-06T13:40:17.944Z" },
+    { url = "https://files.pythonhosted.org/packages/7e/7b/6ceeb1cc90e193862f444ebe373d8fdf613f0a82572dde03fb10734c6c71/pydantic_core-2.46.4-cp313-cp313-manylinux_2_5_i686.manylinux1_i686.whl", hash = "sha256:5855698a4856556d86e8e6cd8434bc3ac0314ee8e12089ae0e143f64c6256e4e", size = 2179782, upload-time = "2026-05-06T13:40:32.618Z" },
+    { url = "https://files.pythonhosted.org/packages/5a/f2/c8d7773ede6af08036423a00ae0ceffce266c3c52a096c435d68c896083f/pydantic_core-2.46.4-cp313-cp313-musllinux_1_1_aarch64.whl", hash = "sha256:cbaf13819775b7f769bf4a1f066cb6df7a28d4480081a589828ef190226881cd", size = 2188782, upload-time = "2026-05-06T13:36:51.018Z" },
+    { url = "https://files.pythonhosted.org/packages/59/31/0c864784e31f09f05cdd87606f08923b9c9e7f6e51dd27f20f62f975ce9f/pydantic_core-2.46.4-cp313-cp313-musllinux_1_1_armv7l.whl", hash = "sha256:633147d34cf4550417f12e2b1a0383973bdf5cdfde212cb09e9a581cf10820be", size = 2328334, upload-time = "2026-05-06T13:40:37.764Z" },
+    { url = "https://files.pythonhosted.org/packages/c2/eb/4f6c8a41efa30baa755590f4141abf3a8c370fab610915733e74134a7270/pydantic_core-2.46.4-cp313-cp313-musllinux_1_1_x86_64.whl", hash = "sha256:82cf5301172168103724d49a1444d3378cb20cdee30b116a1bd6031236298a5d", size = 2372986, upload-time = "2026-05-06T13:39:34.152Z" },
+    { url = "https://files.pythonhosted.org/packages/5b/24/b375a480d53113860c299764bfe9f349a3dc9108b3adc0d7f0d786492ebf/pydantic_core-2.46.4-cp313-cp313-win32.whl", hash = "sha256:9fa8ae11da9e2b3126c6426f147e0fba88d96d65921799bb30c6abd1cb2c97fb", size = 1973693, upload-time = "2026-05-06T13:37:55.072Z" },
+    { url = "https://files.pythonhosted.org/packages/7e/e8/cff247591966f2d22ec8c003cd7587e27b7ba7b81ab2fb888e3ab75dc285/pydantic_core-2.46.4-cp313-cp313-win_amd64.whl", hash = "sha256:6b3ace8194b0e5204818c92802dcdca7fc6d88aabbb799d7c795540d9cd6d292", size = 2071819, upload-time = "2026-05-06T13:38:49.139Z" },
+    { url = "https://files.pythonhosted.org/packages/c6/1a/f4aee670d5670e9e148e0c82c7db98d780be566c6e6a97ee8035528ca0b3/pydantic_core-2.46.4-cp313-cp313-win_arm64.whl", hash = "sha256:184c081504d17f1c1066e430e117142b2c77d9448a97f7b65c6ac9fd9aee238d", size = 2027411, upload-time = "2026-05-06T13:40:45.796Z" },
+    { url = "https://files.pythonhosted.org/packages/8d/74/228a26ddad29c6672b805d9fd78e8d251cd04004fa7eed0e622096cd0250/pydantic_core-2.46.4-cp314-cp314-macosx_10_12_x86_64.whl", hash = "sha256:428e04521a40150c85216fc8b85e8d39fece235a9cf5e383761238c7fa9b96fb", size = 2102079, upload-time = "2026-05-06T13:38:41.019Z" },
+    { url = "https://files.pythonhosted.org/packages/ad/1f/8970b150a4b4365623ae00fc88603491f763c627311ae8031e3111356d6e/pydantic_core-2.46.4-cp314-cp314-macosx_11_0_arm64.whl", hash = "sha256:23ace664830ee0bfe014a0c7bc248b1f7f25ed7ad103852c317624a1083af462", size = 1952179, upload-time = "2026-05-06T13:36:59.812Z" },
+    { url = "https://files.pythonhosted.org/packages/95/30/5211a831ae054928054b2f79731661087a2bc5c01e825c672b3a4a8f1b3e/pydantic_core-2.46.4-cp314-cp314-manylinux_2_17_aarch64.manylinux2014_aarch64.whl", hash = "sha256:ce5c1d2a8b27468f433ca974829c44060b8097eedc39933e3c206a90ee49c4a9", size = 1978926, upload-time = "2026-05-06T13:37:39.933Z" },
+    { url = "https://files.pythonhosted.org/packages/57/e9/689668733b1eb67adeef047db3c2e8788fcf65a7fd9c9e2b46b7744fe245/pydantic_core-2.46.4-cp314-cp314-manylinux_2_17_armv7l.manylinux2014_armv7l.whl", hash = "sha256:7283d57845ecf5a163403eb0702dfc220cc4fbdd18919cb5ccea4f95ee1cdab4", size = 2046785, upload-time = "2026-05-06T13:38:01.995Z" },
+    { url = "https://files.pythonhosted.org/packages/60/d9/6715260422ff50a2109878fd24d948a6c3446bb2664f34ee78cd972b3acd/pydantic_core-2.46.4-cp314-cp314-manylinux_2_17_ppc64le.manylinux2014_ppc64le.whl", hash = "sha256:8daafc69c93ee8a0204506a3b6b30f586ef54028f52aeeeb5c4cfc5184fd5914", size = 2228733, upload-time = "2026-05-06T13:40:50.371Z" },
+    { url = "https://files.pythonhosted.org/packages/18/ae/fdb2f64316afca925640f8e70bb1a564b0ec2721c1389e25b8eb4bf9a299/pydantic_core-2.46.4-cp314-cp314-manylinux_2_17_s390x.manylinux2014_s390x.whl", hash = "sha256:cd2213145bcc2ba85884d0ac63d222fece9209678f77b9b4d76f054c561adb28", size = 2307534, upload-time = "2026-05-06T13:37:21.531Z" },
+    { url = "https://files.pythonhosted.org/packages/89/1d/8eff589b45bb8190a9d12c49cfad0f176a5cbd1534908a6b5125e2886239/pydantic_core-2.46.4-cp314-cp314-manylinux_2_17_x86_64.manylinux2014_x86_64.whl", hash = "sha256:7a5f930472650a82629163023e630d160863fce524c616f4e5186e5de9d9a49b", size = 2099732, upload-time = "2026-05-06T13:39:31.942Z" },
+    { url = "https://files.pythonhosted.org/packages/06/d5/ee5a3366637fee41dee51a1fc91562dcf12ddbc68fda34e6b253da2324bb/pydantic_core-2.46.4-cp314-cp314-manylinux_2_31_riscv64.whl", hash = "sha256:c1b3f518abeca3aa13c712fd202306e145abf59a18b094a6bafb2d2bbf59192c", size = 2129627, upload-time = "2026-05-06T13:37:25.033Z" },
+    { url = "https://files.pythonhosted.org/packages/94/33/2414be571d2c6a6c4d08be21f9292b6d3fdb08949a97b6dfe985017821db/pydantic_core-2.46.4-cp314-cp314-manylinux_2_5_i686.manylinux1_i686.whl", hash = "sha256:1a7dd0b3ee80d90150e3495a3a13ac34dbcbfd4f012996a6a1d8900e91b5c0fb", size = 2179141, upload-time = "2026-05-06T13:37:14.046Z" },
+    { url = "https://files.pythonhosted.org/packages/7b/79/7daa95be995be0eecc4cf75064cb33f9bbbfe3fe0158caf2f0d4a996a5c7/pydantic_core-2.46.4-cp314-cp314-musllinux_1_1_aarch64.whl", hash = "sha256:3fb702cd90b0446a3a1c5e470bfa0dd23c0233b676a9099ddcc964fa6ca13898", size = 2184325, upload-time = "2026-05-06T13:36:53.615Z" },
+    { url = "https://files.pythonhosted.org/packages/9f/cb/d0a382f5c0de8a222dc61c65348e0ce831b1f68e0a018450d31c2cace3a5/pydantic_core-2.46.4-cp314-cp314-musllinux_1_1_armv7l.whl", hash = "sha256:b8458003118a712e66286df6a707db01c52c0f52f7db8e4a38f0da1d3b94fc4e", size = 2323990, upload-time = "2026-05-06T13:40:29.971Z" },
+    { url = "https://files.pythonhosted.org/packages/05/db/d9ba624cc4a5aced1598e88c04fdbd8310c8a69b9d38b9a3d39ce3a61ed7/pydantic_core-2.46.4-cp314-cp314-musllinux_1_1_x86_64.whl", hash = "sha256:372429a130e469c9cd698925ce5fc50940b7a1336b0d82038e63d5bbc4edc519", size = 2369978, upload-time = "2026-05-06T13:37:23.027Z" },
+    { url = "https://files.pythonhosted.org/packages/f2/20/d15df15ba918c423461905802bfd2981c3af0bfa0e40d05e13edbfa48bc3/pydantic_core-2.46.4-cp314-cp314-win32.whl", hash = "sha256:85bb3611ff1802f3ee7fdd7dbff26b56f343fb432d57a4728fdd49b6ef35e2f4", size = 1966354, upload-time = "2026-05-06T13:38:03.499Z" },
+    { url = "https://files.pythonhosted.org/packages/fc/b6/6b8de4c0a7d7ab3004c439c80c5c1e0a3e8d78bbae19379b01960383d9e5/pydantic_core-2.46.4-cp314-cp314-win_amd64.whl", hash = "sha256:811ff8e9c313ab425368bcbb36e5c4ebd7108c2bbf4e4089cfbb0b01eff63fac", size = 2072238, upload-time = "2026-05-06T13:39:40.807Z" },
+    { url = "https://files.pythonhosted.org/packages/32/36/51eb763beec1f4cf59b1db243a7dcc39cbb41230f050a09b9d69faaf0a48/pydantic_core-2.46.4-cp314-cp314-win_arm64.whl", hash = "sha256:bfec22eab3c8cc2ceec0248aec886624116dc079afa027ecc8ad4a7e62010f8a", size = 2018251, upload-time = "2026-05-06T13:37:26.72Z" },
+    { url = "https://files.pythonhosted.org/packages/e8/91/855af51d625b23aa987116a19e231d2aaef9c4a415273ddc189b79a45fee/pydantic_core-2.46.4-cp314-cp314t-macosx_10_12_x86_64.whl", hash = "sha256:af8244b2bef6aaad6d92cda81372de7f8c8d36c9f0c3ea36e827c60e7d9467a0", size = 2099593, upload-time = "2026-05-06T13:39:47.682Z" },
+    { url = "https://files.pythonhosted.org/packages/fb/1b/8784a54c65edb5f49f0a14d6977cf1b209bba85a4c77445b255c2de58ab3/pydantic_core-2.46.4-cp314-cp314t-macosx_11_0_arm64.whl", hash = "sha256:5a4330cdbc57162e4b3aa303f588ba752257694c9c9be3e7ebb11b4aca659b5d", size = 1935226, upload-time = "2026-05-06T13:40:40.428Z" },
+    { url = "https://files.pythonhosted.org/packages/e8/e7/1955d28d1afc56dd4b3ad7cc0cf39df1b9852964cf16e5d13912756d6d6b/pydantic_core-2.46.4-cp314-cp314t-manylinux_2_17_aarch64.manylinux2014_aarch64.whl", hash = "sha256:29c61fc04a3d840155ff08e475a04809278972fe6aef51e2720554e96367e34b", size = 1974605, upload-time = "2026-05-06T13:37:32.029Z" },
+    { url = "https://files.pythonhosted.org/packages/93/e2/3fedbf0ba7a22850e6e9fd78117f1c0f10f950182344d8a6c535d468fdd8/pydantic_core-2.46.4-cp314-cp314t-manylinux_2_17_armv7l.manylinux2014_armv7l.whl", hash = "sha256:c50f2528cf200c5eed56faf3f4e22fcd5f38c157a8b78576e6ba3168ec35f000", size = 2030777, upload-time = "2026-05-06T13:38:55.239Z" },
+    { url = "https://files.pythonhosted.org/packages/f8/61/46be275fcaaba0b4f5b9669dd852267ce1ff616592dccf7a7845588df091/pydantic_core-2.46.4-cp314-cp314t-manylinux_2_17_ppc64le.manylinux2014_ppc64le.whl", hash = "sha256:0cbe8b01f948de4286c74cdd6c667aceb38f5c1e26f0693b3983d9d74887c65e", size = 2236641, upload-time = "2026-05-06T13:37:08.096Z" },
+    { url = "https://files.pythonhosted.org/packages/60/db/12e93e46a8bac9988be3c016860f83293daea8c716c029c9ace279036f2f/pydantic_core-2.46.4-cp314-cp314t-manylinux_2_17_s390x.manylinux2014_s390x.whl", hash = "sha256:617d7e2ca7dcb8c5cf6bcb8c59b8832c94b36196bbf1cbd1bfb56ed341905edd", size = 2286404, upload-time = "2026-05-06T13:40:20.221Z" },
+    { url = "https://files.pythonhosted.org/packages/e2/4a/4d8b19008f38d31c53b8219cfedc2e3d5de5fe99d90076b7e767de29274f/pydantic_core-2.46.4-cp314-cp314t-manylinux_2_17_x86_64.manylinux2014_x86_64.whl", hash = "sha256:7027560ee92211647d0d34e3f7cd6f50da56399d26a9c8ad0da286d3869a53f3", size = 2109219, upload-time = "2026-05-06T13:38:12.153Z" },
+    { url = "https://files.pythonhosted.org/packages/88/70/3cbc40978fefb7bb09c6708d40d4ad1a5d70fd7213c3d17f971de868ec1f/pydantic_core-2.46.4-cp314-cp314t-manylinux_2_31_riscv64.whl", hash = "sha256:f99626688942fb746e545232e7726926f3be91b5975f8b55327665fafda991c7", size = 2110594, upload-time = "2026-05-06T13:40:02.971Z" },
+    { url = "https://files.pythonhosted.org/packages/9d/20/b8d36736216e29491125531685b2f9e61aa5b4b2599893f8268551da3338/pydantic_core-2.46.4-cp314-cp314t-manylinux_2_5_i686.manylinux1_i686.whl", hash = "sha256:fc3e9034a63de20e15e8ade85358bc6efc614008cab72898b4b4952bea0509ff", size = 2159542, upload-time = "2026-05-06T13:39:27.506Z" },
+    { url = "https://files.pythonhosted.org/packages/1d/a2/367df868eb584dacf6bf82a389272406d7178e301c4ac82545ab98bc2dd9/pydantic_core-2.46.4-cp314-cp314t-musllinux_1_1_aarch64.whl", hash = "sha256:97e7cf2be5c77b7d1a9713a05605d49460d02c6078d38d8bef3cbe323c548424", size = 2168146, upload-time = "2026-05-06T13:38:31.93Z" },
+    { url = "https://files.pythonhosted.org/packages/c1/b8/4460f77f7e201893f649a29ab355dddd3beee8a97bcb1a320db414f9a06e/pydantic_core-2.46.4-cp314-cp314t-musllinux_1_1_armv7l.whl", hash = "sha256:3bf92c5d0e00fefaab325a4d27828fe6b6e2a21848686b5b60d2d9eeb09d76c6", size = 2306309, upload-time = "2026-05-06T13:37:44.717Z" },
+    { url = "https://files.pythonhosted.org/packages/64/c4/be2639293acd87dc8ddbcec41a73cee9b2ebf996fe6d892a1a74e88ad3f7/pydantic_core-2.46.4-cp314-cp314t-musllinux_1_1_x86_64.whl", hash = "sha256:3ecbc122d18468d06ca279dc26a8c2e2d5acb10943bb35e36ae92096dc3b5565", size = 2369736, upload-time = "2026-05-06T13:37:05.645Z" },
+    { url = "https://files.pythonhosted.org/packages/30/a6/9f9f380dbb301f67023bf8f707aaa75daadf84f7152d95c410fd7e81d994/pydantic_core-2.46.4-cp314-cp314t-win32.whl", hash = "sha256:e846ae7835bf0703ae43f534ab79a867146dadd59dc9ca5c8b53d5c8f7c9ef02", size = 1955575, upload-time = "2026-05-06T13:38:51.116Z" },
+    { url = "https://files.pythonhosted.org/packages/40/1f/f1eb9eb350e795d1af8586289746f5c5677d16043040d63710e22abc43c9/pydantic_core-2.46.4-cp314-cp314t-win_amd64.whl", hash = "sha256:2108ba5c1c1eca18030634489dc544844144ee36357f2f9f780b93e7ddbb44b5", size = 2051624, upload-time = "2026-05-06T13:38:21.672Z" },
+    { url = "https://files.pythonhosted.org/packages/f6/d2/42dd53d0a85c27606f316d3aa5d2869c4e8470a5ed6dec30e4a1abe19192/pydantic_core-2.46.4-cp314-cp314t-win_arm64.whl", hash = "sha256:4fcbe087dbc2068af7eda3aa87634eba216dbda64d1ae73c8684b621d33f6596", size = 2017325, upload-time = "2026-05-06T13:40:52.723Z" },
+    { url = "https://files.pythonhosted.org/packages/9d/1d/8987ad40f65ae1432753072f214fb5c74fe47ffbd0698bb9cbbb585664f8/pydantic_core-2.46.4-graalpy312-graalpy250_312_native-macosx_10_12_x86_64.whl", hash = "sha256:1d8ba486450b14f3b1d63bc521d410ec7565e52f887b9fb671791886436a42f7", size = 2095527, upload-time = "2026-05-06T13:39:52.283Z" },
+    { url = "https://files.pythonhosted.org/packages/64/d3/84c282a7eee1d3ac4c0377546ef5a1ea436ce26840d9ac3b7ed54a377507/pydantic_core-2.46.4-graalpy312-graalpy250_312_native-macosx_11_0_arm64.whl", hash = "sha256:3009f12e4e90b7f88b4f9adb1b0c4a3d58fe7820f3238c190047209d148026df", size = 1936024, upload-time = "2026-05-06T13:40:15.671Z" },
+    { url = "https://files.pythonhosted.org/packages/d7/ca/eac61596cdeb4d7e174d3dc0bd8a6238f14f75f97a24e7b7db4c7e7340a0/pydantic_core-2.46.4-graalpy312-graalpy250_312_native-manylinux_2_17_aarch64.manylinux2014_aarch64.whl", hash = "sha256:ad785e92e6dc634c21555edc8bd6b64957ab844541bcb96a1366c202951ae526", size = 1990696, upload-time = "2026-05-06T13:38:34.717Z" },
+    { url = "https://files.pythonhosted.org/packages/fa/c3/7c8b240552251faf6b3a957db200fcfbbcec36763c050428b601e0c9b83b/pydantic_core-2.46.4-graalpy312-graalpy250_312_native-manylinux_2_17_x86_64.manylinux2014_x86_64.whl", hash = "sha256:00c603d540afdd6b80eb39f078f33ebd46211f02f33e34a32d9f053bba711de0", size = 2147590, upload-time = "2026-05-06T13:39:29.883Z" },
+]
+
+[[package]]
+name = "pydantic-settings"
+version = "2.14.1"
+source = { registry = "https://pypi.org/simple" }
+dependencies = [
+    { name = "pydantic" },
+    { name = "python-dotenv" },
+    { name = "typing-inspection" },
+]
+sdist = { url = "https://files.pythonhosted.org/packages/07/60/1d1e59c9c90d54591469ada7d268251f71c24bdb765f1a8a832cee8c6653/pydantic_settings-2.14.1.tar.gz", hash = "sha256:e874d3bec7e787b0c9958277956ed9b4dd5de6a80e162188fdaff7c5e26fd5fa", size = 235551, upload-time = "2026-05-08T13:40:06.542Z" }
+wheels = [
+    { url = "https://files.pythonhosted.org/packages/ae/8d/f1af3832f5e6eb13ba94ee809e72b8ecb5eef226d27ee0bef7d963d943c7/pydantic_settings-2.14.1-py3-none-any.whl", hash = "sha256:6e3c7edfd8277687cdc598f56e5cff0e9bfff0910a3749deaa8d4401c3a2b9de", size = 60964, upload-time = "2026-05-08T13:40:04.958Z" },
+]
+
+[[package]]
+name = "python-dotenv"
+version = "1.2.2"
+source = { registry = "https://pypi.org/simple" }
+sdist = { url = "https://files.pythonhosted.org/packages/82/ed/0301aeeac3e5353ef3d94b6ec08bbcabd04a72018415dcb29e588514bba8/python_dotenv-1.2.2.tar.gz", hash = "sha256:2c371a91fbd7ba082c2c1dc1f8bf89ca22564a087c2c287cd9b662adde799cf3", size = 50135, upload-time = "2026-03-01T16:00:26.196Z" }
+wheels = [
+    { url = "https://files.pythonhosted.org/packages/0b/d7/1959b9648791274998a9c3526f6d0ec8fd2233e4d4acce81bbae76b44b2a/python_dotenv-1.2.2-py3-none-any.whl", hash = "sha256:1d8214789a24de455a8b8bd8ae6fe3c6b69a5e3d64aa8a8e5d68e694bbcb285a", size = 22101, upload-time = "2026-03-01T16:00:25.09Z" },
+]
+
+[[package]]
+name = "sqlparse"
+version = "0.5.5"
+source = { registry = "https://pypi.org/simple" }
+sdist = { url = "https://files.pythonhosted.org/packages/90/76/437d71068094df0726366574cf3432a4ed754217b436eb7429415cf2d480/sqlparse-0.5.5.tar.gz", hash = "sha256:e20d4a9b0b8585fdf63b10d30066c7c94c5d7a7ec47c889a2d83a3caa93ff28e", size = 120815, upload-time = "2025-12-19T07:17:45.073Z" }
+wheels = [
+    { url = "https://files.pythonhosted.org/packages/49/4b/359f28a903c13438ef59ebeee215fb25da53066db67b305c125f1c6d2a25/sqlparse-0.5.5-py3-none-any.whl", hash = "sha256:12a08b3bf3eec877c519589833aed092e2444e68240a3577e8e26148acc7b1ba", size = 46138, upload-time = "2025-12-19T07:17:46.573Z" },
+]
+
+[[package]]
+name = "typing-extensions"
+version = "4.15.0"
+source = { registry = "https://pypi.org/simple" }
+sdist = { url = "https://files.pythonhosted.org/packages/72/94/1a15dd82efb362ac84269196e94cf00f187f7ed21c242792a923cdb1c61f/typing_extensions-4.15.0.tar.gz", hash = "sha256:0cea48d173cc12fa28ecabc3b837ea3cf6f38c6d1136f85cbaaf598984861466", size = 109391, upload-time = "2025-08-25T13:49:26.313Z" }
+wheels = [
+    { url = "https://files.pythonhosted.org/packages/18/67/36e9267722cc04a6b9f15c7f3441c2363321a3ea07da7ae0c0707beb2a9c/typing_extensions-4.15.0-py3-none-any.whl", hash = "sha256:f0fa19c6845758ab08074a0cfa8b7aecb71c999ca73d62883bc25cc018c4e548", size = 44614, upload-time = "2025-08-25T13:49:24.86Z" },
+]
+
+[[package]]
+name = "typing-inspection"
+version = "0.4.2"
+source = { registry = "https://pypi.org/simple" }
+dependencies = [
+    { name = "typing-extensions" },
+]
+sdist = { url = "https://files.pythonhosted.org/packages/55/e3/70399cb7dd41c10ac53367ae42139cf4b1ca5f36bb3dc6c9d33acdb43655/typing_inspection-0.4.2.tar.gz", hash = "sha256:ba561c48a67c5958007083d386c3295464928b01faa735ab8547c5692e87f464", size = 75949, upload-time = "2025-10-01T02:14:41.687Z" }
+wheels = [
+    { url = "https://files.pythonhosted.org/packages/dc/9b/47798a6c91d8bdb567fe2698fe81e0c6b7cb7ef4d13da4114b41d239f65d/typing_inspection-0.4.2-py3-none-any.whl", hash = "sha256:4ed1cacbdc298c220f1bd249ed5287caa16f34d44ef4e9c3d0cbad5b521545e7", size = 14611, upload-time = "2025-10-01T02:14:40.154Z" },
+]
+
+[[package]]
+name = "tzdata"
+version = "2026.2"
+source = { registry = "https://pypi.org/simple" }
+sdist = { url = "https://files.pythonhosted.org/packages/ba/19/1b9b0e29f30c6d35cb345486df41110984ea67ae69dddbc0e8a100999493/tzdata-2026.2.tar.gz", hash = "sha256:9173fde7d80d9018e02a662e168e5a2d04f87c41ea174b139fbef642eda62d10", size = 198254, upload-time = "2026-04-24T15:22:08.651Z" }
+wheels = [
+    { url = "https://files.pythonhosted.org/packages/ce/e4/dccd7f47c4b64213ac01ef921a1337ee6e30e8c6466046018326977efd95/tzdata-2026.2-py2.py3-none-any.whl", hash = "sha256:bbe9af844f658da81a5f95019480da3a89415801f6cc966806612cc7169bffe7", size = 349321, upload-time = "2026-04-24T15:22:05.876Z" },
+]

backend/apps/books/migrations/0001_initial.py

@@ -1,96 +0,0 @@
-# Generated by Django 5.1.7 on 2026-05-26 03:33
-
-import django.db.models.deletion
-from django.conf import settings
-from django.db import migrations, models
-
-
-class Migration(migrations.Migration):
-
-    initial = True
-
-    dependencies = [
-        migrations.swappable_dependency(settings.AUTH_USER_MODEL),
-    ]
-
-    operations = [
-        migrations.CreateModel(
-            name='Book',
-            fields=[
-                ('id', models.BigAutoField(auto_created=True, primary_key=True, serialize=False, verbose_name='ID')),
-                ('title', models.CharField(db_index=True, max_length=512)),
-                ('author', models.CharField(blank=True, db_index=True, default='', max_length=256)),
-                ('genre', models.CharField(blank=True, db_index=True, default='', max_length=128)),
-                ('description', models.TextField(blank=True, default='')),
-                ('reading_status', models.CharField(choices=[('want_to_read', 'Want to Read'), ('reading', 'Reading'), ('finished', 'Finished'), ('dnf', 'Did Not Finish')], db_index=True, default='want_to_read', max_length=20)),
-                ('total_pages', models.PositiveIntegerField(default=0)),
-                ('cover_image', models.URLField(blank=True, default='')),
-                ('created_at', models.DateTimeField(auto_now_add=True)),
-                ('updated_at', models.DateTimeField(auto_now=True)),
-            ],
-            options={
-                'verbose_name': 'Book',
-                'verbose_name_plural': 'Books',
-                'db_table': 'books_book',
-                'ordering': ['title'],
-                'indexes': [models.Index(fields=['title', 'author', 'genre'], name='books_book_title_9fddc2_idx')],
-            },
-        ),
-        migrations.CreateModel(
-            name='EBook',
-            fields=[
-                ('id', models.BigAutoField(auto_created=True, primary_key=True, serialize=False, verbose_name='ID')),
-                ('title', models.CharField(max_length=512)),
-                ('author', models.CharField(blank=True, default='', max_length=256)),
-                ('file', models.FileField(upload_to='ebooks/%Y/%m/%d/')),
-                ('cover_image', models.ImageField(blank=True, null=True, upload_to='ebook_covers/%Y/%m/%d/')),
-                ('created_at', models.DateTimeField(auto_now_add=True)),
-                ('updated_at', models.DateTimeField(auto_now=True)),
-                ('user', models.ForeignKey(on_delete=django.db.models.deletion.CASCADE, related_name='ebooks', to=settings.AUTH_USER_MODEL)),
-            ],
-            options={
-                'verbose_name': 'E-Book',
-                'verbose_name_plural': 'E-Books',
-                'db_table': 'books_ebook',
-                'ordering': ['-created_at'],
-            },
-        ),
-        migrations.CreateModel(
-            name='ReadingProgress',
-            fields=[
-                ('id', models.BigAutoField(auto_created=True, primary_key=True, serialize=False, verbose_name='ID')),
-                ('current_position', models.FloatField(default=0.0)),
-                ('last_page', models.IntegerField(default=0)),
-                ('updated_at', models.DateTimeField(auto_now=True)),
-                ('ebook', models.OneToOneField(on_delete=django.db.models.deletion.CASCADE, related_name='reading_progress', to='books.ebook')),
-                ('user', models.ForeignKey(on_delete=django.db.models.deletion.CASCADE, related_name='reading_progress', to=settings.AUTH_USER_MODEL)),
-            ],
-            options={
-                'verbose_name_plural': 'reading progress',
-                'db_table': 'books_reading_progress',
-            },
-        ),
-        migrations.CreateModel(
-            name='ReadingSettings',
-            fields=[
-                ('id', models.BigAutoField(auto_created=True, primary_key=True, serialize=False, verbose_name='ID')),
-                ('font_size', models.IntegerField(default=18)),
-                ('font_style', models.CharField(choices=[('sans-serif', 'Sans Serif'), ('serif', 'Serif'), ('monospace', 'Monospace')], default='sans-serif', max_length=20)),
-                ('background_color', models.CharField(choices=[('#ffffff', 'White'), ('#f4e4c1', 'Sepia'), ('#1a1a2e', 'Dark'), ('#c7edcc', 'Green')], default='#ffffff', max_length=7)),
-                ('updated_at', models.DateTimeField(auto_now=True)),
-                ('user', models.OneToOneField(on_delete=django.db.models.deletion.CASCADE, related_name='reading_settings', to=settings.AUTH_USER_MODEL)),
-            ],
-            options={
-                'verbose_name_plural': 'reading settings',
-                'db_table': 'books_reading_settings',
-            },
-        ),
-        migrations.AddIndex(
-            model_name='ebook',
-            index=models.Index(fields=['user', '-created_at'], name='books_ebook_user_id_0b6bdb_idx'),
-        ),
-        migrations.AlterUniqueTogether(
-            name='readingprogress',
-            unique_together={('user', 'ebook')},
-        ),
-    ]

backend/apps/books/models.py

@@ -49,8 +49,12 @@ class Book(models.Model):
 
 class EBook(models.Model):
     user = models.ForeignKey(settings.AUTH_USER_MODEL, on_delete=models.CASCADE, related_name="ebooks")
-    title = models.CharField(max_length=512)
+    title = models.CharField(max_length=512, db_index=True)
-    author = models.CharField(max_length=256, blank=True, default="")
+    author = models.CharField(max_length=256, blank=True, default="", db_index=True)
+    format = models.CharField(max_length=20, blank=True, default="", editable=False)
+    page_count = models.PositiveIntegerField(default=0)
+    file_size = models.BigIntegerField(default=0)
+    metadata_json = models.JSONField(blank=True, default=dict)
     file = models.FileField(upload_to="ebooks/%Y/%m/%d/")
     cover_image = models.ImageField(upload_to="ebook_covers/%Y/%m/%d/", blank=True, null=True)
     created_at = models.DateTimeField(auto_now_add=True)
@@ -70,6 +74,24 @@ class EBook(models.Model):
         return Path(self.file.name).name if self.file else ""
 
 
+class BookChapter(models.Model):
+    ebook = models.ForeignKey(EBook, on_delete=models.CASCADE, related_name="chapters")
+    title = models.CharField(max_length=512)
+    index = models.IntegerField(default=0)
+    href = models.CharField(max_length=1024, blank=True, default="")
+    children = models.JSONField(blank=True, default=list)
+
+    class Meta:
+        db_table = "books_book_chapter"
+        verbose_name = "Book Chapter"
+        verbose_name_plural = "Book Chapters"
+        ordering = ["index"]
+        indexes = [models.Index(fields=["ebook", "index"])]
+
+    def __str__(self):
+        return f"{self.ebook.title} - {self.title}"
+
+
 @receiver(post_delete, sender=EBook)
 def _auto_delete_ebook_file(sender, instance, **kwargs):
     if instance.file:
@@ -78,11 +100,33 @@ def _auto_delete_ebook_file(sender, instance, **kwargs):
         instance.cover_image.delete(save=False)
 
 
+class DownloadRecord(models.Model):
+    """Tracks book downloads for offline access management."""
+
+    user = models.ForeignKey(settings.AUTH_USER_MODEL, on_delete=models.CASCADE, related_name="download_records")
+    ebook = models.ForeignKey(EBook, on_delete=models.CASCADE, related_name="download_records")
+    file_size = models.BigIntegerField(default=0)
+    downloaded_at = models.DateTimeField(auto_now_add=True)
+
+    class Meta:
+        db_table = "books_download_record"
+        verbose_name = "Download Record"
+        verbose_name_plural = "Download Records"
+        ordering = ["-downloaded_at"]
+        unique_together = [("user", "ebook")]
+
+    def __str__(self):
+        return f"{self.user} - {self.ebook.title}"
+
+
 class ReadingProgress(models.Model):
     user = models.ForeignKey(settings.AUTH_USER_MODEL, on_delete=models.CASCADE, related_name="reading_progress")
     ebook = models.OneToOneField(EBook, on_delete=models.CASCADE, related_name="reading_progress")
     current_position = models.FloatField(default=0.0)
     last_page = models.IntegerField(default=0)
+    device_id = models.CharField(max_length=128, blank=True, default="")
+    device_name = models.CharField(max_length=128, blank=True, default="")
+    version = models.PositiveIntegerField(default=1)
     updated_at = models.DateTimeField(auto_now=True)
 
     class Meta:
@@ -93,6 +137,36 @@ class ReadingProgress(models.Model):
     def __str__(self):
         return f"{self.ebook.title} - {self.current_position:.1f}%"
 
+    def update_with_sync(self, position: float, last_page: int,
+                         device_id: str, device_name: str,
+                         client_updated_at: str | None = None) -> tuple["ReadingProgress", bool]:
+        """Update progress with conflict resolution (last-write-wins by timestamp).
+
+        Returns (instance, applied) where applied is True if the update was applied.
+        """
+        if client_updated_at and self.updated_at:
+            try:
+                from django.utils.timezone import is_naive, make_aware
+                from datetime import datetime
+                client_dt = datetime.fromisoformat(client_updated_at.replace("Z", "+00:00"))
+                if is_naive(client_dt):
+                    client_dt = make_aware(client_dt)
+                if client_dt <= self.updated_at:
+                    return self, False
+            except (ValueError, TypeError):
+                pass
+
+        self.current_position = position
+        self.last_page = last_page
+        self.device_id = device_id
+        self.device_name = device_name
+        self.version += 1
+        self.save(update_fields=[
+            "current_position", "last_page",
+            "device_id", "device_name", "version", "updated_at",
+        ])
+        return self, True
+
 
 class ReadingSettings(models.Model):
     user = models.OneToOneField(settings.AUTH_USER_MODEL, on_delete=models.CASCADE, related_name="reading_settings")
@@ -106,4 +180,79 @@ class ReadingSettings(models.Model):
         verbose_name_plural = "reading settings"
 
     def __str__(self):
-        return f"Settings for {self.user}"
+        return f"Settings for {self.user}"
+
+
+class Chapter(models.Model):
+    """A chapter within a book, containing the text/markdown content.
+
+    This is distinct from BookChapter (which tracks EPUB TOC entries).
+    Chapter represents user-authored chapter content for a Book.
+    """
+
+    book = models.ForeignKey(
+        Book,
+        on_delete=models.CASCADE,
+        related_name="chapters",
+        db_index=True,
+    )
+    title = models.CharField(max_length=512)
+    number = models.PositiveIntegerField()
+    content = models.TextField(blank=True, default="")
+    created_at = models.DateTimeField(auto_now_add=True)
+    updated_at = models.DateTimeField(auto_now=True)
+
+    class Meta:
+        db_table = "books_chapter"
+        verbose_name = "Chapter"
+        verbose_name_plural = "Chapters"
+        ordering = ["book", "number"]
+        constraints = [
+            models.UniqueConstraint(
+                fields=["book", "number"],
+                name="uq_book_chapter_number",
+            )
+        ]
+
+    def __str__(self):
+        return f"{self.book.title} — Ch. {self.number}: {self.title}"
+
+
+class BookReadingProgress(models.Model):
+    """Tracks a user's reading progress within a book's chapters.
+
+    This is distinct from ReadingProgress (which tracks ebook progress).
+    BookReadingProgress tracks chapter-based reading for Books.
+    """
+
+    user = models.ForeignKey(
+        settings.AUTH_USER_MODEL,
+        on_delete=models.CASCADE,
+        related_name="book_reading_progress",
+        db_index=True,
+    )
+    book = models.ForeignKey(
+        Book,
+        on_delete=models.CASCADE,
+        related_name="book_reading_progress",
+        db_index=True,
+    )
+    current_chapter = models.PositiveIntegerField(default=1)
+    current_position = models.PositiveIntegerField(default=0)
+    percentage = models.FloatField(default=0.0)
+    updated_at = models.DateTimeField(auto_now=True)
+
+    class Meta:
+        db_table = "books_book_reading_progress"
+        verbose_name = "Book Reading Progress"
+        verbose_name_plural = "Book Reading Progress"
+        ordering = ["-updated_at"]
+        constraints = [
+            models.UniqueConstraint(
+                fields=["user", "book"],
+                name="uq_book_reading_progress_user_book",
+            )
+        ]
+
+    def __str__(self):
+        return f"{self.user} — {self.book.title} ({self.percentage:.0f}%)"

backend/apps/books/serializers.py

@@ -1,6 +1,26 @@
 from rest_framework import serializers
 
-from apps.books.models import Book, EBook, FontStyle, BackgroundColor, ReadingProgress, ReadingSettings, ReadingStatus
+from apps.books.models import Book, BookChapter, BookReadingProgress, Chapter, EBook, FontStyle, BackgroundColor, ReadingProgress, ReadingSettings, ReadingStatus, DownloadRecord
+
+
+class BookChapterSerializer(serializers.ModelSerializer):
+    class Meta:
+        model = BookChapter
+        fields = ["id", "title", "index", "href", "children"]
+
+
+class EBookContentSerializer(serializers.Serializer):
+    page = serializers.IntegerField()
+    total_pages = serializers.IntegerField()
+    content = serializers.CharField()
+    chapter_title = serializers.CharField()
+    format = serializers.CharField()
+
+
+class EBookTocSerializer(serializers.Serializer):
+    chapters = serializers.ListField(child=BookChapterSerializer())
+    format = serializers.CharField()
+    page_count = serializers.IntegerField()
 
 
 class BookListSerializer(serializers.ModelSerializer):
@@ -29,11 +49,12 @@ class BookSerializer(serializers.ModelSerializer):
 
 class EBookListSerializer(serializers.ModelSerializer):
     filename = serializers.CharField(read_only=True)
+    format = serializers.CharField(read_only=True)
     progress = serializers.SerializerMethodField()
 
     class Meta:
         model = EBook
-        fields = ["id", "title", "author", "filename", "cover_image", "created_at", "progress"]
+        fields = ["id", "title", "author", "filename", "format", "page_count", "file_size", "cover_image", "created_at", "progress"]
 
     def get_progress(self, obj):
         try:
@@ -44,12 +65,13 @@ class EBookListSerializer(serializers.ModelSerializer):
 
 class EBookDetailSerializer(serializers.ModelSerializer):
     filename = serializers.CharField(read_only=True)
+    format = serializers.CharField(read_only=True)
     file_url = serializers.SerializerMethodField()
     progress = serializers.SerializerMethodField()
 
     class Meta:
         model = EBook
-        fields = ["id", "title", "author", "filename", "file_url", "cover_image", "created_at", "updated_at", "progress"]
+        fields = ["id", "title", "author", "filename", "format", "page_count", "file_size", "file_url", "cover_image", "created_at", "updated_at", "progress"]
 
     def get_file_url(self, obj):
         request = self.context.get("request")
@@ -82,13 +104,20 @@ class EBookUploadSerializer(serializers.ModelSerializer):
 
     def create(self, validated_data):
         validated_data["user"] = self.context["request"].user
+        # Auto-detect format from file extension
+        import os
+        name = str(getattr(validated_data.get("file"), "name", ""))
+        ext = os.path.splitext(name)[1].lower().lstrip(".")
+        if ext:
+            validated_data["format"] = ext
         return super().create(validated_data)
 
 
 class ReadingProgressSerializer(serializers.ModelSerializer):
     class Meta:
         model = ReadingProgress
-        fields = ["current_position", "last_page"]
+        fields = ["current_position", "last_page", "device_id", "device_name", "version", "updated_at"]
+        read_only_fields = ["version", "updated_at"]
         extra_kwargs = {"current_position": {"required": True, "min_value": 0.0, "max_value": 100.0}}
 
     def validate_current_position(self, value):
@@ -117,4 +146,83 @@ class ReadingSettingsSerializer(serializers.ModelSerializer):
         valid = [c.value for c in BackgroundColor]
         if value not in valid:
             raise serializers.ValidationError(f"Background color must be one of: {', '.join(valid)}")
+        return value
+
+
+class DownloadRecordSerializer(serializers.ModelSerializer):
+    ebook_id = serializers.IntegerField(source="ebook.id", read_only=True)
+    ebook_title = serializers.CharField(source="ebook.title", read_only=True)
+    author = serializers.CharField(source="ebook.author", read_only=True)
+    filename = serializers.SerializerMethodField()
+    cover_image = serializers.ImageField(source="ebook.cover_image", read_only=True)
+    format = serializers.CharField(source="ebook.format", read_only=True)
+    progress = serializers.SerializerMethodField()
+    file_url = serializers.SerializerMethodField()
+
+    class Meta:
+        model = DownloadRecord
+        fields = [
+            "id", "ebook_id", "ebook_title", "author", "filename", "file_url",
+            "file_size", "cover_image", "format", "downloaded_at", "progress",
+        ]
+
+    def get_filename(self, obj):
+        return obj.ebook.filename()
+
+    def get_file_url(self, obj):
+        request = self.context.get("request")
+        if request and obj.ebook.file:
+            return request.build_absolute_uri(obj.ebook.file.url)
+        return ""
+
+    def get_progress(self, obj):
+        try:
+            rp = obj.ebook.reading_progress
+            return {"current_position": rp.current_position, "last_page": rp.last_page}
+        except ReadingProgress.DoesNotExist:
+            return None
+
+
+class StorageSummarySerializer(serializers.Serializer):
+    total_downloads = serializers.IntegerField()
+    total_size_bytes = serializers.IntegerField()
+    ebooks = serializers.ListField(child=serializers.DictField())
+
+
+class ChapterSummarySerializer(serializers.ModelSerializer):
+    """Compact serializer for TOC listing — no content body."""
+
+    class Meta:
+        model = Chapter
+        fields = ["id", "book", "title", "number"]
+
+
+class ChapterDetailSerializer(serializers.ModelSerializer):
+    """Full serializer with chapter content for reading view."""
+
+    class Meta:
+        model = Chapter
+        fields = ["id", "book", "title", "number", "content", "created_at", "updated_at"]
+        read_only_fields = ["id", "created_at", "updated_at"]
+
+
+class BookReadingProgressSerializer(serializers.ModelSerializer):
+    """Serialize chapter-based reading progress for a book."""
+
+    class Meta:
+        model = BookReadingProgress
+        fields = [
+            "id", "book", "current_chapter", "current_position",
+            "percentage", "updated_at",
+        ]
+        read_only_fields = ["id", "updated_at"]
+
+    def validate_percentage(self, value):
+        if value < 0.0 or value > 100.0:
+            raise serializers.ValidationError("Percentage must be between 0 and 100.")
+        return value
+
+    def validate_current_chapter(self, value):
+        if value < 1:
+            raise serializers.ValidationError("Chapter number must be positive.")
         return value

backend/apps/books/tests.py

@@ -1,255 +0,0 @@
-"""Tests for the Book search & discovery endpoints."""
-
-import pytest
-from django.urls import reverse
-from rest_framework import status
-from rest_framework.test import APIClient
-
-from apps.books.models import Book, ReadingStatus
-
-
-# ---------------------------------------------------------------------------
-# Fixtures
-# ---------------------------------------------------------------------------
-
-
-@pytest.fixture
-def api_client():
-    return APIClient()
-
-
-@pytest.fixture
-def user(django_user_model):
-    return django_user_model.objects.create_user(
-        email="reader@example.com",
-        password="testpass123",
-    )
-
-
-@pytest.fixture
-def auth_client(api_client, user):
-    api_client.force_authenticate(user=user)
-    return api_client
-
-
-@pytest.fixture
-def books():
-    books_data = [
-        Book.objects.create(
-            title="Dune",
-            author="Frank Herbert",
-            genre="Science Fiction",
-            reading_status=ReadingStatus.FINISHED,
-            total_pages=688,
-            description="A desert planet saga.",
-        ),
-        Book.objects.create(
-            title="Neuromancer",
-            author="William Gibson",
-            genre="Science Fiction",
-            reading_status=ReadingStatus.READING,
-            total_pages=271,
-            description="Cyberpunk classic.",
-        ),
-        Book.objects.create(
-            title="The Hobbit",
-            author="J.R.R. Tolkien",
-            genre="Fantasy",
-            reading_status=ReadingStatus.WANT_TO_READ,
-            total_pages=310,
-            description="A hobbit's adventure.",
-        ),
-        Book.objects.create(
-            title="1984",
-            author="George Orwell",
-            genre="Dystopian",
-            reading_status=ReadingStatus.FINISHED,
-            total_pages=328,
-            description="Big Brother is watching.",
-        ),
-    ]
-    return books_data
-
-
-# ---------------------------------------------------------------------------
-# Search tests
-# ---------------------------------------------------------------------------
-
-
-@pytest.mark.django_db
-class TestBookSearch:
-    """Verify the search endpoint returns correct results."""
-
-    def test_search_by_title(self, auth_client, books):
-        url = reverse("book-list")
-        response = auth_client.get(url, {"q": "Dune"})
-        assert response.status_code == status.HTTP_200_OK
-        titles = [b["title"] for b in response.data["results"]]
-        assert "Dune" in titles
-        assert "Neuromancer" not in titles
-
-    def test_search_by_author(self, auth_client, books):
-        url = reverse("book-list")
-        response = auth_client.get(url, {"q": "Tolkien"})
-        assert response.status_code == status.HTTP_200_OK
-        titles = [b["title"] for b in response.data["results"]]
-        assert "The Hobbit" in titles
-
-    def test_search_by_genre(self, auth_client, books):
-        url = reverse("book-list")
-        response = auth_client.get(url, {"q": "Fantasy"})
-        assert response.status_code == status.HTTP_200_OK
-        titles = [b["title"] for b in response.data["results"]]
-        assert "The Hobbit" in titles
-
-    def test_search_case_insensitive(self, auth_client, books):
-        url = reverse("book-list")
-        response = auth_client.get(url, {"q": "dune"})
-        assert response.status_code == status.HTTP_200_OK
-        assert any(b["title"] == "Dune" for b in response.data["results"])
-
-    def test_search_partial_match(self, auth_client, books):
-        url = reverse("book-list")
-        response = auth_client.get(url, {"q": "Neu"})
-        assert response.status_code == status.HTTP_200_OK
-        titles = [b["title"] for b in response.data["results"]]
-        assert "Neuromancer" in titles
-
-    def test_search_empty_query_returns_all(self, auth_client, books):
-        url = reverse("book-list")
-        response = auth_client.get(url, {"q": ""})
-        assert response.status_code == status.HTTP_200_OK
-        assert len(response.data["results"]) == 4
-
-    def test_search_no_results(self, auth_client, books):
-        url = reverse("book-list")
-        response = auth_client.get(url, {"q": "zzzznotfound"})
-        assert response.status_code == status.HTTP_200_OK
-        assert len(response.data["results"]) == 0
-
-
-# ---------------------------------------------------------------------------
-# Filter tests
-# ---------------------------------------------------------------------------
-
-
-@pytest.mark.django_db
-class TestBookFilters:
-    """Verify filters for genre, author, and reading_status."""
-
-    def test_filter_by_genre(self, auth_client, books):
-        url = reverse("book-list")
-        response = auth_client.get(url, {"genre": "Science Fiction"})
-        assert response.status_code == status.HTTP_200_OK
-        titles = [b["title"] for b in response.data["results"]]
-        assert "Dune" in titles
-        assert "Neuromancer" in titles
-        assert "The Hobbit" not in titles
-
-    def test_filter_by_author(self, auth_client, books):
-        url = reverse("book-list")
-        response = auth_client.get(url, {"author": "George Orwell"})
-        assert response.status_code == status.HTTP_200_OK
-        titles = [b["title"] for b in response.data["results"]]
-        assert "1984" in titles
-        assert "Dune" not in titles
-
-    def test_filter_by_reading_status(self, auth_client, books):
-        url = reverse("book-list")
-        response = auth_client.get(url, {"reading_status": ReadingStatus.FINISHED})
-        assert response.status_code == status.HTTP_200_OK
-        titles = [b["title"] for b in response.data["results"]]
-        assert "Dune" in titles
-        assert "1984" in titles
-        assert "Neuromancer" not in titles
-        assert "The Hobbit" not in titles
-
-    def test_filter_combined_with_search(self, auth_client, books):
-        """Search + filter should intersect results."""
-        url = reverse("book-list")
-        response = auth_client.get(url, {"q": "Dune", "reading_status": ReadingStatus.FINISHED})
-        assert response.status_code == status.HTTP_200_OK
-        titles = [b["title"] for b in response.data["results"]]
-        assert "Dune" in titles
-        # 1984 matches reading_status but not search
-        assert "1984" not in titles
-
-
-# ---------------------------------------------------------------------------
-# Discovery endpoints
-# ---------------------------------------------------------------------------
-
-
-@pytest.mark.django_db
-class TestBookDiscovery:
-    """Verify genre and author discovery endpoints."""
-
-    def test_genres_endpoint(self, auth_client, books):
-        url = reverse("book-genres")
-        response = auth_client.get(url)
-        assert response.status_code == status.HTTP_200_OK
-        assert isinstance(response.data, list)
-        assert "Science Fiction" in response.data
-        assert "Fantasy" in response.data
-        assert "Dystopian" in response.data
-        # No duplicate genres
-        assert response.data.count("Science Fiction") == 1
-
-    def test_authors_endpoint(self, auth_client, books):
-        url = reverse("book-authors")
-        response = auth_client.get(url)
-        assert response.status_code == status.HTTP_200_OK
-        assert isinstance(response.data, list)
-        assert "Frank Herbert" in response.data
-        assert "J.R.R. Tolkien" in response.data
-
-    def test_genres_requires_auth(self, api_client, books):
-        url = reverse("book-genres")
-        response = api_client.get(url)
-        assert response.status_code == status.HTTP_401_UNAUTHORIZED
-
-    def test_authors_requires_auth(self, api_client, books):
-        url = reverse("book-authors")
-        response = api_client.get(url)
-        assert response.status_code == status.HTTP_401_UNAUTHORIZED
-
-
-# ---------------------------------------------------------------------------
-# Detail view
-# ---------------------------------------------------------------------------
-
-
-@pytest.mark.django_db
-class TestBookDetail:
-    """Verify the book detail endpoint."""
-
-    def test_retrieve_book(self, auth_client, books):
-        book = books[0]
-        url = reverse("book-detail", kwargs={"pk": book.pk})
-        response = auth_client.get(url)
-        assert response.status_code == status.HTTP_200_OK
-        assert response.data["title"] == "Dune"
-        assert response.data["author"] == "Frank Herbert"
-        assert response.data["description"] == "A desert planet saga."
-        assert response.data["total_pages"] == 688
-
-    def test_retrieve_nonexistent_returns_404(self, auth_client, books):
-        url = reverse("book-detail", kwargs={"pk": 99999})
-        response = auth_client.get(url)
-        assert response.status_code == status.HTTP_404_NOT_FOUND
-
-    def test_pagination(self, auth_client, books):
-        """List with small page size should paginate."""
-        url = reverse("book-list")
-        response = auth_client.get(f"{url}?page_size=2")
-        assert response.status_code == status.HTTP_200_OK
-        assert "count" in response.data
-        assert "results" in response.data
-        assert response.data["count"] == 4
-
-    def test_ordering(self, auth_client, books):
-        url = reverse("book-list")
-        response = auth_client.get(url, {"ordering": "title"})
-        assert response.status_code == status.HTTP_200_OK
-        titles = [b["title"] for b in response.data["results"]]
-        assert titles == sorted(titles)

backend/apps/books/urls.py

@@ -1,16 +1,11 @@
 from django.urls import include, path
 from rest_framework.routers import DefaultRouter
 
-from apps.books.views import BookViewSet, EBookViewSet, ReadingSettingsViewSet
+from apps.books.views import BookViewSet
 
 router = DefaultRouter()
 router.register(r"", BookViewSet, basename="book")
 
-ebook_router = DefaultRouter()
-ebook_router.register(r"ebooks", EBookViewSet, basename="ebook")
-
 urlpatterns = [
     path("", include(router.urls)),
-    path("", include(ebook_router.urls)),
-    path("settings/", ReadingSettingsViewSet.as_view({"get": "list", "patch": "partial_update"}), name="reading-settings"),
 ]

backend/apps/books/views.py

@@ -12,12 +12,13 @@ from rest_framework.permissions import AllowAny, IsAuthenticated
 from rest_framework.request import Request
 from rest_framework.response import Response
 
-from apps.books.models import Book, BookChapter, EBook, ReadingProgress, ReadingSettings
+from apps.books.models import Book, BookChapter, BookReadingProgress, DownloadRecord, EBook, Chapter, ReadingProgress, ReadingSettings
 from apps.books.serializers import (
-    BookDetailSerializer, BookListSerializer, BookSerializer,
+    BookChapterSerializer, BookDetailSerializer, BookListSerializer, BookSerializer,
-    BookChapterSerializer, EBookContentSerializer, EBookDetailSerializer,
+    BookReadingProgressSerializer, ChapterDetailSerializer, ChapterSummarySerializer,
+    DownloadRecordSerializer, EBookContentSerializer, EBookDetailSerializer,
     EBookListSerializer, EBookTocSerializer, EBookUploadSerializer,
-    ReadingProgressSerializer, ReadingSettingsSerializer,
+    ReadingProgressSerializer, ReadingSettingsSerializer, StorageSummarySerializer,
 )
 
 logger = logging.getLogger(__name__)
@@ -56,6 +57,64 @@ class BookViewSet(viewsets.ModelViewSet):
         author_list = Book.objects.values_list("author", flat=True).distinct().order_by("author")
         return Response([a for a in author_list if a])
 
+    @action(detail=False, methods=["get"])
+    def storage(self, request: Request) -> Response:
+        """Return storage usage summary for the current user."""
+        download_records = DownloadRecord.objects.filter(user=request.user).select_related("ebook")
+        total_size = sum(r.file_size for r in download_records)
+        ebook_list = [
+            {"id": r.ebook.id, "title": r.ebook.title, "file_size": r.file_size}
+            for r in download_records
+        ]
+        serializer = StorageSummarySerializer(data={
+            "total_downloads": download_records.count(),
+            "total_size_bytes": total_size,
+            "ebooks": ebook_list,
+        })
+        serializer.is_valid(raise_exception=True)
+        return Response(serializer.data)
+
+
+    @action(detail=True, methods=["get"])
+    def chapters(self, request: Request, pk: int | None = None) -> Response:
+        """List all chapters for this book (TOC)."""
+        book = self.get_object()
+        chapter_qs = Chapter.objects.filter(book=book).order_by("number")
+        serializer = ChapterSummarySerializer(chapter_qs, many=True)
+        return Response(serializer.data)
+
+    @action(detail=True, methods=["get"], url_path=r"chapters/(?P<chapter_number>[0-9]+)")
+    def chapter_detail(self, request: Request, pk: int | None = None, chapter_number: str | None = None) -> Response:
+        """Get a specific chapter with full content."""
+        book = self.get_object()
+        try:
+            chapter = Chapter.objects.get(book=book, number=int(chapter_number or "0"))
+        except Chapter.DoesNotExist:
+            return Response(
+                {"detail": "Chapter not found."}, status=status.HTTP_404_NOT_FOUND
+            )
+        serializer = ChapterDetailSerializer(chapter)
+        return Response(serializer.data)
+
+    @action(detail=True, methods=["get", "put"])
+    def progress(self, request: Request, pk: int | None = None) -> Response:
+        """Get or update chapter-based reading progress for this book."""
+        book = self.get_object()
+        progress_obj, _created = BookReadingProgress.objects.get_or_create(
+            user=request.user, book=book
+        )
+
+        if request.method == "GET":
+            serializer = BookReadingProgressSerializer(progress_obj)
+            return Response(serializer.data)
+
+        serializer = BookReadingProgressSerializer(
+            progress_obj, data=request.data, partial=True
+        )
+        serializer.is_valid(raise_exception=True)
+        serializer.save()
+        return Response(serializer.data, status=status.HTTP_200_OK)
+
 
 class IsEBookOwner(permissions.BasePermission):
     def has_object_permission(self, request: Request, view: object, obj: EBook) -> bool:
@@ -169,6 +228,48 @@ class EBookViewSet(viewsets.ModelViewSet):
         serializer.is_valid(raise_exception=True)
         return Response(serializer.data)
 
+    @action(detail=True, methods=["post"])
+    def download(self, request: Request, pk: int | None = None) -> Response:
+        """Track download of an e-book. Creates a DownloadRecord and returns file info."""
+        ebook = self.get_object()
+        if not ebook.file:
+            return Response({"error": "No file found for this e-book."}, status=status.HTTP_400_BAD_REQUEST)
+
+        download, created = DownloadRecord.objects.get_or_create(
+            user=request.user,
+            ebook=ebook,
+            defaults={"file_size": ebook.file.size if ebook.file else 0},
+        )
+        if not created:
+            download.file_size = ebook.file.size if ebook.file else 0
+            download.save(update_fields=["file_size"])
+
+        serializer = DownloadRecordSerializer(download, context={"request": request})
+        return Response(serializer.data, status=status.HTTP_200_OK)
+
+    @action(detail=False, methods=["get"])
+    def downloads(self, request: Request) -> Response:
+        """List all e-books the current user has downloaded."""
+        records = DownloadRecord.objects.filter(user=request.user).select_related(
+            "ebook", "ebook__reading_progress"
+        ).prefetch_related("ebook__chapters")
+        page = self.paginate_queryset(records)
+        if page is not None:
+            serializer = DownloadRecordSerializer(page, many=True, context={"request": request})
+            return self.get_paginated_response(serializer.data)
+        serializer = DownloadRecordSerializer(records, many=True, context={"request": request})
+        return Response(serializer.data)
+
+    @action(detail=False, methods=["delete"], url_path="downloads/(?P<download_pk>[^/.]+)")
+    def delete_download(self, request: Request, download_pk: str | None = None) -> Response:
+        """Delete a download record."""
+        try:
+            download = DownloadRecord.objects.get(pk=download_pk, user=request.user)
+        except DownloadRecord.DoesNotExist:
+            return Response({"error": "Download record not found."}, status=status.HTTP_404_NOT_FOUND)
+        download.delete()
+        return Response(status=status.HTTP_204_NO_CONTENT)
+
 
 def _store_chapters(ebook: EBook, toc: list[dict[str, Any]], parent_index: int = 0) -> None:
     """Recursively store TOC entries as BookChapter records."""

backend/apps/reader/apps.py

@@ -0,0 +1,7 @@
+from django.apps import AppConfig
+
+
+class ReaderConfig(AppConfig):
+    default_auto_field = "django.db.models.BigAutoField"
+    name = "apps.reader"
+    verbose_name = "Reader Settings"

backend/apps/reader/models.py

@@ -0,0 +1,53 @@
+from django.conf import settings
+from django.db import models
+
+
+class ReadingSettings(models.Model):
+    """Per-user reading preferences for the e-book reader view."""
+
+    THEME_CHOICES = [
+        ("sepia", "Sepia"),
+        ("dark", "Dark"),
+        ("light", "Light"),
+        ("paper", "Paper"),
+    ]
+
+    FONT_CHOICES = [
+        ("sans-serif", "Sans-serif"),
+        ("serif", "Serif"),
+        ("monospace", "Monospace"),
+    ]
+
+    ORIENTATION_CHOICES = [
+        ("auto", "Auto"),
+        ("portrait", "Portrait"),
+        ("landscape", "Landscape"),
+    ]
+
+    user = models.OneToOneField(
+        settings.AUTH_USER_MODEL,
+        on_delete=models.CASCADE,
+        related_name="reading_settings",
+        primary_key=True,
+    )
+    font_family = models.CharField(max_length=32, choices=FONT_CHOICES, default="serif")
+    font_size = models.PositiveSmallIntegerField(default=18)
+    line_height = models.FloatField(default=1.6)
+    margin_width = models.PositiveSmallIntegerField(default=16)
+    background_color = models.CharField(max_length=7, default="#f5f0eb")
+    text_color = models.CharField(max_length=7, default="#1a1a1a")
+    brightness = models.PositiveSmallIntegerField(default=100)
+    orientation_lock = models.CharField(
+        max_length=16, choices=ORIENTATION_CHOICES, default="auto"
+    )
+    theme = models.CharField(max_length=32, choices=THEME_CHOICES, default="sepia")
+    created_at = models.DateTimeField(auto_now_add=True)
+    updated_at = models.DateTimeField(auto_now=True)
+
+    class Meta:
+        db_table = "reader_reading_settings"
+        verbose_name = "Reading Settings"
+        verbose_name_plural = "Reading Settings"
+
+    def __str__(self) -> str:
+        return f"{self.user} — {self.theme} ({self.font_size}px)"

backend/apps/reader/serializers.py

@@ -0,0 +1,63 @@
+from rest_framework import serializers
+
+from apps.reader.models import ReadingSettings
+
+# Theme presets mapped to colors
+THEME_COLORS = {
+    "sepia": {"background_color": "#f5f0eb", "text_color": "#1a1a1a"},
+    "dark": {"background_color": "#1a1a2e", "text_color": "#e0e0e0"},
+    "light": {"background_color": "#ffffff", "text_color": "#1a1a1a"},
+    "paper": {"background_color": "#e8e0d4", "text_color": "#2c2c2c"},
+}
+
+
+class ReadingSettingsSerializer(serializers.ModelSerializer):
+    """Serialize ReadingSettings for the current user."""
+
+    class Meta:
+        model = ReadingSettings
+        fields = [
+            "font_family",
+            "font_size",
+            "line_height",
+            "margin_width",
+            "background_color",
+            "text_color",
+            "brightness",
+            "orientation_lock",
+            "theme",
+            "created_at",
+            "updated_at",
+        ]
+        read_only_fields = ["created_at", "updated_at"]
+
+    def validate_font_size(self, value: int) -> int:
+        if value < 12 or value > 32:
+            raise serializers.ValidationError("Font size must be between 12 and 32.")
+        return value
+
+    def validate_line_height(self, value: float) -> float:
+        if value < 1.2 or value > 2.0:
+            raise serializers.ValidationError("Line height must be between 1.2 and 2.0.")
+        return value
+
+    def validate_margin_width(self, value: int) -> int:
+        if value < 8 or value > 48:
+            raise serializers.ValidationError("Margin width must be between 8 and 48.")
+        return value
+
+    def validate_brightness(self, value: int) -> int:
+        if value < 0 or value > 100:
+            raise serializers.ValidationError("Brightness must be between 0 and 100.")
+        return value
+
+    def validate(self, attrs):
+        """Sync theme colors when theme changes, unless explicit colors provided."""
+        theme = attrs.get("theme")
+        if theme and theme in THEME_COLORS:
+            # Only auto-set colors if not explicitly provided
+            if "background_color" not in attrs:
+                attrs["background_color"] = THEME_COLORS[theme]["background_color"]
+            if "text_color" not in attrs:
+                attrs["text_color"] = THEME_COLORS[theme]["text_color"]
+        return attrs

backend/apps/reader/urls.py

@@ -0,0 +1,7 @@
+from django.urls import path
+
+from apps.reader.views import reading_settings_view
+
+urlpatterns = [
+    path("settings/", reading_settings_view, name="reading-settings"),
+]

backend/apps/reader/views.py

@@ -0,0 +1,33 @@
+from rest_framework import permissions, status
+from rest_framework.decorators import api_view, permission_classes
+from rest_framework.request import Request
+from rest_framework.response import Response
+
+from apps.reader.models import ReadingSettings
+from apps.reader.serializers import ReadingSettingsSerializer
+
+
+@api_view(["GET", "PUT", "PATCH"])
+@permission_classes([permissions.IsAuthenticated])
+def reading_settings_view(request: Request) -> Response:
+    """Get or update the current user's reading settings.
+
+    GET  → return existing settings (auto-create defaults if missing)
+    PUT  → create or fully replace settings
+    PATCH → partial update
+    """
+    user = request.user
+    settings, created = ReadingSettings.objects.get_or_create(user=user)
+
+    if request.method == "GET":
+        serializer = ReadingSettingsSerializer(settings)
+        return Response(serializer.data)
+
+    if request.method == "PUT":
+        serializer = ReadingSettingsSerializer(settings, data=request.data)
+    elif request.method == "PATCH":
+        serializer = ReadingSettingsSerializer(settings, data=request.data, partial=True)
+
+    serializer.is_valid(raise_exception=True)
+    serializer.save()
+    return Response(serializer.data, status=status.HTTP_200_OK)

backend/config/django.py

@@ -40,6 +40,7 @@ INSTALLED_APPS = [
     "apps.users",
     "apps.books",
     "apps.annotations",
+    "apps.reader",
 ]
 
 MIDDLEWARE = [
@@ -140,17 +141,13 @@ USE_I18N = True
 USE_TZ = True
 
 # ---------------------------------------------------------------------------
-# Static / Media / Uploads
+# Static / Media
 # ---------------------------------------------------------------------------
 STATIC_URL = "static/"
 STATIC_ROOT = BASE_DIR / "staticfiles"
 MEDIA_URL = "media/"
 MEDIA_ROOT = BASE_DIR / "media"
 
-# Maximum upload size: 50MB
-DATA_UPLOAD_MAX_MEMORY_SIZE = 52_428_800
-FILE_UPLOAD_MAX_MEMORY_SIZE = 52_428_800
-
 # ---------------------------------------------------------------------------
 # Default primary key
 # ---------------------------------------------------------------------------

backend/config/urls.py

@@ -6,4 +6,5 @@ urlpatterns = [
     path("api/auth/", include("apps.users.urls")),
     path("api/books/", include("apps.books.urls")),
     path("api/annotations/", include("apps.annotations.urls")),
+    path("api/reader/", include("apps.reader.urls")),
 ]

backend/requirements.txt

@@ -8,7 +8,6 @@ pydantic==2.10.5
 pydantic-settings==2.7.1
 python-dotenv==1.0.1
 gunicorn==23.0.0
-Pillow>=11.0.0
 pytest==8.3.4
 pytest-django==4.9.0
 pytest-cov==6.0.0

docker-compose.yml

@@ -5,54 +5,48 @@ services:
     volumes:
       - postgres_data:/var/lib/postgresql/data
     environment:
-      POSTGRES_DB: cloud_reader
+      POSTGRES_DB: cloudreader
-      POSTGRES_USER: postgres
+      POSTGRES_USER: cloudreader
-      POSTGRES_PASSWORD: postgres
+      POSTGRES_PASSWORD: cloudreader
     ports:
       - "5432:5432"
     healthcheck:
-      test: ["CMD-SHELL", "pg_isready -U postgres -d cloud_reader"]
+      test: ["CMD-SHELL", "pg_isready -U cloudreader -d cloudreader"]
       interval: 5s
       timeout: 5s
       retries: 10
 
-  backend:
+  api:
     build:
-      context: ./backend
+      context: ./api
-      dockerfile: Dockerfile
     ports:
       - "8000:8000"
     environment:
+      DATABASE_URL: "postgres://cloudreader:cloudreader@db:5432/cloudreader"
       DJANGO_SECRET_KEY: "dev-secret-key-change-in-production"
       DJANGO_DEBUG: "True"
-      DB_NAME: cloud_reader
-      DB_USER: postgres
-      DB_PASSWORD: postgres
-      DB_HOST: db
-      DB_PORT: "5432"
     volumes:
-      - ./backend:/app
+      - ./api:/app
-      - book_media:/app/media
+      - book_uploads:/app/media
     command: >
       sh -c "python manage.py migrate && python manage.py runserver 0.0.0.0:8000"
     depends_on:
       db:
         condition: service_healthy
 
-  frontend:
+  web:
     build:
-      context: ./frontend
+      context: ./web
-      dockerfile: Dockerfile
     ports:
-      - "5173:5173"
+      - "3000:3000"
     environment:
       VITE_API_URL: "http://localhost:8000"
     volumes:
-      - ./frontend:/app
+      - ./web:/app
       - /app/node_modules
     depends_on:
-      - backend
+      - api
 
 volumes:
   postgres_data:
-  book_media:
+  book_uploads:

docs/001-customizable-mobile-reading-experience.md

@@ -0,0 +1,246 @@
+# US: Customizable Mobile Reading Experience
+
+**Issue:** https://gitea-dev.codescripters.org/HermesFactory/cloud-reader/issues (TBD)
+
+## Overview
+
+Add a full-screen reading view for ebooks with customizable typography, themes,
+table of contents navigation, and orientation support. Mobile-first, responsive
+design that adapts to any screen size.
+
+---
+
+## Backend Specification
+
+### New Models
+
+#### `apps.books.models.Chapter`
+
+| Field        | Type               | Notes                          |
+|-------------|--------------------|--------------------------------|
+| id          | AutoField (PK)     |                                |
+| book        | FK -> Book         | related_name="chapters"        |
+| title       | CharField(512)     | Chapter title                  |
+| number      | PositiveIntegerField | Chapter ordering / TOC index |
+| content     | TextField          | Chapter text/markdown content  |
+| created_at  | DateTimeField      | auto_now_add                   |
+| updated_at  | DateTimeField      | auto_now                       |
+
+**Constraints:** UniqueConstraint(book, chapter_number)
+**Ordering:** [book, number]
+**Index:** FK to book with db_index
+
+#### `apps.books.models.ReadingProgress`
+
+| Field             | Type               | Notes                          |
+|------------------|--------------------|--------------------------------|
+| id               | AutoField (PK)     |                                |
+| user             | FK -> User         | related_name="reading_progress"|
+| book             | FK -> Book         | related_name="reading_progress"|
+| current_chapter  | PositiveIntegerField | Last chapter number          |
+| current_position | PositiveIntegerField | Position within chapter (paragraph) |
+| percentage       | FloatField         | 0.0 - 100.0 overall progress  |
+| updated_at       | DateTimeField      | auto_now                       |
+
+**Constraints:** UniqueConstraint(user, book)
+**Indexes:** (user, book) composite, (user) filter for list queries
+
+#### `apps.reader.models.ReadingSettings`
+
+New app `apps/reader/` for reading preferences, isolated from book data model.
+
+| Field              | Type               | Notes                         |
+|-------------------|--------------------|-------------------------------|
+| id                | AutoField (PK)     |                               |
+| user              | OneToOneField -> User | related_name="reading_settings" |
+| font_family       | CharField(32)      | "sans-serif", "serif", "monospace" |
+| font_size         | PositiveSmallIntegerField | 12-32, default 18       |
+| line_height       | FloatField         | 1.2 - 2.0, default 1.6       |
+| margin_width      | PositiveSmallIntegerField | 8-48, default 16 (px)   |
+| background_color  | CharField(7)       | Hex color, default "#f5f0eb" |
+| text_color        | CharField(7)       | Hex color, default "#1a1a1a" |
+| brightness        | PositiveSmallIntegerField | 0-100, default 100       |
+| orientation_lock  | CharField(16)      | "auto", "portrait", "landscape" |
+| theme             | CharField(32)      | "sepia", "dark", "light", "paper" |
+| created_at        | DateTimeField      | auto_now_add                  |
+| updated_at        | DateTimeField      | auto_now                      |
+
+### New API Endpoints
+
+All under `/api/` prefix, authenticated with JWT.
+
+#### Reader Settings (`/api/reader/settings/`)
+
+| Method | URL                          | Action                    |
+|--------|------------------------------|---------------------------|
+| GET    | /api/reader/settings/        | Get current user settings |
+| PUT    | /api/reader/settings/        | Create/update settings    |
+| PATCH  | /api/reader/settings/        | Partial update settings   |
+
+- Single-object endpoint (one settings record per user, auto-created on first GET)
+- Validation: font_size 12-32, line_height 1.2-2.0, margin_width 8-48
+
+#### Reading Progress (`/api/books/{id}/progress/`)
+
+| Method | URL                                    | Action                       |
+|--------|----------------------------------------|------------------------------|
+| GET    | /api/books/{id}/progress/              | Get reading progress for book|
+| PUT    | /api/books/{id}/progress/              | Create/update reading progress|
+
+- Nested under book detail
+- Auto-creates progress record on first PUT
+
+#### Chapters (`/api/books/{id}/chapters/`)
+
+| Method | URL                                    | Action                       |
+|--------|----------------------------------------|------------------------------|
+| GET    | /api/books/{id}/chapters/              | List chapters for book (TOC) |
+| GET    | /api/books/{id}/chapters/{number}/     | Get specific chapter content |
+
+- Ordering by `number`
+- Used by frontend TOC sidebar and content loading
+
+---
+
+## Frontend Specification
+
+### New Pages
+
+#### `/reader/:bookId` — ReadingPage
+
+Full-screen reading view with:
+- Chapter content display (left/right swiping or scroll)
+- Bottom toolbar: TOC toggle, Settings toggle, Progress indicator
+- Top bar: Back button, Book title, Chapter title
+- Swipe/tap/page navigation between chapters
+
+### New Components
+
+#### `ReaderToolbar`
+- Fixed bottom toolbar
+- TOC button (opens TOC drawer)
+- Settings/theme button (opens settings panel)
+- Progress bar showing overall reading progress
+
+#### `TableOfContents`
+- Slide-in drawer from left
+- Lists all chapters with current chapter highlighted
+- Tap on chapter to navigate
+- Shows reading progress per chapter
+
+#### `ReadingSettingsPanel`
+- Slide-in drawer from right (or bottom sheet on mobile)
+- Controls:
+  - Theme presets: Sepia, Dark, Light, Paper
+  - Font family: Sans-serif, Serif, Monospace
+  - Font size slider (12-32)
+  - Line height slider (1.2-2.0)
+  - Margin/padding control
+  - Orientation lock toggle (Auto / Portrait / Landscape)
+- All changes persist immediately via API
+- LocalStorage fallback when offline
+
+### New Hooks
+
+#### `useReadingSettings(bookId)`
+- Fetches user reading settings from API
+- Returns current settings + update function
+- Applies CSS custom properties to document root
+- Falls back to defaults if API unavailable
+
+#### `useChapters(bookId)`
+- Fetches chapter list for TOC
+- Returns chapters array, current chapter, navigate function
+- Prefetches next/prev chapter content
+
+#### `useReadingProgress(bookId)`
+- Fetches/updates reading progress
+- Auto-saves position on chapter change and periodic interval
+
+### New Types
+
+```typescript
+interface Chapter {
+  id: number;
+  book: number;
+  title: string;
+  number: number;
+  content?: string; // Only present when fetching individual chapter
+}
+
+interface ChapterSummary {
+  id: number;
+  book: number;
+  title: string;
+  number: number;
+}
+
+interface ReadingSettings {
+  font_family: "sans-serif" | "serif" | "monospace";
+  font_size: number;
+  line_height: number;
+  margin_width: number;
+  background_color: string;
+  text_color: string;
+  brightness: number;
+  orientation_lock: "auto" | "portrait" | "landscape";
+  theme: "sepia" | "dark" | "light" | "paper";
+}
+
+interface ReadingProgress {
+  current_chapter: number;
+  current_position: number;
+  percentage: number;
+  updated_at: string;
+}
+```
+
+### CSS / Theming
+
+Reading view uses CSS custom properties driven by reading settings:
+
+```css
+:root {
+  --reader-bg: var(--bg-color, #f5f0eb);
+  --reader-text: var(--text-color, #1a1a1a);
+  --reader-font-family: var(--font-family, "Georgia", serif);
+  --reader-font-size: var(--font-size, 18px);
+  --reader-line-height: var(--line-height, 1.6);
+  --reader-margin: var(--margin-width, 16px);
+}
+```
+
+Three theme presets:
+- **Sepia**: `bg:#f5f0eb`, `text:#1a1a1a` — warm, easy on eyes
+- **Dark**: `bg:#1a1a2e`, `text:#e0e0e0` — for low-light reading
+- **Light**: `bg:#ffffff`, `text:#1a1a1a` — crisp and clean
+- **Paper**: `bg:#e8e0d4`, `text:#2c2c2c` — book-like feel
+
+### Orientation Support
+
+- CSS `@media (orientation: portrait)` and `@media (orientation: landscape)` breakpoints
+- Reading settings panel includes orientation lock toggle
+- On mobile, landscape mode expands content horizontally with wider margins
+- Portrait mode stacks controls vertically for thumb-reachable UI
+
+### Routing
+
+Add to App.tsx:
+```
+/                     → LibraryPage
+/books/:bookId        → BookDetailPage
+/reader/:bookId       → ReadingPage
+```
+
+---
+
+## Implementation Order
+
+1. Backend models + migrations (Chapter, ReadingProgress, ReadingSettings)
+2. Backend serializers + views + URLs
+3. Frontend types + API client
+4. Frontend hooks (useReadingSettings, useChapters, useReadingProgress)
+5. Frontend components (ReadingSettingsPanel, TableOfContents, ReaderToolbar)
+6. Frontend page (ReadingPage)
+7. Routing updates
+8. CSS / theming

docs/backend/009-expo-integration.md

@@ -1,96 +0,0 @@
-# 009 — Expo Mobile Application Integration
-
-**Issue:** #16
-**Status:** Draft
-**Created:** 2026-05-29
-
-## Objective
-
-Integrate an Expo-based React Native mobile application into the `cloud-reader` monorepo, sharing types, API client patterns, and configuration with the existing web frontend.
-
-## Directory Structure
-
-```
-cloud-reader/
-├── mobile/                    # Expo React Native app
-│   ├── package.json
-│   ├── app.json
-│   ├── tsconfig.json
-│   ├── babel.config.js
-│   ├── App.tsx               # Root component
-│   ├── src/
-│   │   ├── api/              # API client (mirrors frontend/src/api/ pattern)
-│   │   │   ├── client.ts     # Axios instance + JWT interceptor
-│   │   │   ├── books.ts      # Book API calls
-│   │   │   └── annotations.ts
-│   │   ├── screens/          # Screen-level components
-│   │   ├── components/       # Reusable UI components
-│   │   ├── navigation/       # React Navigation setup
-│   │   ├── context/          # Auth context, etc.
-│   │   ├── hooks/            # Custom hooks
-│   │   └── types/            # Mobile-specific types
-│   └── assets/
-├── packages/
-│   └── shared/
-│       ├── package.json
-│       ├── tsconfig.json
-│       └── src/
-│           ├── types.ts      # Shared domain types (Book, User, Bookmark, Note)
-│           └── utils.ts      # Shared utility functions
-└── package.json              # Root — updated workspace config
-```
-
-## Monorepo Workspace Config
-
-Root `package.json` workspaces array updated to include `"mobile"`, `"packages/shared"` alongside existing `"frontend"` and `"backend"`.
-
-## Shared `packages/shared`
-
-- `@cloud-reader/shared` package published within the monorepo
-- Exports:
-  - All domain types (`Book`, `BookSummary`, `Bookmark`, `Note`, `User`, `AnnotationEntry`, `PaginatedResponse`, `TokenResponse`)
-  - API endpoint constants
-  - Date formatting helpers
-  - Validation utilities (email regex, password strength check)
-
-## Mobile App Structure
-
-### API Client (`mobile/src/api/client.ts`)
-- Axios instance configured with:
-  - Base URL from environment variable (`EXPO_PUBLIC_API_URL`)
-  - JWT token attachment via request interceptor
-  - Token refresh response interceptor on 401
-  - Uses `AsyncStorage` for token persistence (instead of `localStorage`)
-
-### Navigation (`mobile/src/navigation/`)
-- React Navigation stack:
-  1. `AuthStack` — Login, Register screens
-  2. `MainTabs` — Library, Search, Settings tabs
-  3. `BookReader` — Full-screen reading view
-
-### Key Screens
-| Screen | Route | Purpose |
-|--------|-------|---------|
-| Login | `Auth/Login` | Email/password login |
-| Register | `Auth/Register` | User registration |
-| Library | `Main/Library` | Book list with filtering |
-| BookDetail | `Main/BookDetail` | Book metadata + actions |
-| Reader | `Reader/View` | EPUB/PDF rendering |
-| Search | `Main/Search` | Book discovery |
-| Settings | `Main/Settings` | Profile, theme, download mgmt |
-
-## Backend Changes Required
-
-None. The existing Django REST API already serves all endpoints needed by the mobile app. The mobile app communicates with the same backend via the shared API base URL.
-
-## Docker
-
-No changes to `docker-compose.yml` needed — the mobile app runs on-device or via Expo Go, not inside Docker.
-
-## CI/CD Considerations
-
-The monorepo structure supports a single pipeline that can:
-- `yarn install` at root (installs all workspaces)
-- `yarn workspace @cloud-reader/shared build`
-- `yarn workspace @cloud-reader/mobile build` (Expo EAS for mobile builds)
-- `yarn workspace @cloud-reader/frontend build` (Vite for web builds)

docs/backend/search-discovery-spec.md

@@ -1,107 +0,0 @@
-# Book Search & Discovery — Spec
-
-## Overview
-Enable users to search books within the library and discover new books via filters and a dedicated detail view.
-
-## Backend API Contracts
-
-### Book List & Search
-`GET /api/books/`
-
-**Query Parameters:**
-| Param | Type | Description |
-|-------|------|-------------|
-| `q` | string | Full-text search across title, author, genre |
-| `genre` | string | Exact filter by genre |
-| `author` | string | Exact filter by author |
-| `reading_status` | string | Filter: `want_to_read`, `reading`, `finished`, `dnf` |
-| `ordering` | string | `title`, `author`, `genre`, `created_at` (prefix `-` for desc) |
-| `page` | int | Page number (default: 1) |
-
-**Response (paginated):**
-```json
-{
-  "count": 42,
-  "next": "http://.../?page=2",
-  "previous": null,
-  "results": [
-    {
-      "id": 1,
-      "title": "Dune",
-      "author": "Frank Herbert",
-      "genre": "Science Fiction",
-      "reading_status": "finished",
-      "reading_status_display": "Finished",
-      "cover_image": "https://..."
-    }
-  ]
-}
-```
-
-### Book Detail
-`GET /api/books/{id}/`
-
-**Response:**
-```json
-{
-  "id": 1,
-  "title": "Dune",
-  "author": "Frank Herbert",
-  "genre": "Science Fiction",
-  "description": "...",
-  "reading_status": "finished",
-  "reading_status_display": "Finished",
-  "cover_image": "https://...",
-  "total_pages": 688,
-  "created_at": "2025-01-01T00:00:00Z",
-  "updated_at": "2025-01-15T00:00:00Z"
-}
-```
-
-### Genre / Author Discovery
-`GET /api/books/genres/` → `["Fiction", "Science Fiction", ...]`
-
-`GET /api/books/authors/` → `["Frank Herbert", "Ursula K. Le Guin", ...]`
-
-## Frontend Components
-
-### LibraryPage (enhanced)
-- **Search bar** at top: text input with debounced `onChange` → calls API with `q` param
-- **Filter row**: genre dropdown, author dropdown, reading status dropdown
-  - Genre/Author dropdowns populated from `/api/books/genres/` and `/api/books/authors/`
-  - Reading status uses static enum values (`READING_STATUS_OPTIONS`)
-- **Results grid**: card layout showing cover, title, author, reading status badge
-- **Empty state**: "No books found" with clear message when results are empty
-- **Loading state**: spinner/skeleton while fetching
-- **Click card → navigate to** `/books/{id}`
-
-### BookDetailPage (new)
-- Shows full book info: cover, title, author, genre, description, reading status, total pages
-- Back button to return to library
-- Clean, mobile-responsive layout
-
-### API Client — `frontend/src/api/books.ts`
-
-| Method | Endpoint | Returns |
-|--------|----------|---------|
-| `searchBooks(params)` | `GET /api/books/` | `{count, results: BookListItem[]}` |
-| `getBook(id)` | `GET /api/books/{id}/` | `BookDetail` |
-| `getGenres()` | `GET /api/books/genres/` | `string[]` |
-| `getAuthors()` | `GET /api/books/authors/` | `string[]` |
-
-## Routes (Frontend)
-| Path | Component | Auth |
-|------|-----------|------|
-| `/` | LibraryPage | Protected |
-| `/books/:id` | BookDetailPage | Protected |
-
-## Data Flow
-1. User types in search bar → 300ms debounce → `GET /api/books/?q=...`
-2. User selects filter → `GET /api/books/?genre=...&author=...&reading_status=...`
-3. User clicks result → navigate to `/books/:id`
-4. BookDetailPage → `GET /api/books/{id}/`
-
-## Mobile Optimizations
-- Filters collapse into a toggleable panel on small screens
-- Cards stack in single column on mobile
-- Touch-friendly tap targets (min 44px)

docs/frontend/mobile-search-spec.md

@@ -1,99 +0,0 @@
-# Mobile Book Search & Discovery — Spec
-
-## Overview
-Enhance the existing book search experience with mobile-first features: voice search via the Web Speech API, real-time autocomplete suggestions, and touch-optimized responsive layout.
-
-## Prerequisites
-- Backend endpoints already exist (from `docs/backend/search-discovery-spec.md`):
-  - `GET /api/books/?q=...&genre=...&author=...&reading_status=...` — paginated search
-  - `GET /api/books/{id}/` — book detail
-  - `GET /api/books/genres/` — genre discovery
-  - `GET /api/books/authors/` — author discovery
-- Frontend `LibraryPage` and `BookDetailPage` components exist but lacked API client methods and types (fixed in this PR).
-
-## Frontend API Client Additions
-
-### `frontend/src/types/book.ts` — New exports
-
-```typescript
-export interface BookSearchParams {
-  q?: string;
-  genre?: string;
-  author?: string;
-  reading_status?: string;
-  ordering?: string;
-  page?: number;
-  page_size?: number;
-}
-
-export const READING_STATUS_OPTIONS: { value: string; label: string }[] = [
-  { value: "", label: "All Statuses" },
-  { value: "want_to_read", label: "Want to Read" },
-  { value: "reading", label: "Reading" },
-  { value: "finished", label: "Finished" },
-  { value: "dnf", label: "Did Not Finish" },
-];
-```
-
-### `frontend/src/api/books.ts` — New methods on `booksApi`
-
-| Method | Endpoint | Returns |
-|--------|----------|---------|
-| `searchBooks(params)` | `GET /api/books/` | `{ count, results: BookListItem[] }` |
-| `getBook(id)` | `GET /api/books/{id}/` | `BookDetail` |
-| `getGenres()` | `GET /api/books/genres/` | `string[]` |
-| `getAuthors()` | `GET /api/books/authors/` | `string[]` |
-
-## Mobile Features
-
-### 1. Voice Search
-- **Hook**: `useVoiceSearch` in `frontend/src/hooks/useVoiceSearch.ts`
-- Uses the Web Speech API (`SpeechRecognition` / `webkitSpeechRecognition`)
-- Returns: `{ isListening, transcript, isSupported, startListening, stopListening, hasError }`
-- Renders a microphone icon button next to the search input
-- On mobile, tapping the mic icon triggers the native speech recognition prompt
-- On success, populates the search input with the transcript and triggers a search
-- Graceful degradation: if SpeechRecognition API is unavailable, the mic button is hidden
-
-### 2. Real-Time Suggestions (Autocomplete)
-- Component: `SearchSuggestions` rendered as a dropdown below the search input
-- On each keystroke (debounced 200ms), fetches `GET /api/books/?q=...&page_size=5` for suggestions
-- Shows up to 5 book title/author suggestions in a styled dropdown list
-- Clicking a suggestion navigates directly to `/books/{id}`
-- Clicking outside or pressing Escape dismisses the dropdown
-- Combines with existing full search results — suggestions are fast previews, not the main result list
-
-### 3. Mobile-Responsive Enhancements
-- Filters panel is **collapsed by default** on mobile, toggleable via a "Filters" button
-- Touch targets minimum 44px (WCAG 2.1)
-- Results grid switches to **single column** below 600px viewport width
-- Search input and filters panel stack vertically on small screens
-- Add CSS breakpoints via inline styles and a `useMediaQuery` hook
-- Bottom navigation-style action buttons on mobile (Add Book, Bookmarks, Settings become icon-only)
-
-## Component Hierarchy
-
-```
-LibraryPage
-├── Header (title, count, action buttons)
-├── SearchInput
-│   ├── TextInput (debounced 300ms)
-│   ├── VoiceSearchButton (microphone icon)
-│   └── SearchSuggestions (dropdown, debounced 200ms)
-├── FiltersButton (mobile: toggle; desktop: always visible)
-├── FiltersPanel (collapsible on mobile)
-│   ├── GenreSelect
-│   ├── AuthorSelect
-│   ├── StatusSelect
-│   └── ClearFiltersButton
-├── LoadingState (skeleton grid)
-├── ErrorState (message + retry button)
-├── EmptyState (no results / no books)
-└── ResultsGrid (responsive: auto-fill vs single column)
-```
-
-## Mobile-First CSS Strategy
-- Use inline styles with `@media` queries in a shared `breakpoints.ts` utility
-- Breakpoints: sm = 480px, md = 768px, lg = 1024px
-- Base styles are mobile-first (single column, full width)
-- Media queries expand to multi-column grid and horizontal layout on larger screens

frontend/Dockerfile

@@ -1,12 +0,0 @@
-FROM node:20-alpine
-
-WORKDIR /app
-
-COPY package.json yarn.lock ./
-RUN yarn install --frozen-lockfile
-
-COPY . ./
-
-EXPOSE 5173
-
-CMD ["yarn", "dev", "--host"]

frontend/src/App.tsx

@@ -6,8 +6,10 @@ const LibraryPage = lazy(() => import("./pages/Library").then((m) => ({ default:
 const BookDetailPage = lazy(() => import("./pages/BookDetailPage").then((m) => ({ default: m.BookDetailPage })));
 const ReaderPage = lazy(() => import("./pages/Reader").then((m) => ({ default: m.ReaderPage })));
 const AddBookPage = lazy(() => import("./pages/AddBook").then((m) => ({ default: m.AddBookPage })));
+const EditEBookPage = lazy(() => import("./pages/EditEBook").then((m) => ({ default: m.EditEBookPage })));
 const SettingsPage = lazy(() => import("./pages/Settings").then((m) => ({ default: m.SettingsPage })));
 const BookmarksNotesPage = lazy(() => import("./components/annotations/BookmarksNotesPage").then((m) => ({ default: m.BookmarksNotesPage })));
+const ReadingPage = lazy(() => import("./pages/ReadingPage").then((m) => ({ default: m.default })));
 
 const AuthPage = lazy(() =>
   import("./pages/AuthPage").then((m) => ({
@@ -38,7 +40,9 @@ function AppRoutes() {
         <Route path="/" element={<ProtectedRoute><LibraryPage /></ProtectedRoute>} />
         <Route path="/books/:id" element={<ProtectedRoute><BookDetailPage /></ProtectedRoute>} />
         <Route path="/reader/:id" element={<ProtectedRoute><ReaderPage /></ProtectedRoute>} />
+        <Route path="/read/:id" element={<ProtectedRoute><ReadingPage /></ProtectedRoute>} />
         <Route path="/add" element={<ProtectedRoute><AddBookPage /></ProtectedRoute>} />
+        <Route path="/edit/:id" element={<ProtectedRoute><EditEBookPage /></ProtectedRoute>} />
         <Route path="/settings" element={<ProtectedRoute><SettingsPage /></ProtectedRoute>} />
         <Route path="/bookmarks-notes/:bookId?" element={<ProtectedRoute><BookmarksNotesPage /></ProtectedRoute>} />
         <Route path="*" element={<Navigate to="/" replace />} />

frontend/src/api/books.ts

@@ -1,121 +0,0 @@
-import api from "./client";
-import type {
-  BookDetail,
-  BookListItem,
-  BookSearchParams,
-  ContentResponse,
-  EBookDetail,
-  EBookListItem,
-  ReadingProgress,
-  ReadingSettings,
-  TocResponse,
-} from "../types/book";
-
-export const booksApi = {
-  async getEBooks(): Promise<EBookListItem[]> {
-    const { data } = await api.get<EBookListItem[]>("/books/ebooks/");
-    return data;
-  },
-
-  async searchBooks(params: BookSearchParams = {}): Promise<{ count: number; results: BookListItem[] }> {
-    const { data } = await api.get<{ count: number; results: BookListItem[] }>("/books/", { params });
-    return data;
-  },
-
-  async getBook(id: number): Promise<BookDetail> {
-    const { data } = await api.get<BookDetail>(`/books/${id}/`);
-    return data;
-  },
-
-  async getGenres(): Promise<string[]> {
-    const { data } = await api.get<string[]>("/books/genres/");
-    return data;
-  },
-
-  async getAuthors(): Promise<string[]> {
-    const { data } = await api.get<string[]>("/books/authors/");
-    return data;
-  },
-
-  async getEBook(id: number): Promise<EBookDetail> {
-    const { data } = await api.get<EBookDetail>(`/books/ebooks/${id}/`);
-    return data;
-  },
-
-  async searchBooks(params: BookSearchParams = {}): Promise<{ count: number; results: BookListItem[] }> {
-    const { data } = await api.get<{ count: number; results: BookListItem[] }>("/books/", { params });
-    return data;
-  },
-
-  async getBook(id: number): Promise<BookDetail> {
-    const { data } = await api.get<BookDetail>(`/books/${id}/`);
-    return data;
-  },
-
-  async getGenres(): Promise<string[]> {
-    const { data } = await api.get<string[]>("/books/genres/");
-    return data;
-  },
-
-  async getAuthors(): Promise<string[]> {
-    const { data } = await api.get<string[]>("/books/authors/");
-    return data;
-  },
-
-  async uploadEBook(
-    file: File,
-    title: string,
-    author: string,
-    coverImage?: File | null,
-  ): Promise<EBookDetail> {
-    const formData = new FormData();
-    formData.append("file", file);
-    formData.append("title", title);
-    if (author) formData.append("author", author);
-    if (coverImage) formData.append("cover_image", coverImage);
-
-    const { data } = await api.post<EBookDetail>("/books/ebooks/", formData, {
-      headers: { "Content-Type": "multipart/form-data" },
-    });
-    return data;
-  },
-
-  async deleteEBook(id: number): Promise<void> {
-    await api.delete(`/books/ebooks/${id}/`);
-  },
-
-  async processEBook(id: number): Promise<{ status: string }> {
-    const { data } = await api.post<{ status: string }>(`/books/ebooks/${id}/process/`);
-    return data;
-  },
-
-  async getToc(id: number): Promise<TocResponse> {
-    const { data } = await api.get<TocResponse>(`/books/ebooks/${id}/toc/`);
-    return data;
-  },
-
-  async getContent(id: number, page: number): Promise<ContentResponse> {
-    const { data } = await api.get<ContentResponse>(`/books/ebooks/${id}/content/?page=${page}`);
-    return data;
-  },
-
-  async getProgress(ebookId: number): Promise<ReadingProgress> {
-    const { data } = await api.get<ReadingProgress>(`/books/ebooks/${ebookId}/progress/`);
-    return data;
-  },
-
-  async updateProgress(ebookId: number, progressData: Partial<ReadingProgress>): Promise<ReadingProgress> {
-    const { data } = await api.patch<ReadingProgress>(`/books/ebooks/${ebookId}/progress/`, progressData);
-    return data;
-  },
-
-  async getSettings(): Promise<ReadingSettings> {
-    const { data } = await api.get<ReadingSettings>("/books/settings/");
-    return data;
-  },
-
-  async updateSettings(settingsData: Partial<ReadingSettings>): Promise<ReadingSettings> {
-    const { data } = await api.patch<ReadingSettings>("/books/settings/", settingsData);
-    return data;
-  },
-};

frontend/src/api/reader.ts

@@ -0,0 +1,112 @@
+/**
+ * API client for the reader module — reading settings, chapters, and progress.
+ */
+
+import type {
+  ChapterDetail,
+  ChapterSummary,
+  ReadingProgress,
+  ReadingSettings,
+} from "../types/reader";
+
+const API_BASE = "/api";
+
+/**
+ * Fetch the current user's reading settings.
+ * Auto-creates defaults on the server if none exist.
+ */
+export async function getReadingSettings(): Promise<ReadingSettings> {
+  const response = await fetch(`${API_BASE}/reader/settings/`);
+  if (!response.ok) {
+    throw new Error(
+      `Failed to fetch reading settings: ${response.status} ${response.statusText}`
+    );
+  }
+  return response.json() as Promise<ReadingSettings>;
+}
+
+/**
+ * Update (full or partial) the user's reading settings.
+ */
+export async function updateReadingSettings(
+  settings: Partial<ReadingSettings>
+): Promise<ReadingSettings> {
+  const method = settings.theme !== undefined ? "PUT" : "PATCH";
+  const response = await fetch(`${API_BASE}/reader/settings/`, {
+    method,
+    headers: { "Content-Type": "application/json" },
+    body: JSON.stringify(settings),
+  });
+  if (!response.ok) {
+    throw new Error(
+      `Failed to update reading settings: ${response.status} ${response.statusText}`
+    );
+  }
+  return response.json() as Promise<ReadingSettings>;
+}
+
+/**
+ * Fetch the table of contents (chapter list) for a book.
+ */
+export async function getChapters(bookId: number): Promise<ChapterSummary[]> {
+  const response = await fetch(`${API_BASE}/books/${bookId}/chapters/`);
+  if (!response.ok) {
+    throw new Error(
+      `Failed to fetch chapters: ${response.status} ${response.statusText}`
+    );
+  }
+  return response.json() as Promise<ChapterSummary[]>;
+}
+
+/**
+ * Fetch a specific chapter with full content for reading.
+ */
+export async function getChapterContent(
+  bookId: number,
+  chapterNumber: number
+): Promise<ChapterDetail> {
+  const response = await fetch(
+    `${API_BASE}/books/${bookId}/chapters/${chapterNumber}/`
+  );
+  if (!response.ok) {
+    throw new Error(
+      `Failed to fetch chapter ${chapterNumber}: ${response.status} ${response.statusText}`
+    );
+  }
+  return response.json() as Promise<ChapterDetail>;
+}
+
+/**
+ * Fetch reading progress for a book.
+ */
+export async function getReadingProgress(
+  bookId: number
+): Promise<ReadingProgress> {
+  const response = await fetch(`${API_BASE}/books/${bookId}/progress/`);
+  if (!response.ok) {
+    throw new Error(
+      `Failed to fetch reading progress: ${response.status} ${response.statusText}`
+    );
+  }
+  return response.json() as Promise<ReadingProgress>;
+}
+
+/**
+ * Update reading progress for a book.
+ */
+export async function updateReadingProgress(
+  bookId: number,
+  progress: Partial<ReadingProgress>
+): Promise<ReadingProgress> {
+  const response = await fetch(`${API_BASE}/books/${bookId}/progress/`, {
+    method: "PUT",
+    headers: { "Content-Type": "application/json" },
+    body: JSON.stringify(progress),
+  });
+  if (!response.ok) {
+    throw new Error(
+      `Failed to update reading progress: ${response.status} ${response.statusText}`
+    );
+  }
+  return response.json() as Promise<ReadingProgress>;
+}

frontend/src/components/reader/ReaderToolbar.tsx

@@ -0,0 +1,67 @@
+/**
+ * ReaderToolbar — fixed bottom toolbar for the reading view.
+ * Provides TOC toggle, settings toggle, and progress indicator.
+ */
+
+import type { ReadingProgress } from "../../types/reader";
+
+interface ReaderToolbarProps {
+  bookTitle: string;
+  chapterTitle: string;
+  progress: ReadingProgress | null;
+  onToggleToc: () => void;
+  onToggleSettings: () => void;
+}
+
+export default function ReaderToolbar({
+  bookTitle,
+  chapterTitle,
+  progress,
+  onToggleToc,
+  onToggleSettings,
+}: ReaderToolbarProps) {
+  const percentage = progress?.percentage ?? 0;
+
+  return (
+    <>
+      {/* Top bar */}
+      <header className="reader-top-bar">
+        <button
+          type="button"
+          className="reader-bar-btn"
+          onClick={onToggleToc}
+          aria-label="Table of contents"
+        >
+          <svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
+            <line x1="3" y1="6" x2="21" y2="6" />
+            <line x1="3" y1="12" x2="21" y2="12" />
+            <line x1="3" y1="18" x2="21" y2="18" />
+          </svg>
+        </button>
+        <div className="reader-bar-title">
+          <span className="reader-bar-book">{bookTitle}</span>
+          <span className="reader-bar-chapter">{chapterTitle}</span>
+        </div>
+        <button
+          type="button"
+          className="reader-bar-btn"
+          onClick={onToggleSettings}
+          aria-label="Reading settings"
+        >
+          <svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
+            <circle cx="12" cy="12" r="3" />
+            <path d="M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1 0 2.83 2 2 0 0 1-2.83 0l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-2 2 2 2 0 0 1-2-2v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83 0 2 2 0 0 1 0-2.83l.06-.06A1.65 1.65 0 0 0 4.68 15a1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1-2-2 2 2 0 0 1 2-2h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 0-2.83 2 2 0 0 1 2.83 0l.06.06A1.65 1.65 0 0 0 9 4.68a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 2-2 2 2 0 0 1 2 2v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 0 2 2 0 0 1 0 2.83l-.06.06a1.65 1.65 0 0 0-.33 1.82V9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 2 2 2 2 0 0 1-2 2h-.09a1.65 1.65 0 0 0-1.51 1z" />
+          </svg>
+        </button>
+      </header>
+
+      {/* Bottom progress bar */}
+      <div className="reader-progress-bar">
+        <div
+          className="reader-progress-fill"
+          style={{ width: `${Math.min(percentage, 100)}%` }}
+        />
+      </div>
+    </>
+  );
+}

frontend/src/components/reader/ReadingSettingsPanel.tsx

@@ -0,0 +1,232 @@
+/**
+ * ReadingSettingsPanel — slide-in drawer from the right for customizing
+ * the reading experience: theme, font, sizing, orientation.
+ */
+
+import { useState } from "react";
+import type {
+  FontFamily,
+  OrientationLock,
+  ReadingSettings,
+  ThemePreset,
+} from "../../types/reader";
+
+interface ReadingSettingsPanelProps {
+  settings: ReadingSettings;
+  isOpen: boolean;
+  onClose: () => void;
+  onUpdate: (partial: Partial<ReadingSettings>) => Promise<void>;
+}
+
+const THEME_OPTIONS: { value: ThemePreset; label: string }[] = [
+  { value: "sepia", label: "Sepia" },
+  { value: "dark", label: "Dark" },
+  { value: "light", label: "Light" },
+  { value: "paper", label: "Paper" },
+];
+
+const FONT_OPTIONS: { value: FontFamily; label: string }[] = [
+  { value: "sans-serif", label: "Sans-serif" },
+  { value: "serif", label: "Serif" },
+  { value: "monospace", label: "Monospace" },
+];
+
+const ORIENTATION_OPTIONS: { value: OrientationLock; label: string }[] = [
+  { value: "auto", label: "Auto" },
+  { value: "portrait", label: "Portrait" },
+  { value: "landscape", label: "Landscape" },
+];
+
+export default function ReadingSettingsPanel({
+  settings,
+  isOpen,
+  onClose,
+  onUpdate,
+}: ReadingSettingsPanelProps) {
+  const [saving, setSaving] = useState<Record<string, boolean>>({});
+
+  const handleChange = async (
+    key: keyof ReadingSettings,
+    value: string | number
+  ) => {
+    setSaving((prev) => ({ ...prev, [key]: true }));
+    try {
+      await onUpdate({ [key]: value as never });
+    } finally {
+      setSaving((prev) => ({ ...prev, [key]: false }));
+    }
+  };
+
+  return (
+    <>
+      {/* Overlay */}
+      {isOpen && (
+        <div
+          className="settings-overlay"
+          onClick={onClose}
+          onKeyDown={(e: React.KeyboardEvent) => {
+            if (e.key === "Escape") onClose();
+          }}
+          role="presentation"
+        />
+      )}
+
+      {/* Drawer */}
+      <aside
+        className={`settings-drawer ${isOpen ? "settings-drawer--open" : ""}`}
+      >
+        <div className="settings-header">
+          <h2 className="settings-title">Reading Settings</h2>
+          <button
+            type="button"
+            className="settings-close-btn"
+            onClick={onClose}
+            aria-label="Close settings"
+          >
+            <svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
+              <line x1="18" y1="6" x2="6" y2="18" />
+              <line x1="6" y1="6" x2="18" y2="18" />
+            </svg>
+          </button>
+        </div>
+
+        <div className="settings-body">
+          {/* Theme Presets */}
+          <section className="settings-section">
+            <h3 className="settings-section-title">Theme</h3>
+            <div className="theme-grid">
+              {THEME_OPTIONS.map((opt) => (
+                <button
+                  key={opt.value}
+                  type="button"
+                  className={`theme-btn ${
+                    settings.theme === opt.value ? "theme-btn--active" : ""
+                  }`}
+                  onClick={() => handleChange("theme", opt.value)}
+                  disabled={saving.theme}
+                >
+                  {opt.label}
+                </button>
+              ))}
+            </div>
+          </section>
+
+          {/* Font Family */}
+          <section className="settings-section">
+            <h3 className="settings-section-title">Font</h3>
+            <div className="font-grid">
+              {FONT_OPTIONS.map((opt) => (
+                <button
+                  key={opt.value}
+                  type="button"
+                  className={`font-btn ${
+                    settings.font_family === opt.value ? "font-btn--active" : ""
+                  }`}
+                  onClick={() => handleChange("font_family", opt.value)}
+                  disabled={saving.font_family}
+                >
+                  {opt.label}
+                </button>
+              ))}
+            </div>
+          </section>
+
+          {/* Font Size Slider */}
+          <section className="settings-section">
+            <h3 className="settings-section-title">
+              Font Size: {settings.font_size}px
+            </h3>
+            <input
+              type="range"
+              min="12"
+              max="32"
+              value={settings.font_size}
+              onChange={(e) =>
+                handleChange("font_size", Number(e.target.value))
+              }
+              className="settings-slider"
+              aria-label="Font size"
+            />
+          </section>
+
+          {/* Line Height Slider */}
+          <section className="settings-section">
+            <h3 className="settings-section-title">
+              Line Height: {settings.line_height.toFixed(1)}
+            </h3>
+            <input
+              type="range"
+              min="1.2"
+              max="2.0"
+              step="0.1"
+              value={settings.line_height}
+              onChange={(e) =>
+                handleChange("line_height", Number(e.target.value))
+              }
+              className="settings-slider"
+              aria-label="Line height"
+            />
+          </section>
+
+          {/* Margin Width Slider */}
+          <section className="settings-section">
+            <h3 className="settings-section-title">
+              Margins: {settings.margin_width}px
+            </h3>
+            <input
+              type="range"
+              min="8"
+              max="48"
+              value={settings.margin_width}
+              onChange={(e) =>
+                handleChange("margin_width", Number(e.target.value))
+              }
+              className="settings-slider"
+              aria-label="Margin width"
+            />
+          </section>
+
+          {/* Brightness Slider */}
+          <section className="settings-section">
+            <h3 className="settings-section-title">
+              Brightness: {settings.brightness}%
+            </h3>
+            <input
+              type="range"
+              min="0"
+              max="100"
+              value={settings.brightness}
+              onChange={(e) =>
+                handleChange("brightness", Number(e.target.value))
+              }
+              className="settings-slider"
+              aria-label="Brightness"
+            />
+          </section>
+
+          {/* Orientation Lock */}
+          <section className="settings-section">
+            <h3 className="settings-section-title">Orientation</h3>
+            <div className="orientation-grid">
+              {ORIENTATION_OPTIONS.map((opt) => (
+                <button
+                  key={opt.value}
+                  type="button"
+                  className={`orientation-btn ${
+                    settings.orientation_lock === opt.value
+                      ? "orientation-btn--active"
+                      : ""
+                  }`}
+                  onClick={() => handleChange("orientation_lock", opt.value)}
+                  disabled={saving.orientation_lock}
+                >
+                  {opt.label}
+                </button>
+              ))}
+            </div>
+          </section>
+        </div>
+      </aside>
+    </>
+  );
+}

frontend/src/components/reader/TableOfContents.tsx

@@ -0,0 +1,80 @@
+/**
+ * TableOfContents — slide-in drawer listing all chapters.
+ * Tap a chapter to navigate. Current chapter is highlighted.
+ */
+
+import type { ChapterSummary } from "../../types/reader";
+
+interface TableOfContentsProps {
+  chapters: ChapterSummary[];
+  currentChapterNumber: number;
+  isOpen: boolean;
+  onClose: () => void;
+  onNavigate: (number: number) => void;
+}
+
+export default function TableOfContents({
+  chapters,
+  currentChapterNumber,
+  isOpen,
+  onClose,
+  onNavigate,
+}: TableOfContentsProps) {
+  const handleChapterClick = (number: number) => {
+    onNavigate(number);
+    onClose();
+  };
+
+  return (
+    <>
+      {/* Overlay */}
+      {isOpen && (
+        <div
+          className="toc-overlay"
+          onClick={onClose}
+          onKeyDown={(e: React.KeyboardEvent) => {
+            if (e.key === "Escape") onClose();
+          }}
+          role="presentation"
+        />
+      )}
+
+      {/* Drawer */}
+      <aside className={`toc-drawer ${isOpen ? "toc-drawer--open" : ""}`}>
+        <div className="toc-header">
+          <h2 className="toc-title">Contents</h2>
+          <button
+            type="button"
+            className="toc-close-btn"
+            onClick={onClose}
+            aria-label="Close table of contents"
+          >
+            <svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
+              <line x1="18" y1="6" x2="6" y2="18" />
+              <line x1="6" y1="6" x2="18" y2="18" />
+            </svg>
+          </button>
+        </div>
+
+        <nav className="toc-list">
+          {chapters.length === 0 && (
+            <p className="toc-empty">No chapters available.</p>
+          )}
+          {chapters.map((chapter) => (
+            <button
+              key={chapter.number}
+              type="button"
+              className={`toc-item ${
+                chapter.number === currentChapterNumber ? "toc-item--active" : ""
+              }`}
+              onClick={() => handleChapterClick(chapter.number)}
+            >
+              <span className="toc-item-number">{chapter.number}</span>
+              <span className="toc-item-title">{chapter.title}</span>
+            </button>
+          ))}
+        </nav>
+      </aside>
+    </>
+  );
+}

frontend/src/components/search/SearchSuggestions.module.css

@@ -1,65 +0,0 @@
-.container {
-  position: absolute;
-  top: 100%;
-  left: 0;
-  right: 0;
-  z-index: 100;
-  background: #fff;
-  border: 1px solid #e5e7eb;
-  border-top: none;
-  border-radius: 0 0 10px 10px;
-  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
-  max-height: 320px;
-  overflow-y: auto;
-}
-
-.infoText {
-  padding: 12px 16px;
-  color: #9ca3af;
-  font-size: 13px;
-}
-
-.suggestionItem {
-  display: flex;
-  align-items: center;
-  gap: 12px;
-  padding: 10px 16px;
-  cursor: pointer;
-  border-bottom: 1px solid #f3f4f6;
-  min-height: 44px;
-}
-
-.suggestionItem:hover {
-  background: #f9fafb;
-}
-
-.coverImage {
-  width: 32px;
-  height: 48px;
-  object-fit: cover;
-  border-radius: 4px;
-}
-
-.coverPlaceholder {
-  font-size: 20px;
-  flex-shrink: 0;
-}
-
-.bookInfo {
-  min-width: 0;
-}
-
-.bookTitle {
-  font-size: 14px;
-  font-weight: 600;
-  color: #1f2937;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-}
-
-.bookAuthor {
-  font-size: 12px;
-  color: #6b7280;
-  margin-top: 2px;
-}

frontend/src/components/search/SearchSuggestions.tsx

@@ -1,120 +0,0 @@
-import { useEffect, useRef, useState } from "react";
-import { useNavigate } from "react-router-dom";
-import { booksApi } from "../../api/books";
-import { useDebounce } from "../../hooks/useDebounce";
-import type { BookListItem } from "../../types/book";
-import styles from "./SearchSuggestions.module.css";
-
-interface SearchSuggestionsProps {
-  query: string;
-  visible: boolean;
-  onClose: () => void;
-  onSelectSuggestion: () => void;
-}
-
-export function SearchSuggestions({ query, visible, onClose, onSelectSuggestion }: SearchSuggestionsProps) {
-  const navigate = useNavigate();
-  const [suggestions, setSuggestions] = useState<BookListItem[]>([]);
-  const [loading, setLoading] = useState(false);
-  const containerRef = useRef<HTMLDivElement>(null);
-  const debouncedQuery = useDebounce(query, 200);
-
-  useEffect(() => {
-    if (!debouncedQuery.trim()) {
-      setSuggestions([]);
-      return;
-    }
-    let cancelled = false;
-    setLoading(true);
-    void booksApi.searchBooks({ q: debouncedQuery.trim(), page_size: 5 }).then(
-      (res) => {
-        if (!cancelled) {
-          setSuggestions(res.results);
-          setLoading(false);
-        }
-      },
-      () => {
-        if (!cancelled) {
-          setSuggestions([]);
-          setLoading(false);
-        }
-      },
-    );
-    return () => {
-      cancelled = true;
-    };
-  }, [debouncedQuery]);
-
-  // Close on click outside
-  useEffect(() => {
-    if (!visible) return;
-    const handler = (e: MouseEvent) => {
-      if (containerRef.current && !containerRef.current.contains(e.target as Node)) {
-        onClose();
-      }
-    };
-    // Delay attachment to avoid the click that opened us from immediately closing
-    const timer = setTimeout(() => document.addEventListener("click", handler), 0);
-    return () => {
-      clearTimeout(timer);
-      document.removeEventListener("click", handler);
-    };
-  }, [visible, onClose]);
-
-  // Close on Escape
-  useEffect(() => {
-    if (!visible) return;
-    const handler = (e: KeyboardEvent) => {
-      if (e.key === "Escape") onClose();
-    };
-    document.addEventListener("keydown", handler);
-    return () => document.removeEventListener("keydown", handler);
-  }, [visible, onClose]);
-
-  if (!visible || !query.trim()) return null;
-
-  return (
-    <div ref={containerRef} className={styles.container}>
-      {loading && (
-        <div className={styles.infoText}>
-          Searching...
-        </div>
-      )}
-      {!loading && suggestions.length === 0 && debouncedQuery.trim() && (
-        <div className={styles.infoText}>
-          No quick suggestions
-        </div>
-      )}
-      {suggestions.map((book) => (
-        <div
-          key={book.id}
-          className={styles.suggestionItem}
-          onClick={() => {
-            onSelectSuggestion();
-            navigate(`/books/${book.id}`);
-          }}
-        >
-          <span className={styles.coverPlaceholder}>
-            {book.cover_image ? (
-              <img
-                src={book.cover_image}
-                alt=""
-                className={styles.coverImage}
-              />
-            ) : (
-              "📖"
-            )}
-          </span>
-          <div className={styles.bookInfo}>
-            <div className={styles.bookTitle}>
-              {book.title}
-            </div>
-            <div className={styles.bookAuthor}>
-              {book.author || "Unknown Author"}
-            </div>
-          </div>
-        </div>
-      ))}
-    </div>
-  );
-}

frontend/src/context/AuthContext.tsx

@@ -1,63 +0,0 @@
-import React, { createContext, useCallback, useContext, useEffect, useState } from "react";
-import api from "../api/client";
-
-interface AuthContextValue {
-  isAuthenticated: boolean;
-  loading: boolean;
-  user: { email: string } | null;
-  login: (email: string, password: string) => Promise<void>;
-  register: (email: string, password: string) => Promise<void>;
-  logout: () => void;
-}
-
-const AuthContext = createContext<AuthContextValue | null>(null);
-
-export function AuthProvider({ children }: { children: React.ReactNode }) {
-  const [user, setUser] = useState<{ email: string } | null>(null);
-  const [loading, setLoading] = useState(true);
-
-  useEffect(() => {
-    const token = localStorage.getItem("access_token");
-    if (token) {
-      try {
-        const payload = JSON.parse(atob(token.split(".")[1] ?? ""));
-        setUser({ email: payload.email ?? payload.sub ?? "user" });
-      } catch {
-        localStorage.removeItem("access_token");
-        localStorage.removeItem("refresh_token");
-      }
-    }
-    setLoading(false);
-  }, []);
-
-  const login = useCallback(async (email: string, password: string) => {
-    const { data } = await api.post<{ access: string; refresh: string }>("/auth/token/", { email, password });
-    localStorage.setItem("access_token", data.access);
-    localStorage.setItem("refresh_token", data.refresh);
-    const payload = JSON.parse(atob(data.access.split(".")[1] ?? ""));
-    setUser({ email: payload.email ?? payload.sub ?? "user" });
-  }, []);
-
-  const register = useCallback(async (email: string, password: string) => {
-    await api.post("/auth/register/", { email, password });
-    await login(email, password);
-  }, [login]);
-
-  const logout = useCallback(() => {
-    localStorage.removeItem("access_token");
-    localStorage.removeItem("refresh_token");
-    setUser(null);
-  }, []);
-
-  return (
-    <AuthContext.Provider value={{ isAuthenticated: !!user, loading, user, login, register, logout }}>
-      {children}
-    </AuthContext.Provider>
-  );
-}
-
-export function useAuth(): AuthContextValue {
-  const ctx = useContext(AuthContext);
-  if (!ctx) throw new Error("useAuth must be used within an AuthProvider");
-  return ctx;
-}

frontend/src/hooks/index.ts

@@ -1,4 +1 @@
-export { usePaginatedQuery } from "./usePaginatedQuery";
+export { usePaginatedQuery } from "./usePaginatedQuery";
-export { useDebounce } from "./useDebounce";
-export { useVoiceSearch } from "./useVoiceSearch";
-export { useMediaQuery } from "./useMediaQuery";

frontend/src/hooks/useChapters.ts

@@ -0,0 +1,129 @@
+/**
+ * useChapters — fetch chapter list and manage current chapter navigation.
+ */
+
+import { useCallback, useEffect, useState } from "react";
+import { getChapterContent, getChapters } from "../api/reader";
+import type { ChapterDetail, ChapterSummary } from "../types/reader";
+
+export interface UseChaptersReturn {
+  chapters: ChapterSummary[];
+  currentChapter: ChapterDetail | null;
+  currentChapterNumber: number;
+  isLoading: boolean;
+  error: string | null;
+  navigateToChapter: (number: number) => Promise<void>;
+  goToNextChapter: () => Promise<void>;
+  goToPreviousChapter: () => Promise<void>;
+  hasNext: boolean;
+  hasPrevious: boolean;
+}
+
+export function useChapters(
+  bookId: number,
+  initialChapter: number = 1
+): UseChaptersReturn {
+  const [chapters, setChapters] = useState<ChapterSummary[]>([]);
+  const [currentChapter, setCurrentChapter] = useState<ChapterDetail | null>(
+    null
+  );
+  const [currentChapterNumber, setCurrentChapterNumber] =
+    useState<number>(initialChapter);
+  const [isLoading, setIsLoading] = useState(true);
+  const [error, setError] = useState<string | null>(null);
+
+  // Fetch chapter list on mount
+  useEffect(() => {
+    let cancelled = false;
+    setIsLoading(true);
+    getChapters(bookId)
+      .then((data) => {
+        if (!cancelled) {
+          setChapters(data);
+          // If chapters exist and initial chapter is valid, fetch it
+          if (
+            data.length > 0 &&
+            data.some((c) => c.number === currentChapterNumber)
+          ) {
+            return getChapterContent(bookId, currentChapterNumber);
+          }
+          return null;
+        }
+        return null;
+      })
+      .then((chapter) => {
+        if (!cancelled && chapter) {
+          setCurrentChapter(chapter);
+        }
+      })
+      .catch((err: unknown) => {
+        if (!cancelled) {
+          setError(
+            err instanceof Error ? err.message : "Failed to load chapters"
+          );
+        }
+      })
+      .finally(() => {
+        if (!cancelled) setIsLoading(false);
+      });
+    return () => {
+      cancelled = true;
+    };
+  }, [bookId, currentChapterNumber]);
+
+  const fetchChapter = useCallback(
+    async (number: number) => {
+      setIsLoading(true);
+      setError(null);
+      try {
+        const chapter = await getChapterContent(bookId, number);
+        setCurrentChapter(chapter);
+        setCurrentChapterNumber(number);
+      } catch (err: unknown) {
+        setError(
+          err instanceof Error ? err.message : "Failed to load chapter"
+        );
+      } finally {
+        setIsLoading(false);
+      }
+    },
+    [bookId]
+  );
+
+  const navigateToChapter = useCallback(
+    (number: number) => {
+      fetchChapter(number);
+    },
+    [fetchChapter]
+  );
+
+  const goToNextChapter = useCallback(() => {
+    const next = currentChapterNumber + 1;
+    if (chapters.some((c) => c.number === next)) {
+      fetchChapter(next);
+    }
+  }, [currentChapterNumber, chapters, fetchChapter]);
+
+  const goToPreviousChapter = useCallback(() => {
+    const prev = currentChapterNumber - 1;
+    if (prev >= 1 && chapters.some((c) => c.number === prev)) {
+      fetchChapter(prev);
+    }
+  }, [currentChapterNumber, chapters, fetchChapter]);
+
+  const hasNext = chapters.some((c) => c.number === currentChapterNumber + 1);
+  const hasPrevious = chapters.some((c) => c.number === currentChapterNumber - 1);
+
+  return {
+    chapters,
+    currentChapter,
+    currentChapterNumber,
+    isLoading,
+    error,
+    navigateToChapter,
+    goToNextChapter,
+    goToPreviousChapter,
+    hasNext,
+    hasPrevious,
+  };
+}

frontend/src/hooks/useDebounce.ts

@@ -1,18 +0,0 @@
-import { useEffect, useState } from "react";
-
-/**
- * A hook that debounces a value by the specified delay.
- * @param value - The value to debounce
- * @param delay - The delay in milliseconds
- * @returns The debounced value
- */
-export function useDebounce<T>(value: T, delay: number): T {
-  const [debounced, setDebounced] = useState(value);
-
-  useEffect(() => {
-    const timer = setTimeout(() => setDebounced(value), delay);
-    return () => clearTimeout(timer);
-  }, [value, delay]);
-
-  return debounced;
-}

frontend/src/hooks/useMediaQuery.ts

@@ -1,26 +0,0 @@
-import { useEffect, useState } from "react";
-
-/**
- * Hook for responsive design — returns true when the media query matches.
- * Defaults to false on SSR / initial render to avoid hydration mismatch.
- */
-export function useMediaQuery(query: string): boolean {
-  const [matches, setMatches] = useState(false);
-
-  useEffect(() => {
-    const mql = window.matchMedia(query);
-    setMatches(mql.matches);
-
-    const handler = (e: MediaQueryListEvent) => setMatches(e.matches);
-    mql.addEventListener("change", handler);
-    return () => mql.removeEventListener("change", handler);
-  }, [query]);
-
-  return matches;
-}
-
-export const BREAKPOINTS = {
-  sm: "(max-width: 480px)",
-  md: "(max-width: 768px)",
-  lg: "(min-width: 1024px)",
-} as const;

frontend/src/hooks/useReadingProgress.ts

@@ -0,0 +1,99 @@
+/**
+ * useReadingProgress — fetch and update reading progress for a book.
+ * Auto-saves when chapter or position changes.
+ */
+
+import { useCallback, useEffect, useRef, useState } from "react";
+import { getReadingProgress, updateReadingProgress } from "../api/reader";
+import type { ReadingProgress } from "../types/reader";
+
+export interface UseReadingProgressReturn {
+  progress: ReadingProgress | null;
+  isLoading: boolean;
+  error: string | null;
+  saveProgress: (
+    chapter: number,
+    position: number,
+    percentage: number
+  ) => Promise<void>;
+  /** Schedule a debounced save — fires at most once per 3 seconds */
+  debouncedSave: (
+    chapter: number,
+    position: number,
+    percentage: number
+  ) => void;
+}
+
+export function useReadingProgress(
+  bookId: number
+): UseReadingProgressReturn {
+  const [progress, setProgress] = useState<ReadingProgress | null>(null);
+  const [isLoading, setIsLoading] = useState(true);
+  const [error, setError] = useState<string | null>(null);
+  const debounceTimer = useRef<ReturnType<typeof setTimeout> | null>(null);
+
+  // Fetch progress on mount
+  useEffect(() => {
+    let cancelled = false;
+    setIsLoading(true);
+    getReadingProgress(bookId)
+      .then((data) => {
+        if (!cancelled) setProgress(data);
+      })
+      .catch((err: unknown) => {
+        if (!cancelled) {
+          setError(
+            err instanceof Error ? err.message : "Failed to load progress"
+          );
+        }
+      })
+      .finally(() => {
+        if (!cancelled) setIsLoading(false);
+      });
+    return () => {
+      cancelled = true;
+    };
+  }, [bookId]);
+
+  const saveProgress = useCallback(
+    async (chapter: number, position: number, percentage: number) => {
+      try {
+        const updated = await updateReadingProgress(bookId, {
+          current_chapter: chapter,
+          current_position: position,
+          percentage,
+        });
+        setProgress(updated);
+        setError(null);
+      } catch (err: unknown) {
+        setError(
+          err instanceof Error ? err.message : "Failed to save progress"
+        );
+      }
+    },
+    [bookId]
+  );
+
+  const debouncedSave = useCallback(
+    (chapter: number, position: number, percentage: number) => {
+      if (debounceTimer.current) {
+        clearTimeout(debounceTimer.current);
+      }
+      debounceTimer.current = setTimeout(() => {
+        saveProgress(chapter, position, percentage);
+      }, 3000);
+    },
+    [saveProgress]
+  );
+
+  // Cleanup timer on unmount
+  useEffect(() => {
+    return () => {
+      if (debounceTimer.current) {
+        clearTimeout(debounceTimer.current);
+      }
+    };
+  }, []);
+
+  return { progress, isLoading, error, saveProgress, debouncedSave };
+}

frontend/src/hooks/useReadingSettings.ts

@@ -0,0 +1,96 @@
+/**
+ * useReadingSettings — fetch and manage user reading preferences.
+ * Applies settings as CSS custom properties on the document root.
+ */
+
+import { useCallback, useEffect, useState } from "react";
+import {
+  getReadingSettings,
+  updateReadingSettings,
+} from "../api/reader";
+import type { ReadingSettings } from "../types/reader";
+
+const DEFAULT_SETTINGS: ReadingSettings = {
+  font_family: "serif",
+  font_size: 18,
+  line_height: 1.6,
+  margin_width: 16,
+  background_color: "#f5f0eb",
+  text_color: "#1a1a1a",
+  brightness: 100,
+  orientation_lock: "auto",
+  theme: "sepia",
+  created_at: "",
+  updated_at: "",
+};
+
+function applyCssVariables(settings: ReadingSettings): void {
+  const root = document.documentElement;
+  root.style.setProperty("--reader-bg", settings.background_color);
+  root.style.setProperty("--reader-text", settings.text_color);
+  root.style.setProperty("--reader-font-family", settings.font_family);
+  root.style.setProperty("--reader-font-size", `${settings.font_size}px`);
+  root.style.setProperty("--reader-line-height", String(settings.line_height));
+  root.style.setProperty("--reader-margin", `${settings.margin_width}px`);
+  root.style.setProperty("--reader-brightness", `${settings.brightness}%`);
+}
+
+export interface UseReadingSettingsReturn {
+  settings: ReadingSettings;
+  isLoading: boolean;
+  error: string | null;
+  updateSettings: (partial: Partial<ReadingSettings>) => Promise<void>;
+}
+
+export function useReadingSettings(): UseReadingSettingsReturn {
+  const [settings, setSettings] = useState<ReadingSettings>(DEFAULT_SETTINGS);
+  const [isLoading, setIsLoading] = useState(true);
+  const [error, setError] = useState<string | null>(null);
+
+  // Fetch settings on mount
+  useEffect(() => {
+    let cancelled = false;
+    setIsLoading(true);
+    getReadingSettings()
+      .then((data) => {
+        if (!cancelled) {
+          setSettings(data);
+          applyCssVariables(data);
+        }
+      })
+      .catch((err: unknown) => {
+        if (!cancelled) {
+          setError(
+            err instanceof Error ? err.message : "Failed to load reading settings"
+          );
+          // Apply defaults
+          applyCssVariables(DEFAULT_SETTINGS);
+        }
+      })
+      .finally(() => {
+        if (!cancelled) setIsLoading(false);
+      });
+    return () => {
+      cancelled = true;
+    };
+  }, []);
+
+  const updateSettings = useCallback(
+    async (partial: Partial<ReadingSettings>) => {
+      try {
+        const updated = await updateReadingSettings(partial);
+        setSettings(updated);
+        applyCssVariables(updated);
+        setError(null);
+      } catch (err: unknown) {
+        setError(
+          err instanceof Error ? err.message : "Failed to update reading settings"
+        );
+        throw err;
+      }
+    },
+    []
+  );
+
+  return { settings, isLoading, error, updateSettings };
+}

frontend/src/hooks/useVoiceSearch.ts

@@ -1,105 +0,0 @@
-import { useCallback, useEffect, useRef, useState } from "react";
-
-export interface UseVoiceSearchResult {
-  isListening: boolean;
-  transcript: string;
-  isSupported: boolean;
-  hasError: boolean;
-  errorMessage: string | null;
-  startListening: () => void;
-  stopListening: () => void;
-}
-
-/**
- * Hook for voice search using the Web Speech API.
- * Returns a microphone control interface.
- * Gracefully degrades when SpeechRecognition is unavailable.
- */
-export function useVoiceSearch(): UseVoiceSearchResult {
-  const [isListening, setIsListening] = useState(false);
-  const [transcript, setTranscript] = useState("");
-  const [isSupported, setIsSupported] = useState(false);
-  const [hasError, setHasError] = useState(false);
-  const [errorMessage, setErrorMessage] = useState<string | null>(null);
-
-  const recognitionRef = useRef<SpeechRecognition | null>(null);
-  const mountedRef = useRef(true);
-
-  useEffect(() => {
-    mountedRef.current = true;
-    // Check for SpeechRecognition support (standard + webkit prefix)
-    const SpeechRecognitionCtor =
-      (window as unknown as Record<string, unknown>).SpeechRecognition ??
-      (window as unknown as Record<string, unknown>).webkitSpeechRecognition;
-
-    if (typeof SpeechRecognitionCtor === "function") {
-      setIsSupported(true);
-      const recognition = new (SpeechRecognitionCtor as new () => SpeechRecognition)();
-      recognition.continuous = false;
-      recognition.interimResults = false;
-      recognition.lang = "en-US";
-
-      recognition.onresult = (event: SpeechRecognitionEvent) => {
-        const resultText = event.results[0]?.[0]?.transcript ?? "";
-        if (mountedRef.current) {
-          setTranscript(resultText);
-          setHasError(false);
-          setErrorMessage(null);
-        }
-      };
-
-      recognition.onerror = (event: SpeechRecognitionErrorEvent) => {
-        if (mountedRef.current) {
-          setHasError(true);
-          setErrorMessage(event.error);
-          setIsListening(false);
-        }
-      };
-
-      recognition.onend = () => {
-        if (mountedRef.current) {
-          setIsListening(false);
-        }
-      };
-
-      recognitionRef.current = recognition;
-    }
-
-    return () => {
-      mountedRef.current = false;
-      if (recognitionRef.current) {
-        recognitionRef.current.abort();
-      }
-    };
-  }, []);
-
-  const startListening = useCallback(() => {
-    if (!recognitionRef.current) return;
-    setTranscript("");
-    setHasError(false);
-    setErrorMessage(null);
-    try {
-      recognitionRef.current.start();
-      setIsListening(true);
-    } catch {
-      // May throw if already started
-      setIsListening(false);
-    }
-  }, []);
-
-  const stopListening = useCallback(() => {
-    if (!recognitionRef.current) return;
-    recognitionRef.current.stop();
-    setIsListening(false);
-  }, []);
-
-  return {
-    isListening,
-    transcript,
-    isSupported,
-    hasError,
-    errorMessage,
-    startListening,
-    stopListening,
-  };
-}

frontend/src/pages/AddBook.tsx

@@ -1,57 +0,0 @@
-import React, { useState } from "react";
-import { useNavigate } from "react-router-dom";
-import { booksApi } from "../api/books";
-
-export function AddBookPage() {
-  const navigate = useNavigate();
-  const [title, setTitle] = useState("");
-  const [author, setAuthor] = useState("");
-  const [file, setFile] = useState<File | null>(null);
-  const [uploading, setUploading] = useState(false);
-  const [error, setError] = useState<string | null>(null);
-
-  const handleFileChange = (e: React.ChangeEvent<HTMLInputElement>) => {
-    const selected = e.target.files?.[0] ?? null;
-    if (selected) {
-      const ext = selected.name.split(".").pop()?.toLowerCase();
-      if (ext !== "epub" && ext !== "pdf") { setError("Only EPUB and PDF files are supported."); setFile(null); return; }
-      setFile(selected); setError(null);
-      if (!title) setTitle(selected.name.replace(/\.(epub|pdf)$/i, ""));
-    }
-  };
-
-  const handleSubmit = async (e: React.FormEvent) => {
-    e.preventDefault();
-    if (!file || !title.trim()) { setError("Title and file are required."); return; }
-    setUploading(true); setError(null);
-    try { await booksApi.uploadEBook(file, title.trim(), author.trim()); navigate("/"); }
-    catch (err) { setError(err instanceof Error ? err.message : "Upload failed."); }
-    finally { setUploading(false); }
-  };
-
-  return (
-    <div style={{ maxWidth: 500, margin: "0 auto", padding: 16, minHeight: "100vh", background: "#f8f9fa" }}>
-      <header style={{ display: "flex", alignItems: "center", gap: 12, marginBottom: 24, padding: "16px 0", borderBottom: "1px solid #eee" }}>
-        <button onClick={() => navigate("/")} style={{ padding: "8px 16px", borderRadius: 6, border: "1px solid #ddd", background: "#fff", cursor: "pointer", fontSize: 14 }}>← Back</button>
-        <h1 style={{ fontSize: 24, fontWeight: 700, color: "#1a1a2e", margin: 0 }}>Add Book</h1>
-      </header>
-      <form onSubmit={handleSubmit} style={{ display: "flex", flexDirection: "column", gap: 20 }}>
-        {error && <div style={{ background: "#fde8e8", padding: 12, borderRadius: 6, color: "#e74c3c", fontSize: 14 }}>{error}</div>}
-        <div style={{ display: "flex", flexDirection: "column", gap: 6 }}>
-          <label style={{ fontSize: 14, fontWeight: 600, color: "#555" }}>File (EPUB or PDF) *</label>
-          <input type="file" accept=".epub,.pdf" onChange={handleFileChange} style={{ padding: "10px 0" }} />
-          {file && <p style={{ fontSize: 13, color: "#666", marginTop: 4 }}>Selected: {file.name}</p>}
-        </div>
-        <div style={{ display: "flex", flexDirection: "column", gap: 6 }}>
-          <label style={{ fontSize: 14, fontWeight: 600, color: "#555" }}>Title *</label>
-          <input type="text" value={title} onChange={(e) => setTitle(e.target.value)} placeholder="Book title" style={{ padding: "10px 12px", borderRadius: 6, border: "1px solid #ddd", fontSize: 16, outline: "none" }} />
-        </div>
-        <div style={{ display: "flex", flexDirection: "column", gap: 6 }}>
-          <label style={{ fontSize: 14, fontWeight: 600, color: "#555" }}>Author</label>
-          <input type="text" value={author} onChange={(e) => setAuthor(e.target.value)} placeholder="Author name" style={{ padding: "10px 12px", borderRadius: 6, border: "1px solid #ddd", fontSize: 16, outline: "none" }} />
-        </div>
-        <button type="submit" disabled={uploading} style={{ padding: "12px 24px", borderRadius: 8, border: "none", background: "#1a1a2e", color: "#fff", fontSize: 16, fontWeight: 600, cursor: "pointer", opacity: uploading ? 0.6 : 1, marginTop: 8 }}>{uploading ? "Uploading..." : "Upload Book"}</button>
-      </form>
-    </div>
-  );
-}

frontend/src/pages/AuthPage.tsx

@@ -1,57 +0,0 @@
-import React, { useState } from "react";
-import { useNavigate } from "react-router-dom";
-import { useAuth } from "../context/AuthContext";
-
-function AuthForm({ isLogin, onToggle }: { isLogin: boolean; onToggle: () => void }) {
-  const [email, setEmail] = useState("");
-  const [password, setPassword] = useState("");
-  const [confirmPassword, setConfirmPassword] = useState("");
-  const [error, setError] = useState<string | null>(null);
-  const [loading, setLoading] = useState(false);
-  const { login, register } = useAuth();
-  const navigate = useNavigate();
-
-  const handleSubmit = async (e: React.FormEvent) => {
-    e.preventDefault(); setError(null);
-    if (!isLogin && password !== confirmPassword) { setError("Passwords do not match."); return; }
-    setLoading(true);
-    try {
-      if (isLogin) await login(email, password);
-      else await register(email, password);
-      navigate("/");
-    } catch (err) { setError(err instanceof Error ? err.message : isLogin ? "Login failed" : "Registration failed"); }
-    finally { setLoading(false); }
-  };
-
-  return (
-    <div style={{ display: "flex", justifyContent: "center", alignItems: "center", minHeight: "100vh", background: "#f8f9fa", padding: 16 }}>
-      <div style={{ width: "100%", maxWidth: 400, background: "#fff", borderRadius: 12, padding: 32, boxShadow: "0 2px 16px rgba(0,0,0,0.08)" }}>
-        <h1 style={{ fontSize: 28, fontWeight: 700, color: "#1a1a2e", textAlign: "center", marginBottom: 4 }}>Cloud Reader</h1>
-        <h2 style={{ fontSize: 16, color: "#888", textAlign: "center", marginBottom: 24, fontWeight: 400 }}>{isLogin ? "Sign In" : "Create Account"}</h2>
-        <form onSubmit={handleSubmit} style={{ display: "flex", flexDirection: "column", gap: 16 }}>
-          {error && <div style={{ background: "#fde8e8", padding: 12, borderRadius: 6, color: "#e74c3c", fontSize: 14 }}>{error}</div>}
-          <div style={{ display: "flex", flexDirection: "column", gap: 6 }}>
-            <label style={{ fontSize: 14, fontWeight: 600, color: "#555" }}>Email</label>
-            <input type="email" value={email} onChange={(e) => setEmail(e.target.value)} placeholder="you@example.com" required style={{ padding: "10px 12px", borderRadius: 6, border: "1px solid #ddd", fontSize: 16, outline: "none" }} />
-          </div>
-          <div style={{ display: "flex", flexDirection: "column", gap: 6 }}>
-            <label style={{ fontSize: 14, fontWeight: 600, color: "#555" }}>Password</label>
-            <input type="password" value={password} onChange={(e) => setPassword(e.target.value)} placeholder="At least 8 characters" required minLength={8} style={{ padding: "10px 12px", borderRadius: 6, border: "1px solid #ddd", fontSize: 16, outline: "none" }} />
-          </div>
-          {!isLogin && <div style={{ display: "flex", flexDirection: "column", gap: 6 }}>
-            <label style={{ fontSize: 14, fontWeight: 600, color: "#555" }}>Confirm Password</label>
-            <input type="password" value={confirmPassword} onChange={(e) => setConfirmPassword(e.target.value)} placeholder="Repeat your password" required minLength={8} style={{ padding: "10px 12px", borderRadius: 6, border: "1px solid #ddd", fontSize: 16, outline: "none" }} />
-          </div>}
-          <button type="submit" disabled={loading} style={{ padding: "12px 24px", borderRadius: 8, border: "none", background: "#1a1a2e", color: "#fff", fontSize: 16, fontWeight: 600, cursor: "pointer", opacity: loading ? 0.6 : 1, marginTop: 8 }}>{loading ? (isLogin ? "Signing in..." : "Creating account...") : (isLogin ? "Sign In" : "Create Account")}</button>
-        </form>
-        <p style={{ textAlign: "center", marginTop: 20, color: "#888", fontSize: 14 }}>
-          {isLogin ? "Don't have an account? " : "Already have an account? "}
-          <button onClick={onToggle} style={{ background: "none", border: "none", color: "#1a1a2e", fontWeight: 600, cursor: "pointer", fontSize: 14, textDecoration: "underline" }}>{isLogin ? "Register" : "Sign In"}</button>
-        </p>
-      </div>
-    </div>
-  );
-}
-
-export function LoginPage({ onToggle }: { onToggle: () => void }) { return <AuthForm isLogin={true} onToggle={onToggle} />; }
-export function RegisterPage({ onToggle }: { onToggle: () => void }) { return <AuthForm isLogin={false} onToggle={onToggle} />; }

frontend/src/pages/BookDetailPage.tsx

@@ -1,208 +0,0 @@
-import React, { useCallback, useEffect, useState } from "react";
-import { useNavigate, useParams } from "react-router-dom";
-import { booksApi } from "../api/books";
-import type { BookDetail } from "../types/book";
-import { useMediaQuery, BREAKPOINTS } from "../hooks/useMediaQuery";
-
-export function BookDetailPage() {
-  const { id } = useParams<{ id: string }>();
-  const navigate = useNavigate();
-  const [book, setBook] = useState<BookDetail | null>(null);
-  const [loading, setLoading] = useState(true);
-  const [error, setError] = useState<string | null>(null);
-  const isMobile = useMediaQuery(BREAKPOINTS.md);
-
-  const loadBook = useCallback(async () => {
-    if (!id) return;
-    setLoading(true);
-    setError(null);
-    try {
-      const bookId = Number(id);
-      if (Number.isNaN(bookId)) {
-        setError("Invalid book ID");
-        return;
-      }
-      const data = await booksApi.getBook(bookId);
-      setBook(data);
-    } catch (err) {
-      setError(err instanceof Error ? err.message : "Failed to load book details");
-    } finally {
-      setLoading(false);
-    }
-  }, [id]);
-
-  useEffect(() => {
-    void loadBook();
-  }, [loadBook]);
-
-  const statusColors: Record<string, { bg: string; text: string }> = {
-    want_to_read: { bg: "#dbeafe", text: "#1d4ed8" },
-    reading: { bg: "#dcfce7", text: "#16a34a" },
-    finished: { bg: "#f3e8ff", text: "#9333ea" },
-    dnf: { bg: "#fef3c7", text: "#b45309" },
-  };
-
-  const containerStyle: React.CSSProperties = {
-    maxWidth: 720,
-    margin: "0 auto",
-    padding: isMobile ? 16 : 24,
-    minHeight: "100vh",
-    background: "#f8f9fa",
-  };
-
-  const backButtonStyle: React.CSSProperties = {
-    display: "inline-flex",
-    alignItems: "center",
-    gap: 4,
-    padding: isMobile ? "10px 16px" : "8px 16px",
-    borderRadius: 8,
-    border: "1px solid #e5e7eb",
-    background: "#fff",
-    color: "#374151",
-    fontSize: isMobile ? 15 : 14,
-    cursor: "pointer",
-    marginBottom: isMobile ? 16 : 24,
-    minHeight: 44,
-  };
-
-  if (loading) {
-    return (
-      <div style={containerStyle}>
-        <div style={{ height: 32, width: 80, background: "#e5e7eb", borderRadius: 6, marginBottom: 24 }} />
-        <div style={{ display: "flex", gap: isMobile ? 16 : 24, flexDirection: isMobile ? "column" : "row" }}>
-          <div style={{
-            width: isMobile ? 140 : 240,
-            height: isMobile ? 210 : 360,
-            background: "#e5e7eb",
-            borderRadius: 12,
-            flexShrink: 0,
-            alignSelf: isMobile ? "center" : "flex-start",
-          }} />
-          <div style={{ flex: 1 }}>
-            <div style={{ height: 28, background: "#e5e7eb", borderRadius: 6, marginBottom: 12, width: "60%" }} />
-            <div style={{ height: 18, background: "#e5e7eb", borderRadius: 4, marginBottom: 8, width: "40%" }} />
-            <div style={{ height: 18, background: "#e5e7eb", borderRadius: 4, marginBottom: 8, width: "30%" }} />
-            <div style={{ height: 14, background: "#e5e7eb", borderRadius: 4, marginBottom: 4, width: "90%" }} />
-            <div style={{ height: 14, background: "#e5e7eb", borderRadius: 4, marginBottom: 4, width: "80%" }} />
-            <div style={{ height: 14, background: "#e5e7eb", borderRadius: 4, width: "70%" }} />
-          </div>
-        </div>
-      </div>
-    );
-  }
-
-  if (error || !book) {
-    return (
-      <div style={containerStyle}>
-        <button onClick={() => navigate("/")} style={backButtonStyle}>← Back to Library</button>
-        <div style={{ textAlign: "center", padding: isMobile ? "60px 16px" : "80px 20px" }}>
-          <div style={{ fontSize: isMobile ? 48 : 64, marginBottom: 16 }}>😕</div>
-          <h2 style={{ fontSize: isMobile ? 18 : 20, color: "#1f2937", marginBottom: 8 }}>Book not found</h2>
-          <p style={{ color: "#6b7280", marginBottom: 20 }}>{error || "The book you're looking for doesn't exist or has been removed."}</p>
-          <button onClick={() => void loadBook()} className="btn" style={{ padding: "12px 24px", fontSize: 15, minHeight: 44 }}>Retry</button>
-        </div>
-      </div>
-    );
-  }
-
-  const sc = statusColors[book.reading_status] ?? { bg: "#f3f4f6", text: "#6b7280" };
-
-  return (
-    <div style={containerStyle}>
-      {/* Back button */}
-      <button onClick={() => navigate("/")} style={backButtonStyle}>
-        ← {isMobile ? "Back" : "Back to Library"}
-      </button>
-
-      {/* Book Detail */}
-      <div style={{ display: "flex", gap: isMobile ? 20 : 32, flexDirection: isMobile ? "column" : "row" }}>
-        {/* Cover */}
-        <div style={{ flexShrink: 0, alignSelf: isMobile ? "center" : "flex-start" }}>
-          <div style={{
-            width: isMobile ? 160 : 240,
-            height: isMobile ? 240 : 360,
-            borderRadius: 12,
-            overflow: "hidden",
-            background: "#f0f0f0",
-            display: "flex",
-            alignItems: "center",
-            justifyContent: "center",
-            boxShadow: "0 4px 20px rgba(0,0,0,0.1)",
-          }}>
-            {book.cover_image
-              ? <img src={book.cover_image} alt={book.title} style={{ width: "100%", height: "100%", objectFit: "cover" }} />
-              : <span style={{ fontSize: isMobile ? 48 : 80 }}>📖</span>}
-          </div>
-        </div>
-
-        {/* Info */}
-        <div style={{ flex: 1, minWidth: 0 }}>
-          <h1 style={{ fontSize: isMobile ? 22 : 28, fontWeight: 700, color: "#1f2937", marginBottom: 8, lineHeight: 1.2 }}>
-            {book.title}
-          </h1>
-
-          {book.author && (
-            <p style={{ fontSize: isMobile ? 16 : 18, color: "#4b5563", marginBottom: 6 }}>
-              by {book.author}
-            </p>
-          )}
-
-          <div style={{ display: "flex", gap: 8, flexWrap: "wrap", marginBottom: 16, marginTop: 12 }}>
-            <span style={{ background: sc.bg, color: sc.text, fontSize: 13, fontWeight: 600, padding: "4px 12px", borderRadius: 999, minHeight: 28, display: "inline-flex", alignItems: "center" }}>
-              {book.reading_status_display}
-            </span>
-            {book.genre && (
-              <span style={{ background: "#eef2ff", color: "#4f46e5", fontSize: 13, padding: "4px 12px", borderRadius: 999, minHeight: 28, display: "inline-flex", alignItems: "center" }}>
-                {book.genre}
-              </span>
-            )}
-            {book.total_pages > 0 && (
-              <span style={{ background: "#f3f4f6", color: "#6b7280", fontSize: 13, padding: "4px 12px", borderRadius: 999, minHeight: 28, display: "inline-flex", alignItems: "center" }}>
-                {book.total_pages} pages
-              </span>
-            )}
-          </div>
-
-          {book.description && (
-            <div style={{ marginTop: 20 }}>
-              <h3 style={{ fontSize: 16, fontWeight: 600, color: "#1f2937", marginBottom: 8 }}>Description</h3>
-              <p style={{ fontSize: isMobile ? 15 : 15, color: "#4b5563", lineHeight: 1.7, whiteSpace: "pre-wrap" }}>
-                {book.description}
-              </p>
-            </div>
-          )}
-
-          <div style={{ marginTop: 24, paddingTop: 16, borderTop: "1px solid #e5e7eb" }}>
-            <p style={{ fontSize: 13, color: "#9ca3af" }}>
-              Added {new Date(book.created_at).toLocaleDateString(undefined, { year: "numeric", month: "long", day: "numeric" })}
-              {book.created_at !== book.updated_at && ` · Updated ${new Date(book.updated_at).toLocaleDateString(undefined, { year: "numeric", month: "long", day: "numeric" })}`}
-            </p>
-          </div>
-
-          {/* Mobile full-width back button */}
-          {isMobile && (
-            <div style={{ marginTop: 24 }}>
-              <button
-                onClick={() => navigate("/")}
-                style={{
-                  width: "100%",
-                  padding: "14px 24px",
-                  borderRadius: 10,
-                  border: "none",
-                  background: "#4f46e5",
-                  color: "#fff",
-                  fontSize: 15,
-                  fontWeight: 600,
-                  cursor: "pointer",
-                  minHeight: 44,
-                }}
-              >
-                ← Back to Library
-              </button>
-            </div>
-          )}
-        </div>
-      </div>
-    </div>
-  );
-}

frontend/src/pages/Library.module.css

@@ -1,13 +0,0 @@
-.bookCard {
-  background: #fff;
-  border-radius: 12px;
-  overflow: hidden;
-  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
-  cursor: pointer;
-  transition: transform 0.15s, box-shadow 0.15s;
-}
-
-.bookCard:hover {
-  transform: translateY(-2px);
-  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
-}

frontend/src/pages/Library.tsx

@@ -1,545 +0,0 @@
-import React, { useCallback, useEffect, useRef, useState } from "react";
-import { useNavigate } from "react-router-dom";
-import { booksApi } from "../api/books";
-import type { BookListItem, BookSearchParams } from "../types/book";
-import { READING_STATUS_OPTIONS } from "../types/book";
-import { useAuth } from "../context/AuthContext";
-import { useDebounce } from "../hooks/useDebounce";
-import { useVoiceSearch } from "../hooks/useVoiceSearch";
-import { useMediaQuery, BREAKPOINTS } from "../hooks/useMediaQuery";
-import { SearchSuggestions } from "../components/search/SearchSuggestions";
-import styles from "./Library.module.css";
-
-interface FilterState {
-  genre: string;
-  author: string;
-  reading_status: string;
-}
-
-/** WCAG 2.1 minimum touch target */
-const TOUCH_TARGET: React.CSSProperties = {
-  minHeight: 44,
-  minWidth: 44,
-  display: "inline-flex",
-  alignItems: "center",
-  justifyContent: "center",
-};
-
-export function LibraryPage() {
-  const navigate = useNavigate();
-  const { logout } = useAuth();
-
-  const [books, setBooks] = useState<BookListItem[]>([]);
-  const [loading, setLoading] = useState(true);
-  const [error, setError] = useState<string | null>(null);
-  const [searchQuery, setSearchQuery] = useState("");
-  const [filters, setFilters] = useState<FilterState>({ genre: "", author: "", reading_status: "" });
-  const [genres, setGenres] = useState<string[]>([]);
-  const [authors, setAuthors] = useState<string[]>([]);
-  const [totalCount, setTotalCount] = useState(0);
-  const [showFilters, setShowFilters] = useState(false);
-  const [showSuggestions, setShowSuggestions] = useState(false);
-
-  const debouncedSearch = useDebounce(searchQuery, 300);
-  const loadedRef = useRef(false);
-  const searchInputRef = useRef<HTMLInputElement>(null);
-  const isMobile = useMediaQuery(BREAKPOINTS.md);
-
-  // Voice search
-  const voiceSearch = useVoiceSearch();
-
-  // Sync voice transcript into search input
-  useEffect(() => {
-    if (voiceSearch.transcript && !voiceSearch.isListening) {
-      setSearchQuery(voiceSearch.transcript);
-      setShowSuggestions(false);
-    }
-  }, [voiceSearch.transcript, voiceSearch.isListening]);
-
-  // Load filter options once
-  useEffect(() => {
-    if (loadedRef.current) return;
-    loadedRef.current = true;
-    void Promise.all([booksApi.getGenres(), booksApi.getAuthors()]).then(
-      ([genreList, authorList]) => {
-        setGenres(genreList);
-        setAuthors(authorList);
-      },
-      () => {
-        // Filters degrade gracefully if discovery endpoints fail
-      },
-    );
-  }, []);
-
-  const loadBooks = useCallback(async (params: BookSearchParams) => {
-    setLoading(true);
-    setError(null);
-    try {
-      const response = await booksApi.searchBooks(params);
-      setBooks(response.results);
-      setTotalCount(response.count);
-    } catch (err) {
-      setError(err instanceof Error ? err.message : "Failed to load books");
-      setBooks([]);
-      setTotalCount(0);
-    } finally {
-      setLoading(false);
-    }
-  }, []);
-
-  // Reload when search or filters change
-  useEffect(() => {
-    const params: BookSearchParams = {};
-    if (debouncedSearch) params.q = debouncedSearch;
-    if (filters.genre) params.genre = filters.genre;
-    if (filters.author) params.author = filters.author;
-    if (filters.reading_status) params.reading_status = filters.reading_status;
-    void loadBooks(params);
-  }, [debouncedSearch, filters, loadBooks]);
-
-  const handleFilterChange = (key: keyof FilterState, value: string) => {
-    setFilters((prev: FilterState) => ({ ...prev, [key]: value }));
-  };
-
-  const clearAllFilters = () => {
-    setSearchQuery("");
-    setFilters({ genre: "", author: "", reading_status: "" });
-    setShowFilters(false);
-  };
-
-  const hasActiveFilters = !!searchQuery || !!filters.genre || !!filters.author || !!filters.reading_status;
-
-  const containerStyle: React.CSSProperties = {
-    maxWidth: 960,
-    margin: "0 auto",
-    padding: isMobile ? 12 : 16,
-    minHeight: "100vh",
-    background: "#f8f9fa",
-  };
-
-  const headerStyle: React.CSSProperties = {
-    display: "flex",
-    justifyContent: "space-between",
-    alignItems: "center",
-    marginBottom: isMobile ? 12 : 20,
-    padding: isMobile ? "12px 0" : "16px 0",
-    borderBottom: "1px solid #e5e7eb",
-    flexWrap: "wrap",
-    gap: 8,
-  };
-
-  const searchContainerStyle: React.CSSProperties = {
-    position: "relative",
-    flex: 1,
-  };
-
-  return (
-    <div style={containerStyle}>
-      {/* Header */}
-      <header style={headerStyle}>
-        <div>
-          <h1 style={{ fontSize: isMobile ? 20 : 24, fontWeight: 700, color: "#1f2937", margin: 0 }}>Library</h1>
-          {!loading && (
-            <p style={{ fontSize: 13, color: "#6b7280", marginTop: 2 }}>
-              {totalCount} book{totalCount !== 1 ? "s" : ""}
-            </p>
-          )}
-        </div>
-        <div style={{ display: "flex", gap: isMobile ? 4 : 8, flexWrap: "wrap", alignItems: "center" }}>
-          {isMobile ? (
-            <>
-              <button onClick={() => navigate("/add")} style={{ ...TOUCH_TARGET, fontSize: 20, background: "none", border: "none", cursor: "pointer", padding: 8 }} title="Add Book">➕</button>
-              <button onClick={() => navigate("/bookmarks-notes")} style={{ ...TOUCH_TARGET, fontSize: 20, background: "none", border: "none", cursor: "pointer", padding: 8 }} title="Bookmarks">🔖</button>
-              <button onClick={() => navigate("/settings")} style={{ ...TOUCH_TARGET, fontSize: 20, background: "none", border: "none", cursor: "pointer", padding: 8 }} title="Settings">⚙️</button>
-              <button onClick={logout} style={{ ...TOUCH_TARGET, fontSize: 20, background: "none", border: "none", cursor: "pointer", padding: 8 }} title="Logout">🚪</button>
-            </>
-          ) : (
-            <>
-              <button onClick={() => navigate("/add")} className="btn">+ Add Book</button>
-              <button onClick={() => navigate("/bookmarks-notes")} className="btn btn-secondary">Bookmarks</button>
-              <button onClick={() => navigate("/settings")} className="btn btn-secondary">Settings</button>
-              <button onClick={logout} className="btn btn-danger">Logout</button>
-            </>
-          )}
-        </div>
-      </header>
-
-      {/* Search Bar */}
-      <div style={{ marginBottom: 16 }}>
-        <div style={{ display: "flex", gap: 8, alignItems: "center" }}>
-          <div style={searchContainerStyle}>
-            <input
-              ref={searchInputRef}
-              type="text"
-              placeholder="Search by title, author, or genre..."
-              value={searchQuery}
-              onChange={(e) => {
-                setSearchQuery(e.target.value);
-                setShowSuggestions(true);
-              }}
-              onFocus={() => setShowSuggestions(true)}
-              style={{
-                width: "100%",
-                padding: `12px 16px 12px ${voiceSearch.isSupported ? 44 : 44}px`,
-                paddingRight: voiceSearch.isSupported ? 48 : 16,
-                borderRadius: 10,
-                border: "1px solid #e5e7eb",
-                fontSize: isMobile ? 16 : 15,
-                background: "#fff",
-                outline: "none",
-                boxSizing: "border-box",
-                minHeight: 44,
-              }}
-            />
-            <span style={{
-              position: "absolute", left: 14, top: "50%", transform: "translateY(-50%)",
-              fontSize: 18, color: "#9ca3af", pointerEvents: "none",
-            }}>🔍</span>
-
-            {/* Voice Search Button */}
-            {voiceSearch.isSupported && (
-              <button
-                onClick={() => {
-                  if (voiceSearch.isListening) {
-                    voiceSearch.stopListening();
-                  } else {
-                    voiceSearch.startListening();
-                  }
-                }}
-                style={{
-                  position: "absolute",
-                  right: 8,
-                  top: "50%",
-                  transform: "translateY(-50%)",
-                  background: voiceSearch.isListening ? "#dc2626" : "transparent",
-                  border: "none",
-                  borderRadius: 8,
-                  cursor: "pointer",
-                  fontSize: 20,
-                  padding: "8px 8px",
-                  minWidth: 36,
-                  minHeight: 36,
-                  display: "flex",
-                  alignItems: "center",
-                  justifyContent: "center",
-                  color: voiceSearch.isListening ? "#fff" : "#6b7280",
-                  transition: "background 0.15s",
-                }}
-                title={voiceSearch.isListening ? "Stop listening" : "Search with voice"}
-              >
-                🎤
-              </button>
-            )}
-
-            {/* Real-time Suggestions */}
-            <SearchSuggestions
-              query={searchQuery}
-              visible={showSuggestions && !voiceSearch.isListening}
-              onClose={() => setShowSuggestions(false)}
-              onSelectSuggestion={() => setShowSuggestions(false)}
-            />
-          </div>
-          <button
-            onClick={() => setShowFilters(!showFilters)}
-            style={{
-              ...TOUCH_TARGET,
-              padding: "0 12px",
-              borderRadius: 8,
-              border: "1px solid #e5e7eb",
-              background: showFilters ? "#4f46e5" : "#fff",
-              color: showFilters ? "#fff" : "#374151",
-              fontSize: 13,
-              fontWeight: 600,
-              cursor: "pointer",
-              whiteSpace: "nowrap",
-              gap: 4,
-            }}
-          >
-            {isMobile ? "⚙️" : showFilters ? "▲ Filters" : "▼ Filters"}
-          </button>
-        </div>
-      </div>
-
-      {/* Voice search listening indicator */}
-      {voiceSearch.isListening && (
-        <div style={{
-          background: "#fef2f2",
-          padding: "10px 16px",
-          borderRadius: 8,
-          marginBottom: 12,
-          display: "flex",
-          alignItems: "center",
-          gap: 8,
-          fontSize: 14,
-          color: "#dc2626",
-        }}>
-          <span style={{ display: "inline-block", width: 8, height: 8, borderRadius: "50%", background: "#dc2626", animation: "pulse 1s infinite" }} />
-          Listening... speak now
-          <button
-            onClick={voiceSearch.stopListening}
-            style={{
-              marginLeft: "auto",
-              background: "#dc2626",
-              color: "#fff",
-              border: "none",
-              borderRadius: 4,
-              padding: "4px 12px",
-              cursor: "pointer",
-              fontSize: 12,
-            }}
-          >
-            Stop
-          </button>
-        </div>
-      )}
-
-      {/* Voice search error */}
-      {voiceSearch.hasError && !voiceSearch.isListening && (
-        <div style={{
-          background: "#fef3c7",
-          padding: "8px 12px",
-          borderRadius: 8,
-          marginBottom: 12,
-          fontSize: 13,
-          color: "#92400e",
-        }}>
-          Voice search: {voiceSearch.errorMessage === "no-speech" ? "No speech detected. Try again." : voiceSearch.errorMessage}
-        </div>
-      )}
-
-      {/* Filters Panel */}
-      {showFilters && (
-        <div style={{
-          background: "#fff",
-          borderRadius: 10,
-          padding: isMobile ? 12 : 16,
-          marginBottom: 16,
-          border: "1px solid #e5e7eb",
-          display: "flex",
-          flexDirection: isMobile ? "column" : "row",
-          gap: 12,
-          alignItems: isMobile ? "stretch" : "end",
-        }}>
-          <div style={{ minWidth: isMobile ? 0 : 160, flex: 1 }}>
-            <label style={{ display: "block", fontSize: 12, fontWeight: 600, color: "#6b7280", marginBottom: 4 }}>Genre</label>
-            <select
-              value={filters.genre}
-              onChange={(e) => handleFilterChange("genre", e.target.value)}
-              style={{
-                width: "100%",
-                padding: "8px 12px",
-                borderRadius: 6,
-                border: "1px solid #e5e7eb",
-                fontSize: 14,
-                background: "#fff",
-                cursor: "pointer",
-                minHeight: 36,
-              }}
-            >
-              <option value="">All Genres</option>
-              {genres.map((g) => <option key={g} value={g}>{g}</option>)}
-            </select>
-          </div>
-          <div style={{ minWidth: isMobile ? 0 : 160, flex: 1 }}>
-            <label style={{ display: "block", fontSize: 12, fontWeight: 600, color: "#6b7280", marginBottom: 4 }}>Author</label>
-            <select
-              value={filters.author}
-              onChange={(e) => handleFilterChange("author", e.target.value)}
-              style={{
-                width: "100%",
-                padding: "8px 12px",
-                borderRadius: 6,
-                border: "1px solid #e5e7eb",
-                fontSize: 14,
-                background: "#fff",
-                cursor: "pointer",
-                minHeight: 36,
-              }}
-            >
-              <option value="">All Authors</option>
-              {authors.map((a) => <option key={a} value={a}>{a}</option>)}
-            </select>
-          </div>
-          <div style={{ minWidth: isMobile ? 0 : 160, flex: 1 }}>
-            <label style={{ display: "block", fontSize: 12, fontWeight: 600, color: "#6b7280", marginBottom: 4 }}>Status</label>
-            <select
-              value={filters.reading_status}
-              onChange={(e) => handleFilterChange("reading_status", e.target.value)}
-              style={{
-                width: "100%",
-                padding: "8px 12px",
-                borderRadius: 6,
-                border: "1px solid #e5e7eb",
-                fontSize: 14,
-                background: "#fff",
-                cursor: "pointer",
-                minHeight: 36,
-              }}
-            >
-              {READING_STATUS_OPTIONS.map((opt) => <option key={opt.value} value={opt.value}>{opt.label}</option>)}
-            </select>
-          </div>
-          {hasActiveFilters && (
-            <button
-              onClick={clearAllFilters}
-              style={{
-                ...TOUCH_TARGET,
-                padding: "8px 16px",
-                borderRadius: 6,
-                border: "1px solid #e5e7eb",
-                background: "#fff",
-                color: "#6b7280",
-                fontSize: 13,
-                cursor: "pointer",
-                whiteSpace: "nowrap",
-                width: isMobile ? "100%" : "auto",
-              }}
-            >
-              ✕ Clear
-            </button>
-          )}
-        </div>
-      )}
-
-      {/* Error State */}
-      {error && (
-        <div style={{ background: "#fef2f2", padding: 16, borderRadius: 8, marginBottom: 16, textAlign: "center" }}>
-          <p style={{ color: "#dc2626", fontSize: 14 }}>{error}</p>
-          <button onClick={() => void loadBooks({})} style={{ marginTop: 8, padding: "8px 16px", border: "none", borderRadius: 6, background: "#dc2626", color: "#fff", cursor: "pointer", fontSize: 13, minHeight: 36 }}>Retry</button>
-        </div>
-      )}
-
-      {/* Loading State */}
-      {loading && (
-        <div style={{
-          display: "grid",
-          gridTemplateColumns: isMobile ? "1fr" : "repeat(auto-fill, minmax(200px, 1fr))",
-          gap: isMobile ? 12 : 16,
-          opacity: 0.6,
-        }}>
-          {Array.from({ length: isMobile ? 4 : 8 }).map((_, i) => (
-            <div key={i} style={{ background: "#fff", borderRadius: 12, overflow: "hidden", boxShadow: "0 2px 8px rgba(0,0,0,0.06)", display: isMobile ? "flex" : "block" }}>
-              <div style={{ width: isMobile ? 80 : "100%", height: isMobile ? 120 : 180, background: "#f0f0f0", flexShrink: 0 }} />
-              <div style={{ padding: 12 }}>
-                <div style={{ height: 14, background: "#f0f0f0", borderRadius: 4, marginBottom: 6, width: "70%" }} />
-                <div style={{ height: 12, background: "#f0f0f0", borderRadius: 4, width: "40%" }} />
-              </div>
-            </div>
-          ))}
-        </div>
-      )}
-
-      {/* Empty State */}
-      {!loading && !error && books.length === 0 && (
-        <div style={{ textAlign: "center", padding: isMobile ? "60px 16px" : "80px 20px" }}>
-          <div style={{ fontSize: isMobile ? 48 : 64, marginBottom: 16 }}>{hasActiveFilters ? "🔍" : "📚"}</div>
-          <h2 style={{ fontSize: isMobile ? 18 : 20, color: "#1f2937", marginBottom: 8 }}>
-            {hasActiveFilters ? "No books found" : "Your library is empty"}
-          </h2>
-          <p style={{ color: "#6b7280", marginBottom: 20, fontSize: 15, lineHeight: 1.5 }}>
-            {hasActiveFilters
-              ? "Try adjusting your search query or filters to discover more books."
-              : "Add a book to get started building your collection."}
-          </p>
-          {hasActiveFilters ? (
-            <button onClick={clearAllFilters} className="btn" style={{ padding: "12px 24px", fontSize: 15, minHeight: 44 }}>
-              Clear All Filters
-            </button>
-          ) : (
-            <button onClick={() => navigate("/add")} className="btn" style={{ padding: "12px 24px", fontSize: 15, minHeight: 44 }}>
-              Add Your First Book
-            </button>
-          )}
-        </div>
-      )}
-
-      {/* Results Grid */}
-      {!loading && books.length > 0 && (
-        <div style={{
-          display: "grid",
-          gridTemplateColumns: isMobile ? "1fr" : "repeat(auto-fill, minmax(200px, 1fr))",
-          gap: isMobile ? 12 : 16,
-        }}>
-          {books.map((book) => {
-            const statusColors: Record<string, { bg: string; text: string }> = {
-              want_to_read: { bg: "#dbeafe", text: "#1d4ed8" },
-              reading: { bg: "#dcfce7", text: "#16a34a" },
-              finished: { bg: "#f3e8ff", text: "#9333ea" },
-              dnf: { bg: "#fef3c7", text: "#b45309" },
-            };
-            const sc = statusColors[book.reading_status] ?? { bg: "#f3f4f6", text: "#6b7280" };
-
-            return (
-              <div
-                key={book.id}
-                onClick={() => navigate(`/books/${book.id}`)}
-                className={styles.bookCard}
-                style={{
-                  display: isMobile ? "flex" : "block",
-                }}
-              >
-                <div style={{
-                  width: isMobile ? 80 : "100%",
-                  height: isMobile ? 120 : 180,
-                  background: "#f0f0f0",
-                  display: "flex",
-                  alignItems: "center",
-                  justifyContent: "center",
-                  position: "relative",
-                  flexShrink: 0,
-                }}>
-                  {book.cover_image
-                    ? <img src={book.cover_image} alt={book.title} style={{ width: "100%", height: "100%", objectFit: "cover" }} />
-                    : <span style={{ fontSize: isMobile ? 32 : 48 }}>📖</span>}
-                  {!isMobile && (
-                    <span style={{
-                      position: "absolute", top: 8, right: 8,
-                      background: sc.bg, color: sc.text, fontSize: 11, fontWeight: 600,
-                      padding: "2px 8px", borderRadius: 999, lineHeight: "18px",
-                    }}>
-                      {book.reading_status_display}
-                    </span>
-                  )}
-                </div>
-                <div style={{ padding: isMobile ? "8px 12px" : 12, flex: 1 }}>
-                  <div style={{ display: "flex", alignItems: "flex-start", justifyContent: "space-between", gap: 8 }}>
-                    <div style={{ minWidth: 0, flex: 1 }}>
-                      <h3 style={{
-                        fontSize: isMobile ? 14 : 14,
-                        fontWeight: 600,
-                        color: "#1f2937",
-                        marginBottom: 2,
-                        margin: 0,
-                        overflow: "hidden",
-                        textOverflow: "ellipsis",
-                        whiteSpace: "nowrap",
-                      }}>
-                        {book.title}
-                      </h3>
-                      <p style={{ fontSize: 12, color: "#6b7280", marginBottom: 4, margin: "2px 0" }}>
-                        {book.author || "Unknown Author"}
-                      </p>
-                    </div>
-                    {isMobile && (
-                      <span style={{
-                        background: sc.bg, color: sc.text, fontSize: 10, fontWeight: 600,
-                        padding: "2px 6px", borderRadius: 999, whiteSpace: "nowrap", flexShrink: 0,
-                      }}>
-                        {book.reading_status_display}
-                      </span>
-                    )}
-                  </div>
-                  {book.genre && (
-                    <span style={{ fontSize: 11, color: "#4f46e5", background: "#eef2ff", padding: "1px 6px", borderRadius: 4, display: "inline-block", marginTop: 4 }}>
-                      {book.genre}
-                    </span>
-                  )}
-                </div>
-              </div>
-            );
-          })}
-        </div>
-      )}
-    </div>
-  );
-}

frontend/src/pages/Reader.tsx

@@ -1,64 +0,0 @@
-import React, { useCallback, useEffect, useRef, useState } from "react";
-import { useNavigate, useParams } from "react-router-dom";
-import { booksApi } from "../api/books";
-import type { EBookDetail } from "../types/book";
-
-export function ReaderPage() {
-  const { id } = useParams<{ id: string }>();
-  const navigate = useNavigate();
-  const [book, setBook] = useState<EBookDetail | null>(null);
-  const [loading, setLoading] = useState(true);
-  const [error, setError] = useState<string | null>(null);
-  const progressTimer = useRef<ReturnType<typeof setInterval> | null>(null);
-  const scrollRef = useRef<HTMLDivElement | null>(null);
-  const bookId = Number(id);
-
-  const saveProgress = useCallback(async () => {
-    if (!scrollRef.current || !book) return;
-    const { scrollTop, scrollHeight, clientHeight } = scrollRef.current;
-    const position = Math.min(100, Math.round((scrollTop / (scrollHeight - clientHeight)) * 100));
-    try { await booksApi.updateProgress(bookId, { current_position: position }); } catch { /* silent */ }
-  }, [bookId, book]);
-
-  useEffect(() => {
-    const loadBook = async () => {
-      setLoading(true); setError(null);
-      try {
-        const data = await booksApi.getEBook(bookId);
-        setBook(data);
-        document.title = data.title;
-      } catch (err) { setError(err instanceof Error ? err.message : "Failed to load book"); }
-      finally { setLoading(false); }
-    };
-    void loadBook();
-    return () => { document.title = "Cloud Reader"; };
-  }, [bookId]);
-
-  useEffect(() => {
-    progressTimer.current = setInterval(() => { void saveProgress(); }, 5000);
-    return () => { if (progressTimer.current) clearInterval(progressTimer.current); };
-  }, [saveProgress]);
-
-  useEffect(() => {
-    const handleBeforeUnload = () => { void saveProgress(); };
-    window.addEventListener("beforeunload", handleBeforeUnload);
-    return () => window.removeEventListener("beforeunload", handleBeforeUnload);
-  }, [saveProgress]);
-
-  if (loading) return <div style={{ display: "flex", justifyContent: "center", alignItems: "center", height: "100vh", color: "#888" }}><p>Loading book...</p></div>;
-  if (error) return <div style={{ display: "flex", flexDirection: "column", justifyContent: "center", alignItems: "center", height: "100vh", gap: 16 }}><p style={{ color: "#e74c3c", fontSize: 16 }}>{error}</p><button onClick={() => navigate("/")} style={{ padding: "8px 16px", borderRadius: 6, border: "1px solid #ddd", background: "#fff", cursor: "pointer" }}>← Back to Library</button></div>;
-  if (!book) return null;
-
-  return (
-    <div style={{ display: "flex", flexDirection: "column", height: "100vh", background: "#fff" }}>
-      <header style={{ display: "flex", alignItems: "center", padding: "12px 16px", borderBottom: "1px solid #eee", gap: 12, flexShrink: 0 }}>
-        <button onClick={() => navigate("/")} style={{ padding: "8px 16px", borderRadius: 6, border: "1px solid #ddd", background: "#fff", cursor: "pointer", fontSize: 14 }}>← Library</button>
-        <div style={{ flex: 1 }}><h1 style={{ fontSize: 18, fontWeight: 600, color: "#1a1a2e", margin: 0 }}>{book.title}</h1><p style={{ fontSize: 14, color: "#888", margin: "4px 0 0" }}>{book.author}</p></div>
-        <button onClick={() => navigate(`/bookmarks-notes/${bookId}`)} style={{ padding: "8px 16px", borderRadius: 6, border: "1px solid #ddd", background: "#fff", cursor: "pointer", fontSize: 14 }}>📑 Bookmarks & Notes</button>
-      </header>
-      <div ref={scrollRef} style={{ flex: 1, overflow: "auto", background: "#fafafa" }}>
-        {book.file_url ? <iframe src={book.file_url} style={{ width: "100%", height: "100%", border: "none" }} title={book.title} /> : <div style={{ display: "flex", justifyContent: "center", alignItems: "center", height: "100%", color: "#888" }}><p>No file available.</p></div>}
-      </div>
-    </div>
-  );
-}

frontend/src/pages/ReadingPage.tsx

@@ -0,0 +1,213 @@
+/**
+ * ReadingPage — full-screen reading view for ebooks.
+ * Integrates TOC drawer, settings panel, chapter navigation, and progress tracking.
+ */
+
+import { lazy, Suspense, useCallback, useEffect, useState } from "react";
+import { useNavigate, useParams } from "react-router-dom";
+import { useChapters } from "../hooks/useChapters";
+import { useReadingProgress } from "../hooks/useReadingProgress";
+import { useReadingSettings } from "../hooks/useReadingSettings";
+import { booksApi } from "../api/books";
+import type { BookDetail } from "../types/book";
+import "../reader.css";
+
+const ReaderToolbar = lazy(() => import("../components/reader/ReaderToolbar"));
+const TableOfContents = lazy(() => import("../components/reader/TableOfContents"));
+const ReadingSettingsPanel = lazy(
+  () => import("../components/reader/ReadingSettingsPanel")
+);
+
+export default function ReadingPage() {
+  const { id } = useParams<{ id: string }>();
+  const navigate = useNavigate();
+  const bookId = Number(id);
+  const [book, setBook] = useState<BookDetail | null>(null);
+  const [bookLoading, setBookLoading] = useState(true);
+
+  // Fetch book details
+  useEffect(() => {
+    if (!bookId || Number.isNaN(bookId)) return;
+    setBookLoading(true);
+    booksApi.getBook(bookId)
+      .then(setBook)
+      .catch(() => { /* handled by useChapters error */ })
+      .finally(() => setBookLoading(false));
+  }, [bookId]);
+
+  const [tocOpen, setTocOpen] = useState(false);
+  const [settingsOpen, setSettingsOpen] = useState(false);
+
+  const { settings, updateSettings } = useReadingSettings();
+  const {
+    chapters,
+    currentChapter,
+    currentChapterNumber,
+    isLoading,
+    error,
+    navigateToChapter,
+    goToNextChapter,
+    goToPreviousChapter,
+    hasNext,
+    hasPrevious,
+  } = useChapters(bookId, 1);
+
+  const { progress, debouncedSave } = useReadingProgress(bookId);
+
+  // Auto-save progress when chapter changes
+  useEffect(() => {
+    if (currentChapter && currentChapterNumber > 0) {
+      debouncedSave(currentChapterNumber, 0, (currentChapterNumber / Math.max(chapters.length, 1)) * 100);
+    }
+  }, [currentChapterNumber, currentChapter?.id]);
+
+  const handleKeyDown = useCallback(
+    (e: KeyboardEvent) => {
+      if (e.key === "ArrowLeft" && hasPrevious) {
+        goToPreviousChapter();
+      } else if (e.key === "ArrowRight" && hasNext) {
+        goToNextChapter();
+      } else if (e.key === "Escape") {
+        setTocOpen(false);
+        setSettingsOpen(false);
+      }
+    },
+    [hasNext, hasPrevious, goToNextChapter, goToPreviousChapter]
+  );
+
+  useEffect(() => {
+    document.addEventListener("keydown", handleKeyDown);
+    return () => document.removeEventListener("keydown", handleKeyDown);
+  }, [handleKeyDown]);
+
+  // Lock/unlock orientation via CSS
+  useEffect(() => {
+    const root = document.documentElement;
+    if (settings.orientation_lock !== "auto") {
+      root.style.setProperty(
+        "--reader-orientation",
+        settings.orientation_lock === "portrait" ? "portrait" : "landscape"
+      );
+    } else {
+      root.style.removeProperty("--reader-orientation");
+    }
+  }, [settings.orientation_lock]);
+
+  // Show loading state
+  if (bookLoading || (isLoading && !currentChapter)) {
+    return (
+      <div className="reader-loading">
+        <div className="spinner" />
+        <p>Loading reader...</p>
+      </div>
+    );
+  }
+
+  if (error) {
+    return (
+      <div className="reader-loading">
+        <p className="reader-error">{error}</p>
+        <button type="button" className="back-button" onClick={() => navigate(`/books/${bookId}`)}>
+          Back to book
+        </button>
+      </div>
+    );
+  }
+
+  return (
+    <Suspense
+      fallback={
+        <div className="reader-loading">
+          <div className="spinner" />
+        </div>
+      }
+    >
+      <div className="reader-container">
+        <ReaderToolbar
+          bookTitle={book.title}
+          chapterTitle={currentChapter?.title ?? "Loading..."}
+          progress={progress}
+          onToggleToc={() => setTocOpen((v) => !v)}
+          onToggleSettings={() => setSettingsOpen((v) => !v)}
+        />
+
+        <TableOfContents
+          chapters={chapters}
+          currentChapterNumber={currentChapterNumber}
+          isOpen={tocOpen}
+          onClose={() => setTocOpen(false)}
+          onNavigate={navigateToChapter}
+        />
+
+        <ReadingSettingsPanel
+          settings={settings}
+          isOpen={settingsOpen}
+          onClose={() => setSettingsOpen(false)}
+          onUpdate={updateSettings}
+        />
+
+        {/* Main reading area */}
+        <main className="reader-content">
+          {isLoading ? (
+            <div className="reader-loading">
+              <div className="spinner" />
+              <p>Loading chapter...</p>
+            </div>
+          ) : currentChapter ? (
+            <article className="reader-chapter">
+              <h1 className="reader-chapter-title">{currentChapter.title}</h1>
+              <div
+                className="reader-chapter-body"
+                dangerouslySetInnerHTML={{
+                  __html: currentChapter.content,
+                }}
+              />
+            </article>
+          ) : (
+            <div className="reader-loading">
+              <p>Select a chapter from the table of contents to start reading.</p>
+            </div>
+          )}
+        </main>
+
+        {/* Bottom navigation bar */}
+        <nav className="reader-nav">
+          <button
+            type="button"
+            className={`reader-nav-btn ${!hasPrevious ? "reader-nav-btn--disabled" : ""}`}
+            onClick={goToPreviousChapter}
+            disabled={!hasPrevious}
+          >
+            <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
+              <polyline points="15 18 9 12 15 6" />
+            </svg>
+            Previous
+          </button>
+
+          <button
+            type="button"
+            className="reader-nav-btn reader-nav-btn--back"
+            onClick={() => navigate("/")}
+          >
+            <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
+              <path d="M20 12H4M10 18l-6-6 6-6" />
+            </svg>
+            Library
+          </button>
+
+          <button
+            type="button"
+            className={`reader-nav-btn ${!hasNext ? "reader-nav-btn--disabled" : ""}`}
+            onClick={goToNextChapter}
+            disabled={!hasNext}
+          >
+            Next
+            <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
+              <polyline points="9 18 15 12 9 6" />
+            </svg>
+          </button>
+        </nav>
+      </div>
+    </Suspense>
+  );
+}

frontend/src/pages/Settings.tsx

@@ -1,80 +0,0 @@
-import React, { useEffect, useState } from "react";
-import { useNavigate } from "react-router-dom";
-import { booksApi } from "../api/books";
-import type { ReadingSettings } from "../types/book";
-
-const BG_COLORS = [
-  { value: "#ffffff", label: "White" },
-  { value: "#f4e4c1", label: "Sepia" },
-  { value: "#1a1a2e", label: "Dark" },
-  { value: "#c7edcc", label: "Green" },
-];
-
-export function SettingsPage() {
-  const navigate = useNavigate();
-  const [settings, setSettings] = useState<ReadingSettings | null>(null);
-  const [loading, setLoading] = useState(true);
-  const [saving, setSaving] = useState(false);
-  const [error, setError] = useState<string | null>(null);
-  const [success, setSuccess] = useState(false);
-
-  useEffect(() => {
-    const load = async () => {
-      try { const data = await booksApi.getSettings(); setSettings(data); }
-      catch (err) { setError(err instanceof Error ? err.message : "Failed to load settings"); }
-      finally { setLoading(false); }
-    };
-    void load();
-  }, []);
-
-  const handleSave = async () => {
-    if (!settings) return;
-    setSaving(true); setError(null); setSuccess(false);
-    try { await booksApi.updateSettings(settings); setSuccess(true); setTimeout(() => setSuccess(false), 2000); }
-    catch (err) { setError(err instanceof Error ? err.message : "Failed to save settings"); }
-    finally { setSaving(false); }
-  };
-
-  if (loading) return <div style={{ maxWidth: 500, margin: "0 auto", padding: 16, minHeight: "100vh", background: "#f8f9fa" }}><p>Loading settings...</p></div>;
-
-  return (
-    <div style={{ maxWidth: 500, margin: "0 auto", padding: 16, minHeight: "100vh", background: "#f8f9fa" }}>
-      <header style={{ display: "flex", alignItems: "center", gap: 12, marginBottom: 24, padding: "16px 0", borderBottom: "1px solid #eee" }}>
-        <button onClick={() => navigate("/")} style={{ padding: "8px 16px", borderRadius: 6, border: "1px solid #ddd", background: "#fff", cursor: "pointer", fontSize: 14 }}>← Back</button>
-        <h1 style={{ fontSize: 24, fontWeight: 700, color: "#1a1a2e", margin: 0 }}>Reading Settings</h1>
-      </header>
-      <div style={{ display: "flex", flexDirection: "column", gap: 24 }}>
-        {error && <div style={{ background: "#fde8e8", padding: 12, borderRadius: 6, color: "#e74c3c", fontSize: 14 }}>{error}</div>}
-        {success && <div style={{ background: "#d4edda", padding: 12, borderRadius: 6, color: "#155724", fontSize: 14 }}>Settings saved!</div>}
-
-        {settings && <>
-          <div style={{ display: "flex", flexDirection: "column", gap: 8 }}>
-            <label style={{ fontSize: 14, fontWeight: 600, color: "#555" }}>Font Size ({settings.font_size}px)</label>
-            <input type="range" min={12} max={36} value={settings.font_size} onChange={(e) => setSettings({ ...settings, font_size: Number(e.target.value) })} style={{ width: "100%", cursor: "pointer" }} />
-            <div style={{ display: "flex", justifyContent: "space-between", fontSize: 12, color: "#999" }}><span>12px</span><span>36px</span></div>
-          </div>
-          <div style={{ display: "flex", flexDirection: "column", gap: 8 }}>
-            <label style={{ fontSize: 14, fontWeight: 600, color: "#555" }}>Font Style</label>
-            <select value={settings.font_style} onChange={(e) => setSettings({ ...settings, font_style: e.target.value as ReadingSettings["font_style"] })} style={{ padding: "10px 12px", borderRadius: 6, border: "1px solid #ddd", fontSize: 16, background: "#fff", outline: "none" }}>
-              <option value="sans-serif">Sans Serif</option><option value="serif">Serif</option><option value="monospace">Monospace</option>
-            </select>
-          </div>
-          <div style={{ display: "flex", flexDirection: "column", gap: 8 }}>
-            <label style={{ fontSize: 14, fontWeight: 600, color: "#555" }}>Background Color</label>
-            <div style={{ display: "flex", gap: 12, flexWrap: "wrap" }}>
-              {BG_COLORS.map((bg) => (
-                <button key={bg.value} onClick={() => setSettings({ ...settings, background_color: bg.value })}
-                  style={{ width: 48, height: 48, borderRadius: "50%", cursor: "pointer", display: "flex", alignItems: "center", justifyContent: "center", background: bg.value, border: settings.background_color === bg.value ? "3px solid #1a1a2e" : "3px solid #ddd" }}
-                  title={bg.label}>
-                  {settings.background_color === bg.value && <span style={{ fontSize: 20, fontWeight: 700, color: bg.value === "#ffffff" || bg.value === "#f4e4c1" ? "#1a1a2e" : "#fff" }}>✓</span>}
-                </button>
-              ))}
-            </div>
-          </div>
-        </>}
-
-        <button onClick={handleSave} disabled={saving} style={{ padding: "12px 24px", borderRadius: 8, border: "none", background: "#1a1a2e", color: "#fff", fontSize: 16, fontWeight: 600, cursor: "pointer", opacity: saving ? 0.6 : 1, marginTop: 8 }}>{saving ? "Saving..." : "Save Settings"}</button>
-      </div>
-    </div>
-  );
-}

frontend/src/reader.css

@@ -0,0 +1,621 @@
+/* ============================================================
+   Cloud Reader — Reading View Styles
+   Mobile-first reading experience with theme support
+   ============================================================ */
+
+/* --- CSS Custom Properties (overridden by JS) --- */
+:root {
+  --reader-bg: #f5f0eb;
+  --reader-text: #1a1a1a;
+  --reader-font-family: Georgia, "Times New Roman", serif;
+  --reader-font-size: 18px;
+  --reader-line-height: 1.6;
+  --reader-margin: 16px;
+  --reader-brightness: 100%;
+  --reader-toolbar-bg: rgba(26, 26, 26, 0.95);
+  --reader-toolbar-text: #e0e0e0;
+  --reader-accent: #6c8cff;
+}
+
+/* --- Reading Container --- */
+.reader-container {
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background: var(--reader-bg);
+  color: var(--reader-text);
+  font-family: var(--reader-font-family);
+  font-size: var(--reader-font-size);
+  line-height: var(--reader-line-height);
+  filter: brightness(var(--reader-brightness));
+  display: flex;
+  flex-direction: column;
+  z-index: 100;
+  overflow: hidden;
+}
+
+/* Orientation lock */
+@supports (--reader-orientation: portrait) {
+  .reader-container {
+    orientation: var(--reader-orientation);
+  }
+}
+
+@media (orientation: landascape) {
+  .reader-container {
+    --reader-margin: 24px;
+  }
+}
+
+/* --- Top Toolbar --- */
+.reader-top-bar {
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  height: 52px;
+  background: var(--reader-toolbar-bg);
+  color: var(--reader-toolbar-text);
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 0 12px;
+  z-index: 120;
+  backdrop-filter: blur(12px);
+  -webkit-backdrop-filter: blur(12px);
+}
+
+.reader-bar-btn {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 40px;
+  height: 40px;
+  background: transparent;
+  border: none;
+  color: var(--reader-toolbar-text);
+  cursor: pointer;
+  border-radius: 8px;
+  transition: background 0.15s;
+}
+
+.reader-bar-btn:hover {
+  background: rgba(255, 255, 255, 0.1);
+}
+
+.reader-bar-title {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 1px;
+  min-width: 0;
+  flex: 1;
+  padding: 0 8px;
+}
+
+.reader-bar-book {
+  font-size: 0.8rem;
+  font-weight: 600;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  max-width: 200px;
+  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
+}
+
+.reader-bar-chapter {
+  font-size: 0.7rem;
+  opacity: 0.7;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  max-width: 200px;
+  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
+}
+
+/* --- Progress Bar --- */
+.reader-progress-bar {
+  position: fixed;
+  top: 52px;
+  left: 0;
+  right: 0;
+  height: 3px;
+  background: rgba(255, 255, 255, 0.1);
+  z-index: 120;
+}
+
+.reader-progress-fill {
+  height: 100%;
+  background: var(--reader-accent);
+  transition: width 0.3s ease;
+}
+
+/* --- Main Content Area --- */
+.reader-content {
+  flex: 1;
+  overflow-y: auto;
+  padding: 72px var(--reader-margin) 72px;
+  -webkit-overflow-scrolling: touch;
+  scroll-behavior: smooth;
+}
+
+/* --- Chapter Article --- */
+.reader-chapter {
+  max-width: 680px;
+  margin: 0 auto;
+}
+
+.reader-chapter-title {
+  font-size: 1.6em;
+  font-weight: 700;
+  line-height: 1.3;
+  margin-bottom: 0.75em;
+  padding-bottom: 0.5em;
+  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
+  color: var(--reader-text);
+}
+
+/* Chapter body — content from API (could be HTML/markdown-rendered) */
+.reader-chapter-body {
+  font-size: 1em;
+  line-height: var(--reader-line-height);
+}
+
+.reader-chapter-body p {
+  margin-bottom: 1.2em;
+  text-align: justify;
+  hyphens: auto;
+}
+
+.reader-chapter-body h2,
+.reader-chapter-body h3,
+.reader-chapter-body h4 {
+  margin-top: 1.5em;
+  margin-bottom: 0.6em;
+  line-height: 1.3;
+}
+
+.reader-chapter-body blockquote {
+  border-left: 3px solid var(--reader-accent);
+  padding-left: 1em;
+  margin: 1em 0;
+  opacity: 0.85;
+  font-style: italic;
+}
+
+.reader-chapter-body img {
+  max-width: 100%;
+  height: auto;
+  border-radius: 4px;
+  margin: 1em 0;
+}
+
+.reader-chapter-body ul,
+.reader-chapter-body ol {
+  padding-left: 1.5em;
+  margin-bottom: 1.2em;
+}
+
+.reader-chapter-body li {
+  margin-bottom: 0.4em;
+}
+
+/* --- Navigation Bar (Bottom) --- */
+.reader-nav {
+  position: fixed;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  height: 56px;
+  background: var(--reader-toolbar-bg);
+  color: var(--reader-toolbar-text);
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 0 12px;
+  z-index: 120;
+  gap: 8px;
+  backdrop-filter: blur(12px);
+  -webkit-backdrop-filter: blur(12px);
+}
+
+.reader-nav-btn {
+  display: inline-flex;
+  align-items: center;
+  gap: 6px;
+  padding: 8px 14px;
+  background: transparent;
+  border: 1px solid rgba(255, 255, 255, 0.2);
+  border-radius: 8px;
+  color: var(--reader-toolbar-text);
+  font-size: 0.85rem;
+  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
+  cursor: pointer;
+  transition: all 0.15s;
+}
+
+.reader-nav-btn:hover:not(.reader-nav-btn--disabled) {
+  border-color: var(--reader-accent);
+  color: var(--reader-accent);
+}
+
+.reader-nav-btn--disabled {
+  opacity: 0.3;
+  cursor: not-allowed;
+}
+
+.reader-nav-btn--back {
+  background: rgba(108, 140, 255, 0.15);
+  border-color: rgba(108, 140, 255, 0.3);
+}
+
+.reader-nav-btn--back:hover {
+  background: rgba(108, 140, 255, 0.25);
+  color: var(--reader-accent);
+}
+
+/* --- TOC Drawer --- */
+.toc-overlay,
+.settings-overlay {
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background: rgba(0, 0, 0, 0.5);
+  z-index: 130;
+  animation: fadeIn 0.2s ease;
+}
+
+@keyframes fadeIn {
+  from { opacity: 0; }
+  to { opacity: 1; }
+}
+
+.toc-drawer,
+.settings-drawer {
+  position: fixed;
+  top: 0;
+  bottom: 0;
+  width: 300px;
+  max-width: 85vw;
+  background: var(--reader-toolbar-bg);
+  color: var(--reader-toolbar-text);
+  z-index: 140;
+  display: flex;
+  flex-direction: column;
+  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+}
+
+.toc-drawer {
+  left: 0;
+  transform: translateX(-100%);
+}
+
+.toc-drawer--open {
+  transform: translateX(0);
+}
+
+.settings-drawer {
+  right: 0;
+  transform: translateX(100%);
+}
+
+.settings-drawer--open {
+  transform: translateX(0);
+}
+
+.toc-header,
+.settings-header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 16px;
+  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
+}
+
+.toc-title,
+.settings-title {
+  font-size: 1.1rem;
+  font-weight: 700;
+  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
+}
+
+.toc-close-btn,
+.settings-close-btn {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 32px;
+  height: 32px;
+  background: transparent;
+  border: none;
+  color: var(--reader-toolbar-text);
+  cursor: pointer;
+  border-radius: 6px;
+  transition: background 0.15s;
+}
+
+.toc-close-btn:hover,
+.settings-close-btn:hover {
+  background: rgba(255, 255, 255, 0.1);
+}
+
+/* --- TOC List --- */
+.toc-list {
+  flex: 1;
+  overflow-y: auto;
+  padding: 8px 0;
+}
+
+.toc-empty {
+  padding: 24px 16px;
+  text-align: center;
+  opacity: 0.6;
+  font-size: 0.9rem;
+}
+
+.toc-item {
+  display: flex;
+  align-items: center;
+  gap: 12px;
+  width: 100%;
+  padding: 10px 16px;
+  background: transparent;
+  border: none;
+  color: var(--reader-toolbar-text);
+  font-size: 0.9rem;
+  text-align: left;
+  cursor: pointer;
+  transition: background 0.15s;
+  font-family: inherit;
+}
+
+.toc-item:hover {
+  background: rgba(255, 255, 255, 0.08);
+}
+
+.toc-item--active {
+  background: rgba(108, 140, 255, 0.15);
+  color: var(--reader-accent);
+  font-weight: 600;
+}
+
+.toc-item-number {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  min-width: 24px;
+  height: 24px;
+  font-size: 0.75rem;
+  font-weight: 700;
+  border-radius: 4px;
+  background: rgba(255, 255, 255, 0.1);
+  padding: 0 4px;
+}
+
+.toc-item-title {
+  flex: 1;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+/* --- Settings Panel --- */
+.settings-body {
+  flex: 1;
+  overflow-y: auto;
+  padding: 12px 16px 32px;
+}
+
+.settings-section {
+  margin-bottom: 20px;
+}
+
+.settings-section-title {
+  font-size: 0.75rem;
+  font-weight: 700;
+  text-transform: uppercase;
+  letter-spacing: 0.06em;
+  color: rgba(255, 255, 255, 0.5);
+  margin-bottom: 8px;
+  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
+}
+
+/* Theme grid */
+.theme-grid {
+  display: grid;
+  grid-template-columns: 1fr 1fr;
+  gap: 8px;
+}
+
+.theme-btn {
+  padding: 10px;
+  border: 1px solid rgba(255, 255, 255, 0.15);
+  border-radius: 8px;
+  background: transparent;
+  color: var(--reader-toolbar-text);
+  font-size: 0.85rem;
+  cursor: pointer;
+  transition: all 0.15s;
+  font-family: inherit;
+}
+
+.theme-btn:hover {
+  border-color: rgba(255, 255, 255, 0.3);
+}
+
+.theme-btn--active {
+  border-color: var(--reader-accent);
+  background: rgba(108, 140, 255, 0.15);
+  color: var(--reader-accent);
+  font-weight: 600;
+}
+
+/* Font grid */
+.font-grid,
+.orientation-grid {
+  display: grid;
+  grid-template-columns: 1fr 1fr 1fr;
+  gap: 8px;
+}
+
+.font-btn,
+.orientation-btn {
+  padding: 10px 8px;
+  border: 1px solid rgba(255, 255, 255, 0.15);
+  border-radius: 8px;
+  background: transparent;
+  color: var(--reader-toolbar-text);
+  font-size: 0.85rem;
+  cursor: pointer;
+  transition: all 0.15s;
+  font-family: inherit;
+}
+
+.font-btn:hover,
+.orientation-btn:hover {
+  border-color: rgba(255, 255, 255, 0.3);
+}
+
+.font-btn--active,
+.orientation-btn--active {
+  border-color: var(--reader-accent);
+  background: rgba(108, 140, 255, 0.15);
+  color: var(--reader-accent);
+  font-weight: 600;
+}
+
+/* Sliders */
+.settings-slider {
+  width: 100%;
+  height: 6px;
+  -webkit-appearance: none;
+  appearance: none;
+  background: rgba(255, 255, 255, 0.2);
+  border-radius: 3px;
+  outline: none;
+  cursor: pointer;
+}
+
+.settings-slider::-webkit-slider-thumb {
+  -webkit-appearance: none;
+  width: 20px;
+  height: 20px;
+  border-radius: 50%;
+  background: var(--reader-accent);
+  border: 2px solid white;
+  cursor: pointer;
+  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
+}
+
+.settings-slider::-moz-range-thumb {
+  width: 20px;
+  height: 20px;
+  border-radius: 50%;
+  background: var(--reader-accent);
+  border: 2px solid white;
+  cursor: pointer;
+}
+
+/* --- Start Reading Button (in book detail) --- */
+.start-reading-btn {
+  display: inline-flex;
+  align-items: center;
+  gap: 8px;
+  padding: 12px 24px;
+  background: var(--reader-accent);
+  border: none;
+  border-radius: 8px;
+  color: white;
+  font-size: 1rem;
+  font-weight: 600;
+  cursor: pointer;
+  transition: all 0.2s;
+  margin-top: 16px;
+  margin-bottom: 16px;
+  font-family: inherit;
+}
+
+.start-reading-btn:hover {
+  background: #5a7ae8;
+  transform: translateY(-1px);
+  box-shadow: 0 4px 12px rgba(108, 140, 255, 0.3);
+}
+
+/* --- Loading State --- */
+.reader-loading {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  gap: 12px;
+  padding: 48px;
+  color: var(--reader-text);
+}
+
+.reader-error {
+  color: #ef4444;
+  text-align: center;
+}
+
+/* --- Responsive --- */
+@media (max-width: 480px) {
+  .reader-chapter {
+    max-width: 100%;
+  }
+
+  .reader-nav-btn {
+    padding: 8px 10px;
+    font-size: 0.8rem;
+  }
+
+  .reader-nav-btn span {
+    display: none;
+  }
+
+  .toc-drawer,
+  .settings-drawer {
+    max-width: 100vw;
+  }
+
+  .reader-chapter-title {
+    font-size: 1.3em;
+  }
+}
+
+@media (min-width: 768px) {
+  .reader-chapter {
+    max-width: 720px;
+  }
+
+  .reader-chapter-body {
+    font-size: 1.05em;
+  }
+}
+
+/* --- Landscape on Mobile --- */
+@media (orientation: landscape) and (max-height: 500px) {
+  .reader-top-bar {
+    height: 44px;
+  }
+
+  .reader-content {
+    padding-top: 60px;
+    padding-bottom: 60px;
+  }
+
+  .reader-chapter-title {
+    font-size: 1.2em;
+  }
+}
+
+/* --- Dark mode theme override when reader uses light theme but system is dark --- */
+@media (prefers-color-scheme: dark) {
+  .reader-container[data-theme="light"] {
+    --reader-toolbar-bg: rgba(255, 255, 255, 0.95);
+    --reader-toolbar-text: #1a1a1a;
+  }
+}

frontend/src/types/book.ts

@@ -1,102 +0,0 @@
-export interface BookListItem {
-  id: number;
-  title: string;
-  author: string;
-  genre: string;
-  reading_status: string;
-  reading_status_display: string;
-  cover_image: string | null;
-}
-
-export interface BookDetail {
-  id: number;
-  title: string;
-  author: string;
-  genre: string;
-  description: string;
-  reading_status: string;
-  reading_status_display: string;
-  cover_image: string | null;
-  total_pages: number;
-  created_at: string;
-  updated_at: string;
-}
-
-export interface EBookListItem {
-  id: number;
-  title: string;
-  author: string;
-  filename: string;
-  format: string;
-  page_count: number;
-  cover_image: string | null;
-  created_at: string;
-  progress: number | null;
-}
-
-export interface EBookDetail {
-  id: number;
-  title: string;
-  author: string;
-  filename: string;
-  file_url: string;
-  format: string;
-  page_count: number;
-  file_size: number;
-  metadata_json: Record<string, unknown>;
-  cover_image: string | null;
-  created_at: string;
-  updated_at: string;
-  progress: ReadingProgress | null;
-}
-
-export interface ReadingProgress {
-  current_position: number;
-  last_page: number;
-}
-
-export interface ReadingSettings {
-  font_size: number;
-  font_style: "sans-serif" | "serif" | "monospace";
-  background_color: string;
-}
-
-export interface BookChapter {
-  id: number;
-  title: string;
-  index: number;
-  href: string;
-  children: BookChapter[];
-}
-
-export interface TocResponse {
-  chapters: BookChapter[];
-  format: string;
-  page_count: number;
-}
-
-export interface ContentResponse {
-  page: number;
-  total_pages: number;
-  content: string;
-  chapter_title: string;
-  format: string;
-}
-
-export interface BookSearchParams {
-  q?: string;
-  genre?: string;
-  author?: string;
-  reading_status?: string;
-  ordering?: string;
-  page?: number;
-  page_size?: number;
-}
-
-export const READING_STATUS_OPTIONS: { value: string; label: string }[] = [
-  { value: "", label: "All Statuses" },
-  { value: "want_to_read", label: "Want to Read" },
-  { value: "reading", label: "Reading" },
-  { value: "finished", label: "Finished" },
-  { value: "dnf", label: "Did Not Finish" },
-];

frontend/src/types/reader.ts

@@ -0,0 +1,44 @@
+/**
+ * TypeScript interfaces for the Cloud Reader reader module.
+ * Reading view, settings, chapters, and progress types.
+ */
+
+export interface ChapterSummary {
+  id: number;
+  book: number;
+  title: string;
+  number: number;
+}
+
+export interface ChapterDetail extends ChapterSummary {
+  content: string;
+  created_at: string;
+  updated_at: string;
+}
+
+export interface ReadingSettings {
+  font_family: "sans-serif" | "serif" | "monospace";
+  font_size: number;
+  line_height: number;
+  margin_width: number;
+  background_color: string;
+  text_color: string;
+  brightness: number;
+  orientation_lock: "auto" | "portrait" | "landscape";
+  theme: "sepia" | "dark" | "light" | "paper";
+  created_at: string;
+  updated_at: string;
+}
+
+export type ThemePreset = ReadingSettings["theme"];
+export type FontFamily = ReadingSettings["font_family"];
+export type OrientationLock = ReadingSettings["orientation_lock"];
+
+export interface ReadingProgress {
+  id: number;
+  book: number;
+  current_chapter: number;
+  current_position: number;
+  percentage: number;
+  updated_at: string;
+}

frontend/src/types/speech-recognition.d.ts

@@ -1,54 +0,0 @@
-/**
- * Type declarations for the Web Speech API (SpeechRecognition).
- * These are not part of the standard TypeScript DOM lib types.
- * Install @types/dom-speech-recognition for full coverage.
- */
-
-/* eslint-disable @typescript-eslint/no-explicit-any */
-
-interface SpeechRecognition extends EventTarget {
-  continuous: boolean;
-  interimResults: boolean;
-  lang: string;
-  onresult: ((event: SpeechRecognitionEvent) => void) | null;
-  onerror: ((event: SpeechRecognitionErrorEvent) => void) | null;
-  onend: (() => void) | null;
-  start(): void;
-  stop(): void;
-  abort(): void;
-}
-
-interface SpeechRecognitionEvent extends Event {
-  readonly resultIndex: number;
-  readonly results: SpeechRecognitionResultList;
-}
-
-interface SpeechRecognitionResultList {
-  readonly length: number;
-  [index: number]: SpeechRecognitionResult;
-}
-
-interface SpeechRecognitionResult {
-  readonly isFinal: boolean;
-  readonly length: number;
-  [index: number]: SpeechRecognitionAlternative;
-}
-
-interface SpeechRecognitionAlternative {
-  readonly transcript: string;
-  readonly confidence: number;
-}
-
-interface SpeechRecognitionErrorEvent extends Event {
-  readonly error: string;
-  readonly message: string;
-}
-
-interface SpeechRecognitionConstructor {
-  new (): SpeechRecognition;
-}
-
-interface Window {
-  SpeechRecognition?: SpeechRecognitionConstructor;
-  webkitSpeechRecognition?: SpeechRecognitionConstructor;
-}

mobile/App.tsx

@@ -1,16 +0,0 @@
-import React from "react";
-import { NavigationContainer } from "@react-navigation/native";
-import { StatusBar } from "expo-status-bar";
-import { AuthProvider } from "./src/context/AuthContext";
-import { RootNavigator } from "./src/navigation/RootNavigator";
-
-export default function App() {
-  return (
-    <AuthProvider>
-      <NavigationContainer>
-        <StatusBar style="auto" />
-        <RootNavigator />
-      </NavigationContainer>
-    </AuthProvider>
-  );
-}

mobile/app.json

@@ -1,28 +0,0 @@
-{
-  "expo": {
-    "name": "Cloud Reader",
-    "slug": "cloud-reader",
-    "version": "1.0.0",
-    "orientation": "portrait",
-    "icon": "./assets/icon.png",
-    "userInterfaceStyle": "automatic",
-    "newArchEnabled": true,
-    "splash": {
-      "backgroundColor": "#1a1a2e"
-    },
-    "ios": {
-      "supportsTablet": true,
-      "bundleIdentifier": "com.cloudreader.app"
-    },
-    "android": {
-      "adaptiveIcon": {
-        "backgroundColor": "#1a1a2e"
-      },
-      "package": "com.cloudreader.app"
-    },
-    "plugins": [
-      "expo-document-picker",
-      "expo-file-system"
-    ]
-  }
-}

mobile/babel.config.js

@@ -1,7 +0,0 @@
-module.exports = function (api) {
-  api.cache(true);
-  return {
-    presets: ["babel-preset-expo"],
-    plugins: ["react-native-reanimated/plugin"],
-  };
-};

mobile/package.json

@@ -1,35 +0,0 @@
-{
-  "name": "@cloud-reader/mobile",
-  "version": "1.0.0",
-  "private": true,
-  "main": "expo/AppEntry.js",
-  "scripts": {
-    "start": "expo start",
-    "android": "expo start --android",
-    "ios": "expo start --ios",
-    "web": "expo start --web",
-    "lint": "eslint ."
-  },
-  "dependencies": {
-    "expo": "~52.0.0",
-    "expo-status-bar": "~2.0.0",
-    "react": "^19.0.0",
-    "react-native": "0.76.6",
-    "react-native-safe-area-context": "4.14.1",
-    "react-native-screens": "~4.4.0",
-    "@react-navigation/native": "^7.0.0",
-    "@react-navigation/native-stack": "^7.0.0",
-    "@react-navigation/bottom-tabs": "^7.0.0",
-    "axios": "^1.7.9",
-    "@react-native-async-storage/async-storage": "2.1.0",
-    "expo-document-picker": "~13.0.0",
-    "expo-file-system": "~18.0.0",
-    "react-native-gesture-handler": "~2.20.0",
-    "react-native-reanimated": "~3.16.0",
-    "@cloud-reader/shared": "*"
-  },
-  "devDependencies": {
-    "@types/react": "~19.0.0",
-    "typescript": "~5.7.0"
-  }
-}

mobile/src/api/annotations.ts

@@ -1,55 +0,0 @@
-import api from "./client";
-import type {
-  Bookmark,
-  Note,
-  CreateBookmarkPayload,
-  CreateNotePayload,
-  PaginatedResponse,
-} from "@cloud-reader/shared";
-
-export function fetchBookmarks(
-  bookId?: string,
-): Promise<PaginatedResponse<Bookmark>> {
-  const params = bookId ? { book: bookId } : {};
-  return api
-    .get<PaginatedResponse<Bookmark>>("/api/annotations/bookmarks/", { params })
-    .then((res) => res.data);
-}
-
-export function createBookmark(
-  payload: CreateBookmarkPayload,
-): Promise<Bookmark> {
-  return api
-    .post<Bookmark>("/api/annotations/bookmarks/", payload)
-    .then((res) => res.data);
-}
-
-export function deleteBookmark(id: string): Promise<void> {
-  return api.delete(`/api/annotations/bookmarks/${id}/`).then(() => {});
-}
-
-export function fetchNotes(bookId?: string): Promise<PaginatedResponse<Note>> {
-  const params = bookId ? { book: bookId } : {};
-  return api
-    .get<PaginatedResponse<Note>>("/api/annotations/notes/", { params })
-    .then((res) => res.data);
-}
-
-export function createNote(payload: CreateNotePayload): Promise<Note> {
-  return api
-    .post<Note>("/api/annotations/notes/", payload)
-    .then((res) => res.data);
-}
-
-export function updateNote(
-  id: string,
-  content: string,
-): Promise<Note> {
-  return api
-    .patch<Note>(`/api/annotations/notes/${id}/`, { content })
-    .then((res) => res.data);
-}
-
-export function deleteNote(id: string): Promise<void> {
-  return api.delete(`/api/annotations/notes/${id}/`).then(() => {});
-}

mobile/src/api/books.ts

@@ -1,31 +0,0 @@
-import api from "./client";
-import type { Book, PaginatedResponse } from "@cloud-reader/shared";
-
-export function fetchBooks(
-  page = 1,
-  pageSize = 20,
-): Promise<PaginatedResponse<Book>> {
-  return api
-    .get<PaginatedResponse<Book>>("/api/books/", {
-      params: { page, page_size: pageSize },
-    })
-    .then((res) => res.data);
-}
-
-export function fetchBook(id: string): Promise<Book> {
-  return api.get<Book>(`/api/books/${id}/`).then((res) => res.data);
-}
-
-export function searchBooks(
-  query: string,
-): Promise<PaginatedResponse<Book>> {
-  return api
-    .get<PaginatedResponse<Book>>("/api/books/search/", {
-      params: { q: query },
-    })
-    .then((res) => res.data);
-}
-
-export function deleteBook(id: string): Promise<void> {
-  return api.delete(`/api/books/${id}/`).then(() => {});
-}

mobile/src/api/client.ts

@@ -1,140 +0,0 @@
-import axios, { type AxiosError, type InternalAxiosRequestConfig } from "axios";
-import AsyncStorage from "@react-native-async-storage/async-storage";
-
-const STORAGE_KEYS = {
-  ACCESS_TOKEN: "access_token",
-  REFRESH_TOKEN: "refresh_token",
-} as const;
-
-interface RetryConfig extends InternalAxiosRequestConfig {
-  _retry?: boolean;
-}
-
-const api = axios.create({
-  baseURL: process.env.EXPO_PUBLIC_API_URL || "http://localhost:8000",
-  headers: {
-    "Content-Type": "application/json",
-  },
-});
-
-// ── Token helpers ────────────────────────────────────────────────────
-
-async function getAccessToken(): Promise<string | null> {
-  return AsyncStorage.getItem(STORAGE_KEYS.ACCESS_TOKEN);
-}
-
-async function getRefreshToken(): Promise<string | null> {
-  return AsyncStorage.getItem(STORAGE_KEYS.REFRESH_TOKEN);
-}
-
-async function setTokens(access: string, refresh: string): Promise<void> {
-  await AsyncStorage.setItem(STORAGE_KEYS.ACCESS_TOKEN, access);
-  await AsyncStorage.setItem(STORAGE_KEYS.REFRESH_TOKEN, refresh);
-}
-
-async function clearTokens(): Promise<void> {
-  await AsyncStorage.multiRemove([
-    STORAGE_KEYS.ACCESS_TOKEN,
-    STORAGE_KEYS.REFRESH_TOKEN,
-  ]);
-}
-
-// ── Request interceptor ─────────────────────────────────────────────
-
-api.interceptors.request.use(async (config: InternalAxiosRequestConfig) => {
-  const token = await getAccessToken();
-  if (token && config.headers) {
-    config.headers.Authorization = `Bearer ${token}`;
-  }
-  return config;
-});
-
-// ── Response interceptor: auto-refresh on 401 ───────────────────────
-
-let isRefreshing = false;
-let failedQueue: Array<{
-  resolve: (token: string) => void;
-  reject: (err: unknown) => void;
-}> = [];
-
-function processQueue(error: unknown, token: string | null = null): void {
-  failedQueue.forEach((prom) => {
-    if (error) {
-      prom.reject(error);
-    } else if (token) {
-      prom.resolve(token);
-    }
-  });
-  failedQueue = [];
-}
-
-api.interceptors.response.use(
-  (response) => response,
-  async (error: AxiosError) => {
-    const originalRequest = error.config as RetryConfig | undefined;
-
-    if (!originalRequest) {
-      return Promise.reject(error);
-    }
-
-    if (
-      error.response?.status !== 401 ||
-      originalRequest._retry ||
-      originalRequest.url?.includes("/api/auth/token/refresh/") ||
-      originalRequest.url?.includes("/api/auth/login/") ||
-      originalRequest.url?.includes("/api/auth/register/") ||
-      originalRequest.url?.includes("/api/auth/logout/")
-    ) {
-      return Promise.reject(error);
-    }
-
-    if (isRefreshing) {
-      return new Promise<string>((resolve, reject) => {
-        failedQueue.push({ resolve, reject });
-      }).then((token) => {
-        if (originalRequest.headers) {
-          originalRequest.headers.Authorization = `Bearer ${token}`;
-        }
-        return api(originalRequest);
-      });
-    }
-
-    originalRequest._retry = true;
-    isRefreshing = true;
-
-    const refreshToken = await getRefreshToken();
-
-    if (!refreshToken) {
-      isRefreshing = false;
-      await clearTokens();
-      return Promise.reject(error);
-    }
-
-    try {
-      const response = await axios.post(
-        `${api.defaults.baseURL}/api/auth/token/refresh/`,
-        { refresh: refreshToken },
-      );
-
-      const newAccess = response.data.access as string;
-      const newRefresh = response.data.refresh as string;
-      await setTokens(newAccess, newRefresh);
-
-      processQueue(null, newAccess);
-
-      if (originalRequest.headers) {
-        originalRequest.headers.Authorization = `Bearer ${newAccess}`;
-      }
-      return api(originalRequest);
-    } catch (refreshError) {
-      processQueue(refreshError, null);
-      await clearTokens();
-      return Promise.reject(refreshError);
-    } finally {
-      isRefreshing = false;
-    }
-  },
-);
-
-export { getAccessToken, getRefreshToken, setTokens, clearTokens };
-export default api;

mobile/src/api/ebooks.ts

@@ -1,54 +0,0 @@
-import { apiClient } from "./client";
-import type {
-  EBookListItem,
-  EBookDetail,
-  ReadingProgress,
-  ReadingSettings,
-  TocResponse,
-  ContentResponse,
-  PaginatedResponse,
-} from "@cloud-reader/shared";
-
-export const ebooksApi = {
-  /** List uploaded e-books */
-  list() {
-    return apiClient.get<PaginatedResponse<EBookListItem>>("/api/ebooks/");
-  },
-
-  /** Get e-book detail */
-  get(id: number) {
-    return apiClient.get<EBookDetail>(`/api/ebooks/${id}/`);
-  },
-
-  /** Get table of contents */
-  getToc(id: number) {
-    return apiClient.get<TocResponse>(`/api/ebooks/${id}/toc/`);
-  },
-
-  /** Get page content */
-  getContent(id: number, page: number) {
-    return apiClient.get<ContentResponse>(
-      `/api/ebooks/${id}/content/?page=${page}`,
-    );
-  },
-
-  /** Update reading progress */
-  updateProgress(id: number, data: Partial<ReadingProgress>) {
-    return apiClient.patch<ReadingProgress>(
-      `/api/ebooks/${id}/progress/`,
-      data,
-    );
-  },
-
-  /** Get or update reading settings */
-  getSettings(id: number) {
-    return apiClient.get<ReadingSettings>(`/api/ebooks/${id}/settings/`);
-  },
-
-  updateSettings(id: number, data: Partial<ReadingSettings>) {
-    return apiClient.patch<ReadingSettings>(
-      `/api/ebooks/${id}/settings/`,
-      data,
-    );
-  },
-};

mobile/src/api/index.ts

@@ -1,4 +0,0 @@
-export { apiClient, saveTokens, loadTokens, clearTokens } from "./client";
-export { booksApi } from "./books";
-export { ebooksApi } from "./ebooks";
-export { annotationsApi } from "./annotations";

mobile/src/context/AuthContext.tsx

@@ -1,104 +0,0 @@
-import React, {
-  createContext,
-  useContext,
-  useState,
-  useEffect,
-  useCallback,
-  type ReactNode,
-} from "react";
-import type { User, TokenResponse } from "@cloud-reader/shared";
-import { apiClient, saveTokens, loadTokens, clearTokens } from "../api/client";
-
-interface AuthState {
-  user: User | null;
-  isLoading: boolean;
-  isAuthenticated: boolean;
-}
-
-interface AuthContextValue extends AuthState {
-  login: (email: string, password: string) => Promise<void>;
-  register: (
-    email: string,
-    username: string,
-    password: string,
-  ) => Promise<void>;
-  logout: () => Promise<void>;
-}
-
-const AuthContext = createContext<AuthContextValue | null>(null);
-
-export function AuthProvider({ children }: { children: ReactNode }) {
-  const [state, setState] = useState<AuthState>({
-    user: null,
-    isLoading: true,
-    isAuthenticated: false,
-  });
-
-  // Restore session on mount
-  useEffect(() => {
-    (async () => {
-      try {
-        const tokens = await loadTokens();
-        if (tokens?.access) {
-          const response = await apiClient.get<User>("/api/auth/profile/");
-          setState({
-            user: response.data,
-            isLoading: false,
-            isAuthenticated: true,
-          });
-          return;
-        }
-      } catch {
-        await clearTokens();
-      }
-      setState({ user: null, isLoading: false, isAuthenticated: false });
-    })();
-  }, []);
-
-  const login = useCallback(async (email: string, password: string) => {
-    const response = await apiClient.post<TokenResponse>(
-      "/api/auth/login/",
-      { email, password },
-    );
-    await saveTokens(response.data);
-    const profile = await apiClient.get<User>("/api/auth/profile/");
-    setState({
-      user: profile.data,
-      isLoading: false,
-      isAuthenticated: true,
-    });
-  }, []);
-
-  const register = useCallback(
-    async (email: string, username: string, password: string) => {
-      await apiClient.post("/api/auth/register/", {
-        email,
-        username,
-        password,
-        password2: password,
-      });
-      // Auto-login after registration
-      await login(email, password);
-    },
-    [login],
-  );
-
-  const logout = useCallback(async () => {
-    await clearTokens();
-    setState({ user: null, isLoading: false, isAuthenticated: false });
-  }, []);
-
-  return (
-    <AuthContext.Provider value={{ ...state, login, register, logout }}>
-      {children}
-    </AuthContext.Provider>
-  );
-}
-
-export function useAuth(): AuthContextValue {
-  const ctx = useContext(AuthContext);
-  if (!ctx) {
-    throw new Error("useAuth must be used within an AuthProvider");
-  }
-  return ctx;
-}

mobile/src/hooks/index.ts

@@ -1,2 +0,0 @@
-export { useAuth } from "../context/AuthContext";
-export { useAsyncData } from "./useAsyncData";

mobile/src/hooks/useAsyncData.ts

@@ -1,33 +0,0 @@
-import { useState, useEffect, useCallback } from "react";
-
-/**
- * Generic async data fetching hook for mobile screens.
- */
-export function useAsyncData<T>(
-  fetcher: () => Promise<T>,
-  deps: unknown[] = [],
-) {
-  const [data, setData] = useState<T | null>(null);
-  const [loading, setLoading] = useState(true);
-  const [error, setError] = useState<Error | null>(null);
-
-  const execute = useCallback(async () => {
-    setLoading(true);
-    setError(null);
-    try {
-      const result = await fetcher();
-      setData(result);
-    } catch (err) {
-      setError(err instanceof Error ? err : new Error(String(err)));
-    } finally {
-      setLoading(false);
-    }
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, deps);
-
-  useEffect(() => {
-    execute();
-  }, [execute]);
-
-  return { data, loading, error, refetch: execute };
-}

mobile/src/navigation/AppNavigator.tsx

@@ -1,45 +0,0 @@
-import { type ReactNode } from "react";
-import { NavigationContainer } from "@react-navigation/native";
-import { createNativeStackNavigator } from "@react-navigation/native-stack";
-import { useAuth } from "../context/AuthContext";
-import LoginScreen from "../screens/LoginScreen";
-import RegisterScreen from "../screens/RegisterScreen";
-import MainTabs from "./MainTabs";
-
-export type AuthStackParamList = {
-  Login: undefined;
-  Register: undefined;
-};
-
-export type RootStackParamList = {
-  Auth: undefined;
-  Main: undefined;
-};
-
-const RootStack = createNativeStackNavigator<RootStackParamList>();
-const AuthStack = createNativeStackNavigator<AuthStackParamList>();
-
-function AuthNavigator(): ReactNode {
-  return (
-    <AuthStack.Navigator screenOptions={{ headerShown: false }}>
-      <AuthStack.Screen name="Login" component={LoginScreen} />
-      <AuthStack.Screen name="Register" component={RegisterScreen} />
-    </AuthStack.Navigator>
-  );
-}
-
-export default function AppNavigator(): ReactNode {
-  const { state } = useAuth();
-
-  return (
-    <NavigationContainer>
-      <RootStack.Navigator screenOptions={{ headerShown: false }}>
-        {state.isAuthenticated ? (
-          <RootStack.Screen name="Main" component={MainTabs} />
-        ) : (
-          <RootStack.Screen name="Auth" component={AuthNavigator} />
-        )}
-      </RootStack.Navigator>
-    </NavigationContainer>
-  );
-}

mobile/src/navigation/AuthNavigator.tsx

@@ -1,24 +0,0 @@
-import React from "react";
-import { createNativeStackNavigator } from "@react-navigation/native-stack";
-import LoginScreen from "../screens/LoginScreen";
-import RegisterScreen from "../screens/RegisterScreen";
-
-export type AuthStackParamList = {
-  Login: undefined;
-  Register: undefined;
-};
-
-const Stack = createNativeStackNavigator<AuthStackParamList>();
-
-export function AuthNavigator() {
-  return (
-    <Stack.Navigator
-      screenOptions={{
-        headerShown: false,
-      }}
-    >
-      <Stack.Screen name="Login" component={LoginScreen} />
-      <Stack.Screen name="Register" component={RegisterScreen} />
-    </Stack.Navigator>
-  );
-}

mobile/src/navigation/MainNavigator.tsx

@@ -1,68 +0,0 @@
-import React from "react";
-import { createBottomTabNavigator } from "@react-navigation/bottom-tabs";
-import { Text } from "react-native";
-import LibraryScreen from "../screens/LibraryScreen";
-import SearchScreen from "../screens/SearchScreen";
-import SettingsScreen from "../screens/SettingsScreen";
-
-export type MainTabParamList = {
-  Library: undefined;
-  Search: undefined;
-  Settings: undefined;
-};
-
-const Tab = createBottomTabNavigator<MainTabParamList>();
-
-function TabIcon({ label, focused }: { label: string; focused: boolean }) {
-  const icons: Record<string, string> = {
-    Library: "📚",
-    Search: "🔍",
-    Settings: "⚙️",
-  };
-  return (
-    <Text style={{ fontSize: 22, opacity: focused ? 1 : 0.5 }}>
-      {icons[label] ?? "●"}
-    </Text>
-  );
-}
-
-export function MainNavigator() {
-  return (
-    <Tab.Navigator
-      screenOptions={{
-        headerStyle: { backgroundColor: "#fff" },
-        headerTitleStyle: { fontWeight: "600", color: "#1a1a2e" },
-        tabBarActiveTintColor: "#4a6cf7",
-        tabBarInactiveTintColor: "#999",
-      }}
-    >
-      <Tab.Screen
-        name="Library"
-        component={LibraryScreen}
-        options={{
-          tabBarIcon: ({ focused }) => (
-            <TabIcon label="Library" focused={focused} />
-          ),
-        }}
-      />
-      <Tab.Screen
-        name="Search"
-        component={SearchScreen}
-        options={{
-          tabBarIcon: ({ focused }) => (
-            <TabIcon label="Search" focused={focused} />
-          ),
-        }}
-      />
-      <Tab.Screen
-        name="Settings"
-        component={SettingsScreen}
-        options={{
-          tabBarIcon: ({ focused }) => (
-            <TabIcon label="Settings" focused={focused} />
-          ),
-        }}
-      />
-    </Tab.Navigator>
-  );
-}

mobile/src/navigation/MainTabs.tsx

@@ -1,55 +0,0 @@
-import { type ReactNode } from "react";
-import { createBottomTabNavigator } from "@react-navigation/bottom-tabs";
-import { Text } from "react-native";
-import LibraryScreen from "../screens/LibraryScreen";
-import SearchScreen from "../screens/SearchScreen";
-import SettingsScreen from "../screens/SettingsScreen";
-
-export type MainTabParamList = {
-  Library: undefined;
-  Search: undefined;
-  Settings: undefined;
-};
-
-const Tab = createBottomTabNavigator<MainTabParamList>();
-
-function TabIcon({ label, focused }: { label: string; focused: boolean }) {
-  return (
-    <Text style={{ fontSize: 22, opacity: focused ? 1 : 0.5 }}>
-      {label === "Library" ? "📚" : label === "Search" ? "🔍" : "⚙️"}
-    </Text>
-  );
-}
-
-export default function MainTabs(): ReactNode {
-  return (
-    <Tab.Navigator
-      screenOptions={({ route }) => ({
-        tabBarIcon: ({ focused }: { focused: boolean }) => (
-          <TabIcon label={route.name} focused={focused} />
-        ),
-        tabBarActiveTintColor: "#4f8ef7",
-        tabBarInactiveTintColor: "#888",
-        headerStyle: { backgroundColor: "#1a1a2e" },
-        headerTintColor: "#fff",
-        tabBarStyle: { backgroundColor: "#1a1a2e", borderTopColor: "#333" },
-      })}
-    >
-      <Tab.Screen
-        name="Library"
-        component={LibraryScreen}
-        options={{ title: "My Library" }}
-      />
-      <Tab.Screen
-        name="Search"
-        component={SearchScreen}
-        options={{ title: "Search" }}
-      />
-      <Tab.Screen
-        name="Settings"
-        component={SettingsScreen}
-        options={{ title: "Settings" }}
-      />
-    </Tab.Navigator>
-  );
-}

mobile/src/navigation/RootNavigator.tsx

@@ -1,23 +0,0 @@
-import React from "react";
-import { ActivityIndicator, View } from "react-native";
-import { useAuth } from "../context/AuthContext";
-import { AuthNavigator } from "./AuthNavigator";
-import { MainNavigator } from "./MainNavigator";
-
-export function RootNavigator() {
-  const { isLoading, isAuthenticated } = useAuth();
-
-  if (isLoading) {
-    return (
-      <View style={{ flex: 1, justifyContent: "center", alignItems: "center" }}>
-        <ActivityIndicator size="large" color="#4a6cf7" />
-      </View>
-    );
-  }
-
-  if (!isAuthenticated) {
-    return <AuthNavigator />;
-  }
-
-  return <MainNavigator />;
-}

mobile/src/screens/LibraryScreen.tsx

@@ -1,181 +0,0 @@
-import { useState, useEffect, useCallback, type ReactNode } from "react";
-import {
-  View,
-  Text,
-  FlatList,
-  TouchableOpacity,
-  StyleSheet,
-  ActivityIndicator,
-  RefreshControl,
-} from "react-native";
-import { fetchBooks } from "../api/books";
-import type { Book, PaginatedResponse } from "@cloud-reader/shared";
-
-export default function LibraryScreen({ navigation }: { navigation: any }): ReactNode {
-  const [books, setBooks] = useState<Book[]>([]);
-  const [loading, setLoading] = useState(true);
-  const [refreshing, setRefreshing] = useState(false);
-  const [page, setPage] = useState(1);
-  const [hasMore, setHasMore] = useState(true);
-
-  const loadBooks = useCallback(async (pageNum: number, isRefresh = false) => {
-    try {
-      const data: PaginatedResponse<Book> = await fetchBooks(pageNum);
-      if (isRefresh) {
-        setBooks(data.results);
-      } else {
-        setBooks((prev) => [...prev, ...data.results]);
-      }
-      setHasMore(data.next !== null);
-      setPage(pageNum);
-    } catch {
-      // Silent error for now
-    } finally {
-      setLoading(false);
-      setRefreshing(false);
-    }
-  }, []);
-
-  useEffect(() => {
-    loadBooks(1, true);
-  }, [loadBooks]);
-
-  const onRefresh = () => {
-    setRefreshing(true);
-    loadBooks(1, true);
-  };
-
-  const loadMore = () => {
-    if (hasMore && !loading) {
-      loadBooks(page + 1);
-    }
-  };
-
-  const renderBook = ({ item }: { item: Book }) => (
-    <TouchableOpacity
-      style={styles.bookCard}
-      onPress={() =>
-        navigation.navigate("BookDetail", { bookId: item.id })
-      }
-    >
-      <View style={styles.bookCover}>
-        <Text style={styles.coverText}>
-          {item.title.charAt(0).toUpperCase()}
-        </Text>
-      </View>
-      <View style={styles.bookInfo}>
-        <Text style={styles.bookTitle} numberOfLines={1}>
-          {item.title}
-        </Text>
-        <Text style={styles.bookAuthor} numberOfLines={1}>
-          {item.author}
-        </Text>
-        <Text style={styles.bookPages}>{item.total_pages} pages</Text>
-      </View>
-    </TouchableOpacity>
-  );
-
-  if (loading && books.length === 0) {
-    return (
-      <View style={styles.centered}>
-        <ActivityIndicator size="large" color="#4f8ef7" />
-      </View>
-    );
-  }
-
-  return (
-    <View style={styles.container}>
-      <FlatList
-        data={books}
-        renderItem={renderBook}
-        keyExtractor={(item) => item.id}
-        onEndReached={loadMore}
-        onEndReachedThreshold={0.5}
-        contentContainerStyle={styles.list}
-        refreshControl={
-          <RefreshControl
-            refreshing={refreshing}
-            onRefresh={onRefresh}
-            tintColor="#4f8ef7"
-          />
-        }
-        ListEmptyComponent={
-          <View style={styles.centered}>
-            <Text style={styles.emptyText}>Your library is empty</Text>
-            <Text style={styles.emptySubtext}>
-              Add books to get started
-            </Text>
-          </View>
-        }
-      />
-    </View>
-  );
-}
-
-const styles = StyleSheet.create({
-  container: {
-    flex: 1,
-    backgroundColor: "#0f0f23",
-  },
-  centered: {
-    flex: 1,
-    justifyContent: "center",
-    alignItems: "center",
-    padding: 24,
-  },
-  list: {
-    padding: 16,
-  },
-  bookCard: {
-    flexDirection: "row",
-    backgroundColor: "#1a1a2e",
-    borderRadius: 12,
-    padding: 12,
-    marginBottom: 12,
-    borderWidth: 1,
-    borderColor: "#333",
-  },
-  bookCover: {
-    width: 60,
-    height: 80,
-    backgroundColor: "#2a2a4e",
-    borderRadius: 8,
-    justifyContent: "center",
-    alignItems: "center",
-  },
-  coverText: {
-    fontSize: 24,
-    fontWeight: "bold",
-    color: "#4f8ef7",
-  },
-  bookInfo: {
-    flex: 1,
-    marginLeft: 12,
-    justifyContent: "center",
-  },
-  bookTitle: {
-    fontSize: 16,
-    fontWeight: "600",
-    color: "#fff",
-    marginBottom: 4,
-  },
-  bookAuthor: {
-    fontSize: 14,
-    color: "#888",
-    marginBottom: 4,
-  },
-  bookPages: {
-    fontSize: 12,
-    color: "#666",
-  },
-  emptyText: {
-    fontSize: 18,
-    fontWeight: "600",
-    color: "#888",
-    marginBottom: 8,
-  },
-  emptySubtext: {
-    fontSize: 14,
-    color: "#666",
-  },
-});

mobile/src/screens/LoginScreen.tsx

@@ -1,173 +0,0 @@
-import { useState, type ReactNode } from "react";
-import {
-  View,
-  Text,
-  TextInput,
-  TouchableOpacity,
-  StyleSheet,
-  Alert,
-  ActivityIndicator,
-  KeyboardAvoidingView,
-  Platform,
-} from "react-native";
-import { useAuth } from "../context/AuthContext";
-import { isValidEmail } from "@cloud-reader/shared";
-
-export default function LoginScreen({ navigation }: { navigation: any }): ReactNode {
-  const { state, login, clearError } = useAuth();
-  const [email, setEmail] = useState("");
-  const [password, setPassword] = useState("");
-
-  const handleLogin = async () => {
-    clearError();
-
-    if (!email.trim()) {
-      Alert.alert("Validation Error", "Please enter your email.");
-      return;
-    }
-    if (!isValidEmail(email.trim())) {
-      Alert.alert("Validation Error", "Please enter a valid email address.");
-      return;
-    }
-    if (!password) {
-      Alert.alert("Validation Error", "Please enter your password.");
-      return;
-    }
-
-    try {
-      await login(email.trim(), password);
-    } catch {
-      // Error handled in context
-    }
-  };
-
-  return (
-    <KeyboardAvoidingView
-      style={styles.container}
-      behavior={Platform.OS === "ios" ? "padding" : "height"}
-    >
-      <View style={styles.inner}>
-        <Text style={styles.title}>Cloud Reader</Text>
-        <Text style={styles.subtitle}>Sign in to your account</Text>
-
-        {state.error && (
-          <View style={styles.errorBox}>
-            <Text style={styles.errorText}>{state.error}</Text>
-          </View>
-        )}
-
-        <TextInput
-          style={styles.input}
-          placeholder="Email"
-          placeholderTextColor="#666"
-          value={email}
-          onChangeText={setEmail}
-          keyboardType="email-address"
-          autoCapitalize="none"
-          autoCorrect={false}
-        />
-
-        <TextInput
-          style={styles.input}
-          placeholder="Password"
-          placeholderTextColor="#666"
-          value={password}
-          onChangeText={setPassword}
-          secureTextEntry
-        />
-
-        <TouchableOpacity
-          style={[styles.button, state.isLoading && styles.buttonDisabled]}
-          onPress={handleLogin}
-          disabled={state.isLoading}
-        >
-          {state.isLoading ? (
-            <ActivityIndicator color="#fff" />
-          ) : (
-            <Text style={styles.buttonText}>Sign In</Text>
-          )}
-        </TouchableOpacity>
-
-        <TouchableOpacity onPress={() => navigation.navigate("Register")}>
-          <Text style={styles.linkText}>
-            Don't have an account?{" "}
-            <Text style={styles.linkBold}>Sign Up</Text>
-          </Text>
-        </TouchableOpacity>
-      </View>
-    </KeyboardAvoidingView>
-  );
-}
-
-const styles = StyleSheet.create({
-  container: {
-    flex: 1,
-    backgroundColor: "#0f0f23",
-  },
-  inner: {
-    flex: 1,
-    justifyContent: "center",
-    paddingHorizontal: 24,
-  },
-  title: {
-    fontSize: 32,
-    fontWeight: "bold",
-    color: "#fff",
-    textAlign: "center",
-    marginBottom: 8,
-  },
-  subtitle: {
-    fontSize: 16,
-    color: "#888",
-    textAlign: "center",
-    marginBottom: 32,
-  },
-  input: {
-    backgroundColor: "#1a1a2e",
-    borderRadius: 8,
-    padding: 16,
-    fontSize: 16,
-    color: "#fff",
-    marginBottom: 12,
-    borderWidth: 1,
-    borderColor: "#333",
-  },
-  button: {
-    backgroundColor: "#4f8ef7",
-    borderRadius: 8,
-    padding: 16,
-    alignItems: "center",
-    marginTop: 8,
-    marginBottom: 24,
-  },
-  buttonDisabled: {
-    opacity: 0.6,
-  },
-  buttonText: {
-    color: "#fff",
-    fontSize: 16,
-    fontWeight: "600",
-  },
-  errorBox: {
-    backgroundColor: "rgba(255, 69, 58, 0.15)",
-    borderRadius: 8,
-    padding: 12,
-    marginBottom: 16,
-    borderWidth: 1,
-    borderColor: "rgba(255, 69, 58, 0.3)",
-  },
-  errorText: {
-    color: "#ff453a",
-    fontSize: 14,
-    textAlign: "center",
-  },
-  linkText: {
-    color: "#888",
-    textAlign: "center",
-    fontSize: 14,
-  },
-  linkBold: {
-    color: "#4f8ef7",
-    fontWeight: "600",
-  },
-});

mobile/src/screens/RegisterScreen.tsx

@@ -1,212 +0,0 @@
-import { useState, type ReactNode } from "react";
-import {
-  View,
-  Text,
-  TextInput,
-  TouchableOpacity,
-  StyleSheet,
-  Alert,
-  ActivityIndicator,
-  KeyboardAvoidingView,
-  Platform,
-  ScrollView,
-} from "react-native";
-import { useAuth } from "../context/AuthContext";
-import {
-  isValidEmail,
-  validatePasswordStrength,
-} from "@cloud-reader/shared";
-
-export default function RegisterScreen({
-  navigation,
-}: {
-  navigation: any;
-}): ReactNode {
-  const { state, register, clearError } = useAuth();
-  const [username, setUsername] = useState("");
-  const [email, setEmail] = useState("");
-  const [password, setPassword] = useState("");
-  const [confirmPassword, setConfirmPassword] = useState("");
-
-  const handleRegister = async () => {
-    clearError();
-
-    if (!username.trim()) {
-      Alert.alert("Validation Error", "Please enter a username.");
-      return;
-    }
-    if (!email.trim()) {
-      Alert.alert("Validation Error", "Please enter your email.");
-      return;
-    }
-    if (!isValidEmail(email.trim())) {
-      Alert.alert("Validation Error", "Please enter a valid email address.");
-      return;
-    }
-    const passwordError = validatePasswordStrength(password);
-    if (passwordError) {
-      Alert.alert("Validation Error", passwordError);
-      return;
-    }
-    if (password !== confirmPassword) {
-      Alert.alert("Validation Error", "Passwords do not match.");
-      return;
-    }
-
-    try {
-      await register(email.trim(), password, username.trim());
-    } catch {
-      // Error handled in context
-    }
-  };
-
-  return (
-    <KeyboardAvoidingView
-      style={styles.container}
-      behavior={Platform.OS === "ios" ? "padding" : "height"}
-    >
-      <ScrollView contentContainerStyle={styles.inner}>
-        <Text style={styles.title}>Create Account</Text>
-        <Text style={styles.subtitle}>Join Cloud Reader</Text>
-
-        {state.error && (
-          <View style={styles.errorBox}>
-            <Text style={styles.errorText}>{state.error}</Text>
-          </View>
-        )}
-
-        <TextInput
-          style={styles.input}
-          placeholder="Username"
-          placeholderTextColor="#666"
-          value={username}
-          onChangeText={setUsername}
-          autoCapitalize="none"
-          autoCorrect={false}
-        />
-
-        <TextInput
-          style={styles.input}
-          placeholder="Email"
-          placeholderTextColor="#666"
-          value={email}
-          onChangeText={setEmail}
-          keyboardType="email-address"
-          autoCapitalize="none"
-          autoCorrect={false}
-        />
-
-        <TextInput
-          style={styles.input}
-          placeholder="Password"
-          placeholderTextColor="#666"
-          value={password}
-          onChangeText={setPassword}
-          secureTextEntry
-        />
-
-        <TextInput
-          style={styles.input}
-          placeholder="Confirm Password"
-          placeholderTextColor="#666"
-          value={confirmPassword}
-          onChangeText={setConfirmPassword}
-          secureTextEntry
-        />
-
-        <TouchableOpacity
-          style={[styles.button, state.isLoading && styles.buttonDisabled]}
-          onPress={handleRegister}
-          disabled={state.isLoading}
-        >
-          {state.isLoading ? (
-            <ActivityIndicator color="#fff" />
-          ) : (
-            <Text style={styles.buttonText}>Create Account</Text>
-          )}
-        </TouchableOpacity>
-
-        <TouchableOpacity onPress={() => navigation.goBack()}>
-          <Text style={styles.linkText}>
-            Already have an account?{" "}
-            <Text style={styles.linkBold}>Sign In</Text>
-          </Text>
-        </TouchableOpacity>
-      </ScrollView>
-    </KeyboardAvoidingView>
-  );
-}
-
-const styles = StyleSheet.create({
-  container: {
-    flex: 1,
-    backgroundColor: "#0f0f23",
-  },
-  inner: {
-    flexGrow: 1,
-    justifyContent: "center",
-    paddingHorizontal: 24,
-    paddingVertical: 48,
-  },
-  title: {
-    fontSize: 28,
-    fontWeight: "bold",
-    color: "#fff",
-    textAlign: "center",
-    marginBottom: 8,
-  },
-  subtitle: {
-    fontSize: 16,
-    color: "#888",
-    textAlign: "center",
-    marginBottom: 32,
-  },
-  input: {
-    backgroundColor: "#1a1a2e",
-    borderRadius: 8,
-    padding: 16,
-    fontSize: 16,
-    color: "#fff",
-    marginBottom: 12,
-    borderWidth: 1,
-    borderColor: "#333",
-  },
-  button: {
-    backgroundColor: "#4f8ef7",
-    borderRadius: 8,
-    padding: 16,
-    alignItems: "center",
-    marginTop: 8,
-    marginBottom: 24,
-  },
-  buttonDisabled: {
-    opacity: 0.6,
-  },
-  buttonText: {
-    color: "#fff",
-    fontSize: 16,
-    fontWeight: "600",
-  },
-  errorBox: {
-    backgroundColor: "rgba(255, 69, 58, 0.15)",
-    borderRadius: 8,
-    padding: 12,
-    marginBottom: 16,
-    borderWidth: 1,
-    borderColor: "rgba(255, 69, 58, 0.3)",
-  },
-  errorText: {
-    color: "#ff453a",
-    fontSize: 14,
-    textAlign: "center",
-  },
-  linkText: {
-    color: "#888",
-    textAlign: "center",
-    fontSize: 14,
-  },
-  linkBold: {
-    color: "#4f8ef7",
-    fontWeight: "600",
-  },
-});

mobile/src/screens/SearchScreen.tsx

@@ -1,130 +0,0 @@
-import { useState, type ReactNode } from "react";
-import {
-  View,
-  Text,
-  TextInput,
-  FlatList,
-  TouchableOpacity,
-  StyleSheet,
-  ActivityIndicator,
-} from "react-native";
-import { searchBooks } from "../api/books";
-import type { Book, PaginatedResponse } from "@cloud-reader/shared";
-
-export default function SearchScreen(): ReactNode {
-  const [query, setQuery] = useState("");
-  const [results, setResults] = useState<Book[]>([]);
-  const [loading, setLoading] = useState(false);
-  const [searched, setSearched] = useState(false);
-
-  const handleSearch = async () => {
-    if (!query.trim()) return;
-    setLoading(true);
-    setSearched(true);
-    try {
-      const data: PaginatedResponse<Book> = await searchBooks(query.trim());
-      setResults(data.results);
-    } catch {
-      setResults([]);
-    } finally {
-      setLoading(false);
-    }
-  };
-
-  const renderBook = ({ item }: { item: Book }) => (
-    <View style={styles.resultCard}>
-      <Text style={styles.resultTitle}>{item.title}</Text>
-      <Text style={styles.resultAuthor}>{item.author}</Text>
-    </View>
-  );
-
-  return (
-    <View style={styles.container}>
-      <View style={styles.searchBar}>
-        <TextInput
-          style={styles.input}
-          placeholder="Search books by title, author..."
-          placeholderTextColor="#666"
-          value={query}
-          onChangeText={setQuery}
-          onSubmitEditing={handleSearch}
-          returnKeyType="search"
-          autoCapitalize="none"
-          autoCorrect={false}
-        />
-      </View>
-
-      {loading && (
-        <View style={styles.centered}>
-          <ActivityIndicator size="large" color="#4f8ef7" />
-        </View>
-      )}
-
-      {!loading && searched && results.length === 0 && (
-        <View style={styles.centered}>
-          <Text style={styles.noResults}>No books found for "{query}"</Text>
-        </View>
-      )}
-
-      <FlatList
-        data={results}
-        renderItem={renderBook}
-        keyExtractor={(item) => item.id}
-        contentContainerStyle={styles.list}
-      />
-    </View>
-  );
-}
-
-const styles = StyleSheet.create({
-  container: {
-    flex: 1,
-    backgroundColor: "#0f0f23",
-  },
-  searchBar: {
-    padding: 16,
-    borderBottomWidth: 1,
-    borderBottomColor: "#333",
-  },
-  input: {
-    backgroundColor: "#1a1a2e",
-    borderRadius: 8,
-    padding: 14,
-    fontSize: 16,
-    color: "#fff",
-    borderWidth: 1,
-    borderColor: "#333",
-  },
-  centered: {
-    flex: 1,
-    justifyContent: "center",
-    alignItems: "center",
-    padding: 24,
-  },
-  list: {
-    padding: 16,
-  },
-  resultCard: {
-    backgroundColor: "#1a1a2e",
-    borderRadius: 12,
-    padding: 16,
-    marginBottom: 8,
-    borderWidth: 1,
-    borderColor: "#333",
-  },
-  resultTitle: {
-    fontSize: 16,
-    fontWeight: "600",
-    color: "#fff",
-    marginBottom: 4,
-  },
-  resultAuthor: {
-    fontSize: 14,
-    color: "#888",
-  },
-  noResults: {
-    fontSize: 16,
-    color: "#888",
-    textAlign: "center",
-  },
-});

mobile/src/screens/SettingsScreen.tsx

@@ -1,91 +0,0 @@
-import { type ReactNode } from "react";
-import {
-  View,
-  Text,
-  TouchableOpacity,
-  StyleSheet,
-  Alert,
-} from "react-native";
-import { useAuth } from "../context/AuthContext";
-
-export default function SettingsScreen(): ReactNode {
-  const { state, logout } = useAuth();
-
-  const handleLogout = () => {
-    Alert.alert("Logout", "Are you sure you want to sign out?", [
-      { text: "Cancel", style: "cancel" },
-      { text: "Sign Out", style: "destructive", onPress: logout },
-    ]);
-  };
-
-  return (
-    <View style={styles.container}>
-      <View style={styles.section}>
-        <Text style={styles.sectionTitle}>Account</Text>
-        <View style={styles.infoRow}>
-          <Text style={styles.label}>Username</Text>
-          <Text style={styles.value}>{state.user?.username ?? "—"}</Text>
-        </View>
-        <View style={styles.infoRow}>
-          <Text style={styles.label}>Email</Text>
-          <Text style={styles.value}>{state.user?.email ?? "—"}</Text>
-        </View>
-      </View>
-
-      <TouchableOpacity style={styles.logoutButton} onPress={handleLogout}>
-        <Text style={styles.logoutText}>Sign Out</Text>
-      </TouchableOpacity>
-    </View>
-  );
-}
-
-const styles = StyleSheet.create({
-  container: {
-    flex: 1,
-    backgroundColor: "#0f0f23",
-    padding: 16,
-  },
-  section: {
-    backgroundColor: "#1a1a2e",
-    borderRadius: 12,
-    padding: 16,
-    marginBottom: 24,
-    borderWidth: 1,
-    borderColor: "#333",
-  },
-  sectionTitle: {
-    fontSize: 18,
-    fontWeight: "600",
-    color: "#fff",
-    marginBottom: 16,
-  },
-  infoRow: {
-    flexDirection: "row",
-    justifyContent: "space-between",
-    paddingVertical: 12,
-    borderBottomWidth: 1,
-    borderBottomColor: "#333",
-  },
-  label: {
-    fontSize: 14,
-    color: "#888",
-  },
-  value: {
-    fontSize: 14,
-    color: "#fff",
-    fontWeight: "500",
-  },
-  logoutButton: {
-    backgroundColor: "rgba(255, 69, 58, 0.15)",
-    borderRadius: 8,
-    padding: 16,
-    alignItems: "center",
-    borderWidth: 1,
-    borderColor: "rgba(255, 69, 58, 0.3)",
-  },
-  logoutText: {
-    color: "#ff453a",
-    fontSize: 16,
-    fontWeight: "600",
-  },
-});

mobile/src/types/index.ts

@@ -1,8 +0,0 @@
-// Mobile-specific type aliases and extensions not covered by shared types
-
-export type RootStackParamList = {
-  Auth: undefined;
-  Main: undefined;
-  BookReader: { bookId: number };
-  BookDetail: { bookId: number };
-};

mobile/tsconfig.json

@@ -1,20 +0,0 @@
-{
-  "compilerOptions": {
-    "target": "ES2022",
-    "lib": ["ES2023"],
-    "module": "ESNext",
-    "moduleResolution": "bundler",
-    "allowImportingTsExtensions": true,
-    "jsx": "react-jsx",
-    "strict": true,
-    "skipLibCheck": true,
-    "noEmit": true,
-    "forceConsistentCasingInFileNames": true,
-    "baseUrl": ".",
-    "paths": {
-      "@/*": ["src/*"]
-    }
-  },
-  "include": ["**/*.ts", "**/*.tsx"],
-  "exclude": ["node_modules"]
-}

package.json

@@ -3,16 +3,10 @@
   "version": "1.0.0",
   "private": true,
   "workspaces": [
-    "frontend",
+    "web"
-    "backend",
-    "mobile",
-    "packages/shared"
   ],
   "scripts": {
-    "dev:frontend": "yarn workspace @cloud-reader/frontend dev",
+    "dev": "yarn --cwd web dev",
-    "dev:backend": "cd backend && python manage.py runserver",
+    "build": "yarn --cwd web build"
-    "start:mobile": "yarn workspace @cloud-reader/mobile start",
-    "build:shared": "yarn workspace @cloud-reader/shared build",
-    "install:all": "yarn install"
   }
 }