feat: use getVotes from governor to display user's voting power on pr…

…oposals page (#382)

* feat: use getVotes from governor to display user's voting power on proposals page

* feat: use correct stRIF contract for getVotes method

* feat: use correct stRIF contract for getVotes method

src/app/proposals/hooks/useVotingPower.ts

@@ -22,6 +22,12 @@ export const useVotingPower = () => {
         functionName: 'decimals',
       },
       { abi: GovernorAbi, address: GovernorAddress, functionName: 'proposalThreshold' },
+      {
+        abi: StRIFTokenAbi,
+        address: tokenContracts.stRIF,
+        functionName: 'getVotes',
+        args: [address!],
+      },
     ],
   })
 
@@ -34,11 +40,12 @@ export const useVotingPower = () => {
     }
   }
 
-  const [balance, decimals, threshold] = data as [bigint, number, bigint]
+  const [balance, decimals, threshold, totalVotingPower] = data as [bigint, number, bigint, bigint]
   return {
     isLoading: false,
     votingPower: formatUnits(balance, decimals),
     canCreateProposal: balance >= threshold,
     threshold: formatUnits(threshold, decimals),
+    totalVotingPower: formatUnits(totalVotingPower, decimals),
   }
 }

src/app/proposals/page.tsx

@@ -14,7 +14,7 @@ import { useVotingPower } from './hooks/useVotingPower'
 import { useMemo } from 'react'
 
 export default function Proposals() {
-  const { votingPower, canCreateProposal, threshold } = useVotingPower()
+  const { canCreateProposal, threshold, totalVotingPower } = useVotingPower()
   const { latestProposals } = useFetchAllProposals()
 
   const memoizedProposals = useMemo(() => latestProposals, [latestProposals])
@@ -26,7 +26,7 @@ export default function Proposals() {
         <div>
           <VotingPowerPopover />
           <Paragraph className="text-[48px] text-primary tracking-[-0.96px]" fontFamily="kk-topo">
-            {toFixed(votingPower)}
+            {totalVotingPower}
           </Paragraph>
         </div>
         <div className="flex flex-row gap-x-6">