Fix back/forward scroll jump issue

webclient/src/ScrollToTop.js

@@ -3,9 +3,18 @@ import { withRouter } from 'react-router-dom';
 
 class ScrollToTop extends React.Component {
 	componentDidUpdate(prevProps) {
-		if (this.props.location.pathname !== prevProps.location.pathname) {
+		//console.log(this.props.location.pathname, prevProps.location.pathname);
-			window.scrollTo(0, 0);
+
+		if (this.props.location.pathname === prevProps.location.pathname) {
+			return;
+		}
+
+		if (localStorage.getItem('scrollLock') === 'True') {
+			localStorage.setItem('scrollLock', 'False');
+			return;
 		}
+
+		window.scrollTo(0, 0);
 	}
 
 	render() {

webclient/src/Style-light.css

@@ -181,6 +181,7 @@ span.source {
 }
 
 .forwardDot {
+	cursor: pointer;
 	position: fixed;
 	bottom: 1rem;
 	right: 1rem;

webclient/src/utils.js

@@ -38,13 +38,19 @@ export class ToggleDot extends React.Component {
 }
 
 export class ForwardDot extends React.Component {
+	goForward() {
+		localStorage.setItem('scrollLock', 'True');
+		window.history.forward();
+	}
+
 	render() {
+		const isMobile = /iPhone|iPad|iPod|Android/i.test(navigator.userAgent);
+		if (!isMobile) return null;
+
 		return (
-			<div className='forwardDot'>
+			<div className='forwardDot' onClick={this.goForward}>
 				<div className='button'>
-					<a href='javascript:void(0)' onClick={() => window.history.forward()}>
+					
-						
-					</a>
 				</div>
 			</div>
 		);