refactor(swap): bundle optimization

.gitignore

@@ -50,8 +50,6 @@ yalc.lock
 # vercel
 .vercel
 
-analyse.html
-
 # NX
 .nx
 

apps/cowswap-frontend/src/common/containers/CoWAmmBanner/index.tsx

@@ -1,4 +1,4 @@
-/* eslint-disable no-restricted-imports */ // TODO: Don't use 'modules' import
+/* eslint-disable @typescript-eslint/no-restricted-imports */ // TODO: Don't use 'modules' import
 import { useCallback } from 'react'
 
 import { useCowAnalytics } from '@cowprotocol/analytics'

apps/cowswap-frontend/src/common/containers/CoWAmmBanner/types.ts

@@ -1,4 +1,4 @@
-/* eslint-disable no-restricted-imports */ // TODO: Don't use 'modules' import
+/* eslint-disable @typescript-eslint/no-restricted-imports */ // TODO: Don't use 'modules' import
 import { LpToken } from '@cowprotocol/common-const'
 import { LpTokenProvider } from '@cowprotocol/types'
 import { BigNumber } from '@ethersproject/bignumber'

apps/cowswap-frontend/src/common/containers/OrderHooksDetails/HookItem/index.tsx

@@ -1,4 +1,4 @@
-/* eslint-disable no-restricted-imports */ // TODO: Don't use 'modules' import
+/* eslint-disable @typescript-eslint/no-restricted-imports */ // TODO: Don't use 'modules' import
 import { ReactNode, useState } from 'react'
 
 import { CowHookDetails, HookToDappMatch } from '@cowprotocol/hook-dapp-lib'

apps/cowswap-frontend/src/common/containers/OrderHooksDetails/index.tsx

@@ -1,4 +1,4 @@
-/* eslint-disable no-restricted-imports */ // TODO: Don't use 'modules' import
+/* eslint-disable @typescript-eslint/no-restricted-imports */ // TODO: Don't use 'modules' import
 import { ReactElement, useEffect, useMemo, useState } from 'react'
 
 import { cowAppDataLatestScheme } from '@cowprotocol/cow-sdk'

apps/cowswap-frontend/src/common/hooks/useCancelOrder/onChainCancellation.ts

@@ -1,4 +1,4 @@
-/* eslint-disable no-restricted-imports */ // TODO: Don't use 'modules' import
+/* eslint-disable @typescript-eslint/no-restricted-imports */ // TODO: Don't use 'modules' import
 import { GPv2Settlement, CoWSwapEthFlow } from '@cowprotocol/abis'
 import { calculateGasMargin } from '@cowprotocol/common-utils'
 import { BigNumber } from '@ethersproject/bignumber'

apps/cowswap-frontend/src/common/hooks/useCancelOrder/useGetOnChainCancellation.ts

@@ -1,4 +1,4 @@
-/* eslint-disable no-restricted-imports */ // TODO: Don't use 'modules' import
+/* eslint-disable @typescript-eslint/no-restricted-imports */ // TODO: Don't use 'modules' import
 import { useCallback } from 'react'
 
 import { getIsNativeToken } from '@cowprotocol/common-utils'

apps/cowswap-frontend/src/common/hooks/useCancelOrder/useSendOnChainCancellation.ts

@@ -1,4 +1,4 @@
-/* eslint-disable no-restricted-imports */ // TODO: Don't use 'modules' import
+/* eslint-disable @typescript-eslint/no-restricted-imports */ // TODO: Don't use 'modules' import
 import { useCallback } from 'react'
 
 import { getIsNativeToken } from '@cowprotocol/common-utils'

apps/cowswap-frontend/src/common/hooks/useConvertUsdToTokenValue.ts

@@ -1,4 +1,4 @@
-/* eslint-disable no-restricted-imports */ // TODO: Don't use 'modules' import
+/* eslint-disable @typescript-eslint/no-restricted-imports */ // TODO: Don't use 'modules' import
 import { USDC } from '@cowprotocol/common-const'
 import { getWrappedToken, tryParseCurrencyAmount } from '@cowprotocol/common-utils'
 import { SupportedChainId } from '@cowprotocol/cow-sdk'

apps/cowswap-frontend/src/common/hooks/useEnhancedActivityDerivedState.ts

