import { ChangeDetectorRef, Component, Input, NgZone, OnDestroy, OnInit } from '@angular/core';
import { PluginsApiService } from '@fleio-api/core/plugins-api.service';
import { IPluginsWithNotificationsModel } from '@fleio-api/core/model/plugins-with-notifications.model';
import { RefreshTimer } from '@shared/ui-api/helpers/refresh-timer';
import { AuthService } from '@shared/auth/auth.service';
import { Subscription } from 'rxjs';
import { ConfigService } from '@shared/config/config.service';

@Component({
  selector: 'app-plugins-notifications',
  templateUrl: './plugins-notifications.component.html',
  styleUrls: ['./plugins-notifications.component.scss']
})
export class PluginsNotificationsComponent implements OnInit, OnDestroy {
  @Input() panel: string;
  notificationsSubscription: Subscription;
  pluginsTooltip = $localize`Plugins`;

  constructor(
    private pluginsApi: PluginsApiService, private authService: AuthService,
    private configService: ConfigService, private ngZone: NgZone,
    private changeDetectorRef: ChangeDetectorRef,
    private config: ConfigService,
  ) {
  }

  public pluginsNotifications: IPluginsWithNotificationsModel;
  private refreshTimer: RefreshTimer;
  private loginCompleteSubscription: Subscription;

  ngOnInit(): void {
    if (this.authService.feature('ui.top-bar.plugins-notifications')) {
      this.refreshData();
      this.refreshTimer = new RefreshTimer(this.config.getDefaultRefreshInterval(true), () => {
        this.refreshData();
      }, this.configService, this.ngZone, this.changeDetectorRef);
      this.loginCompleteSubscription = this.authService.loggedInCompleted.subscribe(loggedIn => {
        if (loggedIn) {
          this.refreshData();
        }
      });
    }
  }

  private refreshData(): void {
    if (this.authService.userData && this.authService.userData.user) {
      this.notificationsSubscription = this.pluginsApi.pluginsWithNotifications()
        .subscribe(pluginNotifications => {
          this.pluginsNotifications = pluginNotifications;
        });
    }
  }

  ngOnDestroy() {
    if (this.notificationsSubscription) {
      this.notificationsSubscription.unsubscribe();
      this.notificationsSubscription = null;
    }
    if (this.loginCompleteSubscription) {
      this.loginCompleteSubscription.unsubscribe();
      this.loginCompleteSubscription = null;
    }
  }

}
