import { CommonModule, isPlatformBrowser } from '@angular/common';
import { Component, HostListener, Inject, OnDestroy, OnInit, PLATFORM_ID } from '@angular/core';
import { RouterModule } from '@angular/router';
import { NavigationEnd, Router } from '@angular/router';
import { Subscription } from 'rxjs';
import { filter } from 'rxjs/operators';

@Component({
  selector: 'app-sidebar',
  standalone: true,
  imports: [CommonModule, RouterModule],
  templateUrl: './sidebar.component.html',
  styleUrls: ['./sidebar.component.scss']
})
export class SidebarComponent implements OnInit, OnDestroy {
  isCollapsed = false;
  isMobile = false;
  isMenuOpen = false;
  private routerSubscription?: Subscription;

  constructor(
    private router: Router,
    @Inject(PLATFORM_ID) private platformId: Object
  ) {}

  ngOnInit(): void {
    this.updateViewportState();
    this.routerSubscription = this.router.events
      .pipe(filter(event => event instanceof NavigationEnd))
      .subscribe(() => {
        if (this.isMobile) {
          this.closeMobileMenu();
        }
      });
  }

  ngOnDestroy(): void {
    this.routerSubscription?.unsubscribe();
  }

  @HostListener('window:resize')
  onResize(): void {
    this.updateViewportState();
  }

  toggleSidebar(): void {
    if (this.isMobile) {
      this.isMenuOpen = !this.isMenuOpen;
      return;
    }

    this.isCollapsed = !this.isCollapsed;
  }

  openMobileMenu(): void {
    if (!this.isMobile) {
      return;
    }

    this.isMenuOpen = true;
  }

  closeMobileMenu(): void {
    this.isMenuOpen = false;
  }

  logout(): void {
    localStorage.removeItem('access_token');
    this.closeMobileMenu();
    this.router.navigate(['/']);
  }

  private updateViewportState(): void {
    if (!isPlatformBrowser(this.platformId)) {
      return;
    }

    const nextIsMobile = window.innerWidth <= 1100;

    if (this.isMobile !== nextIsMobile) {
      this.isMobile = nextIsMobile;

      if (!this.isMobile) {
        this.isMenuOpen = false;
      } else {
        this.isCollapsed = false;
      }
    }
  }
}