Merge pull request #1250 from IntersectMBO/develop

Add trim func, DRep name, GA shared state, URL validation, PDF toggle; Fix metadata issues, DRep card; Update gov action guide.

.github/workflows/build-and-deploy-beta.yml

@@ -4,6 +4,15 @@ run-name: Deploy by @${{ github.actor }}
 # That should be executed on create: tag event
 on:
   workflow_dispatch:
+    inputs:
+      isProposalDiscussionForumEnabled:
+        description: "Enable proposal discussion forum"
+        required: true
+        type: choice
+        default: "disabled"
+        options:
+          - "enabled"
+          - "disabled"
 
 env:
   ENVIRONMENT: "beta"
@@ -38,7 +47,7 @@ jobs:
       SENTRY_IGNORE_API_RESOLUTION_ERROR: "1"
       TRAEFIK_LE_EMAIL: "admin+govtool@binarapps.com"
       USERSNAP_SPACE_API_KEY: ${{ secrets.USERSNAP_SPACE_API_KEY }}
-      IS_PROPOSAL_DISCUSSION_FORUM_ENABLED: "false"
+      IS_PROPOSAL_DISCUSSION_FORUM_ENABLED: ${{ inputs.isProposalDiscussionForumEnabled == 'enabled' }}
     steps:
       - name: Checkout code
         uses: actions/checkout@v4

.github/workflows/build-and-deploy-staging.yml

@@ -5,6 +5,16 @@ on:
   push:
     branches:
       - staging
+  workflow_dispatch:
+    inputs:
+      isProposalDiscussionForumEnabled:
+        description: "Enable proposal discussion forum"
+        required: true
+        type: choice
+        default: "disabled"
+        options:
+          - "enabled"
+          - "disabled"
 
 env:
   ENVIRONMENT: "staging"
@@ -40,7 +50,7 @@ jobs:
       SENTRY_IGNORE_API_RESOLUTION_ERROR: "1"
       TRAEFIK_LE_EMAIL: "admin+govtool@binarapps.com"
       USERSNAP_SPACE_API_KEY: ${{ secrets.USERSNAP_SPACE_API_KEY }}
-      IS_PROPOSAL_DISCUSSION_FORUM_ENABLED: "false"
+      IS_PROPOSAL_DISCUSSION_FORUM_ENABLED: ${{github.event_name == 'push' && 'false' || inputs.isProposalDiscussionForumEnabled == 'enabled'}}
     steps:
       - name: Checkout code
         uses: actions/checkout@v4

.github/workflows/build-and-deploy-test.yml

@@ -5,6 +5,16 @@ on:
   push:
     branches:
       - test
+  workflow_dispatch:
+    inputs:
+      isProposalDiscussionForumEnabled:
+        description: "Enable proposal discussion forum"
+        required: true
+        type: choice
+        default: "disabled"
+        options:
+          - "enabled"
+          - "disabled"
 
 env:
   ENVIRONMENT: "test"
@@ -40,7 +50,7 @@ jobs:
       SENTRY_IGNORE_API_RESOLUTION_ERROR: "1"
       TRAEFIK_LE_EMAIL: "admin+govtool@binarapps.com"
       USERSNAP_SPACE_API_KEY: ${{ secrets.USERSNAP_SPACE_API_KEY }}
-      IS_PROPOSAL_DISCUSSION_FORUM_ENABLED: "false"
+      IS_PROPOSAL_DISCUSSION_FORUM_ENABLED: ${{github.event_name == 'push' && 'false' || inputs.isProposalDiscussionForumEnabled == 'enabled'}}
     steps:
       - name: Checkout code
         uses: actions/checkout@v4

CHANGELOG.md

