fix: make governance token data immutable

modules/motions/hooks/useLegoTokenOptions.ts

@@ -1,19 +1,19 @@
 import { useMemo } from 'react'
 import { useWeb3 } from 'modules/blockChain/hooks/useWeb3'
-import { useGovernanceSymbol } from 'modules/tokens/hooks/useGovernanceSymbol'
 import * as CONTRACT_ADDRESSES from 'modules/blockChain/contractAddresses'
+import { useGovernanceTokenData } from 'modules/tokens/hooks/useGovernanceTokenData'
 
 export function useLegoTokenOptions() {
   const { chainId } = useWeb3()
-  const { data: governanceSymbol } = useGovernanceSymbol()
+  const { data } = useGovernanceTokenData()
   return useMemo(
     () => [
       {
         label: 'ETH',
         value: '0x0000000000000000000000000000000000000000',
       },
       {
-        label: governanceSymbol || '',
+        label: data?.symbol || '',
         value: CONTRACT_ADDRESSES.GovernanceToken[chainId]!,
       },
       {
@@ -25,6 +25,6 @@ export function useLegoTokenOptions() {
         value: CONTRACT_ADDRESSES.DAI[chainId]!,
       },
     ],
-    [governanceSymbol, chainId],
+    [data?.symbol, chainId],
   )
 }

modules/motions/hooks/useMotionProgress.ts

@@ -1,17 +1,17 @@
 import { useMemo } from 'react'
-import { useGovernanceTotalSupply } from 'modules/tokens/hooks/useGovernanceTotalSupply'
 import { getMotionProgress } from 'modules/motions/utils/getMotionProgress'
 import type { Motion } from '../types'
+import { useGovernanceTokenData } from 'modules/tokens/hooks/useGovernanceTokenData'
 
 export function useMotionProgress(motion: Motion) {
-  const { data: totalSupply, initialLoading: isLoadingSupply } =
-    useGovernanceTotalSupply()
+  const { data: tokenData, initialLoading: isLoadingSupply } =
+    useGovernanceTokenData()
 
   const formatted = useMemo(() => {
-    return !isLoadingSupply && totalSupply
-      ? getMotionProgress(motion, totalSupply)
+    return !isLoadingSupply && tokenData?.totalSupply
+      ? getMotionProgress(motion, tokenData.totalSupply)
       : null
-  }, [isLoadingSupply, motion, totalSupply])
+  }, [isLoadingSupply, motion, tokenData?.totalSupply])
 
   return formatted
 }

modules/motions/ui/MotionDescription/DescReferralPartner.tsx

@@ -1,5 +1,4 @@
 import { useMemo } from 'react'
