eth.effects.ts

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

import { Effect, Actions, ofType } from '@ngrx/effects';
import { Action } from '@ngrx/store';
import { Observable, of, from } from 'rxjs';
import {exhaustMap, switchMap, map, tap, catchError } from 'rxjs/operators';

import { WEB3, SmartContract } from '../services/tokens';
import Web3 from 'web3';
import {TruffleContract} from 'truffle-contract';

import { EthService } from './eth.services';
import * as fromAction from './eth.actions';

@Injectable()
export class EthEffects {
  constructor(
    private actions$: Actions<fromAction.EthActionsUnion>,
    @Inject(WEB3) private web3: Web3,
    @Inject(SmartContract) private smartContract: TruffleContract,
    private ethSrv: EthService) {}
 
  @Effect()
  InitEther$ = this.actions$.pipe(
    ofType(fromAction.ActionTypes.INIT_ETH),
    exhaustMap((action: fromAction.InitEth) => {

      if ('enable' in this.web3.currentProvider) {
      
      /*
       based on https://medium.com/metamask/https-medium-com-metamask-breaking-change-injecting-web3-7722797916a8
       request access to user accounts by calling the enable() on the provider
      */
        return from(this.web3.currentProvider.enable()).pipe(
          tap((ethAccounts: string[]) =>
            console.log('User granted access Ethereum provider to user accounts', ethAccounts)
          ),
      
          switchMap((ethAccounts: string[]) => {

            if (ethAccounts.length === 0) {
              return [new fromAction.EthError(new Error('Can not get any user accounts'))];
            }

            // set default account
            this.ethSrv.defaultAccount = ethAccounts[0];

            // set the provider for the smart contract
            this.smartContract.setProvider(this.web3.currentProvider);

            // dispatch multiple actions at ones
            return  [
                new fromAction.InitEthSuccess(),
                new fromAction.GetAccountsSuccess(ethAccounts),
                new fromAction.SetDefaultAccountSuccess(ethAccounts[0])
              ];

          }),

          //User denied account access...
          catchError((err: any) => of(new fromAction.EthError(err)))
        );
      }
    })
  );

  @Effect()
    GetAccounts$: Observable<Action> = this.actions$.pipe(
      ofType(fromAction.ActionTypes.GET_ACCOUNTS),
      switchMap(() => this.ethSrv.getAccounts().pipe(
            map((accounts: string[]) => new fromAction.GetAccountsSuccess(accounts)),
            catchError(err => of(new fromAction.EthError(err)))
          )),

        );

  @Effect()
    SetDefaultAccount$ = this.actions$.pipe(
      ofType(fromAction.ActionTypes.SET_DEFAULT_ACCOUNT),
      map((action: fromAction.SetDefaultAccount) => {

         this.ethSrv.defaultAccount = action.payload;

         return new fromAction.SetDefaultAccountSuccess(action.payload);
      })
   );

  @Effect()
  GetAccountBalance$: Observable<Action> = this.actions$.pipe(
    ofType(fromAction.ActionTypes.GET_CURRENT_BALANCE),
    switchMap(() => this.ethSrv.getAccountBalance().pipe(
          map((balance: string) => new fromAction.GetAccountBalanceSuccess(balance)),
          catchError(err => of(new fromAction.EthError(err)))
        )),

      );
}