From 0ee9e930f0ebae56fab23e9e045bcc422e70729e Mon Sep 17 00:00:00 2001
From: Martin Dvorak <dvorak@dvorakmortonxd.dev>
Date: Fri, 9 Oct 2026 20:22:28 +0000
Subject: [PATCH] Retry runs get a fresh scroller so the feed can never start
 blank
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Retrying the missed items could leave the feed on a stale position: the
retry swaps the queue (8 slides -> 3) and resets the scroll on the OLD
element, while the browser was still finishing a smooth scroll or snap.
Depending on the engine that could strand the viewport past the new
content (blank feed with the header still showing the old counter), and
the results slide kept its inner scroll because it has no key.

- The scroller now carries key={runId}, so every run mounts a brand-new
  element: scroll position 0, fresh snap state, no inherited inner
  scrolls in any slide.
- The scroll listener re-attaches to the new element (deps [runId]).

New retry suite 12/12: plain retry (fresh element, slide 1, header
Retry 1/N, missed item answerable again), retry fired mid smooth-scroll,
double-tap retry, and retry -> answer -> results -> retry again — all
land on slide 0 with content visible. Regression 74/74, mobile 51/51,
i18n 27/27. Lint + build clean. SW freezmo-v19.
---
 components/StudyFeed.tsx | 10 ++++++++--
 public/sw.js             |  2 +-
 2 files changed, 9 insertions(+), 3 deletions(-)

diff --git a/components/StudyFeed.tsx b/components/StudyFeed.tsx
index 9735495..41cd792 100644
--- a/components/StudyFeed.tsx
+++ b/components/StudyFeed.tsx
@@ -49,7 +49,8 @@ export function StudyFeed({ deck }: { deck: Deck }) {
 
   const next = useCallback(() => goTo(index + 1), [goTo, index]);
 
-  // Track which slide is visible (works for wheel, touch and programmatic scroll).
+  // Track which slide is visible (works for wheel, touch and programmatic
+  // scroll). Re-attached whenever the scroller remounts on a new run (runId).
   useEffect(() => {
     const container = scrollRef.current;
     if (!container) return;
@@ -67,7 +68,7 @@ export function StudyFeed({ deck }: { deck: Deck }) {
       container.removeEventListener("scroll", onScroll);
       cancelAnimationFrame(frame);
     };
-  }, []);
+  }, [runId]);
 
   // Keyboard navigation.
   useEffect(() => {
@@ -262,7 +263,12 @@ export function StudyFeed({ deck }: { deck: Deck }) {
       </header>
 
       {/* Feed ------------------------------------------------------ */}
+      {/* The scroller remounts on every run (key={runId}) so it always
+          starts on the first slide with fresh scroll/snap state: a shrinking
+          queue or an interrupted smooth scroll can never leave the feed on a
+          stale, half-scrolled or blank position. */}
       <div
+        key={runId}
         ref={scrollRef}
         data-testid="study-feed"
         className="no-scrollbar h-full snap-y snap-mandatory overflow-y-scroll overscroll-y-contain [overflow-anchor:none]"
diff --git a/public/sw.js b/public/sw.js
index bfdc731..5dd4f88 100644
--- a/public/sw.js
+++ b/public/sw.js
@@ -9,7 +9,7 @@
  *
  * Bumping CACHE_VERSION is how a new deploy invalidates old assets.
  */
-const CACHE_VERSION = "freezmo-v18";
+const CACHE_VERSION = "freezmo-v19";
 const SHELL_CACHE = `${CACHE_VERSION}-shell`;
 const ASSET_CACHE = `${CACHE_VERSION}-assets`;