fix and unify voteTarget and voteValue for linear progress bar

Signed-off-by: Uncle Fatso <uncle.fatso@ghostchain.io>
This commit is contained in:
Uncle Fatso 2026-03-04 13:35:28 +03:00
parent 43620736cf
commit 843093915f
Signed by: f4ts0
GPG Key ID: 565F4F2860226EBB
5 changed files with 48 additions and 67 deletions

View File

@ -1,7 +1,7 @@
{
"name": "ghost-dao-interface",
"private": true,
"version": "0.5.35",
"version": "0.5.36",
"type": "module",
"scripts": {
"dev": "vite",

View File

@ -40,6 +40,8 @@ import { networkAvgBlockSpeed } from "../../constants";
import { useTokenSymbol, usePastTotalSupply, usePastVotes, useBalance } from "../../hooks/tokens";
import {
getVoteValue,
getVoteTarget,
useProposalState,
useProposalProposer,
useProposalLocked,
@ -133,25 +135,6 @@ const ProposalDetails = ({ chainId, address, connect, config }) => {
return pastVotes * HUNDRED / totalSupply;
}, [pastVotes, totalSupply]);
const voteValue = useMemo(() => {
if (totalVotes?._value == 0n) {
return 0;
}
const value = forVotes * HUNDRED / totalVotes;
return Math.floor(Number(value.toString()));
}, [forVotes, totalVotes]);
const voteTarget = useMemo(() => {
if (totalSupply._value == 0n) {
return 80;
}
const value = Number(totalVotes / totalSupply);
const result = (5 - Math.sqrt(1 + 80/9 * (value - 0.1) )) / 4
return Math.floor(result * 100);
}, [totalVotes, totalSupply]);
const nativeCurrency = useMemo(() => {
const client = config?.getClient();
return client?.chain?.nativeCurrency?.symbol;
@ -257,8 +240,8 @@ const ProposalDetails = ({ chainId, address, connect, config }) => {
barColor={theme.colors.feedback.success}
barBackground={theme.colors.feedback.error}
variant="determinate"
value={voteValue}
target={voteTarget}
value={getVoteValue(forVotes?._value ?? 0n, totalVotes?._value ?? 0n)}
target={getVoteTarget(totalVotes?._value ?? 0n, totalSupply?._value ?? 0n)}
/>
</Box>

View File

@ -185,42 +185,6 @@ const ProposalTable = ({ children }) => (
const ProposalRow = ({ proposal, blockNumber, openProposal, chainId }) => {
const theme = useTheme();
const voteValue = useMemo(() => {
const againstVotes = proposal?.votes?.at(0)?._value ?? 0n
const forVotes = proposal?.votes?.at(1)?._value ?? 0n;
const totalVotes = againstVotes + forVotes;
if (totalVotes == 0n) {
return 0;
}
const value = forVotes * 100n / totalVotes;
return Math.floor(Number(value.toString()));
}, [proposal]);
const voteTarget = useMemo(() => {
const againstVotes = proposal?.votes?.at(0)?._value ?? 0n;
const forVotes = proposal?.votes?.at(1)?._value ?? 0n;
const totalSupply = new DecimalBigNumber(
proposal?.pastTotalSupply?._value ?? 0n,
proposal?.pastTotalSupply?._decimals
);
const totalVotes = new DecimalBigNumber(
againstVotes + forVotes,
proposal?.pastTotalSupply?._decimals
);
if (totalSupply._value == 0n) {
return 80;
}
const value = Number(totalVotes / totalSupply);
const result = (5 - Math.sqrt(1 + 80/9 * (value - 0.1) )) / 4;
return Math.floor(result * 100);
}, [proposal]);
return (
<TableRow id={proposal.hashes.short + `--proposal`} data-testid={proposal.hashes.short + `--proposal`}>
<TableCell align="center" style={{ padding: "8px 0" }}>
@ -251,8 +215,8 @@ const ProposalRow = ({ proposal, blockNumber, openProposal, chainId }) => {
barColor={theme.colors.feedback.success}
barBackground={theme.colors.feedback.error}
variant="determinate"
value={voteValue}
target={voteTarget}
value={proposal?.voteValue ?? 0}
target={proposal?.voteTarget ?? 50}
/>
</Box>
</TableCell>
@ -280,7 +244,6 @@ const ProposalRow = ({ proposal, blockNumber, openProposal, chainId }) => {
const ProposalCard = ({ proposal, blockNumber, openProposal, chainId }) => {
const theme = useTheme();
const isSmallScreen = useMediaQuery('(max-width: 450px)');
return (
<Box id={proposal.hashes.short + `--proposal`} data-testid={proposal.hashes.short + `--proposal`}>
<Box display="flex" flexDirection={isSmallScreen ? "column" : "row"} justifyContent="space-between">
@ -308,8 +271,8 @@ const ProposalCard = ({ proposal, blockNumber, openProposal, chainId }) => {
barColor={theme.colors.feedback.success}
barBackground={theme.colors.feedback.error}
variant="determinate"
value={69}
target={Math.floor(Math.random() * 101)}
value={proposal?.voteValue ?? 0}
target={proposal?.voteTarget ?? 50}
/>
</Box>
<Box marginBottom="20px">

View File

@ -34,7 +34,6 @@ export const prepareCreateBondDescription = "function creates a new bond market
export const CreateBondParsed = (props) => {
const [isOpened, setIsOpened] = useState(false);
const { symbol: ftsoSymbol } = useTokenSymbol(props.chainId, "FTSO");
console.log(props)
return (
<>
<Modal

View File

@ -16,6 +16,23 @@ import { abi as GovernorVotesQuorumFractionAbi } from "../../abi/GovernorVotesQu
import { DecimalBigNumber } from "../../helpers/DecimalBigNumber";
import { getTokenDecimals, getTokenAbi, getTokenAddress } from "../helpers";
export const getVoteValue = (forVotes, totalVotes) => {
if (totalVotes == 0n) return 0;
const value = forVotes * 100n / totalVotes;
return Math.floor(Number(value.toString()));
}
export const getVoteTarget = (totalVotes, totalSupply) => {
if (totalSupply == 0n) return 80;
const precision = 10n ** 3n;
const valueRaw = (totalVotes * precision) / totalSupply;
const value = Number(valueRaw) / Number(precision);
const result = (5 - Math.sqrt(1 + 80/9 * (value - 0.1) )) / 4;
return Math.floor(result * 100);
}
export const useProposalVoteOf = (chainId, proposalId, who) => {
const { data, error } = useReadContract({
abi: GovernorAbi,
@ -464,6 +481,25 @@ export const useProposals = (chainId, depth, searchedIndexes) => {
return result;
});
const voteValues = indexes?.map(idx => {
const index = indexes.length - idx - 1;
const againstVotes = proposalVotes?.at(index)?.result?.at(0) ?? 0n
const forVotes = proposalVotes?.at(index)?.result?.at(1) ?? 0n;
const totalVotes = againstVotes + forVotes;
return getVoteValue(forVotes, totalVotes);
});
const voteTargets = indexes?.map(idx => {
const index = indexes.length - idx - 1;
const againstVotes = proposalVotes?.at(index)?.result?.at(0) ?? 0n
const forVotes = proposalVotes?.at(index)?.result?.at(1) ?? 0n;
const totalSupply = pastTotalSupplies?.at(index)?.result ?? 0n;
const totalVotes = againstVotes + forVotes;
return getVoteTarget(totalVotes, totalSupply);
});
const proposals = indexes?.map(index => ({
hashes: hashes?.at(index),
proposer: proposalProposer?.at(index)?.result,
@ -473,9 +509,9 @@ export const useProposals = (chainId, depth, searchedIndexes) => {
state: proposalStates?.at(index)?.result ?? 0,
pastTotalSupply: new DecimalBigNumber(pastTotalSupplies?.at(index)?.result ?? 0n, decimals),
quorum: new DecimalBigNumber(proposalQuorums?.at(index)?.result ?? 0n, decimals),
votes: proposalVotes?.at(index)?.result?.map(
vote => new DecimalBigNumber(vote ?? 0n, decimals),
),
votes: proposalVotes?.at(index)?.result?.map(vote => new DecimalBigNumber(vote ?? 0n, decimals)),
voteValue: voteValues?.at(index),
voteTarget: voteTargets?.at(index),
}));
return { proposals };