Added warning when the back arrow is hit but the file is not saved. I would like to use a better looking confirm box if available.

src/app/modeler/modeler.component.html

@@ -1,6 +1,6 @@
 <mat-toolbar [ngClass]="{'expanded': expandToolbar}">
   <mat-toolbar-row *ngIf="workflowSpec">
-    <a mat-button [routerLink]="['/home', workflowSpec.name]">
+    <a mat-button (click)="checkSaved()">
       <mat-icon>arrow_back</mat-icon>
       Back
     </a>

src/app/modeler/modeler.component.ts

@@ -125,10 +125,19 @@ export class ModelerComponent implements AfterViewInit {
   getFileName() {
     return this.diagramFile ? this.diagramFile.name : this.fileName || 'No file selected';
   }
-
+  checkSaved(){
+    if (this.hasChanged()) {
+      const approve = window.confirm('Unsaved Changes - Are you sure?');
+      if (approve) {
+        this.router.navigate(['/home', this.workflowSpec.name]);
+      }
+    } else {
+      this.router.navigate(['/home', this.workflowSpec.name]);
+    }
+  }
   onFileSelected($event: Event) {
     this.diagramFile = ($event.target as HTMLFormElement).files[0];
-    this.onSubmitFileToOpen()
+    this.onSubmitFileToOpen();
     this.isNew = true;
   }