Scroll to top after page change

Author: oharsta

public-gui/src/routes/About.jsx

@@ -3,11 +3,16 @@ import I18n from "../locale/I18n.js";
 import "./About.scss";
 import {useAppStore} from "../stores/AppStore.js";
 import {Background} from "../components/Background.jsx";
+import {useEffect} from "react";
 
 export const About = () => {
 
     const config = useAppStore((state) => state.config);
 
+    useEffect(() => {
+        window.scroll(0, 0);
+    }, []);
+
     return (
         <div className="about-container">
             <div className="about">

public-gui/src/routes/Home.jsx

@@ -10,13 +10,18 @@ import {useAppStore} from "../stores/AppStore.js";
 import {Button} from "@surfnet/sds";
 import {Link} from "react-router";
 import {Background} from "../components/Background.jsx";
+import {useEffect} from "react";
 
 export const Home = () => {
 
     const config = useAppStore((state) => state.config);
 
     const isMobile = "ontouchstart" in window || navigator.maxTouchPoints > 0;
 
+    useEffect(() => {
+        window.scroll(0, 0);
+    }, []);
+
     return (
         <div className="home-container">
             <div className="home">

public-gui/src/routes/ServiceDesk.jsx

@@ -1,9 +1,14 @@
 import I18n from "../locale/I18n.js";
 import "./ServiceDesk.scss"
 import FrontDesk from "../assets/frontdesk.svg";
+import {useEffect} from "react";
 
 export const ServiceDesk = () => {
 
+    useEffect(() => {
+        window.scroll(0, 0);
+    }, []);
+
     return (
         <div className="servicedesk-container">
             <div className="servicedesk">

public-gui/src/routes/Support.jsx

@@ -5,11 +5,16 @@ import support from "../assets/support.svg";
 import mobileScreenshot from "../assets/mobile_screenshot.svg";
 import {Background} from "../components/Background.jsx";
 import {useAppStore} from "../stores/AppStore.js";
+import {useEffect} from "react";
 
 export const Support = () => {
 
     const config = useAppStore((state) => state.config);
 
+    useEffect(() => {
+        window.scroll(0, 0);
+    }, []);
+
     return (
         <div className="support-container">
             <div className="support">