import {
    Injectable,
    ComponentFactoryResolver,
    ApplicationRef,
    Injector,
    EmbeddedViewRef,
    ComponentRef,
    Input,
    Type
  } from '@angular/core';
  import { CouponPopupComponent } from '../../../finance/components/coupon-popup/coupon-popup.component';
  import { CardInterface } from './card-modal.interface';
  import { Subject, Observable } from 'rxjs';
  
  @Injectable()
  export class CardModalService {
    constructor(
      private componentFactoryResolver: ComponentFactoryResolver,
      private applicationRef: ApplicationRef,
      private injector: Injector
    ) { }
  
    private componentRef: ComponentRef<CouponPopupComponent> = null;
  
    appendComponentToBody(): ComponentRef<CouponPopupComponent> {

      if (this.componentRef === null) {
        this.componentRef = this.componentFactoryResolver.resolveComponentFactory(CouponPopupComponent).create(this.injector);

        this.applicationRef.attachView(this.componentRef.hostView);
  
        const domElem = (this.componentRef.hostView as EmbeddedViewRef<any>).rootNodes[0] as HTMLElement;
  
        document.body.appendChild(domElem);
        return this.componentRef;
      }
      return this.componentRef;
    }
  
    removeComponentFromBody() {
     

    if(this.componentRef !==null){
      this.applicationRef.detachView(this.componentRef.hostView);
      this.componentRef.destroy();
      this.componentRef = null;
      }
    }
  }
  