fix(app): preserve prior scrollRestoration value across mount/unmount (#5404)

Follow-up to #5403 addressing review feedback that arrived after the
original PR was squash-merged.

Because #5403 was squash-merged, this branch's individual commits show
as new against `main`. The diff therefore covers both the feedback fix
and the original commits — the description below reflects the full diff.

## Summary
- **Preserve prior `history.scrollRestoration`** in `HomePage` and
`PlotsPage` (the new bit). Capture the value on mount and restore it on
unmount, instead of hard-setting `'auto'` — avoids clobbering a
non-default value set elsewhere.
- **Scroll-to-top on forward navigation** in `RootLayout` (carried over
from the squash-merged #5403). Skips POP navigation so browser
back/forward keeps native scroll restoration; skips when a hash anchor
is present so in-page anchors still work. Comment in the source updated
to accurately describe the SPA-PUSH cause (per review feedback).
- **Scoped `scrollRestoration='manual'`** in `HomePage`/`PlotsPage` to
those pages with cleanup on unmount, so other routes get native browser
back/forward behavior.
- **Tests:** new `RootLayout.test.tsx` (PUSH scrolls, hash skips);
extended `HomePage.test.tsx` and `PlotsPage.test.tsx` covering
mount/unmount restoration for both `'auto'` and `'manual'` prior values.

## User-facing behavior
- Clicking a footer link like `/legal` from a long page now lands at the
top.
- Browser back/forward to a route without custom scroll handling
restores the previous position.
- Pages that manage their own saved scroll (`HomePage`, `PlotsPage`)
still restore from their persisted state.

## Test plan
- [ ] `cd app && yarn test` — all suites pass
- [ ] Navigate `/plots` → footer `/legal` lands at top
- [ ] Browser back from `/legal` to `/plots` restores prior scroll
- [ ] In-page hash anchor (e.g. `/about#section`) still scrolls to
anchor

---------

Co-authored-by: Claude <noreply@anthropic.com>

Author: MarkusNeusinger

app/src/components/RootLayout.tsx

@@ -27,12 +27,12 @@ export function RootLayout() {
   const navigationType = useNavigationType();
   const mastheadSticks = pathname !== '/plots';
 
-  // Reset scroll on forward navigation (PUSH/REPLACE). Without this, short
-  // pages like /legal inherit the previous page's scroll position because
-  // PlotsPage sets scrollRestoration='manual'. Skip on POP so browser
-  // back/forward keeps native scroll restoration; skip when a hash anchor
-  // is present so in-page anchors still work. PlotsPage runs its own
-  // saved-scroll restore in a later effect, so it still overrides this.
+  // Reset scroll on forward navigation (PUSH/REPLACE). In SPA route changes,
+  // the next page can otherwise keep the previous page's scroll position,
+  // which is especially noticeable on short pages like /legal. Skip on POP
+  // so browser back/forward keeps native scroll restoration; skip when a
+  // hash anchor is present so in-page anchors still work. Pages with their
+  // own saved-scroll restore in a later effect can still override this.
   useEffect(() => {
     if (hash) return;
     if (navigationType === 'POP') return;

app/src/pages/HomePage.test.tsx

@@ -124,12 +124,20 @@ describe('HomePage', () => {
       history.scrollRestoration = original;
     });
 
-    it("sets scrollRestoration to 'manual' on mount and restores 'auto' on unmount", () => {
+    it("sets scrollRestoration to 'manual' on mount and restores the previous value on unmount", () => {
       history.scrollRestoration = 'auto';
       const { unmount } = render(<HomePage />);
       expect(history.scrollRestoration).toBe('manual');
       unmount();
       expect(history.scrollRestoration).toBe('auto');
     });
+
+    it('restores a non-default previous value on unmount instead of forcing auto', () => {
+      history.scrollRestoration = 'manual';
+      const { unmount } = render(<HomePage />);
+      expect(history.scrollRestoration).toBe('manual');
+      unmount();
+      expect(history.scrollRestoration).toBe('manual');
+    });
   });
 });

app/src/pages/HomePage.tsx

@@ -29,13 +29,15 @@ export function HomePage() {
   const { homeStateRef, saveScrollPosition } = useHomeState();
 
   // Disable browser's automatic scroll restoration so we can restore from
-  // our persisted state (homeStateRef.scrollY) instead. Restore on unmount
-  // so other routes get native back/forward behavior.
+  // our persisted state (homeStateRef.scrollY) instead. Capture the prior
+  // mode and restore it on unmount, so we don't clobber any non-default
+  // value set elsewhere and other routes get back native behavior.
   useEffect(() => {
     if (!('scrollRestoration' in history)) return;
+    const previous = history.scrollRestoration;
     history.scrollRestoration = 'manual';
     return () => {
-      history.scrollRestoration = 'auto';
+      history.scrollRestoration = previous;
     };
   }, []);
 

app/src/pages/PlotsPage.test.tsx

@@ -76,12 +76,20 @@ describe('PlotsPage', () => {
       history.scrollRestoration = original;
     });
 
-    it("sets scrollRestoration to 'manual' on mount and restores 'auto' on unmount", () => {
+    it("sets scrollRestoration to 'manual' on mount and restores the previous value on unmount", () => {
       history.scrollRestoration = 'auto';
       const { unmount } = render(<PlotsPage />);
       expect(history.scrollRestoration).toBe('manual');
       unmount();
       expect(history.scrollRestoration).toBe('auto');
     });
+
+    it('restores a non-default previous value on unmount instead of forcing auto', () => {
+      history.scrollRestoration = 'manual';
+      const { unmount } = render(<PlotsPage />);
+      expect(history.scrollRestoration).toBe('manual');
+      unmount();
+      expect(history.scrollRestoration).toBe('manual');
+    });
   });
 });

app/src/pages/PlotsPage.tsx

@@ -22,13 +22,15 @@ export function PlotsPage() {
   const { homeStateRef, saveScrollPosition } = useHomeState();
 
   // Disable browser's automatic scroll restoration so we can restore from
-  // our persisted state (homeStateRef.scrollY) instead. Restore on unmount
-  // so other routes get native back/forward behavior.
+  // our persisted state (homeStateRef.scrollY) instead. Capture the prior
+  // mode and restore it on unmount, so we don't clobber any non-default
+  // value set elsewhere and other routes get back native behavior.
   useEffect(() => {
     if (!('scrollRestoration' in history)) return;
+    const previous = history.scrollRestoration;
     history.scrollRestoration = 'manual';
     return () => {
-      history.scrollRestoration = 'auto';
+      history.scrollRestoration = previous;
     };
   }, []);