import { Component, OnInit, Input, OnDestroy } from '@angular/core';
import { UserInfo } from '@ucap-webmessenger/protocol-sync';
import {
  UserInfoSS,
  UserInfoF,
  UserInfoDN
} from '@ucap-webmessenger/protocol-query';
import { StatusBulkInfo, StatusInfo } from '@ucap-webmessenger/protocol-status';
import { Store, select } from '@ngrx/store';
import * as AppStore from '@app/store';
import { Subscription } from 'rxjs';
import { NGXLogger } from 'ngx-logger';
import { tap } from 'rxjs/operators';
import { SessionStorageService } from '@ucap-webmessenger/web-storage';
import { KEY_VER_INFO, VerInfo2 } from '@app/types/ver-info.type';
import { StatusCode } from '@ucap-webmessenger/core';

@Component({
  selector: 'ucap-profile-user-list-item',
  templateUrl: './user-list-item.component.html',
  styleUrls: ['./user-list-item.component.scss']
})
export class UserListItemComponent implements OnInit, OnDestroy {
  @Input()
  userInfo: UserInfo | UserInfoSS | UserInfoF | UserInfoDN;
  @Input()
  profileImageRoot?: string;
  @Input()
  set presence(value: StatusBulkInfo | StatusInfo) {
    this.logger.debug('presence', value);
    this.userPresence = value;
  }
  @Input()
  checkable = false;
  @Input()
  compactable = false;

  userPresence: StatusBulkInfo | StatusInfo;

  get PresenceType() {
    return PresenceType;
  }

  // private profileImageRootSubscription: Subscription;

  constructor(
    private store: Store<any>,
    private logger: NGXLogger,
    private sessionStorageService: SessionStorageService
  ) {}

  ngOnInit() {
    // this.profileImageRootSubscription = this.store
    //   .pipe(
    //     select(AppStore.SettingSelector.VersionInfoSelector.profileImageRoot),
    //     tap(profileImageRoot => {
    //       this.profileImageRoot = this.profileImageRoot || profileImageRoot;
    //     })
    //   )
    //   .subscribe();

    const verInfo = this.sessionStorageService.get<VerInfo2>(KEY_VER_INFO);
    this.profileImageRoot = this.profileImageRoot || verInfo.profileRoot;
  }

  ngOnDestroy(): void {
    // if (!!this.profileImageRootSubscription) {
    //   this.profileImageRootSubscription.unsubscribe();
    // }
  }

  getPresence(type: string): string {
    let status: string;
    let rtnClass = '';
    switch (type) {
      case 'pc':
        status = this.userPresence.pcStatus;
        break;
    }

    if (!!status) {
      switch (status) {
        case StatusCode.OnLine:
          rtnClass = type + 'On';
          break;
        case StatusCode.Away:
          rtnClass = type + 'Out';
          break;
        case StatusCode.Busy:
          rtnClass = type + 'Other';
          break;
        default:
          rtnClass = type + 'Off';
          break;
      }
    }

    return rtnClass;
  }
}

export enum PresenceType {
  PC = 'pc',
  MOBILE = 'mobile',
  CONFERENCE = 'conference',
  MOBILE_CONFERENCE = 'mobileConference',
  PHONE = 'phone',
  IMESSENER = 'imessenger'
}