import { ChangeDetectionStrategy, Component, computed, inject } from '@angular/core';
import { SkillsGrid } from '../../components/pages/skills/skills-grid/skills-grid';
import { ContentService } from '../../core/content/content.service';
import { ContentSection } from '../../shared/content-section/content-section';
import { PageHero } from '../../shared/page-hero/page-hero';

@Component({
  selector: 'app-stack-page',
  changeDetection: ChangeDetectionStrategy.OnPush,
  imports: [PageHero, ContentSection, SkillsGrid],
  templateUrl: './stack.html',
  styleUrl: '../../shared/page-shell.scss',
})
export class StackPage {
  protected readonly page = inject(ContentService).stack();
  protected readonly categoryTitles = computed(() => {
    const titles: Record<string, string> = {};
    for (const group of this.page().groups) {
      titles[group.id] = group.title;
    }
    return titles;
  });
}