Reader: fix auto scroll on recent feed dataview (#97476)

* Reader: fix auto scroll on recent feed dataview

* method not needed

* change to instant scroll behaviour

client/blocks/reader-full-post/index.jsx

@@ -140,11 +140,12 @@ export class FullPostView extends Component {
 		document.addEventListener( 'visibilitychange', this.handleVisibilityChange );
 
 		const scrollableContainer =
-			document.querySelector( '#primary > div > div.recent-feed > section' ) ||
-			document.querySelector( '#primary > div > div' );
+			document.querySelector( '#primary > div > div.recent-feed > section' ) || // for Recent Feed in Dataview
+			document.querySelector( '#primary > div > div' ); // for Recent Feed in Stream
 		if ( scrollableContainer ) {
 			scrollableContainer.addEventListener( 'scroll', this.setScrollDepth );
 			this.scrollableContainer = scrollableContainer; // Save reference for cleanup
+			this.resetScroll();
 		}
 	}
 	componentDidUpdate( prevProps ) {
@@ -165,6 +166,7 @@ export class FullPostView extends Component {
 				this.trackScrollDepth( prevProps.post );
 				this.trackExitBeforeCompletion( prevProps.post );
 				this.setReadingStartTime();
+				this.resetScroll();
 			}
 		}
 
@@ -249,6 +251,7 @@ export class FullPostView extends Component {
 			this.trackReadingTime();
 			this.trackScrollDepth();
 			this.trackExitBeforeCompletion();
+			this.resetScroll();
 		}
 	};
 
@@ -266,14 +269,27 @@ export class FullPostView extends Component {
 		}
 	}
 
+	resetScroll = () => {
+		setTimeout( () => {
+			if ( this.scrollableContainer ) {
+				this.scrollableContainer.scrollTo( {
+					top: 0,
+					left: 0,
+					behavior: 'instant',
+				} );
+			}
+			this.setState( { maxScrollDepth: 0, hasCompleted: false } );
+		}, 0 ); // Defer until after the DOM update
+	};
+
 	setScrollDepth = () => {
 		if ( this.scrollableContainer ) {
 			const scrollTop = this.scrollableContainer.scrollTop;
 			const scrollHeight = this.scrollableContainer.scrollHeight;
 			const clientHeight = this.scrollableContainer.clientHeight;
 			const scrollDepth = ( scrollTop / ( scrollHeight - clientHeight ) ) * 100;
 			this.setState( ( prevState ) => ( {
-				maxScrollDepth: Math.max( prevState.maxScrollDepth, scrollDepth ),
+				maxScrollDepth: Math.max( prevState.maxScrollDepth, scrollDepth ) || 0,
 				hasCompleted: prevState.hasCompleted || scrollDepth >= 90,
 			} ) );
 		}