import { Component, computed, inject } from '@angular/core';
import { ActivatedRoute, RouterLink, RouterLinkActive, RouterOutlet } from '@angular/router';

import { findMenu } from '../../../../core/services/menu.utils';
import { TenantService } from '../../../../core/services/tenant.service';

@Component({
  selector: 'app-menu-page-layout',
  imports: [RouterLink, RouterLinkActive, RouterOutlet],
  templateUrl: './menu-page-layout.component.html',
  styleUrl: './menu-page-layout.component.scss',
})
export class MenuPageLayoutComponent {
  private readonly route = inject(ActivatedRoute);
  private readonly tenantService = inject(TenantService);

  protected readonly navigationLabel =
    (this.route.snapshot.data['navigationLabel'] as string | undefined) ?? 'Secciones';

  private readonly menuCode = this.route.snapshot.data['menuCode'] as string | undefined;

  protected readonly menu = computed(() =>
    findMenu(this.tenantService.tenant()?.menues ?? [], this.menuCode ?? ''),
  );
  protected readonly submenues = computed(() => this.menu()?.submenues ?? []);
}
