diff --git a/src/app/shared/pipes/provider-admins-filter.pipe.spec.ts b/src/app/shared/pipes/provider-admins-filter.pipe.spec.ts new file mode 100644 index 0000000000..9d7e3c22f9 --- /dev/null +++ b/src/app/shared/pipes/provider-admins-filter.pipe.spec.ts @@ -0,0 +1,8 @@ +import { ProviderAdminsFilterPipe } from './provider-admins-filter.pipe'; + +describe('ProviderAdminsFilterPipe', () => { + it('create an instance', () => { + const pipe = new ProviderAdminsFilterPipe(); + expect(pipe).toBeTruthy(); + }); +}); diff --git a/src/app/shared/pipes/provider-admins-filter.pipe.ts b/src/app/shared/pipes/provider-admins-filter.pipe.ts new file mode 100644 index 0000000000..31678d2f92 --- /dev/null +++ b/src/app/shared/pipes/provider-admins-filter.pipe.ts @@ -0,0 +1,15 @@ +import { Pipe, PipeTransform } from '@angular/core'; +import { providerAdminRole } from '../enum/provider-admin'; +import { ProviderAdminTable } from '../models/providerAdmin.model'; + +@Pipe({ + name: 'providerAdminsFilter' +}) +export class ProviderAdminsFilterPipe implements PipeTransform { + + transform(users: ProviderAdminTable[], userType: string): ProviderAdminTable[] { + const isDeputy = userType === providerAdminRole.deputy; + return users.filter((user) => (user.isDeputy === isDeputy)); + } + +} diff --git a/src/app/shared/shared.module.ts b/src/app/shared/shared.module.ts index 0b6fa2f517..c319697920 100644 --- a/src/app/shared/shared.module.ts +++ b/src/app/shared/shared.module.ts @@ -58,6 +58,7 @@ import { UsersListComponent } from './components/users-list/users-list.component import { KeyFilterDirective } from './directives/key-filter.directive'; import { CustomCarouselDirective } from './directives/custom-carousel.directive'; import { PhoneTransformPipe } from './pipes/phone-transform.pipe'; +import { ProviderAdminsFilterPipe } from './pipes/provider-admins-filter.pipe'; @NgModule({ declarations: [ @@ -112,6 +113,7 @@ import { PhoneTransformPipe } from './pipes/phone-transform.pipe'; KeyFilterDirective, CustomCarouselDirective, PhoneTransformPipe, + ProviderAdminsFilterPipe, ], imports: [ MaterialModule, @@ -175,6 +177,7 @@ import { PhoneTransformPipe } from './pipes/phone-transform.pipe'; KeyFilterDirective, CustomCarouselDirective, PhoneTransformPipe, + ProviderAdminsFilterPipe, ] }) export class SharedModule { } diff --git a/src/app/shell/personal-cabinet/provider-admins/provider-admins.component.html b/src/app/shell/personal-cabinet/provider-admins/provider-admins.component.html index a60e8379e3..d2ca2d8195 100644 --- a/src/app/shell/personal-cabinet/provider-admins/provider-admins.component.html +++ b/src/app/shell/personal-cabinet/provider-admins/provider-admins.component.html @@ -29,15 +29,15 @@
- + - + - + @@ -45,17 +45,12 @@
- + - - + + - - - - - - diff --git a/src/app/shell/personal-cabinet/provider-admins/provider-admins.component.spec.ts b/src/app/shell/personal-cabinet/provider-admins/provider-admins.component.spec.ts index 37f1e9da95..70bdbf1333 100644 --- a/src/app/shell/personal-cabinet/provider-admins/provider-admins.component.spec.ts +++ b/src/app/shell/personal-cabinet/provider-admins/provider-admins.component.spec.ts @@ -2,7 +2,7 @@ import { ComponentFixture, TestBed } from '@angular/core/testing'; import { ProviderAdminsComponent } from './provider-admins.component'; import { MatTabsModule } from '@angular/material/tabs'; import { NgxsModule} from '@ngxs/store'; -import { Component, Input } from '@angular/core'; +import { Component, Input, Pipe } from '@angular/core'; import { MatMenuModule } from '@angular/material/menu'; import { MatIconModule } from '@angular/material/icon'; import { MatFormFieldModule } from '@angular/material/form-field'; @@ -12,6 +12,8 @@ import { ReactiveFormsModule } from '@angular/forms'; import { RouterTestingModule } from '@angular/router/testing'; import { NoResultCardComponent } from 'src/app/shared/components/no-result-card/no-result-card.component'; import { MatDialogModule } from '@angular/material/dialog'; +import { ProviderAdminsFilterPipe } from 'src/app/shared/pipes/provider-admins-filter.pipe'; +import { ProviderAdminTable } from 'src/app/shared/models/providerAdmin.model'; describe('ProviderAdminsComponent', () => { let component: ProviderAdminsComponent; @@ -34,7 +36,8 @@ describe('ProviderAdminsComponent', () => { declarations: [ ProviderAdminsComponent, MockUsersListComponent, - NoResultCardComponent + NoResultCardComponent, + ProviderAdminsFilterPipe, ], }) .compileComponents(); @@ -55,6 +58,8 @@ describe('ProviderAdminsComponent', () => { template: '' }) class MockUsersListComponent { - @Input() users: Array; + @Input() providerAdmins: ProviderAdminTable[]; + @Input() users: ProviderAdminTable[]; @Input() filterValue: string; + @Input() userType: string; } diff --git a/src/app/shell/personal-cabinet/provider-admins/provider-admins.component.ts b/src/app/shell/personal-cabinet/provider-admins/provider-admins.component.ts index fb2aa7a996..b77a3dbdb8 100644 --- a/src/app/shell/personal-cabinet/provider-admins/provider-admins.component.ts +++ b/src/app/shell/personal-cabinet/provider-admins/provider-admins.component.ts @@ -17,14 +17,12 @@ import { RegistrationState } from 'src/app/shared/store/registration.state'; import { BlockProviderAdminById, DeleteProviderAdminById, GetAllProviderAdmins } from 'src/app/shared/store/user.actions'; import { UserState } from 'src/app/shared/store/user.state'; - @Component({ selector: 'app-provider-admins', templateUrl: './provider-admins.component.html', - styleUrls: ['./provider-admins.component.scss'] + styleUrls: ['./provider-admins.component.scss'], }) export class ProviderAdminsComponent implements OnInit, OnDestroy { - readonly providerAdminRoleUkr = providerAdminRoleUkr; readonly providerAdminRole = providerAdminRole; readonly noProviderAdmins = NoResultsTitle.noProviderAdmins; @@ -33,11 +31,10 @@ export class ProviderAdminsComponent implements OnInit, OnDestroy { isLoadingCabinet$: Observable; @Select(UserState.providerAdmins) providerAdmins$: Observable; - providerAdmins: ProviderAdminTable[]; + providerAdmins: ProviderAdminTable[] = []; @Select(RegistrationState.provider) provider$: Observable; provider: Provider; - filteredProviderAdmins: Array = []; filter = new FormControl(''); filterValue: string; btnView: string; @@ -48,7 +45,8 @@ export class ProviderAdminsComponent implements OnInit, OnDestroy { public store: Store, private router: Router, private route: ActivatedRoute, - private matDialog: MatDialog) {} + private matDialog: MatDialog + ) {} ngOnInit(): void { this.btnView = providerAdminRoleUkr.all; @@ -67,33 +65,27 @@ export class ProviderAdminsComponent implements OnInit, OnDestroy { .pipe(takeUntil(this.destroy$)) .subscribe((providerAdmins: ProviderAdmin[]) => { this.providerAdmins = this.updateStructureForTheTable(providerAdmins); - this.filterProviderAdmins(); }); - this.route.params.pipe( - takeUntil(this.destroy$)) + this.route.params + .pipe(takeUntil(this.destroy$)) .subscribe((params: Params) => { - this.tabIndex = Object.keys(this.providerAdminRole).indexOf(params.param); + this.tabIndex = Object.keys(this.providerAdminRole).indexOf( + params.param + ); this.btnView = providerAdminRoleUkr[params.param]; }); - this.provider$.pipe( + this.provider$ + .pipe( filter((provider: Provider) => !!provider), takeUntil(this.destroy$) - ).subscribe((provider: Provider) => this.provider = provider); + ) + .subscribe((provider: Provider) => (this.provider = provider)); } getAllProviderAdmins(): void { this.store.dispatch(new GetAllProviderAdmins()); } - filterProviderAdmins(): void { - this.route.params.pipe( - takeUntil(this.destroy$)) - .subscribe((params: Params) => { - this.filteredProviderAdmins = this.providerAdmins.filter( - (user) => user.isDeputy === (params.param === 'deputy') - ); - }) - } updateStructureForTheTable(admins: ProviderAdmin[]): ProviderAdminTable[] { let updatedAdmins = []; @@ -104,9 +96,8 @@ export class ProviderAdminsComponent implements OnInit, OnDestroy { email: admin.email, phoneNumber: admin.phoneNumber, isDeputy: admin.isDeputy, - status: admin.accountStatus + status: admin.accountStatus, }); - }); return updatedAdmins; } @@ -117,44 +108,62 @@ export class ProviderAdminsComponent implements OnInit, OnDestroy { */ onTabChange(event: MatTabChangeEvent): void { this.btnView = event.tab.textLabel; - this.filterProviderAdmins(); this.filter.reset(); - this.router.navigate(['../', providerAdminRoleUkrReverse[event.tab.textLabel]], {relativeTo: this.route}); + this.router.navigate( + ['../', providerAdminRoleUkrReverse[event.tab.textLabel]], + { relativeTo: this.route } + ); } /** * This method delete provider Admin By Id */ - onDelete(user): void { + onDelete(user): void { const dialogRef = this.matDialog.open(ConfirmationModalWindowComponent, { width: '330px', data: { - type: (user.deputy) ? ModalConfirmationType.deleteProviderAdminDeputy : ModalConfirmationType.deleteProviderAdmin, - property: user.pib - } + type: user.deputy + ? ModalConfirmationType.deleteProviderAdminDeputy + : ModalConfirmationType.deleteProviderAdmin, + property: user.pib, + }, }); dialogRef.afterClosed().subscribe((result: boolean) => { - result && this.store.dispatch(new DeleteProviderAdminById({userId: user.id, providerId: this.provider.id})); + result && + this.store.dispatch( + new DeleteProviderAdminById({ + userId: user.id, + providerId: this.provider.id, + }) + ); }); } /** * This method block provider Admin By Id */ - onBlock(user): void { - const dialogRef = this.matDialog.open(ConfirmationModalWindowComponent, { - width: '330px', - data: { - type: (user.deputy) ? ModalConfirmationType.blockProviderAdminDeputy : ModalConfirmationType.blockProviderAdmin, - property: user.pib - } - }); + onBlock(user): void { + const dialogRef = this.matDialog.open(ConfirmationModalWindowComponent, { + width: '330px', + data: { + type: user.deputy + ? ModalConfirmationType.blockProviderAdminDeputy + : ModalConfirmationType.blockProviderAdmin, + property: user.pib, + }, + }); - dialogRef.afterClosed().subscribe((result: boolean) => { - result && this.store.dispatch(new BlockProviderAdminById({userId: user.id, providerId: this.provider.id})); - }); - } + dialogRef.afterClosed().subscribe((result: boolean) => { + result && + this.store.dispatch( + new BlockProviderAdminById({ + userId: user.id, + providerId: this.provider.id, + }) + ); + }); + } ngOnDestroy(): void { this.destroy$.unsubscribe();