Home > Net >  How to replace facade code in ngrx effects Angular?
How to replace facade code in ngrx effects Angular?

Time:10-26

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 : **

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.

CodePudding user response:

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()
        );
      })
    )
  );
  • Related