diff --git a/src/app/list-composition/list-composition.component.ts b/src/app/list-composition/list-composition.component.ts index 10a73e70..b803e68b 100644 --- a/src/app/list-composition/list-composition.component.ts +++ b/src/app/list-composition/list-composition.component.ts @@ -1,4 +1,4 @@ -import {Component, OnInit} from '@angular/core'; +import {Component, Inject, OnInit} from '@angular/core'; import {catchError, skipWhile, tap} from 'rxjs/operators'; import {animate, state, style, transition, trigger} from '@angular/animations'; import {BehaviorSubject, switchMap} from 'rxjs'; @@ -41,12 +41,19 @@ import {FilterSelectComponent} from '../filter-select/filter-select.component'; import {FilterInputComponent} from '../filter-input/filter-input.component'; import {PaginatorService} from '@services/paginator.service'; import {PaginatorComponent} from '../paginator/paginator.component'; +import {PAGINATOR} from '@utils/paginator.token'; @Component({ selector: 'app-list-composition', templateUrl: './list-composition.component.html', styleUrls: ['./list-composition.component.scss'], - providers: [DataService, PaginatorService], + providers: [ + DataService, + { + provide: PAGINATOR, + useFactory: () => new PaginatorService('list'), + }, + ], animations: [ trigger('detailExpand', [ state( @@ -148,7 +155,7 @@ export class ListCompositionComponent private dexieService: DexieService, protected serviceUtils: UtilsService, private navigationService: NavigationService, - protected override paginatorService: PaginatorService + @Inject(PAGINATOR) paginatorService: PaginatorService ) { super(serviceUtils, paginatorService); } diff --git a/src/app/list-fichier/list-fichier.component.ts b/src/app/list-fichier/list-fichier.component.ts index ebbb5ee1..9c8a724c 100644 --- a/src/app/list-fichier/list-fichier.component.ts +++ b/src/app/list-fichier/list-fichier.component.ts @@ -1,4 +1,4 @@ -import {Component, OnInit} from '@angular/core'; +import {Component, Inject, OnInit} from '@angular/core'; import {animate, state, style, transition, trigger} from '@angular/animations'; import {switchMap} from 'rxjs'; import {catchError, skipWhile, tap} from 'rxjs/operators'; @@ -50,12 +50,19 @@ import {FilterInputComponent} from '../filter-input/filter-input.component'; import {FilterSelectComponent} from '../filter-select/filter-select.component'; import {PaginatorComponent} from '../paginator/paginator.component'; import {PaginatorService} from '@services/paginator.service'; +import {PAGINATOR} from '@utils/paginator.token'; @Component({ selector: 'app-list-fichier', templateUrl: './list-fichier.component.html', styleUrls: ['./list-fichier.component.scss'], - providers: [DataService, PaginatorService], + providers: [ + DataService, + { + provide: PAGINATOR, + useFactory: () => new PaginatorService('fichier'), + }, + ], animations: [ trigger('compositionExpand', [ state( @@ -154,7 +161,7 @@ export class ListFichierComponent protected serviceUtils: UtilsService, private navigationService: NavigationService, private fb: NonNullableFormBuilder, - protected override paginatorService: PaginatorService + @Inject(PAGINATOR) paginatorService: PaginatorService ) { super(serviceUtils, paginatorService); } diff --git a/src/app/paginator/paginator.component.ts b/src/app/paginator/paginator.component.ts index a43c03bd..d867ec55 100644 --- a/src/app/paginator/paginator.component.ts +++ b/src/app/paginator/paginator.component.ts @@ -1,7 +1,7 @@ import {AsyncPipe, NgIf} from '@angular/common'; import {Component, EventEmitter, Output, inject} from '@angular/core'; import {MatPaginatorModule} from '@angular/material/paginator'; -import {PaginatorService} from '@services/paginator.service'; +import {PAGINATOR} from '@utils/paginator.token'; @Component({ selector: 'app-paginator', @@ -14,7 +14,7 @@ export class PaginatorComponent { @Output() changed = new EventEmitter(); - paginatorService = inject(PaginatorService); + paginatorService = inject(PAGINATOR, {skipSelf: true}); protected pageSizeOptions = [25, 50, 100, 200]; } diff --git a/src/app/services/paginator.service.ts b/src/app/services/paginator.service.ts index 5e08e308..def69c1b 100644 --- a/src/app/services/paginator.service.ts +++ b/src/app/services/paginator.service.ts @@ -1,16 +1,13 @@ -import {Injectable} from '@angular/core'; import {PageEvent} from '@angular/material/paginator'; import {Reactive} from '../utils/reactive'; import {take, Observable, map} from 'rxjs'; -import {Field} from '@utils/model'; -@Injectable({ - providedIn: 'root', -}) export class PaginatorService { + id!: string; page$ = new Reactive(); - constructor() { + constructor(id: string) { + this.id = id; this.page$.set(PaginatorService.initPagination()); } @@ -25,17 +22,18 @@ export class PaginatorService { public updatePage(update: Partial): void { this.page .pipe( - map(p => { - if (update.pageSize !== p.pageSize) { - update.pageIndex = 0; - } - (Object.keys(update) as Field[]).forEach(k => { - if (update[k] !== undefined) { - p[k] = update[k]!; - } - }); - return p; - }) + map( + p => + ({ + length: update.length ?? 0, + pageIndex: + update.pageSize && update.pageSize !== p.pageSize + ? 0 + : update.pageIndex ?? p.pageIndex, + pageSize: update.pageSize ?? p.pageSize, + previousPageIndex: p.previousPageIndex, + }) satisfies PageEvent + ) ) .subscribe(p => this.page$.set(p)); } diff --git a/src/app/utils/paginator.token.ts b/src/app/utils/paginator.token.ts new file mode 100644 index 00000000..7ad40d08 --- /dev/null +++ b/src/app/utils/paginator.token.ts @@ -0,0 +1,4 @@ +import {InjectionToken} from '@angular/core'; +import {PaginatorService} from '@services/paginator.service'; + +export const PAGINATOR = new InjectionToken('paginator');