fix: address PR #24 review comments - SpeechRecognition types, CSS hover over direct DOM, shared useDebounce

Merge branch 'main' into feature/mobile-search-discovery
Merge pull request 'Implement: US: Integrate Expo Mobile Application into Monorepo (#16 )' (#23 ) from feature/expo-integration into main
2026-05-29 05:10:06 +00:00 · 2026-05-29 04:50:59 +00:00 · 2026-05-29 04:50:49 +00:00 · 2026-05-29 04:25:37 +00:00 · 2026-05-29 02:55:50 +00:00 · 2026-05-29 02:50:09 +00:00
103 changed files with 4881 additions and 2482 deletions
@@ -1,38 +1,90 @@
 # Cloud Reader
-A full-stack cloud-based e-book reader application with cross-device synchronization.
+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.
 ## Architecture
- **Backend**: Django 5.x + Django REST Framework
+```
- **Frontend**: React with TypeScript
+cloud-reader/
- **Database**: PostgreSQL
+├── backend/         # Django REST API (canonical backend)
- **Monorepo**: Yarn workspaces
+│   ├── config/      # Django project settings
 │   ├── 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
 ```
-## Getting Started
+## Quick Start
-### Prerequisites
+### Docker (recommended)
- Python 3.12+
+```bash
- Node.js 20+
+docker compose up --build
- PostgreSQL 15+
+```
 - **Frontend:** http://localhost:5173
 - **Backend API:** http://localhost:8000/api/
-### Backend Setup
+### Backend (standalone)
 ```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 Setup
+### Frontend (standalone)
 ```bash
 cd frontend
 yarn install
 yarn dev
 ```
-## Projects
+### Mobile (Expo)
 ```bash
 # From monorepo root — installs all workspaces including mobile
 yarn install
-See [Gitea Issues](https://gitea-dev.codescripters.org/crisleo-hermes/cloud-reader/issues) for the full roadmap.
+# Start Expo dev server
 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.
@@ -1,20 +0,0 @@
 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"]
@@ -1,6 +0,0 @@
 from django.apps import AppConfig
 class BooksConfig(AppConfig):
    default_auto_field = "django.db.models.BigAutoField"
    name = "books"
@@ -1 +0,0 @@
 # management/__init__.py
@@ -1 +0,0 @@
 # management/commands/__init__.py
@@ -1,134 +0,0 @@
 """
 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."))
@@ -1,56 +0,0 @@
 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",
                    )
                ],
            },
        ),
    ]
@@ -1 +0,0 @@
 # migrations/__init__.py
@@ -1,111 +0,0 @@
 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}"
@@ -1,136 +0,0 @@
 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
@@ -1,15 +0,0 @@
 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"),
 ]
@@ -1,88 +0,0 @@
 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)
@@ -1,21 +0,0 @@
 #!/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()
@@ -1,109 +0,0 @@
 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/"
@@ -1,7 +0,0 @@
 from django.contrib import admin
 from django.urls import include, path
 urlpatterns = [
    path("admin/", admin.site.urls),
    path("api/", include("books.urls")),
 ]
@@ -1,6 +0,0 @@
 import os
 from django.core.wsgi import get_wsgi_application
 os.environ.setdefault("DJANGO_SETTINGS_MODULE", "project.settings")
 application = get_wsgi_application()
@@ -1,21 +0,0 @@
 [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*"]
@@ -1,290 +0,0 @@
 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" },
 ]
@@ -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 pyproject.toml ./
+COPY requirements.txt ./
-RUN pip install uv && uv sync --frozen
+RUN pip install --no-cache-dir -r requirements.txt
-COPY . .
+COPY . ./
 RUN mkdir -p media
@@ -0,0 +1,96 @@
 # 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')},
        ),
    ]
@@ -1,11 +1,36 @@
 from django.conf import settings
 from django.db import models
 from django.db.models.signals import post_delete
 from django.dispatch import receiver
 from pathlib import Path
 class ReadingStatus(models.TextChoices):
    WANT_TO_READ = "want_to_read", "Want to Read"
    READING = "reading", "Reading"
    FINISHED = "finished", "Finished"
    DNF = "dnf", "Did Not Finish"
 class FontStyle(models.TextChoices):
    SANS_SERIF = "sans-serif", "Sans Serif"
    SERIF = "serif", "Serif"
    MONOSPACE = "monospace", "Monospace"
 class BackgroundColor(models.TextChoices):
    WHITE = "#ffffff", "White"
    SEPIA = "#f4e4c1", "Sepia"
    DARK = "#1a1a2e", "Dark"
    GREEN = "#c7edcc", "Green"
 class Book(models.Model):
-    """Represents a book in the user's library."""
+    title = models.CharField(max_length=512, db_index=True)
-
+    author = models.CharField(max_length=256, blank=True, default="", db_index=True)
-    title = models.CharField(max_length=512)
+    genre = models.CharField(max_length=128, blank=True, default="", db_index=True)
-    author = models.CharField(max_length=256, blank=True, default="")
+    description = models.TextField(blank=True, default="")
    reading_status = models.CharField(max_length=20, choices=ReadingStatus.choices, default=ReadingStatus.WANT_TO_READ, db_index=True)
    total_pages = models.PositiveIntegerField(default=0)
    cover_image = models.URLField(blank=True, default="")
    created_at = models.DateTimeField(auto_now_add=True)
@@ -16,6 +41,69 @@ class Book(models.Model):
        verbose_name = "Book"
        verbose_name_plural = "Books"
        ordering = ["title"]
        indexes = [models.Index(fields=["title", "author", "genre"])]
-    def __str__(self) -> str:
+    def __str__(self):
        return self.title
 class EBook(models.Model):
    user = models.ForeignKey(settings.AUTH_USER_MODEL, on_delete=models.CASCADE, related_name="ebooks")
    title = models.CharField(max_length=512)
    author = models.CharField(max_length=256, blank=True, default="")
    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)
    updated_at = models.DateTimeField(auto_now=True)
    class Meta:
        db_table = "books_ebook"
        verbose_name = "E-Book"
        verbose_name_plural = "E-Books"
        ordering = ["-created_at"]
        indexes = [models.Index(fields=["user", "-created_at"])]
    def __str__(self):
        return self.title
    def filename(self):
        return Path(self.file.name).name if self.file else ""
@receiver(post_delete, sender=EBook)
 def _auto_delete_ebook_file(sender, instance, **kwargs):
    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")
    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)
    updated_at = models.DateTimeField(auto_now=True)
    class Meta:
        db_table = "books_reading_progress"
        verbose_name_plural = "reading progress"
        unique_together = [("user", "ebook")]
    def __str__(self):
        return f"{self.ebook.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_style = models.CharField(max_length=20, choices=FontStyle.choices, default=FontStyle.SANS_SERIF.value)
    background_color = models.CharField(max_length=7, choices=BackgroundColor.choices, default=BackgroundColor.WHITE.value)
    updated_at = models.DateTimeField(auto_now=True)
    class Meta:
        db_table = "books_reading_settings"
        verbose_name_plural = "reading settings"
    def __str__(self):
        return f"Settings for {self.user}"
@@ -1,28 +1,120 @@
 from rest_framework import serializers
-from apps.books.models import Book
+from apps.books.models import Book, EBook, FontStyle, BackgroundColor, ReadingProgress, ReadingSettings, ReadingStatus
 class BookSerializer(serializers.ModelSerializer):
    """Serialize Book data."""
    class Meta:
        model = Book
        fields = [
            "id",
            "title",
            "author",
            "total_pages",
            "cover_image",
            "created_at",
            "updated_at",
        ]
        read_only_fields = ["id", "created_at", "updated_at"]
 class BookListSerializer(serializers.ModelSerializer):
-    """Lightweight serializer for list views (excludes heavy fields)."""
+    reading_status_display = serializers.CharField(source="get_reading_status_display", read_only=True)
    class Meta:
        model = Book
