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'
import { useEffect } from 'react'
import { PublicKey } from '@solana/web3.js'
import {
connectionSelector,
mangoClientSelector,
mangoGroupSelector,
} from '../stores/selectors'
import {
ReferrerIdRecordLayout,
ReferrerIdRecord,
} from '@blockworks-foundation/mango-client'
const MangoStoreUpdater = () => {
useHydrateStore()
return null
}
const WalletStoreUpdater = () => {
useWallet()
return null
}
const OpenOrdersStoreUpdater = () => {
useOpenOrders()
return null
}
const PerpPositionsStoreUpdater = () => {
usePerpPositions()
return null
}
const FetchReferrer = () => {
const setMangoStore = useMangoStore((s) => s.set)
const mangoClient = useMangoStore(mangoClientSelector)
const mangoGroup = useMangoStore(mangoGroupSelector)
const connection = useMangoStore(connectionSelector)
const router = useRouter()
const { query } = router
useEffect(() => {
const storeReferrer = async () => {
if (query.ref && mangoGroup) {
let referrerPk
if (query.ref.length === 44) {
referrerPk = new PublicKey(query.ref)
} else {
const { referrerPda } = await mangoClient.getReferrerPda(
mangoGroup,
query.ref as string
)
console.log('in App referrerPda', referrerPda)
const info = await connection.getAccountInfo(referrerPda)
console.log('in App referrerPda info', info)
if (info) {
const decoded = ReferrerIdRecordLayout.decode(info.data)
const referrerRecord = new ReferrerIdRecord(decoded)
referrerPk = referrerRecord.referrerMangoAccount
}
}
console.log('in App referrerPk from url is:', referrerPk)
setMangoStore((state) => {
state.referrerPk = referrerPk
})
}
}
storeReferrer()
}, [query, mangoGroup])
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 (
{marketTitleString}Mango Markets
)
}
function App({ Component, pageProps }) {
return (
<>
Mango Markets
)
}
export default appWithTranslation(App)