ngOnInit() {
    this.createRegForm();

    let draft = window.localStorage.getItem('step');
    console.log(draft);
    if (draft) {
      this.formData.setValue(JSON.parse(draft));
    }

    this.formData.valueChanges
      .pipe(filter(() => this.formData.valid))
      .subscribe((val) =>
        window.localStorage.setItem('step', JSON.stringify(val))
      );

ngOnInit() {
    this.createRegForm();

    let draft = window.localStorage.getItem('step');
    console.log(draft);
    if (draft) {
      this.formData.setValue(JSON.parse(draft));
    }

    this.formData.valueChanges
      .pipe(filter(() => this.formData.valid))
      .subscribe((val) =>
        window.localStorage.setItem('step', JSON.stringify(val))
      );

import { Component } from '@angular/core';
import { ConnectionService, ConnectionState } from 'ng-connection-service';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css'],
})
export class AppComponent {
  title = 'finalProject';
  status = 'ONLINE'; //initializing as online by default
  isConnected: boolean = true;

  constructor(private connectionService: ConnectionService) {
    this.connectionService.monitor().subscribe((isConnected) => {
      this.isConnected = isConnected;
      if (this.isConnected) {
        this.status = 'ONLINE';
      } else {
        this.status = 'OFFLINE';
      }
      alert(this.status);
    });
  }
}

import { Component } from '@angular/core';
import { ConnectionService, ConnectionState } from 'ng-connection-service';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css'],
})
export class AppComponent {
  title = 'finalProject';
  status = 'ONLINE'; //initializing as online by default
  isConnected: boolean = true;

  constructor(private connectionService: ConnectionService) {
    this.connectionService.monitor().subscribe((isConnected) => {
      this.isConnected = isConnected;
      if (this.isConnected) {
        this.status = 'ONLINE';
      } else {
        this.status = 'OFFLINE';
      }
      alert(this.status);
    });
  }
}