vega-frontend-monorepo/apps/trading/pages/_app.page.tsx

89 lines
3.3 KiB
TypeScript
Raw Normal View History

import type { AppProps } from 'next/app';
import Head from 'next/head';
2022-02-17 05:08:17 +00:00
import { Navbar } from '../components/navbar';
import { t, ThemeContext, useThemeSwitcher } from '@vegaprotocol/react-helpers';
import {
VegaConnectDialog,
VegaManageDialog,
VegaWalletProvider,
} from '@vegaprotocol/wallet';
import { Connectors } from '../lib/vega-connectors';
import { useMemo, useState } from 'react';
2022-02-28 23:43:36 +00:00
import { createClient } from '../lib/apollo-client';
import { ThemeSwitcher } from '@vegaprotocol/ui-toolkit';
import { ApolloProvider } from '@apollo/client';
import { AppLoader } from '../components/app-loader';
import { VegaWalletConnectButton } from '../components/vega-wallet-connect-button';
import './styles.css';
2022-02-17 05:03:46 +00:00
function VegaTradingApp({ Component, pageProps }: AppProps) {
const client = useMemo(() => createClient(process.env['NX_VEGA_URL']), []);
const [vegaWallet, setVegaWallet] = useState({
connect: false,
manage: false,
});
const [theme, toggleTheme] = useThemeSwitcher();
return (
<ThemeContext.Provider value={theme}>
<ApolloProvider client={client}>
<VegaWalletProvider>
<AppLoader>
<Head>
<link
rel="preload"
href="https://static.vega.xyz/AlphaLyrae-Medium.woff2"
as="font"
type="font/woff2"
crossOrigin="anonymous"
/>
<title>{t('Welcome to Vega trading!')}</title>
<link
rel="icon"
type="image/x-icon"
href="https://static.vega.xyz/favicon.ico"
/>
<link rel="stylesheet" href="https://static.vega.xyz/fonts.css" />
</Head>
<div className="h-full dark:bg-black dark:text-white-60 bg-white text-black-60 grid grid-rows-[min-content,1fr]">
<div className="flex items-stretch border-b-[7px] border-vega-yellow">
<Navbar />
<div className="flex items-center gap-4 ml-auto mr-8">
<VegaWalletConnectButton
setConnectDialog={(open) =>
setVegaWallet((x) => ({ ...x, connect: open }))
}
setManageDialog={(open) =>
setVegaWallet((x) => ({ ...x, manage: open }))
}
/>
<ThemeSwitcher onToggle={toggleTheme} className="-my-4" />
</div>
</div>
<main data-testid={pageProps.page}>
Feat/224 move token app into monorepo (#229) * moved TFE into monorepo with some remaining errors * moved TFE into monorepo with some remaining errors - further files * add tailwind config, use etherscan link from toolkit, use web3 from lib * make app compatible with react router 6 * remove vega keys from app state and use from state from lib * comment out crowdin script injection * convert all buttons to use ui toolkit buttons * remove blueprint inputs and selects and replace with ui-toolkit * remove css resets * tidy button styles in wallet replace splash-screen with version from ui-toolkit * various style fixes * tidy up proposal list * add valid key to route children * Set custom port and config for token e2e tests * added env title e2e test * started some styling fixes - nav and home route * Added 'h-auto' to button height regex check * Added 'h-auto' to regex check to allow desired TFE button height * Removed scss and used tailwind for heading component * Woff files not woof :) * Proper nav h1 font size * Wallet card headings * Vega wallet button styles * Set project to use static hosted alpha font (cors being fixed separately) * Eth wallet button styles (unfinished) * Home route styles * Staking route styles and title calculation * Rewards route styles * Vega wallet container button style * Eth wallet disconnect button * Connect dialog title colour and spacing * Splash screen layout * Fixed a bunch of linting errors * Used 'Object.entries' instead of 'Array.from' to create iterable from object in 'use-search-params' * Removed use of 'any' from 'use-search-params' * Better simplification of 'use-search-params' * Removed package.json duplication errors, set most up-to-date version from duplicate options * Elvis for possible undefined in 'use-add-asset-to-wallet' * Removed redundant files * Removed old todo * Removed package.json redundant packages * Added dark class for dialog h1 text colour (required as the current scss gives a wrong default for this element) * update useAddAsset to use new provider * Ensure Jest has required methods * tidy up package.json * remove ts-ignores and use casts for dynamic grid imports * remove unused code from token-e2e * update to latest types from react 17 * Removed vegag wallet not running component as it should be handled by wallet lib * fix typing of contract addresses * type cast network string to Network enum in reduce * remove comment, issue 270 created instead * default associated wallet amounts to zero * update comment * delete unused staking-overview component, add note about withTranslation types to comment * re add proposal dates * enable source maps for build * add rest of env files for networks * remove crowdin script tags from index.html * add testing-library/jest-dom to types in test tsconfig * setup i18n for tests so that translations are used, proposal change table test * delete unused translation files and config * set sentry release to use commit ref * delete dex liquidity pages * remove unused useVegaLPStaking hook * use found id so no non null assertion needed * remove mocked graphql provider * remove commented out breadcrumb component * add comment and link to issue for syntax highlighter changes * fix any types in token-input, add link to ui-toolkit input changes * dont default allowance to zero as it affects rendering logic * fix spacing between callouts on associate page * adjust spacing between callout for association callout * fix alignment of ethereum splash screen * use ethereum connect dialog state for connect dialog * add infura provider as default * change from infura provider to JsonRpcProvider * remove unused Ethereum config * add custom webpack config to inject sentry plugin * delete commented out code for pending stake * add comment linking input elements issue for eth-address-input * move useEagerConnect to libs/wallet, add logic for connecting state so token app can load after connection has succeeded or failed * remove unused storage files, update web3 connector to render children if not actively connected Co-authored-by: Matthew Russell <mattrussell36@gmail.com>
2022-04-20 19:37:44 +00:00
{/* @ts-ignore conflict between @types/react and nextjs internal types */}
<Component {...pageProps} />
</main>
<VegaConnectDialog
connectors={Connectors}
dialogOpen={vegaWallet.connect}
setDialogOpen={(open) =>
setVegaWallet((x) => ({ ...x, connect: open }))
}
/>
<VegaManageDialog
dialogOpen={vegaWallet.manage}
setDialogOpen={(open) =>
setVegaWallet((x) => ({ ...x, manage: open }))
}
/>
2022-03-10 00:39:59 +00:00
</div>
</AppLoader>
</VegaWalletProvider>
</ApolloProvider>
</ThemeContext.Provider>
);
}
2022-02-17 05:03:46 +00:00
export default VegaTradingApp;