feat(#2745): add script hash to new constitution governance action

Author: MSzalowski

CHANGELOG.md

@@ -13,6 +13,7 @@ changes.
 ### Added
 
 - Add exception handler on stake key voting power query execution [Issue 2757](https://github.com/IntersectMBO/govtool/issues/2757)
+- Add script hash to new consitution governance action [Issue 2745](https://github.com/IntersectMBO/govtool/issues/2745)
 
 ### Fixed
 

govtool/backend/sql/list-proposals.sql

@@ -175,7 +175,8 @@ SELECT
 
             WHEN gov_action_proposal.type::text = 'NewConstitution' THEN
             json_build_object(
-                'anchor', gov_action_proposal.description->'contents'->1->'anchor'
+                'anchor', gov_action_proposal.description->'contents'->1->'anchor',
+                'script', gov_action_proposal.description->'contents'->1->'script'
             )
             WHEN gov_action_proposal.type::text = 'NewCommittee' THEN
             (

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

@@ -16,6 +16,7 @@ type DataMissingHeaderProps = {
   titleStyle?: SxProps;
   isDRep?: boolean;
   image?: string | null;
+  shareLink?: string;
 };
 
 export const DataMissingHeader = ({
@@ -24,6 +25,7 @@ export const DataMissingHeader = ({
   titleStyle,
   isDRep,
   image,
+  shareLink,
 }: DataMissingHeaderProps) => {
   const base64Image = getBase64ImageDetails(image ?? "");
   const { screenWidth } = useScreenDimension();
@@ -81,7 +83,9 @@ export const DataMissingHeader = ({
             title}
         </Typography>
       </Box>
-      {screenWidth >= 1020 && <Share link={window.location.href} />}
+      {screenWidth >= 1020 && (
+        <Share link={shareLink || window.location.href} />
+      )}
     </Box>
   );
 };

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

@@ -1,30 +1,38 @@
 import { Box } from "@mui/material";
 
 import { NewConstitutionAnchor, ProposalData } from "@/models";
-import { useScreenDimension } from "@/hooks";
+import { useScreenDimension, useTranslation } from "@/hooks";
 
 import { GovernanceActionCardElement } from "./GovernanceActionCardElement";
 
 export const GovernanceActionNewConstitutionDetailsTabContent = ({
   details,
 }: Pick<ProposalData, "details">) => {
   const { screenWidth } = useScreenDimension();
+  const { t } = useTranslation();
   return (
     <Box>
       <GovernanceActionCardElement
         isLinkButton
-        label="New constitution link"
+        label={t("govActions.newConstitution.url")}
         text={(details?.anchor as NewConstitutionAnchor)?.url as string}
         dataTestId="new-constitution-url"
         textVariant={screenWidth > 1600 ? "longText" : "oneLine"}
       />
       <GovernanceActionCardElement
         isCopyButton
-        label="New constitution hash"
+        label={t("govActions.newConstitution.hash")}
         text={(details?.anchor as NewConstitutionAnchor)?.dataHash as string}
         dataTestId="new-constitution-data-hash"
         textVariant={screenWidth > 1600 ? "longText" : "oneLine"}
       />
+      <GovernanceActionCardElement
+        isCopyButton
+        label={t("govActions.newConstitution.scriptHash")}
+        text={details?.script as string}
+        dataTestId="new-constitution-script-hash"
+        textVariant={screenWidth > 1600 ? "longText" : "oneLine"}
+      />
     </Box>
   );
 };

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

@@ -5,11 +5,9 @@ import { useScreenDimension } from "@hooks";
 import {
   GovernanceActionCardStatePill,
   GovernanceActionDetailsCardVotes,
-  Share,
 } from "@molecules";
 import { GovernanceActionDetailsCardData } from "@organisms";
 import { MetadataValidationStatus, ProposalData, ProposalVote } from "@models";
-import { useLocation } from "react-router-dom";
 
 type GovernanceActionDetailsCardProps = {
   isDashboard?: boolean;
@@ -32,13 +30,6 @@ export const GovernanceActionDetailsCard = ({
   const { screenWidth, isMobile } = useScreenDimension();
 
   const isOneColumn = (isDashboard && screenWidth < 1036) ?? isMobile;
-  const { pathname, hash } = useLocation();
-
-  const govActionLinkToShare = `${window.location.protocol}//${
-    window.location.hostname
-  }${window.location.port ? `:${window.location.port}` : ""}${pathname}${
-    hash ?? ""
-  }`;
 
   return (
     <Box
@@ -82,9 +73,6 @@ export const GovernanceActionDetailsCard = ({
         isInProgress={isInProgress}
         proposal={proposal}
       />
-      <Box position="absolute" right={40} top={40}>
-        <Share link={govActionLinkToShare} />
-      </Box>
     </Box>
   );
 };

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

@@ -1,5 +1,6 @@
 import { useMemo, useState } from "react";
 import { Box, Tabs, Tab, styled } from "@mui/material";
+import { useLocation } from "react-router-dom";
 
 import { CopyButton, ExternalModalButton, Typography } from "@atoms";
 import {
@@ -95,6 +96,7 @@ export const GovernanceActionDetailsCardData = ({
   const { t } = useTranslation();
   const { screenWidth } = useScreenDimension();
   const { isMobile } = useScreenDimension();
+  const { pathname, hash } = useLocation();
 
   const mappedArraysToObjectsProtocolParams = useMemo(
     () =>
@@ -147,6 +149,12 @@ export const GovernanceActionDetailsCardData = ({
       ? getFullGovActionId(prevGovActionTxHash, prevGovActionIndex)
       : null;
 
+  const govActionLinkToShare = `${window.location.protocol}//${
+    window.location.hostname
+  }${window.location.port ? `:${window.location.port}` : ""}${pathname}${
+    hash ?? ""
+  }`;
+
   const tabs = useMemo(
     () =>
       [
@@ -232,7 +240,11 @@ export const GovernanceActionDetailsCardData = ({
         overflow: "hidden",
       }}
     >
-      <DataMissingHeader isDataMissing={isDataMissing} title={title} />
+      <DataMissingHeader
+        isDataMissing={isDataMissing}
+        title={title}
+        shareLink={govActionLinkToShare}
+      />
       <DataMissingInfoBox
         isDataMissing={isDataMissing}
         isInProgress={isInProgress}
@@ -319,20 +331,25 @@ export const GovernanceActionDetailsCardData = ({
             amount={withdrawal.amount}
           />
         ))}
-      <GovernanceActionCardElement
-        label={t("govActions.anchorURL")}
-        text={url}
-        textVariant="longText"
-        dataTestId="anchor-url"
-        isLinkButton
-      />
-      <GovernanceActionCardElement
-        label={t("govActions.anchorHash")}
-        text={metadataHash}
-        textVariant="longText"
-        dataTestId="anchor-hash"
-        isCopyButton
-      />
+      {/* NewConstitution metadata hash and url is visible in details tab */}
+      {type !== GovernanceActionType.NewConstitution && (
+        <>
+          <GovernanceActionCardElement
+            label={t("govActions.anchorURL")}
+            text={url}
+            textVariant="longText"
+            dataTestId="anchor-url"
+            isLinkButton
+          />
+          <GovernanceActionCardElement
+            label={t("govActions.anchorHash")}
+            text={metadataHash}
+            textVariant="longText"
+            dataTestId="anchor-hash"
+            isCopyButton
+          />
+        </>
+      )}
 
       <GovernanceActionDetailsCardLinks links={references} />
     </Box>

govtool/frontend/src/i18n/locales/en.json

@@ -382,6 +382,11 @@
       "proposedVersion": "Proposed version",
       "previousGAId": "Previous Governance Action ID"
     },
+    "newConstitution": {
+      "url": "New constitution link",
+      "hash": "New constitution hash",
+      "scriptHash": "New constitution script hash"
+    },
     "motivation": "Motivation",
     "myVote": "My Vote:",
     "noResultsForTheSearch": "No results for the search.",