From ee42c841713694132422f5d075034be75b10d4d8 Mon Sep 17 00:00:00 2001
From: Alex Gleason <alex@alexgleason.me>
Date: Sun, 1 Jun 2025 07:32:33 -0500
Subject: [PATCH] Scroll to top during navigation changes

---
 src/AppRouter.tsx              |  2 ++
 src/components/ScrollToTop.tsx | 12 ++++++++++++
 src/test/setup.ts              |  6 ++++++
 3 files changed, 20 insertions(+)
 create mode 100644 src/components/ScrollToTop.tsx

diff --git a/src/AppRouter.tsx b/src/AppRouter.tsx
index 04c4ae4..efa2600 100644
--- a/src/AppRouter.tsx
+++ b/src/AppRouter.tsx
@@ -2,10 +2,12 @@ import { BrowserRouter, Route, Routes } from "react-router-dom";
 
 import Index from "./pages/Index";
 import NotFound from "./pages/NotFound";
+import { ScrollToTop } from "./components/ScrollToTop";
 
 export function AppRouter() {
   return (
     <BrowserRouter>
+      <ScrollToTop />
       <Routes>
         <Route path="/" element={<Index />} />
         {/* ADD ALL CUSTOM ROUTES ABOVE THE CATCH-ALL "*" ROUTE */}
diff --git a/src/components/ScrollToTop.tsx b/src/components/ScrollToTop.tsx
new file mode 100644
index 0000000..5e38302
--- /dev/null
+++ b/src/components/ScrollToTop.tsx
@@ -0,0 +1,12 @@
+import { useEffect } from 'react';
+import { useLocation } from 'react-router-dom';
+
+export function ScrollToTop() {
+  const { pathname } = useLocation();
+
+  useEffect(() => {
+    window.scrollTo(0, 0);
+  }, [pathname]);
+
+  return null;
+}
\ No newline at end of file
diff --git a/src/test/setup.ts b/src/test/setup.ts
index 9a8cb55..a88e31c 100644
--- a/src/test/setup.ts
+++ b/src/test/setup.ts
@@ -14,4 +14,10 @@ Object.defineProperty(window, 'matchMedia', {
     removeEventListener: vi.fn(),
     dispatchEvent: vi.fn(),
   })),
+});
+
+// Mock window.scrollTo
+Object.defineProperty(window, 'scrollTo', {
+  writable: true,
+  value: vi.fn(),
 });
\ No newline at end of file