2022-04-20 19:37:44 +00:00
|
|
|
import './i18n';
|
2022-06-13 14:39:17 +00:00
|
|
|
|
|
|
|
import React, { useMemo } from 'react';
|
2022-04-20 19:37:44 +00:00
|
|
|
import { BrowserRouter as Router } from 'react-router-dom';
|
|
|
|
import { AppLoader } from './app-loader';
|
|
|
|
import { AppBanner } from './components/app-banner';
|
|
|
|
import { AppFooter } from './components/app-footer';
|
|
|
|
import { BalanceManager } from './components/balance-manager';
|
|
|
|
import { EthWallet } from './components/eth-wallet';
|
|
|
|
import { TemplateSidebar } from './components/page-templates/template-sidebar';
|
|
|
|
import { TransactionModal } from './components/transactions-modal';
|
|
|
|
import { VegaWallet } from './components/vega-wallet';
|
|
|
|
import { Web3Connector } from './components/web3-connector';
|
|
|
|
import { AppStateProvider } from './contexts/app-state/app-state-provider';
|
|
|
|
import { ContractsProvider } from './contexts/contracts/contracts-provider';
|
|
|
|
import { AppRouter } from './routes';
|
|
|
|
import { Web3Provider } from '@vegaprotocol/web3';
|
|
|
|
import { VegaWalletDialogs } from './components/vega-wallet-dialogs';
|
|
|
|
import { VegaWalletProvider } from '@vegaprotocol/wallet';
|
2022-06-13 14:39:17 +00:00
|
|
|
import { createConnectors } from './lib/web3-connectors';
|
|
|
|
import { ApolloProvider } from '@apollo/client';
|
|
|
|
import { createClient } from './lib/apollo-client';
|
|
|
|
import {
|
|
|
|
EnvironmentProvider,
|
|
|
|
useEnvironment,
|
|
|
|
} from '@vegaprotocol/network-switcher';
|
2022-04-20 19:37:44 +00:00
|
|
|
|
2022-06-13 14:39:17 +00:00
|
|
|
const AppContainer = () => {
|
2022-04-20 19:37:44 +00:00
|
|
|
const sideBar = React.useMemo(() => [<EthWallet />, <VegaWallet />], []);
|
2022-06-13 14:39:17 +00:00
|
|
|
const { ETHEREUM_PROVIDER_URL, ETHEREUM_CHAIN_ID, VEGA_URL } =
|
|
|
|
useEnvironment();
|
|
|
|
const Connectors = useMemo(
|
|
|
|
() => createConnectors(ETHEREUM_PROVIDER_URL, ETHEREUM_CHAIN_ID),
|
|
|
|
[ETHEREUM_CHAIN_ID, ETHEREUM_PROVIDER_URL]
|
|
|
|
);
|
|
|
|
const client = useMemo(() => createClient(VEGA_URL), [VEGA_URL]);
|
2022-04-20 19:37:44 +00:00
|
|
|
return (
|
2022-06-07 18:24:43 +00:00
|
|
|
<ApolloProvider client={client}>
|
2022-04-20 19:37:44 +00:00
|
|
|
<Router>
|
2022-06-13 14:39:17 +00:00
|
|
|
<AppStateProvider>
|
|
|
|
<Web3Provider connectors={Connectors}>
|
|
|
|
<Web3Connector>
|
|
|
|
<VegaWalletProvider>
|
|
|
|
<ContractsProvider>
|
|
|
|
<AppLoader>
|
|
|
|
<BalanceManager>
|
|
|
|
<>
|
|
|
|
<div className="app dark max-w-[1300px] mx-auto my-0 grid grid-rows-[min-content_1fr_min-content] min-h-full lg:border-l-1 lg:border-r-1 lg:border-white font-sans text-body lg:text-body-large text-white-80">
|
|
|
|
<AppBanner />
|
|
|
|
<TemplateSidebar sidebar={sideBar}>
|
|
|
|
<AppRouter />
|
|
|
|
</TemplateSidebar>
|
|
|
|
<AppFooter />
|
|
|
|
</div>
|
|
|
|
<VegaWalletDialogs />
|
|
|
|
<TransactionModal />
|
|
|
|
</>
|
|
|
|
</BalanceManager>
|
|
|
|
</AppLoader>
|
|
|
|
</ContractsProvider>
|
|
|
|
</VegaWalletProvider>
|
|
|
|
</Web3Connector>
|
|
|
|
</Web3Provider>
|
|
|
|
</AppStateProvider>
|
2022-04-20 19:37:44 +00:00
|
|
|
</Router>
|
2022-06-07 18:24:43 +00:00
|
|
|
</ApolloProvider>
|
2022-04-20 19:37:44 +00:00
|
|
|
);
|
2022-06-13 14:39:17 +00:00
|
|
|
};
|
|
|
|
|
|
|
|
function App() {
|
|
|
|
return (
|
|
|
|
<EnvironmentProvider>
|
|
|
|
<AppContainer />
|
|
|
|
</EnvironmentProvider>
|
|
|
|
);
|
2022-04-20 19:37:44 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
export default App;
|