feat: adding the option to vote and displaying results

constants.ts

@@ -16,6 +16,7 @@ export const PUB_TOUCAN_VOTING_PLUGIN_ADDRESS = (process.env.NEXT_PUBLIC_TOUCAN_
 export const PUB_OFT_ADAPTER_ADDRESSS = (process.env.NEXT_PUBLIC_OFT_ADAPTER_ADDRESS ?? "") as Address;
 export const PUB_TOUCAN_VOTING_PLUGIN_L2_ADDRESS = (process.env.NEXT_PUBLIC_TOUCAN_VOTING_PLUGIN_L2_ADDRESS ??
   "") as Address;
+export const PUB_TOKEN_L1_ADDRESS = (process.env.NEXT_PUBLIC_TOKEN_L1_ADDRESS ?? "") as Address;
 export const PUB_TOKEN_L2_ADDRESS = (process.env.NEXT_PUBLIC_TOKEN_L2_ADDRESS ?? "") as Address;
 
 export const PUB_DELEGATION_ANNOUNCEMENTS_START_BLOCK = BigInt(

plugins/toucanVoting/hooks/useProposal.tsx

@@ -130,6 +130,7 @@ function arrangeProposalData(
     creator: creationEvent?.creator || "",
     title: metadata?.title || "",
     summary: metadata?.summary || "",
+    description: metadata?.description || "",
     resources: metadata?.resources || [],
   };
 }

plugins/toucanVoting/hooks/useProposalVoting.tsx

@@ -73,9 +73,9 @@ export function useProposalVoting(proposalId: string) {
     }
 
     const votingTally = {
-      abstain: votingOption === 1 ? addressVotes : 0n,
-      yes: votingOption === 2 ? addressVotes : 0n,
-      no: votingOption === 3 ? addressVotes : 0n,
+      yes: votingOption === 1 ? addressVotes : 0n,
+      no: votingOption === 2 ? addressVotes : 0n,
+      abstain: votingOption === 3 ? addressVotes : 0n,
     };
 
     voteWrite({

plugins/toucanVoting/hooks/useUserCanVote.tsx

@@ -11,12 +11,13 @@ export function useUserCanVote(proposalId: string) {
     address: PUB_TOUCAN_VOTING_PLUGIN_ADDRESS,
     abi: TokenVotingAbi,
     functionName: "canVote",
-    args: [BigInt(proposalId), address!, { abstain: 0n, yes: 0n, no: 0n }],
+    args: [BigInt(proposalId), address!, { abstain: 1n, yes: 0n, no: 0n }],
     query: { enabled: !!address },
   });
 
   useEffect(() => {
     refreshCanVote();
+    console.log("CanVote:", canVote);
   }, [blockNumber]);
 
   return canVote;

plugins/toucanVoting/pages/proposal.tsx

@@ -13,6 +13,8 @@ import dayjs from "dayjs";
 import { ProposalAction } from "@/components/proposalAction/proposalAction";
 import { CardResources } from "@/components/proposal/cardResources";
 import { getWinningOption } from "../utils/proposal-status";
+import { compactNumber } from "@/utils/numbers";
+import { formatEther } from "viem";
 
 export default function ProposalDetail({ id: proposalId }: { id: string }) {
   const router = useRouter();
@@ -32,6 +34,8 @@ export default function ProposalDetail({ id: proposalId }: { id: string }) {
   const showProposalLoading = getShowProposalLoading(proposal, proposalFetchStatus);
   const proposalVariant = useProposalStatus(proposal!);
 
+  const totalVotes = proposal?.tally.yes + proposal?.tally.no + proposal?.tally.abstain;
+
   // TODO: This is not revelant anymore
   const proposalStage: ITransformedStage[] = [
     {
@@ -61,7 +65,26 @@ export default function ProposalDetail({ id: proposalId }: { id: string }) {
                 label: "Vote",
                 onClick: voteProposal,
               },
-        votingScores: [{ ...getWinningOption(proposal?.tally), tokenSymbol: "HLO" }],
+        votingScores: [
+          {
+            option: "Yes",
+            voteAmount: compactNumber(formatEther(proposal?.tally.yes), 2),
+            votePercentage: Number((proposal?.tally.yes / totalVotes) * 100n),
+            tokenSymbol: "HLO",
+          },
+          {
+            option: "No",
+            voteAmount: compactNumber(formatEther(proposal?.tally.yes), 2),
+            votePercentage: Number((proposal?.tally.no / totalVotes) * 100n),
+            tokenSymbol: "HLO",
+          },
+          {
+            option: "Abstain",
+            voteAmount: compactNumber(formatEther(proposal?.tally.abstain), 2),
+            votePercentage: Number((proposal?.tally.abstain / totalVotes) * 100n),
+            tokenSymbol: "HLO",
+          },
+        ],
       },
       details: {
         censusBlock: Number(proposal?.parameters.snapshotBlock),
@@ -88,7 +111,6 @@ export default function ProposalDetail({ id: proposalId }: { id: string }) {
         proposalNumber={Number(proposalId) + 1}
         proposal={proposal}
         breadcrumbs={breadcrumbs}
-        tokenSupply={BigInt(0)}
         transactionConfirming={isConfirmingApproval || isConfirmingExecution}
         canExecute={canExecute}
         onExecutePressed={() => executeProposal()}

plugins/toucanVoting/utils/types.tsx

@@ -36,6 +36,7 @@ export type Proposal = {
   creator: string;
   title: string;
   summary: string;
+  description: string;
   resources: string[];
 };
 

utils/chains.ts

@@ -1,6 +1,6 @@
-import { polygon, mainnet, sepolia, arbitrum, polygonMumbai, Chain } from "@wagmi/core/chains";
+import { polygon, mainnet, sepolia, arbitrum, arbitrumSepolia, polygonMumbai, Chain } from "@wagmi/core/chains";
 
-const chainNames = ["mainnet", "polygon", "sepolia", "mumbai", "arbitrum"] as const;
+const chainNames = ["mainnet", "polygon", "sepolia", "mumbai", "arbitrum", "arbitrumSepolia"] as const;
 export type ChainName = (typeof chainNames)[number];
 
 export function getChain(chainName: ChainName): Chain {
@@ -13,6 +13,8 @@ export function getChain(chainName: ChainName): Chain {
       return arbitrum;
     case "sepolia":
       return sepolia;
+    case "arbitrumSepolia":
+      return arbitrumSepolia;
     case "mumbai":
       return polygonMumbai;
     default:

utils/numbers.ts

@@ -1,4 +1,5 @@
-export function compactNumber(input: number | string, decimalPlaces: number = 2): string {
+export function compactNumber(input: number | string | undefined, decimalPlaces: number = 2): string {
+  if (input === undefined) return "-";
   const num = typeof input === "string" ? parseFloat(input) : input;
 
   if (isNaN(num)) return "-";