import { CommonModule } from '@angular/common';
import { Component, Inject } from '@angular/core';
import { MatDialogRef, MAT_DIALOG_DATA, MatDialogModule } from '@angular/material/dialog';
import { MatButtonModule } from '@angular/material/button';

@Component({
  selector: 'app-confirm-dialog',
  standalone: true,
  imports: [CommonModule, MatDialogModule, MatButtonModule],
  template: `
    <div class="confirm-dialog">
      <div class="dialog-header">
        <h2>{{ data.title || 'Confirmação' }}</h2>
      </div>

      <div class="dialog-content">
        <p>{{ data.message }}</p>
      </div>

      <div class="dialog-actions">
        <button class="btn-secondary" (click)="onNoClick()">
          {{ data.cancelLabel || 'Não' }}
        </button>
        <button class="btn-primary" [mat-dialog-close]="true">
          {{ data.confirmLabel || 'Sim' }}
        </button>
      </div>
    </div>
  `,
  styles: [`
    .confirm-dialog {
      padding: 1.5rem;
      background: var(--surface);
      color: var(--text-primary);
    //   border-radius: 0px;
    }

    .dialog-header {
      margin-bottom: 1rem;

      h2 {
        margin: 0;
        font-size: 1.25rem;
        font-weight: 500;
        color: var(--text-primary);
      }
    }

    .dialog-content {
      margin-bottom: 1.5rem;
      
      p {
        margin: 0;
        color: var(--text-secondary);
        font-size: 1rem;
        line-height: 1.5;
      }
    }

    .dialog-actions {
      display: flex;
      justify-content: flex-end;
      gap: 0.75rem;

    }
  `]
})
export class ConfirmDialogComponent {
  constructor(
    public dialogRef: MatDialogRef<ConfirmDialogComponent>,
    @Inject(MAT_DIALOG_DATA) public data: {
      title?: string;
      message: string;
      confirmLabel?: string;
      cancelLabel?: string;
    }
  ) {}

  onNoClick(): void {
    this.dialogRef.close(false);
  }
} 