delete package lock

re-invert rates

make slippage parsing more explicit

src/components/ExchangePage/index.jsx

@@ -27,13 +27,13 @@ const TOKEN_TO_ETH = 1
 const TOKEN_TO_TOKEN = 2
 
 // denominated in bips
-const ALLOWED_SLIPPAGE_DEFAULT = 150
-const TOKEN_ALLOWED_SLIPPAGE_DEFAULT = 200
+const ALLOWED_SLIPPAGE_DEFAULT = 100
+const TOKEN_ALLOWED_SLIPPAGE_DEFAULT = 100
 
-// denominated in seconds
+// 15 minutes, denominated in seconds
 const DEADLINE_FROM_NOW = 60 * 15
 
-// denominated in bips
+// % above the calculated gas cost that we actually send, denominated in bips
 const GAS_MARGIN = ethers.utils.bigNumberify(1000)
 
 const DownArrowBackground = styled.div`
@@ -240,15 +240,15 @@ export default function ExchangePage({ initialCurrency, sending }) {
   const [rawSlippage, setRawSlippage] = useState(ALLOWED_SLIPPAGE_DEFAULT)
   const [rawTokenSlippage, setRawTokenSlippage] = useState(TOKEN_ALLOWED_SLIPPAGE_DEFAULT)
 
-  let allowedSlippageBig = ethers.utils.bigNumberify(rawSlippage)
-  let tokenAllowedSlippageBig = ethers.utils.bigNumberify(rawTokenSlippage)
+  const allowedSlippageBig = ethers.utils.bigNumberify(rawSlippage)
+  const tokenAllowedSlippageBig = ethers.utils.bigNumberify(rawTokenSlippage)
 
   // analytics
   useEffect(() => {
     ReactGA.pageview(window.location.pathname + window.location.search)
   }, [])
 
-  // core swap state-
+  // core swap state
   const [swapState, dispatchSwapState] = useReducer(swapStateReducer, initialCurrency, getInitialSwapState)
   const { independentValue, dependentValue, independentField, inputCurrency, outputCurrency } = swapState
 
@@ -258,7 +258,7 @@ export default function ExchangePage({ initialCurrency, sending }) {
   // get swap type from the currency types
   const swapType = getSwapType(inputCurrency, outputCurrency)
 
-  // get decimals and exchange addressfor each of the currency types
+  // get decimals and exchange address for each of the currency types
   const { symbol: inputSymbol, decimals: inputDecimals, exchangeAddress: inputExchangeAddress } = useTokenDetails(
     inputCurrency
   )
@@ -661,13 +661,13 @@ export default function ExchangePage({ initialCurrency, sending }) {
           {inverted ? (
             <span>
               {exchangeRate
-                ? `1 ${outputSymbol} = ${amountFormatter(exchangeRateInverted, 18, 4, false)} ${inputSymbol}`
+                ? `1 ${inputSymbol} = ${amountFormatter(exchangeRate, 18, 4, false)} ${outputSymbol}`
                 : ' - '}
             </span>
           ) : (
             <span>
               {exchangeRate
-                ? `1 ${inputSymbol} = ${amountFormatter(exchangeRate, 18, 4, false)} ${outputSymbol}`
+                ? `1 ${outputSymbol} = ${amountFormatter(exchangeRateInverted, 18, 4, false)} ${inputSymbol}`
                 : ' - '}
             </span>
           )}

src/components/TransactionDetails/index.js

@@ -480,10 +480,10 @@ export default function TransactionDetails(props) {
               }
             >
               {activeIndex === 4 && warningType.toString() === 'none' && 'Custom slippage value entered'}
-              {warningType === WARNING_TYPE.emptyInput && 'Enter a slippage percentage.'}
-              {warningType === WARNING_TYPE.invalidEntryBound && 'Please select value less than 50%'}
-              {warningType === WARNING_TYPE.riskyEntryHigh && 'Your transaction may be frontrun.'}
-              {warningType === WARNING_TYPE.riskyEntryLow && 'Your transaction may fail.'}
+              {warningType === WARNING_TYPE.emptyInput && 'Enter a slippage percentage'}
+              {warningType === WARNING_TYPE.invalidEntryBound && 'Please select a value no greater than 50%'}
+              {warningType === WARNING_TYPE.riskyEntryHigh && 'Your transaction may be frontrun'}
+              {warningType === WARNING_TYPE.riskyEntryLow && 'Your transaction may fail'}
             </BottomError>
           </SlippageRow>
         </SlippageSelector>
@@ -495,7 +495,7 @@ export default function TransactionDetails(props) {
     setActiveIndex(4)
     inputRef.current.focus()
     // if there's a value, evaluate the bounds
-    checkBounds(userInput)
+    checkBounds(debouncedInput)
   }
 
   // used for slippage presets
@@ -517,20 +517,20 @@ export default function TransactionDetails(props) {
     }
 
     // check bounds and set errors
-    if (slippageValue < 0 || slippageValue > 50) {
+    if (Number(slippageValue) < 0 || Number(slippageValue) > 50) {
       props.setcustomSlippageError('invalid')
       return setWarningType(WARNING_TYPE.invalidEntryBound)
     }
-    if (slippageValue >= 0 && slippageValue < 0.1) {
+    if (Number(slippageValue) >= 0 && Number(slippageValue) < 0.1) {
       props.setcustomSlippageError('valid')
       setWarningType(WARNING_TYPE.riskyEntryLow)
     }
-    if (slippageValue > 5) {
+    if (Number(slippageValue) > 5) {
       props.setcustomSlippageError('warning')
       setWarningType(WARNING_TYPE.riskyEntryHigh)
     }
     //update the actual slippage value in parent
-    updateSlippage(slippageValue)
+    updateSlippage(Number(slippageValue))
   }
 
   // check that the theyve entered number and correct decimal
@@ -547,7 +547,7 @@ export default function TransactionDetails(props) {
 
   const updateSlippage = newSlippage => {
     // round to 2 decimals to prevent ethers error
-    let numParsed = parseFloat((newSlippage * 100).toFixed(2))
+    let numParsed = parseInt(newSlippage * 100)
 
     // set both slippage values in parents
     props.setRawSlippage(numParsed)