diff --git a/js-frontend/src/actions/entities.js b/js-frontend/src/actions/entities.js index 2ee35da..5affcd5 100644 --- a/js-frontend/src/actions/entities.js +++ b/js-frontend/src/actions/entities.js @@ -10,11 +10,11 @@ export const entityRequested = makeActionCreator(T.ENTITIES.REQUESTED, 'id'); export const entityReceived = makeActionCreator(T.ENTITIES.RECEIVED, 'id', 'entity'); export const accountsListRequested = makeActionCreator(T.ACCOUNTS.LIST_START); -export const accountsListReceived = makeActionCreator(T.ACCOUNTS.LIST_COMPLETE, 'data'); +export const accountsListReceived = makeActionCreator(T.ACCOUNTS.LIST_COMPLETE, 'payload'); export const accountsListError = makeActionCreator(T.ACCOUNTS.LIST_ERROR, 'error'); //export const accountsRefListRequested = makeActionCreator(T.ACCOUNTS.LIST_REF_START, 'id'); -export const accountsRefListReceived = makeActionCreator(T.ACCOUNTS.LIST_REF_COMPLETE, 'data'); +export const accountsRefListReceived = makeActionCreator(T.ACCOUNTS.LIST_REF_COMPLETE, 'payload'); //export const accountsRefListError = makeActionCreator(T.ACCOUNTS.LIST_REF_ERROR, 'id'); export const accountCreateStart = makeActionCreator(T.ACCOUNTS.CREATE_START); @@ -60,4 +60,14 @@ export function accountCreate(customerId, payload) { }) }; +} + +export function fetchOwnAccounts(customerId) { + return dispatch => { + //dispatch(accountsListRequested()); + return api.apiRetrieveAccounts(customerId) + .then(data => { + dispatch(accountsListReceived(data)); + }); + }; } \ No newline at end of file diff --git a/js-frontend/src/reducers/data/accounts.js b/js-frontend/src/reducers/data/accounts.js index 88aceb6..704c9cc 100644 --- a/js-frontend/src/reducers/data/accounts.js +++ b/js-frontend/src/reducers/data/accounts.js @@ -7,28 +7,39 @@ import T from '../../constants/ACTION_TYPES'; import { combineReducers } from 'redux'; -const initialState = { - own: [], - other: [], - create: { - form: {}, - loading: false, - errors: {} - } -}; - -const nodeInitialState = { - loading: false, - data: {} -}; - const ownAccountsReducer = (state = [], action ) => { switch (action.type) { + case T.ACCOUNTS.LIST_COMPLETE: { + const { payload = [] } = action; + //const accounts = Object.keys(payload).map(key => payload[key]); + return [ + ...payload + ]; + } default: return state; } }; + const otherAccountsReducer = (state = [], action ) => { switch (action.type) { + case T.AUTH.AUTHENTICATE_COMPLETE: + case T.AUTH.SIGN_IN_COMPLETE: { + const { user } = action; + const { toAccounts = [] } = user; + return otherAccountsReducer(state, { + type: T.ACCOUNTS.LIST_REF_COMPLETE, + payload: toAccounts + }); + } + + case T.ACCOUNTS.LIST_REF_COMPLETE: { + const { payload = {} } = action; + const accounts = Object.keys(payload).map(key => ((payload[key].id = payload[key].accountId), payload[key])); + return [ + ...accounts + ]; + } + default: return state; } }; diff --git a/js-frontend/src/reducers/data/entities.js b/js-frontend/src/reducers/data/entities.js index f802222..92c596c 100644 --- a/js-frontend/src/reducers/data/entities.js +++ b/js-frontend/src/reducers/data/entities.js @@ -17,10 +17,7 @@ export const entities = (state = {...initialState}, action) => { const { id } = action; return { ...state, - [id]: { - ...nodeInitialState, - loading: true - } + [id]: null } } case T.ENTITIES.RECEIVED: { @@ -28,14 +25,33 @@ export const entities = (state = {...initialState}, action) => { return { ...state, [id]: { - ...(state[id] || nodeInitialState), - loading: false, - data: { - ...entity - } + ...entity } } } + + case T.AUTH.AUTHENTICATE_COMPLETE: + case T.AUTH.SIGN_IN_COMPLETE: + { + const { user } = action; + const { toAccounts = [] } = user; + return { + ...state, + ...toAccounts + }; + + } + case T.ACCOUNTS.LIST_COMPLETE: { + const { payload } = action; + const hashMap = payload.reduce((memo, item) => { + memo[item.accountId] = item; + return memo; + }, {}); + return { + ...state, + ...hashMap + }; + } case T.ENTITIES.RECEIVED_LIST: default: return state; diff --git a/js-frontend/src/utils/api.js b/js-frontend/src/utils/api.js index f8000e3..8b4cb37 100644 --- a/js-frontend/src/utils/api.js +++ b/js-frontend/src/utils/api.js @@ -66,7 +66,10 @@ export function apiCreateAccount(customerId, { } export function apiRetrieveAccounts(customerId) { - return fetch(getAccountsUrl(), { + + const params = {customerId }; + const query = Object.keys(params).map(key => [encodeURIComponent(key), encodeURIComponent(params[key])].join('=')).join('&') + return fetch(`${getAccountsUrl()}?${query}`, { headers: { "Accept": "application/json", "Content-Type": "application/json" diff --git a/js-frontend/src/views/MyAccounts.js b/js-frontend/src/views/MyAccounts.js index 6d3a36f..03b68a5 100644 --- a/js-frontend/src/views/MyAccounts.js +++ b/js-frontend/src/views/MyAccounts.js @@ -26,6 +26,13 @@ class MyAccounts extends React.Component { this.state = { ...resetModals }; } + componentWillMount() { + const { + id: customerId + } = this.props.auth.user.attributes; + this.props.dispatch(A.fetchOwnAccounts(customerId)); + } + createAccountModal() { this.setState({ showAccountModal: true @@ -41,7 +48,6 @@ class MyAccounts extends React.Component { this.props.dispatch(A.accountCreate(customerId, payload)) .then(this.close.bind(this)); - } create3rdPartyAccountModal() { @@ -105,18 +111,41 @@ class MyAccounts extends React.Component { const { showAccountModal, show3rdPartyAccountModal, showDeleteAccountModal } = this.state; const { accountToRemove = null } = this.state; - const refAccountsData = this.props.app.accounts.other || []; + const ownAccountsData = this.props.app.accounts.own || []; - const refAccounts = refAccountsData.map((item, idx) => ( - - ${item.title}{ - (item.description) ? [ + //accountId: "000001537c2cf075-a250093f26850000" + //balance: 0 + //description: null + //title: "Sample" + + const ownAccounts = ownAccountsData.map(({ + accountId, balance, description = '', title + }, idx) => ( + + { title }{ + (description) ? [ (
), - { item.description } + { description } + ]: null + } + ${ balance } + + )); + const refAccountsData = this.props.app.accounts.other || []; + const refAccounts = refAccountsData.map(({ + title, + description = '', + id + }, idx) => ( + + { title }{ + (description) ? [ + (
), + { description } ]: null } - + )); @@ -168,10 +197,7 @@ class MyAccounts extends React.Component { - - Account Title #1 - $100.00 - + { ownAccounts } { refAccounts } diff --git a/js-frontend/src/views/SignIn.js b/js-frontend/src/views/SignIn.js index 03e5d6a..1c8404b 100644 --- a/js-frontend/src/views/SignIn.js +++ b/js-frontend/src/views/SignIn.js @@ -6,6 +6,8 @@ import { PageHeader } from "react-bootstrap"; import { connect } from "react-redux"; //import ButtonLoader from "./ButtonLoader"; +import * as BS from "react-bootstrap"; +//import ButtonLoader from "../controls/bootstrap/ButtonLoader"; import {pushState} from "redux-router";