Merge pull request #1798 from IntersectMBO/feat/1704-showing-spo-and-…

…cc-vote-totals feat(#1704): show cc committee and spo total gov action votes
IntersectMBO · Aug 23, 2024 · d508a23 · d508a23
2 parents a709bdc + a76b22e
commit d508a23
Show file tree

Hide file tree

Showing 8 changed files with 290 additions and 84 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -13,6 +13,7 @@ changes.
 ### Added
 
 - Add support for displaying protocol parameters governance actions [Issue 1600](https://github.com/IntersectMBO/govtool/issues/1600)
+- Add SPO and CC committee total votes to gov actions [Issue 1704](https://github.com/IntersectMBO/govtool/issues/1704)
 
 ### Fixed
 

diff --git a/govtool/frontend/src/components/molecules/GovernanceActionDetailsCardVotes.tsx b/govtool/frontend/src/components/molecules/GovernanceActionDetailsCardVotes.tsx
@@ -8,9 +8,15 @@ import { GovernanceActionType } from "@/types/governanceAction";
 
 type GovernanceActionCardVotesProps = {
   setIsVoteSubmitted: Dispatch<SetStateAction<boolean>>;
-  abstainVotes: number;
-  noVotes: number;
-  yesVotes: number;
+  dRepYesVotes: number;
+  dRepNoVotes: number;
+  dRepAbstainVotes: number;
+  poolYesVotes: number;
+  poolNoVotes: number;
+  poolAbstainVotes: number;
+  ccYesVotes: number;
+  ccNoVotes: number;
+  ccAbstainVotes: number;
   isOneColumn: boolean;
   expiryDate: string;
   expiryEpochNo: number;
@@ -26,9 +32,15 @@ type GovernanceActionCardVotesProps = {
 
 export const GovernanceActionDetailsCardVotes = ({
   setIsVoteSubmitted,
-  abstainVotes,
-  noVotes,
-  yesVotes,
+  dRepAbstainVotes,
+  dRepNoVotes,
+  dRepYesVotes,
+  poolAbstainVotes,
+  poolNoVotes,
+  poolYesVotes,
+  ccAbstainVotes,
+  ccNoVotes,
+  ccYesVotes,
   isOneColumn,
   expiryDate,
   expiryEpochNo,
@@ -64,16 +76,22 @@ export const GovernanceActionDetailsCardVotes = ({
           voteUrlFromEP={voteUrlFromEP}
           voteDateFromEP={voteDateFromEP}
           voteEpochNoFromEP={voteEpochNoFromEP}
-          yesVotes={yesVotes}
-          noVotes={noVotes}
-          abstainVotes={abstainVotes}
+          dRepAbstainVotes={dRepAbstainVotes}
+          dRepNoVotes={dRepNoVotes}
+          dRepYesVotes={dRepYesVotes}
           isInProgress={isInProgress}
         />
       ) : (
         <VotesSubmitted
-          yesVotes={yesVotes}
-          noVotes={noVotes}
-          abstainVotes={abstainVotes}
+          dRepAbstainVotes={dRepAbstainVotes}
+          dRepNoVotes={dRepNoVotes}
+          dRepYesVotes={dRepYesVotes}
+          poolAbstainVotes={poolAbstainVotes}
+          poolNoVotes={poolNoVotes}
+          poolYesVotes={poolYesVotes}
+          ccAbstainVotes={ccAbstainVotes}
+          ccNoVotes={ccNoVotes}
+          ccYesVotes={ccYesVotes}
         />
       )}
     </Box>

diff --git a/govtool/frontend/src/components/molecules/VoteActionForm.tsx b/govtool/frontend/src/components/molecules/VoteActionForm.tsx
@@ -23,10 +23,10 @@ type VoteActionFormProps = {
   voteUrlFromEP?: string;
   voteDateFromEP?: string;
   voteEpochNoFromEP?: number;
-  yesVotes: number;
-  noVotes: number;
-  abstainVotes: number;
   isInProgress?: boolean;
+  dRepYesVotes: number;
+  dRepNoVotes: number;
+  dRepAbstainVotes: number;
 };
 
 export const VoteActionForm = ({
@@ -37,9 +37,9 @@ export const VoteActionForm = ({
   voteUrlFromEP,
   voteDateFromEP,
   voteEpochNoFromEP,
-  yesVotes,
-  noVotes,
-  abstainVotes,
+  dRepAbstainVotes,
+  dRepNoVotes,
+  dRepYesVotes,
   isInProgress,
 }: VoteActionFormProps) => {
   const [voteContextHash, setVoteContextHash] = useState<string | undefined>();
@@ -235,9 +235,9 @@ export const VoteActionForm = ({
               openModal({
                 type: "votingPower",
                 state: {
-                  yesVotes,
-                  noVotes,
-                  abstainVotes,
+                  dRepYesVotes,
+                  dRepNoVotes,
+                  dRepAbstainVotes,
                   vote: state && state.vote ? state.vote : voteFromEP,
                 },
               });

diff --git a/govtool/frontend/src/components/molecules/VotesSubmitted.tsx b/govtool/frontend/src/components/molecules/VotesSubmitted.tsx
@@ -3,15 +3,31 @@ import { Box, Typography } from "@mui/material";
 import { IMAGES } from "@consts";
 import { VotePill } from "@atoms";
 import { useTranslation } from "@hooks";
-import { correctAdaFormat } from "@/utils/adaFormat";
+import { correctAdaFormat } from "@utils";
 
 type Props = {
-  yesVotes: number;
-  noVotes: number;
-  abstainVotes: number;
+  dRepYesVotes: number;
+  dRepNoVotes: number;
+  dRepAbstainVotes: number;
+  poolYesVotes: number;
+  poolNoVotes: number;
+  poolAbstainVotes: number;
+  ccYesVotes: number;
+  ccNoVotes: number;
+  ccAbstainVotes: number;
 };
 
-export const VotesSubmitted = ({ yesVotes, noVotes, abstainVotes }: Props) => {
+export const VotesSubmitted = ({
+  dRepAbstainVotes,
+  dRepNoVotes,
+  dRepYesVotes,
+  poolAbstainVotes,
+  poolNoVotes,
+  poolYesVotes,
+  ccAbstainVotes,
+  ccNoVotes,
+  ccYesVotes,
+}: Props) => {
   const { t } = useTranslation();
 
   return (
@@ -42,21 +58,27 @@ export const VotesSubmitted = ({ yesVotes, noVotes, abstainVotes }: Props) => {
           fontSize: "22px",
           fontWeight: "500",
           lineHeight: "28px",
-          mb: 1,
+          mb: 3,
         }}
       >
         {t("govActions.forGovAction")}
       </Typography>
-      <Typography color="textGray" fontSize="14px" sx={{ mb: 3 }}>
-        {t("govActions.votesSubmittedOnChain")}
-      </Typography>
       <Box
         sx={{
           display: "flex",
           flexDirection: "column",
           gap: "12px",
         }}
       >
+        <Typography
+          sx={{
+            fontSize: "18px",
+            fontWeight: "600",
+            lineHeight: "24px",
+          }}
+        >
+          {t("govActions.dReps")}
+        </Typography>
         <Box sx={{ alignItems: "center", display: "flex", flexWrap: "wrap" }}>
           <VotePill vote="yes" maxWidth={82} />
           <Typography
@@ -66,7 +88,7 @@ export const VotesSubmitted = ({ yesVotes, noVotes, abstainVotes }: Props) => {
               wordBreak: "break-all",
             }}
           >
-            ₳ {correctAdaFormat(yesVotes)}
+            ₳ {correctAdaFormat(dRepYesVotes)}
           </Typography>
         </Box>
         <Box sx={{ alignItems: "center", display: "flex", flexWrap: "wrap" }}>
@@ -77,7 +99,7 @@ export const VotesSubmitted = ({ yesVotes, noVotes, abstainVotes }: Props) => {
               wordBreak: "break-all",
             }}
           >
-            ₳ {correctAdaFormat(abstainVotes)}
+            ₳ {correctAdaFormat(dRepAbstainVotes)}
           </Typography>
         </Box>
         <Box sx={{ alignItems: "center", display: "flex", flexWrap: "wrap" }}>
@@ -88,8 +110,118 @@ export const VotesSubmitted = ({ yesVotes, noVotes, abstainVotes }: Props) => {
               wordBreak: "break-all",
             }}
           >
-            ₳ {correctAdaFormat(noVotes)}
+            ₳ {correctAdaFormat(dRepNoVotes)}
+          </Typography>
+        </Box>
+        <Box
+          sx={{
+            display: "flex",
+            flexDirection: "column",
+            gap: "12px",
+            mt: "24px",
+          }}
+        >
+          <Typography
+            sx={{
+              fontSize: "18px",
+              fontWeight: "600",
+              lineHeight: "24px",
+            }}
+          >
+            {t("govActions.sPos")}
           </Typography>
+          <Box sx={{ alignItems: "center", display: "flex", flexWrap: "wrap" }}>
+            <VotePill vote="yes" maxWidth={82} />
+            <Typography
+              fontSize="16px"
+              sx={{
+                marginLeft: "12px",
+                wordBreak: "break-all",
+              }}
+            >
+              ₳ {correctAdaFormat(poolYesVotes)}
+            </Typography>
+          </Box>
+          <Box sx={{ alignItems: "center", display: "flex", flexWrap: "wrap" }}>
+            <VotePill vote="abstain" maxWidth={82} />
+            <Typography
+              sx={{
+                marginLeft: "12px",
+                wordBreak: "break-all",
+              }}
+            >
+              ₳ {correctAdaFormat(poolAbstainVotes)}
+            </Typography>
+          </Box>
+          <Box sx={{ alignItems: "center", display: "flex", flexWrap: "wrap" }}>
+            <VotePill vote="no" maxWidth={82} />
+            <Typography
+              sx={{
+                marginLeft: "12px",
+                wordBreak: "break-all",
+              }}
+            >
+              ₳ {correctAdaFormat(poolNoVotes)}
+            </Typography>
+          </Box>
+          <Box
+            sx={{
+              display: "flex",
+              flexDirection: "column",
+              gap: "12px",
+              mt: "24px",
+            }}
+          >
+            <Typography
+              sx={{
+                fontSize: "18px",
+                fontWeight: "600",
+                lineHeight: "24px",
+              }}
+            >
+              {t("govActions.ccCommittee")}
+            </Typography>
+            <Box
+              sx={{ alignItems: "center", display: "flex", flexWrap: "wrap" }}
+            >
+              <VotePill vote="yes" maxWidth={82} />
+              <Typography
+                fontSize="16px"
+                sx={{
+                  marginLeft: "12px",
+                  wordBreak: "break-all",
+                }}
+              >
+                ₳ {correctAdaFormat(ccYesVotes)}
+              </Typography>
+            </Box>
+            <Box
+              sx={{ alignItems: "center", display: "flex", flexWrap: "wrap" }}
+            >
+              <VotePill vote="abstain" maxWidth={82} />
+              <Typography
+                sx={{
+                  marginLeft: "12px",
+                  wordBreak: "break-all",
+                }}
+              >
+                ₳ {correctAdaFormat(ccAbstainVotes)}
+              </Typography>
+            </Box>
+            <Box
+              sx={{ alignItems: "center", display: "flex", flexWrap: "wrap" }}
+            >
+              <VotePill vote="no" maxWidth={82} />
+              <Typography
+                sx={{
+                  marginLeft: "12px",
+                  wordBreak: "break-all",
+                }}
+              >
+                ₳ {correctAdaFormat(ccNoVotes)}
+              </Typography>
+            </Box>
+          </Box>
         </Box>
       </Box>
     </Box>

diff --git a/govtool/frontend/src/components/organisms/DashboardGovernanceActionDetails.tsx b/govtool/frontend/src/components/organisms/DashboardGovernanceActionDetails.tsx
@@ -108,6 +108,22 @@ export const DashboardGovernanceActionDetails = () => {
             dRepAbstainVotes={
               state ? state.dRepAbstainVotes : data.proposal.dRepAbstainVotes
             }
+            dRepNoVotes={state ? state.dRepNoVotes : data.proposal.dRepNoVotes}
+            dRepYesVotes={
+              state ? state.dRepYesVotes : data.proposal.dRepYesVotes
+            }
+            poolAbstainVotes={
+              state ? state.poolAbstainVotes : data.proposal.poolAbstainVotes
+            }
+            poolNoVotes={state ? state.poolNoVotes : data.proposal.poolNoVotes}
+            poolYesVotes={
+              state ? state.poolYesVotes : data.proposal.poolYesVotes
+            }
+            ccAbstainVotes={
+              state ? state.ccAbstainVotes : data.proposal.ccAbstainVotes
+            }
+            ccNoVotes={state ? state.ccNoVotes : data.proposal.ccNoVotes}
+            ccYesVotes={state ? state.ccYesVotes : data.proposal.ccYesVotes}
             createdDate={state ? state.createdDate : data.proposal.createdDate}
             createdEpochNo={
               state ? state.createdEpochNo : data.proposal.createdEpochNo
@@ -122,7 +138,6 @@ export const DashboardGovernanceActionDetails = () => {
             isVoter={
               voter?.isRegisteredAsDRep || voter?.isRegisteredAsSoleVoter
             }
-            dRepNoVotes={state ? state.dRepNoVotes : data.proposal.dRepNoVotes}
             type={type}
             label={label}
             title={title}
@@ -132,9 +147,6 @@ export const DashboardGovernanceActionDetails = () => {
             abstract={state ? state?.abstract : data.proposal?.abstract}
             motivation={state ? state?.motivation : data.proposal?.motivation}
             rationale={state ? state?.rationale : data.proposal?.rationale}
-            dRepYesVotes={
-              state ? state.dRepYesVotes : data.proposal.dRepYesVotes
-            }
             voteFromEP={data?.vote?.vote}
             voteUrlFromEP={data?.vote?.url}
             voteDateFromEP={data?.vote?.date}