diff --git a/packages/volto/src/helpers/ScrollToTop/ScrollToTop.jsx b/packages/volto/src/helpers/ScrollToTop/ScrollToTop.jsx index 8122fbea63..8e1ffe40f6 100644 --- a/packages/volto/src/helpers/ScrollToTop/ScrollToTop.jsx +++ b/packages/volto/src/helpers/ScrollToTop/ScrollToTop.jsx @@ -3,18 +3,7 @@ import PropTypes from 'prop-types'; import { connect } from 'react-redux'; import config from '@plone/volto/registry'; -/** - * - * - * @class ScrollToTop - * @extends {Component} - */ class ScrollToTop extends React.Component { - /** - * Property types. - * @property {Object} propTypes Property types. - * @static - */ static propTypes = { location: PropTypes.shape({ pathname: PropTypes.string, @@ -22,32 +11,34 @@ class ScrollToTop extends React.Component { children: PropTypes.node.isRequired, }; - /** - * @param {*} prevProps Previous Props - * @returns {null} Null - * @memberof ScrollToTop - */ + constructor(props) { + super(props); + this.isInitialLoad = true; // Add a flag for the initial load + } + componentDidUpdate(prevProps) { const { location } = this.props; - const noInitialBlocksFocus = // Do not scroll on /edit + const noInitialBlocksFocus = config.blocks?.initialBlocksFocus === null ? this.props.location?.pathname.slice(-5) !== '/edit' : true; const isHash = location?.hash || location?.pathname.hash; + + // Scroll only if it's not the initial load and other conditions are met if ( + !this.isInitialLoad && // Prevent scrolling on the initial load !isHash && noInitialBlocksFocus && location?.pathname !== prevProps.location?.pathname ) { window.scrollTo(0, 0); } + + // Reset the initial load flag after the first render + this.isInitialLoad = false; } - /** - * @returns {node} Children - * @memberof ScrollToTop - */ render() { return this.props.children; }