diff --git a/src/commons/resources/icons/repeatVote.svg b/src/commons/resources/icons/repeatVote.svg new file mode 100644 index 0000000000..266d26d0d4 --- /dev/null +++ b/src/commons/resources/icons/repeatVote.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/commons/resources/index.ts b/src/commons/resources/index.ts index f7bef6365d..861cb3358a 100644 --- a/src/commons/resources/index.ts +++ b/src/commons/resources/index.ts @@ -227,6 +227,7 @@ import BlackWarningIcon from "./icons/warning-black.svg?react"; import BlackCircleIcon from "./icons/black-cirle-copy.svg?react"; import RepeatVotesIcon from "./icons/repeat-votes.svg?react"; import historyIcon from "./icons/history.svg?react"; +import repeatVoteIcon from "./icons/repeatVote.svg?react"; // eslint-disable-next-line import/order import TotalOutput from "./icons/totalOutput.svg?react"; export { @@ -454,6 +455,7 @@ export { ExpiryIcon, AnchorTextIcon, BlackWarningIcon, + repeatVoteIcon, BlackCircleIcon, RepeatVotesIcon }; diff --git a/src/components/GovernanceVotes/index.tsx b/src/components/GovernanceVotes/index.tsx index fa332a992c..24546723e2 100644 --- a/src/components/GovernanceVotes/index.tsx +++ b/src/components/GovernanceVotes/index.tsx @@ -455,8 +455,10 @@ const GovernanceVotesDetail: React.FC<{ {tab === "pool" ? ( - - + + + + {data?.historyVotes && data?.historyVotes.length > 1 && ( + History } @@ -659,6 +661,7 @@ export interface GovernanceVote { type: string; vote: string; votingPower: string; + isRepeatVote: boolean; } export interface GovernanceVoteDetail { @@ -704,7 +707,7 @@ const VoteHistoryModal: React.FC = ({ onClose, open, data }) = {" "} - + @@ -759,7 +762,7 @@ const VoteHistoryModal: React.FC = ({ onClose, open, data }) = sx={{ color: theme.isDark ? theme.palette.secondary.main : theme.palette.secondary.light }} padding="none" > - {row.timestamp} + {formatDateTime(row.timestamp)} ))} @@ -806,26 +809,33 @@ const ActionMetadataModal: React.FC = ({ onClose, open, dat gap="24px" mt="20px" p="24px" - sx={{ background: theme.isDark ? "" : theme.palette.secondary[0], wordWrap: "break-word" }} + borderRadius={"10px"} + sx={{ + background: theme.isDark ? theme.palette.secondary[100] : theme.palette.secondary[0], + wordWrap: "break-word" + }} > {anchorHash} - setOpenModal(true)} - sx={{ cursor: "pointer" }} - > - {anchorUrl} + + setOpenModal(true)} + sx={{ cursor: "pointer" }} + > + {anchorUrl} + + Disclaimer:{" "} @@ -845,9 +855,7 @@ const ActionMetadataModal: React.FC = ({ onClose, open, dat diff --git a/src/components/commons/CardGovernanceVotes/index.tsx b/src/components/commons/CardGovernanceVotes/index.tsx index e6d8577548..0b8694b0d2 100644 --- a/src/components/commons/CardGovernanceVotes/index.tsx +++ b/src/components/commons/CardGovernanceVotes/index.tsx @@ -3,7 +3,7 @@ import { Box, Stack, Tooltip, Typography, useTheme } from "@mui/material"; import { useTranslation } from "react-i18next"; import { t } from "i18next"; -import { VotesAbstainIcon, VotesNoIcon, VotesNoneIcon, VotesYesIcon } from "src/commons/resources"; +import { VotesAbstainIcon, VotesNoIcon, VotesNoneIcon, VotesYesIcon, repeatVoteIcon } from "src/commons/resources"; import { ChipContainer } from "src/pages/NativeScriptsAndSC/Card"; import { POOLS_ACTION_TYPE, STATUS_VOTE } from "src/commons/utils/constants"; import { GovernanceVote } from "src/components/GovernanceVotes"; @@ -26,7 +26,7 @@ export const actionTypeListDrep = [ ]; const CardGovernanceVotes: React.FC = ({ data }) => { - const { status, txHash, type, vote, votingPower, index } = data; + const { status, txHash, type, vote, votingPower, index, isRepeatVote } = data; const theme = useTheme(); const { t } = useTranslation(); @@ -48,7 +48,7 @@ const CardGovernanceVotes: React.FC = ({ data }) => { <> - + @@ -100,12 +100,16 @@ const CardGovernanceVotes: React.FC = ({ data }) => { export default CardGovernanceVotes; -export const VoteStatus: React.FC<{ status: string }> = ({ status }) => { +export const VoteStatus: React.FC<{ status: string; isRepeatVote?: boolean }> = ({ status, isRepeatVote = false }) => { const { t } = useTranslation(); const renderStatus = (key: string) => { switch (key) { case STATUS_VOTE.YES: - return [VotesYesIcon, "success"]; + if (isRepeatVote) { + return [repeatVoteIcon, "success"]; + } else { + return [VotesYesIcon, "success"]; + } case STATUS_VOTE.NO: return [VotesNoIcon, "error"]; case STATUS_VOTE.ABSTAIN: