diff --git a/src/assets/styles/_common-variables.scss b/src/assets/styles/_common-variables.scss index f887b94..8007393 100644 --- a/src/assets/styles/_common-variables.scss +++ b/src/assets/styles/_common-variables.scss @@ -62,6 +62,7 @@ body { --iqser-font-family: Inter, sans-serif; --iqser-app-name-font-family: Inter, sans-serif; --iqser-circle-button-radius: 50%; + --iqser-side-nav-item-radius: 20px; } $required-variables: 'iqser-primary'; diff --git a/src/assets/styles/common-side-nav.scss b/src/assets/styles/common-side-nav.scss index 2fde61d..9e40736 100644 --- a/src/assets/styles/common-side-nav.scss +++ b/src/assets/styles/common-side-nav.scss @@ -19,7 +19,7 @@ iqser-side-nav { .item { margin-bottom: 4px; - border-radius: 20px; + border-radius: var(--iqser-side-nav-item-radius); padding: 9px 16px; cursor: pointer; transition: background-color 0.2s; diff --git a/src/lib/listing/services/paginated-entities.service.ts b/src/lib/listing/services/paginated-entities.service.ts index 05a374d..2861950 100644 --- a/src/lib/listing/services/paginated-entities.service.ts +++ b/src/lib/listing/services/paginated-entities.service.ts @@ -5,6 +5,20 @@ import { Observable } from 'rxjs'; import { map, tap } from 'rxjs/operators'; import { mapEach } from '../../utils'; +interface PaginatedResponse { + data: Interface[]; + page: number; + pageSize: number; + totalHits: number; +} + +interface PaginatedConfig { + readonly options: Options; + readonly page: number; + readonly pageSize: number; + readonly totalHits: number; +} + @Injectable() /** * By default, if no implementation (class) is provided, Class = Interface & IListable @@ -15,11 +29,34 @@ export class PaginatedEntitiesService< Options, PrimaryKey extends Id = Class['id'], > extends EntitiesService { + protected _currentConfig: PaginatedConfig = { options: {} as Options, page: 0, pageSize: 0, totalHits: 0 }; + + get config(): PaginatedConfig { + return this._currentConfig; + } + loadPage(options: Options, page = 0, size = 100): Observable { - return super._post<{ data: Interface[] }>({ page, size, options }).pipe( + return super._post>({ page, size, options }).pipe( + tap( + response => + (this._currentConfig = { + options, + page: response.page, + pageSize: response.pageSize, + totalHits: response.totalHits, + }), + ), map(response => response.data), mapEach(entity => (this._entityClass ? new this._entityClass(entity) : (entity as unknown as Class))), tap((entities: Class[]) => this.setEntities(entities)), ); } + + loadNextPage(): Observable { + return this.loadPage(this._currentConfig.options, this._currentConfig.page + 1, this._currentConfig.pageSize); + } + + loadPreviousPage(): Observable { + return this.loadPage(this._currentConfig.options, this._currentConfig.page - 1, this._currentConfig.pageSize); + } }