refactor: network alert config

deltaDAO · Mar 15, 2024 · 5ebc573 · 5ebc573
1 parent 1625516
commit 5ebc573
Show file tree

Hide file tree

Showing 3 changed files with 24 additions and 14 deletions.
diff --git a/app.config.js b/app.config.js
@@ -97,8 +97,14 @@ module.exports = {
   // Display alert banner for the developer preview deployment
   showPreviewAlert: process.env.NEXT_PUBLIC_SHOW_PREVIEW_ALERT || 'false',
 
-  // Show network alerts based on chainId
-  networkAlertApi: {
-    100: 'https://status.genx.delta-dao.com/api/check-blocks'
+  networkAlertConfig: {
+    // Refresh interval for network status - 30 sec
+    refreshInterval: 30000,
+    // Margin of error for block count (how much difference between min / max block numbers before showing an alert)
+    errorMargin: 10,
+    // Map chainIds to their respective status endpoints
+    statusEndpoints: {
+      100: 'https://status.genx.delta-dao.com/api/check-blocks'
+    }
   }
 }
diff --git a/src/@context/MarketMetadata/_types.ts b/src/@context/MarketMetadata/_types.ts
@@ -36,8 +36,15 @@ export interface AppConfig {
     roughTxGasEstimate: number
   }
   showPreviewAlert: string
-  networkAlertApi: {
-    [chainId: number]: string
+  networkAlertConfig: {
+    // Refresh interval for network status - 30 sec
+    refreshInterval: number
+    // Margin of error for block count (how much difference between min / max block numbers before showing an alert)
+    errorMargin: number
+    // Map chainIds to their respective status endpoints
+    statusEndpoints: {
+      [chainId: number]: string
+    }
   }
 }
 export interface SiteContent {

diff --git a/src/components/@shared/NetworkStatus/index.tsx b/src/components/@shared/NetworkStatus/index.tsx
@@ -10,21 +10,18 @@ export default function NetworkStatus({
 }: {
   className?: string
 }): ReactElement {
-  const [showNetworkAlert, setShowNetworkAlert] = useState(false)
+  const [showNetworkAlert, setShowNetworkAlert] = useState(true)
   const [network, setNetwork] = useState<string>()
   const { appConfig } = useMarketMetadata()
   const { chain } = useNetwork()
 
-  // Refresh interval for network status - 30 sec
-  const refreshInterval = 30000
-  // Margin of error for block count (how much difference between min / max block numbers before showing an alert)
-  const errorMargin = 5
+  const { networkAlertConfig } = appConfig
 
   const fetchNetworkStatus = useCallback(
     async (chainId: number) => {
       if (!chainId) return
       setNetwork(chain?.name)
-      const apiEndpoint = appConfig.networkAlertApi[chainId]
+      const apiEndpoint = networkAlertConfig.statusEndpoints[chainId]
       if (!apiEndpoint) return
       LoggerInstance.log(`[NetworkStatus] retrieving network status`, {
         apiEndpoint
@@ -39,7 +36,7 @@ export default function NetworkStatus({
           if (!minBlock || block < minBlock) minBlock = block
           if (!maxBlock || block > maxBlock) maxBlock = block
         })
-        const hasError = maxBlock - minBlock > errorMargin
+        const hasError = maxBlock - minBlock > networkAlertConfig.errorMargin
         setShowNetworkAlert(hasError)
         LoggerInstance.log(`[NetworkStatus] network status updated:`, {
           minBlock,
@@ -53,7 +50,7 @@ export default function NetworkStatus({
         )
       }
     },
-    [appConfig.networkAlertApi, chain]
+    [networkAlertConfig, chain]
   )
 
   useEffect(() => {
@@ -64,7 +61,7 @@ export default function NetworkStatus({
     // init periodic refresh for network status
     const networkStatusInterval = setInterval(
       () => fetchNetworkStatus(chain?.id),
-      refreshInterval
+      networkAlertConfig.refreshInterval
     )
 
     return () => {