137 lines
4.6 KiB
TypeScript
137 lines
4.6 KiB
TypeScript
import Head from 'next/head'
|
|
import { ThemeProvider } from 'next-themes'
|
|
import '../node_modules/react-grid-layout/css/styles.css'
|
|
import '../node_modules/react-resizable/css/styles.css'
|
|
import 'intro.js/introjs.css'
|
|
import '../styles/index.css'
|
|
import useWallet from '../hooks/useWallet'
|
|
import useHydrateStore from '../hooks/useHydrateStore'
|
|
import Notifications from '../components/Notification'
|
|
import useMangoStore from '../stores/useMangoStore'
|
|
import useOraclePrice from '../hooks/useOraclePrice'
|
|
import { getDecimalCount } from '../utils'
|
|
import { useRouter } from 'next/router'
|
|
import { ViewportProvider } from '../hooks/useViewport'
|
|
import BottomBar from '../components/mobile/BottomBar'
|
|
import { appWithTranslation } from 'next-i18next'
|
|
import ErrorBoundary from '../components/ErrorBoundary'
|
|
import GlobalNotification from '../components/GlobalNotification'
|
|
import { useOpenOrders } from '../hooks/useOpenOrders'
|
|
import usePerpPositions from '../hooks/usePerpPositions'
|
|
|
|
const MangoStoreUpdater = () => {
|
|
useHydrateStore()
|
|
return null
|
|
}
|
|
|
|
const WalletStoreUpdater = () => {
|
|
useWallet()
|
|
return null
|
|
}
|
|
|
|
const OpenOrdersStoreUpdater = () => {
|
|
useOpenOrders()
|
|
return null
|
|
}
|
|
|
|
const PerpPositionsStoreUpdater = () => {
|
|
usePerpPositions()
|
|
return null
|
|
}
|
|
|
|
const PageTitle = () => {
|
|
const router = useRouter()
|
|
const marketConfig = useMangoStore((s) => s.selectedMarket.config)
|
|
const market = useMangoStore((s) => s.selectedMarket.current)
|
|
const oraclePrice = useOraclePrice()
|
|
const selectedMarketName = marketConfig.name
|
|
const marketTitleString =
|
|
marketConfig && router.pathname.includes('market')
|
|
? `${
|
|
oraclePrice
|
|
? oraclePrice.toFixed(getDecimalCount(market?.tickSize)) + ' | '
|
|
: ''
|
|
}${selectedMarketName} - `
|
|
: ''
|
|
|
|
return (
|
|
<Head>
|
|
<title>{marketTitleString}Mango Markets</title>
|
|
</Head>
|
|
)
|
|
}
|
|
|
|
function App({ Component, pageProps }) {
|
|
return (
|
|
<>
|
|
<Head>
|
|
<title>Mango Markets</title>
|
|
<link rel="preconnect" href="https://fonts.gstatic.com" />
|
|
<link
|
|
href="https://fonts.googleapis.com/css2?family=Lato:wght@200;300;400;500;600;700&display=swap"
|
|
rel="stylesheet"
|
|
/>
|
|
<link rel="icon" href="/favicon.ico" />
|
|
<meta property="og:title" content="Mango Markets" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
|
<meta
|
|
name="keywords"
|
|
content="Mango Markets, Serum, SRM, Serum DEX, DEFI, Decentralized Finance, Decentralised Finance, Crypto, ERC20, Ethereum, Decentralize, Solana, SOL, SPL, Cross-Chain, Trading, Fastest, Fast, SerumBTC, SerumUSD, SRM Tokens, SPL Tokens"
|
|
/>
|
|
<meta
|
|
name="description"
|
|
content="Mango Markets - Decentralised, cross-margin trading up to 10x leverage with lightning speed and near-zero fees."
|
|
/>
|
|
<link
|
|
rel="apple-touch-icon"
|
|
sizes="192x192"
|
|
href="/apple-touch-icon.png"
|
|
/>
|
|
<meta name="msapplication-TileColor" content="#da532c" />
|
|
<meta name="theme-color" content="#ffffff" />
|
|
<meta name="twitter:card" content="summary_large_image" />
|
|
<meta name="twitter:title" content="Mango Markets" />
|
|
<meta
|
|
name="twitter:description"
|
|
content="Mango Markets - Decentralised, cross-margin trading up to 10x leverage with lightning speed and near-zero fees."
|
|
/>
|
|
<meta name="twitter:image" content="/twitter-image.png" />
|
|
<meta name="google" content="notranslate" />
|
|
<script src="/datafeeds/udf/dist/polyfills.js"></script>
|
|
<script src="/datafeeds/udf/dist/bundle.js"></script>
|
|
|
|
<link rel="manifest" href="/manifest.json"></link>
|
|
</Head>
|
|
<ErrorBoundary>
|
|
<ErrorBoundary>
|
|
<PageTitle />
|
|
<MangoStoreUpdater />
|
|
<WalletStoreUpdater />
|
|
<OpenOrdersStoreUpdater />
|
|
<PerpPositionsStoreUpdater />
|
|
</ErrorBoundary>
|
|
|
|
<ThemeProvider defaultTheme="Mango">
|
|
<ViewportProvider>
|
|
<div className="bg-th-bkg-1 min-h-screen">
|
|
<ErrorBoundary>
|
|
<GlobalNotification />
|
|
<Component {...pageProps} />
|
|
</ErrorBoundary>
|
|
</div>
|
|
<div className="md:hidden fixed bottom-0 left-0 w-full z-20">
|
|
<ErrorBoundary>
|
|
<BottomBar />
|
|
</ErrorBoundary>
|
|
</div>
|
|
|
|
<Notifications />
|
|
</ViewportProvider>
|
|
</ThemeProvider>
|
|
</ErrorBoundary>
|
|
</>
|
|
)
|
|
}
|
|
|
|
export default appWithTranslation(App)
|