Moved delete dialog so formula manger can use it

src/app/delete/delete.component.html

@@ -0,0 +1,13 @@
+<mat-dialog-content>
+    <h3 mat-dialog-title>Delete {{data.name}}</h3>
+    <p>You are about to delete {{data.name}}. This cannot be undone.
+        <br>
+        <br> please enter
+        <span style="background-color: #ffff00">{{data.name}}</span> bellow to confirm your action.</p>
+    <mat-form-field class="w-100">
+        <input matInput placeholder="Confirm" [(ngModel)]="confirm">
+    </mat-form-field>
+</mat-dialog-content>
+<mat-dialog-actions>
+    <button mat-raised-button color="primary" (click)="delete()" [disabled]="confirm.toLowerCase() != data.name.toLowerCase()">Delete</button>
+</mat-dialog-actions>

src/app/delete/delete.component.ts

@@ -0,0 +1,16 @@
+import {Component, Inject} from '@angular/core';
+import {MAT_DIALOG_DATA, MatDialogRef} from '@angular/material';
+
+@Component({
+  selector: 'delete',
+  templateUrl: 'delete.component.html'
+})
+export class DeleteComponent {
+  confirm = '';
+
+  constructor(private dialogRef: MatDialogRef<DeleteComponent>, @Inject(MAT_DIALOG_DATA) public data) {}
+
+  delete() {
+    this.data.ref.delete().then(() => this.dialogRef.close());
+  }
+}