import { Injectable, signal } from '@angular/core';

export type SettingsPage =
  | 'general'
  | 'plugins'
  | 'theme'
  | 'network'
  | 'notifications'
  | 'voice'
  | 'updates'
  | 'localApi'
  | 'data'
  | 'debugging'
  | 'server'
  | 'serverPlugins'
  | 'members'
  | 'bans'
  | 'permissions';

@Injectable({ providedIn: 'root' })
export class SettingsModalService {
  readonly isOpen = signal(false);
  readonly activePage = signal<SettingsPage>('general');
  readonly targetServerId = signal<string | null>(null);
  readonly themeStudioFullscreen = signal(false);
  readonly themeStudioMinimized = signal(false);

  open(page: SettingsPage = 'general', serverId?: string): void {
    this.themeStudioFullscreen.set(false);
    this.themeStudioMinimized.set(false);
    this.activePage.set(page);
    this.targetServerId.set(serverId ?? null);
    this.isOpen.set(true);
  }

  close(): void {
    this.themeStudioFullscreen.set(false);
    this.themeStudioMinimized.set(false);
    this.isOpen.set(false);
  }

  navigate(page: SettingsPage): void {
    this.activePage.set(page);

    if (page !== 'theme') {
      this.themeStudioFullscreen.set(false);
      this.themeStudioMinimized.set(false);
    }
  }

  setThemeStudioFullscreen(isFullscreen: boolean): void {
    this.themeStudioFullscreen.set(isFullscreen);
  }

  toggleThemeStudioFullscreen(): void {
    this.themeStudioFullscreen.update((isFullscreen) => !isFullscreen);
  }

  openThemeStudio(): void {
    this.activePage.set('theme');
    this.themeStudioMinimized.set(false);
    this.isOpen.set(true);
    this.themeStudioFullscreen.set(true);
  }

  minimizeThemeStudio(): void {
    this.activePage.set('theme');
    this.themeStudioFullscreen.set(false);
    this.themeStudioMinimized.set(true);
    this.isOpen.set(false);
  }

  restoreMinimizedThemeStudio(): void {
    this.openThemeStudio();
  }

  dismissMinimizedThemeStudio(): void {
    this.themeStudioMinimized.set(false);
  }
}
