import { CHANNEL, CHANNEL_TOKEN, TalyPageDataService } from '@allianz/taly-core';
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 {
  private smallPrintService = inject(TalyFrameSmallPrintService);

  @ViewChild('container', { read: ViewContainerRef, static: true }) container!: ViewContainerRef;

  private destroyRef = inject(DestroyRef);
  private channel = inject(CHANNEL_TOKEN);
  private pageDataService = inject(TalyPageDataService);

  protected fullWidthInRetail?: boolean;
  protected isExpertChannel: boolean;

  constructor() {
    this.isExpertChannel = this.channel === CHANNEL.EXPERT;

    this.pageDataService.pageData$
      .pipe(takeUntilDestroyed(this.destroyRef))
      .subscribe((pageData) => {
        this.fullWidthInRetail = pageData.smallPrint?.fullWidthInRetail;
      });
  }

  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();
  }
}