import { useTranslation } from 'react-i18next'
import Tps, { StatusDot } from './Tps'
import DiscordIcon from './icons/DiscordIcon'
import { TwitterIcon } from './icons/TwitterIcon'
import { DocumentTextIcon, MapIcon } from '@heroicons/react/20/solid'
import { useEffect, useMemo, useState } from 'react'
import { IDL } from '@blockworks-foundation/mango-v4'
import RpcPing from './RpcPing'
import Tooltip from './shared/Tooltip'
import useOffchainServicesHealth from 'hooks/useOffchainServicesHealth'
import mangoStore from '@store/mangoStore'
import { Connection } from '@solana/web3.js'
import { sumBy } from 'lodash'
import useInterval from './shared/useInterval'
import { LinkButton } from './shared/Button'
import { useRouter } from 'next/router'
import { startAccountTour } from 'utils/tours'
import useMangoAccount from 'hooks/useMangoAccount'
const DEFAULT_LATEST_COMMIT = { sha: '', url: '' }
export const tpsAlertThreshold = 1300
export const tpsWarningThreshold = 1000
export const rpcAlertThreshold = 250
export const rpcWarningThreshold = 500
const getLatestCommit = async () => {
try {
const response = await fetch(
`https://api.github.com/repos/blockworks-foundation/mango-v4-ui/commits`,
)
const data = await response.json()
if (data && data.length) {
const { sha, html_url } = data[0]
return {
sha: sha.slice(0, 7),
url: html_url,
}
}
return DEFAULT_LATEST_COMMIT
} catch (error) {
console.error('Error fetching latest commit:', error)
return DEFAULT_LATEST_COMMIT
}
}
const getRecentPerformance = async (
connection: Connection,
setTps: (x: number) => void,
) => {
try {
const samples = 2
const response = await connection.getRecentPerformanceSamples(samples)
const totalSecs = sumBy(response, 'samplePeriodSecs')
const totalTransactions = sumBy(response, 'numTransactions')
const tps = totalTransactions / totalSecs
setTps(tps)
} catch {
console.warn('Unable to fetch TPS')
}
}
const getPingTime = async (
connection: Connection,
setRpcPing: (x: number) => void,
) => {
const startTime = Date.now()
try {
await connection.getSlot()
const endTime = Date.now()
const pingTime = endTime - startTime
setRpcPing(pingTime)
} catch (error) {
console.error('Error pinging the RPC:', error)
return null
}
}
const getOverallStatus = (
tps: number,
rpcPing: number,
offchainHealth: number,
) => {
if (tps < tpsWarningThreshold) {
return 'severly-degraded'
} else if (
tps < tpsAlertThreshold ||
rpcPing > rpcWarningThreshold ||
offchainHealth !== 200
) {
return 'degraded'
} else return 'operational'
}
const StatusBar = ({ collapsed }: { collapsed: boolean }) => {
const { t } = useTranslation('common')
const { mangoAccountAddress } = useMangoAccount()
const accountPageTab = mangoStore((s) => s.accountPageTab)
const router = useRouter()
const [latestCommit, setLatestCommit] = useState(DEFAULT_LATEST_COMMIT)
const { offchainHealth, isLoading: loadingOffchainHealth } =
useOffchainServicesHealth()
const connection = mangoStore((s) => s.connection)
const [tps, setTps] = useState(0)
const [rpcPing, setRpcPing] = useState(0)
useEffect(() => {
getPingTime(connection, setRpcPing)
}, [])
useInterval(() => {
getPingTime(connection, setRpcPing)
}, 30 * 1000)
useEffect(() => {
getRecentPerformance(connection, setTps)
}, [])
useInterval(() => {
getRecentPerformance(connection, setTps)
}, 60 * 1000)
useEffect(() => {
const { sha } = latestCommit
if (!sha) {
getLatestCommit().then((commit) => setLatestCommit(commit))
}
}, [latestCommit])
const platformHealth = useMemo(() => {
return getOverallStatus(tps, rpcPing, offchainHealth)
}, [tps, rpcPing, offchainHealth])
const dotColor =
platformHealth === 'severly-degraded'
? 'bg-th-error'
: platformHealth === 'degraded'
? 'bg-th-warning'
: 'bg-th-success'
return (
{!loadingOffchainHealth ? (
{t('offchain-services')}
) : null}
}
placement="top-start"
>
)
}
export default StatusBar