Follow

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use
Contact

How to replace facade code in ngrx effects Angular?

I am calling facade methods inside the ngrx effects but I have read that it is not a good practice. I would like to know how can I resolve it.

My code is given below:

**My Effects code :
**

MEDevel.com: Open-source for Healthcare and Education

Collecting and validating open-source software for healthcare, education, enterprise, development, medical imaging, medical records, and digital pathology.

Visit Medevel

closeCountSuccess$ = createEffect(() =>
    this.actions$.pipe(
      ofType(CountActions.CountActionTypes.CLOSE_COUNT_SUCCESS),
      switchMap((action: fromActions.CountSuccess) => {
        this.facade.resetCountList();
        this.facade.setPageNumber({ pageNumber: 0 });
        this.facade.fetchCountList({ page: 0, size: 20 });
        this.facade.setCount();
        this.openSimpleSnackbar(
          this.translateService.instant('content.count-is-successfully-closed'),
          5000,
          G3SnackType.Success
        );
        return of(new fromActions.WizardCloseDialog());
      })
    )
  );

My Facade code:

import { Injectable } from '@angular/core';

import { Observable } from 'rxjs';

import { Store } from '@ngrx/store';

import * as detailsActions from '../../count-details/store/count-details.actions';
import * as actions from '../../count-list/store/count-list.actions';
import { CountDef, CurrentBalanceResponseDef } from '../../shared/interfaces/current-balance-def.interface';
import * as fromActions from './count.actions';
import * as fromSelectors from './count.selectors';
import { CountState } from './count.state';

@Injectable({ providedIn: 'root' })
export class CountFacade {
  constructor(private store$: Store<CountState>) {}

  openDialog(): void {
    this.store$.dispatch(new fromActions.WizardOpenDialog());
  }

  closeDialog(): void {
    this.store$.dispatch(new fromActions.WizardCloseDialog());
  }

  getDialogOpened$(): Observable<boolean> {
    return this.store$.select(fromSelectors.isOpened);
  }



  fetchCountList({ page, size }) {
    this.store$.dispatch(new actions.GetCountListRequest({ page: page, size: size }));
  }

  resetCountList() {
    this.store$.dispatch(new actions.Reset());
  }

  setPageNumber({ pageNumber }): void {
    this.store$.dispatch(new actions.SetPageNumber({ pageNumber: pageNumber }));
  }

  setCurrentCount(): void {
    this.store$.dispatch(new detailsActions.SetCurrentCountRequest());
  }
}

If you know how it can be done in better way then please let me know.

>Solution :

It can be done as follow:

import * as CountListActions from '../../count-list/store/count-list.actions';
import * as CountDetailsActions from '../../count-details/store/count-details.actions';

closeCountSuccess$ = createEffect(() =>
    this.actions$.pipe(
      ofType(CountActions.CountActionTypes.CLOSE_COUNT_SUCCESS),
      switchMap((_: fromActions.CloseCountSuccess) => {
        this.openSimpleSnackbar(
          this.translateService.instant('content.count-is-successfully-closed'),
          5000,
          G3SnackType.Success
        );
        return of(
          new CountActions.WizardCloseDialog(),
          new CountListActions.SetPageNumber({ pageNumber: 0 }),
          new CountListActions.GetCashClosingListRequest({ page: '0', size: '20' }),
          new CountDetailsActions.SetCurrentCountRequest()
        );
      })
    )
  );
Add a comment

Leave a Reply

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use

Discover more from Dev solutions

Subscribe now to keep reading and get access to the full archive.

Continue reading