import {
  AfterViewInit,
  Component,
  DestroyRef,
  TemplateRef,
  ViewChild,
  ViewContainerRef,
  inject
} from '@angular/core';
import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
import { TalyFrameSmallPrintService } from '../../services/small-print.service';

@Component({
  selector: 'frame-small-print',
  templateUrl: './small-print.component.html',
  styleUrls: ['./small-print.component.scss'],
  standalone: false
})
export class SmallPrintComponent implements AfterViewInit {
  @ViewChild('container', { read: ViewContainerRef, static: true }) container!: ViewContainerRef;

  private destroyRef = inject(DestroyRef);

  constructor(private smallPrintService: TalyFrameSmallPrintService) {}

  ngAfterViewInit() {
    this.smallPrintService.templateList$.pipe(takeUntilDestroyed(this.destroyRef)).subscribe({
      next: (templates) => this.renderTemplates(templates)
    });
  }

  private renderTemplates(templates: TemplateRef<unknown>[]) {
    this.clearContent();

    templates.forEach((template) => {
      this.container.createEmbeddedView(template);
    });
  }

  private clearContent() {
    this.container.clear();
  }
}