[ENG-115] Fix getting / showing voting weight on NFT DAO proposals

src/assets/css/Toast.css

@@ -31,6 +31,10 @@
   margin-right: 0;
 }
 
+.sonner-toast[data-type='loading'] [data-icon] {
+  margin-top: 8px;
+}
+
 .sonner-toast [data-icon] svg {
   width: 24px;
   height: 24px;

src/components/DaoCreator/formComponents/EstablishEssentials.tsx

@@ -108,13 +108,6 @@ export function EstablishEssentials(props: ICreationStepProps) {
     },
   });
 
-  useEffect(() => {
-    if (chain.id !== walletChainID) {
-      const chainId = getChainIdFromPrefix(addressPrefix);
-      switchChain({ chainId });
-    }
-  }, [chain.id, walletChainID, addressPrefix, switchChain]);
-
   return (
     <>
       <StepWrapper

src/components/DaoCreator/index.tsx

@@ -1,6 +1,9 @@
 import { Box } from '@chakra-ui/react';
 import { Formik } from 'formik';
+import { useEffect } from 'react';
+import { useChainId, useSwitchChain } from 'wagmi';
 import { useDAOCreateSchema } from '../../hooks/schemas/DAOCreate/useDAOCreateSchema';
+import { useNetworkConfigStore } from '../../providers/NetworkConfig/useNetworkConfigStore';
 import {
   AzoriusERC20DAO,
   AzoriusERC721DAO,
@@ -28,6 +31,8 @@ function DaoCreator({
   mode: DAOCreateMode;
 }) {
   const { totalParentVotingWeight } = useParentSafeVotingWeight();
+  const walletChainID = useChainId();
+  const { chain } = useNetworkConfigStore();
 
   const { createDAOValidation } = useDAOCreateSchema({
     isSubDAO: !!isSubDAO,
@@ -37,6 +42,21 @@ function DaoCreator({
   const { prepareMultisigFormData, prepareAzoriusERC20FormData, prepareAzoriusERC721FormData } =
     usePrepareFormData();
 
+  const { switchChain } = useSwitchChain({
+    mutation: {
+      onError: () => {
+        if (chain.id !== walletChainID && !isSubDAO) {
+          switchChain({ chainId: chain.id });
+        }
+      },
+    },
+  });
+  useEffect(() => {
+    if (chain.id !== walletChainID && !isSubDAO) {
+      switchChain({ chainId: chain.id });
+    }
+  }, [chain.id, walletChainID, switchChain, isSubDAO]);
+
   return (
     <Box>
       <Formik<CreatorFormState>

src/components/Proposals/ProposalSummary.tsx

@@ -2,9 +2,9 @@ import { Box, Button, Flex, Text } from '@chakra-ui/react';
 import { abis } from '@fractal-framework/fractal-contracts';
 import { format } from 'date-fns';
 import { formatInTimeZone } from 'date-fns-tz';
-import { useEffect, useMemo, useState } from 'react';
+import { useCallback, useEffect, useMemo, useState } from 'react';
 import { useTranslation } from 'react-i18next';
-import { getContract } from 'viem';
+import { erc721Abi, getContract } from 'viem';
 import { useAccount, usePublicClient } from 'wagmi';
 import { TOOLTIP_MAXW } from '../../constants/common';
 import useBlockTimestamp from '../../hooks/utils/useBlockTimestamp';
@@ -60,31 +60,69 @@ export function AzoriusProposalSummary({ proposal }: { proposal: AzoriusProposal
 
   const publicClient = usePublicClient();
 
+  const getErc721VotingWeight = useCallback(async () => {
+    if (!address || !azoriusGovernance.erc721Tokens || !publicClient) {
+      return 0n;
+    }
+    const userVotingWeight = (
+      await Promise.all(
+        azoriusGovernance.erc721Tokens.map(async ({ address: tokenAddress, votingWeight }) => {
+          const tokenContract = getContract({
+            abi: erc721Abi,
+            address: tokenAddress,
+            client: publicClient,
+          });
+          // @todo We should be checking proposal state - if it's active, we should use the latest block, otherwise we should calculate the voting weight based on the startBlock and deadlineMs
+          const userBalance = await tokenContract.read.balanceOf([address], {
+            blockNumber: startBlock,
+          });
+          return userBalance * votingWeight;
+        }),
+      )
+    ).reduce((prev, curr) => prev + curr, 0n);
+    return userVotingWeight;
+  }, [azoriusGovernance.erc721Tokens, publicClient, address, startBlock]);
+
+  const isERC20 = type === GovernanceType.AZORIUS_ERC20;
+  const isERC721 = type === GovernanceType.AZORIUS_ERC721;
+
   useEffect(() => {
     async function loadProposalVotingWeight() {
       if (address && publicClient) {
-        const strategyContract = getContract({
-          abi: abis.LinearERC20Voting,
-          address: proposal.votingStrategy,
-          client: publicClient,
-        });
+        if (isERC20) {
+          const strategyContract = getContract({
+            abi: abis.LinearERC20Voting,
+            address: proposal.votingStrategy,
+            client: publicClient,
+          });
 
-        const pastVotingWeight = await strategyContract.read.getVotingWeight([
-          address,
-          Number(proposal.proposalId),
-        ]);
+          const pastVotingWeight = await strategyContract.read.getVotingWeight([
+            address,
+            Number(proposal.proposalId),
+          ]);
 
-        setProposalVotingWeight(
-          formatCoin(pastVotingWeight, true, votesToken?.decimals, undefined, false),
-        );
+          setProposalVotingWeight(
+            formatCoin(pastVotingWeight, true, votesToken?.decimals, undefined, false),
+          );
+        } else if (isERC721) {
+          const votingWeight = await getErc721VotingWeight();
+          setProposalVotingWeight(votingWeight.toString());
+        }
       }
     }
 
     loadProposalVotingWeight();
-  }, [address, proposal.proposalId, proposal.votingStrategy, publicClient, votesToken?.decimals]);
-
-  const isERC20 = type === GovernanceType.AZORIUS_ERC20;
-  const isERC721 = type === GovernanceType.AZORIUS_ERC721;
+  }, [
+    address,
+    proposal.proposalId,
+    proposal.votingStrategy,
+    publicClient,
+    votesToken?.decimals,
+    isERC20,
+    isERC721,
+    getErc721VotingWeight,
+    startBlock,
+  ]);
 
   // @todo @dev (see below):
   // Caching has introduced a new "problem" edge case -- a proposal can be loaded before `votingStrategy` is loaded.

src/components/Proposals/ProposalVotes/context/VoteContext.tsx

@@ -5,10 +5,10 @@ import {
   useCallback,
   useContext,
   useEffect,
-  useRef,
+  useMemo,
   useState,
 } from 'react';
-import { erc721Abi, getContract } from 'viem';
+import { BlockTag, erc721Abi, getContract } from 'viem';
 import { useAccount, usePublicClient } from 'wagmi';
 import useSnapshotProposal from '../../../../hooks/DAO/loaders/snapshot/useSnapshotProposal';
 import useUserERC721VotingTokens from '../../../../hooks/DAO/proposal/useUserERC721VotingTokens';
@@ -98,27 +98,30 @@ export function VoteContextProvider({
     extendedSnapshotProposal,
   ]);
 
-  const erc721VotingWeight = useCallback(async () => {
-    const account = userAccount.address;
-    const azoriusGovernance = governance as AzoriusGovernance;
-    if (!account || !azoriusGovernance.erc721Tokens || !publicClient) {
-      return 0n;
-    }
-    const userVotingWeight = (
-      await Promise.all(
-        azoriusGovernance.erc721Tokens.map(async ({ address, votingWeight }) => {
-          const tokenContract = getContract({
-            abi: erc721Abi,
-            address: address,
-            client: publicClient,
-          });
-          const userBalance = await tokenContract.read.balanceOf([account]);
-          return userBalance * votingWeight;
-        }),
-      )
-    ).reduce((prev, curr) => prev + curr, 0n);
-    return userVotingWeight;
-  }, [governance, publicClient, userAccount.address]);
+  const getErc721VotingWeight = useCallback(
+    async (blockTag?: BlockTag) => {
+      const account = userAccount.address;
+      const azoriusGovernance = governance as AzoriusGovernance;
+      if (!account || !azoriusGovernance.erc721Tokens || !publicClient) {
+        return 0n;
+      }
+      const userVotingWeight = (
+        await Promise.all(
+          azoriusGovernance.erc721Tokens.map(async ({ address, votingWeight }) => {
+            const tokenContract = getContract({
+              abi: erc721Abi,
+              address: address,
+              client: publicClient,
+            });
+            const userBalance = await tokenContract.read.balanceOf([account], { blockTag });
+            return userBalance * votingWeight;
+          }),
+        )
+      ).reduce((prev, curr) => prev + curr, 0n);
+      return userVotingWeight;
+    },
+    [governance, publicClient, userAccount.address],
+  );
 
   const getCanVote = useCallback(async () => {
     setCanVoteLoading(true);
@@ -140,15 +143,14 @@ export function VoteContextProvider({
             Number(proposal.proposalId),
           ])) > 0n && !hasVoted;
       } else if (governance.type === GovernanceType.AZORIUS_ERC721) {
-        const votingWeight = await erc721VotingWeight();
+        const votingWeight = await getErc721VotingWeight();
         newCanVote = votingWeight > 0n && remainingTokenIds.length > 0;
       } else if (governance.type === GovernanceType.MULTISIG) {
         newCanVote = !!safe?.owners.includes(userAccount.address);
       } else {
         newCanVote = false;
       }
     }
-
     if (canVote !== newCanVote) {
       setCanVote(newCanVote);
     }
@@ -164,15 +166,10 @@ export function VoteContextProvider({
     remainingTokenIds.length,
     safe?.owners,
     proposal,
-    erc721VotingWeight,
+    getErc721VotingWeight,
   ]);
 
-  const initialLoadRef = useRef(false);
   useEffect(() => {
-    // Prevent running this effect multiple times
-    if (initialLoadRef.current) return;
-    initialLoadRef.current = true;
-
     getCanVote();
     getHasVoted();
   }, [getCanVote, getHasVoted]);
@@ -184,18 +181,17 @@ export function VoteContextProvider({
     }
   }, [proposal, proposalVotesLength]);
 
-  return (
-    <VoteContext.Provider
-      value={{
-        canVote,
-        canVoteLoading,
-        hasVoted,
-        hasVotedLoading,
-        getHasVoted,
-        getCanVote,
-      }}
-    >
-      {children}
-    </VoteContext.Provider>
+  const voteContextValue = useMemo(
+    () => ({
+      canVote,
+      canVoteLoading,
+      hasVoted,
+      hasVotedLoading,
+      getHasVoted,
+      getCanVote,
+    }),
+    [canVote, canVoteLoading, hasVoted, hasVotedLoading, getHasVoted, getCanVote],
   );
+
+  return <VoteContext.Provider value={voteContextValue}>{children}</VoteContext.Provider>;
 }

src/components/ui/menus/DAOSearch/index.tsx

@@ -143,7 +143,7 @@ export function DAOSearch() {
             marginTop="0.25rem"
             rounded="0.5rem"
             bg="neutral-2"
-            boxShadow={SEXY_BOX_SHADOW_T_T}
+            boxShadow={resolvedAddressesWithPrefix.length ? SEXY_BOX_SHADOW_T_T : 'none'}
             hidden={!showResults}
             w="full"
             position="absolute"

src/constants/common.ts

@@ -56,7 +56,6 @@ export const MAX_CONTENT_WIDTH = '80rem';
 
 const features = {
   developmentMode: 'DEVELOPMENT_MODE',
-  termedRoles: 'TERMED_ROLES',
   demoMode: 'DEMO_MODE',
 } as const;
 
@@ -72,7 +71,6 @@ export const isFeatureEnabled = (feature: FeatureFlag) => {
 };
 
 export const isDevMode = () => isFeatureEnabled(features.developmentMode);
-export const isTermedRolesEnabled = () => isFeatureEnabled(features.termedRoles);
 export const isDemoMode = () => isFeatureEnabled(features.demoMode);
 
 /**

src/hooks/DAO/loaders/governance/useAzoriusProposals.ts

@@ -234,6 +234,13 @@ export const useAzoriusProposals = () => {
 
         let proposalData;
 
+        if (
+          proposalCreatedEvent.args.proposer === undefined ||
+          proposalCreatedEvent.args.strategy === undefined
+        ) {
+          continue;
+        }
+
         if (proposalCreatedEvent.args.metadata && proposalCreatedEvent.args.transactions) {
           const metadataEvent = parseProposalMetadata(proposalCreatedEvent.args.metadata);
 
@@ -273,13 +280,6 @@ export const useAzoriusProposals = () => {
           }
         }
 
-        if (
-          proposalCreatedEvent.args.proposer === undefined ||
-          proposalCreatedEvent.args.strategy === undefined
-        ) {
-          continue;
-        }
-
         let strategyType: VotingStrategyType | undefined;
         const strategyAddress = proposalCreatedEvent.args.strategy;
         const {

src/hooks/DAO/proposal/useUserERC721VotingTokens.ts

@@ -171,7 +171,6 @@ export default function useUserERC721VotingTokens(
 
       const tokenIdsSets = [...userERC721Tokens.values()];
       const tokenAddressesKeys = [...userERC721Tokens.keys()];
-
       await Promise.all(
         // Same here
         tokenIdsSets.map(async (tokenIdsSet, setIndex) => {
@@ -204,7 +203,6 @@ export default function useUserERC721VotingTokens(
           );
         }),
       );
-
       return {
         totalVotingTokenAddresses: totalTokenAddresses,
         totalVotingTokenIds: totalTokenIds,
@@ -226,7 +224,6 @@ export default function useUserERC721VotingTokens(
   const loadUserERC721VotingTokens = useCallback(async () => {
     const proposalIdNum = proposalId === null ? null : Number(proposalId);
     const tokensInfo = await getUserERC721VotingTokens(safeAddress, proposalIdNum);
-
     if (tokensInfo) {
       setTotalVotingTokenAddresses(tokensInfo.totalVotingTokenAddresses);
       setTotalVotingTokenIds(tokensInfo.totalVotingTokenIds);

src/pages/create/SafeCreatePage.tsx

@@ -37,9 +37,7 @@ export function SafeCreatePage() {
       if (daoFound) {
         navigate(DAO_ROUTES.dao.relative(addressPrefix, safeAddress));
       } else {
-        toast.loading(t('failedIndexSafe'), {
-          duration: Infinity,
-        });
+        toast.loading(t('failedIndexSafe'));
         navigate(BASE_ROUTES.landing);
       }
     },