feat: implement group EPUB upload and section splitting (US #29)

Backend:
- Create hermes Django app with models: ReadingGroup, GroupBook, Section, ReadingSchedule, MemberProgress
- EPUB section splitting service with automatic detection and reading time estimation
- Section recommendation engine for 4-week meeting schedule
- REST API endpoints for groups, books, sections, schedule, and member progress
- Manual section adjustment (merge/split) support

Frontend:
- GroupsPage: list/create reading groups
- GroupDetailPage: manage members, upload EPUB to group, view group books
- GroupBookPage: section breakdown with merge/split controls, reading schedule, member progress
- API client and TypeScript types for all group operations
- i18n keys for English and Spanish

Shared:
- Group-related types and API endpoint constants in packages/shared

backend/apps/groups/admin.py

@@ -1,23 +1,46 @@
 from django.contrib import admin
 
-from apps.groups.models import GroupMembership, MemberProgress, ReadingGroup
+from apps.groups.models import (
+    GroupBook,
+    MemberProgress,
+    ReadingGroup,
+    ReadingGroupMembership,
+    ReadingSchedule,
+    Section,
+)
 
 
 @admin.register(ReadingGroup)
 class ReadingGroupAdmin(admin.ModelAdmin):
-    list_display = ["name", "ebook", "created_by", "created_at"]
+    list_display = ["name", "admin", "created_at"]
-    search_fields = ["name", "ebook__title", "created_by__email"]
+    search_fields = ["name", "admin__email"]
 
 
-@admin.register(GroupMembership)
+@admin.register(ReadingGroupMembership)
-class GroupMembershipAdmin(admin.ModelAdmin):
+class ReadingGroupMembershipAdmin(admin.ModelAdmin):
-    list_display = ["group", "user", "role", "joined_at"]
+    list_display = ["user", "group", "role", "joined_at"]
-    list_filter = ["role"]
+    list_filter = ["role", "group"]
-    search_fields = ["user__email", "group__name"]
+
+
+@admin.register(GroupBook)
+class GroupBookAdmin(admin.ModelAdmin):
+    list_display = ["title", "group", "status", "uploaded_by", "created_at"]
+    list_filter = ["status"]
+    search_fields = ["title", "group__name"]
+
+
+@admin.register(Section)
+class SectionAdmin(admin.ModelAdmin):
+    list_display = ["title", "group_book", "order", "estimated_reading_minutes"]
+    ordering = ["group_book", "order"]
+
+
+@admin.register(ReadingSchedule)
+class ReadingScheduleAdmin(admin.ModelAdmin):
+    list_display = ["group_book", "meeting_number", "week_date"]
+    ordering = ["group_book", "meeting_number"]
 
 
 @admin.register(MemberProgress)
 class MemberProgressAdmin(admin.ModelAdmin):
-    list_display = ["user", "group", "current_section", "percentage", "time_spent_seconds", "is_public", "updated_at"]
+    list_display = ["user", "group_book", "current_section", "updated_at"]
-    list_filter = ["is_public"]
-    search_fields = ["user__email", "group__name"]

backend/apps/groups/apps.py

@@ -4,4 +4,4 @@ from django.apps import AppConfig
 class GroupsConfig(AppConfig):
     default_auto_field = "django.db.models.BigAutoField"
     name = "apps.groups"
-    verbose_name = "Reading Groups"
+    verbose_name = "Reading Groups"

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

@@ -23,8 +23,7 @@ class Migration(migrations.Migration):
                 ('description', models.TextField(blank=True, default='')),
                 ('created_at', models.DateTimeField(auto_now_add=True)),
                 ('updated_at', models.DateTimeField(auto_now=True)),
-                ('created_by', models.ForeignKey(on_delete=django.db.models.deletion.CASCADE, related_name='created_groups', to=settings.AUTH_USER_MODEL)),
+                ('admin', models.ForeignKey(on_delete=django.db.models.deletion.CASCADE, related_name='administered_groups', to=settings.AUTH_USER_MODEL)),
-                ('ebook', models.ForeignKey(on_delete=django.db.models.deletion.CASCADE, related_name='reading_groups', to='books.ebook')),
             ],
             options={
                 'verbose_name': 'Reading Group',
@@ -34,42 +33,122 @@ class Migration(migrations.Migration):
             },
         ),
         migrations.CreateModel(
-            name='GroupMembership',
+            name='GroupBook',
             fields=[
                 ('id', models.BigAutoField(auto_created=True, primary_key=True, serialize=False, verbose_name='ID')),
-                ('role', models.CharField(choices=[('member', 'Member'), ('admin', 'Admin')], default='member', max_length=16)),
+                ('title', models.CharField(db_index=True, max_length=512)),
-                ('joined_at', models.DateTimeField(auto_now_add=True)),
+                ('status', models.CharField(choices=[('active', 'Active'), ('replaced', 'Replaced')], db_index=True, default='active', max_length=16)),
-                ('user', models.ForeignKey(on_delete=django.db.models.deletion.CASCADE, related_name='group_memberships', to=settings.AUTH_USER_MODEL)),
+                ('created_at', models.DateTimeField(auto_now_add=True)),
-                ('group', models.ForeignKey(on_delete=django.db.models.deletion.CASCADE, related_name='memberships', to='groups.readinggroup')),
+                ('updated_at', models.DateTimeField(auto_now=True)),
+                ('ebook', models.ForeignKey(on_delete=django.db.models.deletion.CASCADE, related_name='group_books', to='books.ebook')),
+                ('uploaded_by', models.ForeignKey(on_delete=django.db.models.deletion.CASCADE, related_name='uploaded_group_books', to=settings.AUTH_USER_MODEL)),
+                ('group', models.ForeignKey(on_delete=django.db.models.deletion.CASCADE, related_name='group_books', to='groups.readinggroup')),
             ],
             options={
-                'verbose_name': 'Group Membership',
+                'verbose_name': 'Group Book',
-                'verbose_name_plural': 'Group Memberships',
+                'verbose_name_plural': 'Group Books',
+                'db_table': 'groups_group_book',
+                'ordering': ['-created_at'],
+            },
+        ),
+        migrations.CreateModel(
+            name='ReadingGroupMembership',
+            fields=[
+                ('id', models.BigAutoField(auto_created=True, primary_key=True, serialize=False, verbose_name='ID')),
+                ('role', models.CharField(choices=[('admin', 'Admin'), ('member', 'Member')], default='member', max_length=16)),
+                ('joined_at', models.DateTimeField(auto_now_add=True)),
+                ('group', models.ForeignKey(on_delete=django.db.models.deletion.CASCADE, related_name='memberships', to='groups.readinggroup')),
+                ('user', models.ForeignKey(on_delete=django.db.models.deletion.CASCADE, to=settings.AUTH_USER_MODEL)),
+            ],
+            options={
+                'verbose_name': 'Reading Group Membership',
+                'verbose_name_plural': 'Reading Group Memberships',
                 'db_table': 'groups_membership',
-                'ordering': ['joined_at'],
+            },
-                'unique_together': {('group', 'user')},
+        ),
+        migrations.AddField(
+            model_name='readinggroup',
+            name='members',
+            field=models.ManyToManyField(related_name='reading_groups', through='groups.ReadingGroupMembership', to=settings.AUTH_USER_MODEL),
+        ),
+        migrations.CreateModel(
+            name='ReadingSchedule',
+            fields=[
+                ('id', models.BigAutoField(auto_created=True, primary_key=True, serialize=False, verbose_name='ID')),
+                ('meeting_number', models.PositiveIntegerField()),
+                ('week_date', models.DateField()),
+                ('section_ids', models.JSONField(default=list, help_text='Ordered list of Section IDs for this meeting')),
+                ('created_at', models.DateTimeField(auto_now_add=True)),
+                ('group_book', models.ForeignKey(on_delete=django.db.models.deletion.CASCADE, related_name='schedules', to='groups.groupbook')),
+            ],
+            options={
+                'verbose_name': 'Reading Schedule',
+                'verbose_name_plural': 'Reading Schedules',
+                'db_table': 'groups_reading_schedule',
+                'ordering': ['meeting_number'],
+            },
+        ),
+        migrations.CreateModel(
+            name='Section',
+            fields=[
+                ('id', models.BigAutoField(auto_created=True, primary_key=True, serialize=False, verbose_name='ID')),
+                ('title', models.CharField(max_length=512)),
+                ('order', models.PositiveIntegerField(db_index=True)),
+                ('start_chapter_index', models.PositiveIntegerField(default=0)),
+                ('end_chapter_index', models.PositiveIntegerField(default=0)),
+                ('estimated_reading_minutes', models.PositiveIntegerField(default=0)),
+                ('created_at', models.DateTimeField(auto_now_add=True)),
+                ('group_book', models.ForeignKey(on_delete=django.db.models.deletion.CASCADE, related_name='sections', to='groups.groupbook')),
+            ],
+            options={
+                'verbose_name': 'Section',
+                'verbose_name_plural': 'Sections',
+                'db_table': 'groups_section',
+                'ordering': ['order'],
             },
         ),
         migrations.CreateModel(
             name='MemberProgress',
             fields=[
                 ('id', models.BigAutoField(auto_created=True, primary_key=True, serialize=False, verbose_name='ID')),
-                ('current_section', models.PositiveIntegerField(default=0)),
+                ('completed_sections', models.JSONField(default=list, help_text='Ordered list of completed Section IDs')),
-                ('percentage', models.FloatField(default=0.0)),
-                ('time_spent_seconds', models.PositiveIntegerField(default=0)),
-                ('last_position', models.JSONField(blank=True, default=dict)),
-                ('is_public', models.BooleanField(default=True)),
                 ('updated_at', models.DateTimeField(auto_now=True)),
-                ('membership', models.OneToOneField(on_delete=django.db.models.deletion.CASCADE, related_name='progress', to='groups.groupmembership')),
+                ('group_book', models.ForeignKey(on_delete=django.db.models.deletion.CASCADE, related_name='member_progress', to='groups.groupbook')),
-                ('user', models.ForeignKey(on_delete=django.db.models.deletion.CASCADE, related_name='member_progress', to=settings.AUTH_USER_MODEL)),
+                ('user', models.ForeignKey(on_delete=django.db.models.deletion.CASCADE, related_name='group_progress', to=settings.AUTH_USER_MODEL)),
-                ('group', models.ForeignKey(on_delete=django.db.models.deletion.CASCADE, related_name='member_progress', to='groups.readinggroup')),
+                ('current_section', models.ForeignKey(blank=True, null=True, on_delete=django.db.models.deletion.SET_NULL, related_name='current_readers', to='groups.section')),
             ],
             options={
                 'verbose_name': 'Member Progress',
                 'verbose_name_plural': 'Member Progress',
                 'db_table': 'groups_member_progress',
-                'indexes': [models.Index(fields=['group', '-percentage'], name='groups_memb_group_i_42e333_idx'), models.Index(fields=['group', 'user'], name='groups_memb_group_i_f50793_idx')],
-                'unique_together': {('group', 'user')},
             },
         ),
+        migrations.AddIndex(
+            model_name='groupbook',
+            index=models.Index(fields=['group', 'status'], name='groups_grou_group_i_afdbf7_idx'),
+        ),
+        migrations.AlterUniqueTogether(
+            name='readinggroupmembership',
+            unique_together={('user', 'group')},
+        ),
+        migrations.AddIndex(
+            model_name='readingschedule',
+            index=models.Index(fields=['group_book', 'meeting_number'], name='groups_read_group_b_2fc416_idx'),
+        ),
+        migrations.AlterUniqueTogether(
+            name='readingschedule',
+            unique_together={('group_book', 'meeting_number')},
+        ),
+        migrations.AddIndex(
+            model_name='section',
+            index=models.Index(fields=['group_book', 'order'], name='groups_sect_group_b_e2810a_idx'),
+        ),
+        migrations.AlterUniqueTogether(
+            name='section',
+            unique_together={('group_book', 'order')},
+        ),
+        migrations.AlterUniqueTogether(
+            name='memberprogress',
+            unique_together={('user', 'group_book')},
+        ),
     ]

backend/apps/groups/models.py

@@ -1,22 +1,24 @@
 from django.conf import settings
 from django.db import models
 
+from apps.books.models import EBook
+
 
 class ReadingGroup(models.Model):
-    """A group of users reading the same book together."""
+    """A reading group with an admin and members."""
 
     name = models.CharField(max_length=256, db_index=True)
