[Port to dtq-dev] Improve back navigation logic in ItemComponent#1184
[Port to dtq-dev] Improve back navigation logic in ItemComponent#1184kosarko wants to merge 2 commits intodataquest-dev:dtq-devfrom
Conversation
* Improve back navigation logic in ItemComponent Enhances the navigation logic to use window.history.back() when the previous URL does not match the expected route pattern. Also updates the back button visibility filter to allow empty URLs. * lint fix * copilot fixes copilot fixes * Fix back button visibility logic in ItemComponent Updated the showBackButton observable to correctly determine when the back button should be shown based on the previous route. Also added ngOnInit call in the related test to ensure proper initialization. * Remove unused 'filter' import from item.component.ts The 'filter' operator from 'rxjs/operators' was imported but not used in item.component.ts. This commit cleans up the import statements. * Add session storage for previous URL in item page Introduces generic methods in RouteService to store and retrieve URLs in session storage. ItemComponent now uses session storage to persist and retrieve the previous URL for improved back navigation, falling back to browser history if no valid URL is found. * Add session URL helpers to RouteService stubs in tests Extended RouteService stubs in test files to include storeUrlInSession and getUrlFromSession methods, matching the interface used by ItemComponent and related tests. This ensures test mocks are up-to-date with the service's API. * Simplify back navigation logic in ItemComponent Removed conditional check for previous URL and always navigate using router.navigateByUrl with storedPreviousUrl. (cherry picked from commit 5dfb106)
There was a problem hiding this comment.
Pull request overview
This pull request is a port of ufal#80 to the dtq-dev branch, improving the back navigation logic in ItemComponent by adding session storage support for the previous URL. This enhancement allows the back button to persist across page refreshes and navigation scenarios where the previous URL might not be available from the RouteService.
Changes:
- Added session storage support to remember the previous URL when navigating to an item page
- Implemented generic session storage helper methods in RouteService for storing and retrieving URLs
- Updated navigation logic to fall back to session storage when the current route doesn't provide a valid previous URL
Reviewed changes
Copilot reviewed 6 out of 6 changed files in this pull request and generated 3 comments.
Show a summary per file
| File | Description |
|---|---|
| src/app/core/services/route.service.ts | Added storeUrlInSession and getUrlFromSession methods with SSR-compatible checks for session storage access |
| src/app/item-page/simple/item-types/shared/item.component.ts | Updated ngOnInit to use session storage fallback, simplified back() method to use stored URL, added pickAllowedPrevious helper |
| src/app/item-page/simple/item-types/shared/item.component.spec.ts | Added ngOnInit() call in test to ensure proper initialization before assertions |
| src/app/shared/testing/route-service.stub.ts | Added stubs for storeUrlInSession, getUrlFromSession, and clearUrlFromSession methods |
| src/app/item-page/simple/item-types/untyped-item/untyped-item.component.spec.ts | Added stubs for new session storage methods in local mock route service |
| src/app/item-page/simple/item-types/publication/publication.component.spec.ts | Added stubs for new session storage methods in local mock route service |
Comments suppressed due to low confidence (1)
src/app/item-page/simple/item-types/shared/item.component.spec.ts:519
- The tests in the 'back to results' section don't cover the new session storage fallback behavior introduced in this PR. Consider adding tests for scenarios such as: (1) when getPreviousUrl returns a non-matching URL but getUrlFromSession returns a valid stored URL, the back button should be shown; (2) when storeUrlInSession is called with a valid URL, it should be retrievable later; (3) when the back() method is called, it should navigate to the stored URL. These tests would help verify the core functionality of this PR.
it('should hide back button',() => {
spyOn(mockRouteService, 'getPreviousUrl').and.returnValue(observableOf('/item'));
comp.ngOnInit();
comp.showBackButton.subscribe((val) => {
expect(val).toBeFalse();
});
});
it('should show back button for search', () => {
spyOn(mockRouteService, 'getPreviousUrl').and.returnValue(observableOf(searchUrl));
comp.ngOnInit();
comp.showBackButton.subscribe((val) => {
expect(val).toBeTrue();
});
});
it('should show back button for browse', () => {
spyOn(mockRouteService, 'getPreviousUrl').and.returnValue(observableOf(browseUrl));
comp.ngOnInit();
comp.showBackButton.subscribe((val) => {
expect(val).toBeTrue();
});
});
it('should show back button for recent submissions', () => {
spyOn(mockRouteService, 'getPreviousUrl').and.returnValue(observableOf(recentSubmissionsUrl));
comp.ngOnInit();
comp.showBackButton.subscribe((val) => {
expect(val).toBeTrue();
});
});
|
@amadulhaxxani thank you for the fix. I've tested it and found out one bug.
|
milanmajchrak
left a comment
There was a problem hiding this comment.
There is a bug I've described in the comment
|
@milanmajchrak |
Thank you! |
Include "/home" in ItemComponent's previousRoute regex so the back button is shown for home. Add unit tests to verify the back button appears for a home previous URL and that a home previous URL is prioritized over a session-stored URL (ensuring the session is updated and navigation uses the home URL). (cherry picked from commit 3eb32e5)
Port of ufal#80 by @amadulhaxxani to
dtq-dev.