import { Directive, ViewContainerRef,TemplateRef,OnInit,Input,OnDestroy } from '@angular/core';
import { Store} from '@ngrx/store';
import * as appCommonReducer from '../../reducers/app-common.reducer'
import { IPackages } from '../../models/package';
import { Observable, Subscription } from 'rxjs';

@Directive({
  selector: '[fm-haspackage]',
})
export class HasPackageDirective  implements OnInit,OnDestroy{
  @Input('fm-haspackage') package:string;

  constructor(private templateRef$: TemplateRef<any>,private viewContainerRef$: ViewContainerRef,private store$: Store<appCommonReducer.State>) { }
  private packages$:Observable<IPackages> = this.store$.select(appCommonReducer.SelectGetUserPackages);
  private hasView = false;
  private packSub:Subscription;
  ngOnInit() {    
    this.packages$.subscribe((packages) => {
      if (packages[this.package] && packages[this.package].enabled) {
        this.viewContainerRef$.createEmbeddedView(this.templateRef$);
        this.hasView=true;
      } else if (this.hasView) {
        this.viewContainerRef$.clear();
        this.hasView = false;     
      }  
    });
  }

  ngOnDestroy() {
    if(this.packSub) this.packSub.unsubscribe();
  }
}