@@ -1,4 +1,4 @@
-/* eslint-disable no-restricted-imports */ // TODO: Don't use 'modules' import
+/* eslint-disable @typescript-eslint/no-restricted-imports */ // TODO: Don't use 'modules' import
 import { useMemo } from 'react'
 
 import { SupportedChainId } from '@cowprotocol/cow-sdk'

apps/cowswap-frontend/src/common/hooks/useGetMarketDimension.ts

@@ -1,4 +1,4 @@
-/* eslint-disable no-restricted-imports */ // TODO: Don't use 'modules' import
+/* eslint-disable @typescript-eslint/no-restricted-imports */ // TODO: Don't use 'modules' import
 import { useMemo } from 'react'
 
 import { useTradeTypeInfo } from 'modules/trade'

apps/cowswap-frontend/src/common/hooks/useGetSurplusFiatValue.ts

@@ -1,4 +1,4 @@
-/* eslint-disable no-restricted-imports */ // TODO: Don't use 'modules' import
+/* eslint-disable @typescript-eslint/no-restricted-imports */ // TODO: Don't use 'modules' import
 import { useMemo } from 'react'
 
 import { MIN_FIAT_SURPLUS_VALUE, MIN_FIAT_SURPLUS_VALUE_MODAL, MIN_SURPLUS_UNITS } from '@cowprotocol/common-const'

apps/cowswap-frontend/src/common/hooks/useNavigate.ts

@@ -2,7 +2,7 @@ import { useCallback } from 'react'
 
 import { isInjectedWidget } from '@cowprotocol/common-utils'
 
-// eslint-disable-next-line no-restricted-imports
+// eslint-disable-next-line @typescript-eslint/no-restricted-imports
 import { NavigateOptions, To, useNavigate as useNavigateOriginal } from 'react-router'
 
 export type NavigateFunction = (to: To, options?: NavigateOptions) => void | Promise<void>

apps/cowswap-frontend/src/common/hooks/useOnSelectNetwork.tsx

@@ -1,4 +1,4 @@
-/* eslint-disable no-restricted-imports */ // TODO: Don't use 'modules' import
+/* eslint-disable @typescript-eslint/no-restricted-imports */ // TODO: Don't use 'modules' import
 import { useCallback } from 'react'
 
 import { getChainInfo } from '@cowprotocol/common-const'

apps/cowswap-frontend/src/common/hooks/useRateInfoParams.ts

@@ -1,4 +1,4 @@
-/* eslint-disable no-restricted-imports */ // TODO: Don't use 'modules' import
+/* eslint-disable @typescript-eslint/no-restricted-imports */ // TODO: Don't use 'modules' import
 import { useCallback } from 'react'
 
 import { tryParseCurrencyAmount } from '@cowprotocol/common-utils'

apps/cowswap-frontend/src/common/hooks/useSafeApiKit.ts

@@ -2,22 +2,22 @@ import { useEffect, useState } from 'react'
 
 import { createSafeApiKitInstance } from '@cowprotocol/core'
 import { useIsSafeWallet, useWalletInfo } from '@cowprotocol/wallet'
-import { useWalletProvider } from '@cowprotocol/wallet-provider'
-import SafeApiKit from '@safe-global/api-kit'
+import type SafeApiKit from '@safe-global/api-kit'
 
 export function useSafeApiKit(): SafeApiKit | null {
   const [safeApiClient, setSafeApiClient] = useState<SafeApiKit | null>(null)
   const { chainId } = useWalletInfo()
-  const provider = useWalletProvider()
   const isSafeWallet = useIsSafeWallet()
 
   useEffect(() => {
-    if (provider && chainId && isSafeWallet) {
-      setSafeApiClient(createSafeApiKitInstance(chainId, provider))
-    } else {
-      setSafeApiClient(null)
-    }
-  }, [chainId, isSafeWallet, provider])
+    ;(async () => {
+      if (chainId && isSafeWallet) {
+        setSafeApiClient(await createSafeApiKitInstance(chainId))
+      } else {
+        setSafeApiClient(null)
+      }
+    })()
+  }, [chainId, isSafeWallet])
 
   return safeApiClient
 }

apps/cowswap-frontend/src/common/hooks/useSwapAndBridgeContext.ts