-import { useGovernanceSymbol } from 'modules/tokens/hooks/useGovernanceSymbol'
 import {
   useReferralPartnersAll,
   useReferralPartnersMapAll,
@@ -14,6 +13,7 @@ import {
   EvmTopUpReferralPartnersAbi,
 } from 'generated'
 import { NestProps } from './types'
+import { useGovernanceTokenData } from 'modules/tokens/hooks/useGovernanceTokenData'
 
 // ReferralPartnerAdd
 export function DescReferralPartnerAdd({
@@ -31,7 +31,7 @@ export function DescReferralPartnerAdd({
 export function DescReferralPartnerTopUp({
   callData,
 }: NestProps<EvmTopUpReferralPartnersAbi['decodeEVMScriptCallData']>) {
-  const governanceSymbol = useGovernanceSymbol()
+  const { data: governanceTokenData } = useGovernanceTokenData()
   const { data: referralPartnersMap } = useReferralPartnersMapAll()
 
   const programs = useMemo(() => {
@@ -45,7 +45,7 @@ export function DescReferralPartnerTopUp({
       {callData[0].map((address, i) => (
         <div key={i}>
           <b>{programs?.[i]}</b> <AddressInlineWithPop address={address} /> with{' '}
-          {formatEther(callData[1][i])} {governanceSymbol.data}
+          {formatEther(callData[1][i])} {governanceTokenData?.symbol}
         </div>
       ))}
     </div>

modules/motions/ui/MotionDescription/DescRewardProgram.tsx

@@ -3,7 +3,6 @@ import {
   useRewardProgramsAll,
   useRewardProgramsMapAll,
 } from 'modules/motions/hooks/useRewardPrograms'
-import { useGovernanceSymbol } from 'modules/tokens/hooks/useGovernanceSymbol'
 
 import { AddressInlineWithPop } from 'modules/shared/ui/Common/AddressInlineWithPop'
 
@@ -14,6 +13,7 @@ import {
   EvmTopUpRewardProgramsAbi,
 } from 'generated'
 import { NestProps } from './types'
+import { useGovernanceTokenData } from 'modules/tokens/hooks/useGovernanceTokenData'
 
 // RewardProgramAdd
 /**
@@ -37,7 +37,7 @@ export function DescRewardProgramAdd({
 export function DescRewardProgramTopUp({
   callData,
 }: NestProps<EvmTopUpRewardProgramsAbi['decodeEVMScriptCallData']>) {
-  const governanceSymbol = useGovernanceSymbol()
+  const { data: governanceTokenData } = useGovernanceTokenData()
   const { data: rewardProgramsMap } = useRewardProgramsMapAll()
 
   const programs = useMemo(() => {
@@ -52,7 +52,7 @@ export function DescRewardProgramTopUp({
         <div key={i}>
           <b>{programs?.[i]}</b> <AddressInlineWithPop address={address} /> with{' '}
           {Number(formatEther(callData[1][i])).toLocaleString('en-EN')}{' '}
-          {governanceSymbol.data}
+          {governanceTokenData?.symbol}
         </div>
       ))}
     </div>

modules/motions/ui/MotionDetailed/MotionDetailedActions/MotionDetailedActions.tsx

@@ -5,7 +5,6 @@ import {
   ContractGovernanceToken,
 } from 'modules/blockChain/contracts'
 import { useCheckWalletConnect } from 'modules/blockChain/hooks/useCheckWalletConnect'
-import { useGovernanceSymbol } from 'modules/tokens/hooks/useGovernanceSymbol'
 import { TransactionSender } from 'modules/blockChain/hooks/useTransactionSender'
 import { useMotionDetailed } from 'modules/motions/providers/hooks/useMotionDetaled'
 
@@ -19,6 +18,7 @@ import {
 } from './MotionDetailedActionsStyle'
 
 import { Motion, MotionStatus } from 'modules/motions/types'
+import { useGovernanceTokenData } from 'modules/tokens/hooks/useGovernanceTokenData'
 
 function TxRow({ label, tx }: { label: string; tx: TransactionSender }) {
   return (
@@ -39,7 +39,7 @@ type Props = {
 
 function ActionsBody({ motion }: Props) {
   const { walletAddress } = useWeb3()
-  const { data: governanceSymbol } = useGovernanceSymbol()
+  const { data: governanceTokenData } = useGovernanceTokenData()
   const { isOverPeriodLimit, txEnact, txObject } = useMotionDetailed()
 
   const balanceAt = ContractGovernanceToken.useSwrWeb3('balanceOfAt', [
@@ -83,19 +83,19 @@ function ActionsBody({ motion }: Props) {
         {showHintObjected && (
           <>
             You have objected this motion with <b>{balanceAtFormatted}</b>{' '}
-            {governanceSymbol}
+            {governanceTokenData?.symbol}
           </>
         )}
         {showHintCanObject && (
           <>
             You can object this motion with <b>{balanceAtFormatted}</b>{' '}
-            {governanceSymbol}
+            {governanceTokenData?.symbol}
           </>
         )}
         {showHintCanNotObject && (
           <>
-            You didn’t have {governanceSymbol} when the motion started to object
-            it
+            You didn’t have {governanceTokenData?.symbol} when the motion
+            started to object it
           </>
         )}
       </Hint>

modules/tokens/hooks/useGovernanceTokenData.ts

@@ -0,0 +1,18 @@
+import { useLidoSWRImmutable } from '@lido-sdk/react'
+import { ContractGovernanceToken } from 'modules/blockChain/contracts'
+import { useWeb3 } from 'modules/blockChain/hooks/useWeb3'
+
+export function useGovernanceTokenData() {
+  const { chainId } = useWeb3()
+  const ldo = ContractGovernanceToken.useRpc()
+
+  return useLidoSWRImmutable(`governance-token-data-${chainId}`, async () => {
+    const totalSupply = await ldo.totalSupply()
+    const symbol = await ldo.symbol()
+
+    return {
+      totalSupply,
+      symbol,
+    }
+  })
+}

modules/wallet/ui/WalletModal/WalletModal.tsx

@@ -2,7 +2,6 @@ import { useCallback, useMemo } from 'react'
 import { useWeb3 } from 'modules/blockChain/hooks/useWeb3'
 import { useConnectorInfo, useDisconnect } from 'reef-knot/web3-react'
 import { useGovernanceBalance } from 'modules/tokens/hooks/useGovernanceBalance'
-import { useGovernanceSymbol } from 'modules/tokens/hooks/useGovernanceSymbol'
 import { useConfig } from 'modules/config/hooks/useConfig'
 import { Text } from 'modules/shared/ui/Common/Text'
 import { CopyOpenActions } from 'modules/shared/ui/Common/CopyOpenActions'
@@ -17,6 +16,7 @@ import {
 } from './WalletModalStyle'
 import { formatToken } from 'modules/tokens/utils/formatToken'
 import { useDisconnect as useDisconnectWagmi } from 'wagmi'
+import { useGovernanceTokenData } from 'modules/tokens/hooks/useGovernanceTokenData'
 
 function WalletModalContent() {
   const { walletAddress } = useWeb3()
@@ -25,21 +25,24 @@ function WalletModalContent() {
     [walletAddress],
   )
   const governanceBalance = useGovernanceBalance()
-  const { data: governanceSymbol } = useGovernanceSymbol()
+  const { data: governanceTokenData } = useGovernanceTokenData()
 
   return (
     <>
       <Row>
         <Text
           size={12}
           weight={500}
-          children={`${governanceSymbol} Balance:`}
+          children={`${governanceTokenData?.symbol} Balance:`}
         />
         <Text size={12} weight={500}>
           &nbsp;
           {governanceBalance.initialLoading || !governanceBalance.data
             ? 'Loading...'
-            : formatToken(governanceBalance.data, governanceSymbol || '')}
+            : formatToken(
+                governanceBalance.data,
+                governanceTokenData?.symbol || '',
+              )}
         </Text>
       </Row>