Add cancel option to overwrite modal (Closes #6)

src/app/alert-handler/alert-handler.component.html

@@ -1,4 +1,4 @@
-<poe-alert-modal *ngIf="modal" [alert]="modal" (canceled)="modalCanceled()" (confirmed)="modalConfirmed()"></poe-alert-modal>
+<poe-alert-modal *ngIf="modal" [alert]="modal" (pressed)="pressed($event)"></poe-alert-modal>
 <div id="toast-container">
     <ng-template toastContainer></ng-template>
 </div>

src/app/alert-handler/alert-handler.component.ts

@@ -46,13 +46,9 @@ export class AlertHandlerComponent implements OnInit {
     });
   }
 
-  modalConfirmed(): void {
-    this.modal?.confirmCallback();
-    this.modal = this.modals.pop();
-  }
-
-  modalCanceled(): void {
-    this.modal?.cancelCallback();
+  pressed(index: number): void {
+    let cb = this.modal?.buttons[index]?.callback;
+    if(cb) cb();
     this.modal = this.modals.pop();
   }
 

src/app/alert-modal/alert-modal.component.html

@@ -3,8 +3,7 @@
         <div class="h1 title">{{ alert.title }}</div>
         <div class="text">{{ alert.text }}</div>
         <div class="buttons">
-            <button class="button" (click)="confirm()">{{ alert.button1 }}</button>
-            <button class="button" (click)="cancel()">{{ alert.button2 }}</button>
+            <button class="button" (click)="press(i)" *ngFor="let button of alert.buttons; index as i">{{ button.text }}</button>
         </div>
     </div>
 </div>

src/app/alert-modal/alert-modal.component.ts

@@ -10,20 +10,15 @@ export class AlertModalComponent implements OnInit {
 
   @Input() alert!: Alert;
 
-  @Output() confirmed = new EventEmitter<void>();
-  @Output() canceled = new EventEmitter<void>();
+  @Output() pressed = new EventEmitter<number>();
 
   constructor() { }
 
   ngOnInit(): void {
   }
 
-  cancel(): void {
-    this.canceled.emit();
-  }
-
-  confirm(): void {
-    this.confirmed.emit();
+  press(i: number): void {
+    this.pressed.emit(i);
   }
 
 }

src/app/alert.service.ts

@@ -19,16 +19,18 @@ export async function wait(ms: number): Promise<void> {
   })
 }
 
+type AlertButton = {
+    text: string;
+    callback?: VoidFunction;
+}
+
 type AlertArgType = {
   type: AlertType;
   status: AlertStatus;
   title: string;
   text: string;
   lifetime?: number;
-  button1?: string;
-  button2?: string;
-  confirmCallback?: () => void;
-  cancelCallback?: () => void;
+  buttons?: AlertButton[];
 }
 
 export class Alert {
@@ -37,21 +39,15 @@ export class Alert {
   title: string;
   text: string;
   lifetime: number;
-  button1: string;
-  button2: string;
-  confirmCallback: () => void;
-  cancelCallback: () => void;
+  buttons: AlertButton[];
 
-  constructor({ type = AlertType.Toast, status = AlertStatus.Success, title = "", text = "", lifetime = -1, button1 = "Confirm", button2 = "Cancel", confirmCallback = function(){}, cancelCallback = function(){} }: AlertArgType) {
+  constructor({ type = AlertType.Toast, status = AlertStatus.Success, title = "", text = "", lifetime = -1, buttons = [{text: "Confirm", callback: () => {}}, {text: "Cancel", callback: () => {}}] }: AlertArgType) {
     this.type = type;
     this.status = status;
     this.title = title;
     this.text = text;
     this.lifetime = lifetime;
-    this.button1 = button1;
-    this.button2 = button2;
-    this.confirmCallback = confirmCallback;
-    this.cancelCallback = cancelCallback;
+    this.buttons = buttons;
   }
 }
 

src/app/page-stash/page-stash.component.ts

@@ -50,7 +50,10 @@ export class PageStashComponent implements OnInit {
       title: "Confirm Delete",
       text: "Are you sure you want to delete this item from your stash?",
       lifetime: 1000,
-      confirmCallback: () => this.stash.RemoveFromStash(index)
+      buttons: [
+        {text: "Cancel"},
+        {text: "Confirm", callback: () => this.stash.RemoveFromStash(index)}
+      ]
     }));
   }
 

src/app/stash.service.ts

@@ -85,10 +85,19 @@ export class StashService {
             title: "Confirm Overwrite",
             text: `Would you like to overwrite the existing item ${existing.name} ${existing.base} in your stash, or save into a new slot?`,
             lifetime: 1000,
-            button1: "Overwrite",
-            button2: "Save as a Copy",
-            confirmCallback: async () => await this.replaceInStash(stash, i, existingIndex, autosave),
-            cancelCallback: async () => await this.finalizeStashAdd(stash, StashedItem.From(item, true), autosave)
+            buttons: [
+                {
+                    text: "Cancel"
+                },
+                {
+                    text: "Overwrite",
+                    callback: () => this.replaceInStash(stash, i, existingIndex, autosave)
+                },
+                {
+                    text: "Save as a Copy",
+                    callback: () => this.finalizeStashAdd(stash, StashedItem.From(item, true), autosave)
+                }
+            ]
         }));
     }
     else {