feat: 修改组件多语言问题

This commit is contained in:
gary 2022-05-12 18:43:21 +08:00
parent 2902d9aaa4
commit d0f326907b
3 changed files with 60 additions and 50 deletions

View File

@ -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,38 +81,37 @@ const App: React.FC = () => {
}, [account])
return (
<ConfigProvider t={t}>
<Router history={history}>
<ResetCSS />
<GlobalStyle />
<Menu>
<SuspenseWithChunkError fallback={<PageLoader />}>
<Switch>
<Route path="/" exact>
<Home />
</Route>
<Route exact path="/farms/auction">
<FarmAuction />
</Route>
<Route path="/farms">
<Farms />
</Route>
<Route path="/pools">
<Pools />
</Route>
<Route path="/referral">
<Referral />
</Route>
<Route path="/board">
<Board />
</Route>
<Route path="/nft">
<Nft />
</Route>
<Route path="/announcement">
<Announcement />
</Route>
{/* <Route path="/lottery">
<Router history={history}>
<ResetCSS />
<GlobalStyle />
<Menu>
<SuspenseWithChunkError fallback={<PageLoader />}>
<Switch>
<Route path="/" exact>
<Home />
</Route>
<Route exact path="/farms/auction">
<FarmAuction />
</Route>
<Route path="/farms">
<Farms />
</Route>
<Route path="/pools">
<Pools />
</Route>
<Route path="/referral">
<Referral />
</Route>
<Route path="/board">
<Board />
</Route>
<Route path="/nft">
<Nft />
</Route>
<Route path="/announcement">
<Announcement />
</Route>
{/* <Route path="/lottery">
<Lottery />
</Route>
<Route path="/ifo">
@ -149,7 +146,7 @@ const App: React.FC = () => {
</Route>
{/* Using this format because these components use routes injected props. We need to rework them with hooks */}
{/* <Route exact strict path="/swap" component={Swap} />
{/* <Route exact strict path="/swap" component={Swap} />
<Route exact strict path="/swap/:outputCurrency" component={RedirectToSwap} />
<Route exact strict path="/send" component={RedirectPathToSwapOnly} />
<Route exact strict path="/find" component={PoolFinder} />
@ -166,8 +163,8 @@ const App: React.FC = () => {
<Route exact strict path="/nft" component={Nft} />
<Route exact strict path="/announcement" component={Announcement} /> */}
{/* Redirect */}
{/* <Route path="/staking">
{/* Redirect */}
{/* <Route path="/staking">
<Redirect to="/pools" />
</Route>
<Route path="/syrup">
@ -177,16 +174,15 @@ const App: React.FC = () => {
<Redirect to="/collectibles" />
</Route> */}
{/* 404 */}
<Route component={NotFound} />
</Switch>
</SuspenseWithChunkError>
</Menu>
<EasterEgg iterations={2} />
<ToastListener />
<DatePickerPortal />
</Router>
</ConfigProvider>
{/* 404 */}
<Route component={NotFound} />
</Switch>
</SuspenseWithChunkError>
</Menu>
<EasterEgg iterations={2} />
<ToastListener />
<DatePickerPortal />
</Router>
)
}

14
src/ConfigProviders.tsx Normal file
View File

@ -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

View File

@ -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>