import { Injectable, inject } from '@angular/core';
import { MatDialog } from '@angular/material/dialog';
import { Observable, of as observableOf } from 'rxjs';
import { map } from 'rxjs/operators';

import { ConfirmDialogComponent } from '../shared/confirm-dialog/confirm-dialog.component';
import { BillsComponent } from './bills/bills.component';

@Injectable({
  providedIn: 'root',
})
export class CanDeactivateBillGuard {
  private dialog = inject(MatDialog);

  canDeactivate(component: BillsComponent): Observable<boolean> | boolean {
    if (component.bs.canDeactivate()) {
      return observableOf(true);
    }
    const dialogRef = this.dialog.open(ConfirmDialogComponent, {
      width: '250px',
      data: { title: 'Abandon Bill?', content: 'Current items will be lost.' },
    });

    return dialogRef.afterClosed().pipe(map((result: boolean) => result));
  }
}