Merge pull request #185 from eoscostarica/feature/both-input-fields

feat: allow type the amount to receive
eoscostarica · Sep 10, 2020 · 7ed0dc6 · 7ed0dc6
2 parents e842666 + 0f8ae91
commit 7ed0dc6
Show file tree

Hide file tree

Showing 2 changed files with 68 additions and 4 deletions.
diff --git a/src/routes/Evodex/BackLayer/Exchange/ExchangeBackLayer.js b/src/routes/Evodex/BackLayer/Exchange/ExchangeBackLayer.js
@@ -168,6 +168,8 @@ const ExchangeBackLayer = ({ onReload, ual, isLightMode, showMessage }) => {
   const [youGive, setYouGive] = useState({ walletBalance: {} })
   const [loading, setLoading] = useState(false)
   const [helperTextReceive, setHelperTextReceive] = useState('')
+  const [userChangeInput, setUserChangeInput] = useState('')
+  const [, setLastInterval] = useState('')
 
   const getTokenValue = (token) => {
     if (!pair) {
@@ -207,6 +209,7 @@ const ExchangeBackLayer = ({ onReload, ual, isLightMode, showMessage }) => {
       ...prevState,
       ...value
     }))
+    setUserChangeInput(key)
   }
 
   const handleOnSwitchValues = () => {
@@ -298,6 +301,10 @@ const ExchangeBackLayer = ({ onReload, ual, isLightMode, showMessage }) => {
   ])
 
   useEffect(() => {
+    if (userChangeInput !== 'youGive') {
+      return
+    }
+
     if (!pair || !youGive.inputValue) {
       setYouReceive((prevState) => ({
         ...prevState,
@@ -309,13 +316,43 @@ const ExchangeBackLayer = ({ onReload, ual, isLightMode, showMessage }) => {
     }
 
     const assets = evolutiondex.getExchangeAssets(youGive.inputValue, pair)
-
     setAssets(assets)
     setYouReceive((prevState) => ({
       ...prevState,
       inputValue: assets.assetToReceive.toString().split(' ')[0]
     }))
-  }, [pair, youGive.inputValue])
+  }, [userChangeInput, pair, youGive.inputValue])
+
+  useEffect(() => {
+    if (userChangeInput !== 'youReceive') {
+      return
+    }
+
+    setLastInterval((lastValue) => {
+      clearInterval(lastValue)
+
+      return null
+    })
+
+    if (!pair || !youReceive.inputValue) {
+      setYouGive((prevState) => ({
+        ...prevState,
+        inputValue: ''
+      }))
+      setAssets(null)
+
+      return
+    }
+
+    const assets = evolutiondex.getExchangeAssetsFromToken2(youReceive.inputValue, pair)
+
+    setAssets(assets)
+    setYouGive((prevState) => ({
+      ...prevState,
+      inputValue: assets.assetToGive.toString().split(' ')[0]
+    }))
+    setLastInterval(setTimeout(() => { setUserChangeInput('youGive') }, 2000))
+  }, [userChangeInput, pair, youReceive.inputValue])
 
   useEffect(() => {
     if (!exchangeState.currentPair) {
@@ -424,7 +461,6 @@ const ExchangeBackLayer = ({ onReload, ual, isLightMode, showMessage }) => {
           options={options.youReceive}
           onChange={handleOnChange('youReceive')}
           value={youReceive}
-          inputDisabled
           helperText={
             pair && (
               <Typography

diff --git a/src/utils/evolutiondex.js b/src/utils/evolutiondex.js
@@ -163,8 +163,35 @@ const getExchangeAssets = (amount, pair) => {
     pair.from.asset.amount.plus(assetToGive.amount),
     pair.fee
   ).abs()
-
   assetToReceive.set_amount(computeForwardAmount)
+
+  return {
+    assetToGive,
+    assetToReceive,
+    price: amountToAsset(
+      (
+        parseFloat(assetToReceive.toString().split(' ')[0]) /
+        parseFloat(assetToGive.toString().split(' ')[0])
+      ).toFixed(assetToReceive.symbol.precision()),
+      assetToReceive
+    ).toString()
+  }
+}
+const getExchangeAssetsFromToken2 = (amount, pair) => {
+  const assetToGive = numberToAsset(0, pair.from.asset.symbol)
+  const assetToReceive = amountToAsset(amount, pair.to.asset)
+  const amountToReceive = assetToReceive.amount
+  amountToReceive.plus(
+    amountToReceive.multiply(pair.fee).plus(9999).divide(10000)
+  )
+  const computeForwardAmount = computeForward(
+    amountToReceive,
+    pair.from.asset.amount,
+    pair.to.asset.amount.minus(amountToReceive),
+    0
+  ).abs()
+  assetToGive.set_amount(computeForwardAmount)
+
   return {
     assetToGive,
     assetToReceive,
@@ -530,6 +557,7 @@ export const evolutiondex = {
   getTokensFor,
   getPair,
   getExchangeAssets,
+  getExchangeAssetsFromToken2,
   exchange,
   getUserPools,
   getAddLiquidityAssets,