diff --git a/packages/ui/src/council/components/election/CandidateCard/CandidateCard.tsx b/packages/ui/src/council/components/election/CandidateCard/CandidateCard.tsx index 6dce1fbc01..7105f87e87 100644 --- a/packages/ui/src/council/components/election/CandidateCard/CandidateCard.tsx +++ b/packages/ui/src/council/components/election/CandidateCard/CandidateCard.tsx @@ -1,3 +1,4 @@ +import BN from 'bn.js' import React, { useCallback } from 'react' import styled from 'styled-components' @@ -31,11 +32,13 @@ export interface CandidateCardProps { loses?: number canVote?: boolean isPreview?: boolean + myStake?: BN } export const CandidateCard = ({ candidate: { id, member, info, stake }, voted, + myStake, withdrawable, canVote, isPreview, @@ -97,9 +100,9 @@ export const CandidateCard = ({ {stake && ( - + - Staked + {voted && myStake ? 'My Stake' : 'Staked'} )} {withdrawable && ( diff --git a/packages/ui/src/council/components/election/CandidateCard/CandidateCardList.tsx b/packages/ui/src/council/components/election/CandidateCard/CandidateCardList.tsx index b996171b5e..24679dd6f2 100644 --- a/packages/ui/src/council/components/election/CandidateCard/CandidateCardList.tsx +++ b/packages/ui/src/council/components/election/CandidateCard/CandidateCardList.tsx @@ -1,3 +1,4 @@ +import BN from 'bn.js' import React from 'react' import styled from 'styled-components' @@ -10,6 +11,7 @@ import { CandidateCardProps, CandidateCard, CandidateCardCandidate } from './Can interface CandidateCardListCandidate extends CandidateCardCandidate { isMyCandidate?: boolean voted?: boolean + myStake?: BN } interface CandidatesListProps extends Pick { @@ -34,8 +36,15 @@ export const CandidateCardList = ({ candidates = [], isLoading, canVote }: Candi return ( - {candidates.map(({ voted, isMyCandidate, ...candidate }, index) => ( - + {candidates.map(({ voted, isMyCandidate, myStake, ...candidate }, index) => ( + ))} ) diff --git a/packages/ui/src/council/components/election/voting/VotingStage.tsx b/packages/ui/src/council/components/election/voting/VotingStage.tsx index 8942cd9f96..91c66a869c 100644 --- a/packages/ui/src/council/components/election/voting/VotingStage.tsx +++ b/packages/ui/src/council/components/election/voting/VotingStage.tsx @@ -2,9 +2,11 @@ import React, { useMemo, useState } from 'react' import { useMyAccounts } from '@/accounts/hooks/useMyAccounts' import { NoData } from '@/common/components/NoData' +import { BN_ZERO } from '@/common/constants' import { isDefined } from '@/common/utils' import { CandidateCardList } from '@/council/components/election/CandidateCard/CandidateCardList' import { CurrentElectionTabs, VotingStageTab } from '@/council/components/election/CurrentElectionTabs' +import { useMyCastVotes } from '@/council/hooks/useMyCastVotes' import { useMyCurrentVotesCount } from '@/council/hooks/useMyCurrentVotesCount' import { useVerifiedVotingAttempts } from '@/council/hooks/useVerifiedVotingAttempts' import { CandidacyStatus } from '@/council/types' @@ -18,6 +20,7 @@ interface VotingStageProps { export const VotingStage = ({ election, isLoading }: VotingStageProps) => { const [tab, setTab] = useState('candidates') const { votesTotal } = useMyCurrentVotesCount(election?.cycleId) + const { votes } = useMyCastVotes(election?.cycleId) const { allAccounts } = useMyAccounts() const myVotes = useVerifiedVotingAttempts(election?.cycleId) @@ -31,7 +34,17 @@ export const VotingStage = ({ election, isLoading }: VotingStageProps) => { ...candidate, voted: optionIds?.has(candidate.member.id), })) - const votedForCandidates = allCandidates?.filter(({ voted }) => voted) + const votedForCandidates = allCandidates + ?.filter(({ voted }) => voted) + .map((candidate) => { + const myVotesForCandidate = votes?.filter((vote) => vote.optionId === candidate.member.id) ?? [] + + return { + ...candidate, + myVotes: myVotesForCandidate, + myStake: myVotesForCandidate.reduce((prev, next) => prev.add(next.stake), BN_ZERO), + } + }) return [allCandidates, votedForCandidates] }, [optionIds?.size, election?.candidates])