mirror of
https://github.com/Alfresco/alfresco-ng2-components.git
synced 2025-07-24 17:32:15 +00:00
[ADF-4042] fix reset pagination issue when enter in a folder (#4281)
* fix reset pagination issue when enter in a folder * fix pagination new folder issue and infintie pagiantion
This commit is contained in:
@@ -742,17 +742,21 @@ describe('ContentNodeSelectorComponent', () => {
|
||||
});
|
||||
|
||||
it('button callback should load the next batch of folder results when there is no searchTerm', () => {
|
||||
const skipCount = 5;
|
||||
|
||||
component.searchTerm = '';
|
||||
fixture.detectChanges();
|
||||
|
||||
component.getNextPageOfSearch({ skipCount });
|
||||
component.getNextPageOfSearch({
|
||||
hasMoreItems: false,
|
||||
skipCount: 10,
|
||||
maxItems: 45,
|
||||
totalItems: 0
|
||||
});
|
||||
|
||||
fixture.detectChanges();
|
||||
expect(component.searchTerm).toBe('');
|
||||
|
||||
expect(component.infiniteScroll).toBeTruthy();
|
||||
expect(component.skipCount).toBe(skipCount);
|
||||
expect(component.pagination.maxItems).toBe(45);
|
||||
expect(searchSpy).not.toHaveBeenCalled();
|
||||
});
|
||||
|
||||
|
@@ -16,7 +16,7 @@
|
||||
*/
|
||||
|
||||
import { Component, EventEmitter, Input, OnInit, Output, ViewChild, ViewEncapsulation } from '@angular/core';
|
||||
import { HighlightDirective, UserPreferencesService, PaginationModel } from '@alfresco/adf-core';
|
||||
import { HighlightDirective, UserPreferencesService, PaginationModel, UserPreferenceValues, InfinitePaginationComponent } from '@alfresco/adf-core';
|
||||
import { FormControl } from '@angular/forms';
|
||||
import { Node, NodePaging, Pagination, SiteEntry, SitePaging } from '@alfresco/js-api';
|
||||
import { DocumentListComponent } from '../document-list/components/document-list.component';
|
||||
@@ -24,7 +24,6 @@ import { RowFilter } from '../document-list/data/row-filter.model';
|
||||
import { ImageResolver } from '../document-list/data/image-resolver.model';
|
||||
import { ContentNodeSelectorService } from './content-node-selector.service';
|
||||
import { debounceTime } from 'rxjs/operators';
|
||||
import { BehaviorSubject } from 'rxjs';
|
||||
import { CustomResourcesService } from '../document-list/services/custom-resources.service';
|
||||
import { ShareDataRow } from '../document-list';
|
||||
|
||||
@@ -41,6 +40,13 @@ const defaultValidation = () => true;
|
||||
})
|
||||
export class ContentNodeSelectorPanelComponent implements OnInit {
|
||||
|
||||
static DEFAULT_PAGINATION: Pagination = new Pagination({
|
||||
maxItems: 25,
|
||||
skipCount: 0,
|
||||
totalItems: 0,
|
||||
hasMoreItems: false
|
||||
});
|
||||
|
||||
/** Node ID of the folder currently listed. */
|
||||
@Input()
|
||||
currentFolderId: string = null;
|
||||
@@ -105,7 +111,7 @@ export class ContentNodeSelectorPanelComponent implements OnInit {
|
||||
|
||||
/** Number of items shown per page in the list. */
|
||||
@Input()
|
||||
pageSize: number;
|
||||
pageSize: number = ContentNodeSelectorPanelComponent.DEFAULT_PAGINATION.maxItems;
|
||||
|
||||
/** Function used to decide if the selected node has permission to be selected.
|
||||
* Default value is a function that always returns true.
|
||||
@@ -139,16 +145,19 @@ export class ContentNodeSelectorPanelComponent implements OnInit {
|
||||
inDialog: boolean = false;
|
||||
_chosenNode: Node = null;
|
||||
folderIdToShow: string | null = null;
|
||||
pagination: BehaviorSubject<PaginationModel>;
|
||||
|
||||
skipCount: number = 0;
|
||||
pagination: PaginationModel = ContentNodeSelectorPanelComponent.DEFAULT_PAGINATION;
|
||||
|
||||
@ViewChild(InfinitePaginationComponent)
|
||||
infinitePaginationComponent: InfinitePaginationComponent;
|
||||
|
||||
infiniteScroll: boolean = false;
|
||||
debounceSearch: number = 200;
|
||||
searchInput: FormControl = new FormControl();
|
||||
|
||||
constructor(private contentNodeSelectorService: ContentNodeSelectorService,
|
||||
private customResourcesService: CustomResourcesService,
|
||||
private preferences: UserPreferencesService) {
|
||||
private userPreferencesService: UserPreferencesService) {
|
||||
this.searchInput.valueChanges
|
||||
.pipe(
|
||||
debounceTime(this.debounceSearch)
|
||||
@@ -156,15 +165,11 @@ export class ContentNodeSelectorPanelComponent implements OnInit {
|
||||
.subscribe((searchValue) => {
|
||||
this.search(searchValue);
|
||||
});
|
||||
this.pageSize = this.preferences.paginationSize;
|
||||
|
||||
let defaultPagination = <PaginationModel> {
|
||||
maxItems: this.pageSize,
|
||||
skipCount: 0,
|
||||
totalItems: 0,
|
||||
hasMoreItems: false
|
||||
};
|
||||
this.pagination = new BehaviorSubject<PaginationModel>(defaultPagination);
|
||||
this.userPreferencesService.select(UserPreferenceValues.PaginationSize).subscribe((pagSize) => {
|
||||
this.pageSize = pagSize;
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
set chosenNode(value: Node) {
|
||||
@@ -260,7 +265,8 @@ export class ContentNodeSelectorPanelComponent implements OnInit {
|
||||
clearSearch() {
|
||||
this.searchTerm = '';
|
||||
this.nodePaging = null;
|
||||
this.skipCount = 0;
|
||||
this.pagination.maxItems = this.pageSize;
|
||||
this.infinitePaginationComponent.reset();
|
||||
this.chosenNode = null;
|
||||
this.showingSearchResults = false;
|
||||
}
|
||||
@@ -281,7 +287,8 @@ export class ContentNodeSelectorPanelComponent implements OnInit {
|
||||
*/
|
||||
private startNewSearch(): void {
|
||||
this.nodePaging = null;
|
||||
this.skipCount = 0;
|
||||
this.pagination.maxItems = this.pageSize;
|
||||
this.infinitePaginationComponent.reset();
|
||||
this.chosenNode = null;
|
||||
this.folderIdToShow = null;
|
||||
this.querySearch();
|
||||
@@ -296,14 +303,14 @@ export class ContentNodeSelectorPanelComponent implements OnInit {
|
||||
if (this.customResourcesService.hasCorrespondingNodeIds(this.siteId)) {
|
||||
this.customResourcesService.getCorrespondingNodeIds(this.siteId)
|
||||
.subscribe((nodeIds) => {
|
||||
this.contentNodeSelectorService.search(this.searchTerm, this.siteId, this.skipCount, this.pageSize, nodeIds)
|
||||
this.contentNodeSelectorService.search(this.searchTerm, this.siteId, this.pagination.skipCount, this.pagination.maxItems, nodeIds)
|
||||
.subscribe(this.showSearchResults.bind(this));
|
||||
},
|
||||
() => {
|
||||
this.showSearchResults({ list: { entries: [] } });
|
||||
});
|
||||
} else {
|
||||
this.contentNodeSelectorService.search(this.searchTerm, this.siteId, this.skipCount, this.pageSize)
|
||||
this.contentNodeSelectorService.search(this.searchTerm, this.siteId, this.pagination.skipCount, this.pagination.maxItems)
|
||||
.subscribe(this.showSearchResults.bind(this));
|
||||
}
|
||||
}
|
||||
@@ -350,9 +357,9 @@ export class ContentNodeSelectorPanelComponent implements OnInit {
|
||||
*
|
||||
* @param event Pagination object
|
||||
*/
|
||||
getNextPageOfSearch(event: Pagination): void {
|
||||
getNextPageOfSearch(pagination: Pagination): void {
|
||||
this.infiniteScroll = true;
|
||||
this.skipCount = event.skipCount;
|
||||
this.pagination = pagination;
|
||||
|
||||
if (this.searchTerm.length > 0) {
|
||||
this.querySearch();
|
||||
|
@@ -1295,4 +1295,24 @@ describe('DocumentList', () => {
|
||||
rootFolderId: 'fake-id'
|
||||
}, ['test-include']);
|
||||
});
|
||||
|
||||
it('should reset the pagination when enter in a new folder', () => {
|
||||
let folder = new FolderNode();
|
||||
documentList.navigationMode = DocumentListComponent.SINGLE_CLICK_NAVIGATION;
|
||||
documentList.updatePagination({
|
||||
maxItems: 10,
|
||||
skipCount: 10
|
||||
});
|
||||
|
||||
spyOn(documentListService, 'getFolder').and.callThrough();
|
||||
|
||||
documentList.onNodeClick(folder);
|
||||
|
||||
expect(documentListService.getFolder).toHaveBeenCalledWith(null, {
|
||||
maxItems: 25,
|
||||
skipCount: 0,
|
||||
rootFolderId: 'folder-id',
|
||||
where: undefined
|
||||
}, undefined);
|
||||
});
|
||||
});
|
||||
|
@@ -41,10 +41,11 @@ import {
|
||||
CustomNoPermissionTemplateDirective,
|
||||
CustomEmptyContentTemplateDirective,
|
||||
RequestPaginationModel,
|
||||
AlfrescoApiService
|
||||
AlfrescoApiService,
|
||||
UserPreferenceValues
|
||||
} from '@alfresco/adf-core';
|
||||
|
||||
import { Node, NodeEntry, NodePaging } from '@alfresco/js-api';
|
||||
import { Node, NodeEntry, NodePaging, Pagination } from '@alfresco/js-api';
|
||||
import { Subject, BehaviorSubject, Subscription, of } from 'rxjs';
|
||||
import { ShareDataRow } from './../data/share-data-row.model';
|
||||
import { ShareDataTableAdapter } from './../data/share-datatable-adapter';
|
||||
@@ -68,7 +69,13 @@ export class DocumentListComponent implements OnInit, OnChanges, OnDestroy, Afte
|
||||
|
||||
static SINGLE_CLICK_NAVIGATION: string = 'click';
|
||||
static DOUBLE_CLICK_NAVIGATION: string = 'dblclick';
|
||||
static DEFAULT_PAGE_SIZE: number = 20;
|
||||
|
||||
static DEFAULT_PAGINATION: Pagination = new Pagination({
|
||||
hasMoreItems: false,
|
||||
skipCount: 0,
|
||||
maxItems: 25,
|
||||
totalItems: 0
|
||||
});
|
||||
|
||||
@ContentChild(DataColumnListComponent)
|
||||
columnList: DataColumnListComponent;
|
||||
@@ -222,10 +229,10 @@ export class DocumentListComponent implements OnInit, OnChanges, OnDestroy, Afte
|
||||
this._currentFolderId = currentFolderId;
|
||||
if (this.data) {
|
||||
this.data.loadPage(null, false);
|
||||
this.resetNewFolderPagination();
|
||||
}
|
||||
|
||||
if (this._currentFolderId) {
|
||||
this.resetNewFolderPagination();
|
||||
this.loadFolder();
|
||||
}
|
||||
}
|
||||
@@ -241,7 +248,7 @@ export class DocumentListComponent implements OnInit, OnChanges, OnDestroy, Afte
|
||||
|
||||
/** Default value is stored into user preference settings use it only if you are not using the pagination */
|
||||
@Input()
|
||||
maxItems: number;
|
||||
maxItems: number = DocumentListComponent.DEFAULT_PAGINATION.maxItems;
|
||||
|
||||
/** Emitted when the user clicks a list node */
|
||||
@Output()
|
||||
@@ -283,8 +290,8 @@ export class DocumentListComponent implements OnInit, OnChanges, OnDestroy, Afte
|
||||
// @deprecated 3.0.0
|
||||
folderNode: Node;
|
||||
|
||||
private _pagination: PaginationModel;
|
||||
private $pagination: BehaviorSubject<PaginationModel>;
|
||||
private _pagination: PaginationModel = DocumentListComponent.DEFAULT_PAGINATION;
|
||||
pagination: BehaviorSubject<PaginationModel> = new BehaviorSubject<PaginationModel>(DocumentListComponent.DEFAULT_PAGINATION);
|
||||
|
||||
private layoutPresets = {};
|
||||
private subscriptions: Subscription[] = [];
|
||||
@@ -295,18 +302,15 @@ export class DocumentListComponent implements OnInit, OnChanges, OnDestroy, Afte
|
||||
private ngZone: NgZone,
|
||||
private elementRef: ElementRef,
|
||||
private appConfig: AppConfigService,
|
||||
private preferences: UserPreferencesService,
|
||||
private userPreferencesService: UserPreferencesService,
|
||||
private customResourcesService: CustomResourcesService,
|
||||
private contentService: ContentService,
|
||||
private thumbnailService: ThumbnailService,
|
||||
private alfrescoApiService: AlfrescoApiService) {
|
||||
|
||||
this._pagination = <PaginationModel> {
|
||||
maxItems: this.maxItems || this.preferences.paginationSize,
|
||||
skipCount: 0,
|
||||
totalItems: 0,
|
||||
hasMoreItems: false
|
||||
};
|
||||
this.userPreferencesService.select(UserPreferenceValues.PaginationSize).subscribe((pagSize) => {
|
||||
this.maxItems = this._pagination.maxItems = pagSize;
|
||||
});
|
||||
}
|
||||
|
||||
getContextActions(node: NodeEntry) {
|
||||
@@ -342,13 +346,6 @@ export class DocumentListComponent implements OnInit, OnChanges, OnDestroy, Afte
|
||||
return (this.layoutPresets[name] || this.layoutPresets['default']).map((col) => new ObjectDataColumn(col));
|
||||
}
|
||||
|
||||
get pagination(): BehaviorSubject<PaginationModel> {
|
||||
if (!this.$pagination) {
|
||||
this.$pagination = new BehaviorSubject<PaginationModel>(this._pagination);
|
||||
}
|
||||
return this.$pagination;
|
||||
}
|
||||
|
||||
isMobile(): boolean {
|
||||
return !!/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent);
|
||||
}
|
||||
@@ -834,7 +831,8 @@ export class DocumentListComponent implements OnInit, OnChanges, OnDestroy, Afte
|
||||
}
|
||||
|
||||
private resetNewFolderPagination() {
|
||||
this.pagination.value.skipCount = 0;
|
||||
this._pagination.skipCount = 0;
|
||||
this._pagination.maxItems = this.maxItems;
|
||||
}
|
||||
|
||||
ngOnDestroy() {
|
||||
|
@@ -104,6 +104,7 @@ export class InfinitePaginationComponent implements OnInit, OnDestroy, Paginatio
|
||||
|
||||
reset() {
|
||||
this.pagination.skipCount = 0;
|
||||
this.pagination.maxItems = this.pageSize;
|
||||
this.target.updatePagination(this.pagination);
|
||||
}
|
||||
|
||||
|
@@ -25,7 +25,7 @@ import { PaginatedComponent } from './paginated-component.interface';
|
||||
import { PaginationComponentInterface } from './pagination-component.interface';
|
||||
import { Subscription } from 'rxjs';
|
||||
import { PaginationModel } from '../models/pagination.model';
|
||||
import { UserPreferencesService } from '../services/user-preferences.service';
|
||||
import { UserPreferencesService, UserPreferenceValues } from '../services/user-preferences.service';
|
||||
|
||||
@Component({
|
||||
selector: 'adf-pagination',
|
||||
@@ -60,7 +60,7 @@ export class PaginationComponent implements OnInit, OnDestroy, PaginationCompone
|
||||
|
||||
/** Pagination object. */
|
||||
@Input()
|
||||
pagination: PaginationModel;
|
||||
pagination: PaginationModel = PaginationComponent.DEFAULT_PAGINATION;
|
||||
|
||||
/** Emitted when pagination changes in any way. */
|
||||
@Output()
|
||||
@@ -85,15 +85,12 @@ export class PaginationComponent implements OnInit, OnDestroy, PaginationCompone
|
||||
private paginationSubscription: Subscription;
|
||||
|
||||
constructor(private cdr: ChangeDetectorRef, private userPreferencesService: UserPreferencesService) {
|
||||
this.userPreferencesService.select(UserPreferenceValues.PaginationSize).subscribe((pagSize) => {
|
||||
this.pagination.maxItems = pagSize;
|
||||
});
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
if (!this.pagination) {
|
||||
let defaultPagination = PaginationComponent.DEFAULT_PAGINATION;
|
||||
defaultPagination.maxItems = this.userPreferencesService.paginationSize;
|
||||
this.pagination = defaultPagination;
|
||||
}
|
||||
|
||||
if (!this.supportedPageSizes) {
|
||||
this.supportedPageSizes = this.userPreferencesService.supportedPageSizes;
|
||||
}
|
||||
@@ -213,7 +210,7 @@ export class PaginationComponent implements OnInit, OnDestroy, PaginationCompone
|
||||
|
||||
onChangePageSize(maxItems: number) {
|
||||
this.pagination.skipCount = 0;
|
||||
this.pagination.maxItems = maxItems;
|
||||
this.userPreferencesService.paginationSize = maxItems;
|
||||
this.handlePaginationEvent(PaginationComponent.ACTIONS.CHANGE_PAGE_SIZE, {
|
||||
skipCount: 0,
|
||||
maxItems
|
||||
|
Reference in New Issue
Block a user