import { Component, OnDestroy, OnInit } from '@angular/core';
import { AppInsightsSessionService } from '@core/services/app-insights-session.service';
import { AppShellService } from '@core/services/app-shell.service';
import { AuthService } from '@core/services/auth.service';
import { CardPageTypes, CardsService } from '@core/services/cards.service';
import { SessionKeepAliveService } from '@core/services/session-keep-alive.service';
import { TokenTimeoutService } from '@core/services/token/token-timeout.service';
import { TokenService } from '@core/services/token/token.service';
import { FooterState } from '@core/states/footer.state';
import { BrandingColors } from '@core/typings/branding.typing';
import { AdminUserPermissions } from '@core/typings/user.typing';
import { environment } from '@environment';
import { ClientSettingsService } from '@features/client-settings/client-settings.service';
import { UserService } from '@features/users/user.service';
import { SidebarLink } from '@yourcause/common';
import { filter, Observable, Subscription, tap } from 'rxjs';

@Component({
  selector: 'gc-base-wrapper',
  template: `
    <gc-branding [branding]="branding"></gc-branding>
    <yc-app-shell
      [sidebarLinks]="sidebarLinks$ | async"
      [sidebarClosed]="sidebarClosed$ | async"
      [logoLocation]="'./assets/img/brand/yc-logo-165x29.png'"
      [logoText]="'GrantsConnect - Platform Admin'"
      [productName]="'YourCause - GrantsConnect'"
      [simpleProductName]="'GrantsConnect'"
      [logoText]="'GrantsConnect'"
      [accountName]="accountName"
      [accountRole]="accountRole"
      [footerState]="footerState$ | async"
      [footerAction]="footerAction$ | async"
      [footerCancelAction]="footerCancel$ | async"
      [footerSecondaryAction]="footerSecondaryAction$ | async"
      [footerActionDisabled]="footerActionDisabled$ | async"
      [footerActionLabel]="footerActionLabel$ | async"
      [footerCancelLabel]="footerCancelLabel$ | async"
      [footerSecondaryLabel]="footerSecondaryLabel$ | async"
      [footerSecondaryDisabled]="footerSecondaryDisabled$ | async"
      [autoSignoutVisible]="showTimeout$ | async"
      [countDownTime]="timeRemaining$ | async"
      [copyrightText]="copyrightText"
      (onKeepMeSignedIn)="handleKeepMeSignedIn()"
      (onSignOutClick)="handleSignoutClick()"
      (onSidebarToggle)="handleSidebarToggle()">
      <router-outlet></router-outlet>
    </yc-app-shell>
  `
})
export class PlatformWrapperComponent implements OnInit, OnDestroy {
  sidebarLinks$: Observable<SidebarLink[]> = this.appShellService
    .changesTo$('sidebarLinks');
  sidebarClosed$: Observable<boolean> = this.appShellService
    .changesTo$('sidebarClosed');
  footerState$ = this.footerState.changesTo$('footerState');
  footerAction$ = this.footerState.changesTo$('footerAction');
  footerSecondaryAction$ = this.footerState.changesTo$('footerSecondaryAction');
  footerCancel$ = this.footerState.changesTo$('footerCancelAction');
  footerActionDisabled$ = this.footerState.changesTo$('footerActionDisabled');
  footerActionLabel$ = this.footerState.changesTo$('footerActionLabel');
  footerSecondaryLabel$ = this.footerState.changesTo$('footerSecondaryLabel');
  footerSecondaryDisabled$ = this.footerState.changesTo$('footerSecondaryDisabled');
  footerCancelLabel$ = this.footerState.changesTo$('footerCancelLabel');
  copyrightText = '©2020 YourCause - GrantsConnect ' + environment.version + ' (' + this.appInsightsSessionService.sessionId + ')';
  adminPermissions = this.userService.adminPermissions;
  branding: BrandingColors;
  sub = new Subscription();
  showTimeout$ = this.timeoutService.timeoutStart$;
  timeRemaining$ = this.timeoutService.timeRemaining$.pipe(
    tap(time => {
      if (time <= 0) {
        this.handleSignoutClick(true);
      }
    }), filter(time => time <= this.timeoutService.timeoutStart));

  constructor (
    private sessionKeepAliveService: SessionKeepAliveService,
    private timeoutService: TokenTimeoutService,
    private appShellService: AppShellService,
    private tokenService: TokenService,
    private userService: UserService,
    private footerState: FooterState,
    private authService: AuthService,
    private appInsightsSessionService: AppInsightsSessionService,
    private clientSettingsService: ClientSettingsService,
    private cardsService: CardsService
  ) {
    this.sub.add(
      this.clientSettingsService.changesTo$('clientBranding').subscribe(() => {
        this.branding = this.clientSettingsService.get('clientBranding') ||
          this.clientSettingsService.defaultBranding;
      })
    );
    appShellService.setSidebarLinks([{
      href: '/platform/home',
      label: 'Home',
      i18nKey: 'NAV:Home',
      sequence: '1.1',
      icon: 'home',
      group: 1
    }, this.adminPermissions.includes(AdminUserPermissions.CanManageAddressRequests) ? {
      href: '/platform/address-requests',
      label: 'Address Requests',
      i18nKey: 'common:hdrAddressRequests',
      sequence: '1.2',
      icon: 'mailbox',
      group: 1
    } : null,
    this.cardsService.canSeePage(CardPageTypes.ADMIN_SETTINGS) ? {
      href: '/platform/admin-settings',
      label: 'Admin Settings',
      i18nKey: 'common:hdrAdminSettings',
      sequence: '1.3',
      icon: 'user-lock',
      group: 1
    } : null,
    this.adminPermissions.includes(AdminUserPermissions.ViewApplicants) ? {
      href: '/platform/applicants',
      label: 'Applicants',
      i18nKey: 'common:lblApplicants',
      sequence: '1.4',
      icon: 'users',
      group: 1
    } : null,
    { //can always see this page because everyone can access the Clients card
      href: '/platform/client-management',
      label: 'Client Management',
      i18nKey: 'common:hdrClientManagement',
      sequence: '1.5',
      icon: 'building',
      group: 1
    },
    this.cardsService.canSeePage(CardPageTypes.PRODUCT_MANAGEMENT) ? {
      href: '/platform/product-management',
      label: 'Product Management',
      i18nKey: 'common:hdrProductManagement',
      sequence: '1.6',
      icon: 'toolbox',
      group: 1
    } : null
  ].filter(link => !!link));
  }

  get accountName () {
    return this.userService.get('userName');
  }

  get accountRole () {
    return this.userService.get('userJobTitle');
  }

  ngOnInit () {
    this.timeoutService.start();
    this.sessionKeepAliveService.startWatching();
  }

  handleSidebarToggle () {
    this.appShellService.toggleSidebar();
  }

  async handleSignoutClick (fromTimeout = false) {
    this.tokenService.logout(false);
    this.sessionKeepAliveService.stopWatching();
    if (!fromTimeout) {
      const { signOutUrl } = await this.authService.getBlackbaudLoginRoute();
      location.href = signOutUrl;
    } else {
      location.pathname = '/platform/auth/logout';
    }
  }

  handleKeepMeSignedIn () {
    this.tokenService.getLatestToken();
  }

  ngOnDestroy () {
    this.sub?.unsubscribe();
  }
}