-    ebook = models.ForeignKey(
+    description = models.TextField(blank=True, default="")
-        "books.EBook",
+    admin = models.ForeignKey(
-        on_delete=models.CASCADE,
-        related_name="reading_groups",
-    )
-    created_by = models.ForeignKey(
         settings.AUTH_USER_MODEL,
         on_delete=models.CASCADE,
-        related_name="created_groups",
+        related_name="administered_groups",
+    )
+    members = models.ManyToManyField(
+        settings.AUTH_USER_MODEL,
+        through="ReadingGroupMembership",
+        related_name="reading_groups",
     )
-    description = models.TextField(blank=True, default="")
     created_at = models.DateTimeField(auto_now_add=True)
     updated_at = models.DateTimeField(auto_now=True)
 
@@ -29,110 +31,131 @@ class ReadingGroup(models.Model):
     def __str__(self) -> str:
         return self.name
 
-    @property
-    def total_sections(self) -> int:
-        return self.ebook.chapters.count()
 
-
+class ReadingGroupMembership(models.Model):
-class GroupMembership(models.Model):
     class Role(models.TextChoices):
-        MEMBER = "member", "Member"
         ADMIN = "admin", "Admin"
+        MEMBER = "member", "Member"
 
-    group = models.ForeignKey(
+    user = models.ForeignKey(settings.AUTH_USER_MODEL, on_delete=models.CASCADE)
-        ReadingGroup,
+    group = models.ForeignKey(ReadingGroup, on_delete=models.CASCADE, related_name="memberships")
-        on_delete=models.CASCADE,
+    role = models.CharField(max_length=16, choices=Role.choices, default=Role.MEMBER)
-        related_name="memberships",
-    )
-    user = models.ForeignKey(
-        settings.AUTH_USER_MODEL,
-        on_delete=models.CASCADE,
-        related_name="group_memberships",
-    )
-    role = models.CharField(
-        max_length=16,
-        choices=Role.choices,
-        default=Role.MEMBER,
-    )
     joined_at = models.DateTimeField(auto_now_add=True)
 
     class Meta:
         db_table = "groups_membership"
-        verbose_name = "Group Membership"
+        unique_together = [("user", "group")]
-        verbose_name_plural = "Group Memberships"
+        verbose_name = "Reading Group Membership"
-        unique_together = [("group", "user")]
+        verbose_name_plural = "Reading Group Memberships"
-        ordering = ["joined_at"]
 
     def __str__(self) -> str:
         return f"{self.user} in {self.group.name} ({self.role})"
 
 
-class MemberProgress(models.Model):
+class GroupBook(models.Model):
-    """Per-member reading progress within a reading group."""
+    """Links an uploaded EBook to a reading group."""
+
+    class Status(models.TextChoices):
+        ACTIVE = "active", "Active"
+        REPLACED = "replaced", "Replaced"
 
-    membership = models.OneToOneField(
-        GroupMembership,
-        on_delete=models.CASCADE,
-        related_name="progress",
-    )
     group = models.ForeignKey(
-        ReadingGroup,
+        ReadingGroup, on_delete=models.CASCADE, related_name="group_books"
-        on_delete=models.CASCADE,
-        related_name="member_progress",
     )
+    ebook = models.ForeignKey(
+        EBook, on_delete=models.CASCADE, related_name="group_books"
+    )
+    uploaded_by = models.ForeignKey(
+        settings.AUTH_USER_MODEL, on_delete=models.CASCADE, related_name="uploaded_group_books"
+    )
+    title = models.CharField(max_length=512, db_index=True)
+    status = models.CharField(
+        max_length=16, choices=Status.choices, default=Status.ACTIVE, db_index=True
+    )
+    created_at = models.DateTimeField(auto_now_add=True)
+    updated_at = models.DateTimeField(auto_now=True)
+
+    class Meta:
+        db_table = "groups_group_book"
+        verbose_name = "Group Book"
+        verbose_name_plural = "Group Books"
+        ordering = ["-created_at"]
+        indexes = [models.Index(fields=["group", "status"])]
+
+    def __str__(self) -> str:
+        return f"{self.group.name} — {self.title}"
+
+
+class Section(models.Model):
+    """A section/chunk of a GroupBook for group reading."""
+
+    group_book = models.ForeignKey(
+        GroupBook, on_delete=models.CASCADE, related_name="sections"
+    )
+    title = models.CharField(max_length=512)
+    order = models.PositiveIntegerField(db_index=True)
+    start_chapter_index = models.PositiveIntegerField(default=0)
+    end_chapter_index = models.PositiveIntegerField(default=0)
+    estimated_reading_minutes = models.PositiveIntegerField(default=0)
+    created_at = models.DateTimeField(auto_now_add=True)
+
+    class Meta:
+        db_table = "groups_section"
+        verbose_name = "Section"
+        verbose_name_plural = "Sections"
+        ordering = ["order"]
+        unique_together = [("group_book", "order")]
+        indexes = [models.Index(fields=["group_book", "order"])]
+
+    def __str__(self) -> str:
+        return f"{self.group_book.title} — Section {self.order}: {self.title}"
+
+
+class ReadingSchedule(models.Model):
+    """Reading schedule mapping sections to weekly meetings."""
+
+    group_book = models.ForeignKey(
+        GroupBook, on_delete=models.CASCADE, related_name="schedules"
+    )
+    meeting_number = models.PositiveIntegerField()
+    week_date = models.DateField()
+    section_ids = models.JSONField(default=list, help_text="Ordered list of Section IDs for this meeting")
+    created_at = models.DateTimeField(auto_now_add=True)
+
+    class Meta:
+        db_table = "groups_reading_schedule"
+        verbose_name = "Reading Schedule"
+        verbose_name_plural = "Reading Schedules"
+        ordering = ["meeting_number"]
+        unique_together = [("group_book", "meeting_number")]
+        indexes = [models.Index(fields=["group_book", "meeting_number"])]
+
+    def __str__(self) -> str:
+        return f"{self.group_book.title} — Meeting {self.meeting_number}"
+
+
+class MemberProgress(models.Model):
+    """Tracks a member's progress through sections of a group book."""
+
     user = models.ForeignKey(
-        settings.AUTH_USER_MODEL,
+        settings.AUTH_USER_MODEL, on_delete=models.CASCADE, related_name="group_progress"
-        on_delete=models.CASCADE,
+    )
-        related_name="member_progress",
+    group_book = models.ForeignKey(
+        GroupBook, on_delete=models.CASCADE, related_name="member_progress"
+    )
+    current_section = models.ForeignKey(
+        Section, on_delete=models.SET_NULL, null=True, blank=True, related_name="current_readers"
+    )
+    completed_sections = models.JSONField(
+        default=list, help_text="Ordered list of completed Section IDs"
     )
-    current_section = models.PositiveIntegerField(default=0)
-    percentage = models.FloatField(default=0.0)
-    time_spent_seconds = models.PositiveIntegerField(default=0)
-    last_position = models.JSONField(blank=True, default=dict)
-    is_public = models.BooleanField(default=True)
     updated_at = models.DateTimeField(auto_now=True)
 
     class Meta:
         db_table = "groups_member_progress"
         verbose_name = "Member Progress"
         verbose_name_plural = "Member Progress"
-        unique_together = [("group", "user")]
+        unique_together = [("user", "group_book")]
-        indexes = [
-            models.Index(fields=["group", "-percentage"]),
-            models.Index(fields=["group", "user"]),
-        ]
 
     def __str__(self) -> str:
-        return f"{self.user} — {self.group.name} ({self.percentage:.0f}%)"
+        return f"{self.user} — {self.group_book.title}"
-
-    def total_sections(self) -> int:
-        return self.group.total_sections
-
-    def update_progress(
-        self,
-        current_section: int,
-        percentage: float | None = None,
-        time_spent_delta: int = 0,
-        last_position: dict | None = None,
-    ) -> None:
-        """Update progress with computed percentage if not provided."""
-        self.current_section = current_section
-        if percentage is not None:
-            self.percentage = min(100.0, max(0.0, percentage))
-        elif (ts := self.total_sections()) > 0:
-            self.percentage = min(100.0, (current_section / ts) * 100.0)
-        else:
-            self.percentage = 0.0
-        if time_spent_delta > 0:
-            self.time_spent_seconds += time_spent_delta
-        if last_position is not None:
-            self.last_position = last_position
-        self.save(
-            update_fields=[
-                "current_section",
-                "percentage",
-                "time_spent_seconds",
-                "last_position",
-                "updated_at",
-            ]
-        )

backend/apps/groups/permissions.py

@@ -1,28 +0,0 @@
-from rest_framework import permissions
-from rest_framework.request import Request
-
-from apps.groups.models import GroupMembership
-
-
-class IsGroupMember(permissions.BasePermission):
-    """Allow access only to members of the group."""
-
-    def has_permission(self, request: Request, view: object) -> bool:
-        group_id = view.kwargs.get("group_pk") or view.kwargs.get("pk")
-        if not group_id:
-            return False
-        return GroupMembership.objects.filter(
-            group_id=group_id, user=request.user
-        ).exists()
-
-
-class IsGroupAdmin(permissions.BasePermission):
-    """Allow access only to group admins."""
-
-    def has_permission(self, request: Request, view: object) -> bool:
-        group_id = view.kwargs.get("group_pk") or view.kwargs.get("pk")
-        if not group_id:
-            return False
-        return GroupMembership.objects.filter(
-            group_id=group_id, user=request.user, role=GroupMembership.Role.ADMIN
-        ).exists()

backend/apps/groups/serializers.py

@@ -1,183 +1,185 @@
+from __future__ import annotations
+
 from rest_framework import serializers
 
-from apps.groups.models import GroupMembership, MemberProgress, ReadingGroup
+from apps.groups.models import (
+    GroupBook,
+    MemberProgress,
+    ReadingGroup,
+    ReadingGroupMembership,
+    ReadingSchedule,
+    Section,
+)
+from apps.books.serializers import EBookListSerializer
 
 
-class GroupMembershipSerializer(serializers.ModelSerializer):
+class ReadingGroupMembershipSerializer(serializers.ModelSerializer):
     user_email = serializers.CharField(source="user.email", read_only=True)
-    user_id = serializers.IntegerField(source="user.id", read_only=True)
+    user_username = serializers.CharField(source="user.username", read_only=True)
-    role = serializers.CharField(read_only=True)
 
     class Meta:
-        model = GroupMembership
+        model = ReadingGroupMembership
-        fields = ["id", "user_id", "user_email", "role", "joined_at"]
-
-
-class MemberProgressSerializer(serializers.ModelSerializer):
-    user_email = serializers.CharField(source="user.email", read_only=True)
-    user_id = serializers.IntegerField(source="user.id", read_only=True)
-    total_sections = serializers.SerializerMethodField()
-    section_label = serializers.SerializerMethodField()
-
-    class Meta:
-        model = MemberProgress
         fields = [
-            "id",
+            "id", "user", "user_email", "user_username",
-            "user_id",
+            "role", "joined_at",
-            "user_email",
-            "current_section",
-            "total_sections",
-            "section_label",
-            "percentage",
-            "time_spent_seconds",
-            "last_position",
-            "is_public",
-            "updated_at",
         ]
-        read_only_fields = ["id", "user_id", "user_email", "updated_at"]
+        read_only_fields = ["id", "joined_at"]
-        extra_kwargs = {
-            "percentage": {"required": False, "min_value": 0.0, "max_value": 100.0},
-        }
-
-    def get_total_sections(self, obj: MemberProgress) -> int:
-        return obj.total_sections()
-
-    def get_section_label(self, obj: MemberProgress) -> str:
-        ts = obj.total_sections()
-        if ts:
-            return f"Section {obj.current_section} of {ts}"
-        return "No sections"
-
-    def validate_percentage(self, value: float) -> float:
-        if value < 0.0 or value > 100.0:
-            raise serializers.ValidationError("Percentage must be between 0.0 and 100.0.")
-        return value
-
-
-class MemberProgressPublicSerializer(serializers.ModelSerializer):
-    """Limited view for other group members — section label only, no exact position."""
-
-    user_email = serializers.CharField(source="user.email", read_only=True)
-    user_id = serializers.IntegerField(source="user.id", read_only=True)
-    total_sections = serializers.SerializerMethodField()
-    section_label = serializers.SerializerMethodField()
-
-    class Meta:
-        model = MemberProgress
-        fields = [
-            "user_id",
-            "user_email",
-            "current_section",
-            "total_sections",
-            "section_label",
-            "percentage",
-            "time_spent_seconds",
-            "updated_at",
-        ]
-
-    def get_total_sections(self, obj: MemberProgress) -> int:
-        return obj.total_sections()
-
-    def get_section_label(self, obj: MemberProgress) -> str:
-        ts = obj.total_sections()
-        if ts:
-            return f"Section {obj.current_section} of {ts}"
-        return "No sections"
-
-
-class MemberProgressUpdateSerializer(serializers.Serializer):
-    current_section = serializers.IntegerField(min_value=0)
-    percentage = serializers.FloatField(required=False, min_value=0.0, max_value=100.0)
-    time_spent_delta = serializers.IntegerField(default=0, min_value=0)
-    last_position = serializers.JSONField(required=False, default=dict)
-    is_public = serializers.BooleanField(required=False)
 
 
 class ReadingGroupListSerializer(serializers.ModelSerializer):
-    created_by_email = serializers.CharField(source="created_by.email", read_only=True)
-    ebook_title = serializers.CharField(source="ebook.title", read_only=True)
-    ebook_author = serializers.CharField(source="ebook.author", read_only=True)
     member_count = serializers.SerializerMethodField()
-    my_progress = serializers.SerializerMethodField()
+    admin_email = serializers.CharField(source="admin.email", read_only=True)
 
     class Meta:
         model = ReadingGroup
         fields = [
-            "id",
+            "id", "name", "description", "admin", "admin_email",
-            "name",
+            "member_count", "created_at", "updated_at",
-            "ebook",
-            "ebook_title",
-            "ebook_author",
-            "created_by_email",
-            "description",
-            "member_count",
-            "my_progress",
-            "created_at",
-            "updated_at",
         ]
 
     def get_member_count(self, obj: ReadingGroup) -> int:
         return obj.memberships.count()
 
-    def get_my_progress(self, obj: ReadingGroup) -> dict | None:
-        request = self.context.get("request")
-        if not request or not request.user.is_authenticated:
-            return None
-        try:
-            mp = MemberProgress.objects.get(group=obj, user=request.user)
-        except MemberProgress.DoesNotExist:
-            return None
-        return {
-            "current_section": mp.current_section,
-            "percentage": mp.percentage,
-            "time_spent_seconds": mp.time_spent_seconds,
-            "section_label": MemberProgressSerializer().get_section_label(mp),
-        }
 
+class ReadingGroupDetailSerializer(serializers.ModelSerializer):
+    admin_email = serializers.CharField(source="admin.email", read_only=True)
+    members = ReadingGroupMembershipSerializer(source="memberships", many=True, read_only=True)
 
-class ReadingGroupDetailSerializer(ReadingGroupListSerializer):
+    class Meta:
-    members = serializers.SerializerMethodField()
+        model = ReadingGroup
-
+        fields = [
-    class Meta(ReadingGroupListSerializer.Meta):
+            "id", "name", "description", "admin", "admin_email",
-        fields = ReadingGroupListSerializer.Meta.fields + ["members"]
+            "members", "created_at", "updated_at",
-
+        ]
-    def get_members(self, obj: ReadingGroup) -> list[dict]:
-        memberships = obj.memberships.select_related("user").prefetch_related("progress")
-        result: list[dict] = []
-        for m in memberships:
-            entry: dict = {
-                "id": m.id,
-                "user_id": m.user.id,
-                "user_email": m.user.email,
-                "role": m.role,
-                "joined_at": m.joined_at,
-            }
-            try:
-                mp = m.progress
-            except MemberProgress.DoesNotExist:
-                entry["progress"] = None
-            else:
-                if mp.is_public:
-                    entry["progress"] = MemberProgressPublicSerializer(mp).data
-                else:
-                    entry["progress"] = {"is_public": False, "note": "Private"}
-            result.append(entry)
-        return result
 
 
 class ReadingGroupCreateSerializer(serializers.ModelSerializer):
     class Meta:
         model = ReadingGroup
-        fields = ["name", "ebook", "description"]
+        fields = ["name", "description"]
 
 
-class AdminProgressSummarySerializer(serializers.Serializer):
+class AddMemberSerializer(serializers.Serializer):
-    group_id = serializers.IntegerField()
+    user_id = serializers.IntegerField()
-    group_name = serializers.CharField()
+
-    ebook_title = serializers.CharField()
+    def validate_user_id(self, value: int) -> int:
-    total_members = serializers.IntegerField()
+        from django.conf import settings
-    members_started = serializers.IntegerField()
+        User = settings.AUTH_USER_MODEL
-    members_finished = serializers.IntegerField()
+        if not User.objects.filter(id=value).exists():
-    average_percentage = serializers.FloatField()
+            raise serializers.ValidationError("User not found.")
-    average_time_spent_hours = serializers.FloatField()
+        return value
-    member_details = serializers.ListField(child=serializers.JSONField())
+
+
+class SectionSerializer(serializers.ModelSerializer):
+    class Meta:
+        model = Section
+        fields = [
+            "id", "title", "order", "start_chapter_index",
+            "end_chapter_index", "estimated_reading_minutes", "created_at",
+        ]
+        read_only_fields = ["id", "created_at"]
+
+
+class SectionAdjustSerializer(serializers.Serializer):
+    """Payload for manual section adjustments (merge/split)."""
+    operation = serializers.ChoiceField(choices=["merge", "split"])
+    section_ids = serializers.ListField(
+        child=serializers.IntegerField(), min_length=1,
+        help_text="For merge: list of section IDs to merge. For split: [section_id] to split."
+    )
+    split_at = serializers.IntegerField(
+        required=False, default=2, min_value=2,
+        help_text="Number of new sections when splitting"
+    )
+
+
+class ReadingScheduleSerializer(serializers.ModelSerializer):
+    section_details = serializers.SerializerMethodField()
+
+    class Meta:
+        model = ReadingSchedule
+        fields = [
+            "id", "meeting_number", "week_date", "section_ids",
+            "section_details", "created_at",
+        ]
+        read_only_fields = ["id", "created_at"]
+
+    def get_section_details(self, obj: ReadingSchedule) -> list[dict]:
+        sections = Section.objects.filter(
+            id__in=obj.section_ids, group_book=obj.group_book
+        ).order_by("order")
+        return SectionSerializer(sections, many=True).data
+
+
+class MemberProgressSerializer(serializers.ModelSerializer):
+    user_email = serializers.CharField(source="user.email", read_only=True)
+    user_username = serializers.CharField(source="user.username", read_only=True)
+    current_section_title = serializers.SerializerMethodField()
+
+    class Meta:
+        model = MemberProgress
+        fields = [
+            "id", "user", "user_email", "user_username",
+            "current_section", "current_section_title",
+            "completed_sections", "updated_at",
+        ]
+        read_only_fields = ["id", "updated_at"]
+
+    def get_current_section_title(self, obj: MemberProgress) -> str | None:
+        if obj.current_section:
+            return obj.current_section.title
+        return None
+
+
+class GroupBookListSerializer(serializers.ModelSerializer):
+    ebook = EBookListSerializer(read_only=True)
+    uploaded_by_email = serializers.CharField(source="uploaded_by.email", read_only=True)
+    section_count = serializers.SerializerMethodField()
+
+    class Meta:
+        model = GroupBook
+        fields = [
+            "id", "title", "status", "ebook", "uploaded_by",
+            "uploaded_by_email", "section_count", "created_at", "updated_at",
+        ]
+
+    def get_section_count(self, obj: GroupBook) -> int:
+        return obj.sections.count()
+
+
+class GroupBookDetailSerializer(serializers.ModelSerializer):
+    ebook = EBookListSerializer(read_only=True)
+    uploaded_by_email = serializers.CharField(source="uploaded_by.email", read_only=True)
+    sections = SectionSerializer(many=True, read_only=True)
+    schedules = ReadingScheduleSerializer(source="schedules", many=True, read_only=True)
+
+    class Meta:
+        model = GroupBook
+        fields = [
+            "id", "group", "title", "status", "ebook",
+            "uploaded_by", "uploaded_by_email",
+            "sections", "schedules", "created_at", "updated_at",
+        ]
+
+
+class GroupBookCreateSerializer(serializers.Serializer):
+    ebook_id = serializers.IntegerField()
+    title = serializers.CharField(max_length=512, required=False)
+
+    def validate_ebook_id(self, value: int) -> int:
+        from apps.books.models import EBook
+        if not EBook.objects.filter(id=value).exists():
+            raise serializers.ValidationError("EBook not found.")
+        # Check format is EPUB
+        ebook = EBook.objects.get(id=value)
+        if ebook.format != "epub":
+            raise serializers.ValidationError("Only EPUB format is supported for group books.")
+        return value
+
+    def validate(self, data: dict) -> dict:
+        request = self.context.get("request")
+        if request and not data.get("title"):
+            from apps.books.models import EBook
+            ebook = EBook.objects.get(id=data["ebook_id"])
+            data["title"] = ebook.title
+        return data

backend/apps/groups/services/section_splitting.py

@@ -0,0 +1,241 @@
+"""Automatic section detection and meeting recommendation for group books."""
+
+from __future__ import annotations
+
+import logging
+from datetime import date, timedelta
+from typing import Any
+
+from django.db.models import QuerySet
+
+from apps.books.models import BookChapter, EBook
+from apps.groups.models import GroupBook, ReadingSchedule, Section
+
+logger = logging.getLogger(__name__)
+
+WORDS_PER_MINUTE = 250  # Average reading speed
+
+
+def _fetch_chapter_text(ebook: EBook, chapter: BookChapter) -> str:
+    """Extract plain text from a chapter for word counting."""
+    try:
+        from ebooklib import epub
+        from bs4 import BeautifulSoup
+    except ImportError:
+        return ""
+
+    try:
+        book = epub.read_epub(ebook.file.path)
+        href = chapter.href or ""
+        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")
+                body = soup.find("body")
+                if body:
+                    return body.get_text(separator=" ", strip=True)
+                return soup.get_text(separator=" ", strip=True)
+        return ""
+    except Exception:
+        logger.exception("Failed to extract text for chapter %s", chapter.id)
+        return ""
+
+
+def _estimate_reading_minutes(text: str) -> int:
+    """Estimate reading time based on word count at WORDS_PER_MINUTE."""
+    word_count = len(text.split())
+    if word_count == 0:
+        return 1
+    return max(1, round(word_count / WORDS_PER_MINUTE))
+
+
+def detect_sections(group_book: GroupBook) -> list[dict[str, Any]]:
+    """Auto-detect sections from a GroupBook's chapters.
+
+    Groups consecutive chapters into logical sections based on TOC structure.
+    Top-level TOC entries become sections; if there are very few (< 3),
+    groups of ~5 chapters become sections instead.
+    """
+    ebook = group_book.ebook
+    chapters = list(
+        BookChapter.objects.filter(ebook=ebook).order_by("index").select_related("ebook")
+    )
+
+    if not chapters:
+        return []
+
+    top_level = [ch for ch in chapters if not ch.children or len(ch.children) == 0]
+    has_children = [ch for ch in chapters if ch.children and len(ch.children) > 0]
+
+    sections: list[dict[str, Any]] = []
+
+    if len(has_children) >= 3:
+        # Use TOC structure: each top-level chapter (with children) is a section
+        for idx, ch in enumerate(has_children):
+            # Find all child chapters belonging to this parent
+            child_indices = _collect_child_indices(chapters, ch, idx)
+            start_idx = ch.index
+            end_idx = child_indices[-1] if child_indices else start_idx
+
+            section_chapters = [c for c in chapters if start_idx <= c.index <= end_idx]
+            total_text = ""
+            for sc in section_chapters:
+                total_text += " " + _fetch_chapter_text(ebook, sc)
+
+            sections.append({
+                "title": ch.title,
+                "order": idx + 1,
+                "start_chapter_index": start_idx,
+                "end_chapter_index": end_idx + 1,
+                "estimated_reading_minutes": _estimate_reading_minutes(total_text),
+            })
+    else:
+        # Group chapters into chunks of ~5
+        chunk_size = max(1, len(top_level) // 6 if len(top_level) > 6 else 5)
+        chunk_size = max(3, min(chunk_size, 10))
+
+        group_start = 0
+        section_order = 1
+        total = len(top_level) or len(chapters)
+        source = top_level or chapters
+
+        while group_start < total:
+            group_end = min(group_start + chunk_size, total)
+            chunk = source[group_start:group_end]
+
+            total_text = ""
+            for ch in chunk:
+                total_text += " " + _fetch_chapter_text(ebook, ch)
+
+            first_title = chunk[0].title if chunk else "Section"
+            last_title = chunk[-1].title if len(chunk) > 1 else ""
+            title = f"{first_title}" if not last_title or first_title == last_title else f"{first_title} — {last_title}"
+
+            sections.append({
+                "title": title,
+                "order": section_order,
+                "start_chapter_index": chunk[0].index,
+                "end_chapter_index": chunk[-1].index + 1,
+                "estimated_reading_minutes": _estimate_reading_minutes(total_text),
+            })
+            group_start = group_end
+            section_order += 1
+
+    return sections
+
+
+def _collect_child_indices(chapters: list[BookChapter], parent: BookChapter, parent_idx: int) -> list[int]:
+    """Collect indices of all chapters that are children of the given parent TOC entry."""
+    indices: list[int] = [parent.index]
+    child_hrefs: set[str] = set()
+    for child in parent.children:
+        if isinstance(child, dict):
+            child_hrefs.add(child.get("href", ""))
+        elif hasattr(child, "href"):
+            child_hrefs.add(getattr(child, "href", ""))
+
+    for ch in chapters:
+        if ch.index == parent.index:
+            continue
+        if ch.href in child_hrefs or any(
+            ch.href.endswith(h) or h.endswith(ch.href) for h in child_hrefs
+        ):
+            indices.append(ch.index)
+
+    # Also include chapters between this parent and the next parent
+    if parent_idx + 1 < len(chapters):
+        next_parent = chapters[parent_idx + 1]
+        for ch in chapters:
+            if parent.index < ch.index < next_parent.index:
+                indices.append(ch.index)
+
+    return sorted(set(indices))
+
+
+def apply_sections(group_book: GroupBook) -> list[Section]:
+    """Detect sections and persist them to the database, replacing existing ones."""
+    Section.objects.filter(group_book=group_book).delete()
+    sections_data = detect_sections(group_book)
+    created: list[Section] = []
+    for data in sections_data:
+        section = Section.objects.create(
+            group_book=group_book,
+            title=data["title"],
+            order=data["order"],
+            start_chapter_index=data["start_chapter_index"],
+            end_chapter_index=data["end_chapter_index"],
+            estimated_reading_minutes=data["estimated_reading_minutes"],
+        )
+        created.append(section)
+    return created
+
+
+def recommend_meetings(group_book: GroupBook, num_meetings: int = 4) -> list[dict[str, Any]]:
+    """Recommend which sections to assign to each weekly meeting.
+
+    Distributes sections across meetings, trying to balance total reading time.
+    Returns a list of meeting assignments ready for schedule creation.
+    """
+    sections = list(
+        Section.objects.filter(group_book=group_book).order_by("order")
+    )
+
+    if not sections:
+        return []
+
+    # Calculate total minutes to distribute
+    total_minutes = sum(s.estimated_reading_minutes for s in sections)
+    target_per_meeting = total_minutes / num_meetings
+
+    meetings: list[dict[str, Any]] = []
+    current_meeting: list[int] = []
+    current_minutes = 0
+
+    for section in sections:
+        if current_meeting and current_minutes + section.estimated_reading_minutes > target_per_meeting * 1.4:
+            # Start new meeting if adding this section would overshoot too much
+            if len(meetings) < num_meetings - 1:
+                meetings.append({
+                    "meeting_number": len(meetings) + 1,
+                    "section_ids": current_meeting,
+                    "total_minutes": current_minutes,
+                })
+                current_meeting = []
+                current_minutes = 0
+
+        current_meeting.append(section.id)
+        current_minutes += section.estimated_reading_minutes
+
+    # Add the last meeting
+    if current_meeting:
+        meetings.append({
+            "meeting_number": len(meetings) + 1,
+            "section_ids": current_meeting,
+            "total_minutes": current_minutes,
+        })
+
+    # If we have fewer than num_meetings, we could split the largest one
+    # For now, just return what we have
+    return meetings
+
+
+def apply_schedule(group_book: GroupBook, num_meetings: int = 4) -> list[ReadingSchedule]:
+    """Generate and persist a reading schedule."""
+    ReadingSchedule.objects.filter(group_book=group_book).delete()
+
+    recommendations = recommend_meetings(group_book, num_meetings)
+    today = date.today()
+
+    created: list[ReadingSchedule] = []
+    for rec in recommendations:
+        week_date = today + timedelta(weeks=rec["meeting_number"] - 1)
+        schedule = ReadingSchedule.objects.create(
+            group_book=group_book,
+            meeting_number=rec["meeting_number"],
+            week_date=week_date,
+            section_ids=rec["section_ids"],
+        )
+        created.append(schedule)
+
+    return created

backend/apps/groups/urls.py

@@ -1,11 +1,43 @@
 from django.urls import include, path
 from rest_framework.routers import DefaultRouter
 
-from apps.groups.views import ReadingGroupViewSet
+from apps.groups.views import GroupBookViewSet, ReadingGroupViewSet
 
+# ReadingGroup routes (standard ViewSet)
 router = DefaultRouter()
-router.register(r"", ReadingGroupViewSet, basename="reading-group")
+router.register(r"", ReadingGroupViewSet, basename="group")
 
 urlpatterns = [
     path("", include(router.urls)),
+    # Nested GroupBook routes under a group
+    path(
+        "<int:group_pk>/books/",
+        GroupBookViewSet.as_view({"get": "list", "post": "create"}),
+        name="group-book-list",
+    ),
+    path(
+        "<int:group_pk>/books/<int:pk>/",
+        GroupBookViewSet.as_view({"get": "retrieve", "delete": "destroy"}),
+        name="group-book-detail",
+    ),
+    path(
+        "<int:group_pk>/books/<int:pk>/detect-sections/",
+        GroupBookViewSet.as_view({"post": "detect_sections_action"}),
+        name="group-book-detect-sections",
+    ),
+    path(
+        "<int:group_pk>/books/<int:pk>/adjust-sections/",
+        GroupBookViewSet.as_view({"post": "adjust_sections"}),
+        name="group-book-adjust-sections",
+    ),
+    path(
+        "<int:group_pk>/books/<int:pk>/schedule/",
+        GroupBookViewSet.as_view({"get": "schedule", "post": "schedule", "delete": "schedule"}),
+        name="group-book-schedule",
+    ),
+    path(
+        "<int:group_pk>/books/<int:pk>/progress/",
+        GroupBookViewSet.as_view({"get": "progress", "patch": "progress"}),
+        name="group-book-progress",
+    ),
 ]

backend/apps/groups/views.py

@@ -1,39 +1,82 @@
 from __future__ import annotations
 
-from django.db import models
+import logging
+from typing import Any
+
+from django.db.models import QuerySet
+from django.shortcuts import get_object_or_404
 from rest_framework import permissions, status, viewsets
 from rest_framework.decorators import action
 from rest_framework.request import Request
 from rest_framework.response import Response
 
-from apps.groups.models import GroupMembership, MemberProgress, ReadingGroup
+from apps.books.models import EBook
-from apps.groups.permissions import IsGroupAdmin, IsGroupMember
+from apps.groups.models import (
+    GroupBook,
+    MemberProgress,
+    ReadingGroup,
+    ReadingGroupMembership,
+    ReadingSchedule,
+    Section,
+)
 from apps.groups.serializers import (
-    AdminProgressSummarySerializer,
+    AddMemberSerializer,
-    GroupMembershipSerializer,
+    GroupBookCreateSerializer,
-    MemberProgressPublicSerializer,
+    GroupBookDetailSerializer,
+    GroupBookListSerializer,
     MemberProgressSerializer,
-    MemberProgressUpdateSerializer,
     ReadingGroupCreateSerializer,
     ReadingGroupDetailSerializer,
     ReadingGroupListSerializer,
+    ReadingScheduleSerializer,
+    SectionAdjustSerializer,
+    SectionSerializer,
+)
+from apps.groups.services.section_splitting import (
+    apply_schedule,
+    apply_sections,
+    detect_sections,
 )
-
-import logging
 
 logger = logging.getLogger(__name__)
 
 
-class ReadingGroupViewSet(viewsets.ModelViewSet):
+class IsGroupAdmin(permissions.BasePermission):
-    permission_classes = [permissions.IsAuthenticated]
+    """Only the group admin can modify group resources."""
 
-    def get_queryset(self):
+    def has_permission(self, request: Request, view: object) -> bool:
-        return (
+        if not request.user.is_authenticated:
-            ReadingGroup.objects.filter(memberships__user=self.request.user)
+            return False
-            .select_related("ebook", "created_by")
+        if view.action in ("list", "retrieve"):
-            .prefetch_related("memberships", "memberships__progress")
+            return True
-            .distinct()
+        group_id = view.kwargs.get("pk") or view.kwargs.get("group_pk")
-        )
+        if group_id:
+            return ReadingGroup.objects.filter(id=group_id, admin=request.user).exists()
+        return True
+
+    def has_object_permission(self, request: Request, view: object, obj: ReadingGroup) -> bool:
+        if request.method in permissions.SAFE_METHODS:
+            return True
+        return obj.admin == request.user
+
+
+class IsGroupMember(permissions.BasePermission):
+    """Only group members (including admin) can view group content."""
+
+    def has_permission(self, request: Request, view: object) -> bool:
+        if not request.user.is_authenticated:
+            return False
+        group_id = view.kwargs.get("pk") or view.kwargs.get("group_pk")
+        if group_id:
+            return ReadingGroupMembership.objects.filter(
+                group_id=group_id, user=request.user
+            ).exists()
+        return True
+
+
+class ReadingGroupViewSet(viewsets.ModelViewSet):
+    permission_classes = [permissions.IsAuthenticated, IsGroupAdmin]
+    queryset = ReadingGroup.objects.prefetch_related("memberships__user")
 
     def get_serializer_class(self):
         if self.action == "create":
@@ -42,162 +85,265 @@ class ReadingGroupViewSet(viewsets.ModelViewSet):
             return ReadingGroupDetailSerializer
         return ReadingGroupListSerializer
 
-    def perform_create(self, serializer):
+    def get_queryset(self) -> QuerySet[ReadingGroup]:
-        group = serializer.save(created_by=self.request.user)
+        user = self.request.user
-        # Creator automatically becomes admin member
+        return ReadingGroup.objects.filter(
-        GroupMembership.objects.create(
+            memberships__user=user
-            group=group,
+        ).prefetch_related("memberships__user").distinct()
-            user=self.request.user,
+
-            role=GroupMembership.Role.ADMIN,
+    def perform_create(self, serializer: ReadingGroupCreateSerializer) -> ReadingGroup:
+        group = serializer.save(admin=self.request.user)
+        ReadingGroupMembership.objects.create(
+            user=self.request.user, group=group, role=ReadingGroupMembership.Role.ADMIN
         )
+        return group
 
-    # ── Membership ───────────────────────────────────────────────────────
+    @action(detail=True, methods=["post"], permission_classes=[IsGroupAdmin])
-
+    def add_member(self, request: Request, pk: int | None = None) -> Response:
-    @action(detail=True, methods=["post"], permission_classes=[IsGroupMember])
-    def join(self, request: Request, pk: int | None = None) -> Response:
-        """Join a reading group (public join link)."""
         group = self.get_object()
-        membership, created = GroupMembership.objects.get_or_create(
+        member_serializer = AddMemberSerializer(data=request.data)
-            group=group, user=request.user
+        member_serializer.is_valid(raise_exception=True)
-        )
-        if not created:
-            return Response({"detail": "Already a member."}, status=status.HTTP_200_OK)
-        MemberProgress.objects.get_or_create(
-            membership=membership,
-            group=group,
-            user=request.user,
-            defaults={"current_section": 0, "percentage": 0.0},
-        )
-        return Response({"detail": "Joined successfully."}, status=status.HTTP_201_CREATED)
 
-    @action(detail=True, methods=["post"], permission_classes=[IsGroupMember])
+        user_id = member_serializer.validated_data["user_id"]
-    def leave(self, request: Request, pk: int | None = None) -> Response:
+        from django.conf import settings
-        """Leave a reading group."""
+        User = settings.AUTH_USER_MODEL
-        group = self.get_object()
+        new_member = get_object_or_404(User, id=user_id)
-        if group.created_by == request.user:
+
+        if ReadingGroupMembership.objects.filter(group=group, user=new_member).exists():
             return Response(
-                {"error": "Group creator cannot leave. Transfer ownership or delete the group."},
+                {"detail": "User is already a member of this group."},
+                status=status.HTTP_409_CONFLICT,
+            )
+
+        membership = ReadingGroupMembership.objects.create(
+            user=new_member, group=group, role=ReadingGroupMembership.Role.MEMBER
+        )
+        from apps.groups.serializers import ReadingGroupMembershipSerializer
+        return Response(
+            ReadingGroupMembershipSerializer(membership).data,
+            status=status.HTTP_201_CREATED,
+        )
+
+    @action(detail=True, methods=["post"], permission_classes=[IsGroupAdmin])
+    def remove_member(self, request: Request, pk: int | None = None) -> Response:
+        group = self.get_object()
+        member_serializer = AddMemberSerializer(data=request.data)
+        member_serializer.is_valid(raise_exception=True)
+
+        user_id = member_serializer.validated_data["user_id"]
+        if user_id == group.admin_id:
+            return Response(
+                {"detail": "Cannot remove the group admin."},
                 status=status.HTTP_400_BAD_REQUEST,
             )
-        GroupMembership.objects.filter(group=group, user=request.user).delete()
+
+        deleted, _ = ReadingGroupMembership.objects.filter(
+            group=group, user_id=user_id
+        ).delete()
+        if not deleted:
+            return Response(
+                {"detail": "User is not a member of this group."},
+                status=status.HTTP_404_NOT_FOUND,
+            )
         return Response(status=status.HTTP_204_NO_CONTENT)
 
-    @action(detail=True, methods=["get"], permission_classes=[IsGroupMember])
+
-    def members(self, request: Request, pk: int | None = None) -> Response:
+class GroupBookViewSet(viewsets.ModelViewSet):
-        """List group members with their progress."""
+    permission_classes = [permissions.IsAuthenticated, IsGroupAdmin]
-        group = self.get_object()
+
-        memberships = (
+    def get_serializer_class(self):
-            group.memberships.select_related("user")
+        if self.action == "create":
-            .prefetch_related("progress")
+            return GroupBookCreateSerializer
-            .all()
+        if self.action == "retrieve":
+            return GroupBookDetailSerializer
+        return GroupBookListSerializer
+
+    def get_queryset(self) -> QuerySet[GroupBook]:
+        group_id = self.kwargs.get("group_pk")
+        return GroupBook.objects.filter(
+            group_id=group_id
+        ).select_related("ebook", "ebook__user", "uploaded_by").prefetch_related(
+            "sections", "schedules"
         )
-        serializer = GroupMembershipSerializer(memberships, many=True)
-        return Response(serializer.data)
 
-    # ── Progress ─────────────────────────────────────────────────────────
+    def perform_create(self, serializer: GroupBookCreateSerializer) -> GroupBook:
+        group = get_object_or_404(ReadingGroup, id=self.kwargs["group_pk"])
+        ebook = get_object_or_404(EBook, id=serializer.validated_data["ebook_id"])
+        title = serializer.validated_data.get("title") or ebook.title
 
-    @action(detail=True, methods=["get"], permission_classes=[IsGroupMember],
+        # Mark existing active books as replaced
-            url_path="members/progress")
+        GroupBook.objects.filter(group=group, status=GroupBook.Status.ACTIVE).update(
-    def members_progress(self, request: Request, pk: int | None = None) -> Response:
+            status=GroupBook.Status.REPLACED
-        """Get progress for all group members.
-
-        Other members' progress shows section label only (no last_position).
-        Your own progress shows full detail.
-        """
-        group = self.get_object()
-        progress_qs = (
-            MemberProgress.objects.filter(group=group)
-            .select_related("user")
-            .order_by("-percentage")
         )
-        result: list[dict] = []
-        for mp in progress_qs:
-            if mp.user == request.user:
-                result.append(MemberProgressSerializer(mp).data)
-            elif mp.is_public:
-                result.append(MemberProgressPublicSerializer(mp).data)
-            else:
-                result.append({
-                    "user_id": mp.user.id,
-                    "user_email": mp.user.email,
-                    "is_public": False,
-                    "note": "Private",
-                })
-        return Response(result)
 
-    @action(detail=True, methods=["get", "patch"], permission_classes=[IsGroupMember],
+        group_book = GroupBook.objects.create(
-            url_path="progress")
-    def my_progress(self, request: Request, pk: int | None = None) -> Response:
-        """Get or update my own progress in the group."""
-        group = self.get_object()
-        membership = GroupMembership.objects.get(group=group, user=request.user)
-        progress_obj, _created = MemberProgress.objects.get_or_create(
-            membership=membership,
             group=group,
-            user=request.user,
+            ebook=ebook,
+            uploaded_by=self.request.user,
+            title=title,
+            status=GroupBook.Status.ACTIVE,
         )
 
+        # Auto-detect sections
+        try:
+            apply_sections(group_book)
+        except Exception:
+            logger.exception("Auto-section detection failed for group_book %s", group_book.id)
+
+        # Auto-generate schedule
+        try:
+            apply_schedule(group_book)
+        except Exception:
+            logger.exception("Schedule generation failed for group_book %s", group_book.id)
+
+        return group_book
+
+    @action(detail=True, methods=["post"], url_path="detect-sections")
+    def detect_sections_action(self, request: Request, group_pk: int | None = None, pk: int | None = None) -> Response:
+        group_book = self.get_object()
+        try:
+            sections = apply_sections(group_book)
+        except Exception as exc:
+            logger.exception("Section detection failed for group_book %s", group_book.id)
+            return Response({"error": str(exc)}, status=status.HTTP_500_INTERNAL_SERVER_ERROR)
+        return Response(SectionSerializer(sections, many=True).data)
+
+    @action(detail=True, methods=["post"], url_path="adjust-sections")
+    def adjust_sections(self, request: Request, group_pk: int | None = None, pk: int | None = None) -> Response:
+        group_book = self.get_object()
+        adjust_serializer = SectionAdjustSerializer(data=request.data)
+        adjust_serializer.is_valid(raise_exception=True)
+
+        operation = adjust_serializer.validated_data["operation"]
+        section_ids: list[int] = adjust_serializer.validated_data["section_ids"]
+
+        if operation == "merge":
+            if len(section_ids) < 2:
+                return Response(
+                    {"error": "At least 2 section IDs required for merge."},
+                    status=status.HTTP_400_BAD_REQUEST,
+                )
+            sections = list(
+                Section.objects.filter(id__in=section_ids, group_book=group_book).order_by("order")
+            )
+            if len(sections) < 2:
+                return Response(
+                    {"error": "Not enough valid sections found."},
+                    status=status.HTTP_400_BAD_REQUEST,
+                )
+            merged_title = " — ".join(s.title for s in sections)
+            merged_minutes = sum(s.estimated_reading_minutes for s in sections)
+            merged_start = sections[0].start_chapter_index
+            merged_end = sections[-1].end_chapter_index
+            merged_order = sections[0].order
+
+            # Delete old sections
+            Section.objects.filter(id__in=section_ids, group_book=group_book).delete()
+
+            # Create merged section
+            merged = Section.objects.create(
+                group_book=group_book,
+                title=merged_title,
+                order=merged_order,
+                start_chapter_index=merged_start,
+                end_chapter_index=merged_end,
+                estimated_reading_minutes=merged_minutes,
+            )
+            # Reorder remaining sections
+            _renumber_sections(group_book)
+            return Response(SectionSerializer(merged).data)
+
+        if operation == "split":
+            if len(section_ids) != 1:
+                return Response(
+                    {"error": "Exactly 1 section ID required for split."},
+                    status=status.HTTP_400_BAD_REQUEST,
+                )
+            split_at = adjust_serializer.validated_data.get("split_at", 2)
+            section = get_object_or_404(Section, id=section_ids[0], group_book=group_book)
+            chapters = section.end_chapter_index - section.start_chapter_index
+            if chapters < split_at:
+                return Response(
+                    {"error": f"Section only has {chapters} chapters, cannot split into {split_at}."},
+                    status=status.HTTP_400_BAD_REQUEST,
+                )
+
+            # Delete original
+            orig_order = section.order
+            orig_title = section.title
+            section.delete()
+
+            # Create split sections
+            chunk_size = max(1, chapters // split_at)
+            new_sections: list[Section] = []
+            for i in range(split_at):
+                start_idx = section.start_chapter_index + i * chunk_size
+                end_idx = start_idx + chunk_size if i < split_at - 1 else section.end_chapter_index
+                minutes_each = max(1, section.estimated_reading_minutes // split_at)
+                new_sec = Section.objects.create(
+                    group_book=group_book,
+                    title=f"{orig_title} (Part {i + 1})",
+                    order=orig_order + i,
+                    start_chapter_index=start_idx,
+                    end_chapter_index=end_idx,
+                    estimated_reading_minutes=minutes_each,
+                )
+                new_sections.append(new_sec)
+
+            _renumber_sections(group_book)
+            return Response(SectionSerializer(new_sections, many=True).data)
+
+        return Response({"error": "Invalid operation."}, status=status.HTTP_400_BAD_REQUEST)
+
+    @action(detail=True, methods=["get", "post", "delete"], url_path="schedule")
+    def schedule(self, request: Request, group_pk: int | None = None, pk: int | None = None) -> Response:
+        group_book = self.get_object()
+
         if request.method == "GET":
-            serializer = MemberProgressSerializer(progress_obj)
+            schedules = ReadingSchedule.objects.filter(group_book=group_book).order_by("meeting_number")
-            return Response(serializer.data)
+            return Response(ReadingScheduleSerializer(schedules, many=True).data)
 
-        # PATCH — update progress
+        if request.method == "POST":
-        update_serializer = MemberProgressUpdateSerializer(data=request.data)
+            ReadingSchedule.objects.filter(group_book=group_book).delete()
-        update_serializer.is_valid(raise_exception=True)
+            num_meetings = int(request.data.get("num_meetings", 4))
-        data = update_serializer.validated_data
+            try:
+                schedules = apply_schedule(group_book, num_meetings=num_meetings)
+            except Exception as exc:
+                logger.exception("Schedule generation failed for group_book %s", group_book.id)
+                return Response({"error": str(exc)}, status=status.HTTP_500_INTERNAL_SERVER_ERROR)
+            return Response(
+                ReadingScheduleSerializer(schedules, many=True).data,
+                status=status.HTTP_201_CREATED,
+            )
 
-        progress_obj.update_progress(
+        if request.method == "DELETE":
-            current_section=data["current_section"],
+            ReadingSchedule.objects.filter(group_book=group_book).delete()
-            percentage=data.get("percentage"),
+            return Response(status=status.HTTP_204_NO_CONTENT)
-            time_spent_delta=data.get("time_spent_delta", 0),
+
-            last_position=data.get("last_position"),
+    @action(detail=True, methods=["get", "patch"], url_path="progress")
+    def progress(self, request: Request, group_pk: int | None = None, pk: int | None = None) -> Response:
+        group_book = self.get_object()
+
+        if request.method == "GET":
+            progress_records = MemberProgress.objects.filter(
+                group_book=group_book
+            ).select_related("user", "current_section")
+            return Response(MemberProgressSerializer(progress_records, many=True).data)
+
+        # PATCH: update own progress
+        progress_obj, _created = MemberProgress.objects.get_or_create(
+            user=request.user, group_book=group_book,
         )
-        if "is_public" in data:
+        serializer = MemberProgressSerializer(progress_obj, data=request.data, partial=True)
-            progress_obj.is_public = data["is_public"]
+        serializer.is_valid(raise_exception=True)
-            progress_obj.save(update_fields=["is_public"])
+        serializer.save()
-
-        serializer = MemberProgressSerializer(progress_obj)
         return Response(serializer.data)
 
-    # ── Admin ────────────────────────────────────────────────────────────
 
-    @action(detail=True, methods=["get"], permission_classes=[IsGroupAdmin],
+def _renumber_sections(group_book: GroupBook) -> None:
-            url_path="progress/summary")
+    """Re-number sections sequentially by their current order."""
-    def progress_summary(self, request: Request, pk: int | None = None) -> Response:
+    sections = list(Section.objects.filter(group_book=group_book).order_by("order"))
-        """Admin summary of all member progress."""
+    for idx, section in enumerate(sections):
-        group = self.get_object()
+        if section.order != idx + 1:
-        progress_qs = MemberProgress.objects.filter(group=group).select_related("user")
+            section.order = idx + 1
-
+            section.save(update_fields=["order"])
-        total_members = group.memberships.count()
-        members_started = progress_qs.filter(current_section__gt=0).count()
-        members_finished = progress_qs.filter(percentage__gte=100.0).count()
-
-        avg_pct = progress_qs.aggregate(avg=models.Avg("percentage"))["avg"] or 0.0
-        avg_time = progress_qs.aggregate(avg=models.Avg("time_spent_seconds"))["avg"] or 0.0
-
-        member_details: list[dict] = []
-        for mp in progress_qs:
-            member_details.append({
-                "user_id": mp.user.id,
-                "user_email": mp.user.email,
-                "current_section": mp.current_section,
-                "percentage": mp.percentage,
-                "time_spent_seconds": mp.time_spent_seconds,
-                "is_public": mp.is_public,
-                "updated_at": mp.updated_at,
-            })
-
-        summary_data = {
-            "group_id": group.id,
-            "group_name": group.name,
-            "ebook_title": group.ebook.title,
-            "total_members": total_members,
-            "members_started": members_started,
-            "members_finished": members_finished,
-            "average_percentage": round(avg_pct, 1),
-            "average_time_spent_hours": round(avg_time / 3600.0, 1) if avg_time else 0.0,
-            "member_details": member_details,
-        }
-        serializer = AdminProgressSummarySerializer(data=summary_data)
-        serializer.is_valid(raise_exception=True)
-        return Response(serializer.data)

backend/config/django.py

@@ -39,9 +39,9 @@ INSTALLED_APPS = [
     # Local apps
     "apps.users",
     "apps.books",
+    "apps.groups",
     "apps.annotations",
     "apps.reader",
-    "apps.groups",
 ]
 
 MIDDLEWARE = [

backend/config/urls.py

@@ -6,9 +6,9 @@ urlpatterns = [
     path("admin/", admin.site.urls),
     path("api/auth/", include("apps.users.urls")),
     path("api/books/", include("apps.books.urls")),
+    path("api/groups/", include("apps.groups.urls")),
     path("api/annotations/", include("apps.annotations.urls")),
     path("api/reader/", include("apps.reader.urls")),
-    path("api/groups/", include("apps.groups.urls")),
 ]
 
 if settings.DEBUG:

frontend/src/App.tsx

@@ -12,8 +12,9 @@ const AddBookPage = lazy(() => import("./pages/AddBook").then((m) => ({ default:
 const SettingsPage = lazy(() => import("./pages/Settings").then((m) => ({ default: m.SettingsPage })));
 const BookmarksNotesPage = lazy(() => import("./components/annotations/BookmarksNotesPage").then((m) => ({ default: m.BookmarksNotesPage })));
 const ReadingPage = lazy(() => import("./pages/ReadingPage").then((m) => ({ default: m.default })));
-const ReadingGroupsPage = lazy(() => import("./pages/ReadingGroups").then((m) => ({ default: m.ReadingGroupsPage })));
+const GroupsPage = lazy(() => import("./pages/GroupsPage").then((m) => ({ default: m.GroupsPage })));
-const GroupDetailPage = lazy(() => import("./pages/GroupDetail").then((m) => ({ default: m.GroupDetailPage })));
+const GroupDetailPage = lazy(() => import("./pages/GroupDetailPage").then((m) => ({ default: m.GroupDetailPage })));
+const GroupBookPage = lazy(() => import("./pages/GroupBookPage").then((m) => ({ default: m.GroupBookPage })));
 
 const AuthPage = lazy(() => import("./pages/AuthPage"));
 
@@ -46,9 +47,10 @@ function AppRoutes() {
         <Route path="/reader/:id" element={<ProtectedRoute><ReaderRedirect /></ProtectedRoute>} />
         <Route path="/add" element={<ProtectedRoute><AddBookPage /></ProtectedRoute>} />
         <Route path="/settings" element={<ProtectedRoute><SettingsPage /></ProtectedRoute>} />
+        <Route path="/groups" element={<ProtectedRoute><GroupsPage /></ProtectedRoute>} />
+        <Route path="/groups/:groupId" element={<ProtectedRoute><GroupDetailPage /></ProtectedRoute>} />
+        <Route path="/groups/:groupId/books/:bookId" element={<ProtectedRoute><GroupBookPage /></ProtectedRoute>} />
         <Route path="/bookmarks-notes/:bookId?" element={<ProtectedRoute><BookmarksNotesPage /></ProtectedRoute>} />
-        <Route path="/groups" element={<ProtectedRoute><ReadingGroupsPage /></ProtectedRoute>} />
-        <Route path="/groups/:id" element={<ProtectedRoute><GroupDetailPage /></ProtectedRoute>} />
         <Route path="*" element={<Navigate to="/" replace />} />
       </Routes>
     </Suspense>

frontend/src/api/groups.ts

@@ -1,21 +1,27 @@
 import api from "./client";
 import type {
-  AdminProgressSummary,
+  AddMemberPayload,
+  AdjustSectionsPayload,
+  CreateGroupBookPayload,
   CreateGroupPayload,
-  MemberProgressDetail,
+  GroupBook,
-  MemberProgressEntry,
+  GroupBookDetail,
+  MemberProgress,
+  ReadingGroup,
   ReadingGroupDetail,
-  ReadingGroupSummary,
+  ReadingSchedule,
-  UpdateProgressPayload,
+  Section,
-} from "../types/groups";
+} from "../types/group";
 
 export const groupsApi = {
-  /* ── Groups ── */
+  // ---- Reading Groups ----
 
-  async listGroups(): Promise<ReadingGroupSummary[]> {
+  async listGroups(): Promise<ReadingGroup[]> {
-    const { data } = await api.get<ReadingGroupSummary[]>("/groups/");
+    const { data } = await api.get<{ count: number; results: ReadingGroup[] } | ReadingGroup[]>(
+      "/groups/"
+    );
     if (Array.isArray(data)) return data;
-    return (data as { results: ReadingGroupSummary[] }).results ?? [];
+    return data.results ?? [];
   },
 
   async getGroup(id: number): Promise<ReadingGroupDetail> {
@@ -23,8 +29,8 @@ export const groupsApi = {
     return data;
   },
 
-  async createGroup(payload: CreateGroupPayload): Promise<ReadingGroupDetail> {
+  async createGroup(payload: CreateGroupPayload): Promise<ReadingGroup> {
-    const { data } = await api.post<ReadingGroupDetail>("/groups/", payload);
+    const { data } = await api.post<ReadingGroup>("/groups/", payload);
     return data;
   },
 
@@ -32,49 +38,113 @@ export const groupsApi = {
     await api.delete(`/groups/${id}/`);
   },
 
-  /* ── Membership ── */
+  async addMember(groupId: number, payload: AddMemberPayload): Promise<void> {
+    await api.post(`/groups/${groupId}/add_member/`, payload);
+  },
 
-  async joinGroup(id: number): Promise<{ detail: string }> {
+  async removeMember(groupId: number, payload: AddMemberPayload): Promise<void> {
-    const { data } = await api.post<{ detail: string }>(`/groups/${id}/join/`);
+    await api.post(`/groups/${groupId}/remove_member/`, payload);
+  },
+
+  // ---- Group Books ----
+
+  async listGroupBooks(groupId: number): Promise<GroupBook[]> {
+    const { data } = await api.get<GroupBook[]>(`/groups/${groupId}/books/`);
+    return Array.isArray(data) ? data : (data as { results: GroupBook[] }).results ?? [];
+  },
+
+  async getGroupBook(groupId: number, bookId: number): Promise<GroupBookDetail> {
+    const { data } = await api.get<GroupBookDetail>(`/groups/${groupId}/books/${bookId}/`);
     return data;
   },
 
-  async leaveGroup(id: number): Promise<void> {
+  async createGroupBook(
-    await api.post(`/groups/${id}/leave/`);
-  },
-
-  /* ── Progress ── */
-
-  async getMembersProgress(groupId: number): Promise<MemberProgressEntry[]> {
-    const { data } = await api.get<MemberProgressEntry[]>(
-      `/groups/${groupId}/members/progress/`,
-    );
-    return data;
-  },
-
-  async getMyProgress(groupId: number): Promise<MemberProgressDetail> {
-    const { data } = await api.get<MemberProgressDetail>(
-      `/groups/${groupId}/progress/`,
-    );
-    return data;
-  },
-
-  async updateMyProgress(
     groupId: number,
-    payload: UpdateProgressPayload,
+    payload: CreateGroupBookPayload
-  ): Promise<MemberProgressDetail> {
+  ): Promise<GroupBookDetail> {
-    const { data } = await api.patch<MemberProgressDetail>(
+    const { data } = await api.post<GroupBookDetail>(
-      `/groups/${groupId}/progress/`,
+      `/groups/${groupId}/books/`,
-      payload,
+      payload
     );
     return data;
   },
 
-  /* ── Admin ── */
+  async deleteGroupBook(groupId: number, bookId: number): Promise<void> {
+    await api.delete(`/groups/${groupId}/books/${bookId}/`);
+  },
 
-  async getProgressSummary(groupId: number): Promise<AdminProgressSummary> {
+  // ---- Sections ----
-    const { data } = await api.get<AdminProgressSummary>(
+
-      `/groups/${groupId}/progress/summary/`,
+  async detectSections(
+    groupId: number,
+    bookId: number
+  ): Promise<Section[]> {
+    const { data } = await api.post<Section[]>(
+      `/groups/${groupId}/books/${bookId}/detect-sections/`
+    );
+    return data;
+  },
+
+  async adjustSections(
+    groupId: number,
+    bookId: number,
+    payload: AdjustSectionsPayload
+  ): Promise<Section | Section[]> {
+    const { data } = await api.post<Section | Section[]>(
+      `/groups/${groupId}/books/${bookId}/adjust-sections/`,
+      payload
+    );
+    return data;
+  },
+
+  // ---- Schedule ----
+
+  async getSchedule(
+    groupId: number,
+    bookId: number
+  ): Promise<ReadingSchedule[]> {
+    const { data } = await api.get<ReadingSchedule[]>(
+      `/groups/${groupId}/books/${bookId}/schedule/`
+    );
+    return data;
+  },
+
+  async generateSchedule(
+    groupId: number,
+    bookId: number,
+    numMeetings: number = 4
+  ): Promise<ReadingSchedule[]> {
+    const { data } = await api.post<ReadingSchedule[]>(
+      `/groups/${groupId}/books/${bookId}/schedule/`,
+      { num_meetings: numMeetings }
+    );
+    return data;
+  },
+
+  async deleteSchedule(groupId: number, bookId: number): Promise<void> {
+    await api.delete(`/groups/${groupId}/books/${bookId}/schedule/`);
+  },
+
+  // ---- Progress ----
+
+  async getProgress(
+    groupId: number,
+    bookId: number
+  ): Promise<MemberProgress[]> {
+    const { data } = await api.get<MemberProgress[]>(
+      `/groups/${groupId}/books/${bookId}/progress/`
+    );
+    return data;
+  },
+
+  async updateProgress(
+    groupId: number,
+    bookId: number,
+    payload: { current_section?: number; completed_sections?: number[] }
+  ): Promise<MemberProgress> {
+    const { data } = await api.patch<MemberProgress>(
+      `/groups/${groupId}/books/${bookId}/progress/`,
+      payload
     );
     return data;
   },

frontend/src/locales/en-US.ts

@@ -245,6 +245,54 @@ const enUS = {
     home: "Home",
     bookmarksNotes: "Bookmarks & Notes",
   },
+  groups: {
+    title: "Reading Groups",
+    createGroup: "Create Group",
+    create: "Create",
+    cancel: "Cancel",
+    groupName: "Group Name",
+    groupNamePlaceholder: "Enter group name",
+    description: "Description",
+    descriptionPlaceholder: "What is this group about?",
+    optional: "Optional",
+    noGroups: "No groups yet",
+    noGroupsHint: "Create a reading group to start reading together!",
+    members: "Members",
+    admin: "Admin",
+    addMember: "Add Member",
+    memberIdPlaceholder: "Enter user ID",
+    add: "Add",
+    remove: "Remove",
+    books: "Group Books",
+    uploadEpub: "Upload EPUB",
+    selectEbook: "Select an EPUB to share with the group",
+    noEpubBooks: "No EPUB files uploaded yet",
+    uploadFirst: "Upload an EPUB first",
+    confirmUpload: "Confirm Upload",
+    noBooks: "No books in this group yet",
+    sections: "Sections",
+    schedule: "Schedule",
+    progress: "Progress",
+    detectSections: "Auto-Detect Sections",
+    mergeSections: "Merge Sections",
+    selectSectionsHint: "Click sections to select for merging",
+    merge: "Merge",
+    clear: "Clear",
+    split: "Split",
+    splitInto: "Split into",
+    parts: "parts",
+    splitBtn: "Split",
+    noSections: "No sections detected yet",
+    noSectionsHint: 'Click "Auto-Detect Sections" to parse the EPUB chapters into reading sections.',
+    readingSchedule: "Reading Schedule",
+    generateSchedule: "Generate Schedule",
+    noSchedule: "No schedule generated yet",
+    noScheduleHint: "Detect sections first, then generate a reading schedule for your group.",
+    meeting: "Meeting",
+    memberProgress: "Member Progress",
+    noProgress: "No progress data yet",
+    noProgressHint: "Members will show progress once they start reading.",
+  },
 } as const;
 
 export default enUS;

frontend/src/locales/es-ES.ts

@@ -247,6 +247,54 @@ const esES: Locale = {
     home: "Inicio",
     bookmarksNotes: "Marcadores y notas",
   },
+  groups: {
+    title: "Grupos de Lectura",
+    createGroup: "Crear Grupo",
+    create: "Crear",
+    cancel: "Cancelar",
+    groupName: "Nombre del Grupo",
+    groupNamePlaceholder: "Ingresa el nombre del grupo",
+    description: "Descripción",
+    descriptionPlaceholder: "¿De qué trata este grupo?",
+    optional: "Opcional",
+    noGroups: "Aún no hay grupos",
+    noGroupsHint: "¡Crea un grupo de lectura para leer juntos!",
+    members: "Miembros",
+    admin: "Admin",
+    addMember: "Agregar Miembro",
+    memberIdPlaceholder: "Ingresa ID de usuario",
+    add: "Agregar",
+    remove: "Eliminar",
+    books: "Libros del Grupo",
+    uploadEpub: "Subir EPUB",
+    selectEbook: "Selecciona un EPUB para compartir con el grupo",
+    noEpubBooks: "No hay archivos EPUB subidos aún",
+    uploadFirst: "Sube un EPUB primero",
+    confirmUpload: "Confirmar Subida",
+    noBooks: "No hay libros en este grupo aún",
+    sections: "Secciones",
+    schedule: "Calendario",
+    progress: "Progreso",
+    detectSections: "Auto-Detectar Secciones",
+    mergeSections: "Fusionar Secciones",
+    selectSectionsHint: "Haz clic en las secciones para seleccionar y fusionar",
+    merge: "Fusionar",
+    clear: "Limpiar",
+    split: "Dividir",
+    splitInto: "Dividir en",
+    parts: "partes",
+    splitBtn: "Dividir",
+    noSections: "No se detectaron secciones",
+    noSectionsHint: 'Haz clic en "Auto-Detectar Secciones" para analizar los capítulos del EPUB.',
+    readingSchedule: "Calendario de Lectura",
+    generateSchedule: "Generar Calendario",
+    noSchedule: "No hay calendario generado",
+    noScheduleHint: "Detecta secciones primero, luego genera un calendario de lectura para tu grupo.",
+    meeting: "Reunión",
+    memberProgress: "Progreso de Miembros",
+    noProgress: "Sin datos de progreso",
+    noProgressHint: "Los miembros mostrarán progreso cuando comiencen a leer.",
+  },
 };
 
 export default esES;

frontend/src/pages/GroupBookPage.tsx

@@ -0,0 +1,426 @@
+import React, { useCallback, useEffect, useState } from "react";
+import { useNavigate, useParams } from "react-router-dom";
+import { useTranslation } from "react-i18n-lite";
+import { groupsApi } from "../api/groups";
+import { getApiErrorMessage } from "../api/errors";
+import type {
+  GroupBookDetail,
+  ReadingSchedule,
+  Section,
+  MemberProgress,
+} from "../types/group";
+
+export function GroupBookPage() {
+  const { t } = useTranslation();
+  const navigate = useNavigate();
+  const { groupId, bookId } = useParams<{ groupId: string; bookId: string }>();
+
+  const [book, setBook] = useState<GroupBookDetail | null>(null);
+  const [sections, setSections] = useState<Section[]>([]);
+  const [schedules, setSchedules] = useState<ReadingSchedule[]>([]);
+  const [progress, setProgress] = useState<MemberProgress[]>([]);
+  const [loading, setLoading] = useState(true);
+  const [error, setError] = useState<string | null>(null);
+  const [tab, setTab] = useState<"sections" | "schedule" | "progress">("sections");
+
+  // Merge state
+  const [selectedForMerge, setSelectedForMerge] = useState<number[]>([]);
+  const [splitSectionId, setSplitSectionId] = useState<number | null>(null);
+  const [splitAt, setSplitAt] = useState(2);
+
+  const gId = Number(groupId);
+  const bId = Number(bookId);
+
+  const loadData = useCallback(async () => {
+    if (!gId || !bId) return;
+    setLoading(true);
+    try {
+      const [bookData, schedData, progData] = await Promise.all([
+        groupsApi.getGroupBook(gId, bId),
+        groupsApi.getSchedule(gId, bId).catch(() => [] as ReadingSchedule[]),
+        groupsApi.getProgress(gId, bId).catch(() => [] as MemberProgress[]),
+      ]);
+      setBook(bookData);
+      setSections(bookData.sections ?? []);
+      setSchedules(schedData);
+      setProgress(progData);
+    } catch (err) {
+      setError(getApiErrorMessage(err, "Failed to load book"));
+    } finally {
+      setLoading(false);
+    }
+  }, [gId, bId]);
+
+  useEffect(() => {
+    loadData();
+  }, [loadData]);
+
+  const handleDetectSections = async () => {
+    if (!gId || !bId) return;
+    try {
+      const newSections = await groupsApi.detectSections(gId, bId);
+      setSections(newSections);
+    } catch (err) {
+      setError(getApiErrorMessage(err, "Failed to detect sections"));
+    }
+  };
+
+  const handleMerge = async () => {
+    if (selectedForMerge.length < 2 || !gId || !bId) return;
+    try {
+      await groupsApi.adjustSections(gId, bId, {
+        operation: "merge",
+        section_ids: selectedForMerge,
+      });
+      setSelectedForMerge([]);
+      await loadData();
+    } catch (err) {
+      setError(getApiErrorMessage(err, "Failed to merge sections"));
+    }
+  };
+
+  const handleSplit = async () => {
+    if (!splitSectionId || !gId || !bId) return;
+    try {
+      await groupsApi.adjustSections(gId, bId, {
+        operation: "split",
+        section_ids: [splitSectionId],
+        split_at: splitAt,
+      });
+      setSplitSectionId(null);
+      await loadData();
+    } catch (err) {
+      setError(getApiErrorMessage(err, "Failed to split section"));
+    }
+  };
+
+  const handleGenerateSchedule = async () => {
+    if (!gId || !bId) return;
+    try {
+      const newSched = await groupsApi.generateSchedule(gId, bId, 4);
+      setSchedules(newSched);
+    } catch (err) {
+      setError(getApiErrorMessage(err, "Failed to generate schedule"));
+    }
+  };
+
+  const toggleMergeSelect = (id: number) => {
+    setSelectedForMerge((prev) =>
+      prev.includes(id) ? prev.filter((s) => s !== id) : [...prev, id]
+    );
+  };
+
+  const formatMinutes = (mins: number): string => {
+    if (mins < 60) return `${mins}m`;
+    const h = Math.floor(mins / 60);
+    const m = mins % 60;
+    return m > 0 ? `${h}h ${m}m` : `${h}h`;
+  };
+
+  if (loading) {
+    return (
+      <div style={{ maxWidth: 800, margin: "0 auto", padding: 16, minHeight: "100vh", background: "#f8f9fa" }}>
+        <p style={{ textAlign: "center", color: "#888", padding: 40 }}>{t("common.loading")}</p>
+      </div>
+    );
+  }
+
+  if (!book) {
+    return (
+      <div style={{ maxWidth: 800, margin: "0 auto", padding: 16, minHeight: "100vh", background: "#f8f9fa" }}>
+        <p style={{ textAlign: "center", color: "#e74c3c", padding: 40 }}>Book not found</p>
+        <button onClick={() => navigate(`/groups/${groupId}`)} style={{ display: "block", margin: "0 auto" }}>← Back</button>
+      </div>
+    );
+  }
+
+  return (
+    <div style={{ maxWidth: 800, margin: "0 auto", padding: 16, minHeight: "100vh", background: "#f8f9fa" }}>
+      {/* Header */}
+      <header style={{ display: "flex", justifyContent: "space-between", alignItems: "center", padding: "16px 0", borderBottom: "1px solid #eee", marginBottom: 20 }}>
+        <div>
+          <h1 style={{ fontSize: 24, fontWeight: 700, color: "#1a1a2e", margin: 0 }}>{book.title}</h1>
+          <p style={{ margin: 4, fontSize: 13, color: "#888" }}>
+            {book.ebook.author && `by ${book.ebook.author} · `}
+            {book.ebook.page_count} chapters · {book.ebook.format.toUpperCase()}
+          </p>
+        </div>
+        <button onClick={() => navigate(`/groups/${groupId}`)} style={{ padding: "8px 16px", borderRadius: 6, border: "1px solid #ddd", background: "#fff", cursor: "pointer", fontSize: 14 }}>
+          ← {t("common.back")}
+        </button>
+      </header>
+
+      {error && (
+        <div style={{ background: "#fde8e8", padding: 12, borderRadius: 6, color: "#e74c3c", fontSize: 14, marginBottom: 16 }}>
+          {error}
+          <button onClick={() => setError(null)} style={{ marginLeft: 12, background: "none", border: "none", cursor: "pointer", fontWeight: 600 }}>✕</button>
+        </div>
+      )}
+
+      {/* Tabs */}
+      <div style={{ display: "flex", gap: 4, marginBottom: 20, background: "#eee", borderRadius: 8, padding: 4 }}>
+        {(["sections", "schedule", "progress"] as const).map((t) => (
+          <button
+            key={t}
+            onClick={() => setTab(t)}
+            style={{
+              flex: 1, padding: "10px 16px", borderRadius: 6, border: "none",
+              fontSize: 14, fontWeight: 600, cursor: "pointer",
+              background: tab === t ? "#fff" : "transparent",
+              color: tab === t ? "#1a1a2e" : "#888",
+              boxShadow: tab === t ? "0 1px 4px rgba(0,0,0,0.1)" : "none",
+            }}
+          >
+            {t === "sections" ? t("groups.sections") : t === "schedule" ? t("groups.schedule") : t("groups.progress")}
+          </button>
+        ))}
+      </div>
+
+      {/* Sections Tab */}
+      {tab === "sections" && (
+        <section>
+          <div style={{ display: "flex", justifyContent: "space-between", alignItems: "center", marginBottom: 16 }}>
+            <h2 style={{ fontSize: 18, fontWeight: 600, color: "#1a1a2e", margin: 0 }}>
+              {sections.length} {t("groups.sections")}
+            </h2>
+            <div style={{ display: "flex", gap: 8 }}>
+              <button
+                onClick={handleDetectSections}
+                style={{ padding: "8px 16px", borderRadius: 6, border: "none", background: "#1a1a2e", color: "#fff", fontSize: 13, fontWeight: 600, cursor: "pointer" }}
+              >
+                {t("groups.detectSections")}
+              </button>
+            </div>
+          </div>
+
+          {/* Merge controls */}
+          <div style={{ background: "#fff", padding: 16, borderRadius: 10, marginBottom: 12, boxShadow: "0 1px 4px rgba(0,0,0,0.06)" }}>
+            <div style={{ display: "flex", alignItems: "center", gap: 10, flexWrap: "wrap" }}>
+              <span style={{ fontSize: 14, fontWeight: 600, color: "#555" }}>{t("groups.mergeSections")}:</span>
+              <span style={{ fontSize: 13, color: "#888" }}>
+                {selectedForMerge.length === 0
+                  ? t("groups.selectSectionsHint")
+                  : `${selectedForMerge.length} selected`}
+              </span>
+              {selectedForMerge.length >= 2 && (
+                <button
+                  onClick={handleMerge}
+                  style={{ padding: "6px 14px", borderRadius: 6, border: "none", background: "#27ae60", color: "#fff", fontSize: 13, fontWeight: 600, cursor: "pointer" }}
+                >
+                  {t("groups.merge")}
+                </button>
+              )}
+              {selectedForMerge.length > 0 && (
+                <button
+                  onClick={() => setSelectedForMerge([])}
+                  style={{ padding: "6px 12px", borderRadius: 6, border: "1px solid #ddd", background: "#fff", fontSize: 13, cursor: "pointer" }}
+                >
+                  {t("groups.clear")}
+                </button>
+              )}
+            </div>
+          </div>
+
+          {sections.length === 0 ? (
+            <div style={{ textAlign: "center", padding: 40, color: "#888" }}>
+              <p style={{ fontSize: 16 }}>{t("groups.noSections")}</p>
+              <p style={{ fontSize: 14 }}>{t("groups.noSectionsHint")}</p>
+            </div>
+          ) : (
+            <div style={{ display: "flex", flexDirection: "column", gap: 10 }}>
+              {sections.map((section) => (
+                <div
+                  key={section.id}
+                  style={{
+                    background: selectedForMerge.includes(section.id) ? "#e8f0fe" : "#fff",
+                    border: selectedForMerge.includes(section.id) ? "2px solid #1a1a2e" : "1px solid #eee",
+                    padding: 16, borderRadius: 10, cursor: "pointer",
+                    boxShadow: "0 1px 4px rgba(0,0,0,0.06)",
+                    transition: "all 0.15s",
+                  }}
+                  onClick={() => toggleMergeSelect(section.id)}
+                >
+                  <div style={{ display: "flex", justifyContent: "space-between", alignItems: "flex-start" }}>
+                    <div style={{ flex: 1 }}>
+                      <div style={{ display: "flex", alignItems: "center", gap: 8 }}>
+                        <span style={{
+                          background: "#1a1a2e", color: "#fff", borderRadius: 20,
+                          width: 26, height: 26, display: "flex", alignItems: "center", justifyContent: "center",
+                          fontSize: 13, fontWeight: 700, flexShrink: 0,
+                        }}>
+                          {section.order}
+                        </span>
+                        <h3 style={{ margin: 0, fontSize: 15, fontWeight: 600, color: "#1a1a2e" }}>{section.title}</h3>
+                      </div>
+                      <p style={{ margin: "6px 0 0 34px", fontSize: 13, color: "#888" }}>
+                        Ch. {section.start_chapter_index}–{section.end_chapter_index - 1} · ~{formatMinutes(section.estimated_reading_minutes)} reading time
+                      </p>
+                    </div>
+                    <button
+                      onClick={(e) => {
+                        e.stopPropagation();
+                        setSplitSectionId(splitSectionId === section.id ? null : section.id);
+                      }}
+                      style={{
+                        padding: "4px 10px", borderRadius: 4, border: "1px solid #ddd",
+                        background: splitSectionId === section.id ? "#1a1a2e" : "#fff",
+                        color: splitSectionId === section.id ? "#fff" : "#666",
+                        fontSize: 12, cursor: "pointer", flexShrink: 0,
+                      }}
+                    >
+                      {t("groups.split")}
+                    </button>
+                  </div>
+                  {splitSectionId === section.id && (
+                    <div
+                      style={{ marginTop: 10, padding: 10, background: "#f8f9fa", borderRadius: 6, display: "flex", alignItems: "center", gap: 8 }}
+                      onClick={(e) => e.stopPropagation()}
+                    >
+                      <span style={{ fontSize: 13 }}>{t("groups.splitInto")}</span>
+                      <input
+                        type="number"
+                        value={splitAt}
+                        min={2}
+                        max={10}
+                        onChange={(e) => setSplitAt(Number(e.target.value))}
+                        style={{ width: 50, padding: "4px 8px", borderRadius: 4, border: "1px solid #ddd", fontSize: 13, textAlign: "center" }}
+                      />
+                      <span style={{ fontSize: 13 }}>{t("groups.parts")}</span>
+                      <button
+                        onClick={handleSplit}
+                        style={{ padding: "4px 12px", borderRadius: 4, border: "none", background: "#1a1a2e", color: "#fff", fontSize: 12, cursor: "pointer" }}
+                      >
+                        {t("groups.splitBtn")}
+                      </button>
+                    </div>
+                  )}
+                </div>
+              ))}
+            </div>
+          )}
+        </section>
+      )}
+
+      {/* Schedule Tab */}
+      {tab === "schedule" && (
+        <section>
+          <div style={{ display: "flex", justifyContent: "space-between", alignItems: "center", marginBottom: 16 }}>
+            <h2 style={{ fontSize: 18, fontWeight: 600, color: "#1a1a2e", margin: 0 }}>
+              {t("groups.readingSchedule")}
+            </h2>
+            <button
+              onClick={handleGenerateSchedule}
+              style={{ padding: "8px 16px", borderRadius: 6, border: "none", background: "#1a1a2e", color: "#fff", fontSize: 13, fontWeight: 600, cursor: "pointer" }}
+            >
+              {t("groups.generateSchedule")}
+            </button>
+          </div>
+
+          {schedules.length === 0 ? (
+            <div style={{ textAlign: "center", padding: 40, color: "#888" }}>
+              <p style={{ fontSize: 16 }}>{t("groups.noSchedule")}</p>
+              <p style={{ fontSize: 14 }}>{t("groups.noScheduleHint")}</p>
+            </div>
+          ) : (
+            <div style={{ display: "flex", flexDirection: "column", gap: 16 }}>
+              {schedules.map((s) => (
+                <div
+                  key={s.id}
+                  style={{ background: "#fff", padding: 20, borderRadius: 12, boxShadow: "0 2px 8px rgba(0,0,0,0.06)" }}
+                >
+                  <div style={{ display: "flex", justifyContent: "space-between", alignItems: "center", marginBottom: 12 }}>
+                    <div>
+                      <h3 style={{ margin: 0, fontSize: 17, fontWeight: 700, color: "#1a1a2e" }}>
+                        {t("groups.meeting")} {s.meeting_number}
+                      </h3>
+                      <p style={{ margin: "4px 0 0", fontSize: 13, color: "#888" }}>
+                        Week of {new Date(s.week_date).toLocaleDateString("en-US", { month: "long", day: "numeric", year: "numeric" })}
+                      </p>
+                    </div>
+                    <span style={{
+                      background: "#f0f0f0", padding: "6px 12px", borderRadius: 20,
+                      fontSize: 13, fontWeight: 600, color: "#555",
+                    }}>
+                      {s.section_details.reduce((sum, sec) => sum + sec.estimated_reading_minutes, 0) > 0
+                        ? `~${formatMinutes(s.section_details.reduce((sum, sec) => sum + sec.estimated_reading_minutes, 0))}`
+                        : ""}
+                    </span>
+                  </div>
+                  <div style={{ display: "flex", flexDirection: "column", gap: 6 }}>
+                    {s.section_details.map((sec) => (
+                      <div
+                        key={sec.id}
+                        style={{
+                          display: "flex", alignItems: "center", gap: 10, padding: "8px 12px",
+                          background: "#f8f9fa", borderRadius: 6, fontSize: 14,
+                        }}
+                      >
+                        <span style={{
+                          background: "#1a1a2e", color: "#fff", borderRadius: 12,
+                          width: 22, height: 22, display: "flex", alignItems: "center", justifyContent: "center",
+                          fontSize: 11, fontWeight: 700, flexShrink: 0,
+                        }}>
+                          {sec.order}
+                        </span>
+                        <span style={{ flex: 1 }}>{sec.title}</span>
+                        <span style={{ fontSize: 12, color: "#999" }}>{formatMinutes(sec.estimated_reading_minutes)}</span>
+                      </div>
+                    ))}
+                  </div>
+                </div>
+              ))}
+            </div>
+          )}
+        </section>
+      )}
+
+      {/* Progress Tab */}
+      {tab === "progress" && (
+        <section>
+          <h2 style={{ fontSize: 18, fontWeight: 600, color: "#1a1a2e", margin: "0 0 16px" }}>
+            {t("groups.memberProgress")}
+          </h2>
+          {progress.length === 0 ? (
+            <div style={{ textAlign: "center", padding: 40, color: "#888" }}>
+              <p style={{ fontSize: 16 }}>{t("groups.noProgress")}</p>
+              <p style={{ fontSize: 14 }}>{t("groups.noProgressHint")}</p>
+            </div>
+          ) : (
+            <div style={{ display: "flex", flexDirection: "column", gap: 10 }}>
+              {progress.map((p) => {
+                const totalSections = sections.length;
+                const completed = p.completed_sections.length;
+                const pct = totalSections > 0 ? Math.round((completed / totalSections) * 100) : 0;
+                return (
+                  <div
+                    key={p.id}
+                    style={{ background: "#fff", padding: 16, borderRadius: 10, boxShadow: "0 1px 4px rgba(0,0,0,0.06)" }}
+                  >
+                    <div style={{ display: "flex", justifyContent: "space-between", alignItems: "center", marginBottom: 8 }}>
+                      <span style={{ fontSize: 15, fontWeight: 600 }}>{p.user_email}</span>
+                      <span style={{ fontSize: 13, color: "#888" }}>{completed}/{totalSections} · {pct}%</span>
+                    </div>
+                    <div style={{ height: 6, background: "#eee", borderRadius: 3, overflow: "hidden" }}>
+                      <div
+                        style={{
+                          height: "100%", borderRadius: 3,
+                          background: "linear-gradient(90deg, #27ae60, #2ecc71)",
+                          width: `${pct}%`, transition: "width 0.3s",
+                        }}
+                      />
+                    </div>
+                    {p.current_section_title && (
+                      <p style={{ margin: "8px 0 0", fontSize: 13, color: "#888" }}>
+                        Currently: {p.current_section_title}
+                      </p>
+                    )}
+                  </div>
+                );
+              })}
+            </div>
+          )}
+        </section>
+      )}
+    </div>
+  );
+}

frontend/src/pages/GroupDetail.tsx

@@ -1,381 +0,0 @@
-import React, { useCallback, useEffect, useState } from "react";
-import { useNavigate, useParams } from "react-router-dom";
-import { useTranslation } from "react-i18n-lite";
-import { groupsApi } from "../api/groups";
-import type {
-  AdminProgressSummary,
-  MemberProgressEntry,
-  ReadingGroupDetail,
-} from "../types/groups";
-import { useMediaQuery, BREAKPOINTS } from "../hooks/useMediaQuery";
-
-function isDetail(entry: MemberProgressEntry): entry is { user_id: number; is_public: boolean; id: number } {
-  return "id" in entry && "is_public" in entry;
-}
-
-export function GroupDetailPage() {
-  const { t } = useTranslation();
-  const { id } = useParams<{ id: string }>();
-  const navigate = useNavigate();
-  const isMobile = useMediaQuery(BREAKPOINTS.md);
-
-  const [group, setGroup] = useState<ReadingGroupDetail | null>(null);
-  const [progressEntries, setProgressEntries] = useState<MemberProgressEntry[]>([]);
-  const [adminSummary, setAdminSummary] = useState<AdminProgressSummary | null>(null);
-  const [loading, setLoading] = useState(true);
-  const [error, setError] = useState<string | null>(null);
-  const [tab, setTab] = useState<"progress" | "admin">("progress");
-
-  const isAdmin = group?.members.some(
-    (m) => m.user_id === (group as ReadingGroupDetail & { _myUserId?: number })._myUserId && m.role === "admin",
-  );
-
-  const loadGroup = useCallback(async () => {
-    if (!id) return;
-    setLoading(true);
-    setError(null);
-    try {
-      const groupId = Number(id);
-      if (Number.isNaN(groupId)) {
-        setError(t("groupDetail.invalidId") ?? "Invalid group ID");
-        return;
-      }
-      const [groupData, progressData] = await Promise.all([
-        groupsApi.getGroup(groupId),
-        groupsApi.getMembersProgress(groupId).catch(() => [] as MemberProgressEntry[]),
-      ]);
-      setGroup(groupData);
-      setProgressEntries(progressData);
-    } catch (err) {
-      setError(err instanceof Error ? err.message : "Failed to load group");
-    } finally {
-      setLoading(false);
-    }
-  }, [id, t]);
-
-  const loadAdminSummary = useCallback(async () => {
-    if (!id || !isAdmin) return;
-    try {
-      const summary = await groupsApi.getProgressSummary(Number(id));
-      setAdminSummary(summary);
-    } catch {
-      // Admin summary is optional
-    }
-  }, [id, isAdmin]);
-
-  useEffect(() => {
-    void loadGroup();
-  }, [loadGroup]);
-
-  useEffect(() => {
-    if (tab === "admin") {
-      void loadAdminSummary();
-    }
-  }, [tab, loadAdminSummary]);
-
-  const handleJoin = useCallback(async () => {
-    if (!id) return;
-    try {
-      await groupsApi.joinGroup(Number(id));
-      void loadGroup();
-    } catch (err) {
-      setError(err instanceof Error ? err.message : "Failed to join");
-    }
-  }, [id, loadGroup]);
-
-  const handleLeave = useCallback(async () => {
-    if (!id) return;
-    try {
-      await groupsApi.leaveGroup(Number(id));
-      navigate("/groups");
-    } catch (err) {
-      setError(err instanceof Error ? err.message : "Failed to leave");
-    }
-  }, [id, navigate]);
-
-  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: 20,
-    minHeight: 44,
-  };
-
-  const tabBarStyle: React.CSSProperties = {
-    display: "flex",
-    gap: 0,
-    marginBottom: 20,
-    borderBottom: "2px solid #e5e7eb",
-  };
-
-  const tabStyle = (active: boolean): React.CSSProperties => ({
-    padding: "10px 20px",
-    fontSize: 14,
-    fontWeight: active ? 600 : 400,
-    color: active ? "#4f46e5" : "#6b7280",
-    background: "transparent",
-    border: "none",
-    borderBottom: active ? "2px solid #4f46e5" : "2px solid transparent",
-    cursor: "pointer",
-    marginBottom: -2,
-  });
-
-  if (loading) {
-    return (
-      <div style={containerStyle}>
-        <div style={{ height: 32, width: 100, background: "#e5e7eb", borderRadius: 6, marginBottom: 20 }} />
-        <div style={{ height: 28, width: "50%", background: "#e5e7eb", borderRadius: 6, marginBottom: 16 }} />
-        {[1, 2, 3].map((i) => (
-          <div key={i} style={{ height: 60, background: "#e5e7eb", borderRadius: 8, marginBottom: 8 }} />
-        ))}
-      </div>
-    );
-  }
-
-  if (error || !group) {
-    return (
-      <div style={containerStyle}>
-        <button onClick={() => navigate("/groups")} style={backButtonStyle}>
-          ← {t("groupDetail.back") ?? "Back"}
-        </button>
-        <div style={{ textAlign: "center", padding: "60px 20px" }}>
-          <div style={{ fontSize: 48, marginBottom: 16 }}>😕</div>
-          <p style={{ color: "#6b7280", fontSize: 16 }}>
-            {error ?? (t("groupDetail.notFound") ?? "Group not found")}
-          </p>
-        </div>
-      </div>
-    );
-  }
-
-  const isMember = group.members.some((m) => {
-    // Determine membership by matching progress data — user_id can come from members list
-    // We check if there's a progress entry with an "id" (indicates own data)
-    return progressEntries.some((e) => "id" in e);
-  });
-
-  return (
-    <div style={containerStyle}>
-      <button onClick={() => navigate("/groups")} style={backButtonStyle}>
-        ← {t("groupDetail.back") ?? "Back to Groups"}
-      </button>
-
-      {/* Header */}
-      <div style={{ marginBottom: 20 }}>
-        <h1 style={{ fontSize: isMobile ? 20 : 24, fontWeight: 700, color: "#1f2937", margin: "0 0 4px" }}>
-          {group.name}
-        </h1>
-        <p style={{ fontSize: 14, color: "#6b7280", margin: 0 }}>
-          {group.ebook_title} {group.ebook_author ? `— ${group.ebook_author}` : ""}
-        </p>
-      </div>
-
-      {/* Group actions */}
-      <div style={{ display: "flex", gap: 10, marginBottom: 20, flexWrap: "wrap" }}>
-        {!isMember ? (
-          <button
-            onClick={() => void handleJoin()}
-            style={{
-              padding: "10px 20px", borderRadius: 10, border: "none", background: "#4f46e5",
-              color: "#fff", fontSize: 14, fontWeight: 600, cursor: "pointer",
-            }}
-          >
-            {t("groupDetail.join") ?? "Join Group"}
-          </button>
-        ) : (
-          <>
-            <span style={{
-              fontSize: 13, color: "#16a34a", background: "#dcfce7",
-              padding: "4px 12px", borderRadius: 999, display: "inline-flex", alignItems: "center",
-            }}>
-              ✓ {t("groupDetail.member") ?? "Member"}
-            </span>
-            {group.created_by_email !== undefined /* can't check identity here, but leave is always available for non-creators */ && (
-              <button
-                onClick={() => void handleLeave()}
-                style={{
-                  padding: "10px 20px", borderRadius: 10, border: "1px solid #fca5a5",
-                  background: "#fff", color: "#b91c1c", fontSize: 14, cursor: "pointer",
-                }}
-              >
-                {t("groupDetail.leave") ?? "Leave Group"}
-              </button>
-            )}
-          </>
-        )}
-      </div>
-
-      {group.description && (
-        <p style={{ fontSize: 14, color: "#4b5563", marginBottom: 20, lineHeight: 1.6, background: "#fff", padding: isMobile ? 12 : 16, borderRadius: 10, border: "1px solid #e5e7eb" }}>
-          {group.description}
-        </p>
-      )}
-
-      {/* Tabs */}
-      <div style={tabBarStyle}>
-        <button style={tabStyle(tab === "progress")} onClick={() => setTab("progress")}>
-          {t("groupDetail.progressTab") ?? "Progress"}
-        </button>
-        {isAdmin && (
-          <button style={tabStyle(tab === "admin")} onClick={() => setTab("admin")}>
-            {t("groupDetail.adminTab") ?? "Admin Summary"}
-          </button>
-        )}
-      </div>
-
-      {/* Progress tab */}
-      {tab === "progress" && (
-        <div>
-          {progressEntries.length === 0 ? (
-            <div style={{ textAlign: "center", padding: "40px 20px", color: "#9ca3af" }}>
-              <p>{t("groupDetail.noProgress") ?? "No progress data yet."}</p>
-            </div>
-          ) : (
-            progressEntries.map((entry) => {
-              const isPrivate = "is_public" in entry && entry.is_public === false && "note" in entry;
-              const hasDetail = isDetail(entry);
-
-              return (
-                <div
-                  key={entry.user_id}
-                  style={{
-                    background: "#fff", borderRadius: 10, padding: isMobile ? 12 : 16,
-                    marginBottom: 10, border: "1px solid #e5e7eb",
-                    boxShadow: "0 1px 3px rgba(0,0,0,0.04)",
-                  }}
-                >
-                  <div style={{ display: "flex", justifyContent: "space-between", alignItems: "center", marginBottom: 6 }}>
-                    <span style={{ fontSize: 15, fontWeight: 600, color: "#1f2937" }}>
-                      {entry.user_email}
-                      {hasDetail && " (you)"}
-                    </span>
-                    {isPrivate ? (
-                      <span style={{ fontSize: 12, color: "#9ca3af", fontStyle: "italic" }}>
-                        🔒 {t("groupDetail.private") ?? "Private"}
-                      </span>
-                    ) : "section_label" in entry && (
-                      <span style={{ fontSize: 13, color: "#4f46e5", fontWeight: 500 }}>
-                        {entry.section_label}
-                      </span>
-                    )}
-                  </div>
-
-                  {!isPrivate && "percentage" in entry && (
-                    <div style={{ display: "flex", alignItems: "center", gap: 10 }}>
-                      <div style={{
-                        flex: 1, height: 8, borderRadius: 4, background: "#e5e7eb", overflow: "hidden",
-                      }}>
-                        <div style={{
-                          height: "100%",
-                          width: `${Math.min(100, entry.percentage)}%`,
-                          background: hasDetail ? "#4f46e5" : "#818cf8",
-                          borderRadius: 4,
-                          transition: "width 0.3s ease",
-                        }} />
-                      </div>
-                      <span style={{ fontSize: 13, fontWeight: 600, color: "#374151", whiteSpace: "nowrap" }}>
-                        {Math.round(entry.percentage)}%
-                      </span>
-                    </div>
-                  )}
-
-                  {hasDetail && entry.last_position && Object.keys(entry.last_position).length > 0 && (
-                    <div style={{ marginTop: 8, fontSize: 12, color: "#9ca3af" }}>
-                      {t("groupDetail.lastPosition") ?? "Last position"}: {JSON.stringify(entry.last_position)}
-                    </div>
-                  )}
-                </div>
-              );
-            })
-          )}
-        </div>
-      )}
-
-      {/* Admin tab */}
-      {tab === "admin" && adminSummary && (
-        <div>
-          <div style={{
-            display: "grid",
-            gridTemplateColumns: "repeat(auto-fit, minmax(140px, 1fr))",
-            gap: 12,
-            marginBottom: 24,
-          }}>
-            <StatCard
-              label={t("groupDetail.totalMembers") ?? "Members"}
-              value={String(adminSummary.total_members)}
-            />
-            <StatCard
-              label={t("groupDetail.started") ?? "Started"}
-              value={String(adminSummary.members_started)}
-            />
-            <StatCard
-              label={t("groupDetail.finished") ?? "Finished"}
-              value={String(adminSummary.members_finished)}
-            />
-            <StatCard
-              label={t("groupDetail.avgProgress") ?? "Avg Progress"}
-              value={`${Math.round(adminSummary.average_percentage)}%`}
-            />
-            <StatCard
-              label={t("groupDetail.avgTime") ?? "Avg Time"}
-              value={`${adminSummary.average_time_spent_hours}h`}
-            />
-          </div>
-
-          <h3 style={{ fontSize: 15, fontWeight: 600, color: "#1f2937", marginBottom: 12 }}>
-            {t("groupDetail.memberDetails") ?? "Member Details"}
-          </h3>
-          {adminSummary.member_details.map((m) => (
-            <div
-              key={m.user_id}
-              style={{
-                background: "#fff", borderRadius: 10, padding: isMobile ? 12 : 14,
-                marginBottom: 8, border: "1px solid #e5e7eb",
-                display: "flex", justifyContent: "space-between", alignItems: "center",
-              }}
-            >
-              <div>
-                <span style={{ fontSize: 14, fontWeight: 500, color: "#1f2937" }}>{m.user_email}</span>
-                <span style={{ fontSize: 12, color: "#9ca3af", marginLeft: 8 }}>
-                  {m.is_public ? "👁" : "🔒"}
-                </span>
-              </div>
-              <div style={{ display: "flex", gap: 16, fontSize: 13, color: "#6b7280" }}>
-                <span>Section {m.current_section}</span>
-                <span style={{ fontWeight: 600, color: "#4f46e5" }}>{Math.round(m.percentage)}%</span>
-                <span>⏱ {Math.round(m.time_spent_seconds / 60)}m</span>
-              </div>
-            </div>
-          ))}
-        </div>
-      )}
-    </div>
-  );
-}
-
-function StatCard({ label, value }: { label: string; value: string }) {
-  return (
-    <div style={{
-      background: "#fff", borderRadius: 10, padding: "14px 16px",
-      border: "1px solid #e5e7eb", textAlign: "center",
-    }}>
-      <div style={{ fontSize: 22, fontWeight: 700, color: "#4f46e5" }}>{value}</div>
-      <div style={{ fontSize: 12, color: "#6b7280", marginTop: 2 }}>{label}</div>
-    </div>
-  );
-}

frontend/src/pages/GroupDetailPage.tsx

@@ -0,0 +1,300 @@
+import React, { useCallback, useEffect, useState } from "react";
+import { useNavigate, useParams } from "react-router-dom";
+import { useTranslation } from "react-i18n-lite";
+import { groupsApi } from "../api/groups";
+import { booksApi } from "../api/books";
+import { getApiErrorMessage } from "../api/errors";
+import type { ReadingGroupDetail, GroupBook, GroupBookDetail } from "../types/group";
+import type { EBookListItem } from "../types/book";
+
+export function GroupDetailPage() {
+  const { t } = useTranslation();
+  const navigate = useNavigate();
+  const { groupId } = useParams<{ groupId: string }>();
+  const [group, setGroup] = useState<ReadingGroupDetail | null>(null);
+  const [books, setBooks] = useState<GroupBook[]>([]);
+  const [loading, setLoading] = useState(true);
+  const [error, setError] = useState<string | null>(null);
+
+  // Upload state
+  const [showUpload, setShowUpload] = useState(false);
+  const [ebooks, setEbooks] = useState<EBookListItem[]>([]);
+  const [selectedEbookId, setSelectedEbookId] = useState<number | null>(null);
+  const [uploading, setUploading] = useState(false);
+
+  // Add member state
+  const [showAddMember, setShowAddMember] = useState(false);
+  const [memberEmail, setMemberEmail] = useState("");
+  const [adding, setAdding] = useState(false);
+
+  const id = Number(groupId);
+
+  const loadData = useCallback(async () => {
+    if (!id) return;
+    setLoading(true);
+    try {
+      const [groupData, bookData] = await Promise.all([
+        groupsApi.getGroup(id),
+        groupsApi.listGroupBooks(id),
+      ]);
+      setGroup(groupData);
+      setBooks(bookData);
+    } catch (err) {
+      setError(getApiErrorMessage(err, "Failed to load group"));
+    } finally {
+      setLoading(false);
+    }
+  }, [id]);
+
+  useEffect(() => {
+    loadData();
+  }, [loadData]);
+
+  const handleUploadClick = async () => {
+    setShowUpload(true);
+    try {
+      const ebookList = await booksApi.getEBooks();
+      setEbooks(ebookList.filter((e) => e.format === "epub"));
+    } catch {
+      // Ebook list fetch failed silently
+    }
+  };
+
+  const handleUpload = async () => {
+    if (!selectedEbookId || !id) return;
+    setUploading(true);
+    try {
+      const created = await groupsApi.createGroupBook(id, { ebook_id: selectedEbookId });
+      setShowUpload(false);
+      setSelectedEbookId(null);
+      await loadData();
+    } catch (err) {
+      setError(getApiErrorMessage(err, "Failed to upload book to group"));
+    } finally {
+      setUploading(false);
+    }
+  };
+
+  const handleAddMember = async (e: React.FormEvent) => {
+    e.preventDefault();
+    if (!memberEmail.trim() || !id) return;
+    setAdding(true);
+    try {
+      // Note: In a real implementation, we'd look up user by email.
+      // For now this requires user_id. Email lookup would be an enhancement.
+      await groupsApi.addMember(id, { user_id: Number(memberEmail) });
+      setShowAddMember(false);
+      setMemberEmail("");
+      await loadData();
+    } catch (err) {
+      setError(getApiErrorMessage(err, "Failed to add member. Please use a valid user ID."));
+    } finally {
+      setAdding(false);
+    }
+  };
+
+  const handleRemoveMember = async (userId: number) => {
+    if (!id) return;
+    try {
+      await groupsApi.removeMember(id, { user_id: userId });
+      await loadData();
+    } catch (err) {
+      setError(getApiErrorMessage(err, "Failed to remove member"));
+    }
+  };
+
+  if (loading) {
+    return (
+      <div style={{ maxWidth: 700, margin: "0 auto", padding: 16, minHeight: "100vh", background: "#f8f9fa" }}>
+        <p style={{ textAlign: "center", color: "#888", padding: 40 }}>{t("common.loading")}</p>
+      </div>
+    );
+  }
+
+  if (!group) {
+    return (
+      <div style={{ maxWidth: 700, margin: "0 auto", padding: 16, minHeight: "100vh", background: "#f8f9fa" }}>
+        <p style={{ textAlign: "center", color: "#e74c3c", padding: 40 }}>Group not found</p>
+        <button onClick={() => navigate("/groups")} style={{ display: "block", margin: "0 auto" }}>← Back to Groups</button>
+      </div>
+    );
+  }
+
+  return (
+    <div style={{ maxWidth: 700, margin: "0 auto", padding: 16, minHeight: "100vh", background: "#f8f9fa" }}>
+      <header style={{ display: "flex", justifyContent: "space-between", alignItems: "center", padding: "16px 0", borderBottom: "1px solid #eee", marginBottom: 20 }}>
+        <div>
+          <h1 style={{ fontSize: 24, fontWeight: 700, color: "#1a1a2e", margin: 0 }}>{group.name}</h1>
+          {group.description && <p style={{ margin: "4px 0 0", fontSize: 14, color: "#666" }}>{group.description}</p>}
+        </div>
+        <button onClick={() => navigate("/groups")} style={{ padding: "8px 16px", borderRadius: 6, border: "1px solid #ddd", background: "#fff", cursor: "pointer", fontSize: 14 }}>
+          ← {t("common.back")}
+        </button>
+      </header>
+
+      {error && (
+        <div style={{ background: "#fde8e8", padding: 12, borderRadius: 6, color: "#e74c3c", fontSize: 14, marginBottom: 16 }}>
+          {error}
+          <button onClick={() => setError(null)} style={{ marginLeft: 12, background: "none", border: "none", cursor: "pointer", fontWeight: 600 }}>✕</button>
+        </div>
+      )}
+
+      {/* Members Section */}
+      <section style={{ background: "#fff", padding: 20, borderRadius: 12, marginBottom: 20, boxShadow: "0 2px 8px rgba(0,0,0,0.06)" }}>
+        <div style={{ display: "flex", justifyContent: "space-between", alignItems: "center", marginBottom: 12 }}>
+          <h2 style={{ fontSize: 18, fontWeight: 600, color: "#1a1a2e", margin: 0 }}>{t("groups.members")} ({group.members.length})</h2>
+          <button
+            onClick={() => setShowAddMember(!showAddMember)}
+            style={{ padding: "6px 14px", borderRadius: 6, border: "1px solid #ddd", background: "#fff", cursor: "pointer", fontSize: 13 }}
+          >
+            {showAddMember ? t("groups.cancel") : `+ ${t("groups.addMember")}`}
+          </button>
+        </div>
+        {showAddMember && (
+          <form onSubmit={handleAddMember} style={{ display: "flex", gap: 8, marginBottom: 12 }}>
+            <input
+              type="text"
+              value={memberEmail}
+              onChange={(e) => setMemberEmail(e.target.value)}
+              placeholder={t("groups.memberIdPlaceholder")}
+              style={{ flex: 1, padding: "8px 12px", borderRadius: 6, border: "1px solid #ddd", fontSize: 14, outline: "none" }}
+            />
+            <button
+              type="submit"
+              disabled={adding}
+              style={{ padding: "8px 16px", borderRadius: 6, border: "none", background: "#1a1a2e", color: "#fff", fontSize: 14, cursor: "pointer", opacity: adding ? 0.6 : 1 }}
+            >
+              {t("groups.add")}
+            </button>
+          </form>
+        )}
+        <div style={{ display: "flex", flexDirection: "column", gap: 8 }}>
+          {group.members.map((m) => (
+            <div key={m.id} style={{ display: "flex", justifyContent: "space-between", alignItems: "center", padding: "8px 0", borderBottom: "1px solid #f0f0f0" }}>
+              <div>
+                <span style={{ fontSize: 14, fontWeight: 500 }}>{m.user_email}</span>
+                <span style={{ marginLeft: 8, fontSize: 12, color: m.role === "admin" ? "#e67e22" : "#999", background: m.role === "admin" ? "#fef3e2" : "#f0f0f0", padding: "2px 8px", borderRadius: 4 }}>
+                  {m.role}
+                </span>
+              </div>
+              {m.role !== "admin" && (
+                <button
+                  onClick={() => handleRemoveMember(m.user)}
+                  style={{ background: "none", border: "none", color: "#e74c3c", cursor: "pointer", fontSize: 13 }}
+                >
+                  {t("groups.remove")}
+                </button>
+              )}
+            </div>
+          ))}
+        </div>
+      </section>
+
+      {/* Books Section */}
+      <section style={{ background: "#fff", padding: 20, borderRadius: 12, boxShadow: "0 2px 8px rgba(0,0,0,0.06)" }}>
+        <div style={{ display: "flex", justifyContent: "space-between", alignItems: "center", marginBottom: 12 }}>
+          <h2 style={{ fontSize: 18, fontWeight: 600, color: "#1a1a2e", margin: 0 }}>{t("groups.books")} ({books.length})</h2>
+          <button
+            onClick={handleUploadClick}
+            style={{ padding: "8px 18px", borderRadius: 8, border: "none", background: "#1a1a2e", color: "#fff", fontSize: 14, fontWeight: 600, cursor: "pointer" }}
+          >
+            {t("groups.uploadEpub")}
+          </button>
+        </div>
+
+        {showUpload && (
+          <div style={{ background: "#f8f9fa", padding: 16, borderRadius: 8, marginBottom: 16 }}>
+            <h3 style={{ fontSize: 15, fontWeight: 600, margin: "0 0 12px" }}>{t("groups.selectEbook")}</h3>
+            {ebooks.length === 0 ? (
+              <div style={{ textAlign: "center", padding: 20, color: "#888" }}>
+                <p>{t("groups.noEpubBooks")}</p>
+                <button onClick={() => navigate("/add")} style={{ marginTop: 8, padding: "8px 16px", borderRadius: 6, border: "1px solid #ddd", background: "#fff", cursor: "pointer", fontSize: 13 }}>
+                  {t("groups.uploadFirst")}
+                </button>
+              </div>
+            ) : (
+              <div>
+                <div style={{ display: "flex", flexDirection: "column", gap: 8, marginBottom: 12, maxHeight: 200, overflowY: "auto" }}>
+                  {ebooks.map((eb) => (
+                    <label
+                      key={eb.id}
+                      style={{
+                        display: "flex", alignItems: "center", gap: 10, padding: "10px 12px",
+                        borderRadius: 8, cursor: "pointer", fontSize: 14,
+                        background: selectedEbookId === eb.id ? "#e8f0fe" : "#fff",
+                        border: selectedEbookId === eb.id ? "2px solid #1a1a2e" : "1px solid #eee",
+                      }}
+                    >
+                      <input
+                        type="radio"
+                        name="ebook"
+                        value={eb.id}
+                        checked={selectedEbookId === eb.id}
+                        onChange={() => setSelectedEbookId(eb.id)}
+                        style={{ accentColor: "#1a1a2e" }}
+                      />
+                      <div>
+                        <strong>{eb.title}</strong>
+                        {eb.author && <span style={{ color: "#888", marginLeft: 8 }}>by {eb.author}</span>}
+                        <span style={{ marginLeft: 8, fontSize: 12, color: "#aaa" }}>({eb.filename})</span>
+                      </div>
+                    </label>
+                  ))}
+                </div>
+                <div style={{ display: "flex", gap: 8 }}>
+                  <button
+                    onClick={handleUpload}
+                    disabled={!selectedEbookId || uploading}
+                    style={{ padding: "10px 20px", borderRadius: 8, border: "none", background: "#1a1a2e", color: "#fff", fontSize: 14, fontWeight: 600, cursor: uploading ? "default" : "pointer", opacity: uploading ? 0.6 : 1 }}
+                  >
+                    {uploading ? t("common.loading") : t("groups.confirmUpload")}
+                  </button>
+                  <button
+                    onClick={() => setShowUpload(false)}
+                    style={{ padding: "10px 20px", borderRadius: 8, border: "1px solid #ddd", background: "#fff", cursor: "pointer", fontSize: 14 }}
+                  >
+                    {t("groups.cancel")}
+                  </button>
+                </div>
+              </div>
+            )}
+          </div>
+        )}
+
+        {books.length === 0 ? (
+          <p style={{ textAlign: "center", color: "#888", padding: 30 }}>{t("groups.noBooks")}</p>
+        ) : (
+          <div style={{ display: "flex", flexDirection: "column", gap: 10 }}>
+            {books.map((book) => (
+              <div
+                key={book.id}
+                onClick={() => navigate(`/groups/${groupId}/books/${book.id}`)}
+                style={{
+                  display: "flex", justifyContent: "space-between", alignItems: "center",
+                  padding: 16, borderRadius: 10, cursor: "pointer", transition: "background 0.2s",
+                  background: book.status === "active" ? "#f0faf0" : "#fafafa",
+                  border: book.status === "active" ? "2px solid #27ae60" : "1px solid #eee",
+                }}
+                onMouseEnter={(e) => (e.currentTarget.style.background = book.status === "active" ? "#e8f5e9" : "#f5f5f5")}
+                onMouseLeave={(e) => (e.currentTarget.style.background = book.status === "active" ? "#f0faf0" : "#fafafa")}
+              >
+                <div>
+                  <h3 style={{ margin: 0, fontSize: 16, fontWeight: 600, color: "#1a1a2e" }}>
+                    {book.title}
+                    {book.status === "active" && (
+                      <span style={{ marginLeft: 8, fontSize: 11, color: "#27ae60", background: "#e8f5e9", padding: "2px 8px", borderRadius: 4 }}>Active</span>
+                    )}
+                  </h3>
+                  <p style={{ margin: "4px 0 0", fontSize: 13, color: "#888" }}>
+                    {book.section_count} sections · {book.ebook.page_count} chapters · uploaded by {book.uploaded_by_email}
+                  </p>
+                </div>
+                <span style={{ fontSize: 20, color: "#ccc" }}>→</span>
+              </div>
+            ))}
+          </div>
+        )}
+      </section>
+    </div>
+  );
+}

frontend/src/pages/GroupsPage.tsx

@@ -0,0 +1,162 @@
+import React, { useCallback, useEffect, useState } from "react";
+import { useNavigate } from "react-router-dom";
+import { useTranslation } from "react-i18n-lite";
+import { groupsApi } from "../api/groups";
+import { getApiErrorMessage } from "../api/errors";
+import type { ReadingGroup } from "../types/group";
+
+export function GroupsPage() {
+  const { t } = useTranslation();
+  const navigate = useNavigate();
+  const [groups, setGroups] = useState<ReadingGroup[]>([]);
+  const [loading, setLoading] = useState(true);
+  const [error, setError] = useState<string | null>(null);
+  const [showCreate, setShowCreate] = useState(false);
+  const [newName, setNewName] = useState("");
+  const [newDesc, setNewDesc] = useState("");
+  const [creating, setCreating] = useState(false);
+
+  const loadGroups = useCallback(async () => {
+    setLoading(true);
+    try {
+      const data = await groupsApi.listGroups();
+      setGroups(data);
+    } catch (err) {
+      setError(getApiErrorMessage(err, "Failed to load groups"));
+    } finally {
+      setLoading(false);
+    }
+  }, []);
+
+  useEffect(() => {
+    loadGroups();
+  }, [loadGroups]);
+
+  const handleCreate = async (e: React.FormEvent) => {
+    e.preventDefault();
+    if (!newName.trim()) return;
+    setCreating(true);
+    try {
+      await groupsApi.createGroup({ name: newName.trim(), description: newDesc.trim() });
+      setShowCreate(false);
+      setNewName("");
+      setNewDesc("");
+      await loadGroups();
+    } catch (err) {
+      setError(getApiErrorMessage(err, "Failed to create group"));
+    } finally {
+      setCreating(false);
+    }
+  };
+
+  return (
+    <div style={{ maxWidth: 700, margin: "0 auto", padding: 16, minHeight: "100vh", background: "#f8f9fa" }}>
+      <header style={{ display: "flex", justifyContent: "space-between", alignItems: "center", padding: "16px 0", borderBottom: "1px solid #eee", marginBottom: 20 }}>
+        <h1 style={{ fontSize: 24, fontWeight: 700, color: "#1a1a2e", margin: 0 }}>{t("groups.title")}</h1>
+        <button
+          type="button"
+          onClick={() => navigate("/")}
+          style={{ padding: "8px 16px", borderRadius: 6, border: "1px solid #ddd", background: "#fff", cursor: "pointer", fontSize: 14 }}
+        >
+          ← {t("common.back")}
+        </button>
+      </header>
+
+      {error && (
+        <div style={{ background: "#fde8e8", padding: 12, borderRadius: 6, color: "#e74c3c", fontSize: 14, marginBottom: 16 }}>
+          {error}
+          <button onClick={() => setError(null)} style={{ marginLeft: 12, background: "none", border: "none", cursor: "pointer", fontWeight: 600 }}>✕</button>
+        </div>
+      )}
+
+      <div style={{ marginBottom: 20 }}>
+        <button
+          type="button"
+          onClick={() => setShowCreate(!showCreate)}
+          style={{
+            padding: "12px 24px", borderRadius: 8, border: "none",
+            background: "#1a1a2e", color: "#fff", fontSize: 15, fontWeight: 600, cursor: "pointer",
+          }}
+        >
+          {showCreate ? t("groups.cancel") : t("groups.createGroup")}
+        </button>
+      </div>
+
+      {showCreate && (
+        <form onSubmit={handleCreate} style={{
+          background: "#fff", padding: 20, borderRadius: 12, marginBottom: 24,
+          boxShadow: "0 2px 8px rgba(0,0,0,0.06)", display: "flex", flexDirection: "column", gap: 14,
+        }}>
+          <div style={{ display: "flex", flexDirection: "column", gap: 6 }}>
+            <label style={{ fontSize: 14, fontWeight: 600, color: "#555" }}>{t("groups.groupName")}</label>
+            <input
+              type="text"
+              value={newName}
+              onChange={(e) => setNewName(e.target.value)}
+              placeholder={t("groups.groupNamePlaceholder")}
+              style={{ padding: "10px 12px", borderRadius: 6, border: "1px solid #ddd", fontSize: 16, outline: "none" }}
+              required
+            />
+          </div>
+          <div style={{ display: "flex", flexDirection: "column", gap: 6 }}>
+            <label style={{ fontSize: 14, fontWeight: 600, color: "#555" }}>{t("groups.description")} ({t("common.optional")})</label>
+            <textarea
+              value={newDesc}
+              onChange={(e) => setNewDesc(e.target.value)}
+              placeholder={t("groups.descriptionPlaceholder")}
+              rows={3}
+              style={{ padding: "10px 12px", borderRadius: 6, border: "1px solid #ddd", fontSize: 15, outline: "none", resize: "vertical" }}
+            />
+          </div>
+          <button
+            type="submit"
+            disabled={creating || !newName.trim()}
+            style={{
+              padding: "10px 20px", borderRadius: 8, border: "none",
+              background: "#1a1a2e", color: "#fff", fontSize: 15, fontWeight: 600,
+              cursor: creating ? "default" : "pointer", opacity: creating ? 0.6 : 1, alignSelf: "flex-start",
+            }}
+          >
+            {creating ? t("common.loading") : t("groups.create")}
+          </button>
+        </form>
+      )}
+
+      {loading ? (
+        <p style={{ textAlign: "center", color: "#888", padding: 40 }}>{t("common.loading")}</p>
+      ) : groups.length === 0 ? (
+        <div style={{ textAlign: "center", padding: 40, color: "#888" }}>
+          <p style={{ fontSize: 16, marginBottom: 8 }}>{t("groups.noGroups")}</p>
+          <p style={{ fontSize: 14 }}>{t("groups.noGroupsHint")}</p>
+        </div>
+      ) : (
+        <div style={{ display: "flex", flexDirection: "column", gap: 12 }}>
+          {groups.map((group) => (
+            <div
+              key={group.id}
+              onClick={() => navigate(`/groups/${group.id}`)}
+              style={{
+                background: "#fff", padding: 20, borderRadius: 12, cursor: "pointer",
+                boxShadow: "0 2px 8px rgba(0,0,0,0.06)", transition: "box-shadow 0.2s",
+                display: "flex", justifyContent: "space-between", alignItems: "center",
+              }}
+              onMouseEnter={(e) => (e.currentTarget.style.boxShadow = "0 4px 16px rgba(0,0,0,0.1)")}
+              onMouseLeave={(e) => (e.currentTarget.style.boxShadow = "0 2px 8px rgba(0,0,0,0.06)")}
+            >
+              <div>
+                <h3 style={{ margin: 0, fontSize: 18, fontWeight: 600, color: "#1a1a2e" }}>{group.name}</h3>
+                {group.description && (
+                  <p style={{ margin: "6px 0 0", fontSize: 14, color: "#666" }}>{group.description}</p>
+                )}
+                <p style={{ margin: "8px 0 0", fontSize: 13, color: "#999" }}>
+                  {group.member_count} {t("groups.members")} · {t("groups.admin")}: {group.admin_email}
+                </p>
+              </div>
+              <span style={{ fontSize: 20, color: "#ccc" }}>→</span>
+            </div>
+          ))}
+        </div>
+      )}
+    </div>
+  );
+}

frontend/src/pages/Library.tsx

@@ -242,7 +242,6 @@ export function LibraryPage() {
             <>
               <button onClick={() => navigate("/add")} style={{ ...TOUCH_TARGET, fontSize: 20, background: "none", border: "none", cursor: "pointer", padding: 8 }} title={t("library.addBook")}>➕</button>
               <button onClick={() => navigate("/bookmarks-notes")} style={{ ...TOUCH_TARGET, fontSize: 20, background: "none", border: "none", cursor: "pointer", padding: 8 }} title={t("library.bookmarks")}>🔖</button>
-              <button onClick={() => navigate("/groups")} style={{ ...TOUCH_TARGET, fontSize: 20, background: "none", border: "none", cursor: "pointer", padding: 8 }} title="Reading Groups">👥</button>
               <button onClick={() => navigate("/settings")} style={{ ...TOUCH_TARGET, fontSize: 20, background: "none", border: "none", cursor: "pointer", padding: 8 }} title={t("library.settings")}>⚙️</button>
               <button onClick={logout} style={{ ...TOUCH_TARGET, fontSize: 20, background: "none", border: "none", cursor: "pointer", padding: 8 }} title={t("library.logout")}>🚪</button>
             </>
@@ -250,7 +249,6 @@ export function LibraryPage() {
             <>
               <button onClick={() => navigate("/add")} className="btn">+ {t("library.addBook")}</button>
               <button onClick={() => navigate("/bookmarks-notes")} className="btn btn-secondary">{t("library.bookmarks")}</button>
-              <button onClick={() => navigate("/groups")} className="btn btn-secondary">👥 Reading Groups</button>
               <button onClick={() => navigate("/settings")} className="btn btn-secondary">{t("library.settings")}</button>
               <button onClick={logout} className="btn btn-danger">{t("library.logout")}</button>
             </>

frontend/src/pages/ReadingGroups.tsx

@@ -1,288 +0,0 @@
-import React, { useCallback, useEffect, useState } from "react";
-import { useNavigate } from "react-router-dom";
-import { useTranslation } from "react-i18n-lite";
-import { groupsApi } from "../api/groups";
-import { booksApi } from "../api/books";
-import type { ReadingGroupSummary } from "../types/groups";
-import type { EBookListItem } from "../types/book";
-import { useMediaQuery, BREAKPOINTS } from "../hooks/useMediaQuery";
-
-export function ReadingGroupsPage() {
-  const { t } = useTranslation();
-  const navigate = useNavigate();
-  const isMobile = useMediaQuery(BREAKPOINTS.md);
-
-  const [groups, setGroups] = useState<ReadingGroupSummary[]>([]);
-  const [ebooks, setEbooks] = useState<EBookListItem[]>([]);
-  const [loading, setLoading] = useState(true);
-  const [error, setError] = useState<string | null>(null);
-  const [showCreate, setShowCreate] = useState(false);
-  const [createName, setCreateName] = useState("");
-  const [createEbook, setCreateEbook] = useState<number | null>(null);
-  const [createDesc, setCreateDesc] = useState("");
-  const [creating, setCreating] = useState(false);
-
-  const loadGroups = useCallback(async () => {
-    try {
-      const data = await groupsApi.listGroups();
-      setGroups(data);
-      setError(null);
-    } catch (err) {
-      setError(err instanceof Error ? err.message : "Failed to load groups");
-    } finally {
-      setLoading(false);
-    }
-  }, []);
-
-  const loadEbooks = useCallback(async () => {
-    try {
-      const data = await booksApi.getEBooks();
-      setEbooks(data);
-    } catch {
-      // Ebook list is optional; groups page still works without it
-    }
-  }, []);
-
-  useEffect(() => {
-    void loadGroups();
-    void loadEbooks();
-  }, [loadGroups, loadEbooks]);
-
-  const handleCreate = useCallback(async () => {
-    if (!createName.trim() || createEbook === null) return;
-    setCreating(true);
-    try {
-      await groupsApi.createGroup({
-        name: createName.trim(),
-        ebook: createEbook,
-        description: createDesc.trim(),
-      });
-      setShowCreate(false);
-      setCreateName("");
-      setCreateEbook(null);
-      setCreateDesc("");
-      void loadGroups();
-    } catch (err) {
-      setError(err instanceof Error ? err.message : "Failed to create group");
-    } finally {
-      setCreating(false);
-    }
-  }, [createName, createEbook, createDesc, loadGroups]);
-
-  const containerStyle: React.CSSProperties = {
-    maxWidth: 720,
-    margin: "0 auto",
-    padding: isMobile ? 16 : 24,
-    minHeight: "100vh",
-    background: "#f8f9fa",
-  };
-
-  const headerBar: React.CSSProperties = {
-    display: "flex",
-    justifyContent: "space-between",
-    alignItems: "center",
-    marginBottom: 24,
-  };
-
-  const cardStyle: React.CSSProperties = {
-    background: "#fff",
-    borderRadius: 12,
-    padding: isMobile ? 14 : 18,
-    marginBottom: 12,
-    cursor: "pointer",
-    boxShadow: "0 1px 4px rgba(0,0,0,0.06)",
-    border: "1px solid #e5e7eb",
-  };
-
-  if (loading) {
-    return (
-      <div style={containerStyle}>
-        <div style={{ height: 24, width: 200, background: "#e5e7eb", borderRadius: 6, marginBottom: 24 }} />
-        {[1, 2, 3].map((i) => (
-          <div key={i} style={{ ...cardStyle, cursor: "default" }}>
-            <div style={{ height: 20, width: "60%", background: "#e5e7eb", borderRadius: 4, marginBottom: 8 }} />
-            <div style={{ height: 14, width: "40%", background: "#e5e7eb", borderRadius: 4 }} />
-          </div>
-        ))}
-      </div>
-    );
-  }
-
-  return (
-    <div style={containerStyle}>
-      <div style={headerBar}>
-        <h1 style={{ fontSize: isMobile ? 20 : 24, fontWeight: 700, color: "#1f2937", margin: 0 }}>
-          📚 {t("readingGroups.title") ?? "Reading Groups"}
-        </h1>
-        <button
-          onClick={() => setShowCreate(true)}
-          style={{
-            padding: isMobile ? "10px 18px" : "8px 18px",
-            borderRadius: 10,
-            border: "none",
-            background: "#4f46e5",
-            color: "#fff",
-            fontSize: 14,
-            fontWeight: 600,
-            cursor: "pointer",
-            minHeight: 40,
-          }}
-        >
-          + {t("readingGroups.create") ?? "New Group"}
-        </button>
-      </div>
-
-      {error && (
-        <div style={{ padding: "12px 16px", background: "#fef2f2", borderRadius: 8, color: "#b91c1c", marginBottom: 16, fontSize: 14 }}>
-          {error}
-        </div>
-      )}
-
-      {/* Create modal */}
-      {showCreate && (
-        <div style={{
-          position: "fixed", inset: 0, background: "rgba(0,0,0,0.4)",
-          display: "flex", alignItems: "center", justifyContent: "center", zIndex: 100,
-        }}>
-          <div style={{
-            background: "#fff", borderRadius: 16, padding: 24, maxWidth: 420, width: "90%",
-            boxShadow: "0 10px 40px rgba(0,0,0,0.15)",
-          }}>
-            <h2 style={{ fontSize: 18, fontWeight: 700, marginBottom: 16, color: "#1f2937" }}>
-              {t("readingGroups.createTitle") ?? "Create Reading Group"}
-            </h2>
-
-            <label style={{ fontSize: 13, color: "#6b7280", display: "block", marginBottom: 4 }}>
-              {t("readingGroups.groupName") ?? "Group Name"}
-            </label>
-            <input
-              type="text"
-              value={createName}
-              onChange={(e) => setCreateName(e.target.value)}
-              placeholder={t("readingGroups.namePlaceholder") ?? "e.g., Book Club June"}
-              style={{
-                width: "100%", padding: "10px 14px", borderRadius: 8, border: "1px solid #d1d5db",
-                fontSize: 14, marginBottom: 14, boxSizing: "border-box",
-              }}
-            />
-
-            <label style={{ fontSize: 13, color: "#6b7280", display: "block", marginBottom: 4 }}>
-              {t("readingGroups.selectBook") ?? "Select Book"}
-            </label>
-            <select
-              value={createEbook ?? ""}
-              onChange={(e) => setCreateEbook(e.target.value ? Number(e.target.value) : null)}
-              style={{
-                width: "100%", padding: "10px 14px", borderRadius: 8, border: "1px solid #d1d5db",
-                fontSize: 14, marginBottom: 14, boxSizing: "border-box", background: "#fff",
-              }}
-            >
-              <option value="">-- {t("readingGroups.choose") ?? "Choose"} --</option>
-              {ebooks.map((eb) => (
-                <option key={eb.id} value={eb.id}>
-                  {eb.title} {eb.author ? `— ${eb.author}` : ""}
-                </option>
-              ))}
-            </select>
-
-            <label style={{ fontSize: 13, color: "#6b7280", display: "block", marginBottom: 4 }}>
-              {t("readingGroups.description") ?? "Description"} ({t("common.optional") ?? "optional"})
-            </label>
-            <textarea
-              value={createDesc}
-              onChange={(e) => setCreateDesc(e.target.value)}
-              rows={3}
-              style={{
-                width: "100%", padding: "10px 14px", borderRadius: 8, border: "1px solid #d1d5db",
-                fontSize: 14, marginBottom: 18, boxSizing: "border-box", resize: "vertical",
-              }}
-            />
-
-            <div style={{ display: "flex", gap: 10, justifyContent: "flex-end" }}>
-              <button
-                onClick={() => setShowCreate(false)}
-                style={{
-                  padding: "10px 20px", borderRadius: 8, border: "1px solid #d1d5db",
-                  background: "#fff", color: "#374151", fontSize: 14, cursor: "pointer",
-                }}
-              >
-                {t("common.cancel") ?? "Cancel"}
-              </button>
-              <button
-                onClick={() => void handleCreate()}
-                disabled={creating || !createName.trim() || createEbook === null}
-                style={{
-                  padding: "10px 20px", borderRadius: 8, border: "none",
-                  background: (!createName.trim() || createEbook === null) ? "#9ca3af" : "#4f46e5",
-                  color: "#fff", fontSize: 14, fontWeight: 600, cursor: (!createName.trim() || createEbook === null) ? "not-allowed" : "pointer",
-                }}
-              >
-                {creating ? (t("common.creating") ?? "Creating...") : (t("readingGroups.create") ?? "Create")}
-              </button>
-            </div>
-          </div>
-        </div>
-      )}
-
-      {/* Group list */}
-      {groups.length === 0 ? (
-        <div style={{ textAlign: "center", padding: "60px 20px", color: "#6b7280" }}>
-          <div style={{ fontSize: 48, marginBottom: 12 }}>📖</div>
-          <p style={{ fontSize: 16, marginBottom: 16 }}>
-            {t("readingGroups.empty") ?? "No reading groups yet. Create one to read together!"}
-          </p>
-        </div>
-      ) : (
-        groups.map((g) => (
-          <div
-            key={g.id}
-            style={cardStyle}
-            onClick={() => navigate(`/groups/${g.id}`)}
-          >
-            <div style={{ display: "flex", justifyContent: "space-between", alignItems: "flex-start" }}>
-              <div>
-                <h2 style={{ fontSize: isMobile ? 16 : 17, fontWeight: 600, color: "#1f2937", margin: "0 0 4px" }}>
-                  {g.name}
-                </h2>
-                <p style={{ fontSize: 13, color: "#6b7280", margin: "0 0 6px" }}>
-                  {g.ebook_title} {g.ebook_author ? `— ${g.ebook_author}` : ""}
-                </p>
-              </div>
-              <span style={{
-                fontSize: 12, color: "#4f46e5", background: "#eef2ff",
-                padding: "2px 10px", borderRadius: 999, whiteSpace: "nowrap",
-                minHeight: 24, display: "inline-flex", alignItems: "center",
-              }}>
-                {g.member_count} {g.member_count === 1
-                  ? (t("readingGroups.member") ?? "member")
-                  : (t("readingGroups.members") ?? "members")}
-              </span>
-            </div>
-
-            {g.my_progress && (
-              <div style={{ marginTop: 8, display: "flex", alignItems: "center", gap: 8 }}>
-                <div style={{
-                  flex: 1, height: 6, borderRadius: 3, background: "#e5e7eb", overflow: "hidden",
-                }}>
-                  <div style={{
-                    height: "100%", width: `${Math.min(100, g.my_progress.percentage)}%`,
-                    background: "#4f46e5", borderRadius: 3, transition: "width 0.3s ease",
-                  }} />
-                </div>
-                <span style={{ fontSize: 12, color: "#6b7280", whiteSpace: "nowrap" }}>
-                  {g.my_progress.section_label}
-                </span>
-              </div>
-            )}
-
-            {g.description && (
-              <p style={{ fontSize: 13, color: "#9ca3af", margin: "8px 0 0", lineHeight: 1.5 }}>
-                {g.description}
-              </p>
-            )}
-          </div>
-        ))
-      )}
-    </div>
-  );
-}

frontend/src/types/group.ts

@@ -0,0 +1,109 @@
+/** Types for reading groups, group books, sections, and schedules */
+
+export interface ReadingGroup {
+  id: number;
+  name: string;
+  description: string;
+  admin: number;
+  admin_email: string;
+  member_count: number;
+  created_at: string;
+  updated_at: string;
+}
+
+export interface ReadingGroupDetail {
+  id: number;
+  name: string;
+  description: string;
+  admin: number;
+  admin_email: string;
+  members: GroupMembership[];
+  created_at: string;
+  updated_at: string;
+}
+
+export interface GroupMembership {
+  id: number;
+  user: number;
+  user_email: string;
+  user_username: string;
+  role: "admin" | "member";
+  joined_at: string;
+}
+
+export interface GroupBook {
+  id: number;
+  title: string;
+  status: "active" | "replaced";
+  ebook: {
+    id: number;
+    title: string;
+    author: string;
+    filename: string;
+    format: string;
+    page_count: number;
+    file_size: number;
+    cover_image: string | null;
+    created_at: string;
+  };
+  uploaded_by: number;
+  uploaded_by_email: string;
+  section_count: number;
+  created_at: string;
+  updated_at: string;
+}
+
+export interface Section {
+  id: number;
+  title: string;
+  order: number;
+  start_chapter_index: number;
+  end_chapter_index: number;
+  estimated_reading_minutes: number;
+  created_at: string;
+}
+
+export interface GroupBookDetail extends GroupBook {
+  sections: Section[];
+  schedules: ReadingSchedule[];
+}
+
+export interface ReadingSchedule {
+  id: number;
+  meeting_number: number;
+  week_date: string;
+  section_ids: number[];
+  section_details: Section[];
+  created_at: string;
+}
+
+export interface MemberProgress {
+  id: number;
+  user: number;
+  user_email: string;
+  user_username: string;
+  current_section: number | null;
+  current_section_title: string | null;
+  completed_sections: number[];
+  updated_at: string;
+}
+
+export interface CreateGroupPayload {
+  name: string;
+  description?: string;
+}
+
+export interface AddMemberPayload {
+  user_id: number;
+}
+
+export interface CreateGroupBookPayload {
+  ebook_id: number;
+  title?: string;
+}
+
+export interface AdjustSectionsPayload {
+  operation: "merge" | "split";
+  section_ids: number[];
+  split_at?: number;
+}

frontend/src/types/groups.ts

@@ -1,104 +0,0 @@
-/* ── Reading Groups ── */
-
-export interface MemberProgressPublic {
-  user_id: number;
-  user_email: string;
-  current_section: number;
-  total_sections: number;
-  section_label: string;
-  percentage: number;
-  time_spent_seconds: number;
-  updated_at: string;
-}
-
-export interface MemberProgressDetail {
-  id: number;
-  user_id: number;
-  user_email: string;
-  current_section: number;
-  total_sections: number;
-  section_label: string;
-  percentage: number;
-  time_spent_seconds: number;
-  last_position: Record<string, unknown>;
-  is_public: boolean;
-  updated_at: string;
-}
-
-export interface MemberProgressPrivateStub {
-  user_id: number;
-  user_email: string;
-  is_public: false;
-  note: string;
-}
-
-export type MemberProgressEntry =
-  | MemberProgressDetail
-  | MemberProgressPublic
-  | MemberProgressPrivateStub;
-
-export interface GroupMember {
-  id: number;
-  user_id: number;
-  user_email: string;
-  role: "member" | "admin";
-  joined_at: string;
-  progress: MemberProgressPublic | { is_public: false; note: string } | null;
-}
-
-export interface ReadingGroupSummary {
-  id: number;
-  name: string;
-  ebook: number;
-  ebook_title: string;
-  ebook_author: string;
-  created_by_email: string;
-  description: string;
-  member_count: number;
-  my_progress: {
-    current_section: number;
-    percentage: number;
-    time_spent_seconds: number;
-    section_label: string;
-  } | null;
-  created_at: string;
-  updated_at: string;
-}
-
-export interface ReadingGroupDetail extends ReadingGroupSummary {
-  members: GroupMember[];
-}
-
-export interface CreateGroupPayload {
-  name: string;
-  ebook: number;
-  description?: string;
-}
-
-export interface UpdateProgressPayload {
-  current_section: number;
-  percentage?: number;
-  time_spent_delta?: number;
-  last_position?: Record<string, unknown>;
-  is_public?: boolean;
-}
-
-export interface AdminProgressSummary {
-  group_id: number;
-  group_name: string;
-  ebook_title: string;
-  total_members: number;
-  members_started: number;
-  members_finished: number;
-  average_percentage: number;
-  average_time_spent_hours: number;
-  member_details: {
-    user_id: number;
-    user_email: string;
-    current_section: number;
-    percentage: number;
-    time_spent_seconds: number;
-    is_public: boolean;
-    updated_at: string;
-  }[];
-}

packages/shared/src/types.ts

@@ -219,32 +219,44 @@ export interface ApiError {
 
 // ---- Reading Groups ----
 
-export interface ReadingGroupSummary {
+export interface ReadingGroup {
   id: number;
   name: string;
-  ebook: number;
-  ebook_title: string;
-  ebook_author: string;
-  created_by_email: string;
   description: string;
+  admin: number;
+  admin_email: string;
   member_count: number;
-  my_progress: {
-    current_section: number;
-    percentage: number;
-    time_spent_seconds: number;
-    section_label: string;
-  } | null;
   created_at: string;
   updated_at: string;
 }
 
-export interface MemberProgressPublic {
+export interface GroupMembership {
-  user_id: number;
+  id: number;
+  user: number;
   user_email: string;
-  current_section: number;
+  user_username: string;
-  total_sections: number;
+  role: "admin" | "member";
-  section_label: string;
+  joined_at: string;
-  percentage: number;
+}
-  time_spent_seconds: number;
+
-  updated_at: string;
+export interface GroupBookSummary {
+  id: number;
+  title: string;
+  status: "active" | "replaced";
+  section_count: number;
+  created_at: string;
+}
+
+export interface SectionSummary {
+  id: number;
+  title: string;
+  order: number;
+  estimated_reading_minutes: number;
+}
+
+export interface ReadingScheduleEntry {
+  id: number;
+  meeting_number: number;
+  week_date: string;
+  section_ids: number[];
 }

packages/shared/src/utils.ts

@@ -117,10 +117,11 @@ export const API_ENDPOINTS = {
   groups: {
     list: "/api/groups/",
     detail: (id: number) => `/api/groups/${id}/`,
-    membersProgress: (id: number) => `/api/groups/${id}/members/progress/`,
+    books: (groupId: number) => `/api/groups/${groupId}/books/`,
-    myProgress: (id: number) => `/api/groups/${id}/progress/`,
+    bookDetail: (groupId: number, bookId: number) => `/api/groups/${groupId}/books/${bookId}/`,
-    progressSummary: (id: number) => `/api/groups/${id}/progress/summary/`,
+    detectSections: (groupId: number, bookId: number) => `/api/groups/${groupId}/books/${bookId}/detect-sections/`,
-    join: (id: number) => `/api/groups/${id}/join/`,
+    adjustSections: (groupId: number, bookId: number) => `/api/groups/${groupId}/books/${bookId}/adjust-sections/`,
-    leave: (id: number) => `/api/groups/${id}/leave/`,
+    schedule: (groupId: number, bookId: number) => `/api/groups/${groupId}/books/${bookId}/schedule/`,
+    progress: (groupId: number, bookId: number) => `/api/groups/${groupId}/books/${bookId}/progress/`,
   },
 } as const;