@@ -1,4 +1,4 @@
-/* eslint-disable no-restricted-imports */ // TODO: Don't use 'modules' import
+/* eslint-disable @typescript-eslint/no-restricted-imports */ // TODO: Don't use 'modules' import
 import { useMemo } from 'react'
 
 import { getChainInfo, TokenWithLogo } from '@cowprotocol/common-const'

apps/cowswap-frontend/src/common/hooks/useSwapAndBridgeOverview.ts

@@ -1,4 +1,4 @@
-/* eslint-disable no-restricted-imports */ // TODO: Don't use 'modules' import
+/* eslint-disable @typescript-eslint/no-restricted-imports */ // TODO: Don't use 'modules' import
 import { useMemo } from 'react'
 
 import { getChainInfo, TokenWithLogo } from '@cowprotocol/common-const'

apps/cowswap-frontend/src/common/hooks/useSwapResultsContext.ts

@@ -1,4 +1,4 @@
-/* eslint-disable no-restricted-imports */ // TODO: Don't use 'modules' import
+/* eslint-disable @typescript-eslint/no-restricted-imports */ // TODO: Don't use 'modules' import
 import { useMemo } from 'react'
 
 import { TokenWithLogo } from '@cowprotocol/common-const'

apps/cowswap-frontend/src/common/pure/CoWAmmBannerContent/index.tsx

@@ -1,4 +1,4 @@
-/* eslint-disable no-restricted-imports */ // TODO: Don't use 'modules' import
+/* eslint-disable @typescript-eslint/no-restricted-imports */ // TODO: Don't use 'modules' import
 import React, { useCallback, useMemo, useRef } from 'react'
 
 import { useMediaQuery } from '@cowprotocol/common-hooks'

apps/cowswap-frontend/src/common/pure/ConfirmationPendingContent/ConfirmationPendingContentShell.tsx

@@ -1,4 +1,4 @@
-/* eslint-disable no-restricted-imports */ // TODO: Don't use 'modules' import
+/* eslint-disable @typescript-eslint/no-restricted-imports */ // TODO: Don't use 'modules' import
 import React, { ReactNode } from 'react'
 
 import { Command } from '@cowprotocol/types'

apps/cowswap-frontend/src/common/pure/CurrencyInputPanel/CurrencyInputPanel.tsx

@@ -1,4 +1,4 @@
-/* eslint-disable no-restricted-imports */ // TODO: Don't use 'modules' import
+/* eslint-disable @typescript-eslint/no-restricted-imports */ // TODO: Don't use 'modules' import
 import React, { ReactNode, useCallback, useEffect, useMemo, useState } from 'react'
 
 import { NATIVE_CURRENCIES } from '@cowprotocol/common-const'

apps/cowswap-frontend/src/common/pure/CurrencyInputPanel/types.ts

@@ -1,4 +1,4 @@
-/* eslint-disable no-restricted-imports */ // TODO: Don't use 'modules' import
+/* eslint-disable @typescript-eslint/no-restricted-imports */ // TODO: Don't use 'modules' import
 import { ReactNode } from 'react'
 
 import { Currency, CurrencyAmount } from '@uniswap/sdk-core'

apps/cowswap-frontend/src/common/pure/ExecutionPrice/hooks/useExecutionPriceFiat.ts

@@ -1,4 +1,4 @@
-/* eslint-disable no-restricted-imports */ // TODO: Don't use 'modules' import
+/* eslint-disable @typescript-eslint/no-restricted-imports */ // TODO: Don't use 'modules' import
 import { rawToTokenAmount } from '@cowprotocol/common-utils'
 import { Currency, CurrencyAmount, Price } from '@uniswap/sdk-core'
 

apps/cowswap-frontend/src/common/pure/ReceiveAmount/index.tsx

@@ -1,4 +1,4 @@
-/* eslint-disable no-restricted-imports */ // TODO: Don't use 'modules' import
+/* eslint-disable @typescript-eslint/no-restricted-imports */ // TODO: Don't use 'modules' import
 import { ReactNode } from 'react'
 
 import { TokenAmount } from '@cowprotocol/ui'

apps/cowswap-frontend/src/common/pure/ReceiveAmountInfo/index.tsx

@@ -1,4 +1,4 @@
-/* eslint-disable no-restricted-imports */ // TODO: Don't use 'modules' import
+/* eslint-disable @typescript-eslint/no-restricted-imports */ // TODO: Don't use 'modules' import
 import React, { ReactNode } from 'react'
 
 import { isFractionFalsy } from '@cowprotocol/common-utils'

