From 579c2e958eef4ab779f4566371d93bbd159e0d10 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Micha=C5=82=20Sza=C5=82owski?= <michal.szalowski@gmail.com>
Date: Fri, 13 Dec 2024 17:36:21 +0100
Subject: [PATCH] fix(#2511): fix app crash on governance action details page

---
 CHANGELOG.md                                             | 1 +
 .../molecules/GovernanceActionDetailsCardLinks.tsx       | 9 +++++++--
 .../molecules/GovernanceActionDetailsCardVotes.tsx       | 2 +-
 .../src/components/molecules/GovernanceVotedOnCard.tsx   | 7 ++++++-
 .../frontend/src/components/molecules/VoteActionForm.tsx | 2 +-
 .../organisms/DashboardGovernanceActionsVotedOn.tsx      | 6 +++---
 .../components/organisms/GovernanceActionDetailsCard.tsx | 2 +-
 .../organisms/GovernanceActionDetailsCardData.tsx        | 2 +-
 .../src/components/organisms/GovernanceActionsToVote.tsx | 6 +++---
 govtool/frontend/src/hooks/forms/useVoteActionForm.tsx   | 2 +-
 govtool/frontend/src/models/api.ts                       | 4 ++--
 11 files changed, 27 insertions(+), 16 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 29d1902ef..ff00f2edd 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -19,6 +19,7 @@ changes.
 - Fix mzero parsing error on fetching the /proposal/list [Issue 2446](https://github.com/IntersectMBO/govtool/issues/2446)
 - Fix scaling gov action votes on lower resolutions
 - Fix storing url missing length validation [Issue 2044](https://github.com/IntersectMBO/govtool/issues/2044)
+- Fix governance action details page crash on missing data [Issue 2511](https://github.com/IntersectMBO/govtool/issues/2511)
 
 ### Changed
 
diff --git a/govtool/frontend/src/components/molecules/GovernanceActionDetailsCardLinks.tsx b/govtool/frontend/src/components/molecules/GovernanceActionDetailsCardLinks.tsx
index 4d37dad7a..a76571396 100644
--- a/govtool/frontend/src/components/molecules/GovernanceActionDetailsCardLinks.tsx
+++ b/govtool/frontend/src/components/molecules/GovernanceActionDetailsCardLinks.tsx
@@ -34,8 +34,13 @@ export const GovernanceActionDetailsCardLinks = ({
         >
           {t("govActions.supportingLinks")}
         </Typography>
-        {links.map(({ uri, label }) => (
-          <Box display="flex" flexDirection="column" overflow="hidden">
+        {links?.map(({ uri, label }) => (
+          <Box
+            key={`${label}-${uri}-label`}
+            display="flex"
+            flexDirection="column"
+            overflow="hidden"
+          >
             {label && (
               <Typography
                 data-testid={`${label}-${uri}-label`}
diff --git a/govtool/frontend/src/components/molecules/GovernanceActionDetailsCardVotes.tsx b/govtool/frontend/src/components/molecules/GovernanceActionDetailsCardVotes.tsx
index cdb211e7d..5bd37ba6c 100644
--- a/govtool/frontend/src/components/molecules/GovernanceActionDetailsCardVotes.tsx
+++ b/govtool/frontend/src/components/molecules/GovernanceActionDetailsCardVotes.tsx
@@ -13,7 +13,7 @@ type GovernanceActionCardVotesProps = {
   isDashboard?: boolean;
   isInProgress?: boolean;
   isVoter?: boolean;
-  vote?: ProposalVote;
+  vote?: ProposalVote | null;
   proposal: ProposalData;
 };
 
diff --git a/govtool/frontend/src/components/molecules/GovernanceVotedOnCard.tsx b/govtool/frontend/src/components/molecules/GovernanceVotedOnCard.tsx
index 0ece58804..b8ceb9cd6 100644
--- a/govtool/frontend/src/components/molecules/GovernanceVotedOnCard.tsx
+++ b/govtool/frontend/src/components/molecules/GovernanceVotedOnCard.tsx
@@ -121,7 +121,12 @@ export const GovernanceVotedOnCard = ({ votedProposal, inProgress }: Props) => {
           isCopyButton
           isSliderCard
         />
-        <GovernanceActionCardMyVote voteTxHash={vote.txHash} vote={vote.vote} />
+        {vote && (
+          <GovernanceActionCardMyVote
+            voteTxHash={vote.txHash}
+            vote={vote.vote}
+          />
+        )}
       </Box>
       <Box
         bgcolor="white"
diff --git a/govtool/frontend/src/components/molecules/VoteActionForm.tsx b/govtool/frontend/src/components/molecules/VoteActionForm.tsx
index e7fd496f0..93f433a6c 100644
--- a/govtool/frontend/src/components/molecules/VoteActionForm.tsx
+++ b/govtool/frontend/src/components/molecules/VoteActionForm.tsx
@@ -19,7 +19,7 @@ import { VoteContextModalState, SubmittedVotesModalState } from "../organisms";
 type VoteActionFormProps = {
   setIsVoteSubmitted: Dispatch<SetStateAction<boolean>>;
   isInProgress?: boolean;
-  previousVote?: ProposalVote;
+  previousVote?: ProposalVote | null;
   proposal: ProposalData;
 };
 
diff --git a/govtool/frontend/src/components/organisms/DashboardGovernanceActionsVotedOn.tsx b/govtool/frontend/src/components/organisms/DashboardGovernanceActionsVotedOn.tsx
index 5e5667109..5d4dcf134 100644
--- a/govtool/frontend/src/components/organisms/DashboardGovernanceActionsVotedOn.tsx
+++ b/govtool/frontend/src/components/organisms/DashboardGovernanceActionsVotedOn.tsx
@@ -42,7 +42,7 @@ export const DashboardGovernanceActionsVotedOn = ({
               .includes(searchPhrase.toLowerCase()),
           ),
         }))
-        .filter((entry) => entry.actions.length > 0);
+        .filter((entry) => entry.actions?.length > 0);
     }
     return data;
   }, [data, searchPhrase, pendingTransaction.vote]);
@@ -70,12 +70,12 @@ export const DashboardGovernanceActionsVotedOn = ({
                 title={getProposalTypeLabel(item.title)}
                 navigateKey={item.title}
                 searchPhrase={searchPhrase}
-                dataLength={item.actions.slice(0, 6).length}
+                dataLength={item.actions.slice(0, 6)?.length}
                 onDashboard
                 data={item.actions.map((action) => (
                   <div
                     className="keen-slider__slide"
-                    key={`${action?.proposal.id}${action.vote.vote}`}
+                    key={`${action?.proposal.id}${action.vote?.vote}`}
                     style={{ overflow: "visible", width: "auto" }}
                   >
                     <GovernanceVotedOnCard
diff --git a/govtool/frontend/src/components/organisms/GovernanceActionDetailsCard.tsx b/govtool/frontend/src/components/organisms/GovernanceActionDetailsCard.tsx
index df326ce17..1d802cb80 100644
--- a/govtool/frontend/src/components/organisms/GovernanceActionDetailsCard.tsx
+++ b/govtool/frontend/src/components/organisms/GovernanceActionDetailsCard.tsx
@@ -16,7 +16,7 @@ type GovernanceActionDetailsCardProps = {
   isDataMissing: null | MetadataValidationStatus;
   isInProgress?: boolean;
   isVoter?: boolean;
-  vote?: ProposalVote;
+  vote?: ProposalVote | null;
   proposal: ProposalData;
 };
 
diff --git a/govtool/frontend/src/components/organisms/GovernanceActionDetailsCardData.tsx b/govtool/frontend/src/components/organisms/GovernanceActionDetailsCardData.tsx
index 4c8afb370..8928a6566 100644
--- a/govtool/frontend/src/components/organisms/GovernanceActionDetailsCardData.tsx
+++ b/govtool/frontend/src/components/organisms/GovernanceActionDetailsCardData.tsx
@@ -260,7 +260,7 @@ export const GovernanceActionDetailsCardData = ({
         textVariant={screenWidth > 1600 ? "longText" : "oneLine"}
       />
 
-      {tabs.length === 1 ? (
+      {tabs?.length === 1 ? (
         tabs[0].content
       ) : (
         <>
diff --git a/govtool/frontend/src/components/organisms/GovernanceActionsToVote.tsx b/govtool/frontend/src/components/organisms/GovernanceActionsToVote.tsx
index 28777ba85..3a603668b 100644
--- a/govtool/frontend/src/components/organisms/GovernanceActionsToVote.tsx
+++ b/govtool/frontend/src/components/organisms/GovernanceActionsToVote.tsx
@@ -32,7 +32,7 @@ export const GovernanceActionsToVote = ({
 
   return (
     <>
-      {!proposals.length ? (
+      {!proposals?.length ? (
         <Typography fontWeight={300} sx={{ py: 4 }}>
           {t("govActions.noResultsForTheSearch")}
         </Typography>
@@ -91,10 +91,10 @@ export const GovernanceActionsToVote = ({
                     />
                   </div>
                 ))}
-                dataLength={item.actions.slice(0, 6).length}
+                dataLength={item.actions.slice(0, 6)?.length}
                 filters={filters}
                 navigateKey={item.title}
-                notSlicedDataLength={item.actions.length}
+                notSlicedDataLength={item.actions?.length}
                 onDashboard={onDashboard}
                 searchPhrase={searchPhrase}
                 sorting={sorting}
diff --git a/govtool/frontend/src/hooks/forms/useVoteActionForm.tsx b/govtool/frontend/src/hooks/forms/useVoteActionForm.tsx
index 447204fdb..4f215199a 100644
--- a/govtool/frontend/src/hooks/forms/useVoteActionForm.tsx
+++ b/govtool/frontend/src/hooks/forms/useVoteActionForm.tsx
@@ -31,7 +31,7 @@ export const useVoteActionFormController = () => {
 };
 
 type Props = {
-  previousVote?: ProposalVote;
+  previousVote?: ProposalVote | null;
   voteContextHash?: string;
   voteContextUrl?: string;
 };
diff --git a/govtool/frontend/src/models/api.ts b/govtool/frontend/src/models/api.ts
index 32ef7bcc5..cbd271368 100644
--- a/govtool/frontend/src/models/api.ts
+++ b/govtool/frontend/src/models/api.ts
@@ -224,12 +224,12 @@ export type NewConstitutionAnchor = {
 };
 
 export type VotedProposalDTO = {
-  vote: ProposalVote;
+  vote: ProposalVote | null;
   proposal: ProposalDataDTO;
 };
 
 export type VotedProposal = {
-  vote: ProposalVote;
+  vote: ProposalVote | null;
   proposal: ProposalData;
 };