Improve saga/actions/api interations

embark-ui/src/actions/index.js

@@ -1,10 +1,33 @@
 // Accounts
-export const FETCH_ACCOUNTS = 'FETCH_ACCOUNTS';
+export const REQUEST = 'REQUEST';
-export const RECEIVE_ACCOUNTS = 'RECEIVE_ACCOUNTS';
+export const SUCCESS = 'SUCCESS';
-export const RECEIVE_ACCOUNTS_ERROR = 'RECEIVE_ACCOUNTS_ERROR';
+export const FAILURE = 'FAILURE';
-export const FETCH_ACCOUNT = 'FETCH_ACCOUNT';
+
-export const RECEIVE_ACCOUNT = 'RECEIVE_ACCOUNT';
+function createRequestTypes(base) {
-export const RECEIVE_ACCOUNT_ERROR = 'RECEIVE_ACCOUNT_ERROR';
+  return [REQUEST, SUCCESS, FAILURE].reduce((acc, type) => {
+    acc[type] = `${base}_${type}`;
+    return acc;
+  }, {});
+}
+
+function action(type, payload = {}) {
+  return {type, ...payload};
+}
+
+export const ACCOUNTS = createRequestTypes('ACCOUNTS');
+export const accounts = {
+  request: () => action(ACCOUNTS[REQUEST]),
+  success: (accounts) => action(ACCOUNTS[SUCCESS], {accounts}),
+  failure: (error) => action(ACCOUNTS[FAILURE], {error})
+};
+
+export const ACCOUNT = createRequestTypes('ACCOUNT');
+export const account = {
+  request: (address) => action(ACCOUNT[REQUEST], {address}),
+  success: (account) => action(ACCOUNT[SUCCESS], {account}),
+  failure: (error) => action(ACCOUNT[FAILURE], {error})
+};
+
 // Processes
 export const FETCH_PROCESSES = 'FETCH_PROCESSES';
 export const RECEIVE_PROCESSES = 'RECEIVE_PROCESSES';
@@ -32,45 +55,6 @@ export const RECEIVE_TRANSACTION_ERROR = 'RECEIVE_TRANSACTION_ERROR';
 // BlockHeader
 export const INIT_BLOCK_HEADER = 'INIT_BLOCK_HEADER';
 
