import { of, Subject } from 'rxjs';
import { take, map, catchError, takeUntil } from 'rxjs/operators';

import {
  Component,
  OnInit,
  OnDestroy,
  ChangeDetectorRef,
  ViewChild
} from '@angular/core';
import { ActivatedRoute, Router, Params } from '@angular/router';

import { Store } from '@ngrx/store';

import { MatDialog } from '@angular/material/dialog';

import { ParamsUtil } from '@ucap/ng-core';
import { LogService } from '@ucap/ng-logger';
import { I18nService } from '@ucap/ng-i18n';

import { CreateDialogComponent } from '@app/sections/group/dialogs/create.dialog.component';
import { ListSectionComponent } from '@app/sections/group/components/list.section.component';
import { SearchData } from '@app/ucap/organization/models/search-data';
import { QueryParams } from '@app/pages/organization/types/params.type';

@Component({
  selector: 'app-pages-group-sidenav',
  templateUrl: './sidenav.page.component.html',
  styleUrls: ['./sidenav.page.component.scss']
})
export class SidenavPageComponent implements OnInit, OnDestroy {
  @ViewChild('sectionGroupList', { static: false })
  sectionGroupList: ListSectionComponent;

  set companySearchData(searchData: SearchData) {
    this._companySearchData = searchData;
  }
  get companySearchData() {
    return this._companySearchData;
  }
  // tslint:disable-next-line: variable-name
  _companySearchData: SearchData;

  showType: string;

  private ngOnDestroySubject: Subject<boolean>;

  constructor(
    private activatedRoute: ActivatedRoute,
    private router: Router,
    private logService: LogService,
    private i18nService: I18nService,
    private store: Store<any>,
    private changeDetectorRef: ChangeDetectorRef,
    public dialog: MatDialog
  ) {
    this.i18nService.setDefaultNamespace('group');
  }

  ngOnInit(): void {
    this.ngOnDestroySubject = new Subject<boolean>();

    this.showType = 'ALL';
  }

  ngOnDestroy(): void {}

  onClickFab(event: MouseEvent) {}

  onClickGroupMenu(menuType: string) {
    switch (menuType) {
      case 'GROUP_NEW':
        {
          const dialogRef = this.dialog.open(CreateDialogComponent, {
            width: '100%',
            height: '100%'
          });

          dialogRef
            .afterClosed()
            .pipe(
              take(1),
              map((result) => {}),
              catchError((err) => {
                return of(err);
              })
            )
            .subscribe();
        }
        break;
      case 'GROUP_EXPAND_MORE':
        {
          this.sectionGroupList.onExpandMore();
        }
        break;
      case 'GROUP_EXPAND_LESS':
        {
          this.sectionGroupList.onExpandLess();
        }
        break;
      case 'GROUP_CHANGE_ODER':
        {
        }
        break;
    }
  }

  onClickShowGroupMenu(menuType: string) {
    switch (menuType) {
      case 'ALL':
        {
          this.showType = 'ALL';
        }
        break;
      case 'ONLINE_BUDDY':
        {
          this.showType = 'ONLINE_BUDDY';
        }
        break;
      case 'ON_OFF':
        {
          this.showType = 'ON_OFF';
        }
        break;
    }
  }
}
