Merge pull request #1229 from IntersectMBO/fix/1207-dashboard-drep-ca…

…rd-drep_name-is-shown-instead-title-of-drep-passed-during-registration fix/1207-dashboard-drep-card-drep_name-is-shown-instead-title-of-drep-passed-during-registration
IntersectMBO · Jun 11, 2024 · 87e1d6c · 87e1d6c
2 parents 9eda619 + c0da7cb
commit 87e1d6c
Show file tree

Hide file tree

Showing 5 changed files with 73 additions and 47 deletions.
diff --git a/govtool/frontend/src/components/molecules/DelegationAction.tsx b/govtool/frontend/src/components/molecules/DelegationAction.tsx
@@ -3,51 +3,47 @@ import ArrowForwardIosIcon from "@mui/icons-material/ArrowForwardIos";
 
 import { Typography } from "@atoms";
 import { gray } from "@consts";
-import { useTranslation } from "@hooks";
 
 import { Card } from "./Card";
 import { DirectVoterActionProps } from "./types";
 
 export const DelegationAction = ({
   dRepId,
+  drepName,
   onCardClick,
   sx,
-}: DirectVoterActionProps) => {
-  const { t } = useTranslation();
-
-  return (
-    <Card
-      border
-      elevation={0}
-      sx={{
-        alignItems: "center",
-        backgroundColor: (theme) => theme.palette.neutralWhite,
-        borderColor: gray.c100,
-        display: "flex",
-        justifyContent: "space-between",
-        px: 1.5,
-        py: 1,
-        cursor: "pointer",
-        ...sx,
-      }}
-      onCardClick={onCardClick}
-    >
-      <Box sx={{ width: "90%" }}>
-        <Typography fontWeight={600} variant="body2">
-          {t("dashboard.cards.drepName")}
-        </Typography>
-        <Typography
-          sx={{
-            mt: 0.5,
-            overflow: "hidden",
-            textOverflow: "ellipsis",
-          }}
-          variant="body2"
-        >
-          {dRepId}
-        </Typography>
-      </Box>
-      <ArrowForwardIosIcon color="primary" sx={{ height: 16, width: 24 }} />
-    </Card>
-  );
-};
+}: DirectVoterActionProps) => (
+  <Card
+    border
+    elevation={0}
+    sx={{
+      alignItems: "center",
+      backgroundColor: (theme) => theme.palette.neutralWhite,
+      borderColor: gray.c100,
+      display: "flex",
+      justifyContent: "space-between",
+      px: 1.5,
+      py: 1,
+      cursor: "pointer",
+      ...sx,
+    }}
+    onCardClick={onCardClick}
+  >
+    <Box sx={{ width: "90%" }}>
+      <Typography fontWeight={600} variant="body2">
+        {drepName}
+      </Typography>
+      <Typography
+        sx={{
+          mt: 0.5,
+          overflow: "hidden",
+          textOverflow: "ellipsis",
+        }}
+        variant="body2"
+      >
+        {dRepId}
+      </Typography>
+    </Box>
+    <ArrowForwardIosIcon color="primary" sx={{ height: 16, width: 24 }} />
+  </Card>
+);
diff --git a/govtool/frontend/src/components/molecules/types.ts b/govtool/frontend/src/components/molecules/types.ts
@@ -19,6 +19,7 @@ export type StepProps = {
 
 export type DirectVoterActionProps = {
   dRepId: string;
+  drepName: string;
   onCardClick: () => void;
   sx?: SxProps;
 };

diff --git a/govtool/frontend/src/components/organisms/DashboardCards/DelegateDashboardCard.tsx b/govtool/frontend/src/components/organisms/DashboardCards/DelegateDashboardCard.tsx
@@ -4,14 +4,19 @@ import { Trans } from "react-i18next";
 
 import { IMAGES, PATHS } from "@consts";
 import { PendingTransaction } from "@context";
-import { useTranslation } from "@hooks";
+import { useGetDRepListInfiniteQuery, useTranslation } from "@hooks";
 import { CurrentDelegation, VoterInfo } from "@models";
 import {
   DashboardActionCard,
   DashboardActionCardProps,
   DelegationAction,
 } from "@molecules";
-import { correctAdaFormat, formHexToBech32, openInNewTab } from "@utils";
+import {
+  correctAdaFormat,
+  formHexToBech32,
+  getMetadataDataMissingStatusTranslation,
+  openInNewTab,
+} from "@utils";
 import {
   AutomatedVotingOptionCurrentDelegation,
   AutomatedVotingOptionDelegationId,
@@ -34,6 +39,16 @@ export const DelegateDashboardCard = ({
 }: DelegateDashboardCardProps) => {
   const navigate = useNavigate();
   const { t } = useTranslation();
+  const { dRepData, isDRepListFetching } = useGetDRepListInfiniteQuery(
+    {
+      searchPhrase: currentDelegation?.dRepHash ?? delegateTx?.resourceId ?? "",
+    },
+    {
+      enabled: !!currentDelegation?.dRepHash || !!delegateTx?.resourceId,
+    },
+  );
+
+  const myDRepDelegationData = dRepData?.[0];
 
   const learnMoreButton = {
     children: t("learnMore"),
@@ -129,16 +144,28 @@ export const DelegateDashboardCard = ({
         (!(currentDelegation?.dRepHash === dRepID) || voter?.isRegisteredAsDRep)
       }
       transactionId={
-        !(currentDelegation?.dRepHash === dRepID) || voter?.isRegisteredAsDRep
+        !(currentDelegation?.dRepHash === dRepID) ||
+        voter?.isRegisteredAsDRep ||
+        !voter?.isRegisteredAsSoleVoter
           ? delegateTx?.transactionHash ?? currentDelegation?.txHash
           : undefined
       }
       {...cardProps}
     >
       {displayedDelegationId &&
         (!(currentDelegation?.dRepHash === dRepID) ||
-          voter?.isRegisteredAsDRep) && (
+          voter?.isRegisteredAsDRep ||
+          !voter?.isRegisteredAsSoleVoter) && (
           <DelegationAction
+            drepName={
+              isDRepListFetching
+                ? "Loading..."
+                : myDRepDelegationData?.metadataStatus
+                ? getMetadataDataMissingStatusTranslation(
+                    myDRepDelegationData.metadataStatus,
+                  )
+                : myDRepDelegationData?.dRepName ?? ""
+            }
             dRepId={displayedDelegationId}
             onCardClick={navigateToDRepDetails}
             sx={{ mt: 1.5 }}

diff --git a/govtool/frontend/src/context/pendingTransaction/utils.tsx b/govtool/frontend/src/context/pendingTransaction/utils.tsx
@@ -72,7 +72,7 @@ export const refetchData = async (
     ) {
       return data.dRepView;
     }
-    return data.dRepHash;
+    return data.dRepView;
   }
   if (type === "registerAsDrep" || type === "retireAsDrep")
     return data.isRegisteredAsDRep;

diff --git a/govtool/frontend/src/pages/DRepDirectoryContent.tsx b/govtool/frontend/src/pages/DRepDirectoryContent.tsx
@@ -107,7 +107,9 @@ export const DRepDirectoryContent: FC<DRepDirectoryContentProps> = ({
     ? [yourselfDRep, ...dRepsWithoutYourself]
     : dRepList;
   const inProgressDelegationDRepData = dRepListToDisplay.find(
-    (dRep) => dRep.drepId === inProgressDelegation,
+    (dRep) =>
+      dRep.drepId === inProgressDelegation ||
+      dRep.view === inProgressDelegation,
   );
 
   const isAnAutomatedVotingOptionChosen =
@@ -221,7 +223,7 @@ export const DRepDirectoryContent: FC<DRepDirectoryContentProps> = ({
                     isDelegating === dRep.view || isDelegating === dRep.drepId
                   }
                   isMe={isSameDRep(dRep, myDRepId)}
-                  onDelegate={() => delegate(dRep.drepId)}
+                  onDelegate={() => delegate(dRep.view)}
                 />
               </Box>
             );