fix(proposals): protocol upgrade notification block querying

libs/proposals/src/components/protocol-upgrade-in-progress-notification.tsx

@@ -26,22 +26,36 @@ export const ProtocolUpgradeInProgressNotification = () => {
   const [nextUpgrade] = useLocalStorageSnapshot(
     NEXT_PROTOCOL_UPGRADE_PROPOSAL_SNAPSHOT
   );
-  const { blocksRising, block } = useBlockRising();
   const detailsLink = useProtocolUpgradeProposalLink();
 
   let vegaReleaseTag: string | undefined;
   let upgradeBlockHeight: string | undefined;
 
-  if (error && !data && nextUpgrade && ALLOW_STORED_PROPOSAL_DATA) {
+  const hasData = data && !error;
+  const hasStoredData = nextUpgrade && ALLOW_STORED_PROPOSAL_DATA;
+
+  if (hasData) {
+    // gets tag and height from the data api
+    vegaReleaseTag = data.vegaReleaseTag;
+    upgradeBlockHeight = data.upgradeBlockHeight;
+  } else if (hasStoredData) {
+    // gets tag and height from stored value if data api is unavailable
     try {
       const stored = JSON.parse(nextUpgrade) as StoredNextProtocolUpgradeData;
       vegaReleaseTag = stored.vegaReleaseTag;
       upgradeBlockHeight = stored.upgradeBlockHeight;
     } catch {
-      // no op
+      // NOOP - could not parse stored data
     }
   }
 
+  const hasUpgradeInfo = vegaReleaseTag && upgradeBlockHeight;
+
+  const { blocksRising, block } = useBlockRising(
+    // skips querying blocks if there's no upgrade information available
+    !hasUpgradeInfo
+  );
+
   /**
    * If upgrade is in progress then none of the nodes should produce blocks,
    * same should be with the tendermint block info otherwise it's a network
@@ -50,10 +64,7 @@ export const ProtocolUpgradeInProgressNotification = () => {
    * Once the networks is back then the notification disappears.
    */
   const upgradeInProgress =
-    vegaReleaseTag &&
+    hasUpgradeInfo && !blocksRising && block <= Number(upgradeBlockHeight);
-    upgradeBlockHeight &&
-    !blocksRising &&
-    block <= Number(upgradeBlockHeight);
 
   if (!upgradeInProgress) return null;
 

libs/proposals/src/lib/protocol-upgrade-proposals/use-block-rising.ts

@@ -15,31 +15,33 @@ const CHECK_INTERVAL = 5000; // ms
  */
 const ALLOW_STALE = 2; // times -> MAX(this, 1) * CHECK_INTERVAL ~> min check time
 
-export const useBlockRising = () => {
+export const useBlockRising = (skip = false) => {
   const [blocksRising, setBlocksRising] = useState(true);
   const [block, setBlock] = useState(0);
   const nodes = useEnvironment((state) => state.nodes);
   const clients = useMemo(() => {
-    return nodes.map(
+    return nodes.map((n) => {
-      (n) =>
+      if (n && n.length > 0) {
-        n &&
+        const client = createClient({
-        n.length > 0 &&
-        createClient({
           url: n,
           cacheConfig: undefined,
           retry: false,
           connectToDevTools: false,
           connectToHeaderStore: true,
-        })
+        });
-    );
+        return client;
+      }
+      return undefined;
+    });
   }, [nodes]);
 
   const { refetch: fetchBlockInfo } = useBlockInfo();
   useEffect(() => {
+    if (skip) return;
     let stale = 0;
     let prev = 0;
     const check = async () => {
-      const queries = clients.map((client, index) =>
+      const queries = clients.map((client) =>
         client
           ? client
               .query<BlockStatisticsQuery>({
@@ -47,18 +49,16 @@ export const useBlockRising = () => {
                 fetchPolicy: 'network-only',
                 errorPolicy: 'ignore',
               })
-              .catch((err) =>
+              .catch(() => {
-                Promise.reject(
+                // NOOP - could not retrieve statistics for that node (network error)
-                  `could not retrieve statistics from ${nodes[index]}`
+              })
-                )
-              )
           : undefined
       );
 
       const blockInfo = await fetchBlockInfo();
       const results = (await Promise.allSettled(compact(queries))).map(
         (res) => {
-          if (res && res.status === 'fulfilled') {
+          if (res && res.status === 'fulfilled' && res.value) {
             return res.value.data.statistics;
           } else {
             return undefined;
@@ -86,7 +86,7 @@ export const useBlockRising = () => {
     return () => {
       clearInterval(interval);
     };
-  }, [clients, fetchBlockInfo, blocksRising, nodes]);
+  }, [clients, fetchBlockInfo, blocksRising, nodes, skip]);
 
   return { blocksRising, block };
 };

libs/wallet/src/connect-dialog/connect-dialog.tsx

@@ -1,7 +1,6 @@
 import classNames from 'classnames';
 import {
   Dialog,
-  ExternalLink,
   Intent,
   Pill,
   TradingButton,
@@ -40,7 +39,7 @@ import { useVegaWallet } from '../use-vega-wallet';
 import { InjectedConnectorForm } from './injected-connector-form';
 import { isBrowserWalletInstalled } from '../utils';
 import { useIsWalletServiceRunning } from '../use-is-wallet-service-running';
-import { SnapStatus, useSnapStatus } from '../use-snap-status';
+import { useIsSnapRunning } from '../use-is-snap-running';
 import { useVegaWalletDialogStore } from './vega-wallet-dialog-store';
 
 export const CLOSE_DELAY = 1700;
@@ -159,7 +158,7 @@ const ConnectDialogContainer = ({
     appChainId
   );
 
-  const snapStatus = useSnapStatus(
+  const isSnapRunning = useIsSnapRunning(
     DEFAULT_SNAP_ID,
     Boolean(connectors['snap'])
   );
@@ -184,7 +183,7 @@ const ConnectDialogContainer = ({
             setWalletUrl={setWalletUrl}
             onSelect={handleSelect}
             isDesktopWalletRunning={isDesktopWalletRunning}
-            snapStatus={snapStatus}
+            isSnapRunning={isSnapRunning}
           />
         )}
       </ConnectDialogContent>
@@ -199,14 +198,14 @@ const ConnectorList = ({
   walletUrl,
   setWalletUrl,
   isDesktopWalletRunning,
-  snapStatus,
+  isSnapRunning,
 }: {
   connectors: Connectors;
   onSelect: (type: WalletType) => void;
   walletUrl: string;
   setWalletUrl: (value: string) => void;
   isDesktopWalletRunning: boolean | null;
-  snapStatus: SnapStatus;
+  isSnapRunning: boolean | null;
 }) => {
   const { pubKey, links } = useVegaWallet();
   const title = isBrowserWalletInstalled()
@@ -250,7 +249,7 @@ const ConnectorList = ({
         </div>
         {connectors['snap'] !== undefined ? (
           <div>
-            {snapStatus === SnapStatus.INSTALLED ? (
+            {isSnapRunning ? (
               <ConnectionOption
                 type="snap"
                 text={
@@ -268,34 +267,22 @@ const ConnectorList = ({
                 }}
               />
             ) : (
-              <>
+              <ConnectionOption
-                <ConnectionOption
+                type="snap"
-                  type="snap"
+                text={
-                  disabled={snapStatus === SnapStatus.NOT_SUPPORTED}
+                  <>
-                  text={
+                    <div className="flex items-center justify-center w-full h-full text-base gap-1">
-                    <>
+                      {t('Install Vega MetaMask Snap')}
-                      <div className="flex items-center justify-center w-full h-full text-base gap-1">
+                    </div>
-                        {t('Install Vega MetaMask Snap')}
+                    <div className="absolute top-0 flex items-center h-8 right-1">
-                      </div>
+                      <VegaIcon name={VegaIconNames.METAMASK} size={24} />
-                      <div className="absolute top-0 flex items-center h-8 right-1">
+                    </div>
-                        <VegaIcon name={VegaIconNames.METAMASK} size={24} />
+                  </>
-                      </div>
+                }
-                    </>
+                onClick={() => {
-                  }
+                  requestSnap(DEFAULT_SNAP_ID);
-                  onClick={() => {
+                }}
-                    requestSnap(DEFAULT_SNAP_ID);
+              />
-                  }}
-                />
-                {snapStatus === SnapStatus.NOT_SUPPORTED ? (
-                  <p className="pt-2 text-sm text-default">
-                    {t('No MetaMask version that supports snaps detected.')}{' '}
-                    {t('Learn more about')}{' '}
-                    <ExternalLink href="https://metamask.io/snaps/">
-                      MetaMask Snaps
-                    </ExternalLink>
-                  </p>
-                ) : null}
-              </>
             )}
           </div>
         ) : null}

libs/wallet/src/connectors/snap-connector.ts

@@ -118,10 +118,14 @@ export const getSnap = async (
   snapId: string,
   version?: string
 ): Promise<Snap | undefined> => {
-  const snaps = await getSnaps();
+  try {
-  return Object.values(snaps).find(
+    const snaps = await getSnaps();
-    (snap) => snap.id === snapId && (!version || snap.version === version)
+    return Object.values(snaps).find(
-  );
+      (snap) => snap.id === snapId && (!version || snap.version === version)
+    );
+  } catch (e) {
+    return undefined;
+  }
 };
 
 export const invokeSnap = async <T>(

libs/wallet/src/use-is-snap-running.ts

@@ -0,0 +1,27 @@
+import { useEffect, useState } from 'react';
+import { getSnap } from './connectors';
+
+const INTERVAL = 2_000;
+
+export const useIsSnapRunning = (snapId: string, shouldCheck: boolean) => {
+  const [running, setRunning] = useState(false);
+  useEffect(() => {
+    if (!shouldCheck) return;
+
+    const checkState = async () => {
+      const snap = await getSnap(snapId);
+      setRunning(!!snap);
+    };
+
+    const i = setInterval(() => {
+      checkState();
+    }, INTERVAL);
+
+    checkState();
+
+    return () => {
+      clearInterval(i);
+    };
+  }, [snapId, shouldCheck]);
+  return running;
+};

libs/wallet/src/use-snap-status.ts

@@ -1,37 +0,0 @@
-import { useEffect, useState } from 'react';
-import { getSnap } from './connectors';
-
-const INTERVAL = 2_000;
-
-export enum SnapStatus {
-  NOT_SUPPORTED,
-  INSTALLED,
-  NOT_INSTALLED,
-}
-
-export const useSnapStatus = (snapId: string, shouldCheck: boolean) => {
-  const [status, setStatus] = useState<SnapStatus>(SnapStatus.NOT_INSTALLED);
-  useEffect(() => {
-    if (!shouldCheck) return;
-
-    const checkState = async () => {
-      try {
-        const snap = await getSnap(snapId);
-        setStatus(snap ? SnapStatus.INSTALLED : SnapStatus.NOT_INSTALLED);
-      } catch (err) {
-        setStatus(SnapStatus.NOT_SUPPORTED);
-      }
-    };
-
-    const i = setInterval(() => {
-      checkState();
-    }, INTERVAL);
-
-    checkState();
-
-    return () => {
-      clearInterval(i);
-    };
-  }, [snapId, shouldCheck]);
-  return status;
-};