[#630] Two-phase book page turn with visible page underneath

[realproject7]

Summary

• ReadingMode.tsx: Replaced sequential flip-out/in with simultaneous two-page stack. Both outgoing and incoming pages are in the DOM during the transition. Outgoing page (previous content) is absolutely positioned on top and flips away, revealing the incoming page underneath.
• globals.css: Updated animations — 500ms flip with fold shadow, 120deg rotation for realistic curl, backface-visibility: hidden, and incoming page fade-in.

Fixes #630
Tracks realproject7/agent-os#318

Test plan

• Click Next — outgoing page flips and incoming page visible underneath
• Click Prev — reverse flip direction
• Swipe left/right — same flip effect
• Arrow keys — same flip effect
• No reversed text visible during flip (backface hidden)
• Shadow along fold line during transition
• Smooth on mobile (GPU-accelerated transforms only)
• Build passes

🤖 Generated with Claude Code

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

1 Skipped Deployment

Project	Deployment	Actions	Updated (UTC)
plotlink	Ignored		Mar 30, 2026 8:42pm

[project7-interns]

Verdict: REQUEST CHANGES

Summary

The new two-page stack is the right direction, but the navigation timing now resets the scroll container before the outgoing page animates. That creates a visible jump whenever the reader is not already at the top of the chapter.

Findings

• [high] scrollToTop() now runs immediately after setCurrentIdx(idx), while the outgoing page is still being rendered from the same scrollable container. If the reader is partway through a chapter, the old page will snap back to the top before it flips away, which breaks the page-turn effect across button, swipe, and keyboard navigation.
  • File: src/components/ReadingMode.tsx:55
  • Suggestion: Delay the scroll reset until after the outgoing page animation finishes, or otherwise decouple the outgoing page snapshot from the live scroll position before starting the turn.

Decision

Requesting changes because this revision regresses the core reading interaction for normal mid-chapter navigation, even though the stacked-page approach itself is correct.

[project7-interns]

Verdict: REQUEST CHANGES

Summary

Deferring scrollToTop() fixes the explicit reset timing, but this revision still swaps the in-flow page content before the animation finishes. Because the outgoing page is absolutely positioned and removed from layout, the scroll container can still jump on long-to-short chapter transitions before the turn completes.

Findings

• [high] setCurrentIdx(idx) still runs immediately while the outgoing page is rendered with position: absolute, so the scrollable height becomes the incoming chapter's height during the animation. If the reader is deep in a long chapter and the next chapter is shorter, the browser will clamp the scroll position before the flip completes, and the outgoing page will still visibly jump.
  • File: src/components/ReadingMode.tsx:54
  • File: src/app/globals.css:230
  • Suggestion: Keep the outgoing snapshot contributing to layout until the animation finishes, or freeze the container height/scroll position independently so swapping currentIdx cannot change scroll geometry mid-transition.

Decision

Requesting changes because the current fix handles the explicit scrollToTop() call but not the remaining scroll-geometry jump on mismatched chapter heights, so the page-turn interaction is still unreliable in a common reading flow.

[project7-interns]

Verdict: REQUEST CHANGES

Summary

Freezing the stack height fixes the scroll-clamp problem, but the transition still shares one live scroll container between the outgoing and incoming pages. That means mid-chapter navigation can still reveal the wrong part of the incoming chapter during the flip.

Findings

• [high] The incoming page is rendered underneath in the same scrollable container, but scrollToTop() still does not run until the 500ms timeout completes. As a result, during the flip the underlying page is shown at the reader's old scroll offset rather than from the top of the new chapter. On a long-to-short transition that can reveal blank paper; on long-to-long it reveals the middle of the next chapter. Either way, the PR still does not reliably show the incoming page underneath as intended.
  • File: src/components/ReadingMode.tsx:59
  • File: src/components/ReadingMode.tsx:62
  • File: src/components/ReadingMode.tsx:133
  • Suggestion: Decouple the outgoing page from the live scroll container so the incoming layer can be reset to top immediately, or give the outgoing and incoming layers independent scroll positioning during the animation.

Decision

Requesting changes because the height freeze addresses one scroll bug, but the current structure still cannot show the correct incoming page content underneath the flip for normal mid-chapter navigation.

[project7-interns]

Verdict: APPROVE

Summary

The latest revision fully decouples the outgoing and incoming page state during the flip: the incoming chapter resets to the top immediately, while the outgoing page preserves the reader's prior scroll position with a captured offset and stable container height. That resolves the earlier mid-chapter jump issues while keeping the two-page turn effect intact across the shared navigation paths.

Findings

• No blocking findings.

Decision

Approving because the current revision addresses the prior review feedback and now matches the intended two-phase page-turn behavior for Reading Mode.