refactor(swap): price impact calculation, beta tag (#2273)

Co-authored-by: tomiir <rocchitomas@gmail.com>
Co-authored-by: Sven <38101365+svenvoskamp@users.noreply.github.com>
Co-authored-by: Sven <fr.sven.fr@gmail.com>

packages/common/index.ts

@@ -2,6 +2,7 @@
 export { DateUtil } from './src/utils/DateUtil.js'
 export { NetworkUtil } from './src/utils/NetworkUtil.js'
 export { NumberUtil } from './src/utils/NumberUtil.js'
+export { InputUtil } from './src/utils/InputUtil.js'
 export { erc20ABI } from './src/contracts/erc20.js'
 export { NavigationUtil } from './src/utils/NavigationUtil.js'
 export { ConstantsUtil } from './src/utils/ConstantsUtil.js'

packages/common/src/utils/InputUtil.ts

@@ -0,0 +1,73 @@
+export const InputUtil = {
+  /**
+   * Custom key down event optimized for numeric inputs which is used on the swap
+   * @param event
+   * @param value
+   * @param onChange
+   */
+  numericInputKeyDown(
+    event: KeyboardEvent,
+    currentValue: string | undefined,
+    onChange: (value: string) => void
+  ) {
+    const allowedKeys = [
+      'Backspace',
+      'Meta',
+      'Ctrl',
+      'a',
+      'A',
+      'c',
+      'C',
+      'x',
+      'X',
+      'v',
+      'V',
+      'ArrowLeft',
+      'ArrowRight',
+      'Tab'
+    ]
+    const controlPressed = event.metaKey || event.ctrlKey
+    const selectAll = event.key === 'a' || event.key === 'A'
+    const copyKey = event.key === 'c' || event.key === 'C'
+    const pasteKey = event.key === 'v' || event.key === 'V'
+    const cutKey = event.key === 'x' || event.key === 'X'
+
+    const isComma = event.key === ','
+    const isDot = event.key === '.'
+    const isNumericKey = event.key >= '0' && event.key <= '9'
+
+    // If command/ctrl key is not pressed, doesn't allow for a, c, v
+    if (!controlPressed && (selectAll || copyKey || pasteKey || cutKey)) {
+      event.preventDefault()
+    }
+
+    // If current value is zero, and zero is pressed, prevent the zero from being added again
+    if (currentValue === '0' && !isComma && !isDot && event.key === '0') {
+      event.preventDefault()
+    }
+
+    // If current value is zero and any numeric key is pressed, replace the zero with the number
+    if (currentValue === '0' && isNumericKey) {
+      onChange(event.key)
+      event.preventDefault()
+    }
+
+    if (isComma || isDot) {
+      // If the first character is a dot or comma, add a zero before it
+      if (!currentValue) {
+        onChange('0.')
+        event.preventDefault()
+      }
+
+      // If the current value already has a dot or comma, prevent the new one from being added
+      if (currentValue?.includes('.') || currentValue?.includes(',')) {
+        event.preventDefault()
+      }
+    }
+
+    // If the character is not allowed and it's not a dot or comma, prevent it
+    if (!isNumericKey && !allowedKeys.includes(event.key) && !isDot && !isComma) {
+      event.preventDefault()
+    }
+  }
+}

packages/core/src/controllers/AccountController.ts

@@ -114,7 +114,11 @@ export const AccountController = {
       if (state.address && chainId) {
         const response = await BlockchainApiController.getBalance(state.address, chainId)
 
-        this.setTokenBalance(response.balances)
+        const filteredBalances = response.balances.filter(
+          balance => balance.quantity.decimals !== '0'
+        )
+
+        this.setTokenBalance(filteredBalances)
         SwapController.setBalances(SwapApiUtil.mapBalancesToSwapTokens(response.balances))
       }
     } catch (error) {

packages/core/src/controllers/BlockchainApiController.ts

@@ -11,6 +11,8 @@ import type {
   BlockchainApiGenerateSwapCalldataResponse,
   BlockchainApiGenerateApproveCalldataRequest,
   BlockchainApiGenerateApproveCalldataResponse,
+  BlockchainApiSwapQuoteRequest,
+  BlockchainApiSwapQuoteResponse,
   BlockchainApiSwapAllowanceRequest,
   BlockchainApiSwapAllowanceResponse,
   BlockchainApiGasPriceRequest,
@@ -140,6 +142,30 @@ export const BlockchainApiController = {
     })
   },
 
+  fetchSwapQuote({
+    projectId,
+    amount,
+    userAddress,
+    from,
+    to,
+    gasPrice
+  }: BlockchainApiSwapQuoteRequest) {
+    return api.get<BlockchainApiSwapQuoteResponse>({
+      path: `/v1/convert/quotes`,
+      headers: {
+        'Content-Type': 'application/json'
+      },
+      params: {
+        projectId,
+        amount,
+        userAddress,
+        from,
+        to,
+        gasPrice
+      }
+    })
+  },
+
   fetchSwapTokens({ projectId, chainId }: BlockchainApiSwapTokensRequest) {
     return api.get<BlockchainApiSwapTokensResponse>({
       path: `/v1/convert/tokens?projectId=${projectId}&chainId=${chainId}`
@@ -177,11 +203,15 @@ export const BlockchainApiController = {
     const { sdkType, sdkVersion } = OptionsController.state
 
     return api.get<BlockchainApiGasPriceResponse>({
-      path: `/v1/convert/gas-price?projectId=${projectId}&chainId=${chainId}`,
+      path: `/v1/convert/gas-price`,
       headers: {
         'Content-Type': 'application/json',
         'x-sdk-type': sdkType,
         'x-sdk-version': sdkVersion
+      },
+      params: {
+        projectId,
+        chainId
       }
     })
   },
@@ -220,16 +250,22 @@ export const BlockchainApiController = {
     const { sdkType, sdkVersion } = OptionsController.state
 
     return api.get<BlockchainApiGenerateApproveCalldataResponse>({
-      path: `/v1/convert/build-approve?projectId=${projectId}&userAddress=${userAddress}&from=${from}&to=${to}`,
+      path: `/v1/convert/build-approve`,
       headers: {
         'Content-Type': 'application/json',
         'x-sdk-type': sdkType,
         'x-sdk-version': sdkVersion
+      },
+      params: {
+        projectId,
+        userAddress,
+        from,
+        to
       }
     })
   },
 
-  async getBalance(address: string, chainId?: string) {
+  async getBalance(address: string, chainId?: string, forceUpdate?: string) {
     const { sdkType, sdkVersion } = OptionsController.state
 
     return api.get<BlockchainApiBalanceResponse>({
@@ -241,7 +277,8 @@ export const BlockchainApiController = {
       params: {
         currency: 'usd',
         projectId: OptionsController.state.projectId,
-        chainId
+        chainId,
+        forceUpdate
       }
     })
   },