removing accounts

src/actions/accounts.js

-import { ADD_ACCOUNT, SELECT_ACCOUNT } from '../constants/AccountActions'
+import { ADD_ACCOUNT, SELECT_ACCOUNT, DELETE_ACCOUNT } from '../constants/AccountActions'
 
 export function addAccount(account) {
   return {
@@ -13,3 +13,10 @@ export function selectAccount(account) {
     account,
   }
 }
+
+export function deleteAccount(account) {
+  return {
+    type: DELETE_ACCOUNT,
+    account,
+  }
+}

src/components/AccountDetails.js

@@ -7,12 +7,34 @@ export default class AccountDetails extends Component {
   static propTypes = {
     account: PropTypes.shape({
       address: PropTypes.string.isRequired,
-    }).isRequired
+    }).isRequired,
+    onSendTransactionPressed: PropTypes.func.isRequired,
+    onDeleteAccountPressed: PropTypes.func.isRequired,
   }
 
   render() {
     return (
       <View style={styles.view}>
+        <Text style={styles.text}>Name</Text>
+        <Text style={styles.props}>{this.props.account.name ? this.props.account.name : 'no name'}</Text>
+        <Text style={styles.text}>Address</Text>
+        <Text style={styles.props}>{this.props.account.address}</Text>
+        <View style={styles.buttonContainer}>
+          <Button
+            style={styles.button}
+            onPress={this.props.onSendTransactionPressed}
+            title='Send Transaction'
+            color='green'
+            accessibilityLabel='Press to send new transaction'
+          />
+          <Button
+            style={styles.button}
+            onPress={() => this.props.onDeleteAccountPressed(this.props.account)}
+            title='Delete'
+            color='red'
+            accessibilityLabel='Press to delete account'
+          />
+        </View>
       </View>
     )
   }
@@ -24,5 +46,19 @@ const styles = StyleSheet.create({
     marginTop: 60,
     marginBottom: 50,
     padding: 20,
+  },
+  text: {
+    marginBottom: 20,
+  },
+  props: {
+    marginBottom: 20,
+    fontSize: 16,
+  },
+  buttonContainer: {
+    flexDirection: 'row',
+    justifyContent: 'space-between'
+  },
+  button: {
+    flex: 0.5,
   }
 })

src/components/AccountsList.js

+'use strict'
+
 import React, { Component, PropTypes } from 'react'
-import { Text, StyleSheet, ListView, RecyclerViewBackedScrollView } from 'react-native'
+import { Text, StyleSheet, ListView, RecyclerViewBackedScrollView, StatusBar } from 'react-native'
 import AccountsListRow from './AccountsListRow'
 
 export default class AccountsList extends Component {
@@ -39,7 +41,9 @@ export default class AccountsList extends Component {
         }}
         enableEmptySections={true}
         renderScrollComponent={props => <RecyclerViewBackedScrollView {...props} />}
-      />
+      >
+        <StatusBar barStyle='light-content'/>
+      </ListView>
     )
   }
 }

src/components/App.js

@@ -30,7 +30,6 @@ const styles = StyleSheet.create({
 const scenes = Actions.create(
   <Scene key='root'>
     <Scene key='tabs' tabs style={styles.tabbar}>
-      <Scene key='send' component={Send} title='Send TX' icon={TabIcon} navigationBarStyle={styles.navibar} titleStyle={styles.navibarTitle}/>
       <Scene key='mid' title='Scan QR' initial icon={TabIcon} navigationBarStyle={styles.navibar} titleStyle={styles.navibarTitle}>
         <Scene key='scan' component={QrScanner} title='Scan QR'/>
         <Scene key='signer' component={Signer} title='Sign Tx'/>
@@ -40,6 +39,7 @@ const scenes = Actions.create(
           rightButtonTextStyle={styles.navibarTitle}/>
         <Scene key='add' component={NewAccount} title='Add Account'/>
         <Scene key='details' component={Account} title='Account Details'/>
+        <Scene key='send' component={Send} title='Send TX'/>
       </Scene>
     </Scene>
   </Scene>

src/components/NewAccountInput.js

@@ -39,7 +39,7 @@ export default class NewAccountInput extends Component {
 
 const styles = StyleSheet.create({
   input: {
-    height: 200,
+    height: 120,
     fontWeight: 'bold'
   },
 })

src/components/Scanner.js

 'use strict';
 
 import React, { Component, PropTypes } from 'react'
-import { StyleSheet, View } from 'react-native'
+import { StyleSheet, View, StatusBar } from 'react-native'
 import Camera from 'react-native-camera';
 
 export default class Scanner extends Component {
@@ -12,6 +12,7 @@ export default class Scanner extends Component {
   render() {
     return (
       <Camera onBarCodeRead={this.props.onBarCodeRead} style={styles.view}>
+        <StatusBar barStyle='light-content'/>
         <View style={styles.rectangleContainer}>
           <View style={styles.rectangle}/>
         </View>

src/components/Send.js

 'use strict'
 
 import React, { Component, PropTypes } from 'react'
-import { StyleSheet, View, Text, TextInput, Button, StatusBar } from 'react-native'
+import { StyleSheet, View, Text, TextInput, Button } from 'react-native'
 
 export default class Send extends Component {
   render() {
     return (
       <View style={styles.view}>
-        <StatusBar barStyle='light-content'/>
         <Text style={styles.hint}>recipient address</Text>
         <TextInput
           placeholder='the recipient address'

src/constants/AccountActions.js

 export const ADD_ACCOUNT = 'ACCOUNT_ACTION_ADD_ACCOUNT'
 export const SELECT_ACCOUNT = 'ACCOUNT_ACTION_SELECT_ACCOUNT'
+export const DELETE_ACCOUNT = 'ACCOUNT_ACTION_DELETE_ACCOUNT'

src/containers/Account.js

 import React from 'react'
 import { connect } from 'react-redux'
+import { Actions } from 'react-native-router-flux'
 import AccountDetails from '../components/AccountDetails'
+import { deleteAccount } from '../actions/accounts'
+
+const mapDispatchToProps = (dispatch, ownProps) => ({
+  onSendTransactionPressed: () => {
+    Actions.send()
+  },
+  onDeleteAccountPressed: (account) => {
+    dispatch(deleteAccount(account))
+    Actions.pop()
+  },
+})
 
 const Account = connect(state => ({
   account: state.accounts.selected.address,
-}))(AccountDetails)
+}), mapDispatchToProps)(AccountDetails)
 
 export default Account

src/reducers/accounts.js

-import { ADD_ACCOUNT, SELECT_ACCOUNT } from '../constants/AccountActions'
+import { ADD_ACCOUNT, SELECT_ACCOUNT, DELETE_ACCOUNT } from '../constants/AccountActions'
 
 const initialAccounts = {
   all: [{
@@ -26,7 +26,12 @@ export default function accounts(state = initialAccounts, action) {
         selected: action.account,
       })
 
-      default:
-        return state
+    case DELETE_ACCOUNT:
+      return Object.assign({}, state, {
+        all: state.all.filter((account) => { return action.account != account })
+      })
+
+    default:
+      return state
   }
 }