import { Component, OnDestroy } from '@angular/core';
import { SidebarService } from 'src/app/service/sidebar.service';
import { Subject } from 'rxjs';
import { takeUntil } from 'rxjs/operators';
import { AuthService } from 'src/app/service/auth.service';
import { GuiService } from 'src/app/service/gui.service';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrl: './app.component.scss',
})
export class AppComponent implements OnDestroy {
  theme = 'open-redirect';
  showSidebar = false;
  hideUI = false;
  isLoggedIn = false;
  unsubscribe$ = new Subject<void>();

  constructor(
    private sidebar: SidebarService,
    private auth: AuthService,
    private gui: GuiService
  ) {
    this.auth.loadUser();

    this.auth.user$.pipe(takeUntil(this.unsubscribe$)).subscribe(user => {
      this.isLoggedIn = user !== null && user !== undefined;
    });

    this.sidebar.visible$
      .pipe(takeUntil(this.unsubscribe$))
      .subscribe(visible => {
        this.showSidebar = visible;
      });

    this.gui.hideGui$.pipe(takeUntil(this.unsubscribe$)).subscribe(hide => {
      this.hideUI = hide;
    });

    this.gui.theme$.pipe(takeUntil(this.unsubscribe$)).subscribe(theme => {
      this.theme = theme;
    });
  }

  ngOnDestroy() {
    this.unsubscribe$.next();
    this.unsubscribe$.complete();
  }
}