-        fields = ["id", "title", "author", "total_pages", "cover_image"]
+        fields = ["id", "title", "author", "genre", "reading_status", "reading_status_display", "cover_image"]
 class BookDetailSerializer(serializers.ModelSerializer):
    reading_status_display = serializers.CharField(source="get_reading_status_display", read_only=True)
    class Meta:
        model = Book
        fields = ["id", "title", "author", "genre", "description", "reading_status", "reading_status_display", "cover_image", "total_pages", "created_at", "updated_at"]
        read_only_fields = ["id", "created_at", "updated_at"]
 class BookSerializer(serializers.ModelSerializer):
    class Meta:
        model = Book
        fields = ["id", "title", "author", "genre", "description", "reading_status", "cover_image", "total_pages", "created_at", "updated_at"]
        read_only_fields = ["id", "created_at", "updated_at"]
 class EBookListSerializer(serializers.ModelSerializer):
    filename = serializers.CharField(read_only=True)
    progress = serializers.SerializerMethodField()
    class Meta:
        model = EBook
        fields = ["id", "title", "author", "filename", "cover_image", "created_at", "progress"]
    def get_progress(self, obj):
        try:
            return obj.reading_progress.current_position
        except ReadingProgress.DoesNotExist:
            return None
 class EBookDetailSerializer(serializers.ModelSerializer):
    filename = 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"]
    def get_file_url(self, obj):
        request = self.context.get("request")
        if request and obj.file:
            return request.build_absolute_uri(obj.file.url)
        return ""
    def get_progress(self, obj):
        try:
            rp = obj.reading_progress
            return {"current_position": rp.current_position, "last_page": rp.last_page}
        except ReadingProgress.DoesNotExist:
            return None
 class EBookUploadSerializer(serializers.ModelSerializer):
    class Meta:
        model = EBook
        fields = ["title", "author", "file", "cover_image"]
        extra_kwargs = {"title": {"required": True}, "file": {"required": True}}
    def validate_file(self, value):
        import os
        if value is 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):
        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):
        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):
        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):
        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):
        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
