diff --git a/src/app/shared/browse-by/browse-by.component.spec.ts b/src/app/shared/browse-by/browse-by.component.spec.ts index 8bda44b11c..1f0d5cfae7 100644 --- a/src/app/shared/browse-by/browse-by.component.spec.ts +++ b/src/app/shared/browse-by/browse-by.component.spec.ts @@ -247,10 +247,12 @@ describe('BrowseByComponent', () => { }); describe('back', () => { it('should navigate back to the main browse page', () => { + const id = 'test-pagination'; comp.back(); - expect(paginationService.updateRoute).toHaveBeenCalledWith('test-pagination', {page: 1}, { + expect(paginationService.updateRoute).toHaveBeenCalledWith(id, {page: 1}, { value: null, - startsWith: null + startsWith: null, + [id + '.return']: null }); }); }); diff --git a/src/app/shared/browse-by/browse-by.component.ts b/src/app/shared/browse-by/browse-by.component.ts index 1132b41124..2c1844a310 100644 --- a/src/app/shared/browse-by/browse-by.component.ts +++ b/src/app/shared/browse-by/browse-by.component.ts @@ -1,10 +1,10 @@ -import { Component, EventEmitter, Injector, Input, OnInit, Output } from '@angular/core'; +import { Component, EventEmitter, Injector, Input, OnDestroy, OnInit, Output } from '@angular/core'; import { RemoteData } from '../../core/data/remote-data'; import { PaginatedList } from '../../core/data/paginated-list.model'; import { PaginationComponentOptions } from '../pagination/pagination-component-options.model'; import { SortDirection, SortOptions } from '../../core/cache/models/sort-options.model'; import { fadeIn, fadeInOut } from '../animations/fade'; -import { combineLatest as observableCombineLatest, Observable } from 'rxjs'; +import { BehaviorSubject, combineLatest as observableCombineLatest, Observable, Subscription } from 'rxjs'; import { ListableObject } from '../object-collection/shared/listable-object.model'; import { getStartsWithComponent, StartsWithType } from '../starts-with/starts-with-decorator'; import { PaginationService } from '../../core/pagination/pagination.service'; @@ -12,6 +12,7 @@ import { ViewMode } from '../../core/shared/view-mode.model'; import { RouteService } from '../../core/services/route.service'; import { map } from 'rxjs/operators'; import { hasValue } from '../empty.util'; +import { BBM_PAGINATION_ID } from '../../browse-by/browse-by-metadata-page/browse-by-metadata-page.component'; @Component({ selector: 'ds-browse-by', @@ -25,7 +26,7 @@ import { hasValue } from '../empty.util'; /** * Component to display a browse-by page for any ListableObject */ -export class BrowseByComponent implements OnInit { +export class BrowseByComponent implements OnInit, OnDestroy { /** * ViewMode that should be passed to {@link ListableObjectComponentLoaderComponent}. @@ -112,6 +113,16 @@ export class BrowseByComponent implements OnInit { */ shouldDisplayResetButton$: Observable; + /** + * Page number of the previous page + */ + previousPage$ = new BehaviorSubject('1'); + + /** + * Subscription that has to be unsubscribed from on destroy + */ + sub: Subscription; + public constructor(private injector: Injector, protected paginationService: PaginationService, private routeService: RouteService, @@ -171,9 +182,20 @@ export class BrowseByComponent implements OnInit { this.shouldDisplayResetButton$ = observableCombineLatest([startsWith$, value$]).pipe( map(([startsWith, value]) => hasValue(startsWith) || hasValue(value)) ); + this.sub = this.routeService.getQueryParameterValue(this.paginationConfig.id + '.return').subscribe(this.previousPage$); } + /** + * Navigate back to the previous browse by page + */ back() { - this.paginationService.updateRoute(this.paginationConfig.id, {page: 1}, {value: null, startsWith: null}); + const page = +this.previousPage$.value > 1 ? +this.previousPage$.value : 1; + this.paginationService.updateRoute(this.paginationConfig.id, {page: page}, {[this.paginationConfig.id + '.return']: null, value: null, startsWith: null}); + } + + ngOnDestroy(): void { + if (this.sub) { + this.sub.unsubscribe(); + } } } diff --git a/src/app/shared/object-list/browse-entry-list-element/browse-entry-list-element.component.html b/src/app/shared/object-list/browse-entry-list-element/browse-entry-list-element.component.html index 94cc590988..dcbdd77bff 100644 --- a/src/app/shared/object-list/browse-entry-list-element/browse-entry-list-element.component.html +++ b/src/app/shared/object-list/browse-entry-list-element/browse-entry-list-element.component.html @@ -1,5 +1,5 @@
- + {{object.value}} diff --git a/src/app/shared/object-list/browse-entry-list-element/browse-entry-list-element.component.spec.ts b/src/app/shared/object-list/browse-entry-list-element/browse-entry-list-element.component.spec.ts index d37f82234d..7d3d9e1eae 100644 --- a/src/app/shared/object-list/browse-entry-list-element/browse-entry-list-element.component.spec.ts +++ b/src/app/shared/object-list/browse-entry-list-element/browse-entry-list-element.component.spec.ts @@ -4,7 +4,9 @@ import { By } from '@angular/platform-browser'; import { TruncatePipe } from '../../utils/truncate.pipe'; import { BrowseEntryListElementComponent } from './browse-entry-list-element.component'; import { BrowseEntry } from '../../../core/shared/browse-entry.model'; - +import { PaginationService } from '../../../core/pagination/pagination.service'; +import { RouteService } from '../../../core/services/route.service'; +import { of as observableOf } from 'rxjs'; let browseEntryListElementComponent: BrowseEntryListElementComponent; let fixture: ComponentFixture; @@ -13,12 +15,28 @@ const mockValue: BrowseEntry = Object.assign(new BrowseEntry(), { value: 'De Langhe Kristof' }); -describe('MetadataListElementComponent', () => { +let paginationService; +let routeService; +const pageParam = 'bbm.page'; + +function init() { + paginationService = jasmine.createSpyObj('paginationService', { + getPageParam: pageParam + }); + + routeService = jasmine.createSpyObj('routeService', { + getQueryParameterValue: observableOf('1') + }) +} +describe('BrowseEntryListElementComponent', () => { beforeEach(waitForAsync(() => { + init(); TestBed.configureTestingModule({ declarations: [BrowseEntryListElementComponent, TruncatePipe], providers: [ - { provide: 'objectElementProvider', useValue: { mockValue } } + { provide: 'objectElementProvider', useValue: { mockValue } }, + {provide: PaginationService, useValue: paginationService}, + {provide: RouteService, useValue: routeService}, ], schemas: [NO_ERRORS_SCHEMA] diff --git a/src/app/shared/object-list/browse-entry-list-element/browse-entry-list-element.component.ts b/src/app/shared/object-list/browse-entry-list-element/browse-entry-list-element.component.ts index 235ac0665a..667da726ed 100644 --- a/src/app/shared/object-list/browse-entry-list-element/browse-entry-list-element.component.ts +++ b/src/app/shared/object-list/browse-entry-list-element/browse-entry-list-element.component.ts @@ -7,6 +7,9 @@ import { listableObjectComponent } from '../../object-collection/shared/listable import { PaginationService } from '../../../core/pagination/pagination.service'; import { Params } from '@angular/router'; import { BBM_PAGINATION_ID } from '../../../browse-by/browse-by-metadata-page/browse-by-metadata-page.component'; +import { RouteService } from 'src/app/core/services/route.service'; +import { Observable } from 'rxjs'; +import { map } from 'rxjs/operators'; @Component({ selector: 'ds-browse-entry-list-element', @@ -19,26 +22,34 @@ import { BBM_PAGINATION_ID } from '../../../browse-by/browse-by-metadata-page/br */ @listableObjectComponent(BrowseEntry, ViewMode.ListElement) export class BrowseEntryListElementComponent extends AbstractListableElementComponent implements OnInit { - queryParams: Params; + /** + * Emits the query parameters for the link of this browse entry list element + */ + queryParams$: Observable; - constructor(private paginationService: PaginationService) { + constructor(private paginationService: PaginationService, private routeService: RouteService) { super(); } ngOnInit() { - this.queryParams = this.getQueryParams(); + this.queryParams$ = this.getQueryParams(); } /** * Get the query params to access the item page of this browse entry. */ - private getQueryParams(): Params { + private getQueryParams(): Observable { const pageParamName = this.paginationService.getPageParam(BBM_PAGINATION_ID); - return { - value: this.object.value, - authority: !!this.object.authority ? this.object.authority : undefined, - startsWith: undefined, - [pageParamName]: null, - }; + return this.routeService.getQueryParameterValue(pageParamName).pipe( + map((currentPage) => { + return { + value: this.object.value, + authority: !!this.object.authority ? this.object.authority : undefined, + startsWith: undefined, + [pageParamName]: null, + [BBM_PAGINATION_ID + '.return']: currentPage + }; + }) + ); } }