import { Component, ChangeDetectionStrategy, effect, inject, signal } from '@angular/core';
import { RouterLink } from '@angular/router';
import { TranslatePipe } from '../../i18n/translate.pipe';
import { LogoComponent } from '../logo/logo.component';
import { UiRuntimeFacade } from '../../facades/runtime/ui-runtime.facade';
import { LangRoutePipe } from '../../pipes/lang-route.pipe';
import { FooterPaymentIcon, FooterResolvedGroup, FooterResolverService } from '../../core/config/footer-resolver.service';
import { ConfigService } from '../../core/config/config.service';

@Component({
  selector: 'app-footer',
  imports: [TranslatePipe, LogoComponent, RouterLink, LangRoutePipe],
  templateUrl: './footer.component.html',
  styleUrls: ['./footer.component.scss'],
  changeDetection: ChangeDetectionStrategy.OnPush
})
export class FooterComponent {
  readonly footerGroups = signal<FooterResolvedGroup[]>([]);
  readonly paymentIcons = signal<FooterPaymentIcon[]>([]);
  readonly copyrightText = signal('');

  private readonly configService = inject(ConfigService);

  constructor(
    private readonly uiRuntime: UiRuntimeFacade,
    private readonly footerResolver: FooterResolverService
  ) {
    effect(() => {
      this.configService.bootstrapRevision();
      const bootstrap = this.configService.getBootstrapSnapshot();
      if (!bootstrap) {
        this.footerGroups.set([]);
        this.paymentIcons.set([]);
        this.copyrightText.set('');
        return;
      }

      const model = this.footerResolver.resolveFooterModelFromBootstrap(bootstrap);
      this.footerGroups.set(model.groups);
      this.paymentIcons.set(model.paymentIcons);
      this.copyrightText.set(model.copyrightText);
    });

    this.configService.loadBootstrap().subscribe();
  }

  currentYear = new Date().getFullYear();

  get brandName(): string {
    return this.uiRuntime.marketplaceName();
  }

  get contactEmail(): string {
    return this.uiRuntime.contactEmail();
  }
}