69 lines
2.2 KiB
TypeScript
69 lines
2.2 KiB
TypeScript
import { Proposal } from '@solana/spl-governance'
|
|
import VoteResultsBar from './VoteResultBar'
|
|
import { fmtTokenAmount } from 'utils/governance/tools'
|
|
import { RawMint } from '@solana/spl-token'
|
|
import { useTranslation } from 'next-i18next'
|
|
import { BN } from '@coral-xyz/anchor'
|
|
|
|
type VoteResultsProps = {
|
|
proposal: Proposal
|
|
communityMint: RawMint
|
|
}
|
|
|
|
const VoteResults = ({ proposal, communityMint }: VoteResultsProps) => {
|
|
const { t } = useTranslation(['governance'])
|
|
|
|
const yesVoteCount = fmtTokenAmount(
|
|
proposal.getYesVoteCount() as BN,
|
|
communityMint.decimals,
|
|
)
|
|
const noVoteCount = fmtTokenAmount(
|
|
proposal.getNoVoteCount() as BN,
|
|
communityMint.decimals,
|
|
)
|
|
const totalVoteCount = yesVoteCount + noVoteCount
|
|
const getRelativeVoteCount = (voteCount: number) =>
|
|
totalVoteCount === 0 ? 0 : (voteCount / totalVoteCount) * 100
|
|
const relativeYesVotes = getRelativeVoteCount(yesVoteCount)
|
|
const relativeNoVotes = getRelativeVoteCount(noVoteCount)
|
|
|
|
return (
|
|
<div className="flex w-full items-center space-x-4">
|
|
{proposal ? (
|
|
<div className={`w-full rounded-md`}>
|
|
<div className="flex">
|
|
<div className="w-1/2">
|
|
<p>{t('yes-votes')}</p>
|
|
<p className={`hero-text font-bold text-th-fgd-1`}>
|
|
{(yesVoteCount ?? 0).toLocaleString()}
|
|
<span className="ml-1 text-xs font-normal text-th-fgd-3">
|
|
{relativeYesVotes?.toFixed(1)}%
|
|
</span>
|
|
</p>
|
|
</div>
|
|
<div className="w-1/2 text-right">
|
|
<p>{t('no-votes')}</p>
|
|
<p className={`hero-text font-bold text-th-fgd-1`}>
|
|
{(noVoteCount ?? 0).toLocaleString()}
|
|
<span className="ml-1 text-xs font-normal text-th-fgd-3">
|
|
{relativeNoVotes?.toFixed(1)}%
|
|
</span>
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<VoteResultsBar
|
|
approveVotePercentage={relativeYesVotes!}
|
|
denyVotePercentage={relativeNoVotes!}
|
|
/>
|
|
</div>
|
|
) : (
|
|
<>
|
|
<div className="h-12 w-full animate-pulse rounded bg-th-bkg-3" />
|
|
</>
|
|
)}
|
|
</div>
|
|
)
|
|
}
|
|
|
|
export default VoteResults
|