Merge pull request #1322 from IntersectMBO/develop

sancho-v1.0.6-qa

CHANGELOG.md

@@ -95,6 +95,9 @@ changes.
 - Remove wrongly appended `Yourself` filter on DRep Directory [Issue 1028](https://github.com/IntersectMBO/govtool/issues/1028)
 - Fix validation of uris in metadata [Issue 1011](https://github.com/IntersectMBO/govtool/issues/1011)
 - Fix wrong link to the GA Details once it is in progress [Issue 1252](https://github.com/IntersectMBO/govtool/issues/1252)
+- Fix validation of the GAs with missing references [Issue 1282](https://github.com/IntersectMBO/govtool/issues/1282)
+- Fix displaying the GA Markdowns [Issue 1244](https://github.com/IntersectMBO/govtool/issues/1244)
+- Fix app crash on voting on the GA without the connected wallet before [Issue 1313](https://github.com/IntersectMBO/govtool/issues/1313)
 
 ### Changed
 

govtool/frontend/package.json

@@ -28,7 +28,7 @@
     "@emurgo/cardano-serialization-lib-asmjs": "12.0.0-alpha.29",
     "@hookform/resolvers": "^3.3.1",
     "@intersect.mbo/intersectmbo.org-icons-set": "^1.0.8",
-    "@intersect.mbo/pdf-ui": "^0.1.3",
+    "@intersect.mbo/pdf-ui": "^0.1.8",
     "@mui/icons-material": "^5.14.3",
     "@mui/material": "^5.14.4",
     "@rollup/plugin-babel": "^6.0.4",

govtool/frontend/src/components/atoms/VotingPowerChips.test.tsx

@@ -1,86 +1,53 @@
 import { render, screen, fireEvent } from "@testing-library/react";
 import { describe, it, expect, vi } from "vitest";
 import * as Hooks from "@hooks";
-import * as Context from "@context";
 import * as Utils from "@utils";
 import { VotingPowerChips } from "@atoms";
 
 describe("VotingPowerChips", () => {
-  const mockUseCardano = vi.spyOn(Context, "useCardano");
-  const mockUseGetDRepVotingPowerQuery = vi.spyOn(
-    Hooks,
-    "useGetDRepVotingPowerQuery",
-  );
   const mockUseScreenDimension = vi.spyOn(Hooks, "useScreenDimension");
   const mockCorrectAdaFormat = vi.spyOn(Utils, "correctAdaFormat");
   const mockUseTranslation = vi.spyOn(Hooks, "useTranslation");
-  const mockUseGetVoterInfo = vi.spyOn(Hooks, "useGetVoterInfo");
 
   it("renders loading spinner when data is loading", () => {
-    mockUseCardano.mockReturnValue({
-      isEnableLoading: 'demos',
-    } as ReturnType<typeof Context.useCardano>);
-    mockUseGetDRepVotingPowerQuery.mockReturnValue(
-      {} as ReturnType<typeof Hooks.useGetDRepVotingPowerQuery>,
-    );
     mockUseScreenDimension.mockReturnValue({
       isMobile: false,
       screenWidth: 1024,
     } as ReturnType<typeof Hooks.useScreenDimension>);
     mockUseTranslation.mockReturnValue({
       t: (key: string) => key,
     } as ReturnType<typeof Hooks.useTranslation>);
-    mockUseGetVoterInfo.mockReturnValue(
-      { voter: { isRegisteredAsDRep: true } } as ReturnType<typeof Hooks.useGetVoterInfo>,
-    );
 
-    render(<VotingPowerChips />);
+    render(<VotingPowerChips isLoading isShown />);
     expect(screen.getByRole("progressbar")).toBeInTheDocument();
   });
 
   it("displays formatted ADA amount when data is available and not loading", () => {
-    mockUseCardano.mockReturnValue({
-      isEnableLoading: null,
-    } as ReturnType<typeof Context.useCardano>);
-    mockUseGetDRepVotingPowerQuery.mockReturnValue({
-      dRepVotingPower: 1000,
-    } as ReturnType<typeof Hooks.useGetDRepVotingPowerQuery>);
     mockUseScreenDimension.mockReturnValue({
       isMobile: false,
       screenWidth: 1024,
     } as ReturnType<typeof Hooks.useScreenDimension>);
     mockUseTranslation.mockReturnValue({
       t: (key: string) => key,
     } as ReturnType<typeof Hooks.useTranslation>);
-    mockUseGetVoterInfo.mockReturnValue({
-      voter: { isRegisteredAsDRep: true },
-    } as ReturnType<typeof Hooks.useGetVoterInfo>);
     mockCorrectAdaFormat.mockReturnValue(1000);
 
-    render(<VotingPowerChips />);
+    render(<VotingPowerChips isShown />);
     expect(screen.getByText(/₳ 1000/)).toBeInTheDocument();
   });
 
   it("displays the tooltip correctly for non-mobile DRep registered users", async () => {
-    mockUseCardano.mockReturnValue({
-      isEnableLoading: null,
-    } as ReturnType<typeof Context.useCardano>);
-    mockUseGetDRepVotingPowerQuery.mockReturnValue({
-      dRepVotingPower: 1000,
-    } as ReturnType<typeof Hooks.useGetDRepVotingPowerQuery>);
     mockUseScreenDimension.mockReturnValue({
       isMobile: false,
       screenWidth: 800,
     } as ReturnType<typeof Hooks.useScreenDimension>);
     mockUseTranslation.mockReturnValue({
       t: (key: string) => key,
     } as ReturnType<typeof Hooks.useTranslation>);
-    mockUseGetVoterInfo.mockReturnValue({
-      voter: { isRegisteredAsDRep: true },
-    } as ReturnType<typeof Hooks.useGetVoterInfo>);
+
     mockCorrectAdaFormat.mockReturnValue(1000);
 
-    render(<VotingPowerChips />);
+    render(<VotingPowerChips isShown />);
 
     const icon = screen.getByTestId("InfoOutlinedIcon");
     fireEvent.mouseOver(icon);

govtool/frontend/src/components/atoms/VotingPowerChips.tsx

@@ -2,24 +2,25 @@ import { Box, CircularProgress } from "@mui/material";
 import InfoOutlinedIcon from "@mui/icons-material/InfoOutlined";
 
 import { Typography, Tooltip } from "@atoms";
-import { useCardano } from "@context";
-import {
-  useGetDRepVotingPowerQuery,
-  useGetVoterInfo,
-  useScreenDimension,
-  useTranslation,
-} from "@hooks";
+import { useScreenDimension, useTranslation } from "@hooks";
 import { correctAdaFormat } from "@utils";
 
-export const VotingPowerChips = () => {
-  const { isEnableLoading } = useCardano();
-  const { voter } = useGetVoterInfo();
-  const { dRepVotingPower } = useGetDRepVotingPowerQuery(voter);
+type VotingPowerChipsProps = {
+  votingPower?: number;
+  isLoading?: boolean;
+  isShown?: boolean;
+};
+
+export const VotingPowerChips = ({
+  isLoading,
+  isShown,
+  votingPower,
+}: VotingPowerChipsProps) => {
   const { isMobile, screenWidth } = useScreenDimension();
   const { t } = useTranslation();
 
   return (
-    (voter?.isRegisteredAsDRep || voter?.isRegisteredAsSoleVoter) && (
+    isShown && (
       <Box
         data-testid="voting-power-chips"
         sx={{
@@ -56,7 +57,7 @@ export const VotingPowerChips = () => {
             {t("votingPower")}:
           </Typography>
         )}
-        {dRepVotingPower === undefined || isEnableLoading || !voter ? (
+        {isLoading ? (
           <CircularProgress size={20} color="primary" />
         ) : (
           <Typography
@@ -66,7 +67,7 @@ export const VotingPowerChips = () => {
             fontWeight={600}
             sx={{ whiteSpace: "nowrap" }}
           >
-            ₳ {correctAdaFormat(dRepVotingPower) ?? 0}
+            ₳ {correctAdaFormat(votingPower) ?? 0}
           </Typography>
         )}
       </Box>

govtool/frontend/src/components/molecules/CopyableInfo.tsx

@@ -20,7 +20,7 @@ export const CopyableInfo = ({
 }: CopyableInfoProps) => (
   <Card
     border
-    data-testid={dataTestId}
+    dataTestId={dataTestId}
     elevation={0}
     sx={{
       px: 1.5,

govtool/frontend/src/components/molecules/GovernanceActionCard.tsx

@@ -94,6 +94,7 @@ export const GovernanceActionCard: FC<ActionTypeProps> = ({ ...props }) => {
           textVariant="twoLines"
           dataTestId="governance-action-abstract"
           isSliderCard
+          isMarkdown
         />
         <GovernanceActionCardElement
           label={t("govActions.governanceActionType")}

govtool/frontend/src/components/molecules/GovernanceActionCardElement.tsx

@@ -46,6 +46,8 @@ export const GovernanceActionCardElement = ({
     <Box
       data-testid={dataTestId}
       mb={marginBottom ?? isSliderCard ? "20px" : "32px"}
+      maxHeight={isSliderCard ? "72px" : "none"}
+      overflow={isSliderCard ? "hidden" : "visible"}
     >
       <Box
         sx={{
@@ -108,6 +110,7 @@ export const GovernanceActionCardElement = ({
               display: "flex",
               alignItems: "center",
               overflow: "hidden",
+              flexDirection: isMarkdown ? "column" : "row",
             }}
           >
             {isMarkdown ? (

govtool/frontend/src/components/molecules/WalletOption.tsx

@@ -23,7 +23,7 @@ export const WalletOptionButton: FC<WalletOption> = ({
   cip95Available,
   pathToNavigate,
 }) => {
-  const { pathname, hash } = useLocation();
+  const { pathname, hash, state } = useLocation();
   const { enable, isEnableLoading } = useCardano();
   const {
     palette: { lightBlue },
@@ -38,6 +38,7 @@ export const WalletOptionButton: FC<WalletOption> = ({
         pathToNavigate ?? pathname === "/"
           ? "/dashboard"
           : `connected${pathname}${hash}`,
+        { state },
       );
       return;
     }

govtool/frontend/src/components/organisms/CreateGovernanceActionSteps/WhatGovernanceActionIsAbout.tsx

@@ -50,7 +50,7 @@ export const WhatGovernanceActionIsAbout = ({
         <Trans
           i18nKey="createGovernanceAction.creatingAGovernanceActionDescription"
           values={{
-            deposit: correctAdaFormat(protocolParams.gov_action_deposit),
+            deposit: correctAdaFormat(protocolParams?.gov_action_deposit),
           }}
         />
       </Typography>

govtool/frontend/src/components/organisms/DashboardCards.tsx

@@ -86,7 +86,7 @@ export const DashboardCards = () => {
 
         <ProposeGovActionDashboardCard
           createGovActionTx={pendingTransaction.createGovAction}
-          deposit={protocolParams.gov_action_deposit}
+          deposit={protocolParams?.gov_action_deposit}
           votingPower={votingPower}
         />
       </Box>

govtool/frontend/src/components/organisms/DashboardTopNav.tsx

@@ -1,11 +1,15 @@
 import { useEffect, useState } from "react";
-import { Box, Button, IconButton } from "@mui/material";
-import { IconPlusCircle } from "@intersect.mbo/intersectmbo.org-icons-set";
+import { Box, IconButton } from "@mui/material";
 
 import { VotingPowerChips, Typography } from "@atoms";
-import { ICONS, PATHS, PDF_PATHS } from "@consts";
-import { useScreenDimension, useTranslation } from "@hooks";
+import { ICONS } from "@consts";
+import {
+  useGetDRepVotingPowerQuery,
+  useGetVoterInfo,
+  useScreenDimension,
+} from "@hooks";
 import { DashboardDrawerMobile } from "@organisms";
+import { useCardano } from "@context";
 
 type DashboardTopNavProps = {
   title: string;
@@ -18,28 +22,17 @@ export const DashboardTopNav = ({
   title,
   isVotingPowerHidden,
 }: DashboardTopNavProps) => {
-  const { t } = useTranslation();
-  const isProposalDiscussion = Object.values(PDF_PATHS).some(
-    (pdfPath) =>
-      window.location.pathname.includes(pdfPath) &&
-      window.location.pathname.includes(
-        PATHS.connectedProposalPillar.replace("/*", ""),
-      ),
-  );
   const [windowScroll, setWindowScroll] = useState<number>(0);
   const { isMobile } = useScreenDimension();
   const [isDrawerOpen, setIsDrawerOpen] = useState<boolean>(false);
+  const { isEnableLoading } = useCardano();
+  const { voter } = useGetVoterInfo();
+  const { dRepVotingPower } = useGetDRepVotingPowerQuery(voter);
 
   const openDrawer = () => {
     setIsDrawerOpen(true);
   };
 
-  const goToProposalDiscussionCreateGovernanceAction = () => {
-    window.location.href = `${PATHS.connectedProposalPillar.replace("/*", "")}${
-      PDF_PATHS.proposalDiscussionCreateGovernanceAction
-    }`;
-  };
-
   useEffect(() => {
     const onScroll = () => {
       setWindowScroll(window.scrollY);
@@ -91,8 +84,16 @@ export const DashboardTopNav = ({
           ) : null}
         </Box>
         <Box display="flex">
-          {!isVotingPowerHidden && !isProposalDiscussion && (
-            <VotingPowerChips />
+          {!isVotingPowerHidden && (
+            <VotingPowerChips
+              isLoading={
+                dRepVotingPower === undefined || !!isEnableLoading || !voter
+              }
+              isShown={
+                voter?.isRegisteredAsDRep || voter?.isRegisteredAsSoleVoter
+              }
+              votingPower={dRepVotingPower}
+            />
           )}
           {isMobile && (
             <IconButton
@@ -103,15 +104,6 @@ export const DashboardTopNav = ({
               <img alt="drawer" src={ICONS.drawerIcon} />
             </IconButton>
           )}
-          {isProposalDiscussion && (
-            <Button
-              variant="contained"
-              startIcon={<IconPlusCircle fill="white" />}
-              onClick={goToProposalDiscussionCreateGovernanceAction}
-            >
-              {t("proposalDiscussion.proposeAGovernanceAction")}
-            </Button>
-          )}
         </Box>
         {isMobile && (
           <DashboardDrawerMobile

govtool/frontend/src/components/organisms/Drawer.tsx

@@ -2,7 +2,7 @@ import { Box, Grid } from "@mui/material";
 import { NavLink } from "react-router-dom";
 
 import { DrawerLink, Spacer } from "@atoms";
-import { CONNECTED_NAV_ITEMS, IMAGES, PATHS } from "@consts";
+import { CONNECTED_NAV_ITEMS, IMAGES, PATHS, DRAWER_WIDTH } from "@consts";
 import { useFeatureFlag } from "@context";
 import { useGetVoterInfo } from "@hooks";
 import { WalletInfoCard, DRepInfoCard } from "@molecules";
@@ -21,7 +21,7 @@ export const Drawer = () => {
         height: "100vh",
         position: "sticky",
         top: 0,
-        width: "268px",
+        width: `${DRAWER_WIDTH}px`,
       }}
     >
       <NavLink

govtool/frontend/src/consts/index.ts

@@ -9,3 +9,5 @@ export * from "./navItems";
 export * from "./paths";
 export * from "./placeholders";
 export * from "./queryKeys";
+
+export const DRAWER_WIDTH = 268;

govtool/frontend/src/consts/paths.ts

@@ -31,5 +31,4 @@ export const PATHS = {
 export const PDF_PATHS = {
   proposalDiscussion: "/proposal_discussion",
   proposalDiscussionProposal: "/proposal_discussion/:id",
-  proposalDiscussionCreateGovernanceAction: "/create-governance-action",
 };

govtool/frontend/src/context/wallet.tsx

@@ -789,7 +789,7 @@ const CardanoProvider = (props: Props) => {
           infoGovAct,
           anchor,
           rewardAddr,
-          BigNum.from_str(epochParams.gov_action_deposit.toString()),
+          BigNum.from_str(epochParams?.gov_action_deposit.toString()),
         );
         govActionBuilder.add(votingProposal);
 
@@ -830,7 +830,7 @@ const CardanoProvider = (props: Props) => {
           treasuryGovAct,
           anchor,
           rewardAddr,
-          BigNum.from_str(epochParams.gov_action_deposit.toString()),
+          BigNum.from_str(epochParams?.gov_action_deposit.toString()),
         );
         govActionBuilder.add(votingProposal);