diff --git a/src/actions/index.js b/src/actions/index.js index 408db40..802b7eb 100644 --- a/src/actions/index.js +++ b/src/actions/index.js @@ -6,6 +6,7 @@ export const ADD_NEW_ACCOUNT = 'ADD_NEW_ACCOUNT'; export const UPDATE_ACCOUNT = 'UPDATE_ACCOUNT'; export const UPDATE_ACCOUNT_BALANCE = 'UPDATE_ACCOUNT_BALANCE'; export const UPDATE_ACCOUNTS_ORDER = 'UPDATE_ACCOUNTS_ORDER'; +export const DELETE_ACCOUNT = 'DELETE_ACCOUNT'; export const SELECT_RECORD_TYPE = 'SELECT_RECORD_TYPE'; export const SELECT_RECORD_DATE = 'SELECT_RECORD_DATE'; export const UPDATE_DRAFT_WITH_RECORD = 'UPDATE_DRAFT_WITH_RECORD'; @@ -46,6 +47,10 @@ export function updateAccountsOrder( newOrder ) { return { type: UPDATE_ACCOUNTS_ORDER, newOrder }; } +export function deleteAccount( accountId ) { + return { type: DELETE_ACCOUNT, accountId }; +} + // Records / Drafts export function selectRecordType( id ) { diff --git a/src/components/AccountInfo.js b/src/components/AccountInfo.js index f6bb138..c8fd3cc 100644 --- a/src/components/AccountInfo.js +++ b/src/components/AccountInfo.js @@ -6,7 +6,7 @@ import { StyleSheet, ScrollView, Platform } from 'react-native'; import { ListItem, Input } from 'react-native-elements'; import PropTypes from 'prop-types'; -const AccountInfo = ( { navigate, onStateChange, name, balance, colorCode, iconName, currencyCode, onPressCurrency } ) => +const AccountInfo = ( { navigate, onStateChange, name, balance, colorCode, iconName, currencyCode, onPressCurrency, onDelete } ) => + + ; export default AccountInfo; diff --git a/src/reducers/accounts.js b/src/reducers/accounts.js index c3c10a5..9dae781 100644 --- a/src/reducers/accounts.js +++ b/src/reducers/accounts.js @@ -1,7 +1,7 @@ /** * Internal dependencies */ -import { ADD_NEW_ACCOUNT, UPDATE_ACCOUNTS_ORDER, UPDATE_ACCOUNT, UPDATE_ACCOUNT_BALANCE } from '../actions'; +import { ADD_NEW_ACCOUNT, UPDATE_ACCOUNTS_ORDER, UPDATE_ACCOUNT, UPDATE_ACCOUNT_BALANCE, DELETE_ACCOUNT } from '../actions'; import { addNewItem } from '../utils/reducerHelper'; const initialState = { @@ -33,19 +33,40 @@ export default function accounts( state = initialState, action ) { return addNewItem( account, state ); case UPDATE_ACCOUNT: return { + ...state, byId: { ...state.byId, [ account.id ]: account }, - allIds: [ ...state.allIds ], + // allIds: [ ...state.allIds ], }; case UPDATE_ACCOUNT_BALANCE: account.balance = action.newBalance; return { + ...state, byId: { ...state.byId, [ account.id ]: account }, - allIds: [ ...state.allIds ], - }; case UPDATE_ACCOUNTS_ORDER: + // allIds: [ ...state.allIds ], + }; + case UPDATE_ACCOUNTS_ORDER: return { ...state, allIds: action.newOrder, }; + case DELETE_ACCOUNT: + const byId = Object.values( state.byId ).reduce( ( acc, accnt ) => { + console.log( accnt.id, action.accountId, typeof accnt.id, typeof action.accountId, accnt.id !== action.accountId ); + + if ( accnt.id !== action.accountId ) { + acc[ accnt.id ] = state.byId[ accnt.id ]; + } + return acc; + }, {} ); + console.log( byId ); + + const updState = { + ...state, + byId, + }; + console.log( updState ); + + return updState; default: return state; } diff --git a/src/screens/NewAccountScreen.js b/src/screens/NewAccountScreen.js index babcdd7..3c7c9a9 100644 --- a/src/screens/NewAccountScreen.js +++ b/src/screens/NewAccountScreen.js @@ -2,13 +2,13 @@ * External dependencies */ import React from 'react'; -import { Button } from 'react-native'; +import { Button, Alert } from 'react-native'; import { connect } from 'react-redux'; /** * Internal dependencies */ -import { addNewAccount, updateAccount } from '../actions'; +import { addNewAccount, updateAccount, deleteAccount } from '../actions'; import AccountInfo from '../components/AccountInfo'; import { getCurrencyById, getAccountById } from '../selectors'; @@ -64,7 +64,7 @@ class NewAccountScreen extends React.Component { const account = { name, - balance, + balance: Number( balance ), colorCode, iconName, currencyId, @@ -86,6 +86,27 @@ class NewAccountScreen extends React.Component { } } + onDelete = () => { + const { isEdit, id } = this.state; + if ( ! isEdit ) { + return; + } + + Alert.alert( + 'Alert Title', + 'My Alert Msg', + [ + { + text: 'Cancel', + onPress: () => console.log( 'Cancel Pressed' ), + style: 'cancel', + }, + { text: 'OK', onPress: () => this.props._deleteAccount( id ) }, + ], + { cancelable: false }, + ); + } + render() { const { name, balance, colorCode, iconName, currencyId, isEdit } = this.state; const { navigation } = this.props; @@ -102,6 +123,7 @@ class NewAccountScreen extends React.Component { navigate={ navigation.navigate } onStateChange={ this.onStateChange } onPressCurrency={ this.onPressCurrency } + onDelete={ this.onDelete } /> ); } @@ -119,6 +141,7 @@ const mapDispatchToProps = ( dispatch ) => { return { _addNewAccount: ( account ) => dispatch( addNewAccount( account ) ), _updateAccount: ( account ) => dispatch( updateAccount( account ) ), + _deleteAccount: ( accountId ) => dispatch( deleteAccount( accountId ) ), }; };