apps/cowswap-frontend/src/common/types.ts

@@ -24,7 +24,7 @@ export type SafeTransactionParams = {
   submissionDate: string
   executionDate: string | null
   isExecuted: boolean
-  nonce: number
+  nonce: string
   confirmationsRequired: number
   confirmations: number
   safeTxHash: string

apps/cowswap-frontend/src/common/updaters/SentryUpdater.ts

@@ -1,4 +1,4 @@
-/* eslint-disable no-restricted-imports */ // TODO: Don't use 'modules' import
+/* eslint-disable @typescript-eslint/no-restricted-imports */ // TODO: Don't use 'modules' import
 import { useEffect } from 'react'
 
 import { useIsWindowVisible } from '@cowprotocol/common-hooks'

apps/cowswap-frontend/src/common/updaters/WidgetTokensUpdater.tsx

@@ -1,4 +1,4 @@
-/* eslint-disable no-restricted-imports */ // TODO: Don't use 'modules' import
+/* eslint-disable @typescript-eslint/no-restricted-imports */ // TODO: Don't use 'modules' import
 import { ReactNode } from 'react'
 
 import { useCowAnalytics } from '@cowprotocol/analytics'

apps/cowswap-frontend/src/common/updaters/orders/CancelledOrdersUpdater.ts

@@ -1,4 +1,4 @@
-/* eslint-disable no-restricted-imports */ // TODO: Don't use 'modules' import
+/* eslint-disable @typescript-eslint/no-restricted-imports */ // TODO: Don't use 'modules' import
 import { useCallback, useEffect, useRef } from 'react'
 
 import { CANCELLED_ORDERS_PENDING_TIME } from '@cowprotocol/common-const'

apps/cowswap-frontend/src/common/updaters/orders/OrdersFromApiUpdater.ts

@@ -1,4 +1,4 @@
-/* eslint-disable no-restricted-imports */ // TODO: Don't use 'modules' import
+/* eslint-disable @typescript-eslint/no-restricted-imports */ // TODO: Don't use 'modules' import
 import { useSetAtom } from 'jotai'
 import { useCallback, useEffect, useMemo, useRef } from 'react'
 

apps/cowswap-frontend/src/common/updaters/orders/PendingOrdersUpdater.ts

@@ -1,4 +1,4 @@
-/* eslint-disable no-restricted-imports */ // TODO: Don't use 'modules' import
+/* eslint-disable @typescript-eslint/no-restricted-imports */ // TODO: Don't use 'modules' import
 import { useSetAtom } from 'jotai'
 import { useCallback, useEffect, useMemo, useRef } from 'react'
 
@@ -88,7 +88,11 @@ async function _updatePresignGnosisSafeTx(
            * If an order has a nonce lower than the current Safe nonce, it means that the proposed transaction was replaced by another one.
            * In this case, we should cancel the order.
            */
-          const isOrderTxReplaced = !!(safeNonce && safeTransaction.nonce < safeNonce && !safeTransaction.isExecuted)
+          const isOrderTxReplaced = !!(
+            safeNonce &&
+            BigInt(safeTransaction.nonce) < BigInt(safeNonce) &&
+            !safeTransaction.isExecuted
+          )
 
           if (CREATING_STATES.includes(order.status) && isOrderTxReplaced) {
             cancelOrdersBatch({

apps/cowswap-frontend/src/common/updaters/orders/SpotPricesUpdater.ts

@@ -1,4 +1,4 @@
-/* eslint-disable no-restricted-imports */ // TODO: Don't use 'modules' import
+/* eslint-disable @typescript-eslint/no-restricted-imports */ // TODO: Don't use 'modules' import
 import { useSetAtom } from 'jotai'
 import { useEffect, useMemo } from 'react'
 

apps/cowswap-frontend/src/common/updaters/orders/UnfillableOrdersUpdater/hooks/useUpdateIsUnfillableFlag.ts

@@ -1,4 +1,4 @@
-/* eslint-disable no-restricted-imports */ // TODO: Don't use 'modules' import
+/* eslint-disable @typescript-eslint/no-restricted-imports */ // TODO: Don't use 'modules' import
 import { useSetAtom } from 'jotai'
 import { useCallback } from 'react'
 

apps/cowswap-frontend/src/common/updaters/orders/UnfillableOrdersUpdater/updaters/UnfillableOrderUpdater.ts

@@ -1,4 +1,4 @@
-/* eslint-disable no-restricted-imports */ // TODO: Don't use 'modules' import
+/* eslint-disable @typescript-eslint/no-restricted-imports */ // TODO: Don't use 'modules' import
 import { useAtom, useSetAtom } from 'jotai'
 import { useRef } from 'react'
 

apps/cowswap-frontend/src/common/utils/doesOrderHavePermit.ts

@@ -1,4 +1,4 @@
-/* eslint-disable no-restricted-imports */ // TODO: Don't use 'modules' import
+/* eslint-disable @typescript-eslint/no-restricted-imports */ // TODO: Don't use 'modules' import
 import { doesHookHavePermit } from '@cowprotocol/hook-dapp-lib'
 
 import { getAppDataHooks } from 'modules/appData'

apps/cowswap-frontend/src/legacy/hooks/useGetSafeTxInfo.ts

@@ -3,31 +3,24 @@ import { useCallback } from 'react'
 import { retry, RetryOptions } from '@cowprotocol/common-utils'
 import { getSafeTransaction } from '@cowprotocol/core'
 import { useWalletInfo } from '@cowprotocol/wallet'
-import { useWalletProvider } from '@cowprotocol/wallet-provider'
-import type { SafeMultisigTransactionResponse } from '@safe-global/safe-core-sdk-types'
+import type { SafeMultisigTransactionResponse } from '@safe-global/types-kit'
 
-import { t } from '@lingui/core/macro'
 import { RetryResult } from 'types'
 
 const DEFAULT_RETRY_OPTIONS: RetryOptions = { n: 3, minWait: 1000, maxWait: 3000 }
 
 export type GetSafeTxInfo = (hash: string) => RetryResult<SafeMultisigTransactionResponse>
 
 export function useGetSafeTxInfo(): GetSafeTxInfo {
-  const provider = useWalletProvider()
   const { chainId } = useWalletInfo()
 
   const getSafeInfo = useCallback<GetSafeTxInfo>(
     (hash) => {
       return retry(() => {
-        if (!provider) {
-          throw new Error(t`There is no provider to get Gnosis safe info`)
-        }
-
-        return getSafeTransaction(chainId, hash, provider)
+        return getSafeTransaction(chainId, hash)
       }, DEFAULT_RETRY_OPTIONS)
     },
-    [chainId, provider],
+    [chainId],
   )
 
   return getSafeInfo

apps/cowswap-frontend/src/legacy/state/enhancedTransactions/actions.ts

@@ -1,4 +1,4 @@
-import type { SafeMultisigTransactionResponse } from '@safe-global/safe-core-sdk-types'
+import type { SafeMultisigTransactionResponse } from '@safe-global/types-kit'
 
 import { createAction } from '@reduxjs/toolkit'
 

apps/cowswap-frontend/src/legacy/state/enhancedTransactions/reducer.ts

@@ -1,5 +1,5 @@
 import { OrderClass } from '@cowprotocol/cow-sdk'
-import type { SafeMultisigTransactionResponse } from '@safe-global/safe-core-sdk-types'
+import type { SafeMultisigTransactionResponse } from '@safe-global/types-kit'
 
 import { createReducer } from '@reduxjs/toolkit'
 
@@ -22,7 +22,7 @@ export enum HashType {
 export interface EnhancedTransactionDetails {
   hash: string // The hash of the transaction, normally Ethereum one, but not necessarily
   hashType: HashType // Transaction hash: could be Ethereum tx, or for multisigs could be some kind of hash identifying the order (i.e. Gnosis Safe)
-  transactionHash?: string // Transaction hash. For EOA this field is immediately available, however, other wallets go through a process of offchain signing before the transactionHash is available
+  transactionHash: string | null // Transaction hash. For EOA this field is immediately available, however, other wallets go through a process of offchain signing before the transactionHash is available
   nonce: number
 
   // Params using for polling handling
@@ -122,7 +122,7 @@ export default createReducer(initialState, (builder) =>
         const txs = transactions[chainId] ?? {}
         txs[hash] = {
           hash,
-          transactionHash: hashType === HashType.ETHEREUM_TX ? hash : undefined,
+          transactionHash: hashType === HashType.ETHEREUM_TX ? hash : null,
           nonce,
           hashType,
           addedTime: now(),

apps/cowswap-frontend/src/legacy/state/orders/actions.ts

@@ -1,6 +1,6 @@
 import { EnrichedOrder, OrderClass, OrderCreation, SupportedChainId as ChainId, UID } from '@cowprotocol/cow-sdk'
 import { BigNumberish } from '@ethersproject/bignumber'
-import type { SafeMultisigTransactionResponse } from '@safe-global/safe-core-sdk-types'
+import type { SafeMultisigTransactionResponse } from '@safe-global/types-kit'
 import { Currency, CurrencyAmount, Token } from '@uniswap/sdk-core'
 
 import { createAction } from '@reduxjs/toolkit'

apps/cowswap-frontend/src/lib/i18n.tsx

@@ -50,10 +50,15 @@ export function Provider({ locale, onActivate, children }: ProviderProps): React
   // This renders the translation _keys_, not the translation _messages_, which is only acceptable while loading the DEFAULT_LOCALE,
   // as [there are no "default" messages](https://github.com/lingui/js-lingui/issues/388#issuecomment-497779030).
   // See https://github.com/lingui/js-lingui/issues/1194#issuecomment-1068488619.
+  // TODO: i18n.locale is '', not undefined
   if (i18n.locale === undefined && locale === DEFAULT_LOCALE) {
     i18n.load(DEFAULT_LOCALE, {})
     i18n.activate(DEFAULT_LOCALE)
   }
 
+  /**
+   * TODO: if i18n is not activated (i18n.locale === ''), then I18nProvider renders null on initial render
+   * we should detect locale and load messages BEFORE initial render
+   */
   return <I18nProvider i18n={i18n}>{children}</I18nProvider>
 }

apps/cowswap-frontend/src/modules/erc20Approve/containers/TradeApproveButton/TradeApproveButton.tsx

@@ -26,7 +26,7 @@ export interface TradeApproveButtonProps {
   children?: ReactNode
   isDisabled?: boolean
   enablePartialApprove?: boolean
-  onApproveConfirm?: (txHash?: string) => void
+  onApproveConfirm?: (txHash: string | null) => void
   label?: string
   buttonSize?: ButtonSize
   useModals?: boolean

apps/cowswap-frontend/src/modules/erc20Approve/hooks/useApproveAndSwap.ts

@@ -17,7 +17,7 @@ import { getIsTradeApproveResult } from '../utils/getIsTradeApproveResult'
 export interface ApproveAndSwapProps {
   amountToApprove: CurrencyAmount<Currency>
   minAmountToSignForSwap?: CurrencyAmount<Currency>
-  onApproveConfirm?: (transactionHash?: string) => void
+  onApproveConfirm?: (transactionHash: string | null) => void
   ignorePermit?: boolean
   useModals?: boolean
 }
@@ -41,7 +41,7 @@ export function useApproveAndSwap({
     if (isPermitSupported && onApproveConfirm) {
       const isPermitSigned = await generatePermitToTrade()
       if (isPermitSigned) {
-        onApproveConfirm()
+        onApproveConfirm(null)
       }
 
       return true

apps/cowswap-frontend/src/modules/erc20Approve/hooks/useApproveCurrency.ts

@@ -1,7 +1,7 @@
 import { useCallback } from 'react'
 
 import { Nullish } from '@cowprotocol/types'
-import { SafeMultisigTransactionResponse } from '@safe-global/safe-core-sdk-types'
+import type { SafeMultisigTransactionResponse } from '@safe-global/types-kit'
 import { Currency, CurrencyAmount } from '@uniswap/sdk-core'
 
 import { GenerecTradeApproveResult, useTradeApproveCallback } from 'modules/erc20Approve'

apps/cowswap-frontend/src/modules/erc20Approve/utils/getIsTradeApproveResult.ts

@@ -1,5 +1,5 @@
 import { Nullish } from '@cowprotocol/types'
-import { SafeMultisigTransactionResponse } from '@safe-global/safe-core-sdk-types'
+import type { SafeMultisigTransactionResponse } from '@safe-global/types-kit'
 
 import { GenerecTradeApproveResult } from '../containers'