minor native send transparent improvements

react/src/components/dashboard/walletsNativeSend/walletsNativeSend.js

@@ -36,6 +36,7 @@ class WalletsNativeSend extends React.Component {
     this.handleClickOutside = this.handleClickOutside.bind(this);
     this.checkZAddressCount = this.checkZAddressCount.bind(this);
     this.setRecieverFromScan = this.setRecieverFromScan.bind(this);
+    this.renderOPIDListCheck = this.renderOPIDListCheck.bind(this);
   }
 
   componentWillMount() {
@@ -91,26 +92,46 @@ class WalletsNativeSend extends React.Component {
   }
 
   renderAddressByType(type) {
+    let _items = [];
+
     if (this.props.ActiveCoin.addresses &&
         this.props.ActiveCoin.addresses[type] &&
         this.props.ActiveCoin.addresses[type].length) {
-      return this.props.ActiveCoin.addresses[type].map((address) =>
+      this.props.ActiveCoin.addresses[type].map((address) => {
-        <li key={ address.address } className={ address.amount <= 0 ? 'hide' : '' }>
+        if (address.amount > 0) {
+          _items.push(
+            <li
+              className="selected"
+              key={ address.address }>
               <a onClick={ () => this.updateAddressSelection(address.address, type, address.amount) }>
                 <i className={ 'icon fa-eye' + (type === 'public' ? '' : '-slash') }></i>&nbsp;&nbsp;
                 <span className="text">
                   [ { address.amount } { this.props.ActiveCoin.coin } ]&nbsp;&nbsp;
                   { type === 'public' ? address.address : address.address.substring(0, 34) + '...' }
                 </span>
-            <span className="glyphicon glyphicon-ok check-mark"></span>
+                <span
+                  className="glyphicon glyphicon-ok check-mark pull-right"
+                  style={{ display: this.state.sendFrom === address.address ? 'inline-block' : 'none' }}></span>
               </a>
             </li>
           );
+        }
+      });
+
+      return _items;
     } else {
       return null;
     }
   }
 
+  renderOPIDListCheck() {
+    if (this.state.renderAddressDropdown &&
+        this.props.ActiveCoin.opids &&
+        this.props.ActiveCoin.opids.length) {
+      return true;
+    }
+  }
+
   renderSelectorCurrentLabel() {
     if (this.state.sendFrom) {
       return (
@@ -118,13 +139,13 @@ class WalletsNativeSend extends React.Component {
           <i className={ 'icon fa-eye' + this.state.addressType === 'public' ? '' : '-slash' }></i>
           <span className="text">
             [ { this.state.sendFromAmount } { this.props.ActiveCoin.coin } ]  
-            { this.state.sendFrom }
+            { this.state.addressType === 'public' ? this.state.sendFrom : this.state.sendFrom.substring(0, 34) + '...' }
           </span>
         </span>
       );
     } else {
       return (
-        <span>- { translate('SEND.SELECT_T_OR_Z_ADDR') } -</span>
+        <span>Transparent funds</span>
       );
     }
   }
@@ -247,6 +268,8 @@ class WalletsNativeSend extends React.Component {
         this.state
       )
     );
+
+    if (this.state.addressType === 'private') {
       setTimeout(() => {
         Store.dispatch(
           getKMDOPID(
@@ -257,6 +280,19 @@ class WalletsNativeSend extends React.Component {
       }, 1000);
     }
 
+    this.setState({
+      addressType: null,
+      sendFrom: null,
+      sendFromAmount: 0,
+      sendTo: '',
+      sendToOA: null,
+      amount: 0,
+      fee: 0,
+      addressSelectorOpen: false,
+      renderAddressDropdown: true,
+    });
+  }
+
   getOAdress() {
     resolveOpenAliasAddress(this.state.sendToOA)
     .then((json) => {

react/src/components/dashboard/walletsNativeSend/walletsNativeSend.render.js

@@ -17,9 +17,15 @@ export const AddressListRender = function() {
       </button>
       <div className="dropdown-menu open">
         <ul className="dropdown-menu inner">
-          <li className="selected">
+          <li
-            <a><span className="text">Select private address</span>
+            className="selected"
-            <span className="glyphicon glyphicon-ok check-mark"></span></a>
+            onClick={ () => this.updateAddressSelection(null, 'public', null) }>
+            <a>
+              <span className="text">Transparent funds</span>
+              <span
+                className="glyphicon glyphicon-ok check-mark pull-right"
+                style={{ display: this.state.sendFrom === null ? 'inline-block' : 'none' }}></span>
+            </a>
           </li>
           { this.renderAddressByType('private') }
         </ul>
@@ -116,6 +122,7 @@ export const WalletsNativeSendRender = function() {
                     type="text"
                     className="form-control"
                     name="amount"
+                    value={ this.state.amount !== 0 ? this.state.amount : '' }
                     onChange={ this.updateInput }
                     id="kmdWalletAmount"
                     placeholder="0.000"
@@ -134,7 +141,7 @@ export const WalletsNativeSendRender = function() {
                     onChange={ this.updateInput }
                     id="kmdWalletFee"
                     placeholder="0.000"
-                    value={ this.state.fee }
+                    value={ this.state.fee !== 0 ? this.state.fee : '' }
                     autoComplete="off" />
                 </div>
                 <div className="col-lg-12 hide">
@@ -149,7 +156,7 @@ export const WalletsNativeSendRender = function() {
                     type="button"
                     className="btn btn-primary waves-effect waves-light pull-right"
                     onClick={ this.handleSubmit }
-                    disabled={ (!this.state.sendFrom && this.state.renderAddressDropdown) || !this.state.sendTo || !this.state.amount }>
+                    disabled={ !this.state.sendTo || !this.state.amount }>
                     { translate('INDEX.SEND') } { this.state.amount } { this.props.ActiveCoin.coin }
                   </button>
                 </div>
@@ -159,7 +166,7 @@ export const WalletsNativeSendRender = function() {
         </div>
       </div>
 
-      { this.state.renderAddressDropdown &&
+      { this.renderOPIDListCheck() &&
         <div className="col-xs-12">
           <div className="row">
             <div className="panel nav-tabs-horizontal">

react/src/components/dashboard/walletsProgress/walletsProgress.js

@@ -112,8 +112,7 @@ class WalletsProgress extends React.Component {
 
     if (this.props.Dashboard.progress &&
         this.props.Dashboard.progress.blocks) {
-      const syncPercentage = (parseFloat(parseInt(this.props.Dashboard.progress.blocks, 10) * 100
+      const syncPercentage = (parseFloat(parseInt(this.props.Dashboard.progress.blocks, 10) * 100 / parseInt(this.props.Dashboard.progress.longestchain, 10)).toFixed(2) + '%').replace('NaN', 0);
-        / parseInt(this.props.Dashboard.progress.longestchain, 10)).toFixed(2) + '%').replace('NaN', 0);
       return SyncPercentageRender.call(this, syncPercentage);
     }