Merge branch 'master' of github.com:KyberNetwork/KyberWallet into rel…

…ease_2.1.2
KyberNetwork · Aug 1, 2019 · aa7e7b1 · aa7e7b1
2 parents ad9adf1 + 04227fe
commit aa7e7b1
Show file tree

Hide file tree

Showing 24 changed files with 118 additions and 129 deletions.
diff --git a/env/config-env/ropsten.json b/env/config-env/ropsten.json
@@ -30,7 +30,7 @@
         "minSupportOrder": 0.001,
         "maxSupportOrder": 10,
         "maxPercentTriggerRate": 900,
-        "page_size": 5
+        "page_size": 50
     },
     "wrapETHToken": "WETH",
     "userdashboard_url": "https://staging-kyberswap.knstats.com",

diff --git a/env/config-env/staging.json b/env/config-env/staging.json
@@ -28,7 +28,7 @@
         "minSupportOrder": 0.001,
         "maxSupportOrder": 10,
         "maxPercentTriggerRate": 900,
-        "page_size": 5
+        "page_size": 50
     },
     "promo_token": "PT",
     "wrapETHToken": "WETH",

diff --git a/env/config-env/staging_limit_order.json b/env/config-env/staging_limit_order.json
@@ -37,7 +37,7 @@
         "minSupportOrder": 0.001,
         "maxSupportOrder": 10,
         "maxPercentTriggerRate": 900,
-        "page_size": 5
+        "page_size": 50
     },
     "promo_token": "PT",
     "wrapETHToken": "WETH",

diff --git a/lang/kr.json b/lang/kr.json
@@ -137,7 +137,7 @@
     "please_swap_and_send_before": "Please swap and send to your personal wallet before",
     "limit_order": "리밋 오더",
     "rate_label":"율",
-    "market_rate": "Market rate",
+    "market_rate": "시장비율",
     "tx_fee_warning": "After this swap, you will not have enough ETH as fee for further transactions"
   },
   "modal": {
@@ -426,9 +426,9 @@
     "fee_info": "Upon execution, fee is deducted from source token and remaining ${sourceAmount} ${sourceTokenSymbol} is converted to ${destTokenSymbol}",
     "open_orders": "오픈 상태의 오더",
     "order_history": "오더 내역",
-    "actual_receive_amount": "Actual receive amount:",
-    "estimated_amount": "Estimated amount:",
-    "extra_amount": "You got extra amount:"
+    "actual_receive_amount": "실제로 받는 토큰의 양:",
+    "estimated_amount": "예상 토큰의 양:",
+    "extra_amount": "추가로 받은 토큰의 양:"
   },
   "home": "홈",
   "tracker": "트래커",
@@ -449,6 +449,6 @@
   "ok": "OK",
   "done": "완료",
   "error_text": "오류",
-  "extra": "extra",
-  "off": "OFF"
+  "extra": "추가",
+  "off": "할인"
 }
