feat(frontend): reset scroll to top on every route navigation

[hoangsonww]

Problem

Navigating between pages (e.g. Home → Privacy Policy) sometimes leaves the user partway down the new page — the browser keeps the previous page's scroll position.

Fix

Reset scroll to the top from the route CSSTransition's onEnter — i.e. exactly as the incoming page begins entering:

onEnter={() => window.scrollTo(0, 0)}

With the existing out-in transition, the old page fades out at its scroll position, then the new page mounts at the top and fades in. No jarring mid-scroll jump — the fade/slide provides the smoothness, and the new page always starts at the top.

• Tied to the keyed transition (location.pathname), so in-page hash/anchor links are left alone.
• Also covers initial load (appear).

Testing

60 tests / 10 snapshots pass; eslint + prettier clean. Branched off latest master.

🤖 Generated with Claude Code

[netlify]

✅ Deploy Preview for moodify-emotion-music-app ready!

Name	Link
🔨 Latest commit	63d67b5
🔍 Latest deploy log	https://app.netlify.com/projects/moodify-emotion-music-app/deploys/6a40b9d511b3e90009c965e3
😎 Deploy Preview	https://deploy-preview-59--moodify-emotion-music-app.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify project configuration.

[vercel]

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

1 Skipped Deployment

Project	Deployment	Actions	Updated (UTC)
moodify-emotion-music-app	Ignored		Jun 28, 2026 6:06am

[gemini-code-assist]

Code Review

This pull request introduces a scrollToTopOnEnter function to reset the scroll position to the top of the page when navigating to a new route, triggered by the onEnter hook of the page transition. The reviewer suggests checking for the presence of location.hash before scrolling to prevent overriding and breaking anchor-link scrolling behavior.

Important

The consumer version of Gemini Code Assist on GitHub is being sunset. Starting June 18, 2026, new organization installations will be blocked, and all code review activity will officially cease on July 17, 2026.
For more details on the timeline and next steps, please review the Help Documentation.

[gemini-code-assist]

If a user navigates to a new route with a hash anchor (e.g., /privacy-policy#terms-of-service), forcing window.scrollTo(0, 0) will override and break the anchor scrolling behavior. Checking if location.hash is present before scrolling to the top prevents this issue.

Suggested change

	const scrollToTopOnEnter = () => {
	if (typeof window === "undefined") return;
	window.scrollTo(0, 0);
	};
	const scrollToTopOnEnter = () => {
	if (typeof window === "undefined") return;
	if (location.hash) return;
	window.scrollTo(0, 0);
	};