device-status.component.ts
🧩 Syntax:
import { ChangeDetectionStrategy, ChangeDetectorRef, Component, OnInit } from '@angular/core';
import { Select, Store } from '@ngxs/store';
import { Observable } from 'rxjs';
import { ActivatedRoute, Router } from '@angular/router';
import { UntilDestroy, untilDestroyed } from '@ngneat/until-destroy';
import { Dispatch } from '@ngxs-labs/dispatch-decorator';
import { first } from 'rxjs/operators';
import { ErrorReport, PreCheckStatus } from '../../types';
import {
DeviceEnrolmentState,
DevicePOSRequested,
DevicePOSReRegisterRequested,
DevicePOSReActivated,
} from '../../store';
import { PreCheckDeviceStatus, PreCheckResponseError, ProvisioningType } from '../../constants';
import { URL_PATH_REGISTER } from '../../routing/constants';
import { DeviceSearchService } from '@app/device/search/device-search.service';
@UntilDestroy()
@Component({
selector: 'mno-device-status',
templateUrl: './device-status.component.html',
styleUrls: ['./device-status.component.scss'],
changeDetection: ChangeDetectionStrategy.OnPush,
})
export class DeviceStatusComponent implements OnInit {
requiredErrorPolicy = false;
preCheckStatus = null;
preCheckError = null;
deviceStatus: PreCheckDeviceStatus;
preCheckDeviceStatus = PreCheckDeviceStatus;
hideGoToDeviceBtn: boolean = false;
alpsProvisioningType: boolean;
newDeviceStatus: PreCheckDeviceStatus = PreCheckDeviceStatus.new;
@Select(DeviceEnrolmentState.imei)
imei$: Observable<string>;
@Select(DeviceEnrolmentState.preCheckStatus)
preCheckStatus$!: Observable<PreCheckStatus | null>;
@Select(DeviceEnrolmentState.preCheckError)
preCheckError$!: Observable<ErrorReport<PreCheckResponseError> | null>;
@Select(DeviceEnrolmentState.posSubmitted)
posSubmitted$!: Observable<boolean>;
private imei: string;
constructor(
private deviceSearchService: DeviceSearchService,
private route: ActivatedRoute,
private router: Router,
private changeDetection: ChangeDetectorRef,
private store: Store
) {}
@Dispatch()
devicePOSRequested() {
return new DevicePOSRequested();
}
@Dispatch()
devicePOSReRegisterRequested() {
return new DevicePOSReRegisterRequested();
}
@Dispatch()
devicePOSReActivated() {
return new DevicePOSReActivated();
}
ngOnInit() {
this.imei$.pipe(untilDestroyed(this)).subscribe(imei => {
this.imei = imei;
});
this.preCheckStatus$.pipe(untilDestroyed(this)).subscribe(preCheckStatus => {
this.preCheckStatus = preCheckStatus;
this.deviceStatus = preCheckStatus?.deviceStatus as PreCheckDeviceStatus;
this.alpsProvisioningType = preCheckStatus?.tac?.provisioningType === ProvisioningType.ALPS;
if (this.deviceStatus === PreCheckDeviceStatus.new) {
this.deviceStatus = this.newDeviceStatus;
}
this.changeDetection.detectChanges();
});
this.preCheckError$.pipe(untilDestroyed(this)).subscribe(preCheckError => {
this.preCheckError = preCheckError;
this.hideGoToDeviceBtn = Object.values(PreCheckResponseError).includes(preCheckError?.code);
this.changeDetection.detectChanges();
});
}
register(): void {
this.deviceSearchService.serverLastCheckin$.next(null);
this.posSubmittedRedirect();
if (!this.requiredErrorPolicy) {
this.devicePOSRequested();
}
}
reRegister(): void {
this.deviceSearchService.serverLastCheckin$.next(null);
this.posSubmittedRedirect();
if (!this.requiredErrorPolicy) {
this.devicePOSReRegisterRequested();
}
}
reActive(): void {
this.deviceSearchService.searchForDevice(this?.imei);
this.deviceSearchService.currentDeviceStatus$.subscribe(v => {
this.deviceSearchService.serverLastCheckin$.next(v?.serverLastCheckin);
});
this.posSubmittedRedirect();
if (!this.requiredErrorPolicy) {
this.devicePOSReActivated();
}
}
navigateToDevice(): void {
this.deviceSearchService.navigateToDevice(this.imei);
}
getNewDeviceStatus(newDeviceStatus: string): void {
this.newDeviceStatus = newDeviceStatus as PreCheckDeviceStatus;
if (this.deviceStatus === PreCheckDeviceStatus.new) {
this.deviceStatus = this.newDeviceStatus;
}
}
private posSubmittedRedirect(): void {
if (!this.store.selectSnapshot(DeviceEnrolmentState.posPolicy)) {
this.requiredErrorPolicy = true;
return;
}
this.requiredErrorPolicy = false;
this.posSubmitted$.pipe(first(posSubmitted => posSubmitted)).subscribe(() => {
this.router.navigate(['../', URL_PATH_REGISTER], { relativeTo: this.route });
});
}
}svinay1986
Member