marketplaces/src/app/pages/static-page/static-page.component.ts

import { ChangeDetectionStrategy, Component, SecurityContext, inject, signal } from '@angular/core';
import { CommonModule } from '@angular/common';
import { ActivatedRoute, RouterLink } from '@angular/router';
import { DomSanitizer, SafeHtml } from '@angular/platform-browser';
import { StaticPageResolverService } from '../../core/config/static-page-resolver.service';
import { LanguageService } from '../../services/language.service';
import { TranslatePipe } from '../../i18n/translate.pipe';

@Component({
  selector: 'app-static-page',
  standalone: true,
  imports: [CommonModule, RouterLink, TranslatePipe],
  templateUrl: './static-page.component.html',
  styleUrls: ['./static-page.component.scss'],
  changeDetection: ChangeDetectionStrategy.OnPush
})
export class StaticPageComponent {
  private readonly route = inject(ActivatedRoute);
  private readonly sanitizer = inject(DomSanitizer);
  private readonly staticPageResolver = inject(StaticPageResolverService);
  private readonly languageService = inject(LanguageService);

  readonly loading = signal(true);
  readonly notFound = signal(false);
  readonly title = signal('');
  readonly homeRoute = signal('');
  readonly safeHtml = signal<SafeHtml>(this.sanitizer.bypassSecurityTrustHtml(''));

  constructor() {
    this.homeRoute.set(`/${this.languageService.currentLanguage()}`);

    this.route.paramMap.subscribe(params => {
      const keyFromParam = params.get('key');
      const staticPath = params.get('staticPath');

      if (keyFromParam) {
        this.loadByKey(keyFromParam);
        return;
      }

      if (staticPath) {
        this.loadByPath(`/${staticPath}`);
        return;
      }

      this.notFound.set(true);
      this.loading.set(false);
    });
  }

  private loadByKey(key: string): void {
    this.loading.set(true);
    this.notFound.set(false);

    this.staticPageResolver.resolveByKey(key, this.languageService.currentLanguage()).subscribe(page => {
      this.applyPage(page?.title ?? '', page?.html ?? '', !page);
    });
  }

  private loadByPath(path: string): void {
    this.loading.set(true);
    this.notFound.set(false);

    this.staticPageResolver.resolveByRoute(path, this.languageService.currentLanguage()).subscribe(page => {
      this.applyPage(page?.title ?? '', page?.html ?? '', !page);
    });
  }

  private applyPage(title: string, html: string, notFound: boolean): void {
    if (notFound) {
      this.title.set('');
      this.safeHtml.set(this.sanitizer.bypassSecurityTrustHtml(''));
      this.notFound.set(true);
      this.loading.set(false);
      return;
    }

    const sanitized = this.sanitizer.sanitize(SecurityContext.HTML, html) ?? '';
    this.title.set(title);
    this.safeHtml.set(this.sanitizer.bypassSecurityTrustHtml(sanitized));
    this.notFound.set(false);
    this.loading.set(false);
  }
}