Can't resolve all parameters for AddPassModal: (?, ?, ?)

I am getting the error Can't resolve all parameters for AddPassModal: (?, ?).

I have tried some solution I have found on Stack overflow, but none seem to work. This is for adding ng2-semantic-ui Component based https://edcarroll.github.io/ng2-semantic-ui/#/modules/modal

I can get the code to work fine. but he test fail when using the helper class.

here is the code in the ts file

export class PassesComponent implements OnInit {
    constructor(public modal:SuiModal<IAddPassModalContext, void, void>,
        public gu:GetUsersService, public formatDate:DateService, public policyService:PolicyService) {
  }
}

export class AddPassModal extends ComponentModalConfig<IAddPassModalContext, void, void> {
    constructor(title:string, question:string, size:ModalSize = ModalSize.Small) {
        super(PassesComponent, { title, question });

        this.isClosable = false;
        this.transitionDuration = 200;
        this.size = size;
    }
}

this is the test file that is giving me a error Can't resolve all parameters for AddPassModal: (?, ?).

interface IAddPassModalContext {
  title:string;
  question:string;
}


beforeEach(async(() => {
    TestBed.configureTestingModule({ 
      imports: [
        HttpClientModule,
        FormsModule,
        ReactiveFormsModule,
        SuiModule       
      ],
      declarations: [ PassesComponent ,
        GuestComponent],
      schemas: [CUSTOM_ELEMENTS_SCHEMA],
      providers: [AddPassModal]
    })
    .compileComponents();
  }));

beforeEach(() => {
    fixture = TestBed.createComponent(PassesComponent);
    component = fixture.componentInstance;
    //mocAdd = new MocAddPassModal("test","test",ModalSize.Small);
    fixture.detectChanges();
  });

per some examples on GH, I have tried this.

interface IAddPassModalContext {
  title:string;
  question:string;
}


class MocAddPassModal extends ComponentModalConfig<IAddPassModalContext, void, void> {
    constructor(title:string = "", question:string = "") {
        super(PassesComponent, { title, question });
    }
}



describe('PassesComponent', () => {
  let component: PassesComponent;
  let fixture: ComponentFixture<PassesComponent>;
  let mocAdd: MocAddPassModal = new MocAddPassModal("test","test");


  beforeEach(async(() => {
    TestBed.configureTestingModule({ 
      imports: [
        HttpClientModule,
        FormsModule,
        ReactiveFormsModule,
        SuiModule       
      ],
      declarations: [ PassesComponent ,
        GuestComponent],
      schemas: [CUSTOM_ELEMENTS_SCHEMA],
      providers: [AddPassModal, { provide: PassesComponent, useObject:mocAdd}]
    })
    .compileComponents();
  }));

  beforeEach(() => {
    fixture = TestBed.createComponent(PassesComponent);
    component = fixture.componentInstance;
    mocAdd = new MocAddPassModal("test","test");
    fixture.detectChanges();
  });

   afterEach(() => {
    mocAdd = null;
  });

  it('should create', () => {
    expect(component).toBeTruthy();
  });
});

did not work. Please help. Thanks