import { ChangeDetectionStrategy, Component, EventEmitter, Input, OnInit, Output, QueryList, ViewChildren } from '@angular/core';
import { ShellSectionToggleComponent } from './section-toggle/section-toggle.component';

@Component({
  selector: 'shell-header',
  templateUrl: './header.component.html',
  styleUrls: ['./header.component.scss'],
  changeDetection: ChangeDetectionStrategy.OnPush,
})
export class ShellHeaderComponent implements OnInit {
  @Input()
  section: string;

  @Output()
  sectionChange = new EventEmitter<string>();

  @ViewChildren(ShellSectionToggleComponent)
  sectionToggles: QueryList<ShellSectionToggleComponent>;

  moreMenuOpen = false;

  constructor() {}

  ngOnInit(): void {}

  toggleMoreMenu(value?: boolean) {
    this.moreMenuOpen = value ?? !this.moreMenuOpen;

    if (this.moreMenuOpen) {
      setTimeout(() => {
        this.sectionToggles?.forEach((cmp) => cmp.updateSwitchPositionAndSize());
      }, 0);
    }
  }
}
