import { Component, inject, OnInit, Signal } from '@angular/core';
import { RouterOutlet } from '@angular/router';
import {
    UserService,
    UserState,
} from '@eui/core';
import { EUI_ECL_APP } from '@eui/ecl/components/ecl-app';
import { EUI_ECL_BREADCRUMB } from '@eui/ecl/components/ecl-breadcrumb';
import { EUI_ECL_ICON } from '@eui/ecl/components/ecl-icon';
import { EUI_ECL_LINK } from '@eui/ecl/components/ecl-link';
import { EclMenuItemSelectEvent, EUI_ECL_MENU } from '@eui/ecl/components/ecl-menu';
import { EUI_ECL_PAGE_HEADER } from '@eui/ecl/components/ecl-page-header';
import { EUI_ECL_SITE_FOOTER } from '@eui/ecl/components/ecl-site-footer';
import { EclSiteHeaderLoginEvent, EclSiteHeaderSearchEvent, EUI_ECL_SITE_HEADER } from '@eui/ecl/components/ecl-site-header';
import { TranslateModule } from '@ngx-translate/core';

@Component({
    selector: 'app-root',
    templateUrl: './app.component.html',
    standalone: true,
    imports: [
        ...EUI_ECL_APP,
        ...EUI_ECL_BREADCRUMB,
        ...EUI_ECL_ICON,
        ...EUI_ECL_LINK,
        ...EUI_ECL_MENU,
        ...EUI_ECL_PAGE_HEADER,
        ...EUI_ECL_SITE_HEADER,
        ...EUI_ECL_SITE_FOOTER,
        RouterOutlet,
        TranslateModule,
    ]
})
export class AppComponent implements OnInit {

    isLoggedIn = false;
    userState: Signal<UserState>;
    userInfos: UserState;
    private userService = inject(UserService<UserState>);

    ngOnInit(): void {
        this.userState = this.userService.getSignal();
        this.userInfos = this.userState();
    }

    onLogin(evt: EclSiteHeaderLoginEvent): void {
        this.isLoggedIn = true;
        console.log(evt);
    }

    onLogout(evt: MouseEvent): void {
        this.isLoggedIn = false;
        evt.preventDefault();
        console.log('logout');
    }

    onSearch(evt: EclSiteHeaderSearchEvent): void {
        console.log(evt);
    }

    onMenuItemSelected(evt: EclMenuItemSelectEvent): void {
        console.log('menu item selected', evt);
    }
}