fixed transfer issues

src/screens/transfer/container/transferContainer.js

@@ -8,15 +8,10 @@ import {
   transferFromSavings,
   transferToSavings,
   transferToVesting,
+  getAccount,
 } from '../../../providers/steem/dsteem';
 import { toastNotification } from '../../../redux/actions/uiAction';
 
-// Middleware
-
-// Constants
-
-// Utilities
-
 // Component
 import TransferView from '../screen/transferScreen';
 
@@ -26,15 +21,35 @@ import TransferView from '../screen/transferScreen';
  *
  */
 
-class ExampleContainer extends Component {
+class TransferContainer extends Component {
   constructor(props) {
     super(props);
     this.state = {};
   }
 
   // Component Life Cycle Functions
+  componentDidMount() {
+    const { currentAccount: { name }, navigation } = this.props;
+
+    const balance = navigation.getParam('balance', '');
+
+    this.setState({ balance });
+
+
+    if (!balance) this.fetchBalance(name);
+  }
 
   // Component Functions
+
+  fetchBalance = (username) => {
+    getAccount(username)
+      .then((account) => {
+        const balance = account[0].balance.replace('STEEM', '');
+
+        this.setState({ balance: Number(balance) });
+      });
+  }
+
   _getAccountsWithUsername = async (username) => {
     const validUsers = await lookupAccounts(username);
     return validUsers;
@@ -92,15 +107,18 @@ class ExampleContainer extends Component {
   };
 
   render() {
-    const { accounts, currentAccount, navigation } = this.props;
+    const {
+      accounts, currentAccount, navigation, fetchBalance,
+    } = this.props;
+    const { balance } = this.state;
 
     const fundType = navigation.getParam('fundType', '');
-    const balance = navigation.getParam('balance', '');
     const transferType = navigation.getParam('transferType', '');
 
     return (
       <TransferView
         accounts={accounts}
+        fetchBalance={this.fetchBalance}
         getAccountsWithUsername={this._getAccountsWithUsername}
         transferToAccount={this._transferToAccount}
         handleOnModalClose={this._handleOnModalClose}
@@ -119,4 +137,4 @@ const mapStateToProps = state => ({
   pinCode: state.account.pin,
 });
 
-export default connect(mapStateToProps)(ExampleContainer);
+export default connect(mapStateToProps)(TransferContainer);

src/screens/transfer/screen/transferScreen.js

@@ -32,6 +32,7 @@ class TransferView extends Component {
       memo: '',
       isUsernameValid: false,
       steemConnectTransfer: false,
+      isTransfering: false,
     };
   }
 
@@ -52,7 +53,9 @@ class TransferView extends Component {
           this.setState({ [key]: value });
           break;
         case 'amount':
-          if (!isNaN(value) && parseFloat(value) <= parseFloat(balance)) this.setState({ [key]: value });
+          if ((parseFloat(Number(value)) <= parseFloat(balance))) {
+            this.setState({ [key]: value });
+          }
           break;
 
         default:
@@ -68,6 +71,8 @@ class TransferView extends Component {
       from, destination, amount, memo,
     } = this.state;
 
+    this.setState({ isTransfering: true });
+
     if (accountType === AUTH_TYPE.STEEM_CONNECT) {
       this.setState({ steemConnectTransfer: true });
     } else {
@@ -75,34 +80,58 @@ class TransferView extends Component {
     }
   };
 
-  _renderInput = (placeholder, state, keyboardType) => (
+  _handleOnAmountChange = (state, amount) => {
+    let _amount = amount;
+    if (_amount.includes(',')) {
+      _amount = amount.replace(',', '.');
+    }
+
+    this._setState(state, _amount);
+  }
+
+  _renderInput = (placeholder, state, keyboardType, isTextArea) => (
     <TextInput
-      style={styles.input}
-      onChangeText={text => this._setState(state, text)}
+      style={[isTextArea ? styles.textarea : styles.input]}
+      onChangeText={amount => this._handleOnAmountChange(state, amount)}
       value={this.state[state]}
       placeholder={placeholder}
       placeholderTextColor="#c1c5c7"
       autoCapitalize="none"
+      multiline={isTextArea}
+      numberOfLines={isTextArea ? 4 : 1}
       keyboardType={keyboardType}
     />
   );
 
   _renderDropdown = accounts => (
     <DropdownButton
+      dropdownButtonStyle={styles.dropdownButtonStyle}
+      rowTextStyle={styles.rowTextStyle}
       style={styles.dropdown}
+      dropdownStyle={styles.dropdownStyle}
+      textStyle={styles.dropdownText}
       options={accounts.map(item => item.username)}
       defaultText={accounts[0].username}
       selectedOptionIndex={0}
-      onSelect={(index, value) => this.setState({ from: value })}
+      onSelect={(index, value) => this._handleOnDropdownChange(value)}
     />
   );
 
+  _handleOnDropdownChange = (value) => {
+    const { fetchBalance } = this.props;
+
+    fetchBalance(value);
+    this.setState({ from: value });
+  }
+
   _renderDescription = text => <Text style={styles.description}>{text}</Text>;
 
   render() {
-    const { accounts, intl, handleOnModalClose, balance, fundType, transferType } = this.props;
     const {
-      destination, isUsernameValid, amount, steemConnectTransfer, memo,
+      accounts, intl, handleOnModalClose, balance, fundType, transferType,
+    } = this.props;
+    const {
+      destination, isUsernameValid, amount, steemConnectTransfer, memo, isTransfering,
     } = this.state;
 
     const path = `sign/transfer?from=${
@@ -148,7 +177,7 @@ class TransferView extends Component {
             />
             <TransferFormItem
               label={intl.formatMessage({ id: 'transfer.memo' })}
-              rightComponent={() => this._renderInput(intl.formatMessage({ id: 'transfer.memo_placeholder' }), 'memo', 'default')
+              rightComponent={() => this._renderInput(intl.formatMessage({ id: 'transfer.memo_placeholder' }), 'memo', 'default', true)
               }
             />
             <TransferFormItem
@@ -161,6 +190,7 @@ class TransferView extends Component {
               style={styles.button}
               isDisable={!(amount && isUsernameValid)}
               onPress={() => this.ActionSheet.show()}
+              isLoading={isTransfering}
             >
               <Text style={styles.buttonText}>NEXT</Text>
             </MainButton>

src/screens/transfer/screen/transferStyles.js

@@ -26,9 +26,19 @@ export default EStyleSheet.create({
   input: {
     borderWidth: 1,
     borderColor: '$borderColor',
-    borderRadius: 10,
+    borderRadius: 8,
     padding: 10,
     color: '$primaryBlack',
+    width: 172,
+  },
+  textarea: {
+    borderWidth: 1,
+    borderColor: '$borderColor',
+    borderRadius: 8,
+    padding: 10,
+    color: '$primaryBlack',
+    width: 172,
+    height: 75,
   },
   description: {
     color: '$iconColor',
@@ -42,16 +52,37 @@ export default EStyleSheet.create({
   buttonText: {
     color: 'white',
   },
-  dropdown: {
-    borderWidth: 1,
-    borderColor: '$borderColor',
-    borderRadius: 10,
-    flex: 1,
-    padding: 10,
-  },
   icon: {
     fontSize: 40,
     color: '$iconColor',
     marginHorizontal: 20,
   },
+  rowTextStyle: {
+    fontSize: 12,
+    color: '$primaryDarkGray',
+    padding: 5,
+  },
+  dropdownText: {
+    fontSize: 14,
+    paddingLeft: 16,
+    paddingHorizontal: 14,
+    color: '$primaryDarkGray',
+  },
+  dropdownStyle: {
+    marginTop: 15,
+    minWidth: 192,
+    width: 192,
+    maxHeight: '$deviceHeight - 200',
+  },
+  dropdownButtonStyle: {
+    backgroundColor: '$primaryGray',
+    height: 44,
+    width: 172,
+    borderRadius: 8,
+    marginHorizontal: 2,
+  },
+  dropdown: {
+    flexGrow: 1,
+    width: 150,
+  },
 });