import { Component, inject } from '@angular/core';
import { MatButtonModule } from '@angular/material/button';
import { MAT_DIALOG_DATA, MatDialogModule } from '@angular/material/dialog';
import { MatIconModule } from '@angular/material/icon';
import { MatSnackBar } from '@angular/material/snack-bar';
import { MatTooltipModule } from '@angular/material/tooltip';

export interface JsonDialogData {
  title: string;
  json: unknown;
}

@Component({
  imports: [MatButtonModule, MatDialogModule, MatIconModule, MatTooltipModule],
  selector: 'app-json-dialog',
  styleUrl: './json-dialog.css',
  templateUrl: './json-dialog.html',
})
export class JsonDialog {
  private readonly snackBar = inject(MatSnackBar);
  protected readonly data = inject<JsonDialogData>(MAT_DIALOG_DATA);
  protected readonly formatted = JSON.stringify(this.data.json, null, 2);

  copy() {
    navigator.clipboard
      .writeText(this.formatted)
      .then(() => this.snackBar.open('JSON copiado al portapapeles', 'Cerrar', { duration: 2500 }))
      .catch(() => this.snackBar.open('No se pudo copiar el JSON', 'Cerrar', { duration: 4000 }));
  }
}