import { Component, DestroyRef, OnInit, inject } from '@angular/core';
import { CommonModule } from '@angular/common';
import { Router } from '@angular/router';
import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
import { AuthService } from '../../services/auth.service';
import { AuthDialogService } from '../../services/auth-dialog.service';
import { CurrentUser } from '../../models/auth.models';
import { LoginDialogComponent } from '../login-dialog/login-dialog.component';
import { RegisterDialogComponent } from '../register-dialog/register-dialog.component';
import { ThemeService } from '../../services/theme.service';
import { ChallengeEventService } from '../../services/challenge-event.service';
import { ChallengeNotificationComponent } from '../challenge-notification/challenge-notification.component';
import { Challenge } from '../../models/challenge.models';

@Component({
  selector: 'app-toolbar',
  standalone: true,
  imports: [CommonModule, LoginDialogComponent, RegisterDialogComponent, ChallengeNotificationComponent],
  templateUrl: './toolbar.component.html',
  styleUrl: './toolbar.component.css'
})
export class ToolbarComponent implements OnInit {
  private readonly destroyRef = inject(DestroyRef);
  private readonly authService = inject(AuthService);
  private readonly authDialogService = inject(AuthDialogService);
  private readonly themeService = inject(ThemeService);
  private readonly challengeEventService = inject(ChallengeEventService);
  private readonly router = inject(Router);

  currentUser: CurrentUser | null = null;
  showLoginDialog = false;
  showRegisterDialog = false;
  isDarkMode = false;
  incomingChallenges: Challenge[] = [];
  showNotificationMenu = false;
  displayedChallenge: Challenge | null = null;

  ngOnInit(): void {
    this.authService.currentUser$
      .pipe(takeUntilDestroyed(this.destroyRef))
      .subscribe((user) => {
        this.currentUser = user;
      });

    this.authDialogService.dialogState$
      .pipe(takeUntilDestroyed(this.destroyRef))
      .subscribe((state) => {
        this.showLoginDialog = state === 'login';
        this.showRegisterDialog = state === 'register';
      });

    this.themeService.darkMode$
      .pipe(takeUntilDestroyed(this.destroyRef))
      .subscribe((isDarkMode) => {
        this.isDarkMode = isDarkMode;
      });

    this.challengeEventService.getIncomingChallenges$()
      .pipe(takeUntilDestroyed(this.destroyRef))
      .subscribe((challenges) => {
        this.incomingChallenges = challenges;
        // Show the most recent challenge as notification
        if (challenges.length > 0) {
          this.displayedChallenge = challenges[0];
        }
      });

    this.challengeEventService.getChallengeReceived$()
      .pipe(takeUntilDestroyed(this.destroyRef))
      .subscribe((challenge) => {
        this.displayedChallenge = challenge;
      });
  }

  openLoginDialog(): void {
    this.authDialogService.openLogin();
  }

  closeLoginDialog(): void {
    this.authDialogService.close();
  }

  openRegisterDialog(): void {
    this.authDialogService.openRegister();
  }

  closeRegisterDialog(): void {
    this.authDialogService.close();
  }

  logout(): void {
    this.authService.logout();
  }

  toggleTheme(): void {
    this.themeService.toggleTheme();
  }

  goToProfile(): void {
    this.router.navigate(['/profile']);
  }

  onLoginSuccess(): void {
    this.closeLoginDialog();
  }

  onRegisterSuccess(): void {
    this.closeRegisterDialog();
  }

  toggleNotificationMenu(): void {
    this.showNotificationMenu = !this.showNotificationMenu;
  }

  closeNotificationMenu(): void {
    this.showNotificationMenu = false;
  }

  onChallengeAccepted(challenge: Challenge): void {
    this.challengeEventService.onChallengeAccepted(challenge);
    this.displayedChallenge = null;
    this.closeNotificationMenu();
    // Navigate to the game (once game creation is handled by backend)
  }

  onChallengeDeclined(challenge: Challenge): void {
    this.challengeEventService.removeChallenge(challenge.id);
    this.displayedChallenge = null;
    this.closeNotificationMenu();
  }

  onNotificationClose(): void {
    this.displayedChallenge = null;
  }

  goToChallenges(): void {
    this.closeNotificationMenu();
    void this.router.navigate(['/challenges']);
  }
}
