import { BreadcrumbService } from '@/core/services';
import { PageLoadingComponent } from '@/shared/components/page-loading.component';
import { Component, computed, effect, inject, signal } from '@angular/core';
import { ActivatedRoute, RouterOutlet } from '@angular/router';
import { guildsNamedRoutes } from '../constants';
import { GuildStore } from '../store/guild.store';

@Component({
  selector: 'superAdmin-guild-layout',
  templateUrl: './layout.component.html',
  imports: [PageLoadingComponent, RouterOutlet],
})
export class GuildLayoutComponent {
  private readonly store = inject(GuildStore);
  private readonly route = inject(ActivatedRoute);
  private readonly breadcrumbService = inject(BreadcrumbService);

  readonly guildId = signal<string>(this.route.snapshot.paramMap.get('guildId')!);

  readonly loading = computed(() => this.store.loading());
  readonly guild = computed(() => this.store.entity());

  constructor() {
    effect(() => {
      if (this.guild()?.id) {
        this.setBreadcrumb();
      }
    });
  }

  getData() {
    this.store.getData(this.guildId());
  }

  ngOnInit() {
    this.getData();
  }

  setBreadcrumb() {
    this.breadcrumbService.setItems([
      {
        ...guildsNamedRoutes.guilds.meta,
        routerLink: guildsNamedRoutes.guilds.meta.pagePath!(),
      },
      {
        title: this.guild()?.name,
      },
    ]);
  }
}
