scott/crabfit
1
0
Fork 0
Code Issues Pull requests Actions Packages Projects Releases Wiki Activity

Scroll to top of page when navigating

Browse source
This commit is contained in:
Ben Grant 2021-06-17 00:37:55 +10:00
parent 47dd4d2fe0
commit 58c783d9fc
1 changed files with 9 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

9
crabfit-frontend/src/components/Settings/Settings.tsx
View file

@ -1,5 +1,6 @@
import { useState, useEffect, useRef } from 'react'; import { useState, useEffect, useRef } from 'react';
import { useTheme } from '@emotion/react'; import { useTheme } from '@emotion/react';
import { useLocation } from 'react-router-dom';
import { useTranslation } from 'react-i18next'; import { useTranslation } from 'react-i18next';
import dayjs from 'dayjs'; import dayjs from 'dayjs';
@ -25,6 +26,7 @@ const setDefaults = (lang, store) => {
}; };
const Settings = () => { const Settings = () => {
const { pathname } = useLocation();
const theme = useTheme(); const theme = useTheme();
const store = useSettingsStore(); const store = useSettingsStore();
const [isOpen, _setIsOpen] = useState(false); const [isOpen, _setIsOpen] = useState(false);
@ -71,6 +73,13 @@ const Settings = () => {
setDefaults(lang, store); setDefaults(lang, store);
}); });
// Reset scroll on navigation
useEffect(() => {
document.documentElement.style.scrollBehavior = 'auto';
window.scrollTo(0, 0);
document.documentElement.style.scrollBehavior = 'smooth';
}, [pathname]);
return ( return (
<> <>
<OpenButton <OpenButton