Fixes Issue bitshares#530 - Gateway Fees (bitshares#659)

* Network Fees included in total transaction amount - Add Fee amounts before submitting to network. - Don't try to withdraw more than user owns. - Increase width of "Network Fee" input selector - Minor Code cleanup * Minor changes to the way we check user balance * Fixing Asset handling
murilob · Nov 1, 2017 · aa13e9d · aa13e9d
1 parent 9d1b60a
commit aa13e9d
Show file tree

Hide file tree

Showing 3 changed files with 73 additions and 58 deletions.
diff --git a/app/assets/stylesheets/themes/_theme-template.scss b/app/assets/stylesheets/themes/_theme-template.scss
@@ -1356,8 +1356,8 @@ $account-background
 }
 
 .olDarkTheme .gate_fee .amount-selector {
-    width: 74%;
-    display: inline-block;
+  width: 100%;
+  display: inline-block;
 }
 
 .olDarkTheme .gate_fee .right-selector {

diff --git a/app/components/DepositWithdraw/WithdrawModal.jsx b/app/components/DepositWithdraw/WithdrawModal.jsx
@@ -11,73 +11,72 @@ import AccountActions from "actions/AccountActions";
 
 class WithdrawModal extends React.Component {
 
-   static propTypes = {
-       account: ChainTypes.ChainAccount.isRequired,
-       issuer: ChainTypes.ChainAccount.isRequired,
-       asset: ChainTypes.ChainAsset.isRequired,
-       receive_asset_name: React.PropTypes.string,
-       receive_asset_symbol: React.PropTypes.string,
-       memo_prefix: React.PropTypes.string
-   }
+    static propTypes = {
+        account: ChainTypes.ChainAccount.isRequired,
+        issuer: ChainTypes.ChainAccount.isRequired,
+        asset: ChainTypes.ChainAsset.isRequired,
+        receive_asset_name: React.PropTypes.string,
+        receive_asset_symbol: React.PropTypes.string,
+        memo_prefix: React.PropTypes.string
+    }
 
-   constructor( props ) {
-      super(props);
-      this.state = {
-         withdraw_amount:null,
-         withdraw_address:null
-      }
-   }
+    constructor( props ) {
+        super(props);
+        this.state = {
+            withdraw_amount:null,
+            withdraw_address:null
+        };
+    }
 
-   onWithdrawAmountChange( {amount, asset} ) {
-      this.setState( {withdraw_amount:amount} );
-   }
+    onWithdrawAmountChange( {amount, asset} ) {
+        this.setState( {withdraw_amount:amount} );
+    }
 
-   onWithdrawAddressChanged( e ) {
-      this.setState( {withdraw_address:e.target.value} );
-   }
+    onWithdrawAddressChanged( e ) {
+        this.setState( {withdraw_address:e.target.value} );
+    }
 
-   onSubmit() {
-     let asset = this.props.asset;
-     let precision = utils.get_asset_precision(asset.get("precision"));
-     let amount = this.state.withdraw_amount.replace( /,/g, "" )
-     console.log( "withdraw_amount: ", amount );
-     AccountActions.transfer(
-         this.props.account.get("id"),
-         this.props.issuer.get("id"),
-         parseInt(amount * precision, 10),
-         asset.get("id"),
-         (this.props.memo_prefix || "") + this.state.withdraw_address
-     )
-   }
+    onSubmit() {
+        let asset = this.props.asset;
+        let precision = utils.get_asset_precision(asset.get("precision"));
+        let amount = this.state.withdraw_amount.replace( /,/g, "" );
+        console.log( "withdraw_amount: ", amount );
+        AccountActions.transfer(
+            this.props.account.get("id"),
+            this.props.issuer.get("id"),
+            parseInt(amount * precision, 10),
+            asset.get("id"),
+            (this.props.memo_prefix || "") + this.state.withdraw_address
+        );
+    }
 
-   render() {
-       let balance = null;
-       // console.log( "account: ", this.props.account.toJS() );
-       let account_balances = this.props.account.get("balances").toJS();
-       // console.log( "balances: ", account_balances );
-       let asset_types = Object.keys(account_balances);
+    render() {
+        let balance = null;
+        // console.log( "account: ", this.props.account.toJS() );
+        let account_balances = this.props.account.get("balances").toJS();
+        // console.log( "balances: ", account_balances );
+        let asset_types = Object.keys(account_balances);
 
-       if (asset_types.length > 0) {
-           let current_asset_id = this.props.asset.get('id');
-           if( current_asset_id )
-              balance = (<span><Translate component="span" content="transfer.available"/>: <BalanceComponent balance={account_balances[current_asset_id]}/></span>)
-           else
-              balance = "No funds";
-       } else {
-           balance = "No funds";
-       }
+        if (asset_types.length > 0) {
+            let current_asset_id = this.props.asset.get("id");
+            if( current_asset_id )
+                balance = (<span><Translate component="span" content="transfer.available"/>: <BalanceComponent balance={account_balances[current_asset_id]}/></span>);
+            else
+                balance = "No funds";
+        } else {
+            balance = "No funds";
+        }
 
-
-       return (<form className="grid-block vertical full-width-content">
+        return (<form className="grid-block vertical full-width-content">
                  <div className="grid-container">
                    <div className="content-block">
                       <h3>Withdraw {this.props.receive_asset_name}({this.props.receive_asset_symbol})</h3>
                    </div>
                    <div className="content-block">
                      <AmountSelector label="modal.withdraw.amount"
                                      amount={this.state.withdraw_amount}
-                                     asset={this.props.asset.get('id')}
-                                     assets={[this.props.asset.get('id')]}
+                                     asset={this.props.asset.get("id")}
+                                     assets={[this.props.asset.get("id")]}
                                      placeholder="0.0"
                                      onChange={this.onWithdrawAmountChange.bind(this)}
                                      display_balance={balance}
@@ -98,8 +97,8 @@ class WithdrawModal extends React.Component {
                        </Trigger>
                    </div>
                  </div>
-               </form>)
-   }
+               </form>);
+    }
 
 };
 

diff --git a/app/components/DepositWithdraw/blocktrades/WithdrawModalBlocktrades.jsx b/app/components/DepositWithdraw/blocktrades/WithdrawModalBlocktrades.jsx
@@ -201,7 +201,6 @@ class WithdrawModalBlocktrades extends React.Component {
     }
 
     onSubmit() {
-
         if ((!this.state.withdraw_address_check_in_progress) && (this.state.withdraw_address && this.state.withdraw_address.length) && (this.state.withdraw_amount !== null)) {
             if (!this.state.withdraw_address_is_valid) {
                 ZfApi.publish(this.getWithdrawModalId(), "open");
@@ -223,12 +222,29 @@ class WithdrawModalBlocktrades extends React.Component {
                 const {feeAmount} = this.state;
 
                 let amount = parseFloat(String.prototype.replace.call(this.state.withdraw_amount, /,/g, ""));
+                let gateFee = parseFloat(String.prototype.replace.call(this.props.gateFee, /,/g, ""));
+
                 let sendAmount = new Asset({
                     asset_id: asset.get("id"),
                     precision: asset.get("precision"),
                     real: amount
                 });
 
+                let balanceAmount = sendAmount.clone(this.props.balance.get("balance"));
+
+                let gateFeeAmount = new Asset({
+                    asset_id: asset.get("id"),
+                    precision: asset.get("precision"),
+                    real: gateFee
+                });
+
+                sendAmount.plus(gateFeeAmount);
+
+                /* Insufficient balance */
+                if (balanceAmount.lt(sendAmount)) {
+                    sendAmount = balanceAmount;
+                }
+
                 AccountActions.transfer(
                     this.props.account.get("id"),
                     this.props.issuer.get("id"),