Merge branch 'dev' into myf-dev

src/App.tsx

@@ -1,6 +1,6 @@
 import React, { lazy, useEffect } from 'react'
 import { Router, Redirect, Route, Switch } from 'react-router-dom'
-import { ResetCSS, ConfigProvider } from '@pancakeswap/uikit'
+import { ResetCSS } from '@pancakeswap/uikit'
 import { useDispatch } from 'react-redux'
 import BigNumber from 'bignumber.js'
 import useEagerConnect from 'hooks/useEagerConnect'
@@ -10,7 +10,6 @@ import { initAxios } from 'utils/request'
 import useToast from 'hooks/useToast'
 import { useAccountEventListener } from 'hooks/useAccountEventListener'
 import { fetchUserInfo, clearUserInfo } from 'state/actions'
-import { useTranslation } from 'contexts/Localization'
 import { useAccount } from 'state/userInfo/hooks'
 import GlobalStyle from './style/Global'
 import Menu from './components/Menu'
@@ -71,7 +70,6 @@ const App: React.FC = () => {
   const dispatch = useDispatch()
   const toast = useToast()
   const account = useAccount()
-  const { t } = useTranslation()
 
   useEffect(() => {
     initAxios(() => {
@@ -83,7 +81,6 @@ const App: React.FC = () => {
   }, [account])
 
   return (
-    <ConfigProvider t={t}>
     <Router history={history}>
       <ResetCSS />
       <GlobalStyle />
@@ -186,7 +183,6 @@ const App: React.FC = () => {
       <ToastListener />
       <DatePickerPortal />
     </Router>
-    </ConfigProvider>
   )
 }
 

src/ConfigProviders.tsx

@@ -0,0 +1,14 @@
+import React from 'react'
+import { ConfigProvider, ModalProvider } from '@pancakeswap/uikit'
+import { useTranslation } from 'contexts/Localization'
+
+const ConfigProviders: React.FC = ({ children }) => {
+  const { t } = useTranslation()
+  return (
+    <ConfigProvider t={t}>
+      <ModalProvider>{children}</ModalProvider>
+    </ConfigProvider>
+  )
+}
+
+export default ConfigProviders

src/Providers.tsx

@@ -1,5 +1,4 @@
 import React from 'react'
-import { ModalProvider } from '@pancakeswap/uikit'
 import { Web3ReactProvider } from '@web3-react/core'
 import { HelmetProvider } from 'react-helmet-async'
 import { Provider } from 'react-redux'
@@ -9,6 +8,7 @@ import { LanguageProvider } from 'contexts/Localization'
 import { RefreshContextProvider } from 'contexts/RefreshContext'
 import { ToastsProvider } from 'contexts/ToastsContext'
 import store from 'state'
+import ConfigProviders from './ConfigProviders'
 
 const Providers: React.FC = ({ children }) => {
   return (
@@ -19,7 +19,7 @@ const Providers: React.FC = ({ children }) => {
             <ThemeContextProvider>
               <LanguageProvider>
                 <RefreshContextProvider>
-                  <ModalProvider>{children}</ModalProvider>
+                  <ConfigProviders>{children}</ConfigProviders>
                 </RefreshContextProvider>
               </LanguageProvider>
             </ThemeContextProvider>