import { ChangeDetectionStrategy, Component, inject, signal } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { ProjectEditorFacade } from '../facade/project-editor.facade';
import { TranslatePipe } from '../../../i18n/translate.pipe';
import { ButtonComponent } from '../../../shared/ui/button/button.component';
import { SectionCardComponent } from '../../../shared/ui/section-card/section-card.component';

@Component({
  selector: 'app-project-editor-preview-section',
  standalone: true,
  imports: [FormsModule, TranslatePipe, ButtonComponent, SectionCardComponent],
  templateUrl: './preview-section.component.html',
  styleUrls: ['./section.shared.scss'],
  changeDetection: ChangeDetectionStrategy.OnPush
})
export class ProjectEditorPreviewSectionComponent {
  private readonly facade = inject(ProjectEditorFacade);
  readonly exportValue = signal('');
  readonly importValue = signal('');
  readonly importError = this.facade.importError;
  readonly changeSummary = this.facade.changeSummary;
  readonly issues = this.facade.validationIssues;
  readonly hasBlockingIssues = this.facade.hasBlockingIssues;

  refreshExport(): void {
    this.exportValue.set(this.facade.exportBootstrap());
  }

  importDraft(): void {
    this.facade.importBootstrap(this.importValue());
    this.refreshExport();
  }

  preview(): void {
    this.facade.preview();
  }
}
