/* eslint-disable @typescript-eslint/member-ordering */
import {
  Component,
  computed,
  inject,
  signal
} from '@angular/core';
import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';
import { RouterLink } from '@angular/router';
import { Store } from '@ngrx/store';
import { NgIcon, provideIcons } from '@ng-icons/core';
import {
  lucideArrowLeft,
  lucideSearch,
  lucideUsers
} from '@ng-icons/lucide';

import { AppI18nService, APP_TRANSLATE_IMPORTS } from '../../../../core/i18n';
import { UserSearchListComponent } from '../user-search-list/user-search-list.component';
import { selectAllUsers } from '../../../../store/users/users.selectors';
import { selectSavedRooms } from '../../../../store/rooms/rooms.selectors';

/**
 * Dedicated people-discovery page. Wraps {@link UserSearchListComponent} with a search
 * field and an onboarding empty state for accounts that have not joined any servers yet.
 * On mobile the global app-shell servers rail stays visible beside this page.
 */
@Component({
  selector: 'app-find-people',
  standalone: true,
  imports: [
    CommonModule,
    FormsModule,
    RouterLink,
    NgIcon,
    UserSearchListComponent,
    ...APP_TRANSLATE_IMPORTS
  ],
  viewProviders: [provideIcons({ lucideArrowLeft, lucideSearch, lucideUsers })],
  templateUrl: './find-people.component.html',
  host: {
    class: 'block h-full min-h-0 min-w-0 w-full overflow-hidden'
  }
})
export class FindPeopleComponent {
  private store = inject(Store);
  searchQuery = signal('');
  private users = this.store.selectSignal(selectAllUsers);
  private savedRooms = this.store.selectSignal(selectSavedRooms);

  /** True when the account has any people to surface (known users or server members). */
  hasDiscoverablePeople = computed(() => {
    if (this.users().length > 0) {
      return true;
    }

    return this.savedRooms().some((room) => (room.members?.length ?? 0) > 0);
  });

  onSearchChange(query: string): void {
    this.searchQuery.set(query);
  }
}