contact name and addres refactored out to global and not local state

ChainSafe · Sep 29, 2018 · a7bbfe5 · a7bbfe5
1 parent ccfa7c0
commit a7bbfe5
Show file tree

Hide file tree

Showing 6 changed files with 109 additions and 30 deletions.
diff --git a/src/actions/actionCreators/Contacts.js b/src/actions/actionCreators/Contacts.js
@@ -1,8 +1,30 @@
-// import {
-//   SET_ACTIVE_CONTACT_TAB,
-//   UPDATE_WALLET_CONTACTS,
-//   INITIALIZE_WALLET_CONTACTS,
-//   SET_CONTACT_ADDRESS,
-//   INITIALIZE_CONTACT_TOKENS,
-//   SET_TEMPORARY_QR_ADDRESS
-// } from "../actionTypes/ContactTypes";
+import {
+  SET_ACTIVE_CONTACT_TAB,
+  UPDATE_WALLET_CONTACTS,
+  SET_TEMP_CONTACT_NAME,
+  INITIALIZE_WALLET_CONTACTS,
+  SET_CONTACT_ETHEREUM_ADDRESS,
+  INITIALIZE_CONTACT_TOKENS,
+} from '../actionTypes/ContactTypes';
+
+import {
+  SET_TEMPORARY_QR_ADDRESS,
+} from '../actionTypes/AppConfigTypes';
+
+export function setContactTabState(tabText) {
+    return (dispatch) => {
+      dispatch({ type:   SET_ACTIVE_CONTACT_TAB, payload: tabText });
+    };
+  }
+
+  export function setContactTempName(name) {
+    return (dispatch) => {
+      dispatch({ type: SET_TEMP_CONTACT_NAME, payload: name });
+    };
+  }
+
+  export function setContactEthereumAddress(address) {
+    return (dispatch) => {
+      dispatch({ type: SET_CONTACT_ETHEREUM_ADDRESS, payload: address });
+    };
+  }
diff --git a/src/actions/actionTypes/ContactTypes.js b/src/actions/actionTypes/ContactTypes.js
@@ -1,5 +1,11 @@
+/**
+ * Contact related action types
+ */
 export const SET_ACTIVE_CONTACT_TAB = 'SET_ACTIVE_CONTACT_TAB';
 export const UPDATE_WALLET_CONTACTS = 'UPDATE_WALLET_CONTACTS';
-export const INITIALIZE_WALLET_CONTACTS = 'INITIALIZE_WALLET_CONTACT';
-export const SET_CONTACT_ADDRESS = 'SET_CONTACT_ADDRESS';
+export const SET_TEMP_CONTACT_NAME = 'SET_TEMP_CONTACT_NAME';
+export const INITIALIZE_WALLET_CONTACTS = ' INITIALIZE_WALLET_CONTACTS';
+export const SET_CONTACT_ETHEREUM_ADDRESS = 'SET_CONTACT_ETHEREUM_ADDRESS';
 export const INITIALIZE_CONTACT_TOKENS = 'INITIALIZE_CONTACT_TOKENS';
+
+
diff --git a/src/reducers/wallet/Wallet.js b/src/reducers/wallet/Wallet.js
@@ -15,14 +15,24 @@ import {
   INITIALIZE_NEW_APP_WALLET,
 } from '../../actions/actionTypes/AppConfigTypes';
 
+import {
+  SET_TEMP_CONTACT_NAME,
+  SET_CONTACT_ETHEREUM_ADDRESS,
+} from '../../actions/actionTypes/ContactTypes';
+
+
+import tokenData from '../../constants/data/json/tokens.json';
+
 const initialState = {
   wallets: [],
   contacts: [], //temp array to to pass to wallets
   tempContactName: null, //store the temp name for create/modify
   tempContactTokens: [], //store the temporary list of tokens for the contact
+  tempContactAddress: null,
   selectedContactTab: 'contacts', //default to contacts
   tempWalletName: null,
   tokens: [],
+  lookUpTokenList: tokenData,
   walletBalance: {},
   tokenBalances: {},
   walletTokens: [],
@@ -73,10 +83,22 @@ export default function (state = initialState, action) {
         ...state, isFetching: false, hasError: true, errorMessage: action.err,
       };
     case SET_WALLET_TOKENS_BALANCES:
-      return { ...state, walletTokens: action.payload };
+      return {
+        ...state, walletTokens: action.payload,
+      };
     case CALCULATE_WALLET_BALANCE:
-      const { walletBalanceObject, individualTokens } = action.payload;
-      return { ...state, walletBalance: walletBalanceObject, tokenBalances: individualTokens };
+      const {walletBalanceObject, individualTokens } = action.payload;
+      return {
+        ...state, walletBalance: walletBalanceObject, tokenBalances: individualTokens,
+      };
+    case SET_TEMP_CONTACT_NAME:
+      return {
+        ...state, tempContactName: action.payload,
+      }
+    case SET_CONTACT_ETHEREUM_ADDRESS:
+    return {
+      ...state, tempContactAddress: action.payload,
+     }
     default:
       return state;
   }

diff --git a/src/screens/main/menu/contacts/add/AddContact.js b/src/screens/main/menu/contacts/add/AddContact.js
@@ -11,11 +11,25 @@ import * as actions from '../../../../../actions/ActionCreator';
 import LinearButton from '../../../../../components/LinearGradient/LinearButton';
 import ClearButton from '../../../../../components/LinearGradient/ClearButton';
 import BoxShadowCard from '../../../../../components/ShadowCards/BoxShadowCard';
