feat: Add ScrollToTop component to reset scroll position on route changes.

This commit is contained in:
Van Leemput Dayron
2025-12-15 00:45:24 +01:00
parent a01c6c4356
commit 56897a0c2d
2 changed files with 20 additions and 0 deletions

View File

@@ -6,6 +6,7 @@ import Footer from './components/Footer';
import Home from './components/Home';
import TravelMate from './components/TravelMate';
import Policies from './components/Policies';
import ScrollToTop from './components/ScrollToTop';
import './styles/main.scss';
function App() {
@@ -32,6 +33,7 @@ function App() {
return (
<LanguageProvider>
<BrowserRouter>
<ScrollToTop />
<div className={`app ${darkMode ? 'dark' : 'light'}`} style={{ display: 'flex', flexDirection: 'column', minHeight: '100vh' }}>
<Header darkMode={darkMode} toggleDarkMode={toggleDarkMode} />
<main style={{ flex: 1 }}>

View File

@@ -0,0 +1,18 @@
import { useEffect } from 'react';
import { useLocation } from 'react-router-dom';
const ScrollToTop = () => {
const { pathname } = useLocation();
useEffect(() => {
window.scrollTo({
top: 0,
left: 0,
behavior: 'instant',
});
}, [pathname]);
return null;
};
export default ScrollToTop;