Update flare-ui/src/app/dialogs/confirm-dialog/confirm-dialog.component.ts

flare-ui/src/app/dialogs/confirm-dialog/confirm-dialog.component.ts

@@ -1,7 +1,10 @@
 import { Component, Inject } from '@angular/core';
 import { CommonModule } from '@angular/common';
+import { FormsModule } from '@angular/forms';
 import { MatDialogRef, MAT_DIALOG_DATA, MatDialogModule } from '@angular/material/dialog';
 import { MatButtonModule } from '@angular/material/button';
+import { MatSelectModule } from '@angular/material/select';
+import { MatFormFieldModule } from '@angular/material/form-field';
 
 export interface ConfirmDialogData {
   title: string;
@@ -9,20 +12,48 @@ export interface ConfirmDialogData {
   confirmText?: string;
   cancelText?: string;
   confirmColor?: 'primary' | 'accent' | 'warn';
+  showVersionSelect?: boolean;
+  versions?: any[];
 }
 
 @Component({
   selector: 'app-confirm-dialog',
   standalone: true,
-  imports: [CommonModule, MatDialogModule, MatButtonModule],
+  imports: [
+    CommonModule, 
+    FormsModule,
+    MatDialogModule, 
+    MatButtonModule,
+    MatSelectModule,
+    MatFormFieldModule
+  ],
   template: `
     <h2 mat-dialog-title>{{ data.title }}</h2>
     <mat-dialog-content>
       <p>{{ data.message }}</p>
+      
+      @if (data.showVersionSelect && data.versions) {
+        <mat-form-field appearance="outline" class="full-width">
+          <mat-label>Select Source Version</mat-label>
+          <mat-select [(ngModel)]="selectedVersionId" required>
+            @for (version of data.versions; track version.id) {
+              <mat-option [value]="version.id">
+                Version {{ version.id }} - {{ version.caption }}
+                @if (version.published) {
+                  <span class="published-badge">(Published)</span>
+                }
+              </mat-option>
+            }
+          </mat-select>
+        </mat-form-field>
+      }
     </mat-dialog-content>
     <mat-dialog-actions align="end">
       <button mat-button (click)="onCancel()">{{ data.cancelText || 'Cancel' }}</button>
-      <button mat-raised-button [color]="data.confirmColor || 'primary'" (click)="onConfirm()">
+      <button mat-raised-button 
+              [color]="data.confirmColor || 'primary'" 
+              (click)="onConfirm()"
+              [disabled]="data.showVersionSelect && !selectedVersionId">
         {{ data.confirmText || 'Confirm' }}
       </button>
     </mat-dialog-actions>
@@ -30,27 +61,49 @@ export interface ConfirmDialogData {
   styles: [`
     mat-dialog-content {
       padding: 20px 24px;
+      min-width: 400px;
     }
     
     p {
-      margin: 0;
+      margin: 0 0 16px 0;
       color: rgba(0,0,0,0.87);
       line-height: 1.5;
     }
     
+    .full-width {
+      width: 100%;
+    }
+    
+    .published-badge {
+      color: #4caf50;
+      font-weight: 500;
+      margin-left: 8px;
+    }
+    
     mat-dialog-actions {
       padding: 16px 24px;
     }
   `]
 })
 export default class ConfirmDialogComponent {
+  selectedVersionId: number | null = null;
+
   constructor(
     public dialogRef: MatDialogRef<ConfirmDialogComponent>,
     @Inject(MAT_DIALOG_DATA) public data: ConfirmDialogData
-  ) {}
+  ) {
+    // Pre-select first version if available
+    if (data.showVersionSelect && data.versions && data.versions.length > 0) {
+      this.selectedVersionId = data.versions[0].id;
+    }
+  }
 
   onConfirm(): void {
-    this.dialogRef.close(true);
+    if (this.data.showVersionSelect) {
+      this.dialogRef.close(this.selectedVersionId);
+    } else {
+      this.dialogRef.close(true);
+    }
   }
 
   onCancel(): void {