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

svinay1986

Member