diff --git a/src/assets/css/limit-order.scss b/src/assets/css/limit-order.scss
@@ -24,7 +24,7 @@
         }
 
         .rt-table {
-            overflow: visible;
+            // overflow: visible;
         }
 
         .rt-thead {
@@ -307,6 +307,11 @@
         @extend %number-cell;
         max-width: 100px;
 
+        &--extra-wrapper {
+            position: relative;
+            display: inline-block;
+        }
+
         &--extra {
             border-radius: 8px;
             background-color: #999999;
@@ -1892,6 +1897,8 @@
     z-index: 1;
     padding: 10px 15px; 
 
+    transform: translateX(15px) translateY(-18px);
+
     border-radius: 2px;
     box-shadow: 0 4px 12px 0 rgba(87, 102, 119, 0.14);
     border: solid 0.9px #e8e8e8;

diff --git a/src/assets/css/token_select.scss b/src/assets/css/token_select.scss
@@ -416,7 +416,7 @@
 
   & &__input {
     color: #666;
-    font-size: 24px;
+    font-size: 21px;
     margin: 0;
     padding: 0px 5px 0 15px;
     min-height: 32px;

diff --git a/src/js/actions/exchangeActions.js b/src/js/actions/exchangeActions.js
@@ -19,22 +19,17 @@ export function checkSelectToken() {
   }
 }
 
-export function caculateAmount() {
+export function caculateAmount(sourceTokenDecimals, destTokenDecimals) {
   return {
-    type: "EXCHANGE.CACULATE_AMOUNT"
+    type: "EXCHANGE.CACULATE_AMOUNT",
+    payload: { sourceTokenDecimals, destTokenDecimals }
   }
 }
 
-export function caculateAmountInSnapshot() {
-  return {
-    type: "EXCHANGE.CACULATE_AMOUNT_SNAPSHOT"
-  }
-}
-
-export function inputChange(focus, value) {
+export function inputChange(focus, value, sourceTokenDecimals, destTokenDecimals) {
   return {
     type: "EXCHANGE.INPUT_CHANGE",
-    payload: { focus, value }
+    payload: { focus, value, sourceTokenDecimals, destTokenDecimals }
   }
 }
 
@@ -170,10 +165,10 @@ export function updateRate(ethereum, sourceTokenSymbol, sourceToken, destTokenSy
 //   }
 // }
 
-export function updateRateExchangeComplete(expectedRateInit, expectedPrice, slippagePrice, lastestBlock, isManual, percentChange) {
+export function updateRateExchangeComplete(expectedRateInit, expectedPrice, slippagePrice, lastestBlock, isManual, percentChange, srcTokenDecimal, destTokenDecimal) {
   return {
     type: "EXCHANGE.UPDATE_RATE_COMPLETE",
-    payload: { expectedRateInit, expectedPrice, slippagePrice, lastestBlock, isManual, percentChange }
+    payload: { expectedRateInit, expectedPrice, slippagePrice, lastestBlock, isManual, percentChange, srcTokenDecimal, destTokenDecimal }
   }
 
 }
@@ -736,4 +731,4 @@ export function saveApproveMaxTx(sourceTokenSymbol, txHash) {
     type: "EXCHANGE.SAVE_APPROVE_MAX_TX",
     payload: { sourceTokenSymbol, txHash }
   }
-}
+}
diff --git a/src/js/actions/limitOrderActions.js b/src/js/actions/limitOrderActions.js
@@ -16,10 +16,10 @@ export function selectToken(sourceTokenSymbol, sourceToken, destTokenSymbol, des
   }
 }
 
-export function inputChange(focus, value) {
+export function inputChange(focus, value, sourceTokenDecimals, destTokenDecimals) {
   return {
     type: "LIMIT_ORDER.INPUT_CHANGE",
-    payload: { focus, value }
+    payload: { focus, value, sourceTokenDecimals, destTokenDecimals }
   }
 }
 
@@ -30,10 +30,10 @@ export function updateRate(ethereum, sourceTokenSymbol, sourceToken, destTokenSy
   }
 }
 
-export function updateRateComplete(rateInit, expectedPrice, slippagePrice, blockNo, isManual, type, errMsg) {
+export function updateRateComplete(rateInit, expectedPrice, slippagePrice, blockNo, isManual, type, errMsg, destTokenDecimals) {
   return {
     type: "LIMIT_ORDER.UPDATE_RATE_COMPLETE",
-    payload: { rateInit, expectedPrice, slippagePrice, blockNo, isManual, type, errMsg }
+    payload: { rateInit, expectedPrice, slippagePrice, blockNo, isManual, type, errMsg, destTokenDecimals }
   }
 
 }

diff --git a/src/js/containers/Exchange/Exchange.js b/src/js/containers/Exchange/Exchange.js
@@ -141,8 +141,11 @@ export default class Exchange extends React.Component {
     if (!this.props.account) {
       return
     }
+
+    var { sourceTokenDecimals, destTokenDecimals } = this.getTokenInit();
+
     this.props.dispatch(exchangeActions.verifyExchange())
-    this.props.dispatch(exchangeActions.caculateAmount())
+    this.props.dispatch(exchangeActions.caculateAmount(sourceTokenDecimals, destTokenDecimals))
   }
 
   setInvervalProcess = () => {
@@ -168,11 +171,12 @@ export default class Exchange extends React.Component {
   getTokenInit = () => {
     var sourceTokenSymbol = this.props.params.source.toUpperCase()
     var sourceToken = this.props.tokens[sourceTokenSymbol].address
-
+    var sourceTokenDecimals = this.props.tokens[sourceTokenSymbol].decimals
     var destTokenSymbol = this.props.params.dest.toUpperCase()
     var destToken = this.props.tokens[destTokenSymbol].address
+    var destTokenDecimals = this.props.tokens[destTokenSymbol].decimals
 
-    return {sourceTokenSymbol, sourceToken, destTokenSymbol, destToken}
+    return {sourceTokenSymbol, sourceToken, destTokenSymbol, destToken, sourceTokenDecimals, destTokenDecimals}
   }
 
   componentDidMount = () =>{

diff --git a/src/js/containers/Exchange/ExchangeBody.js b/src/js/containers/Exchange/ExchangeBody.js
@@ -30,11 +30,12 @@ import ReactTooltip from 'react-tooltip'
   const tokens = store.tokens.tokens
   const translate = getTranslate(store.locale)
   const global = store.global
-
+  const sourceToken = tokens[exchange.sourceTokenSymbol]
+  const destToken = tokens[exchange.destTokenSymbol]
 
   return {
     account, ethereum, tokens, translate, 
-    global, exchange   
+    global, exchange, sourceToken, destToken
   }
 })
 
@@ -278,7 +279,7 @@ class ExchangeBody extends React.Component {
       value = amount
     }
     if (value < 0) return
-    this.props.dispatch(exchangeActions.inputChange('source', value));
+    this.props.dispatch(exchangeActions.inputChange('source', value, this.props.sourceToken.decimals, this.props.destToken.decimals));
 
     this.lazyEstimateGas()
 
@@ -294,7 +295,7 @@ class ExchangeBody extends React.Component {
     }
 
     if (value < 0) return
-    this.props.dispatch(exchangeActions.inputChange('dest', value))
+    this.props.dispatch(exchangeActions.inputChange('dest', value, this.props.sourceToken.decimals, this.props.destToken.decimals))
 
     var valueSource = converters.caculateSourceAmount(value, this.props.exchange.expectedRate, 6)
     this.validateRateAndSource(valueSource, true);
@@ -342,7 +343,7 @@ class ExchangeBody extends React.Component {
 
       this.focusSource()
 
-      this.props.dispatch(exchangeActions.inputChange('source', balance))
+      this.props.dispatch(exchangeActions.inputChange('source', balance, this.props.sourceToken.decimals, this.props.destToken.decimals))
       this.props.ethereum.fetchRateExchange(true)
     }
     this.props.global.analytics.callTrack("trackClickAllIn", "Swap", tokenSymbol);
@@ -559,7 +560,7 @@ class ExchangeBody extends React.Component {
 
         if (amount < 0) amount = 0;
 
-        this.props.dispatch(exchangeActions.inputChange('source', amount))
+        this.props.dispatch(exchangeActions.inputChange('source', amount, this.props.sourceToken.decimals, this.props.destToken.decimals))
         this.props.dispatch(exchangeActions.focusInput('source'));
         this.selectTokenBalance();
         this.props.global.analytics.callTrack("trackClickToken", sourceSymbol, this.props.screen);

diff --git a/src/js/containers/Exchange/ExchangeModals/ConfirmModal.js b/src/js/containers/Exchange/ExchangeModals/ConfirmModal.js
@@ -333,12 +333,12 @@ export default class ConfirmModal extends React.Component {
             expiredYear = new Date().getFullYear() + 1;
         }
 
+        var destTokenSymbol = this.props.exchange.destTokenSymbol
         var sourceAmount = this.props.exchange.snapshot.sourceAmount.toString();
-        var destAmount = converter.calculateDest(sourceAmount, this.state.expectedRate)
-        destAmount = destAmount.toString()
+        var destDecimal = this.props.tokens[destTokenSymbol].decimal;
+        var destAmount = converter.caculateDestAmount(sourceAmount, this.state.expectedRate, destDecimal)
 
         var sourceTokenSymbol = this.props.exchange.sourceTokenSymbol
-        var destTokenSymbol = this.props.exchange.destTokenSymbol
         var sourceIcon = this.props.exchange.sourceIcon
         var destIcon = this.props.exchange.destIcon
 

diff --git a/src/js/containers/LimitOrder/LimitOrderAccount.js b/src/js/containers/LimitOrder/LimitOrderAccount.js
@@ -82,14 +82,13 @@ export default class LimitOrderAccount extends React.Component {
     const srcToken = tokens.find(token => {
       return token.symbol === sourceSymbol;
     });
+    const destToken = tokens.find(token => {
+      return token.symbol === this.props.limitOrder.destTokenSymbol;
+    });
     var sourceBalance = srcToken.balance;
 
     var sourceDecimal = this.props.tokens[sourceSymbol].decimals
 
-    // sourceBalance = converters.toT(sourceBalance, sourceDecimal)
-
-
-
     if (sourceSymbol === BLOCKCHAIN_INFO.wrapETHToken) {
 
       //if souce token is weth, we spend a small amount to make approve tx, swap tx
@@ -106,7 +105,7 @@ export default class LimitOrderAccount extends React.Component {
 
     if (converters.compareTwoNumber(sourceBalance, 0) == -1) sourceBalance = 0  
 
-    this.props.dispatch(limitOrderActions.inputChange('source', converters.toT(sourceBalance, sourceDecimal)))
+    this.props.dispatch(limitOrderActions.inputChange('source', converters.toT(sourceBalance, sourceDecimal), sourceDecimal, destToken.decimals))
     this.props.dispatch(limitOrderActions.focusInput('source'));
 
     this.selectTokenBalance();

diff --git a/src/js/containers/LimitOrder/LimitOrderBody.js b/src/js/containers/LimitOrder/LimitOrderBody.js
@@ -173,11 +173,13 @@ export default class LimitOrderBody extends React.Component {
     const destToken = this.props.limitOrder.destToken;
     const destTokenSymbol = this.props.limitOrder.destTokenSymbol;
     const destAmount = this.props.limitOrder.destAmount;
+    const sourceTokenDecimals = this.props.tokens[srcTokenSymbol]
+    const destTokenDecimals = this.props.tokens[destTokenSymbol]
 
     this.props.dispatch(limitOrderActions.selectToken(destTokenSymbol, destToken, srcTokenSymbol, srcToken, ''));
 
-    this.props.dispatch(limitOrderActions.inputChange('source', destAmount));
-    this.props.dispatch(limitOrderActions.inputChange('dest', ''));
+    this.props.dispatch(limitOrderActions.inputChange('source', destAmount, sourceTokenDecimals, destTokenDecimals));
+    this.props.dispatch(limitOrderActions.inputChange('dest', '', sourceTokenDecimals, destTokenDecimals));
 
     this.updateGlobal(destTokenSymbol, destToken, srcTokenSymbol, srcToken, destAmount);
   }

diff --git a/src/js/containers/LimitOrder/LimitOrderExtraTooltip.js b/src/js/containers/LimitOrder/LimitOrderExtraTooltip.js
@@ -52,10 +52,10 @@ export default class LimitOrderExtraTooltip extends React.PureComponent {
           </span>
         </div>
         <div className="extra-tooltip--faq">
-          <a href={`/faq#can-I-submit-multiple-limit-orders-for-same-token-pair`} target="_blank">
+          <a href={`/faq#Why-received-amount-is-higher-than-estimated-amount`} target="_blank">
             {this.props.translate("why") || "Why?"}
           </a>
-        </div>
+        </div> 
       </div>
     )
   }

diff --git a/src/js/containers/LimitOrder/LimitOrderFee.js b/src/js/containers/LimitOrder/LimitOrderFee.js
@@ -61,15 +61,14 @@ class LimitOrderFee extends React.Component {
     const orderFeeDiscountPercentage = converter.multiplyOfTwoNumber(converter.divOfTwoNumber(discountFee, orderFee), 100);
     const isDiscount = converter.compareTwoNumber(orderFeeDiscountPercentage, 0) === 1;
 
-    let orderFeeText = <img src={require('../../../assets/img/waiting-white.svg')}/>;
+    let orderFeeText = null;
     // let orderDiscountFeeText = `0 ${sourceTokenSymbol} (${isDiscount ? '~' : ''}${converter.formatNumber(orderFeeDiscountPercentage, 1)}% of Fee)`;
     let orderDiscountFeeText = null;
     let orderNetFeeText = <img src={require('../../../assets/img/waiting-white.svg')}/>;
 
     if (!this.props.limitOrder.isFetchingFee) {
       // orderFeeText = <span><span title={orderFee}>{converter.formatNumber(orderFee, 5, '')}</span> {sourceTokenSymbol} ({this.props.limitOrder.orderFee}% of <span title={this.props.limitOrder.sourceAmount}>{converter.displayNumberWithDot(this.props.limitOrder.sourceAmount)}</span> {sourceTokenSymbol})</span>
       orderNetFeeText = <span className="limit-order-fee__net">{converter.formatNumber(orderFeeAfterDiscount, 5, '')} {sourceTokenSymbol}</span>;
-      orderFeeText = null;
 
       if (this.props.limitOrder.sourceAmount && isDiscount) {
         orderFeeText = <span className="limit-order__line-through-text">{converter.formatNumber(orderFee, 5)} {sourceTokenSymbol}</span>

diff --git a/src/js/containers/LimitOrder/LimitOrderForm.js b/src/js/containers/LimitOrder/LimitOrderForm.js
@@ -22,10 +22,12 @@ import { Tooltip } from "react-tippy";
   const tokens = store.tokens.tokens
   const limitOrder = store.limitOrder
   const ethereum = store.connection.ethereum
+  const sourceToken = tokens[limitOrder.sourceTokenSymbol]
+  const destToken = tokens[limitOrder.destTokenSymbol]
 
   return {
     translate, limitOrder, tokens, account, ethereum,
-    global: store.global
+    global: store.global, sourceToken, destToken
 
   }
 })
@@ -99,7 +101,7 @@ export default class LimitOrderForm extends React.Component {
     var check = filterInputNumber(e, value, referValue)
     if (check) {     
       if (value < 0) return
-      this.props.dispatch(limitOrderActions.inputChange(type, e.target.value));
+      this.props.dispatch(limitOrderActions.inputChange(type, e.target.value, this.props.sourceToken.decimals, this.props.destToken.decimals));
 
       if (type === "source"){
         this.lazyFetchRate(value)
@@ -162,7 +164,7 @@ export default class LimitOrderForm extends React.Component {
 
     // console.log("souirce_token")
     // console.log(sourceAmountByPercentage)
-    this.props.dispatch(limitOrderActions.inputChange('source', converters.toT(sourceAmountByPercentage, srcToken.decimals)));
+    this.props.dispatch(limitOrderActions.inputChange('source', converters.toT(sourceAmountByPercentage, srcToken.decimals), this.props.sourceToken.decimals, this.props.destToken.decimals));
   };
 
   closeRateWarningTooltip = () => {
@@ -222,7 +224,7 @@ export default class LimitOrderForm extends React.Component {
 
   resetToMarketRate = (e) => {
     const expectedRate = converters.toT(this.props.limitOrder.offeredRate);
-    this.props.dispatch(limitOrderActions.inputChange("rate", converters.roundingRateNumber(expectedRate)));
+    this.props.dispatch(limitOrderActions.inputChange("rate", converters.roundingRateNumber(expectedRate), this.props.sourceToken.decimals, this.props.destToken.decimals));
   }
 
   getRateWarningTooltip = () => {

diff --git a/src/js/containers/LimitOrder/LimitOrderModals/ConfirmModal.js b/src/js/containers/LimitOrder/LimitOrderModals/ConfirmModal.js
@@ -217,9 +217,6 @@ export default class ConfirmModal extends React.Component {
 
       return `
       <div>
-        <div className="title">
-          ${`${this.props.translate("limit_order.fee") || "Fee"} ${calculateFee} ${this.props.limitOrder.sourceTokenSymbol} (${this.state.fee}% of ${sourceAmount} ${this.props.limitOrder.sourceTokenSymbol})`}
-        </div>
         <div className="description">
           ${this.props.translate("limit_order.fee_info_message") || "Don’t worry. You will not be charged now. You pay fees only when transaction is executed (broadcasted & mined)."}
         </div>