diff --git a/apps/openchallenges/app/src/app/app.config.ts b/apps/openchallenges/app/src/app/app.config.ts index 12958f2650..7ca8d2b81f 100644 --- a/apps/openchallenges/app/src/app/app.config.ts +++ b/apps/openchallenges/app/src/app/app.config.ts @@ -54,7 +54,7 @@ export const appConfig: ApplicationConfig = { scrollPositionRestoration: 'enabled', }), withRouterConfig({ - onSameUrlNavigation: 'ignore', + onSameUrlNavigation: 'reload', }) ), ], diff --git a/libs/shared/typescript/util/src/lib/directives/custom-scroll-restore.directive.ts b/libs/shared/typescript/util/src/lib/directives/custom-scroll-restore.directive.ts index 1b1341acab..8204d3d553 100644 --- a/libs/shared/typescript/util/src/lib/directives/custom-scroll-restore.directive.ts +++ b/libs/shared/typescript/util/src/lib/directives/custom-scroll-restore.directive.ts @@ -1,22 +1,15 @@ import { ViewportScroller } from '@angular/common'; import { AfterViewInit, Directive, OnInit } from '@angular/core'; -import { - Event, - NavigationStart, - Router, - RouterEvent, - RoutesRecognized, - Scroll, -} from '@angular/router'; -import { Observable, combineLatest, filter, pairwise, tap } from 'rxjs'; +import { Event, Router, RoutesRecognized, Scroll } from '@angular/router'; +import { combineLatest, filter, pairwise } from 'rxjs'; /** * A directive for restoring scroll positions based on the method of navigation. * It helps preserve the user's scroll position during various types of navigation actions. * - Backward navigation: Scrolls to the previous position. * - Anchor navigation: Scrolls to a specified anchor. - * - Same page navigation: Maintains the current scroll position. - * - Forward navigation: Scrolls to the top of the page. + * - Param navigation: Maintains the current scroll position, + * - Forward navigation/Same url navigation: Scrolls to the top of the page. */ @Directive({ @@ -42,7 +35,6 @@ export class CustomScrollRestoreDirective implements OnInit, AfterViewInit { } ngAfterViewInit(): void { - // Listen to router events to determine the appropriate scroll restoration method. const routesRecognized$ = this.router.events.pipe( filter( (e: Event): e is RoutesRecognized => e instanceof RoutesRecognized @@ -54,45 +46,30 @@ export class CustomScrollRestoreDirective implements OnInit, AfterViewInit { filter((e: Event): e is Scroll => e instanceof Scroll) ); + // listen to router events to determine the appropriate scroll restoration method combineLatest([routesRecognized$, scroll$]).subscribe( ([routeEvents, scrollEvent]) => { const previousUrl = routeEvents[0].urlAfterRedirects; const currentUrl = routeEvents[1].urlAfterRedirects; - + const isSamePageUrl = previousUrl === currentUrl; + console.log(1); if (scrollEvent.position) { // backward navigation this.viewportScroller.scrollToPosition(scrollEvent.position); } else if (scrollEvent.anchor) { // anchor navigation this.viewportScroller.scrollToAnchor(scrollEvent.anchor); - } else if (previousUrl.split('?')[0] === currentUrl.split('?')[0]) { - // same page navigation + } else if ( + !isSamePageUrl && + previousUrl.split('?')[0] === currentUrl.split('?')[0] + ) { + // param navigation excluding exact the same full url this.viewportScroller.scrollToPosition([this.scrollX, this.scrollY]); } else { - // forward navigation - restore scroll position to top + // forward navigation / same url navigation - restore scroll position to top this.viewportScroller.scrollToPosition([0, 0]); } } ); - - // this.router.events - // .pipe(filter((e: Event): e is Scroll => e instanceof Scroll)) - // .subscribe((e) => { - // if (e.position) { - // // backward navigation - // this.viewportScroller.scrollToPosition(e.position); - // } else if (e.anchor) { - // // anchor navigation - // this.viewportScroller.scrollToAnchor(e.anchor); - // } else if ( - // this.previousUrl.split('?')[0] === e.routerEvent.url.split('?')[0] - // ) { - // // same page navigation - // this.viewportScroller.scrollToPosition([this.scrollX, this.scrollY]); - // } else { - // // forward navigation - restore scroll position to top - // this.viewportScroller.scrollToPosition([0, 0]); - // } - // }); } }