feat static pages system with dynamic footer and safe html rendering

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

@@ -0,0 +1,82 @@
+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';
+import { LangRoutePipe } from '../../pipes/lang-route.pipe';
+
+@Component({
+  selector: 'app-static-page',
+  standalone: true,
+  imports: [CommonModule, RouterLink, TranslatePipe, LangRoutePipe],
+  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 safeHtml = signal<SafeHtml>(this.sanitizer.bypassSecurityTrustHtml(''));
+
+  constructor() {
+    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);
+  }
+}