@@ -92,6 +92,7 @@ changes.
 - Fix all the existing typescript errors [Issue 514](https://github.com/IntersectMBO/govtool/issues/514)
 - Fix endless spinner on a dashboard [Issue 539](https://github.com/IntersectMBO/govtool/issues/539)
 - 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)
 
 ### Changed
 

docs/GOVERNANCE_ACTION_SUBMISSION.md

@@ -0,0 +1,101 @@
+# How to submit a Governance Action using GovTool
+
+## Prerequisites
+
+- Follow the steps of setting up the [GovTool Frontend](../govtool/frontend/README.md).
+- Provide any backend that provides the Epoch params (for the wallet connection), can be the current [GovTool Backend](../govtool/backend/README.md).
+- Have a wallet with the 50k of ADA to pay for the transaction and fee.
+
+## Development guide
+
+### Prerequisites
+
+For creating the Governance Action, you need to consume 2 utility methods provided by `GovernanceActionProvided` (documented later within this document), and 3 exported from `CardanoProvider` wallet actions (2 for the 2 types of supported by GovTool Governance Actions and 1 for Signing and Submitting the transaction)
+
+### Step 1: Create the Governance Action metadata object
+
+Create the Governance Action object with the fields specified by [CIP-108](https://github.com/cardano-foundation/CIPs/tree/master/CIP-0108), which are:
+
+- title
+- abstract
+- motivation
+- rationale
+- references
+
+(For the detailed documentation of the fields and their types, please refer to the [CIP-108](https://github.com/cardano-foundation/CIPs/tree/master/CIP-0108))
+
+### Step 2: Create the Governance Action JSON-LD
+
+Using the `GovernanceActionProvider` provider, use the `createGovernanceActionJsonLd` method to create the JSON-LD object for the Governance Action.
+
+Example:
+
+```typescript
+// When used within a GovernanceActionProvider
+const { createGovernanceActionJsonLD } = useCreateGovernanceAction();
+
+const jsonLd = createGovernanceActionJsonLD(governanceAction);
+```
+
+Type of the `jsonLd` object is `NodeObject` provided from the `jsonld` package by digitalbazaar ([ref](https://github.com/digitalbazaar/jsonld.js)).
+
+### Step 3: Create the Governance Action Hash of the JSON-LD
+
+Using the `GovernanceActionProvider` provider, use the `createGovernanceActionHash` method to create the hash of the JSON-LD object.
+
+Example:
+
+```typescript
+// When used within a GovernanceActionProvider
+const { createHash } = useCreateGovernanceAction();
+
+const hash = createHash(jsonLd);
+```
+
+Type of the `hash` object is `string` (blake2b-256).
+
+### Step 4: Validate the Governance Action hash and metadata
+
+Validate the Governance Action hash and metadata using any backend that provides the Governance Action validation of the metadata against the provided hash.
+
+### Step 5: Sign and Submit the Governance Action
+
+Using the `CardanoProvider` provider, use the `buildSignSubmitConwayCertTx` method to sign and submit the Governance Action, and either the `buildNewInfoGovernanceAction` or `buildTreasuryGovernanceAction` method to build the transaction based on the Governance action type.
+
+Example:
+
+```typescript
+// When used within a CardanoProvider
+const { buildSignSubmitConwayCertTx, buildNewInfoGovernanceAction } =
+  useCardano();
+
+// hash of the generated Governance Action metadata, url of the metadata
+const govActionBuilder = await buildNewInfoGovernanceAction({ hash, url });
+
+// sign and submit the transaction
+await buildSignSubmitConwayCertTx({
+  govActionBuilder,
+  type: "createGovAction",
+});
+
+// or if you want to use the Treasury Governance Action
+const { buildTreasuryGovernanceAction } = useCardano();
+
+// hash of the generated Governance Action metadata, url of the metadata, amount of the transaction, receiving address is the stake key address
+const govActionBuilder = await buildTreasuryGovernanceAction({
+  hash,
+  url,
+  amount,
+  receivingAddress,
+});
+
+// sign and submit the transaction
+await buildSignSubmitConwayCertTx({
+  govActionBuilder,
+  type: "createGovAction",
+});
+```
+
+### Step 6: Verify the Governance Action
+
+`buildSignSubmitConwayCertTx` logs the transaction CBOR making it able to be tracked on the transactions tools such as cexplorer.

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>
+);

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;
 };

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

@@ -11,7 +11,12 @@ import {
 } from "@hooks";
 import { Step } from "@molecules";
 import { BgCard, ControlledField } from "@organisms";
-import { URL_REGEX, openInNewTab } from "@utils";
+import {
+  URL_REGEX,
+  ellipsizeText,
+  isValidURLLength,
+  openInNewTab,
+} from "@utils";
 
 type StorageInformationProps = {
   setStep: Dispatch<SetStateAction<number>>;
@@ -31,7 +36,7 @@ export const StorageInformation = ({ setStep }: StorageInformationProps) => {
   } = useCreateGovernanceActionForm(setStep);
   const { screenWidth } = useScreenDimension();
 
-  const fileName = getValues("governance_action_type");
+  const fileName = getValues("governance_action_type") as string;
 
   const openGuideAboutStoringInformation = () =>
     openInNewTab(
@@ -94,7 +99,7 @@ export const StorageInformation = ({ setStep }: StorageInformationProps) => {
               }}
               variant="outlined"
             >
-              {`${fileName}.jsonld`}
+              {`${ellipsizeText(fileName, 8)}.jsonld`}
             </Button>
           }
           componentsLayoutStyles={{
@@ -131,6 +136,7 @@ export const StorageInformation = ({ setStep }: StorageInformationProps) => {
                   value: URL_REGEX,
                   message: t("createGovernanceAction.fields.validations.url"),
                 },
+                validate: isValidURLLength,
               }}
             />
           }

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 }}