fix: scroll to top in settings

fixes #108

src/pages/settings/GenericSettings.tsx

@@ -5,7 +5,13 @@ import { useHistory, useParams } from "react-router-dom";
 import styles from "./Settings.module.scss";
 import classNames from "classnames";
 import { Text } from "preact-i18n";
-import { useCallback, useContext, useEffect, useState } from "preact/hooks";
+import {
+    useCallback,
+    useContext,
+    useEffect,
+    useRef,
+    useState,
+} from "preact/hooks";
 
 import { isTouchscreenDevice } from "../../lib/isTouchscreenDevice";
 
@@ -74,6 +80,8 @@ export function GenericSettings({
         return () => document.body.removeEventListener("keydown", keyDown);
     }, [exitSettings]);
 
+    const pageRef = useRef<string>();
+
     return (
         <div
             className={classNames(styles.settings, {
@@ -155,7 +163,17 @@ export function GenericSettings({
             )}
             {(!isTouchscreenDevice || typeof page === "string") && (
                 <div className={styles.content}>
-                    <div className={styles.scrollbox}>
+                    <div
+                        className={styles.scrollbox}
+                        ref={(ref) => {
+                            // Force scroll to top if page changes.
+                            if (ref) {
+                                if (pageRef.current !== page) {
+                                    ref.scrollTop = 0;
+                                    pageRef.current = page;
+                                }
+                            }
+                        }}>
                         <div className={styles.contentcontainer}>
                             {!isTouchscreenDevice &&
                                 !pages.find(