mirror of
https://github.com/Alfresco/alfresco-ng2-components.git
synced 2025-07-24 17:32:15 +00:00
[MNT-22924] Fix slow search results loading, limit number of pages (#7609)
* [MNT-22924] Fix slow search results loading, limit number of pages * Add unit test * Changed some of the values
This commit is contained in:
@@ -41,20 +41,20 @@
|
||||
data-automation-id="page-selector"
|
||||
[attr.aria-label]="'CORE.PAGINATION.ARIA.CURRENT_PAGE' | translate"
|
||||
[matMenuTriggerFor]="pagesMenu"
|
||||
*ngIf="pages.length > 1">
|
||||
*ngIf="lastPage > 1">
|
||||
<mat-icon>arrow_drop_down</mat-icon>
|
||||
</button>
|
||||
|
||||
<div *ngIf="pagination.totalItems">
|
||||
<span class="adf-pagination__total-pages">
|
||||
{{ 'CORE.PAGINATION.TOTAL_PAGES' | translate: { total: pages.length } }}
|
||||
{{ 'CORE.PAGINATION.TOTAL_PAGES' | translate: { total: lastPage } }}
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<mat-menu #pagesMenu="matMenu" class="adf-pagination__page-selector">
|
||||
<button
|
||||
mat-menu-item
|
||||
*ngFor="let pageNumber of pages"
|
||||
*ngFor="let pageNumber of limitedPages"
|
||||
(click)="onChangePageNumber(pageNumber)">
|
||||
{{ pageNumber }}
|
||||
</button>
|
||||
|
@@ -373,4 +373,23 @@ describe('PaginationComponent', () => {
|
||||
expect(component.pages).toEqual([1]);
|
||||
});
|
||||
});
|
||||
|
||||
describe('many pages', () => {
|
||||
it('should all the pages be available if equal or less than 100', () => {
|
||||
component.pagination = new FakePaginationInput(100, 30, 5);
|
||||
|
||||
expect(component.limitedPages.length).toBe(100);
|
||||
expect(component.pages).toEqual(component.limitedPages);
|
||||
});
|
||||
|
||||
it('should only some pages be available if over 100', () => {
|
||||
component.pagination = new FakePaginationInput(101, 30, 5);
|
||||
|
||||
const expectedPages = [1, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24, 25, 26, 27, 28, 29, 30,
|
||||
31, 32, 33, 34, 35, 36, 37, 38, 39, 40, 41, 42, 43, 44, 45, 46, 47, 48, 49, 50, 101];
|
||||
console.log(component.pagination.totalItems, component.pagination.skipCount);
|
||||
expect(component.limitedPages).toEqual(expectedPages);
|
||||
expect(component.limitedPages).not.toEqual(component.pages);
|
||||
});
|
||||
});
|
||||
});
|
||||
|
@@ -214,6 +214,20 @@ export class PaginationComponent implements OnInit, OnDestroy, PaginationCompone
|
||||
.map((_, index) => (index + 1));
|
||||
}
|
||||
|
||||
get limitedPages(): number[] {
|
||||
if (this.lastPage <= 100) {
|
||||
return this.pages;
|
||||
}
|
||||
const twentyItems = Array.from(Array(20));
|
||||
return [
|
||||
1,
|
||||
...twentyItems.map((_, i) => this.current - i - 1).reverse(),
|
||||
this.current,
|
||||
...twentyItems.map((_, i) => this.current + i + 1),
|
||||
this.lastPage
|
||||
].filter((value: number, index: number, array: number[]) => value > 0 && value <= this.lastPage && !array.slice(0, index).includes(value));
|
||||
}
|
||||
|
||||
get itemRangeText(): string {
|
||||
const rangeString = this.range.join('-');
|
||||
|
||||
|
Reference in New Issue
Block a user