import { Injectable } from "@angular/core";
import { CanDeactivate } from "@angular/router";
import { MatDialog } from "@angular/material/dialog";
import { Observable, of } from "rxjs";

import { CategoriesComponent } from "../container/categories.component";
import { EditingDialogComponent } from "../components/editing-dialog/editing-dialog.component";

@Injectable()
export class EditingGuard implements CanDeactivate<CategoriesComponent> {
  constructor(private dialog: MatDialog) {}

  canDeactivate(categoriesComponent: CategoriesComponent): Observable<boolean> {
    if (categoriesComponent.isAnyFormDirty()) {
      const editingDialog = this.dialog.open(EditingDialogComponent);
      return editingDialog.afterClosed();
    }
    return of(true);
  }
}