-import barcode from '../../../../../assets/icons/barcode.png';
+import { setContactTempName, setContactTabState, setContactEthereumAddress } from '../../../../../actions/actionCreators/Contacts';
 
 
+/**
+ * Is a full screen react component
+ * This screen is used to add a new contact to the wallet contact list.
+ *
+ */
 class AddContact extends Component {
+  /**
+   * Initializes the current token list stored in state as the datasource
+   * for the scrollListView.
+   * Also initializes the local state variable to keep track of the changes made to
+   * the text fields
+   * @param {Object} props
+   */
+
   constructor(props) {
+
     super(props);
     const ds = new ListView.DataSource({ rowHasChanged: (r1, r2) => { return r1 !== r2 ;} });
     const current = this.props.currentContact;
@@ -29,6 +43,7 @@ class AddContact extends Component {
       tokenName.label = token.name;
       tokenName.img = token.logo.src;
       tokens.push(tokenName);
+      console.log('tokenName', tokenName);
     });
 
     this.state = {
@@ -113,7 +128,14 @@ class AddContact extends Component {
     this.setState({ tokenIMG: url });
   }
 
+  renderName(name) {
+    this.props.setContactTempName(name);
+    this.setState({contactName: name})
+  }
+
   renderAddress(address) {
+    this.props.setContactEthereumAddress(address); //need to check validity and malicious
+    //old
     const copy = Object.assign({}, this.state.contactAddress);
     const copyIMG = Object.assign({}, this.state.tokenImages);
     copy[this.state.tokenName] = address;
@@ -123,6 +145,8 @@ class AddContact extends Component {
     this.setState({ tokenImages: copyIMG });
   }
 
+
+
   /**
    * Returns the form required to add a contact
    */
@@ -141,22 +165,24 @@ class AddContact extends Component {
               <View style={styles.topFormInput}>
                 <FormInput
                   placeholder={"Contact's Name"}
-                  onChangeText={(name) => { return this.setState({ contactName: name }); }}
+                  onChangeText={(name) => { this.renderName(name) } }
                   inputStyle={styles.inputContactName}
                   placeholderTextColor={'#b3b3b3'}
-                  value={this.state.contactName}
+                  value={this.props.tempContactName}
                 />
               </View>
+
               <View style={styles.inputAddressContainer}>
                 <FormInput
                   placeholder={'Ethereum Address'}
-                  onChangeText={ (address) => { return this.renderAddress(address) ;}}
+                  onChangeText={ (address) => { return this.renderAddress(address)}}
                   inputStyle={styles.inputAddressText}
                   placeholderTextColor={'#b3b3b3'}
-                  value={this.state.contactAddress[this.state.tokenName]}
-                  editable={!!this.state.tokenName}
+                  // value={this.state.contactAddress[this.state.tokenName]}
+                  value={this.props.tempContactAddress}                 
                 />
               </View>
+
               <View style={styles.barcodeContainer}>
                 <TouchableOpacity onPress={() => { return this.navigate(); }}>
                   <Image
@@ -181,8 +207,7 @@ class AddContact extends Component {
                     this.inputRefs.picker = el;
                   }}
                 />
-              </View>
-
+              </View>           
               <TouchableOpacity
                 style={styles.addAnotherText}
                 onPress={this.addAnotherCoinAddress.bind(this)}
@@ -210,7 +235,6 @@ class AddContact extends Component {
         </View>
       </SafeAreaView>
     );
-
   }
 }
 
@@ -268,12 +292,12 @@ const styles = StyleSheet.create({
     flex: 0.4,
     marginLeft: '9%',
     marginBottom: '2%',
-    marginTop: '10%',
+    marginTop: '5%',
     justifyContent: 'center',
   },
   barcodeImg: {
-    height: Dimensions.get('window').height * 0.1,
-    width: Dimensions.get('window').width * 0.18,
+    height: 45,
+    width: 45,
   },
   pickerContainer: {
     justifyContent: 'center',
@@ -375,12 +399,14 @@ const pickerStyle = {
  * @param {Object} state
  */
 
-const mapStateToProps = ({ contacts, newWallet }) => {
+const mapStateToProps = ({ contacts, Wallet }) => {
 
+  const { tempContactName, tokens, tempContactAddress } = Wallet;
   return {
-    tokens: newWallet.tokens,
-    currentContact: contacts.incompleteContactInputs,
+    tokens, tempContactName, tempContactAddress, currentContact: contacts.incompleteContactInputs,
   };
 };
 
-export default connect(mapStateToProps, actions)(AddContact);
+export default connect(mapStateToProps, {
+  actions, setContactTempName, setContactTabState, setContactEthereumAddress
+})(AddContact);
diff --git a/src/screens/main/tokens/add/Tokens.js b/src/screens/main/tokens/add/Tokens.js
@@ -2,7 +2,7 @@ import React, { Component } from 'react';
 import {
   View, StyleSheet, Dimensions, Text, SafeAreaView, RefreshControl,
 } from 'react-native';
-import { FormLabel, FormInput } from 'react-native-elements'
+import { FormLabel, FormInput } from 'react-native-elements';
 import SearchBar from 'react-native-material-design-searchbar';
 import { connect } from 'react-redux';
 import { NavigationActions } from 'react-navigation';

diff --git a/src/scripts/tokenConfig.js b/src/scripts/tokenConfig.js
@@ -19,6 +19,7 @@ const tokenConfiguration = (configFlag) => {
  */
 initialSetup = () => {
   let setupTokenList = [];
+  let tokenLookupObjectSet = [];
   tokenListJson.forEach((tokenObject) => {
     let token = new Token(tokenObject.symbol, tokenObject.address);
     token.index = tokenObject.id;
@@ -45,6 +46,8 @@ initialSetup = () => {
     token.youtube = tokenObject.social.youtube;
     setupTokenList.push(token);
   });
+
+
   return setupTokenList;
 };