-export function fetchAccounts() {
-  return {
-    type: FETCH_ACCOUNTS
-  };
-}
-
-export function receiveAccounts(accounts) {
-  return {
-    type: RECEIVE_ACCOUNTS,
-    accounts
-  };
-}
-
-export function receiveAccountsError() {
-  return {
-    type: RECEIVE_ACCOUNTS_ERROR
-  };
-}
-
-export function fetchAccount(address) {
-  return {
-    type: FETCH_ACCOUNT,
-    address
-  };
-}
-
-export function receiveAccount(account) {
-  return {
-    type: RECEIVE_ACCOUNT,
-    account
-  };
-}
-
-export function receiveAccountError() {
-  return {
-    type: RECEIVE_ACCOUNT_ERROR
-  };
-}
-
 export function fetchProcesses() {
   return {
     type: FETCH_PROCESSES

embark-ui/src/api/index.js

@@ -1,12 +1,22 @@
 import axios from "axios";
 import constants from '../constants';
 
-export function fetchAccounts() {
+
-  return axios.get(`${constants.httpEndpoint}/blockchain/accounts`);
+function get(path, params) {
+  return axios.get(constants.httpEndpoint + path, params)
+    .then((response) => {
+      return {response};
+    }).catch((error) => {
+      return {response: null, error: error.message || 'Something bad happened'};
+    });
 }
 
-export function fetchAccount(address) {
+export function fetchAccounts() {
-  return axios.get(`${constants.httpEndpoint}/blockchain/accounts/${address}`);
+  return get('/blockchain/accounts');
+}
+
+export function fetchAccount(payload) {
+  return get(`/blockchain/accounts/${payload.address}`);
 }
 
 export function fetchBlocks(from) {

embark-ui/src/containers/AccountContainer.js

@@ -3,7 +3,7 @@ import {connect} from 'react-redux';
 import PropTypes from 'prop-types';
 import {withRouter} from 'react-router-dom';
 
-import {fetchAccount} from '../actions';
+import {account as accountAction} from '../actions';
 import Account from '../components/Account';
 import NoMatch from "../components/NoMatch";
 import Transactions from '../components/Transactions';
@@ -44,6 +44,6 @@ AccountContainer.propTypes = {
 export default withRouter(connect(
   mapStateToProps,
   {
-    fetchAccount
+    fetchAccount: accountAction.request
   }
 )(AccountContainer));

embark-ui/src/containers/AccountsContainer.js

@@ -2,7 +2,7 @@ import React, {Component} from 'react';
 import {connect} from 'react-redux';
 import PropTypes from 'prop-types';
 
-import {fetchAccounts} from '../actions';
+import {accounts as accountsAction} from '../actions';
 import Accounts from '../components/Accounts';
 import Loading from '../components/Loading';
 
@@ -43,6 +43,6 @@ AccountsContainer.propTypes = {
 export default connect(
   mapStateToProps,
   {
-    fetchAccounts
+    fetchAccounts: accountsAction.request
   },
 )(AccountsContainer);

embark-ui/src/reducers/accountsReducer.js

@@ -1,4 +1,4 @@
-import {RECEIVE_ACCOUNTS, RECEIVE_ACCOUNTS_ERROR, RECEIVE_ACCOUNT, RECEIVE_ACCOUNT_ERROR} from "../actions";
+import * as actions from "../actions";
 
 function filterAccount(account, index, self) {
   return index === self.findIndex((a) => a.address === account.address);
@@ -6,19 +6,19 @@ function filterAccount(account, index, self) {
 
 export default function accounts(state = {}, action) {
   switch (action.type) {
-    case RECEIVE_ACCOUNTS:
+    case actions.ACCOUNTS[actions.SUCCESS]:
       return {
         ...state, data: [...action.accounts.data, ...state.data || []]
           .filter(filterAccount)
       };
-    case RECEIVE_ACCOUNTS_ERROR:
+    case actions.ACCOUNTS[actions.FAILURE]:
       return Object.assign({}, state, {error: true});
-    case RECEIVE_ACCOUNT:
+    case actions.ACCOUNT[actions.SUCCESS]:
       return {
         ...state, data: [action.account.data, ...state.data || []]
           .filter(filterAccount)
       };
-    case RECEIVE_ACCOUNT_ERROR:
+    case actions.ACCOUNT[actions.FAILURE]:
       return Object.assign({}, state, {error: true});
     default:
       return state;

embark-ui/src/sagas/index.js

@@ -3,6 +3,20 @@ import * as api from '../api';
 import {eventChannel} from 'redux-saga';
 import {all, call, fork, put, takeEvery, take} from 'redux-saga/effects';
 
+const {account, accounts} = actions;
+
+function *fetchEntity(entity, apiFn, id) {
+  const {response, error} = yield call(apiFn, id);
+  if(response) {
+    yield put(entity.success(response));
+  } else {
+    yield put(entity.failure(error));
+  }
+}
+
+export const fetchAccount = fetchEntity.bind(null, account, api.fetchAccount);
+export const fetchAccounts = fetchEntity.bind(null, accounts, api.fetchAccounts);
+
 export function *fetchTransaction(payload) {
   try {
     const transaction = yield call(api.fetchTransaction, payload.hash);
@@ -55,30 +69,12 @@ export function *watchFetchBlocks() {
   yield takeEvery(actions.FETCH_BLOCKS, fetchBlocks);
 }
 
-export function *fetchAccount(payload) {
-  try {
-    const account = yield call(api.fetchAccount, payload.address);
-    yield put(actions.receiveAccount(account));
-  } catch (e) {
-    yield put(actions.receiveAccountError());
-  }
-}
-
 export function *watchFetchAccount() {
-  yield takeEvery(actions.FETCH_ACCOUNT, fetchAccount);
+  yield takeEvery(actions.ACCOUNT[actions.REQUEST], fetchAccount);
-}
-
-export function *fetchAccounts() {
-  try {
-    const accounts = yield call(api.fetchAccounts);
-    yield put(actions.receiveAccounts(accounts));
-  } catch (e) {
-    yield put(actions.receiveAccountsError());
-  }
 }
 
 export function *watchFetchAccounts() {
-  yield takeEvery(actions.FETCH_ACCOUNTS, fetchAccounts);
+  yield takeEvery(actions.ACCOUNTS[actions.REQUEST], fetchAccounts);
 }
 
 export function *fetchProcesses() {

lib/modules/blockchain_connector/index.js

@@ -403,7 +403,7 @@ class BlockchainConnector {
         self.getAccountsWithTransactionCount((accounts) => {
           let account = accounts.find((a) => a.address === address);
           if(!account) {
-            next("No account found with this address");
+            return next("No account found with this address");
           }
           next(null, account);
         });