import { Component } from '@angular/core';
import { ConnectionService } from 'ng-connection-service';
import { BsModalService, BsModalRef } from 'ngx-bootstrap/modal';
import { InternetConnectionComponent } from './shared/internet-connection/internet-connection.component';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.scss']
})
export class AppComponent {
  title = 'autoservicio-axion';
  status = 'ONLINE';
  isConnected = true;
  modalRef: BsModalRef;

  constructor(
    private connectionService: ConnectionService,
    private modalService: BsModalService,
  ) {
    this.connectionService.monitor().subscribe(isConnected => {
      this.isConnected = isConnected;
      if (this.isConnected && this.modalRef) {
        this.modalRef.hide();
      } else {
        this.modalRef = this.modalService.show(InternetConnectionComponent, {
          backdrop: false,
          ignoreBackdropClick: true,
          class: 'modal-dialog-centered'
        });
      }
    });
  }
}