always scroll to top on route change, except on back nav

This commit is contained in:
Martti Malmi
2024-02-16 10:27:54 +02:00
parent 73753c2764
commit 86906682f9
5 changed files with 10 additions and 6 deletions

View File

@ -225,7 +225,6 @@ export function ThreadRoute({ id }: { id?: string }) {
return (
<ThreadContextWrapper link={link}>
<ScrollToTop />
<Thread />
</ThreadContextWrapper>
);

View File

@ -1,12 +1,16 @@
import { useEffect } from "react";
import { useLocation } from "react-router-dom";
import { useLocation, useNavigationType } from "react-router-dom";
export default function ScrollToTop() {
const { pathname } = useLocation();
const navigationType = useNavigationType(); // This hook is available in React Router v6
useEffect(() => {
window.scrollTo(0, 0);
}, [pathname]);
if (navigationType !== "POP") {
window.scrollTo(0, 0);
}
// Only scrolls to top on PUSH or REPLACE, not on POP
}, [pathname, navigationType]);
return null;
}