/* eslint-disable @typescript-eslint/member-ordering */
import {
  Component,
  effect,
  inject,
  input,
  signal
} from '@angular/core';
import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';
import { NgIcon, provideIcons } from '@ng-icons/core';
import { Store } from '@ngrx/store';
import {
  lucideCheck,
  lucideTrash2,
  lucideLock,
  lucideUnlock
} from '@ng-icons/lucide';

import { Room } from '../../../../core/models/index';
import { RoomsActions } from '../../../../store/rooms/rooms.actions';
import { ConfirmDialogComponent } from '../../../../shared';
import { SettingsModalService } from '../../../../core/services/settings-modal.service';

@Component({
  selector: 'app-server-settings',
  standalone: true,
  imports: [
    CommonModule,
    FormsModule,
    NgIcon,
    ConfirmDialogComponent
  ],
  viewProviders: [
    provideIcons({
      lucideCheck,
      lucideTrash2,
      lucideLock,
      lucideUnlock
    })
  ],
  templateUrl: './server-settings.component.html'
})
export class ServerSettingsComponent {
  private store = inject(Store);
  private modal = inject(SettingsModalService);

  /** The currently selected server, passed from the parent. */
  server = input<Room | null>(null);
  /** Whether the current user is admin of this server. */
  isAdmin = input(false);

  roomName = '';
  roomDescription = '';
  isPrivate = signal(false);
  maxUsers = 0;
  showDeleteConfirm = signal(false);

  saveSuccess = signal<string | null>(null);
  private saveTimeout: ReturnType<typeof setTimeout> | null = null;

  /** Reload form fields whenever the server input changes. */
  readonly serverData = this.server;

  constructor() {
    effect(() => {
      const room = this.server();

      if (!room)
        return;

      this.roomName = room.name;
      this.roomDescription = room.description || '';
      this.isPrivate.set(room.isPrivate);
      this.maxUsers = room.maxUsers || 0;
    });
  }

  togglePrivate(): void {
    this.isPrivate.update((currentValue) => !currentValue);
  }

  saveServerSettings(): void {
    const room = this.server();

    if (!room)
      return;

    this.store.dispatch(
      RoomsActions.updateRoom({
        roomId: room.id,
        changes: {
          name: this.roomName,
          description: this.roomDescription,
          isPrivate: this.isPrivate(),
          maxUsers: this.maxUsers
        }
      })
    );

    this.showSaveSuccess('server');
  }

  confirmDeleteRoom(): void {
    this.showDeleteConfirm.set(true);
  }

  deleteRoom(): void {
    const room = this.server();

    if (!room)
      return;

    this.store.dispatch(RoomsActions.deleteRoom({ roomId: room.id }));
    this.showDeleteConfirm.set(false);
    this.modal.navigate('network');
  }

  private showSaveSuccess(key: string): void {
    this.saveSuccess.set(key);

    if (this.saveTimeout)
      clearTimeout(this.saveTimeout);

    this.saveTimeout = setTimeout(() => this.saveSuccess.set(null), 2000);
  }
}