@@ -0,0 +1,255 @@
 """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)
@@ -1,11 +1,16 @@
 from django.urls import include, path
 from rest_framework.routers import DefaultRouter
-from apps.books.views import BookViewSet
+from apps.books.views import BookViewSet, EBookViewSet, ReadingSettingsViewSet
 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"),
 ]
@@ -1,24 +1,240 @@
-from django_filters.rest_framework import DjangoFilterBackend
+from __future__ import annotations
 from rest_framework import viewsets
 from rest_framework.filters import OrderingFilter, SearchFilter
 from rest_framework.permissions import IsAuthenticated
-from apps.books.models import Book
+import logging
-from apps.books.serializers import BookListSerializer, BookSerializer
+from typing import Any
 from django.db.models import QuerySet, Q
 from django_filters.rest_framework import DjangoFilterBackend
 from rest_framework import parsers, permissions, status, viewsets
 from rest_framework.decorators import action
 from rest_framework.filters import OrderingFilter, SearchFilter
 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.serializers import (
    BookDetailSerializer, BookListSerializer, BookSerializer,
    BookChapterSerializer, EBookContentSerializer, EBookDetailSerializer,
    EBookListSerializer, EBookTocSerializer, EBookUploadSerializer,
    ReadingProgressSerializer, ReadingSettingsSerializer,
 )
 logger = logging.getLogger(__name__)
 class BookViewSet(viewsets.ModelViewSet):
    """CRUD for books."""
    queryset = Book.objects.all()
    permission_classes = [IsAuthenticated]
    filter_backends = [DjangoFilterBackend, SearchFilter, OrderingFilter]
-    filterset_fields = ["author"]
+    filterset_fields = ["author", "genre", "reading_status"]
-    search_fields = ["title", "author"]
+    search_fields = ["title", "author", "genre"]
-    ordering_fields = ["title", "author", "created_at"]
+    ordering_fields = ["title", "author", "genre", "created_at"]
    ordering = ["title"]
    def get_serializer_class(self):
        if self.action == "retrieve":
            return BookDetailSerializer
        if self.action == "list":
            return BookListSerializer
        return BookSerializer
    def get_queryset(self) -> QuerySet[Book]:
        qs = super().get_queryset()
        query = self.request.query_params.get("q", "").strip()
        if query:
            qs = qs.filter(Q(title__icontains=query) | Q(author__icontains=query) | Q(genre__icontains=query))
        return qs
    @action(detail=False, methods=["get"], permission_classes=[AllowAny])
    def genres(self, request: Request) -> Response:
        genre_list = Book.objects.values_list("genre", flat=True).distinct().order_by("genre")
        return Response([g for g in genre_list if g])
    @action(detail=False, methods=["get"], permission_classes=[AllowAny])
    def authors(self, request: Request) -> Response:
        author_list = Book.objects.values_list("author", flat=True).distinct().order_by("author")
        return Response([a for a in author_list if a])
 class IsEBookOwner(permissions.BasePermission):
    def has_object_permission(self, request: Request, view: object, obj: EBook) -> bool:
        return obj.user == request.user
 class EBookViewSet(viewsets.ModelViewSet):
    parser_classes = [parsers.MultiPartParser, parsers.FormParser, parsers.JSONParser]
    permission_classes = [IsAuthenticated, IsEBookOwner]
    def get_serializer_class(self):
        if self.action == "create":
            return EBookUploadSerializer
        if self.action in ("list",):
            return EBookListSerializer
        if self.action in ("toc",):
            return BookChapterSerializer
        return EBookDetailSerializer
    def get_queryset(self):
        return EBook.objects.filter(user=self.request.user).select_related("reading_progress", "user")
    @action(detail=True, methods=["get", "patch"])
    def progress(self, request: Request, pk: int | None = None) -> Response:
        ebook = self.get_object()
        progress_obj, _created = ReadingProgress.objects.get_or_create(user=request.user, ebook=ebook)
        if request.method == "GET":
            serializer = ReadingProgressSerializer(progress_obj)
            return Response(serializer.data)
        serializer = ReadingProgressSerializer(progress_obj, data=request.data, partial=True)
        serializer.is_valid(raise_exception=True)
        serializer.save()
        return Response(serializer.data)
    @action(detail=True, methods=["post"])
    def process(self, request: Request, pk: int | None = None) -> Response:
        """Trigger e-book processing: metadata extraction, TOC building, page counting."""
        ebook = self.get_object()
        if not ebook.file:
            return Response({"error": "No file found for this e-book."}, status=status.HTTP_400_BAD_REQUEST)
        try:
            from apps.books.services import process_ebook
            file_path = ebook.file.path
            result = process_ebook(file_path, original_filename=ebook.filename())
            # Update ebook with extracted data
            ebook.format = result.get("format", ebook.format)
            ebook.page_count = result.get("page_count", 0)
            ebook.metadata_json = result.get("metadata", {})
            ebook.save(update_fields=["format", "page_count", "metadata_json", "updated_at"])
            # Store chapters in DB
            raw_toc: list[dict[str, Any]] = result.get("toc", [])
            BookChapter.objects.filter(ebook=ebook).delete()
            _store_chapters(ebook, raw_toc)
            return Response({
                "format": ebook.format,
                "page_count": ebook.page_count,
                "metadata": ebook.metadata_json,
                "toc_count": len(raw_toc),
                "status": "processed",
            })
        except Exception as exc:
            logger.exception("Failed to process ebook %s", ebook.id)
            return Response({"error": f"Processing failed: {exc}"}, status=status.HTTP_500_INTERNAL_SERVER_ERROR)
    @action(detail=True, methods=["get"])
    def toc(self, request: Request, pk: int | None = None) -> Response:
        """Return hierarchical table of contents."""
        ebook = self.get_object()
        chapters = BookChapter.objects.filter(ebook=ebook).order_by("index").select_related("ebook")
        serializer = BookChapterSerializer(chapters, many=True)
        return Response({
            "chapters": serializer.data,
            "format": ebook.format,
            "page_count": ebook.page_count,
        })
    @action(detail=True, methods=["get"])
    def content(self, request: Request, pk: int | None = None) -> Response:
        """Return paginated content for a given page number.
        Query params:
            page (int): page/chapter index to fetch (1-indexed, default: 1)
        """
        ebook = self.get_object()
        page = max(1, int(request.query_params.get("page", 1)))
        chapters = list(BookChapter.objects.filter(ebook=ebook).order_by("index").select_related("ebook"))
        total_pages = len(chapters) or ebook.page_count or 1
        chapter: BookChapter | None = None
        chapter_title = ""
        content_html = ""
        if chapters and 0 <= page - 1 < len(chapters):
            ch = chapters[page - 1]
            chapter_title = ch.title
            content_html = _fetch_chapter_content(ebook, ch)
        serializer = EBookContentSerializer(data={
            "page": page,
            "total_pages": total_pages,
            "content": content_html,
            "chapter_title": chapter_title,
            "format": ebook.format,
        })
        serializer.is_valid(raise_exception=True)
        return Response(serializer.data)
 def _store_chapters(ebook: EBook, toc: list[dict[str, Any]], parent_index: int = 0) -> None:
    """Recursively store TOC entries as BookChapter records."""
    for idx, entry in enumerate(toc):
        BookChapter.objects.create(
            ebook=ebook,
            title=entry.get("title", "Untitled"),
            index=parent_index + idx,
            href=entry.get("href", ""),
            children=entry.get("children", []),
        )
        children = entry.get("children", [])
        if children:
            _store_chapters(ebook, children, parent_index + idx + 1)
 def _fetch_chapter_content(ebook: EBook, chapter: BookChapter) -> str:
    """Fetch HTML content for a chapter from the e-book file."""
    if ebook.format == "epub":
        return _fetch_epub_chapter_content(ebook.file.path, chapter)
    return ""
 def _fetch_epub_chapter_content(file_path: str, chapter: BookChapter) -> str:
    """Extract HTML content of a specific EPUB chapter by href."""
    try:
        from ebooklib import epub
        from bs4 import BeautifulSoup
    except ImportError:
        return ""
    try:
        book = epub.read_epub(file_path)
        href = chapter.href or ""
        # Find the item by href
        for item in book.get_items():
            item_name = item.get_name() or ""
            if href and (item_name.endswith(href) or href.endswith(item_name)):
                content = item.get_content()
                soup = BeautifulSoup(content, "html.parser")
                # Clean up — remove body/html/head wrappers, keep inner content
                body = soup.find("body")
                if body:
                    return str(body)
                return str(soup)
        return ""
    except Exception:
        logger.exception("Failed to fetch EPUB chapter content for %s", chapter.href)
        return ""
 class ReadingSettingsViewSet(viewsets.GenericViewSet):
    permission_classes = [IsAuthenticated]
    serializer_class = ReadingSettingsSerializer
    def get_queryset(self):
        return ReadingSettings.objects.filter(user=self.request.user)
    def list(self, request: Request) -> Response:
        settings_obj, _created = ReadingSettings.objects.get_or_create(user=request.user)
        serializer = self.get_serializer(settings_obj)
        return Response(serializer.data)
    def partial_update(self, request: Request) -> Response:
        settings_obj, _created = ReadingSettings.objects.get_or_create(user=request.user)
        serializer = self.get_serializer(settings_obj, data=request.data, partial=True)
        serializer.is_valid(raise_exception=True)
        serializer.save()
        return Response(serializer.data)
@@ -140,13 +140,17 @@ USE_I18N = True
 USE_TZ = True
 # ---------------------------------------------------------------------------
-# Static / Media
+# Static / Media / Uploads
 # ---------------------------------------------------------------------------
 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
 # ---------------------------------------------------------------------------
@@ -8,6 +8,7 @@ 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
@@ -5,48 +5,54 @@ services:
    volumes:
      - postgres_data:/var/lib/postgresql/data
    environment:
-      POSTGRES_DB: cloudreader
+      POSTGRES_DB: cloud_reader
-      POSTGRES_USER: cloudreader
+      POSTGRES_USER: postgres
-      POSTGRES_PASSWORD: cloudreader
+      POSTGRES_PASSWORD: postgres
    ports:
      - "5432:5432"
    healthcheck:
-      test: ["CMD-SHELL", "pg_isready -U cloudreader -d cloudreader"]
+      test: ["CMD-SHELL", "pg_isready -U postgres -d cloud_reader"]
      interval: 5s
      timeout: 5s
      retries: 10
-  api:
+  backend:
    build:
-      context: ./api
+      context: ./backend
      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:
-      - ./api:/app
+      - ./backend:/app
-      - book_uploads:/app/media
+      - book_media:/app/media
    command: >
      sh -c "python manage.py migrate && python manage.py runserver 0.0.0.0:8000"
    depends_on:
      db:
        condition: service_healthy
-  web:
+  frontend:
    build:
-      context: ./web
+      context: ./frontend
      dockerfile: Dockerfile
    ports:
-      - "3000:3000"
+      - "5173:5173"
    environment:
      VITE_API_URL: "http://localhost:8000"
    volumes:
-      - ./web:/app
+      - ./frontend:/app
      - /app/node_modules
    depends_on:
-      - api
+      - backend
 volumes:
  postgres_data:
-  book_uploads:
+  book_media:
@@ -0,0 +1,96 @@
 # 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)
@@ -0,0 +1,107 @@
 # 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)
@@ -0,0 +1,99 @@
 # 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
@@ -0,0 +1,12 @@
 FROM node:20-alpine
 WORKDIR /app
 COPY package.json yarn.lock ./
 RUN yarn install --frozen-lockfile
 COPY . ./
 EXPOSE 5173
 CMD ["yarn", "dev", "--host"]
@@ -0,0 +1,58 @@
 import React, { lazy, Suspense, useState } from "react";
 import { BrowserRouter, Navigate, Route, Routes } from "react-router-dom";
 import { AuthProvider, useAuth } from "./context/AuthContext";
 const LibraryPage = lazy(() => import("./pages/Library").then((m) => ({ default: m.LibraryPage })));
 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 SettingsPage = lazy(() => import("./pages/Settings").then((m) => ({ default: m.SettingsPage })));
 const BookmarksNotesPage = lazy(() => import("./components/annotations/BookmarksNotesPage").then((m) => ({ default: m.BookmarksNotesPage })));
 const AuthPage = lazy(() =>
  import("./pages/AuthPage").then((m) => ({
    default: () => {
      const [isLogin, setIsLogin] = useState(true);
      return isLogin ? <m.LoginPage onToggle={() => setIsLogin(false)} /> : <m.RegisterPage onToggle={() => setIsLogin(true)} />;
    },
  })),
 );
 function LoadingFallback() {
  return <div style={{ display: "flex", justifyContent: "center", alignItems: "center", minHeight: "100vh", color: "#888", fontSize: 16 }}><p>Loading...</p></div>;
 }
 function ProtectedRoute({ children }: { children: React.ReactNode }) {
  const { isAuthenticated, loading } = useAuth();
  if (loading) return <LoadingFallback />;
  if (!isAuthenticated) return <Navigate to="/auth" replace />;
  return <>{children}</>;
 }
 function AppRoutes() {
  const { isAuthenticated } = useAuth();
  return (
    <Suspense fallback={<LoadingFallback />}>
      <Routes>
        <Route path="/auth" element={isAuthenticated ? <Navigate to="/" replace /> : <AuthPage />} />
        <Route path="/" element={<ProtectedRoute><LibraryPage /></ProtectedRoute>} />
        <Route path="/books/:id" element={<ProtectedRoute><BookDetailPage /></ProtectedRoute>} />
        <Route path="/reader/:id" element={<ProtectedRoute><ReaderPage /></ProtectedRoute>} />
        <Route path="/add" element={<ProtectedRoute><AddBookPage /></ProtectedRoute>} />
        <Route path="/settings" element={<ProtectedRoute><SettingsPage /></ProtectedRoute>} />
        <Route path="/bookmarks-notes/:bookId?" element={<ProtectedRoute><BookmarksNotesPage /></ProtectedRoute>} />
        <Route path="*" element={<Navigate to="/" replace />} />
      </Routes>
    </Suspense>
  );
 }
 export default function App() {
  return (
    <BrowserRouter>
      <AuthProvider>
        <AppRoutes />
      </AuthProvider>
    </BrowserRouter>
  );
 }
@@ -0,0 +1,121 @@
 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;
  },
 };
@@ -0,0 +1,65 @@
 .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;
 }
@@ -0,0 +1,120 @@
 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>
  );
 }
@@ -0,0 +1,63 @@
 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;
 }
@@ -1 +1,4 @@
 export { usePaginatedQuery } from "./usePaginatedQuery";
 export { useDebounce } from "./useDebounce";
 export { useVoiceSearch } from "./useVoiceSearch";
 export { useMediaQuery } from "./useMediaQuery";
@@ -0,0 +1,18 @@
 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;
 }
@@ -0,0 +1,26 @@
 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;
@@ -0,0 +1,105 @@
 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,
  };
 }
@@ -0,0 +1,57 @@
 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>
  );
 }
@@ -0,0 +1,57 @@
 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} />; }
@@ -0,0 +1,208 @@
 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>
  );
 }
@@ -0,0 +1,13 @@
 .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);
 }
@@ -0,0 +1,545 @@
 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>
  );
 }
@@ -0,0 +1,64 @@
 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>
  );
 }
@@ -0,0 +1,80 @@
 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>
  );
 }
@@ -0,0 +1,102 @@
 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" },
 ];
@@ -0,0 +1,54 @@
 /**
 * 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;
 }
@@ -0,0 +1,16 @@
 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>
  );
 }
@@ -0,0 +1,28 @@
 {
  "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"
    ]
  }
 }
@@ -0,0 +1,7 @@
 module.exports = function (api) {
  api.cache(true);
  return {
    presets: ["babel-preset-expo"],
    plugins: ["react-native-reanimated/plugin"],
  };
 };
@@ -0,0 +1,35 @@
 {
  "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"
  }
 }
@@ -0,0 +1,55 @@
 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(() => {});
 }
@@ -0,0 +1,31 @@
 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(() => {});
 }
@@ -0,0 +1,140 @@
 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;
@@ -0,0 +1,54 @@
 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,
    );
  },
 };
@@ -0,0 +1,4 @@
 export { apiClient, saveTokens, loadTokens, clearTokens } from "./client";
 export { booksApi } from "./books";
 export { ebooksApi } from "./ebooks";
 export { annotationsApi } from "./annotations";
@@ -0,0 +1,104 @@
 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;
 }
@@ -0,0 +1,2 @@
 export { useAuth } from "../context/AuthContext";
 export { useAsyncData } from "./useAsyncData";
@@ -0,0 +1,33 @@
 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 };
 }
@@ -0,0 +1,45 @@
 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>
  );
 }
@@ -0,0 +1,24 @@
 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>
  );
 }
@@ -0,0 +1,68 @@
 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>
  );
 }
@@ -0,0 +1,55 @@
 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>
  );
 }
@@ -0,0 +1,23 @@
 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 />;
 }
@@ -0,0 +1,181 @@
 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",
  },
 });
@@ -0,0 +1,173 @@
 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",
  },
 });
@@ -0,0 +1,212 @@
 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",
  },
 });
@@ -0,0 +1,130 @@
 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",
  },
 });
@@ -0,0 +1,91 @@
 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",
  },
 });
@@ -0,0 +1,8 @@
 // Mobile-specific type aliases and extensions not covered by shared types
 export type RootStackParamList = {
  Auth: undefined;
  Main: undefined;
  BookReader: { bookId: number };
  BookDetail: { bookId: number };
 };
@@ -0,0 +1,20 @@
 {
  "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"]
 }
@@ -3,10 +3,16 @@
  "version": "1.0.0",
  "private": true,
  "workspaces": [
-    "web"
+    "frontend",
    "backend",
    "mobile",
    "packages/shared"
  ],
  "scripts": {
-    "dev": "yarn --cwd web dev",
+    "dev:frontend": "yarn workspace @cloud-reader/frontend dev",
-    "build": "yarn --cwd web build"
+    "dev:backend": "cd backend && python manage.py runserver",
    "start:mobile": "yarn workspace @cloud-reader/mobile start",
    "build:shared": "yarn workspace @cloud-reader/shared build",
    "install:all": "yarn install"
  }
 }
@@ -0,0 +1,14 @@
 {
  "name": "@cloud-reader/shared",
  "version": "1.0.0",
  "private": true,
  "main": "src/index.ts",
  "types": "src/index.ts",
  "scripts": {
    "build": "tsc",
    "typecheck": "tsc --noEmit"
  },
  "dependencies": {
    "typescript": "~5.7.0"
  }
 }
@@ -0,0 +1,2 @@
 export * from "./types";
 export * from "./utils";
@@ -0,0 +1,218 @@
 /** Core domain types for Cloud Reader — shared across web and mobile */
 // ---- User & Auth ----
 export interface User {
  id: number;
  email: string;
  username: string;
 }
 export interface TokenResponse {
  access: string;
  refresh: string;
 }
 export interface LoginPayload {
  email: string;
  password: string;
 }
 export interface RegisterPayload {
  email: string;
  username: string;
  password: string;
  password2: string;
 }
 // ---- Books ----
 export interface Book {
  id: string;
  title: string;
  author: string;
  total_pages: number;
  cover_image: string;
  created_at: string;
  updated_at: string;
 }
 export interface BookSummary {
  id: string;
  title: string;
  author: string;
  total_pages: number;
  cover_image: string;
 }
 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 BookSearchParams {
  q?: string;
  genre?: string;
  author?: string;
  reading_status?: string;
  ordering?: string;
  page?: number;
  page_size?: number;
 }
 export const READING_STATUS_OPTIONS = [
  "to_read",
  "reading",
  "finished",
  "dnf",
 ] as const;
 // ---- E-Books ----
 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;
 }
 // ---- Bookmarks & Notes ----
 export interface Bookmark {
  id: string;
  book: string;
  book_title: string;
  page: number;
  location_text: string;
  created_at: string;
  updated_at: string;
 }
 export interface Note {
  id: string;
  book: string;
  book_title: string;
  page: number;
  location_text: string;
  content: string;
  created_at: string;
  updated_at: string;
 }
 export interface CreateBookmarkPayload {
  book: string;
  page: number;
  location_text?: string;
 }
 export interface CreateNotePayload {
  book: string;
  page: number;
  location_text?: string;
  content: string;
 }
 export interface UpdateNotePayload {
  content: string;
 }
 export type AnnotationKind = "bookmark" | "note";
 export interface AnnotationEntry {
  id: string;
  kind: AnnotationKind;
  book_title: string;
  book_id: string;
  page: number;
  location_text: string;
  content?: string;
  created_at: string;
  updated_at: string;
 }
 // ---- Generic API shapes ----
 export interface PaginatedResponse<T> {
  count: number;
  next: string | null;
  previous: string | null;
  results: T[];
 }
 export interface ApiError {
  detail?: string;
  [key: string]: unknown;
 }
@@ -0,0 +1,117 @@
 /** Shared utility functions for Cloud Reader */
 /**
 * Format an ISO date string to a human-readable date.
 */
 export function formatDate(iso: string): string {
  const date = new Date(iso);
  return date.toLocaleDateString("en-US", {
    year: "numeric",
    month: "short",
    day: "numeric",
  });
 }
 /**
 * Format a date as a relative time string (e.g., "2h ago", "3d ago").
 */
 export function formatRelativeTime(iso: string): string {
  const now = Date.now();
  const then = new Date(iso).getTime();
  const diffMs = now - then;
  const seconds = Math.floor(diffMs / 1000);
  const minutes = Math.floor(seconds / 60);
  const hours = Math.floor(minutes / 60);
  const days = Math.floor(hours / 24);
  if (days > 0) return `${days}d ago`;
  if (hours > 0) return `${hours}h ago`;
  if (minutes > 0) return `${minutes}m ago`;
  return "just now";
 }
 /**
 * Validate an email address format.
 */
 export function isValidEmail(email: string): boolean {
  return /^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(email);
 }
 /**
 * Password strength check:
 * - At least 8 characters
 * - At least one uppercase letter
 * - At least one lowercase letter
 * - At least one digit
 */
 export function isStrongPassword(password: string): boolean {
  return (
    password.length >= 8 &&
    /[A-Z]/.test(password) &&
    /[a-z]/.test(password) &&
    /\d/.test(password)
  );
 }
 /**
 * Check if two passwords match.
 */
 export function doPasswordsMatch(password: string, confirm: string): boolean {
  return password === confirm;
 }
 /**
 * Get a user-friendly reading status label.
 */
 export function readingStatusLabel(status: string): string {
  const labels: Record<string, string> = {
    to_read: "To Read",
    reading: "Reading",
    finished: "Finished",
    dnf: "Did Not Finish",
  };
  return labels[status] ?? status;
 }
 /**
 * Format file size in bytes to a human-readable string.
 */
 export function formatFileSize(bytes: number): string {
  if (bytes < 1024) return `${bytes} B`;
  if (bytes < 1024 * 1024) return `${(bytes / 1024).toFixed(1)} KB`;
  return `${(bytes / (1024 * 1024)).toFixed(1)} MB`;
 }
 // ---- API endpoint constants ----
 export const API_ENDPOINTS = {
  auth: {
    login: "/api/auth/login/",
    register: "/api/auth/register/",
    tokenRefresh: "/api/auth/token/refresh/",
    profile: "/api/auth/profile/",
  },
  books: {
    list: "/api/books/",
    detail: (id: number | string) => `/api/books/${id}/`,
    genres: "/api/books/genres/",
    authors: "/api/books/authors/",
  },
  ebooks: {
    list: "/api/ebooks/",
    detail: (id: number) => `/api/ebooks/${id}/`,
    upload: "/api/ebooks/upload/",
    toc: (id: number) => `/api/ebooks/${id}/toc/`,
    content: (id: number, page: number) =>
      `/api/ebooks/${id}/content/?page=${page}`,
    progress: (id: number) => `/api/ebooks/${id}/progress/`,
    settings: (id: number) => `/api/ebooks/${id}/settings/`,
  },
  annotations: {
    list: "/api/annotations/",
    bookmarks: "/api/annotations/bookmarks/",
    notes: "/api/annotations/notes/",
    bookmarkDetail: (id: string) => `/api/annotations/bookmarks/${id}/`,
    noteDetail: (id: string) => `/api/annotations/notes/${id}/`,
  },
 } as const;
@@ -0,0 +1,19 @@
 {
  "compilerOptions": {
    "target": "ES2020",
    "module": "ESNext",
    "moduleResolution": "bundler",
    "declaration": true,
    "declarationMap": true,
    "sourceMap": true,
    "outDir": "./dist",
    "rootDir": "./src",
    "strict": true,
    "esModuleInterop": true,
    "skipLibCheck": true,
    "forceConsistentCasingInFileNames": true,
    "resolveJsonModule": true,
    "isolatedModules": true
  },
  "include": ["src/**/*"]
 }
@@ -1,16 +0,0 @@
 <!DOCTYPE html>
 <html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Cloud Reader</title>
    <style>
      * { margin: 0; padding: 0; box-sizing: border-box; }
      body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; }
    </style>
  </head>
  <body>
    <div id="root"></div>
    <script type="module" src="/src/main.tsx"></script>
  </body>
 </html>
@@ -1,23 +0,0 @@
 {
  "name": "web",
  "version": "1.0.0",
  "private": true,
  "type": "module",
  "scripts": {
    "dev": "vite",
    "build": "tsc -b && vite build",
    "preview": "vite preview"
  },
  "dependencies": {
    "react": "^19.0.0",
    "react-dom": "^19.0.0",
    "react-router-dom": "^7.0.0"
  },
  "devDependencies": {
    "@types/react": "^19.0.0",
    "@types/react-dom": "^19.0.0",
    "@vitejs/plugin-react": "^4.3.0",
    "typescript": "^5.6.0",
    "vite": "^6.0.0"
  }
 }
@@ -1,515 +0,0 @@
 /* ============================================================
   Cloud Reader — Book Search & Discovery Styles
   ============================================================ */
 /* --- Reset & Base --- */
 *,
 *::before,
 *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
 }
 :root {
  --color-bg: #0f1117;
  --color-surface: #1a1d27;
  --color-surface-hover: #242736;
  --color-border: #2a2d3a;
  --color-text: #e1e4ed;
  --color-text-secondary: #8b8fa3;
  --color-primary: #6c8cff;
  --color-primary-hover: #8ba3ff;
  --color-accent-green: #34d399;
  --color-accent-yellow: #fbbf24;
  --color-accent-blue: #60a5fa;
  --color-accent-gray: #6b7280;
  --radius: 8px;
  --radius-lg: 12px;
  --shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
 }
 body {
  font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
    sans-serif;
  background: var(--color-bg);
  color: var(--color-text);
  line-height: 1.6;
  min-height: 100vh;
 }
 .app {
  max-width: 960px;
  margin: 0 auto;
  padding: 24px 16px;
 }
 /* --- Library Header --- */
 .library-header {
  margin-bottom: 24px;
 }
 .library-header h1 {
  font-size: 1.75rem;
  font-weight: 700;
  color: var(--color-text);
  margin-bottom: 4px;
 }
 .library-header p {
  color: var(--color-text-secondary);
  font-size: 0.95rem;
 }
 /* --- Search Bar --- */
 .search-bar {
  position: relative;
  margin-bottom: 16px;
 }
 .search-icon {
  position: absolute;
  left: 14px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--color-text-secondary);
  pointer-events: none;
 }
 .search-input {
  width: 100%;
  padding: 12px 16px 12px 44px;
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  color: var(--color-text);
  font-size: 1rem;
  font-family: inherit;
  outline: none;
  transition: border-color 0.2s;
 }
 .search-input:focus {
  border-color: var(--color-primary);
 }
 .search-input::placeholder {
  color: var(--color-text-secondary);
 }
 /* --- Filters --- */
 .book-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-bottom: 20px;
  align-items: flex-end;
 }
 .filter-group {
  display: flex;
  flex-direction: column;
  gap: 4px;
 }
 .filter-group label {
  font-size: 0.8rem;
  font-weight: 600;
  color: var(--color-text-secondary);
  text-transform: uppercase;
  letter-spacing: 0.04em;
 }
 .filter-group select {
  padding: 8px 12px;
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius);
  color: var(--color-text);
  font-size: 0.9rem;
  font-family: inherit;
  outline: none;
  cursor: pointer;
  min-width: 140px;
 }
 .filter-group select:focus {
  border-color: var(--color-primary);
 }
 .clear-filters-btn {
  padding: 8px 16px;
  background: transparent;
  border: 1px solid var(--color-border);
  border-radius: var(--radius);
  color: var(--color-text-secondary);
  font-size: 0.85rem;
  cursor: pointer;
  transition: all 0.2s;
 }
 .clear-filters-btn:hover {
  border-color: var(--color-primary);
  color: var(--color-primary);
 }
 /* --- Book Grid --- */
 .book-list {
  margin-top: 8px;
 }
 .result-count {
  color: var(--color-text-secondary);
  font-size: 0.9rem;
  margin-bottom: 12px;
 }
 .book-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 12px;
 }
 .book-card {
  display: flex;
  gap: 14px;
  padding: 14px;
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  cursor: pointer;
  text-align: left;
  color: inherit;
  font-family: inherit;
  transition: all 0.2s;
  width: 100%;
 }
 .book-card:hover {
  background: var(--color-surface-hover);
  border-color: var(--color-primary);
  transform: translateY(-1px);
  box-shadow: var(--shadow);
 }
 .book-card-cover {
  flex-shrink: 0;
  width: 60px;
  height: 90px;
  border-radius: 4px;
  overflow: hidden;
  background: var(--color-bg);
  display: flex;
  align-items: center;
  justify-content: center;
 }
 .book-card-cover img {
  width: 100%;
  height: 100%;
  object-fit: cover;
 }
 .cover-placeholder {
  color: var(--color-text-secondary);
  opacity: 0.5;
  display: flex;
  align-items: center;
  justify-content: center;
 }
 .book-card-info {
  flex: 1;
  min-width: 0;
 }
 .book-card-title {
  font-size: 1rem;
  font-weight: 600;
  margin-bottom: 2px;
  line-height: 1.3;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
 }
 .book-card-author {
  font-size: 0.85rem;
  color: var(--color-text-secondary);
  margin-bottom: 4px;
 }
 .book-card-genre {
  font-size: 0.8rem;
  color: var(--color-primary);
  margin-bottom: 6px;
 }
 /* --- Status Badges --- */
 .status-badge {
  display: inline-block;
  font-size: 0.75rem;
  font-weight: 600;
  padding: 2px 8px;
  border-radius: 100px;
  text-transform: capitalize;
 }
 .status-want_to_read {
  background: rgba(96, 165, 250, 0.15);
  color: var(--color-accent-blue);
 }
 .status-reading {
  background: rgba(52, 211, 153, 0.15);
  color: var(--color-accent-green);
 }
 .status-finished {
  background: rgba(107, 114, 128, 0.15);
  color: var(--color-accent-gray);
 }
 .status-dnf {
  background: rgba(251, 191, 36, 0.15);
  color: var(--color-accent-yellow);
 }
 /* --- Empty State --- */
 .empty-state {
  text-align: center;
  padding: 48px 24px;
  color: var(--color-text-secondary);
 }
 .empty-state svg {
  margin-bottom: 16px;
  opacity: 0.4;
 }
 .empty-state h3 {
  font-size: 1.2rem;
  color: var(--color-text);
  margin-bottom: 8px;
 }
 .empty-state p {
  max-width: 360px;
  margin: 0 auto;
  line-height: 1.5;
 }
 /* --- Loading --- */
 .loading-spinner {
  text-align: center;
  padding: 48px 24px;
  color: var(--color-text-secondary);
 }
 .spinner {
  width: 32px;
  height: 32px;
  border: 3px solid var(--color-border);
  border-top-color: var(--color-primary);
  border-radius: 50%;
  animation: spin 0.7s linear infinite;
  margin: 0 auto 12px;
 }
@keyframes spin {
  to {
    transform: rotate(360deg);
  }
 }
 /* --- Pagination --- */
 .pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  margin-top: 24px;
  padding-top: 16px;
  border-top: 1px solid var(--color-border);
 }
 .pagination-btn {
  padding: 8px 18px;
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius);
  color: var(--color-text);
  font-size: 0.9rem;
  cursor: pointer;
  transition: all 0.2s;
  font-family: inherit;
 }
 .pagination-btn:hover:not(:disabled) {
  border-color: var(--color-primary);
  color: var(--color-primary);
 }
 .pagination-btn:disabled {
  opacity: 0.4;
  cursor: not-allowed;
 }
 .page-indicator {
  font-size: 0.9rem;
  color: var(--color-text-secondary);
 }
 /* --- Book Detail --- */
 .book-detail {
  max-width: 720px;
  margin: 0 auto;
 }
 .back-button {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 14px;
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius);
  color: var(--color-text-secondary);
  font-size: 0.9rem;
  cursor: pointer;
  margin-bottom: 24px;
  transition: all 0.2s;
  font-family: inherit;
 }
 .back-button:hover {
  border-color: var(--color-primary);
  color: var(--color-primary);
 }
 .book-detail-content {
  display: flex;
  gap: 28px;
 }
 .book-detail-cover {
  flex-shrink: 0;
  width: 180px;
  border-radius: var(--radius);
  overflow: hidden;
  background: var(--color-surface);
 }
 .book-detail-cover img {
  width: 100%;
  display: block;
 }
 .cover-placeholder.large {
  width: 180px;
  height: 270px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--color-text-secondary);
  opacity: 0.3;
 }
 .book-detail-info {
  flex: 1;
 }
 .book-detail-title {
  font-size: 1.6rem;
  font-weight: 700;
  margin-bottom: 4px;
  line-height: 1.3;
 }
 .book-detail-author {
  font-size: 1.1rem;
  color: var(--color-text-secondary);
  margin-bottom: 8px;
 }
 .book-detail-genre {
  display: inline-block;
  font-size: 0.85rem;
  color: var(--color-primary);
  margin-bottom: 12px;
 }
 .book-detail-status {
  margin-bottom: 20px;
  font-size: 0.95rem;
  color: var(--color-text-secondary);
 }
 .book-detail-status .status-badge {
  margin-left: 6px;
 }
 .book-detail-description {
  margin-bottom: 20px;
 }
 .book-detail-description h2 {
  font-size: 1.1rem;
  font-weight: 600;
  margin-bottom: 8px;
 }
 .book-detail-description p {
  color: var(--color-text-secondary);
  line-height: 1.7;
 }
 .book-detail-meta {
  font-size: 0.85rem;
  color: var(--color-text-secondary);
  opacity: 0.7;
 }
 .book-detail-meta p {
  margin-bottom: 4px;
 }
 /* --- Error State --- */
 .error-state {
  text-align: center;
  padding: 48px 24px;
  color: #ef4444;
 }
 .error-state p {
  margin-bottom: 16px;
 }
 /* --- Responsive --- */
@media (max-width: 640px) {
  .book-grid {
    grid-template-columns: 1fr;
  }
  .book-detail-content {
    flex-direction: column;
  }
  .book-detail-cover {
    width: 140px;
  }
  .cover-placeholder.large {
    width: 140px;
    height: 210px;
  }
  .book-filters {
    flex-direction: column;
  }
  .filter-group select {
    width: 100%;
  }
 }
@@ -1,46 +0,0 @@
 /**
 * App — root component with simple page navigation (library ↔ book detail).
 */
 import { useState, lazy, Suspense } from "react";
 import "./App.css";
 const LibraryPage = lazy(() => import("./pages/LibraryPage"));
 const BookDetailPage = lazy(() => import("./pages/BookDetailPage"));
 type View =
  | { kind: "library" }
  | { kind: "detail"; bookId: number };
 function LoadingFallback() {
  return (
    <div className="loading-spinner">
      <div className="spinner" />
      <p>Loading...</p>
    </div>
  );
 }
 export default function App() {
  const [view, setView] = useState<View>({ kind: "library" });
  const handleBookSelect = (id: number) => {
    setView({ kind: "detail", bookId: id });
  };
  const handleBack = () => {
    setView({ kind: "library" });
  };
  return (
    <div className="app">
      <Suspense fallback={<LoadingFallback />}>
        {view.kind === "library" ? (
          <LibraryPage onBookSelect={handleBookSelect} />
        ) : (
          <BookDetailPage bookId={view.bookId} onBack={handleBack} />
        )}
      </Suspense>
    </div>
  );
 }
@@ -1,58 +0,0 @@
 /**
 * API client for the Cloud Reader backend.
 * All requests are proxied through Vite's dev server in development.
 */
 import type {
  BookDetail,
  BookSummary,
  PaginatedResponse,
  SearchParams,
 } from "../types";
 const API_BASE = "/api";
 function buildSearchQuery(params: SearchParams): string {
  const searchParams = new URLSearchParams();
  if (params.q) searchParams.set("q", params.q);
  if (params.genre) searchParams.set("genre", params.genre);
  if (params.author) searchParams.set("author", params.author);
  if (params.reading_status) searchParams.set("reading_status", params.reading_status);
  if (params.page && params.page > 1) searchParams.set("page", String(params.page));
  return searchParams.toString();
 }
 export async function searchBooks(
  params: SearchParams,
 ): Promise<PaginatedResponse<BookSummary>> {
  const query = buildSearchQuery(params);
  const response = await fetch(`${API_BASE}/books/?${query}`);
  if (!response.ok) {
    throw new Error(`Search failed: ${response.status} ${response.statusText}`);
  }
  return response.json() as Promise<PaginatedResponse<BookSummary>>;
 }
 export async function getBook(id: number): Promise<BookDetail> {
  const response = await fetch(`${API_BASE}/books/${id}/`);
  if (!response.ok) {
    throw new Error(`Failed to fetch book: ${response.status} ${response.statusText}`);
  }
  return response.json() as Promise<BookDetail>;
 }
 export async function getGenres(): Promise<string[]> {
  const response = await fetch(`${API_BASE}/books/genres/`);
  if (!response.ok) {
    throw new Error(`Failed to fetch genres: ${response.status}`);
  }
  return response.json() as Promise<string[]>;
 }
 export async function getAuthors(): Promise<string[]> {
  const response = await fetch(`${API_BASE}/books/authors/`);
  if (!response.ok) {
    throw new Error(`Failed to fetch authors: ${response.status}`);
  }
  return response.json() as Promise<string[]>;
 }
@@ -1,91 +0,0 @@
 /**
 * BookDetail component — full book information display.
 */
 import type { BookDetail as BookDetailType } from "../types";
 import { READING_STATUS_LABELS } from "../types";
 interface BookDetailProps {
  book: BookDetailType;
  onBack: () => void;
 }
 export default function BookDetail({ book, onBack }: BookDetailProps) {
  return (
    <div className="book-detail">
      <button
        type="button"
        className="back-button"
        onClick={onBack}
      >
        <svg
          width="20"
          height="20"
          viewBox="0 0 24 24"
          fill="none"
          stroke="currentColor"
          strokeWidth="2"
          strokeLinecap="round"
          strokeLinejoin="round"
        >
          <path d="m15 18-6-6 6-6" />
        </svg>
        Back to search
      </button>
      <div className="book-detail-content">
        <div className="book-detail-cover">
          {book.cover_url ? (
            <img src={book.cover_url} alt={`${book.title} cover`} />
          ) : (
            <div className="cover-placeholder large">
              <svg
                width="48"
                height="48"
                viewBox="0 0 24 24"
                fill="none"
                stroke="currentColor"
                strokeWidth="1.5"
                strokeLinecap="round"
                strokeLinejoin="round"
              >
                <path d="M4 19.5A2.5 2.5 0 0 1 6.5 17H20" />
                <path d="M6.5 2H20v20H6.5A2.5 2.5 0 0 1 4 19.5v-15A2.5 2.5 0 0 1 6.5 2z" />
              </svg>
            </div>
          )}
        </div>
        <div className="book-detail-info">
          <h1 className="book-detail-title">{book.title}</h1>
          <p className="book-detail-author">by {book.author}</p>
          <p className="book-detail-genre">{book.genre}</p>
          <p className="book-detail-status">
            Status:{" "}
            <span className={`status-badge status-${book.reading_status}`}>
              {READING_STATUS_LABELS[book.reading_status]}
            </span>
          </p>
          {book.description && (
            <div className="book-detail-description">
              <h2>Description</h2>
              <p>{book.description}</p>
            </div>
          )}
          <div className="book-detail-meta">
            <p>
              <strong>Added:</strong>{" "}
              {new Date(book.created_at).toLocaleDateString()}
            </p>
            <p>
              <strong>Updated:</strong>{" "}
              {new Date(book.updated_at).toLocaleDateString()}
            </p>
          </div>
        </div>
      </div>
    </div>
  );
 }
@@ -1,110 +0,0 @@
 /**
 * BookFilters component — dropdown filters for genre, author, and reading status.
 */
 import type { ReadingStatus } from "../types";
 import { READING_STATUS_LABELS } from "../types";
 interface BookFiltersProps {
  genres: string[];
  authors: string[];
  selectedGenre: string;
  selectedAuthor: string;
  selectedStatus: ReadingStatus | "";
  onGenreChange: (genre: string) => void;
  onAuthorChange: (author: string) => void;
  onStatusChange: (status: ReadingStatus | "") => void;
 }
 export default function BookFilters({
  genres,
  authors,
  selectedGenre,
  selectedAuthor,
  selectedStatus,
  onGenreChange,
  onAuthorChange,
  onStatusChange,
 }: BookFiltersProps) {
  const handleGenreChange = (e: React.ChangeEvent<HTMLSelectElement>) => {
    onGenreChange(e.target.value);
  };
  const handleAuthorChange = (e: React.ChangeEvent<HTMLSelectElement>) => {
    onAuthorChange(e.target.value);
  };
  const handleStatusChange = (e: React.ChangeEvent<HTMLSelectElement>) => {
    onStatusChange(e.target.value as ReadingStatus | "");
  };
  const handleClearFilters = () => {
    onGenreChange("");
    onAuthorChange("");
    onStatusChange("");
  };
  const hasActiveFilters = selectedGenre || selectedAuthor || selectedStatus;
  return (
    <div className="book-filters">
      <div className="filter-group">
        <label htmlFor="filter-genre">Genre</label>
        <select
          id="filter-genre"
          value={selectedGenre}
          onChange={handleGenreChange}
        >
          <option value="">All Genres</option>
          {genres.map((g) => (
            <option key={g} value={g}>
              {g}
            </option>
          ))}
        </select>
      </div>
      <div className="filter-group">
        <label htmlFor="filter-author">Author</label>
        <select
          id="filter-author"
          value={selectedAuthor}
          onChange={handleAuthorChange}
        >
          <option value="">All Authors</option>
          {authors.map((a) => (
            <option key={a} value={a}>
              {a}
            </option>
          ))}
        </select>
      </div>
      <div className="filter-group">
        <label htmlFor="filter-status">Status</label>
        <select
          id="filter-status"
          value={selectedStatus}
          onChange={handleStatusChange}
        >
          <option value="">All Statuses</option>
          {(Object.keys(READING_STATUS_LABELS) as ReadingStatus[]).map((s) => (
            <option key={s} value={s}>
              {READING_STATUS_LABELS[s]}
            </option>
          ))}
        </select>
      </div>
      {hasActiveFilters && (
        <button
          type="button"
          className="clear-filters-btn"
          onClick={handleClearFilters}
        >
          Clear Filters
        </button>
      )}
    </div>
  );
 }
@@ -1,111 +0,0 @@
 /**
 * BookList component — displays search results with click-to-detail navigation.
 */
 import type { BookSummary } from "../types";
 import { READING_STATUS_LABELS } from "../types";
 interface BookListProps {
  books: BookSummary[];
  isLoading: boolean;
  totalCount: number;
  onBookClick: (id: number) => void;
 }
 function StatusBadge({ status }: { status: BookSummary["reading_status"] }) {
  const className = `status-badge status-${status}`;
  return <span className={className}>{READING_STATUS_LABELS[status]}</span>;
 }
 function EmptyState() {
  return (
    <div className="empty-state">
      <svg
        width="48"
        height="48"
        viewBox="0 0 24 24"
        fill="none"
        stroke="currentColor"
        strokeWidth="1.5"
        strokeLinecap="round"
        strokeLinejoin="round"
      >
        <path d="M4 19.5A2.5 2.5 0 0 1 6.5 17H20" />
        <path d="M6.5 2H20v20H6.5A2.5 2.5 0 0 1 4 19.5v-15A2.5 2.5 0 0 1 6.5 2z" />
        <line x1="8" y1="7" x2="16" y2="7" />
        <line x1="8" y1="11" x2="14" y2="11" />
      </svg>
      <h3>No books found</h3>
      <p>
        Try adjusting your search query or filters to find what you're looking
        for.
      </p>
    </div>
  );
 }
 function LoadingSpinner() {
  return (
    <div className="loading-spinner">
      <div className="spinner" />
      <p>Searching books...</p>
    </div>
  );
 }
 export default function BookList({
  books,
  isLoading,
  totalCount,
  onBookClick,
 }: BookListProps) {
  if (isLoading) return <LoadingSpinner />;
  if (totalCount === 0) return <EmptyState />;
  return (
    <div className="book-list">
      <p className="result-count">
        {totalCount} book{totalCount !== 1 ? "s" : ""} found
      </p>
      <div className="book-grid">
        {books.map((book) => (
          <button
            key={book.id}
            type="button"
            className="book-card"
            onClick={() => onBookClick(book.id)}
          >
            <div className="book-card-cover">
              {book.cover_url ? (
                <img src={book.cover_url} alt={`${book.title} cover`} />
              ) : (
                <div className="cover-placeholder">
                  <svg
                    width="32"
                    height="32"
                    viewBox="0 0 24 24"
                    fill="none"
                    stroke="currentColor"
                    strokeWidth="1.5"
                    strokeLinecap="round"
                    strokeLinejoin="round"
                  >
                    <path d="M4 19.5A2.5 2.5 0 0 1 6.5 17H20" />
                    <path d="M6.5 2H20v20H6.5A2.5 2.5 0 0 1 4 19.5v-15A2.5 2.5 0 0 1 6.5 2z" />
                  </svg>
                </div>
              )}
            </div>
            <div className="book-card-info">
              <h3 className="book-card-title">{book.title}</h3>
              <p className="book-card-author">{book.author}</p>
              <p className="book-card-genre">{book.genre}</p>
              <StatusBadge status={book.reading_status} />
            </div>
          </button>
        ))}
      </div>
    </div>
  );
 }
@@ -1,57 +0,0 @@
 /**
 * SearchBar component — real-time text input for search queries.
 */
 import { useCallback, useRef } from "react";
 interface SearchBarProps {
  value: string;
  onChange: (value: string) => void;
  placeholder?: string;
 }
 export default function SearchBar({
  value,
  onChange,
  placeholder = "Search by title, author, or genre...",
 }: SearchBarProps) {
  const debounceRef = useRef<ReturnType<typeof setTimeout> | null>(null);
  const handleChange = useCallback(
    (e: React.ChangeEvent<HTMLInputElement>) => {
      const newValue = e.target.value;
      if (debounceRef.current) clearTimeout(debounceRef.current);
      debounceRef.current = setTimeout(() => {
        onChange(newValue);
      }, 300);
    },
    [onChange],
  );
  return (
    <div className="search-bar">
      <svg
        className="search-icon"
        width="20"
        height="20"
        viewBox="0 0 24 24"
        fill="none"
        stroke="currentColor"
        strokeWidth="2"
        strokeLinecap="round"
        strokeLinejoin="round"
      >
        <circle cx="11" cy="11" r="8" />
        <path d="m21 21-4.35-4.35" />
      </svg>
      <input
        type="text"
        defaultValue={value}
        onChange={handleChange}
        placeholder={placeholder}
        className="search-input"
        aria-label="Search books"
      />
    </div>
  );
 }
@@ -1,12 +0,0 @@
 import React from "react";
 import ReactDOM from "react-dom/client";
 import App from "./App";
 const rootElement = document.getElementById("root");
 if (!rootElement) throw new Error("Root element not found");
 ReactDOM.createRoot(rootElement).render(
  <React.StrictMode>
    <App />
  </React.StrictMode>,
 );
@@ -1,63 +0,0 @@
 /**
 * BookDetailPage — fetches and displays a single book's details.
 */
 import { useEffect, useState } from "react";
 import { getBook } from "../api/books";
 import type { BookDetail as BookDetailType } from "../types";
 import BookDetailComponent from "../components/BookDetail";
 interface BookDetailPageProps {
  bookId: number;
  onBack: () => void;
 }
 export default function BookDetailPage({ bookId, onBack }: BookDetailPageProps) {
  const [book, setBook] = useState<BookDetailType | null>(null);
  const [isLoading, setIsLoading] = useState(true);
  const [error, setError] = useState<string | null>(null);
  useEffect(() => {
    setIsLoading(true);
    setError(null);
    getBook(bookId)
      .then(setBook)
      .catch((err: unknown) => {
        setError(err instanceof Error ? err.message : "Failed to load book");
      })
      .finally(() => setIsLoading(false));
  }, [bookId]);
  if (isLoading) {
    return (
      <div className="loading-spinner">
        <div className="spinner" />
        <p>Loading book details...</p>
      </div>
    );
  }
  if (error) {
    return (
      <div className="error-state">
        <p>{error}</p>
        <button type="button" className="back-button" onClick={onBack}>
          Back to library
        </button>
      </div>
    );
  }
  if (!book) {
    return (
      <div className="error-state">
        <p>Book not found.</p>
        <button type="button" className="back-button" onClick={onBack}>
          Back to library
        </button>
      </div>
    );
  }
  return <BookDetailComponent book={book} onBack={onBack} />;
 }
@@ -1,147 +0,0 @@
 /**
 * LibraryPage — main page for searching and discovering books.
 * Manages search state, filters, and pagination.
 */
 import { useCallback, useEffect, useState } from "react";
 import { searchBooks, getGenres, getAuthors } from "../api/books";
 import type { BookSummary, ReadingStatus } from "../types";
 import SearchBar from "../components/SearchBar";
 import BookFilters from "../components/BookFilters";
 import BookList from "../components/BookList";
 interface LibraryPageProps {
  onBookSelect: (id: number) => void;
 }
 export default function LibraryPage({ onBookSelect }: LibraryPageProps) {
  const [query, setQuery] = useState("");
  const [books, setBooks] = useState<BookSummary[]>([]);
  const [totalCount, setTotalCount] = useState(0);
  const [isLoading, setIsLoading] = useState(true);
  const [page, setPage] = useState(1);
  const [hasNext, setHasNext] = useState(false);
  const [hasPrev, setHasPrev] = useState(false);
  // Filter state
  const [genres, setGenres] = useState<string[]>([]);
  const [authors, setAuthors] = useState<string[]>([]);
  const [selectedGenre, setSelectedGenre] = useState("");
  const [selectedAuthor, setSelectedAuthor] = useState("");
  const [selectedStatus, setSelectedStatus] = useState<ReadingStatus | "">("");
  // Load filter options on mount
  useEffect(() => {
    getGenres().then(setGenres).catch(() => {});
    getAuthors().then(setAuthors).catch(() => {});
  }, []);
  // Perform search whenever any parameter changes
  const performSearch = useCallback(
    async (
      q: string,
      genre: string,
      author: string,
      status: ReadingStatus | "",
      pageNum: number,
    ) => {
      setIsLoading(true);
      try {
        const result = await searchBooks({
          q: q || undefined,
          genre: genre || undefined,
          author: author || undefined,
          reading_status: status || undefined,
          page: pageNum,
        });
        setBooks(result.results);
        setTotalCount(result.count);
        setHasNext(result.next !== null);
        setHasPrev(result.previous !== null);
      } catch {
        setBooks([]);
        setTotalCount(0);
      } finally {
        setIsLoading(false);
      }
    },
    [],
  );
  // Trigger search when state changes
  useEffect(() => {
    performSearch(query, selectedGenre, selectedAuthor, selectedStatus, page);
  }, [query, selectedGenre, selectedAuthor, selectedStatus, page, performSearch]);
  const handleSearchChange = useCallback((q: string) => {
    setQuery(q);
    setPage(1);
  }, []);
  const handleGenreChange = useCallback((genre: string) => {
    setSelectedGenre(genre);
    setPage(1);
  }, []);
  const handleAuthorChange = useCallback((author: string) => {
    setSelectedAuthor(author);
    setPage(1);
  }, []);
  const handleStatusChange = useCallback((status: ReadingStatus | "") => {
    setSelectedStatus(status);
    setPage(1);
  }, []);
  return (
    <div className="library-page">
      <header className="library-header">
        <h1>Book Library</h1>
        <p>Search and discover books in your collection</p>
      </header>
      <SearchBar value={query} onChange={handleSearchChange} />
      <BookFilters
        genres={genres}
        authors={authors}
        selectedGenre={selectedGenre}
        selectedAuthor={selectedAuthor}
        selectedStatus={selectedStatus}
        onGenreChange={handleGenreChange}
        onAuthorChange={handleAuthorChange}
        onStatusChange={handleStatusChange}
      />
      <BookList
        books={books}
        isLoading={isLoading}
        totalCount={totalCount}
        onBookClick={onBookSelect}
      />
      {/* Pagination */}
      {(hasPrev || hasNext) && (
        <div className="pagination">
          <button
            type="button"
            className="pagination-btn"
            disabled={!hasPrev || isLoading}
            onClick={() => setPage((p) => Math.max(1, p - 1))}
          >
            Previous
          </button>
          <span className="page-indicator">Page {page}</span>
          <button
            type="button"
            className="pagination-btn"
            disabled={!hasNext || isLoading}
            onClick={() => setPage((p) => p + 1)}
          >
            Next
          </button>
        </div>
      )}
    </div>
  );
 }
@@ -1,52 +0,0 @@
 /** Shared TypeScript interfaces for the Cloud Reader API. */
 export type ReadingStatus =
  | "want_to_read"
  | "reading"
  | "finished"
  | "dnf";
 export const READING_STATUS_LABELS: Record<ReadingStatus, string> = {
  want_to_read: "Want to Read",
  reading: "Reading",
  finished: "Finished",
  dnf: "Did Not Finish",
 };
 export interface BookSummary {
  id: number;
  title: string;
  author: string;
  genre: string;
  reading_status: ReadingStatus;
  reading_status_display: string;
  cover_url: string;
 }
 export interface BookDetail {
  id: number;
  title: string;
  author: string;
  genre: string;
  description: string;
  reading_status: ReadingStatus;
  reading_status_display: string;
  cover_url: string;
  created_at: string;
  updated_at: string;
 }
 export interface PaginatedResponse<T> {
  count: number;
  next: string | null;
  previous: string | null;
  results: T[];
 }
 export interface SearchParams {
  q?: string;
  genre?: string;
  author?: string;
  reading_status?: ReadingStatus | "";
  page?: number;
 }
@@ -1,36 +0,0 @@
 export interface BookListItem {
  id: number;
  title: string;
  author: string;
  filename: string;
  cover_image: string | null;
  created_at: string;
  progress: number | null;
 }
 export interface BookDetail {
  id: number;
  title: string;
  author: string;
  filename: string;
  file_url: string;
  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 AuthToken {
  token: string;
 }
--- a/Show More
+++ b/Show More
Author	SHA1	Message	Date
Marko (Hermes Implementer)	ade810a013	fix: address PR #24 review comments - SpeechRecognition types, CSS hover over direct DOM, shared useDebounce	2026-05-29 05:10:06 +00:00
crisleo94	6a223d7237	Merge branch 'main' into feature/mobile-search-discovery	2026-05-29 04:50:59 +00:00
crisleo94	656d20879f	Merge pull request 'Implement: US: Integrate Expo Mobile Application into Monorepo (#16 )' (#23 ) from feature/expo-integration into main Reviewed-on: #23 Reviewed-by: crisleo94 <cristhian.reinoso@codescripters.org>	2026-05-29 04:50:49 +00:00
crisleo94	2eeb3fb7d6	Merge pull request 'Fix: Missing API methods for Book Search and Discovery (re-opened #5 )' (#14 ) from fix/missing-api-methods into main Reviewed-on: #14 Reviewed-by: crisleo94 <cristhian.reinoso@codescripters.org>	2026-05-29 04:25:37 +00:00
Marko (Hermes Implementer)	658f77a746	feat: mobile book search and discovery with voice search, suggestions, and responsive layout	2026-05-29 02:55:50 +00:00
Marko (Hermes Implementer)	fa82fab44a	feat: Integrate Expo mobile application into monorepo (#16 ) - Add mobile/ directory with Expo React Native project - Create API client with JWT auth and token refresh using AsyncStorage - Implement AuthContext for login/register/logout flow - Add screens: Login, Register, Library, Search, Settings - Set up React Navigation with AuthStack and MainTabs - Create packages/shared/ with shared types and utilities - Add shared validation utilities (email, password strength) - Update root package.json workspaces to include mobile + shared - Add spec document docs/backend/009-expo-integration.md	2026-05-29 02:50:09 +00:00
Marko (Hermes Implementer)	670101b61e	fix: add missing book API methods and types (searchBooks, getBook, getGenres, getAuthors)	2026-05-29 00:08:32 +00:00
markoandreid	332b539880	Implement: US: Book Search and Discovery (#13 ) Reviewed and merged by Reid (Hermes Reviewer) Co-authored-by: crisleo-hermes <hermes@codescripters.org> Co-committed-by: crisleo-hermes <hermes@codescripters.org>	2026-05-26 06:21:32 +00:00
markoandreid	f84a593c5d	Implement: Refactor: Consolidate Duplicate Backend and Frontend Implementations (#11 ) Reviewed and merged by Reid (Hermes Reviewer) Co-authored-by: crisleo-hermes <hermes@codescripters.org> Co-committed-by: crisleo-hermes <hermes@codescripters.org>	2026-05-26 03:54:25 +00:00
		`@@ -0,0 +1,2 @@`
							`export { useAuth } from "../context/AuthContext";`
							`export { useAsyncData } from "./useAsyncData";`
		`@@ -0,0 +1,2 @@`
							`export * from "./types";`
							`export * from "./utils";`