From 4af8ee78215e79f9583a0b6776bcb42d938c0b60 Mon Sep 17 00:00:00 2001 From: Tom Mayel <143514860+tommayeliog@users.noreply.github.com> Date: Tue, 21 May 2024 13:48:41 +0100 Subject: [PATCH] refactor(extension): [LW-10281] dApp connector and activityDetail same components (#1085) --- .../ConfirmDRepRegistrationContainer.tsx | 40 +- .../ConfirmDRepRetirementContainer.tsx | 30 +- .../ConfirmDRepUpdateContainer.tsx | 35 +- ...rmStakeRegistrationDelegationContainer.tsx | 37 +- .../ConfirmStakeVoteDelegationContainer.tsx | 46 +- ...akeVoteRegistrationDelegationContainer.tsx | 48 +- .../ConfirmVoteDelegationContainer.tsx | 40 +- ...irmVoteRegistrationDelegationContainer.tsx | 41 +- .../ProposalProceduresContainer.tsx | 15 +- .../VotingProceduresContainer.tsx | 60 +- .../ConfirmDRepRegistrationContainer.test.tsx | 16 +- .../ConfirmDRepRetirementContainer.test.tsx | 14 +- .../ConfirmDRepUpdateContainer.test.tsx | 14 +- ...keRegistrationDelegationContainer.test.tsx | 9 - ...nfirmStakeVoteDelegationContainer.test.tsx | 15 +- ...teRegistrationDelegationContainer.test.tsx | 17 +- .../ConfirmVoteDelegationContainer.test.tsx | 33 +- ...teRegistrationDelegationContainer.test.tsx | 16 +- .../ProposalProceduresContainer.test.tsx | 2 +- .../VotingProceduresContainer.test.tsx | 48 +- .../__tests__/utils.test.tsx | 15 +- .../HardForkInitiationActionContainer.tsx | 83 +- .../InfoActionContainer.tsx | 42 +- .../NewConstitutionActionContainer.tsx | 89 +- .../NoConfidenceActionContainer.tsx | 72 +- .../ParameterChangeActionContainer.tsx | 366 -------- .../ParameterChangeActionContainer.tsx | 42 + .../ParameterChangeActionContainer/index.ts | 1 + .../TreasuryWithdrawalsActionContainer.tsx | 83 +- .../UpdateCommitteeActionContainer.tsx | 97 +-- ...HardForkInitiationActionContainer.test.tsx | 38 +- .../__tests__/InfoActionContainer.test.tsx | 44 +- .../NewConstitutionActionContainer.test.tsx | 43 +- .../NoConfidenceActionContainer.test.tsx | 35 +- .../ParameterChangeActionContainer.test.tsx | 223 +---- ...reasuryWithdrawalsActionContainer.test.tsx | 38 +- .../UpdateCommitteeActionContainer.test.tsx | 50 +- .../components/confirm-transaction/utils.ts | 22 +- .../stores/slices/activity-detail-slice.ts | 20 +- .../src/types/activity-detail.ts | 13 +- .../src/utils/tx-inspection.ts | 41 +- .../components/TransactionDetailsProxy.tsx | 16 +- .../activity/helpers/common-tx-transformer.ts | 577 +------------ packages/cardano/src/wallet/util/drep.ts | 7 + packages/cardano/src/wallet/util/index.ts | 2 + packages/cardano/src/wallet/util/voter.ts | 97 +++ packages/core/.storybook/__mocks__/cardano.ts | 11 +- .../TransactionDetails.stories.tsx | 795 ++---------------- .../ActivityDetail/TransactionDetails.tsx | 278 +----- .../{TxDetailsList.tsx => TxDetailsGroup.tsx} | 37 +- .../__tests__/TransactionDetails.test.tsx | 13 +- .../components/DetailRow.module.scss | 45 - .../ActivityDetail/components/DetailRow.tsx | 31 - .../components/DetailRowSubitems.tsx | 16 - .../ActivityDetail/components/DetailRows.tsx | 47 -- .../ActivityDetail/components/InfoItem.tsx | 19 - .../TxDetailsCertificates/CertificateView.tsx | 154 ++++ .../TxDetailsCertificates.module.scss | 8 + .../TxDetailsCertificates.tsx | 37 + .../ProposalProcedureAction.tsx | 132 +++ .../TxDetailsProposalProcedures.tsx | 34 + .../TxDetailsProposalProcedures/index.ts | 1 + .../components/TxDetailsVotingProcedures.tsx | 27 + .../ActivityDetail/components/index.ts | 1 - .../AuthorizeCommitteeCertificate.tsx | 53 ++ .../AuthorizeCommitteeCertificate/index.ts | 1 + .../ConfirmDRepRegistration.stories.tsx | 20 - .../ConfirmDRepRegistration.tsx | 58 +- .../ConfirmDRepRetirement.stories.tsx | 18 - .../ConfirmDRepRetirement.tsx | 45 +- .../ConfirmDRepUpdate.stories.tsx | 20 - .../ConfirmDRepUpdate/ConfirmDRepUpdate.tsx | 48 +- ...irmStakeRegistrationDelegation.stories.tsx | 19 - .../ConfirmStakeRegistrationDelegation.tsx | 79 +- .../ConfirmStakeVoteDelegation.stories.tsx | 22 - .../ConfirmStakeVoteDelegation.tsx | 93 +- ...takeVoteRegistrationDelegation.stories.tsx | 23 - ...ConfirmStakeVoteRegistrationDelegation.tsx | 106 ++- .../ConfirmVoteDelegation.stories.tsx | 20 - .../ConfirmVoteDelegation.tsx | 49 +- ...firmVoteRegistrationDelegation.stories.tsx | 22 - .../ConfirmVoteRegistrationDelegation.tsx | 57 +- .../DappTransaction/DappTransaction.tsx | 11 +- .../HardForkInitiationAction.stories.tsx | 38 - .../HardForkInitiationAction.tsx | 65 +- .../HardForkInitiationActionTypes.ts | 2 +- .../InfoAction/InfoAction.stories.tsx | 29 +- .../InfoAction/InfoAction.tsx | 57 +- .../InfoAction/InfoActionTypes.ts | 2 +- .../NewConstitutionAction.stories.tsx | 41 - .../NewConstitutionAction.tsx | 74 +- .../NewConstitutionActionTypes.ts | 2 +- .../NoConfidenceAction.stories.tsx | 33 - .../NoConfidenceAction/NoConfidenceAction.tsx | 66 +- .../NoConfidenceActionTypes.ts | 2 +- .../ParameterChangeAction.stories.tsx | 127 --- .../ParameterChangeAction.tsx | 312 +++++-- .../ParameterChangeActionTypes.ts | 2 +- .../TreasuryWithdrawalsAction.stories.tsx | 38 - .../TreasuryWithdrawalsAction.tsx | 125 +-- .../TreasuryWithdrawalsActionTypes.ts | 2 +- .../UpdateCommitteeActionAction.stories.tsx | 49 -- .../UpdateCommitteeActionAction.tsx | 177 ++-- .../UpdateCommitteeActionTypes.ts | 2 +- ...> ProposalProcedureTransactionDetails.tsx} | 23 +- ...oposalProcedureTransactionDetailsTypes.ts} | 1 - .../ResignCommitteeCertificate.tsx | 59 ++ .../ResignCommitteeCertificate/index.ts | 1 + .../VotingProcedures.stories.tsx | 117 +-- .../VotingProcedures/VotingProcedures.tsx | 69 +- .../src/ui/utils/governance-action-mocks.ts | 221 +++++ .../core/src/ui/utils/governance-action.ts | 377 +++++++++ packages/core/src/ui/utils/index.ts | 2 + .../src/ui/utils/voting-procedures-mock.ts | 52 ++ 114 files changed, 2719 insertions(+), 4630 deletions(-) delete mode 100644 apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/proposal-procedures/ParameterChangeActionContainer.tsx create mode 100644 apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/proposal-procedures/ParameterChangeActionContainer/ParameterChangeActionContainer.tsx create mode 100644 apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/proposal-procedures/ParameterChangeActionContainer/index.ts create mode 100644 packages/cardano/src/wallet/util/drep.ts create mode 100644 packages/cardano/src/wallet/util/voter.ts rename packages/core/src/ui/components/ActivityDetail/{TxDetailsList.tsx => TxDetailsGroup.tsx} (57%) delete mode 100644 packages/core/src/ui/components/ActivityDetail/components/DetailRow.module.scss delete mode 100644 packages/core/src/ui/components/ActivityDetail/components/DetailRow.tsx delete mode 100644 packages/core/src/ui/components/ActivityDetail/components/DetailRowSubitems.tsx delete mode 100644 packages/core/src/ui/components/ActivityDetail/components/DetailRows.tsx delete mode 100644 packages/core/src/ui/components/ActivityDetail/components/InfoItem.tsx create mode 100644 packages/core/src/ui/components/ActivityDetail/components/TxDetailsCertificates/CertificateView.tsx create mode 100644 packages/core/src/ui/components/ActivityDetail/components/TxDetailsCertificates/TxDetailsCertificates.module.scss create mode 100644 packages/core/src/ui/components/ActivityDetail/components/TxDetailsCertificates/TxDetailsCertificates.tsx create mode 100644 packages/core/src/ui/components/ActivityDetail/components/TxDetailsProposalProcedures/ProposalProcedureAction.tsx create mode 100644 packages/core/src/ui/components/ActivityDetail/components/TxDetailsProposalProcedures/TxDetailsProposalProcedures.tsx create mode 100644 packages/core/src/ui/components/ActivityDetail/components/TxDetailsProposalProcedures/index.ts create mode 100644 packages/core/src/ui/components/ActivityDetail/components/TxDetailsVotingProcedures.tsx delete mode 100644 packages/core/src/ui/components/ActivityDetail/components/index.ts create mode 100644 packages/core/src/ui/components/AuthorizeCommitteeCertificate/AuthorizeCommitteeCertificate.tsx create mode 100644 packages/core/src/ui/components/AuthorizeCommitteeCertificate/index.ts rename packages/core/src/ui/components/ProposalProcedures/components/{TransactionDetails.tsx => ProposalProcedureTransactionDetails.tsx} (51%) rename packages/core/src/ui/components/ProposalProcedures/components/{TransactionDetailsTypes.ts => ProposalProcedureTransactionDetailsTypes.ts} (91%) create mode 100644 packages/core/src/ui/components/ResignCommitteeCertificate/ResignCommitteeCertificate.tsx create mode 100644 packages/core/src/ui/components/ResignCommitteeCertificate/index.ts create mode 100644 packages/core/src/ui/utils/governance-action-mocks.ts create mode 100644 packages/core/src/ui/utils/governance-action.ts create mode 100644 packages/core/src/ui/utils/voting-procedures-mock.ts diff --git a/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/ConfirmDRepRegistrationContainer.tsx b/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/ConfirmDRepRegistrationContainer.tsx index 7cba19e55..fa62aa0cf 100644 --- a/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/ConfirmDRepRegistrationContainer.tsx +++ b/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/ConfirmDRepRegistrationContainer.tsx @@ -1,16 +1,15 @@ import React, { useEffect, useState } from 'react'; -import { useTranslation } from 'react-i18next'; -import { ConfirmDRepRegistration } from '@lace/core'; -import { certificateInspectorFactory, depositPaidWithSymbol, drepIDasBech32FromHash } from './utils'; +import { ConfirmDRepRegistration, DappInfo } from '@lace/core'; +import { certificateInspectorFactory, depositPaidWithSymbol } from './utils'; import { Wallet } from '@lace/cardano'; import { useWalletStore } from '@src/stores'; import { useViewsFlowContext } from '@providers'; import { Skeleton } from 'antd'; +import { Box, Flex } from '@lace/ui'; const { CertificateType } = Wallet.Cardano; export const ConfirmDRepRegistrationContainer = (): React.ReactElement => { - const { t } = useTranslation(); const { walletUI: { cardanoCoin } } = useWalletStore(); @@ -37,26 +36,19 @@ export const ConfirmDRepRegistrationContainer = (): React.ReactElement => { } const depositPaidWithCardanoSymbol = depositPaidWithSymbol(certificate.deposit, cardanoCoin); - - // TODO: might be changed in scope of https://input-output.atlassian.net/browse/LW-9034 return ( - + + + + + + ); }; diff --git a/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/ConfirmDRepRetirementContainer.tsx b/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/ConfirmDRepRetirementContainer.tsx index 2a146d782..7b81109f3 100644 --- a/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/ConfirmDRepRetirementContainer.tsx +++ b/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/ConfirmDRepRetirementContainer.tsx @@ -1,13 +1,14 @@ import React, { useCallback, useEffect, useState } from 'react'; import { useTranslation } from 'react-i18next'; -import { ConfirmDRepRetirement } from '@lace/core'; -import { certificateInspectorFactory, depositPaidWithSymbol, disallowSignTx, drepIDasBech32FromHash } from './utils'; +import { ConfirmDRepRetirement, DappInfo } from '@lace/core'; +import { certificateInspectorFactory, depositPaidWithSymbol, disallowSignTx } from './utils'; import { Wallet } from '@lace/cardano'; import { useWalletStore } from '@src/stores'; import { useGetOwnPubDRepKeyHash } from './hooks'; import { Skeleton } from 'antd'; import { DappError } from '../DappError'; import { useViewsFlowContext } from '@providers'; +import { Box, Flex } from '@lace/ui'; const { CertificateType } = Wallet.Cardano; @@ -75,19 +76,16 @@ export const ConfirmDRepRetirementContainer = ({ onError }: Props): React.ReactE } return ( - + + + + + + ); }; diff --git a/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/ConfirmDRepUpdateContainer.tsx b/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/ConfirmDRepUpdateContainer.tsx index 691529f97..8382b4eb7 100644 --- a/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/ConfirmDRepUpdateContainer.tsx +++ b/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/ConfirmDRepUpdateContainer.tsx @@ -1,15 +1,14 @@ import React, { useEffect, useState } from 'react'; -import { useTranslation } from 'react-i18next'; -import { ConfirmDRepUpdate } from '@lace/core'; -import { certificateInspectorFactory, drepIDasBech32FromHash } from './utils'; +import { ConfirmDRepUpdate, DappInfo } from '@lace/core'; +import { certificateInspectorFactory } from './utils'; import { Wallet } from '@lace/cardano'; import { useViewsFlowContext } from '@providers'; import { Skeleton } from 'antd'; +import { Box, Flex } from '@lace/ui'; const { CertificateType } = Wallet.Cardano; export const ConfirmDRepUpdateContainer = (): React.ReactElement => { - const { t } = useTranslation(); const { signTxRequest: { request }, dappInfo @@ -32,21 +31,17 @@ export const ConfirmDRepUpdateContainer = (): React.ReactElement => { } return ( - + + + + + + ); }; diff --git a/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/ConfirmStakeRegistrationDelegationContainer.tsx b/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/ConfirmStakeRegistrationDelegationContainer.tsx index 0d991fbf1..46417caee 100644 --- a/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/ConfirmStakeRegistrationDelegationContainer.tsx +++ b/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/ConfirmStakeRegistrationDelegationContainer.tsx @@ -1,11 +1,12 @@ import React, { useEffect, useState } from 'react'; import { useTranslation } from 'react-i18next'; -import { ConfirmStakeRegistrationDelegation } from '@lace/core'; +import { ConfirmStakeRegistrationDelegation, DappInfo } from '@lace/core'; import { certificateInspectorFactory, depositPaidWithSymbol } from './utils'; import { Wallet } from '@lace/cardano'; import { useWalletStore } from '@src/stores'; import { useViewsFlowContext } from '@providers'; import { Skeleton } from 'antd'; +import { Box, Flex, TransactionSummary } from '@lace/ui'; const { CertificateType, RewardAddress } = Wallet.Cardano; @@ -36,24 +37,22 @@ export const ConfirmStakeRegistrationDelegationContainer = (): React.ReactElemen return ; } const depositPaidWithCardanoSymbol = depositPaidWithSymbol(certificate.deposit, cardanoCoin); + return ( - + + + + + + + ); }; diff --git a/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/ConfirmStakeVoteDelegationContainer.tsx b/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/ConfirmStakeVoteDelegationContainer.tsx index df1b8eca7..4be3d8a95 100644 --- a/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/ConfirmStakeVoteDelegationContainer.tsx +++ b/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/ConfirmStakeVoteDelegationContainer.tsx @@ -1,16 +1,15 @@ import React, { useEffect, useState } from 'react'; -import { useTranslation } from 'react-i18next'; -import { ConfirmStakeVoteDelegation } from '@lace/core'; -import { certificateInspectorFactory, drepIDasBech32FromHash } from './utils'; +import { ConfirmStakeVoteDelegation, DappInfo } from '@lace/core'; +import { certificateInspectorFactory } from './utils'; import { Wallet } from '@lace/cardano'; import { useWalletStore } from '@src/stores'; import { useViewsFlowContext } from '@providers'; import { Skeleton } from 'antd'; +import { Box } from '@lace/ui'; const { CertificateType, RewardAddress } = Wallet.Cardano; export const ConfirmStakeVoteDelegationContainer = (): React.ReactElement => { - const { t } = useTranslation(); const { currentChain } = useWalletStore(); const { signTxRequest: { request }, @@ -36,28 +35,21 @@ export const ConfirmStakeVoteDelegationContainer = (): React.ReactElement => { const dRep = certificate.dRep; return ( - + <> + + + + + ); }; diff --git a/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/ConfirmStakeVoteRegistrationDelegationContainer.tsx b/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/ConfirmStakeVoteRegistrationDelegationContainer.tsx index 55fcd6639..36c98c94f 100644 --- a/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/ConfirmStakeVoteRegistrationDelegationContainer.tsx +++ b/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/ConfirmStakeVoteRegistrationDelegationContainer.tsx @@ -1,11 +1,12 @@ import React, { useEffect, useState } from 'react'; import { useTranslation } from 'react-i18next'; -import { ConfirmStakeVoteRegistrationDelegation } from '@lace/core'; -import { certificateInspectorFactory, depositPaidWithSymbol, drepIDasBech32FromHash } from './utils'; +import { ConfirmStakeVoteRegistrationDelegation, DappInfo } from '@lace/core'; +import { certificateInspectorFactory, depositPaidWithSymbol } from './utils'; import { Wallet } from '@lace/cardano'; import { useWalletStore } from '@src/stores'; import { useViewsFlowContext } from '@providers'; import { Skeleton } from 'antd'; +import { Box, Flex, TransactionSummary } from '@lace/ui'; const { CertificateType, RewardAddress } = Wallet.Cardano; @@ -41,30 +42,23 @@ export const ConfirmStakeVoteRegistrationDelegationContainer = (): React.ReactEl const depositPaidWithCardanoSymbol = depositPaidWithSymbol(certificate.deposit, cardanoCoin); return ( - + + + + + + + ); }; diff --git a/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/ConfirmVoteDelegationContainer.tsx b/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/ConfirmVoteDelegationContainer.tsx index 8590fd0fe..815ba5474 100644 --- a/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/ConfirmVoteDelegationContainer.tsx +++ b/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/ConfirmVoteDelegationContainer.tsx @@ -1,15 +1,14 @@ import React, { useEffect, useState } from 'react'; -import { useTranslation } from 'react-i18next'; -import { ConfirmVoteDelegation } from '@lace/core'; -import { certificateInspectorFactory, drepIDasBech32FromHash } from './utils'; +import { ConfirmVoteDelegation, DappInfo } from '@lace/core'; +import { certificateInspectorFactory } from './utils'; import { Wallet } from '@lace/cardano'; import { useViewsFlowContext } from '@providers'; import { Skeleton } from 'antd'; +import { Box, Flex } from '@lace/ui'; const { CertificateType } = Wallet.Cardano; export const ConfirmVoteDelegationContainer = (): React.ReactElement => { - const { t } = useTranslation(); const { signTxRequest: { request }, dappInfo @@ -34,24 +33,19 @@ export const ConfirmVoteDelegationContainer = (): React.ReactElement => { const { dRep } = certificate; return ( - + + + + + + ); }; diff --git a/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/ConfirmVoteRegistrationDelegationContainer.tsx b/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/ConfirmVoteRegistrationDelegationContainer.tsx index 60a84e13b..0e9e7a71f 100644 --- a/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/ConfirmVoteRegistrationDelegationContainer.tsx +++ b/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/ConfirmVoteRegistrationDelegationContainer.tsx @@ -1,11 +1,12 @@ import React, { useEffect, useState } from 'react'; import { useTranslation } from 'react-i18next'; -import { ConfirmVoteRegistrationDelegation } from '@lace/core'; -import { certificateInspectorFactory, depositPaidWithSymbol, drepIDasBech32FromHash } from './utils'; +import { ConfirmVoteRegistrationDelegation, DappInfo } from '@lace/core'; +import { certificateInspectorFactory, depositPaidWithSymbol } from './utils'; import { Wallet } from '@lace/cardano'; import { useWalletStore } from '@src/stores'; import { useViewsFlowContext } from '@providers'; import { Skeleton } from 'antd'; +import { Box, Flex, TransactionSummary } from '@lace/ui'; const { CertificateType, RewardAddress } = Wallet.Cardano; @@ -41,26 +42,20 @@ export const ConfirmVoteRegistrationDelegationContainer = (): React.ReactElement const depositPaidWithCardanoSymbol = depositPaidWithSymbol(deposit, cardanoCoin); return ( - + + + + + + + ); }; diff --git a/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/ProposalProceduresContainer.tsx b/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/ProposalProceduresContainer.tsx index b72eb6d91..6022c9a51 100644 --- a/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/ProposalProceduresContainer.tsx +++ b/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/ProposalProceduresContainer.tsx @@ -9,7 +9,8 @@ import { ParameterChangeActionContainer } from './proposal-procedures/ParameterC import { TreasuryWithdrawalsActionContainer } from './proposal-procedures/TreasuryWithdrawalsActionContainer'; import { UpdateCommitteeActionContainer } from './proposal-procedures/UpdateCommitteeActionContainer'; import { useViewsFlowContext } from '@providers'; -import { SignTxData } from './types'; +import { Box, Flex } from '@lace/ui'; +import { DappInfo } from '@lace/core'; export const ProposalProceduresContainer = (): React.ReactElement => { const [proposalProcedures, setProposalProcedures] = useState([]); @@ -30,12 +31,10 @@ export const ProposalProceduresContainer = (): React.ReactElement => { const containerPerTypeMap: Record< Wallet.Cardano.GovernanceActionType, (props: { - dappInfo: SignTxData['dappInfo']; governanceAction: Wallet.Cardano.GovernanceAction; deposit: Wallet.Cardano.ProposalProcedure['deposit']; rewardAccount: Wallet.Cardano.ProposalProcedure['rewardAccount']; anchor: Wallet.Cardano.ProposalProcedure['anchor']; - errorMessage?: string; }) => React.ReactElement > = useMemo( () => ({ @@ -55,10 +54,12 @@ export const ProposalProceduresContainer = (): React.ReactElement => { {proposalProcedures.map(({ deposit, rewardAccount, anchor, governanceAction }) => { const Container = containerPerTypeMap[governanceAction.__typename]; return ( - + + + + + + ); })} diff --git a/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/VotingProceduresContainer.tsx b/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/VotingProceduresContainer.tsx index fbe3515f7..10b19bdb8 100644 --- a/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/VotingProceduresContainer.tsx +++ b/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/VotingProceduresContainer.tsx @@ -1,17 +1,15 @@ import React, { useEffect, useState } from 'react'; -import { useTranslation } from 'react-i18next'; -import { VotingProcedures } from '@lace/core'; -import { getDRepId, votingProceduresInspector } from './utils'; +import { DappInfo, VotingProcedures } from '@lace/core'; +import { votingProceduresInspector } from './utils'; import { useCexplorerBaseUrl, useDisallowSignTx } from './hooks'; -import { getVote, getVoterType } from '@src/utils/tx-inspection'; import { Wallet } from '@lace/cardano'; import { NonRegisteredUserModal } from './NonRegisteredUserModal/NonRegisteredUserModal'; import { useViewsFlowContext } from '@providers'; import { useWalletStore } from '@src/stores'; +import { Box, Flex } from '@lace/ui'; export const VotingProceduresContainer = (): React.ReactElement => { - const { t } = useTranslation(); const { signTxRequest: { request }, dappInfo @@ -54,48 +52,16 @@ export const VotingProceduresContainer = (): React.ReactElement => { }} onClose={() => disallowSignTx(true)} /> - { - const voterType = getVoterType(votingProcedure.voter.__typename); - - return { - voter: { - type: t(`core.VotingProcedures.voterTypes.${voterType}`), - dRepId: getDRepId(votingProcedure.voter) - }, - votes: votingProcedure.votes.map((vote) => ({ - actionId: { - index: vote.actionId.actionIndex, - txHash: vote.actionId.id.toString(), - txHashUrl: `${explorerBaseUrl}/${vote.actionId.id}` - }, - votingProcedure: { - vote: t(`core.VotingProcedures.votes.${getVote(vote.votingProcedure.vote)}`), - anchor: !!vote.votingProcedure.anchor && { - url: vote.votingProcedure.anchor.url, - hash: vote.votingProcedure.anchor.dataHash.toString() - } - } - })) - }; - })} - translations={{ - voterType: t('core.VotingProcedures.voterType'), - procedureTitle: t('core.VotingProcedures.procedureTitle'), - actionIdTitle: t('core.VotingProcedures.actionIdTitle'), - vote: t('core.VotingProcedures.vote'), - actionId: { - index: t('core.VotingProcedures.actionId.index'), - txHash: t('core.VotingProcedures.actionId.txHash') - }, - anchor: { - hash: t('core.VotingProcedures.anchor.hash'), - url: t('core.VotingProcedures.anchor.url') - }, - dRepId: t('core.VotingProcedures.dRepId') - }} - /> + + + + + + Wallet.util.mapVotingProcedureToView(votingProcedure, explorerBaseUrl) + )} + /> + ); }; diff --git a/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/__tests__/ConfirmDRepRegistrationContainer.test.tsx b/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/__tests__/ConfirmDRepRegistrationContainer.test.tsx index 1dc94ae50..19f1454fa 100644 --- a/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/__tests__/ConfirmDRepRegistrationContainer.test.tsx +++ b/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/__tests__/ConfirmDRepRegistrationContainer.test.tsx @@ -14,10 +14,10 @@ import { act } from 'react-dom/test-utils'; import { buildMockTx } from '@src/utils/mocks/tx'; import { Wallet } from '@lace/cardano'; import { getWrapper } from '../testing.utils'; -import { depositPaidWithSymbol, drepIDasBech32FromHash } from '../utils'; +import { depositPaidWithSymbol } from '../utils'; import { TransactionWitnessRequest } from '@cardano-sdk/web-extension'; -const { Cardano, Crypto } = Wallet; +const { Cardano, Crypto, util } = Wallet; const assetInfo$ = new BehaviorSubject(new Map()); const available$ = new BehaviorSubject([]); @@ -127,21 +127,11 @@ describe('Testing ConfirmDRepRegistrationContainer component', () => { expect(queryByTestId('ConfirmDRepRegistration')).toBeInTheDocument(); expect(mockConfirmDRepRegistration).toHaveBeenLastCalledWith( { - dappInfo, metadata: { depositPaid: depositPaidWithSymbol(certificate.deposit, cardanoCoinMock as Wallet.CoinId), - drepId: drepIDasBech32FromHash(certificate.dRepCredential.hash), + drepId: util.drepIDasBech32FromHash(certificate.dRepCredential.hash), hash: certificate.anchor?.dataHash, url: certificate.anchor?.url - }, - translations: { - metadata: t('core.DRepRegistration.metadata'), - labels: { - depositPaid: t('core.DRepRegistration.depositPaid'), - drepId: t('core.DRepRegistration.drepId'), - hash: t('core.DRepRegistration.hash'), - url: t('core.DRepRegistration.url') - } } }, {} diff --git a/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/__tests__/ConfirmDRepRetirementContainer.test.tsx b/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/__tests__/ConfirmDRepRetirementContainer.test.tsx index ac55acc54..714315d3f 100644 --- a/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/__tests__/ConfirmDRepRetirementContainer.test.tsx +++ b/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/__tests__/ConfirmDRepRetirementContainer.test.tsx @@ -21,10 +21,10 @@ import { act } from 'react-dom/test-utils'; import { buildMockTx } from '@src/utils/mocks/tx'; import { Wallet } from '@lace/cardano'; import { getWrapper } from '../testing.utils'; -import { depositPaidWithSymbol, drepIDasBech32FromHash } from '../utils'; +import { depositPaidWithSymbol } from '../utils'; import { TransactionWitnessRequest } from '@cardano-sdk/web-extension'; -const { Cardano, Crypto } = Wallet; +const { Cardano, Crypto, util } = Wallet; const assetInfo$ = new BehaviorSubject(new Map()); const available$ = new BehaviorSubject([]); @@ -173,17 +173,9 @@ describe('Testing ConfirmDRepRetirementContainer component', () => { expect(queryByTestId('ConfirmDRepRetirementContainer')).toBeInTheDocument(); expect(mockConfirmDRepRetirement).toHaveBeenLastCalledWith( { - dappInfo, metadata: { depositReturned: depositPaidWithSymbol(certificate.deposit, cardanoCoinMock as Wallet.CoinId), - drepId: drepIDasBech32FromHash(certificate.dRepCredential.hash) - }, - translations: { - metadata: t('core.DRepRetirement.metadata'), - labels: { - depositReturned: t('core.DRepRetirement.depositReturned'), - drepId: t('core.DRepRetirement.drepId') - } + drepId: util.drepIDasBech32FromHash(certificate.dRepCredential.hash) } }, {} diff --git a/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/__tests__/ConfirmDRepUpdateContainer.test.tsx b/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/__tests__/ConfirmDRepUpdateContainer.test.tsx index 650361e93..6cb2fc485 100644 --- a/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/__tests__/ConfirmDRepUpdateContainer.test.tsx +++ b/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/__tests__/ConfirmDRepUpdateContainer.test.tsx @@ -14,10 +14,9 @@ import { act } from 'react-dom/test-utils'; import { buildMockTx } from '@src/utils/mocks/tx'; import { Wallet } from '@lace/cardano'; import { getWrapper } from '../testing.utils'; -import { drepIDasBech32FromHash } from '../utils'; import { TransactionWitnessRequest } from '@cardano-sdk/web-extension'; -const { Cardano, Crypto } = Wallet; +const { Cardano, Crypto, util } = Wallet; const assetInfo$ = new BehaviorSubject(new Map()); const available$ = new BehaviorSubject([]); @@ -126,19 +125,10 @@ describe('Testing ConfirmDRepUpdateContainer component', () => { expect(queryByTestId('ConfirmDRepUpdate')).toBeInTheDocument(); expect(mockConfirmDRepUpdate).toHaveBeenLastCalledWith( { - dappInfo, metadata: { - drepId: drepIDasBech32FromHash(certificate.dRepCredential.hash), + drepId: util.drepIDasBech32FromHash(certificate.dRepCredential.hash), hash: certificate.anchor?.dataHash, url: certificate.anchor?.url - }, - translations: { - metadata: t('core.DRepUpdate.metadata'), - labels: { - drepId: t('core.DRepUpdate.drepId'), - hash: t('core.DRepUpdate.hash'), - url: t('core.DRepUpdate.url') - } } }, {} diff --git a/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/__tests__/ConfirmStakeRegistrationDelegationContainer.test.tsx b/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/__tests__/ConfirmStakeRegistrationDelegationContainer.test.tsx index 318361616..a07869d10 100644 --- a/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/__tests__/ConfirmStakeRegistrationDelegationContainer.test.tsx +++ b/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/__tests__/ConfirmStakeRegistrationDelegationContainer.test.tsx @@ -145,19 +145,10 @@ describe('Testing ConfirmStakeRegistrationDelegationContainer component', () => expect(queryByTestId('ConfirmStakeRegistrationDelegation')).toBeInTheDocument(); expect(mockConfirmStakeRegistrationDelegation).toHaveBeenLastCalledWith( { - dappInfo, metadata: { poolId: certificate.poolId, stakeKeyHash: 'stake_test1uqrw9tjymlm8wrwq7jk68n6v7fs9qz8z0tkdkve26dylmfc2ux2hj', depositPaid: depositPaidWithSymbol(certificate.deposit, cardanoCoinMock as Wallet.CoinId) - }, - translations: { - metadata: t('core.StakeRegistrationDelegation.metadata'), - labels: { - poolId: t('core.StakeRegistrationDelegation.poolId'), - stakeKeyHash: t('core.StakeRegistrationDelegation.stakeKeyHash'), - depositPaid: t('core.StakeRegistrationDelegation.depositPaid') - } } }, {} diff --git a/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/__tests__/ConfirmStakeVoteDelegationContainer.test.tsx b/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/__tests__/ConfirmStakeVoteDelegationContainer.test.tsx index 3de25766c..fb6aba120 100644 --- a/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/__tests__/ConfirmStakeVoteDelegationContainer.test.tsx +++ b/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/__tests__/ConfirmStakeVoteDelegationContainer.test.tsx @@ -17,7 +17,6 @@ import { act } from 'react-dom/test-utils'; import { buildMockTx } from '@src/utils/mocks/tx'; import { Wallet } from '@lace/cardano'; import { getWrapper } from '../testing.utils'; -import { drepIDasBech32FromHash } from '../utils'; import { TransactionWitnessRequest } from '@cardano-sdk/web-extension'; const REWARD_ACCOUNT = Wallet.Cardano.RewardAccount('stake_test1uqrw9tjymlm8wrwq7jk68n6v7fs9qz8z0tkdkve26dylmfc2ux2hj'); @@ -160,24 +159,12 @@ describe('Testing ConfirmStakeVoteDelegationContainer component', () => { expect(queryByTestId('ConfirmStakeVoteDelegation')).toBeInTheDocument(); expect(mockConfirmStakeVoteDelegation).toHaveBeenLastCalledWith( { - dappInfo, metadata: { poolId: certificate.poolId, stakeKeyHash: 'stake_test1uqrw9tjymlm8wrwq7jk68n6v7fs9qz8z0tkdkve26dylmfc2ux2hj', alwaysAbstain: isDRepAlwaysAbstainMocked, alwaysNoConfidence: isDRepAlwaysNoConfidenceMocked, - drepId: drepIDasBech32FromHash((certificate.dRep as Wallet.Cardano.Credential).hash) - }, - translations: { - metadata: t('core.StakeVoteDelegation.metadata'), - option: t('core.StakeVoteDelegation.option'), - labels: { - poolId: t('core.StakeVoteDelegation.poolId'), - stakeKeyHash: t('core.StakeVoteDelegation.stakeKeyHash'), - drepId: t('core.StakeVoteDelegation.drepId'), - alwaysAbstain: t('core.StakeVoteDelegation.alwaysAbstain'), - alwaysNoConfidence: t('core.StakeVoteDelegation.alwaysNoConfidence') - } + drepId: Wallet.util.drepIDasBech32FromHash((certificate.dRep as Wallet.Cardano.Credential).hash) } }, {} diff --git a/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/__tests__/ConfirmStakeVoteRegistrationDelegationContainer.test.tsx b/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/__tests__/ConfirmStakeVoteRegistrationDelegationContainer.test.tsx index 1528d4542..8a230d446 100644 --- a/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/__tests__/ConfirmStakeVoteRegistrationDelegationContainer.test.tsx +++ b/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/__tests__/ConfirmStakeVoteRegistrationDelegationContainer.test.tsx @@ -18,7 +18,7 @@ import { act } from 'react-dom/test-utils'; import { buildMockTx } from '@src/utils/mocks/tx'; import { Wallet } from '@lace/cardano'; import { getWrapper } from '../testing.utils'; -import { depositPaidWithSymbol, drepIDasBech32FromHash } from '../utils'; +import { depositPaidWithSymbol } from '../utils'; import { TransactionWitnessRequest } from '@cardano-sdk/web-extension'; const REWARD_ACCOUNT = Wallet.Cardano.RewardAccount('stake_test1uqrw9tjymlm8wrwq7jk68n6v7fs9qz8z0tkdkve26dylmfc2ux2hj'); @@ -169,26 +169,13 @@ describe('Testing ConfirmStakeVoteRegistrationDelegationContainer component', () expect(queryByTestId('ConfirmStakeVoteRegistrationDelegation')).toBeInTheDocument(); expect(mockConfirmStakeVoteRegistrationDelegation).toHaveBeenLastCalledWith( { - dappInfo, metadata: { poolId: certificate.poolId, stakeKeyHash: 'stake_test1uqrw9tjymlm8wrwq7jk68n6v7fs9qz8z0tkdkve26dylmfc2ux2hj', depositPaid: depositPaidWithSymbol(certificate.deposit, cardanoCoinMock as Wallet.CoinId), alwaysAbstain: isDRepAlwaysAbstainMocked, alwaysNoConfidence: isDRepAlwaysNoConfidenceMocked, - drepId: drepIDasBech32FromHash((certificate.dRep as Wallet.Cardano.Credential).hash) - }, - translations: { - metadata: t('core.StakeVoteDelegationRegistration.metadata'), - option: t('core.StakeVoteDelegationRegistration.option'), - labels: { - poolId: t('core.StakeVoteDelegationRegistration.poolId'), - stakeKeyHash: t('core.StakeVoteDelegationRegistration.stakeKeyHash'), - drepId: t('core.StakeVoteDelegationRegistration.drepId'), - alwaysAbstain: t('core.StakeVoteDelegationRegistration.alwaysAbstain'), - alwaysNoConfidence: t('core.StakeVoteDelegationRegistration.alwaysNoConfidence'), - depositPaid: t('core.StakeVoteDelegationRegistration.depositPaid') - } + drepId: Wallet.util.drepIDasBech32FromHash((certificate.dRep as Wallet.Cardano.Credential).hash) } }, {} diff --git a/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/__tests__/ConfirmVoteDelegationContainer.test.tsx b/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/__tests__/ConfirmVoteDelegationContainer.test.tsx index 0f2083c18..6a682dca5 100644 --- a/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/__tests__/ConfirmVoteDelegationContainer.test.tsx +++ b/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/__tests__/ConfirmVoteDelegationContainer.test.tsx @@ -16,7 +16,6 @@ import { act } from 'react-dom/test-utils'; import { buildMockTx } from '@src/utils/mocks/tx'; import { Wallet } from '@lace/cardano'; import { getWrapper } from '../testing.utils'; -import { drepIDasBech32FromHash } from '../utils'; const REWARD_ACCOUNT = Wallet.Cardano.RewardAccount('stake_test1uqrw9tjymlm8wrwq7jk68n6v7fs9qz8z0tkdkve26dylmfc2ux2hj'); const STAKE_KEY_HASH = Wallet.Cardano.RewardAccount.toHash(REWARD_ACCOUNT); @@ -132,20 +131,10 @@ describe('Testing ConfirmVoteDelegationContainer component', () => { expect(queryByTestId('ConfirmVoteDelegation')).toBeInTheDocument(); expect(mockConfirmVoteDelegation).toHaveBeenLastCalledWith( { - dappInfo, metadata: { alwaysAbstain: false, alwaysNoConfidence: false, - drepId: drepIDasBech32FromHash((dRep as unknown as Wallet.Cardano.Credential).hash) - }, - translations: { - metadata: t('core.VoteDelegation.metadata'), - option: t('core.VoteDelegation.option'), - labels: { - drepId: t('core.VoteDelegation.drepId'), - alwaysAbstain: t('core.VoteDelegation.alwaysAbstain'), - alwaysNoConfidence: t('core.VoteDelegation.alwaysNoConfidence') - } + drepId: Wallet.util.drepIDasBech32FromHash((dRep as unknown as Wallet.Cardano.Credential).hash) } }, {} @@ -187,19 +176,9 @@ describe('Testing ConfirmVoteDelegationContainer component', () => { expect(queryByTestId('ConfirmVoteDelegation')).toBeInTheDocument(); expect(mockConfirmVoteDelegation).toHaveBeenLastCalledWith( { - dappInfo, metadata: { alwaysAbstain: true, alwaysNoConfidence: false - }, - translations: { - metadata: t('core.VoteDelegation.metadata'), - option: t('core.VoteDelegation.option'), - labels: { - drepId: t('core.VoteDelegation.drepId'), - alwaysAbstain: t('core.VoteDelegation.alwaysAbstain'), - alwaysNoConfidence: t('core.VoteDelegation.alwaysNoConfidence') - } } }, {} @@ -241,19 +220,9 @@ describe('Testing ConfirmVoteDelegationContainer component', () => { expect(queryByTestId('ConfirmVoteDelegation')).toBeInTheDocument(); expect(mockConfirmVoteDelegation).toHaveBeenLastCalledWith( { - dappInfo, metadata: { alwaysAbstain: false, alwaysNoConfidence: true - }, - translations: { - metadata: t('core.VoteDelegation.metadata'), - option: t('core.VoteDelegation.option'), - labels: { - drepId: t('core.VoteDelegation.drepId'), - alwaysAbstain: t('core.VoteDelegation.alwaysAbstain'), - alwaysNoConfidence: t('core.VoteDelegation.alwaysNoConfidence') - } } }, {} diff --git a/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/__tests__/ConfirmVoteRegistrationDelegationContainer.test.tsx b/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/__tests__/ConfirmVoteRegistrationDelegationContainer.test.tsx index cf88de426..96ef2038b 100644 --- a/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/__tests__/ConfirmVoteRegistrationDelegationContainer.test.tsx +++ b/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/__tests__/ConfirmVoteRegistrationDelegationContainer.test.tsx @@ -19,7 +19,7 @@ import { act } from 'react-dom/test-utils'; import { buildMockTx } from '@src/utils/mocks/tx'; import { Wallet } from '@lace/cardano'; import { getWrapper } from '../testing.utils'; -import { depositPaidWithSymbol, drepIDasBech32FromHash } from '../utils'; +import { depositPaidWithSymbol } from '../utils'; import { TransactionWitnessRequest } from '@cardano-sdk/web-extension'; const REWARD_ACCOUNT = Wallet.Cardano.RewardAccount('stake_test1uqrw9tjymlm8wrwq7jk68n6v7fs9qz8z0tkdkve26dylmfc2ux2hj'); @@ -167,24 +167,12 @@ describe('Testing ConfirmVoteRegistrationDelegationContainer component', () => { expect(queryByTestId('ConfirmVoteRegistrationDelegation')).toBeInTheDocument(); expect(mockConfirmVoteRegistrationDelegation).toHaveBeenLastCalledWith( { - dappInfo, metadata: { depositPaid: depositPaidWithSymbol(certificate.deposit, cardanoCoinMock as Wallet.CoinId), stakeKeyHash: 'stake_test1uqrw9tjymlm8wrwq7jk68n6v7fs9qz8z0tkdkve26dylmfc2ux2hj', alwaysAbstain: isDRepAlwaysAbstainMocked, alwaysNoConfidence: isDRepAlwaysNoConfidenceMocked, - drepId: drepIDasBech32FromHash((certificate.dRep as Wallet.Cardano.Credential).hash) - }, - translations: { - metadata: t('core.VoteRegistrationDelegation.metadata'), - option: t('core.VoteRegistrationDelegation.option'), - labels: { - drepId: t('core.VoteRegistrationDelegation.drepId'), - alwaysAbstain: t('core.VoteRegistrationDelegation.alwaysAbstain'), - alwaysNoConfidence: t('core.VoteRegistrationDelegation.alwaysNoConfidence'), - depositPaid: t('core.VoteRegistrationDelegation.depositPaid'), - stakeKeyHash: t('core.VoteRegistrationDelegation.stakeKeyHash') - } + drepId: Wallet.util.drepIDasBech32FromHash((certificate.dRep as Wallet.Cardano.Credential).hash) } }, {} diff --git a/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/__tests__/ProposalProceduresContainer.test.tsx b/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/__tests__/ProposalProceduresContainer.test.tsx index 21faa2faa..d2acefc59 100644 --- a/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/__tests__/ProposalProceduresContainer.test.tsx +++ b/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/__tests__/ProposalProceduresContainer.test.tsx @@ -160,7 +160,7 @@ describe('Testing ProposalProceduresContainer component', () => { expect(queryByTestId('TreasuryWithdrawalsActionContainer')).toBeInTheDocument(); expect(queryByTestId('UpdateCommitteeActionContainer')).toBeInTheDocument(); - const expectedProps = { dappInfo, deposit, rewardAccount, anchor }; + const expectedProps = { deposit, rewardAccount, anchor }; expect(mockHardForkInitiationActionContainer).toHaveBeenLastCalledWith( { ...expectedProps, governanceAction: hardForkInitiationAction }, diff --git a/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/__tests__/VotingProceduresContainer.test.tsx b/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/__tests__/VotingProceduresContainer.test.tsx index 6e14b70ef..c03dea66a 100644 --- a/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/__tests__/VotingProceduresContainer.test.tsx +++ b/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/__tests__/VotingProceduresContainer.test.tsx @@ -19,8 +19,6 @@ import { act } from 'react-dom/test-utils'; import { buildMockTx } from '@src/utils/mocks/tx'; import { Wallet } from '@lace/cardano'; import { getWrapper } from '../testing.utils'; -import { getVoterType, getVote, VoterTypeEnum, VotesEnum } from '@src/utils/tx-inspection'; -import { drepIDasBech32FromHash } from '../utils'; import { TransactionWitnessRequest } from '@cardano-sdk/web-extension'; import { of } from 'rxjs'; @@ -205,14 +203,13 @@ describe('Testing VotingProceduresContainer component', () => { expect(queryByTestId('VotingProcedures')).toBeInTheDocument(); // eslint-disable-next-line unicorn/consistent-function-scoping const getExpectedDrepId = (type: string) => (hash: Wallet.Crypto.Hash28ByteBase16) => - type === VoterTypeEnum.DREP ? drepIDasBech32FromHash(hash) : hash.toString(); + type === Wallet.util.VoterTypeEnum.DREP ? Wallet.util.drepIDasBech32FromHash(hash) : hash.toString(); expect(mockVotingProcedures).toHaveBeenLastCalledWith( { - dappInfo, data: voters.map(({ __typename }, index) => ({ voter: { - type: t(`core.VotingProcedures.voterTypes.${getVoterType(__typename)}`), - dRepId: getExpectedDrepId(getVoterType(__typename))(voters[index].credential.hash) + type: Wallet.util.getVoterType(__typename), + dRepId: getExpectedDrepId(Wallet.util.getVoterType(__typename))(voters[index].credential.hash) }, votes: votingProcedures[index].votes.map((vote) => ({ actionId: { @@ -221,29 +218,14 @@ describe('Testing VotingProceduresContainer component', () => { txHashUrl: `${mockPreprodCexplorerBaseUrl}/${mockCexplorerUrlPathsTx}/${vote.actionId.id}` }, votingProcedure: { - vote: t(`core.VotingProcedures.votes.${getVote(vote.votingProcedure.vote)}`), + vote: Wallet.util.getVote(vote.votingProcedure.vote), anchor: !!vote.votingProcedure.anchor?.url && { url: vote.votingProcedure.anchor?.url, hash: vote.votingProcedure.anchor?.dataHash.toString() } } })) - })), - translations: { - voterType: t('core.VotingProcedures.voterType'), - procedureTitle: t('core.VotingProcedures.procedureTitle'), - actionIdTitle: t('core.VotingProcedures.actionIdTitle'), - vote: t('core.VotingProcedures.vote'), - actionId: { - index: t('core.VotingProcedures.actionId.index'), - txHash: t('core.VotingProcedures.actionId.txHash') - }, - anchor: { - hash: t('core.VotingProcedures.anchor.hash'), - url: t('core.VotingProcedures.anchor.url') - }, - dRepId: t('core.VotingProcedures.dRepId') - } + })) }, {} ); @@ -311,20 +293,20 @@ describe('Testing VotingProceduresContainer component', () => { }); test('testing getVoterType', () => { - expect(getVoterType(constitutionalCommitteeKeyHashVoter.__typename)).toEqual( - VoterTypeEnum.CONSTITUTIONAL_COMMITTEE + expect(Wallet.util.getVoterType(constitutionalCommitteeKeyHashVoter.__typename)).toEqual( + Wallet.util.VoterTypeEnum.CONSTITUTIONAL_COMMITTEE ); - expect(getVoterType(constitutionalCommitteeScriptHashVoter.__typename)).toEqual( - VoterTypeEnum.CONSTITUTIONAL_COMMITTEE + expect(Wallet.util.getVoterType(constitutionalCommitteeScriptHashVoter.__typename)).toEqual( + Wallet.util.VoterTypeEnum.CONSTITUTIONAL_COMMITTEE ); - expect(getVoterType(drepKeyHashVoter.__typename)).toEqual(VoterTypeEnum.DREP); - expect(getVoterType(drepScriptHashVoter.__typename)).toEqual(VoterTypeEnum.DREP); - expect(getVoterType(stakePoolKeyHashVoter.__typename)).toEqual(VoterTypeEnum.SPO); + expect(Wallet.util.getVoterType(drepKeyHashVoter.__typename)).toEqual(Wallet.util.VoterTypeEnum.DREP); + expect(Wallet.util.getVoterType(drepScriptHashVoter.__typename)).toEqual(Wallet.util.VoterTypeEnum.DREP); + expect(Wallet.util.getVoterType(stakePoolKeyHashVoter.__typename)).toEqual(Wallet.util.VoterTypeEnum.SPO); }); test('testing getVote', () => { - expect(getVote(Wallet.Cardano.Vote.yes)).toEqual(VotesEnum.YES); - expect(getVote(Wallet.Cardano.Vote.no)).toEqual(VotesEnum.NO); - expect(getVote(Wallet.Cardano.Vote.abstain)).toEqual(VotesEnum.ABSTAIN); + expect(Wallet.util.getVote(Wallet.Cardano.Vote.yes)).toEqual(Wallet.util.VotesEnum.YES); + expect(Wallet.util.getVote(Wallet.Cardano.Vote.no)).toEqual(Wallet.util.VotesEnum.NO); + expect(Wallet.util.getVote(Wallet.Cardano.Vote.abstain)).toEqual(Wallet.util.VotesEnum.ABSTAIN); }); }); diff --git a/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/__tests__/utils.test.tsx b/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/__tests__/utils.test.tsx index 919dad9d2..2e3bc31cd 100644 --- a/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/__tests__/utils.test.tsx +++ b/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/__tests__/utils.test.tsx @@ -1,6 +1,5 @@ /* eslint-disable unicorn/consistent-function-scoping */ /* eslint-disable import/imports-first */ -const mockDRepID = jest.fn(); const mockHexBlob = (val: string) => val; mockHexBlob.toTypedBech32 = (prefix: string, value: string) => `${prefix}${value}`; /* eslint-disable unicorn/no-useless-undefined */ @@ -15,7 +14,6 @@ import { certificateInspectorFactory, votingProceduresInspector, getTxType, - drepIDasBech32FromHash, pubDRepKeyToHash, depositPaidWithSymbol } from '../utils'; @@ -33,8 +31,7 @@ jest.mock('@lace/cardano', () => { Wallet: { ...actual.Wallet, Cardano: { - ...actual.Wallet.Cardano, - DRepID: mockDRepID + ...actual.Wallet.Cardano }, HexBlob: mockHexBlob, Crypto: { @@ -149,11 +146,11 @@ describe('Testing utils', () => { }); test('testing drepIDasBech32FromHash', () => { - mockDRepID.mockReset(); - mockDRepID.mockImplementation((val) => val); - - const drepID = '_drepID'; - expect(drepIDasBech32FromHash(drepID as Wallet.Crypto.Hash28ByteBase16)).toEqual(`drep${drepID}`); + expect( + Wallet.util.drepIDasBech32FromHash( + '8293d319ef5b3ac72366dd28006bd315b715f7e7cfcbd3004129b80d' as Wallet.Crypto.Hash28ByteBase16 + ) + ).toEqual('drep1s2faxx00tvavwgmxm55qq67nzkm3tal8el9axqzp9xuq6s8s0wp'); }); test('testing pubDRepKeyToHash', async () => { diff --git a/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/proposal-procedures/HardForkInitiationActionContainer.tsx b/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/proposal-procedures/HardForkInitiationActionContainer.tsx index af62be524..5eed36800 100644 --- a/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/proposal-procedures/HardForkInitiationActionContainer.tsx +++ b/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/proposal-procedures/HardForkInitiationActionContainer.tsx @@ -1,95 +1,40 @@ import React, { useMemo } from 'react'; -import { useTranslation } from 'react-i18next'; import { Wallet } from '@lace/cardano'; -import { HardForkInitiationAction } from '@lace/core'; +import { HardForkInitiationAction, getHardForkInitiationActionViewData } from '@lace/core'; import { useWalletStore } from '@src/stores'; -import { SignTxData } from '../types'; import { useCexplorerBaseUrl } from '../hooks'; interface Props { - dappInfo: SignTxData['dappInfo']; governanceAction: Wallet.Cardano.HardForkInitiationAction; deposit: Wallet.Cardano.ProposalProcedure['deposit']; rewardAccount: Wallet.Cardano.ProposalProcedure['rewardAccount']; anchor: Wallet.Cardano.ProposalProcedure['anchor']; - errorMessage?: string; } export const HardForkInitiationActionContainer = ({ - dappInfo, governanceAction, deposit, rewardAccount, - anchor, - errorMessage + anchor }: Props): React.ReactElement => { - const { t } = useTranslation(); const { walletUI: { cardanoCoin } } = useWalletStore(); const explorerBaseUrl = useCexplorerBaseUrl(); - const translations = useMemo[0]['translations']>( - () => ({ - txDetails: { - title: t('core.ProposalProcedure.txDetails.title'), - txType: t('core.ProposalProcedure.txDetails.txType'), - deposit: t('core.ProposalProcedure.txDetails.deposit'), - rewardAccount: t('core.ProposalProcedure.txDetails.rewardAccount') - }, - procedure: { - title: t('core.ProposalProcedure.procedure.title'), - anchor: { - url: t('core.ProposalProcedure.procedure.anchor.url'), - hash: t('core.ProposalProcedure.procedure.anchor.hash') - } - }, - protocolVersion: { - major: t('core.ProposalProcedure.governanceAction.hardForkInitiation.protocolVersion.major'), - minor: t('core.ProposalProcedure.governanceAction.hardForkInitiation.protocolVersion.minor'), - patch: t('core.ProposalProcedure.governanceAction.hardForkInitiation.protocolVersion.patch') - }, - actionId: { - title: t('core.ProposalProcedure.governanceAction.actionId.title'), - index: t('core.ProposalProcedure.governanceAction.actionId.index'), - txId: t('core.ProposalProcedure.governanceAction.actionId.txId') - } - }), - [t] - ); - - const { governanceActionId, protocolVersion } = governanceAction; - - const data: Parameters[0]['data'] = { - txDetails: { - txType: t('core.ProposalProcedure.governanceAction.hardForkInitiation.title'), - deposit: Wallet.util.getFormattedAmount({ - amount: deposit.toString(), - cardanoCoin + const data = useMemo( + () => + getHardForkInitiationActionViewData({ + anchor, + cardanoCoin, + deposit, + explorerBaseUrl, + governanceAction, + rewardAccount }), - rewardAccount - }, - procedure: { - anchor: { - url: anchor.url, - hash: anchor.dataHash, - txHashUrl: `${explorerBaseUrl}/${anchor.dataHash}` - } - }, - protocolVersion: { - major: protocolVersion.major.toString(), - minor: protocolVersion.minor.toString() - }, - ...(governanceActionId && { - actionId: { - index: governanceActionId.actionIndex.toString(), - id: governanceActionId.id || '' - } - }) - }; - - return ( - + [anchor, cardanoCoin, deposit, explorerBaseUrl, governanceAction, rewardAccount] ); + + return ; }; diff --git a/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/proposal-procedures/InfoActionContainer.tsx b/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/proposal-procedures/InfoActionContainer.tsx index f880b2b86..d209532bb 100644 --- a/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/proposal-procedures/InfoActionContainer.tsx +++ b/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/proposal-procedures/InfoActionContainer.tsx @@ -1,50 +1,16 @@ import React, { useMemo } from 'react'; -import { useTranslation } from 'react-i18next'; import { Wallet } from '@lace/cardano'; -import { InfoAction } from '@lace/core'; -import { SignTxData } from '../types'; +import { InfoAction, getInfoActionViewData } from '@lace/core'; import { useCexplorerBaseUrl } from '../hooks'; interface Props { - dappInfo: SignTxData['dappInfo']; anchor: Wallet.Cardano.ProposalProcedure['anchor']; - errorMessage?: string; } -export const InfoActionContainer = ({ dappInfo, anchor, errorMessage }: Props): React.ReactElement => { - const { t } = useTranslation(); - +export const InfoActionContainer = ({ anchor }: Props): React.ReactElement => { const explorerBaseUrl = useCexplorerBaseUrl(); - const translations = useMemo[0]['translations']>( - () => ({ - txDetails: { - title: t('core.ProposalProcedure.txDetails.title'), - txType: t('core.ProposalProcedure.txDetails.txType') - }, - procedure: { - title: t('core.ProposalProcedure.procedure.title'), - anchor: { - url: t('core.ProposalProcedure.procedure.anchor.url'), - hash: t('core.ProposalProcedure.procedure.anchor.hash') - } - } - }), - [t] - ); - - const data: Parameters[0]['data'] = { - txDetails: { - txType: t('core.ProposalProcedure.governanceAction.infoAction.title') - }, - procedure: { - anchor: { - url: anchor.url, - hash: anchor.dataHash, - txHashUrl: `${explorerBaseUrl}/${anchor.dataHash}` - } - } - }; + const data = useMemo(() => getInfoActionViewData({ anchor, explorerBaseUrl }), [anchor, explorerBaseUrl]); - return ; + return ; }; diff --git a/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/proposal-procedures/NewConstitutionActionContainer.tsx b/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/proposal-procedures/NewConstitutionActionContainer.tsx index aef32fb04..ebc07f273 100644 --- a/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/proposal-procedures/NewConstitutionActionContainer.tsx +++ b/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/proposal-procedures/NewConstitutionActionContainer.tsx @@ -1,101 +1,40 @@ import React, { useMemo } from 'react'; -import { useTranslation } from 'react-i18next'; import { Wallet } from '@lace/cardano'; -import { NewConstitutionAction } from '@lace/core'; +import { NewConstitutionAction, getNewConstitutionActionViewData } from '@lace/core'; import { useWalletStore } from '@src/stores'; -import { SignTxData } from '../types'; import { useCexplorerBaseUrl } from '../hooks'; interface Props { - dappInfo: SignTxData['dappInfo']; governanceAction: Wallet.Cardano.NewConstitution; deposit: Wallet.Cardano.ProposalProcedure['deposit']; rewardAccount: Wallet.Cardano.ProposalProcedure['rewardAccount']; anchor: Wallet.Cardano.ProposalProcedure['anchor']; - errorMessage?: string; } export const NewConstitutionActionContainer = ({ - dappInfo, governanceAction, deposit, rewardAccount, - anchor, - errorMessage + anchor }: Props): React.ReactElement => { - const { t } = useTranslation(); const { walletUI: { cardanoCoin } } = useWalletStore(); const explorerBaseUrl = useCexplorerBaseUrl(); - const translations = useMemo[0]['translations']>( - () => ({ - txDetails: { - title: t('core.ProposalProcedure.txDetails.title'), - txType: t('core.ProposalProcedure.txDetails.txType'), - deposit: t('core.ProposalProcedure.txDetails.deposit'), - rewardAccount: t('core.ProposalProcedure.txDetails.rewardAccount') - }, - procedure: { - title: t('core.ProposalProcedure.procedure.title'), - anchor: { - url: t('core.ProposalProcedure.procedure.anchor.url'), - hash: t('core.ProposalProcedure.procedure.anchor.hash') - } - }, - constitution: { - title: t('core.ProposalProcedure.governanceAction.newConstitutionAction.constitution.title'), - anchor: { - dataHash: t('core.ProposalProcedure.governanceAction.newConstitutionAction.constitution.anchor.dataHash'), - url: t('core.ProposalProcedure.governanceAction.newConstitutionAction.constitution.anchor.url') - }, - scriptHash: t('core.ProposalProcedure.governanceAction.newConstitutionAction.constitution.scriptHash') - }, - actionId: { - title: t('core.ProposalProcedure.governanceAction.actionId.title'), - index: t('core.ProposalProcedure.governanceAction.actionId.index'), - txId: t('core.ProposalProcedure.governanceAction.actionId.txId') - } - }), - [t] - ); - - const { governanceActionId, constitution } = governanceAction; - - const data: Parameters[0]['data'] = { - txDetails: { - txType: t('core.ProposalProcedure.governanceAction.newConstitutionAction.title'), - deposit: Wallet.util.getFormattedAmount({ - amount: deposit.toString(), - cardanoCoin + const data = useMemo( + () => + getNewConstitutionActionViewData({ + anchor, + cardanoCoin, + deposit, + explorerBaseUrl, + governanceAction, + rewardAccount }), - rewardAccount - }, - procedure: { - anchor: { - url: anchor.url, - hash: anchor.dataHash, - txHashUrl: `${explorerBaseUrl}/${anchor.dataHash}` - } - }, - ...(governanceActionId && { - actionId: { - index: governanceActionId.actionIndex.toString(), - id: governanceActionId.id || '' - } - }), - constitution: { - anchor: { - dataHash: constitution.anchor.dataHash.toString(), - url: constitution.anchor.url.toString() - }, - ...(constitution.scriptHash && { scriptHash: constitution.scriptHash.toString() }) - } - }; - - return ( - + [anchor, cardanoCoin, deposit, explorerBaseUrl, governanceAction, rewardAccount] ); + + return ; }; diff --git a/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/proposal-procedures/NoConfidenceActionContainer.tsx b/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/proposal-procedures/NoConfidenceActionContainer.tsx index b7abdb9ce..cfc6b8606 100644 --- a/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/proposal-procedures/NoConfidenceActionContainer.tsx +++ b/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/proposal-procedures/NoConfidenceActionContainer.tsx @@ -1,84 +1,40 @@ import React, { useMemo } from 'react'; -import { useTranslation } from 'react-i18next'; import { Wallet } from '@lace/cardano'; -import { NoConfidenceAction } from '@lace/core'; +import { NoConfidenceAction, getNoConfidenceActionViewData } from '@lace/core'; import { useWalletStore } from '@src/stores'; -import { SignTxData } from '../types'; import { useCexplorerBaseUrl } from '../hooks'; interface Props { - dappInfo: SignTxData['dappInfo']; governanceAction: Wallet.Cardano.NoConfidence; deposit: Wallet.Cardano.ProposalProcedure['deposit']; rewardAccount: Wallet.Cardano.ProposalProcedure['rewardAccount']; anchor: Wallet.Cardano.ProposalProcedure['anchor']; - errorMessage?: string; } export const NoConfidenceActionContainer = ({ - dappInfo, governanceAction, deposit, rewardAccount, - anchor, - errorMessage + anchor }: Props): React.ReactElement => { - const { t } = useTranslation(); const { walletUI: { cardanoCoin } } = useWalletStore(); const explorerBaseUrl = useCexplorerBaseUrl(); - const translations = useMemo[0]['translations']>( - () => ({ - txDetails: { - title: t('core.ProposalProcedure.txDetails.title'), - txType: t('core.ProposalProcedure.txDetails.txType'), - deposit: t('core.ProposalProcedure.txDetails.deposit'), - rewardAccount: t('core.ProposalProcedure.txDetails.rewardAccount') - }, - procedure: { - title: t('core.ProposalProcedure.procedure.title'), - anchor: { - url: t('core.ProposalProcedure.procedure.anchor.url'), - hash: t('core.ProposalProcedure.procedure.anchor.hash') - } - }, - actionId: { - title: t('core.ProposalProcedure.governanceAction.actionId.title'), - index: t('core.ProposalProcedure.governanceAction.actionId.index'), - txId: t('core.ProposalProcedure.governanceAction.actionId.txId') - } - }), - [t] - ); - - const { governanceActionId } = governanceAction; - - const data: Parameters[0]['data'] = { - txDetails: { - txType: t('core.ProposalProcedure.governanceAction.noConfidenceAction.title'), - deposit: Wallet.util.getFormattedAmount({ - amount: deposit.toString(), - cardanoCoin + const data = useMemo( + () => + getNoConfidenceActionViewData({ + anchor, + cardanoCoin, + deposit, + explorerBaseUrl, + governanceAction, + rewardAccount }), - rewardAccount - }, - procedure: { - anchor: { - url: anchor.url, - hash: anchor.dataHash, - txHashUrl: `${explorerBaseUrl}/${anchor.dataHash}` - } - }, - ...(governanceActionId && { - actionId: { - index: governanceActionId.actionIndex.toString(), - id: governanceActionId.id || '' - } - }) - }; + [anchor, cardanoCoin, deposit, explorerBaseUrl, governanceAction, rewardAccount] + ); - return ; + return ; }; diff --git a/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/proposal-procedures/ParameterChangeActionContainer.tsx b/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/proposal-procedures/ParameterChangeActionContainer.tsx deleted file mode 100644 index 55cc6a5c8..000000000 --- a/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/proposal-procedures/ParameterChangeActionContainer.tsx +++ /dev/null @@ -1,366 +0,0 @@ -/* eslint-disable unicorn/no-array-reduce */ -import React, { useMemo } from 'react'; -import { useTranslation } from 'react-i18next'; -import { formatPercentages } from '@lace/common'; -import { Wallet } from '@lace/cardano'; -import { ParameterChangeAction } from '@lace/core'; -import { useWalletStore } from '@src/stores'; -import { SignTxData } from '../types'; -import { useCexplorerBaseUrl } from '../hooks'; - -interface Props { - dappInfo: SignTxData['dappInfo']; - governanceAction: Wallet.Cardano.ParameterChangeAction; - deposit: Wallet.Cardano.ProposalProcedure['deposit']; - rewardAccount: Wallet.Cardano.ProposalProcedure['rewardAccount']; - anchor: Wallet.Cardano.ProposalProcedure['anchor']; - errorMessage?: string; -} - -export const ParameterChangeActionContainer = ({ - dappInfo, - governanceAction, - deposit, - rewardAccount, - anchor, - errorMessage -}: Props): React.ReactElement => { - const { t } = useTranslation(); - const { - walletUI: { cardanoCoin } - } = useWalletStore(); - - const explorerBaseUrl = useCexplorerBaseUrl(); - - // TODO: consider encapsulating it inside the component itself, check if all the translations have the fallback to the parent int provider (LW-9920) - const translations = useMemo[0]['translations']>( - () => ({ - txDetails: { - title: t('core.ProposalProcedure.txDetails.title'), - txType: t('core.ProposalProcedure.txDetails.txType'), - deposit: t('core.ProposalProcedure.txDetails.deposit'), - rewardAccount: t('core.ProposalProcedure.txDetails.rewardAccount') - }, - anchor: { - url: t('core.ProposalProcedure.procedure.anchor.url'), - hash: t('core.ProposalProcedure.procedure.anchor.hash') - }, - memory: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.memory'), - step: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.step'), - networkGroup: { - title: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.networkGroup.title'), - maxBBSize: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.networkGroup.maxBBSize'), - maxTxSize: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.networkGroup.maxTxSize'), - maxBHSize: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.networkGroup.maxBHSize'), - maxValSize: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.networkGroup.maxValSize'), - maxTxExUnits: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.networkGroup.maxTxExUnits'), - maxBlockExUnits: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.networkGroup.maxBlockExUnits'), - maxCollateralInputs: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.networkGroup.maxCollateralInputs' - ), - tooltip: { - maxBBSize: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.networkGroup.tooltip.maxBBSize'), - maxTxSize: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.networkGroup.tooltip.maxTxSize'), - maxBHSize: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.networkGroup.tooltip.maxBHSize'), - maxValSize: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.networkGroup.tooltip.maxValSize'), - maxTxExUnits: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.networkGroup.tooltip.maxTxExUnits' - ), - maxBlockExUnits: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.networkGroup.tooltip.maxBlockExUnits' - ), - maxCollateralInputs: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.networkGroup.tooltip.maxCollateralInputs' - ) - } - }, - economicGroup: { - title: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.economicGroup.title'), - minFeeA: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.economicGroup.minFeeA'), - minFeeB: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.economicGroup.minFeeB'), - keyDeposit: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.economicGroup.keyDeposit'), - poolDeposit: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.economicGroup.poolDeposit'), - rho: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.economicGroup.rho'), - tau: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.economicGroup.tau'), - minPoolCost: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.economicGroup.minPoolCost'), - coinsPerUTxOByte: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.economicGroup.coinsPerUTxOByte' - ), - prices: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.economicGroup.prices'), - tooltip: { - minFeeA: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.economicGroup.tooltip.minFeeA'), - minFeeB: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.economicGroup.tooltip.minFeeB'), - keyDeposit: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.economicGroup.tooltip.keyDeposit'), - poolDeposit: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.economicGroup.tooltip.poolDeposit' - ), - rho: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.economicGroup.tooltip.rho'), - tau: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.economicGroup.tooltip.tau'), - minPoolCost: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.economicGroup.tooltip.minPoolCost' - ), - coinsPerUTxOByte: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.economicGroup.tooltip.coinsPerUTxOByte' - ), - prices: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.economicGroup.tooltip.prices') - } - }, - technicalGroup: { - title: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.technicalGroup.title'), - a0: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.technicalGroup.a0'), - eMax: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.technicalGroup.eMax'), - nOpt: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.technicalGroup.nOpt'), - costModels: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.technicalGroup.costModels'), - collateralPercentage: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.technicalGroup.collateralPercentage' - ), - tooltip: { - a0: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.technicalGroup.tooltip.a0'), - eMax: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.technicalGroup.tooltip.eMax'), - nOpt: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.technicalGroup.tooltip.nOpt'), - costModels: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.technicalGroup.tooltip.costModels' - ), - collateralPercentage: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.technicalGroup.tooltip.collateralPercentage' - ) - } - }, - governanceGroup: { - title: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.title'), - govActionLifetime: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.govActionLifetime' - ), - govActionDeposit: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.govActionDeposit' - ), - drepDeposit: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.drepDeposit'), - drepActivity: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.drepActivity'), - ccMinSize: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.ccMinSize'), - ccMaxTermLength: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.ccMaxTermLength' - ), - dRepVotingThresholds: { - title: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.dRepVotingThresholds.title' - ), - motionNoConfidence: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.dRepVotingThresholds.motionNoConfidence' - ), - committeeNormal: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.dRepVotingThresholds.committeeNormal' - ), - committeeNoConfidence: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.dRepVotingThresholds.committeeNoConfidence' - ), - updateConstitution: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.dRepVotingThresholds.updateConstitution' - ), - hardForkInitiation: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.dRepVotingThresholds.hardForkInitiation' - ), - ppNetworkGroup: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.dRepVotingThresholds.ppNetworkGroup' - ), - ppEconomicGroup: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.dRepVotingThresholds.ppEconomicGroup' - ), - ppTechnicalGroup: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.dRepVotingThresholds.ppTechnicalGroup' - ), - ppGovernanceGroup: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.dRepVotingThresholds.ppGovernanceGroup' - ), - treasuryWithdrawal: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.dRepVotingThresholds.treasuryWithdrawal' - ) - }, - tooltip: { - govActionLifetime: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.tooltip.govActionLifetime' - ), - govActionDeposit: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.tooltip.govActionDeposit' - ), - drepDeposit: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.tooltip.drepDeposit' - ), - drepActivity: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.tooltip.drepActivity' - ), - ccMinSize: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.tooltip.ccMinSize'), - ccMaxTermLength: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.tooltip.ccMaxTermLength' - ), - dRepVotingThresholds: { - title: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.tooltip.dRepVotingThresholds.title' - ), - motionNoConfidence: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.tooltip.dRepVotingThresholds.motionNoConfidence' - ), - committeeNormal: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.tooltip.dRepVotingThresholds.committeeNormal' - ), - committeeNoConfidence: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.tooltip.dRepVotingThresholds.committeeNoConfidence' - ), - updateConstitution: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.tooltip.dRepVotingThresholds.updateConstitution' - ), - hardForkInitiation: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.tooltip.dRepVotingThresholds.hardForkInitiation' - ), - ppNetworkGroup: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.tooltip.dRepVotingThresholds.ppNetworkGroup' - ), - ppEconomicGroup: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.tooltip.dRepVotingThresholds.ppEconomicGroup' - ), - ppTechnicalGroup: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.tooltip.dRepVotingThresholds.ppTechnicalGroup' - ), - ppGovernanceGroup: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.tooltip.dRepVotingThresholds.ppGovernanceGroup' - ), - treasuryWithdrawal: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.tooltip.dRepVotingThresholds.treasuryWithdrawal' - ) - } - } - } - }), - [t] - ); - - const { - protocolParamUpdate: { - maxBlockBodySize, - maxTxSize, - maxBlockHeaderSize, - maxValueSize, - maxExecutionUnitsPerTransaction, - maxExecutionUnitsPerBlock, - maxCollateralInputs, - stakeKeyDeposit, - poolDeposit, - minFeeCoefficient, - minFeeConstant, - treasuryExpansion, - monetaryExpansion, - minPoolCost, - coinsPerUtxoByte, - prices, - poolInfluence, - poolRetirementEpochBound, - desiredNumberOfPools, - costModels, - collateralPercentage, - governanceActionDeposit, - dRepDeposit, - governanceActionValidityPeriod, - dRepInactivityPeriod, - minCommitteeSize, - committeeTermLimit, - dRepVotingThresholds: { - motionNoConfidence, - committeeNormal, - commiteeNoConfidence, - updateConstitution, - hardForkInitiation, - ppNetworkGroup, - ppEconomicGroup, - ppTechnicalGroup, - ppGovernanceGroup, - treasuryWithdrawal - } - } - } = governanceAction; - - const data: Parameters[0]['data'] = { - txDetails: { - txType: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.title'), - deposit: Wallet.util.getFormattedAmount({ - amount: deposit.toString(), - cardanoCoin - }), - rewardAccount - }, - anchor: { - url: anchor.url, - hash: anchor.dataHash, - txHashUrl: `${explorerBaseUrl}/${anchor.dataHash}` - }, - protocolParamUpdate: { - maxTxExUnits: { - memory: maxExecutionUnitsPerTransaction.memory.toString(), - step: maxExecutionUnitsPerTransaction.steps.toString() - }, - maxBlockExUnits: { - memory: maxExecutionUnitsPerBlock.memory.toString(), - step: maxExecutionUnitsPerBlock.steps.toString() - }, - networkGroup: { - maxBBSize: maxBlockBodySize.toString(), - maxTxSize: maxTxSize.toString(), - maxBHSize: maxBlockHeaderSize.toString(), - maxValSize: maxValueSize.toString(), - maxCollateralInputs: maxCollateralInputs.toString() - }, - economicGroup: { - minFeeA: minFeeCoefficient.toString(), - minFeeB: minFeeConstant.toString(), - keyDeposit: stakeKeyDeposit.toString(), - poolDeposit: poolDeposit.toString(), - rho: monetaryExpansion, - tau: treasuryExpansion, - minPoolCost: minPoolCost.toString(), - coinsPerUTxOByte: coinsPerUtxoByte.toString(), - price: { - memory: prices.memory.toString(), - step: prices.steps.toString() - } - }, - technicalGroup: { - a0: poolInfluence, - eMax: poolRetirementEpochBound.toString(), - nOpt: desiredNumberOfPools.toString(), - costModels: { - PlutusV1: Object.entries(costModels.get(Wallet.Cardano.PlutusLanguageVersion.V1)).reduce( - (acc, cur) => ({ ...acc, [cur[0]]: cur[1] }), - {} - ), - PlutusV2: Object.entries(costModels.get(Wallet.Cardano.PlutusLanguageVersion.V2)).reduce( - (acc, cur) => ({ ...acc, [cur[0]]: cur[1] }), - {} - ) - }, - collateralPercentage: collateralPercentage.toString() - }, - governanceGroup: { - govActionLifetime: governanceActionValidityPeriod.toString(), - govActionDeposit: governanceActionDeposit.toString(), - drepDeposit: dRepDeposit.toString(), - drepActivity: dRepInactivityPeriod.toString(), - ccMinSize: minCommitteeSize.toString(), - ccMaxTermLength: committeeTermLimit.toString(), - dRepVotingThresholds: { - motionNoConfidence: formatPercentages(motionNoConfidence.numerator / motionNoConfidence.denominator), - committeeNormal: formatPercentages(committeeNormal.numerator / committeeNormal.denominator), - committeeNoConfidence: formatPercentages(commiteeNoConfidence.numerator / commiteeNoConfidence.denominator), - updateToConstitution: formatPercentages(updateConstitution.numerator / updateConstitution.denominator), - hardForkInitiation: formatPercentages(hardForkInitiation.numerator / hardForkInitiation.denominator), - ppNetworkGroup: formatPercentages(ppNetworkGroup.numerator / ppNetworkGroup.denominator), - ppEconomicGroup: formatPercentages(ppEconomicGroup.numerator / ppEconomicGroup.denominator), - ppTechnicalGroup: formatPercentages(ppTechnicalGroup.numerator / ppTechnicalGroup.denominator), - ppGovGroup: formatPercentages(ppGovernanceGroup.numerator / ppGovernanceGroup.denominator), - treasuryWithdrawal: formatPercentages(treasuryWithdrawal.numerator / treasuryWithdrawal.denominator) - } - } - } - }; - - return ( - - ); -}; diff --git a/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/proposal-procedures/ParameterChangeActionContainer/ParameterChangeActionContainer.tsx b/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/proposal-procedures/ParameterChangeActionContainer/ParameterChangeActionContainer.tsx new file mode 100644 index 000000000..60cb02090 --- /dev/null +++ b/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/proposal-procedures/ParameterChangeActionContainer/ParameterChangeActionContainer.tsx @@ -0,0 +1,42 @@ +/* eslint-disable unicorn/no-array-reduce */ +import React, { useMemo } from 'react'; +import { Wallet } from '@lace/cardano'; +import { ParameterChangeAction, getParameterChangeActionViewData } from '@lace/core'; +import { useWalletStore } from '@src/stores'; + +import { useCexplorerBaseUrl } from '../../hooks'; + +interface Props { + governanceAction: Wallet.Cardano.ParameterChangeAction; + deposit: Wallet.Cardano.ProposalProcedure['deposit']; + rewardAccount: Wallet.Cardano.ProposalProcedure['rewardAccount']; + anchor: Wallet.Cardano.ProposalProcedure['anchor']; +} + +export const ParameterChangeActionContainer = ({ + governanceAction, + deposit, + rewardAccount, + anchor +}: Props): React.ReactElement => { + const { + walletUI: { cardanoCoin } + } = useWalletStore(); + + const explorerBaseUrl = useCexplorerBaseUrl(); + + const data = useMemo( + () => + getParameterChangeActionViewData({ + governanceAction, + deposit, + rewardAccount, + anchor, + cardanoCoin, + explorerBaseUrl + }), + [anchor, cardanoCoin, deposit, explorerBaseUrl, governanceAction, rewardAccount] + ); + + return ; +}; diff --git a/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/proposal-procedures/ParameterChangeActionContainer/index.ts b/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/proposal-procedures/ParameterChangeActionContainer/index.ts new file mode 100644 index 000000000..0670b1368 --- /dev/null +++ b/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/proposal-procedures/ParameterChangeActionContainer/index.ts @@ -0,0 +1 @@ +export { ParameterChangeActionContainer } from './ParameterChangeActionContainer'; diff --git a/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/proposal-procedures/TreasuryWithdrawalsActionContainer.tsx b/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/proposal-procedures/TreasuryWithdrawalsActionContainer.tsx index ed81ffb33..ea857a087 100644 --- a/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/proposal-procedures/TreasuryWithdrawalsActionContainer.tsx +++ b/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/proposal-procedures/TreasuryWithdrawalsActionContainer.tsx @@ -1,95 +1,40 @@ import React, { useMemo } from 'react'; -import { useTranslation } from 'react-i18next'; import { Wallet } from '@lace/cardano'; -import { TreasuryWithdrawalsAction } from '@lace/core'; +import { TreasuryWithdrawalsAction, getTreasuryWithdrawalsActionViewData } from '@lace/core'; import { useWalletStore } from '@src/stores'; -import { SignTxData } from '../types'; import { useCexplorerBaseUrl } from '../hooks'; -import { depositPaidWithSymbol } from '../utils'; interface Props { - dappInfo: SignTxData['dappInfo']; governanceAction: Wallet.Cardano.TreasuryWithdrawalsAction; deposit: Wallet.Cardano.ProposalProcedure['deposit']; rewardAccount: Wallet.Cardano.ProposalProcedure['rewardAccount']; anchor: Wallet.Cardano.ProposalProcedure['anchor']; - errorMessage?: string; } export const TreasuryWithdrawalsActionContainer = ({ - dappInfo, governanceAction, deposit, rewardAccount, - anchor, - errorMessage + anchor }: Props): React.ReactElement => { - const { t } = useTranslation(); const { walletUI: { cardanoCoin } } = useWalletStore(); const explorerBaseUrl = useCexplorerBaseUrl(); - const translations = useMemo[0]['translations']>( - () => ({ - txDetails: { - title: t('core.ProposalProcedure.txDetails.title'), - txType: t('core.ProposalProcedure.txDetails.txType'), - deposit: t('core.ProposalProcedure.txDetails.deposit'), - rewardAccount: t('core.ProposalProcedure.txDetails.rewardAccount') - }, - procedure: { - title: t('core.ProposalProcedure.procedure.title'), - anchor: { - url: t('core.ProposalProcedure.procedure.anchor.url'), - hash: t('core.ProposalProcedure.procedure.anchor.hash') - } - }, - actionId: { - title: t('core.ProposalProcedure.governanceAction.actionId.title'), - index: t('core.ProposalProcedure.governanceAction.actionId.index'), - txId: t('core.ProposalProcedure.governanceAction.actionId.txId') - }, - withdrawals: { - title: t('core.ProposalProcedure.governanceAction.treasuryWithdrawals.title'), - rewardAccount: t('core.ProposalProcedure.governanceAction.treasuryWithdrawals.withdrawals.rewardAccount'), - lovelace: t('core.ProposalProcedure.governanceAction.treasuryWithdrawals.withdrawals.lovelace') - } - }), - [t] + const data = useMemo( + () => + getTreasuryWithdrawalsActionViewData({ + anchor, + cardanoCoin, + deposit, + explorerBaseUrl, + governanceAction, + rewardAccount + }), + [anchor, cardanoCoin, deposit, explorerBaseUrl, governanceAction, rewardAccount] ); - const { withdrawals } = governanceAction; - - const data: Parameters[0]['data'] = { - txDetails: { - txType: t('core.ProposalProcedure.governanceAction.treasuryWithdrawals.title'), - deposit: depositPaidWithSymbol(deposit, cardanoCoin), - rewardAccount - }, - procedure: { - anchor: { - url: anchor.url, - hash: anchor.dataHash, - txHashUrl: `${explorerBaseUrl}/${anchor.dataHash}` - } - }, - withdrawals: [...withdrawals].map((withdrawal) => ({ - rewardAccount: withdrawal.rewardAccount.toString(), - lovelace: Wallet.util.getFormattedAmount({ - amount: withdrawal.coin.toString(), - cardanoCoin - }) - })) - }; - - return ( - - ); + return ; }; diff --git a/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/proposal-procedures/UpdateCommitteeActionContainer.tsx b/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/proposal-procedures/UpdateCommitteeActionContainer.tsx index 81cad6e0f..1f3c3308f 100644 --- a/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/proposal-procedures/UpdateCommitteeActionContainer.tsx +++ b/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/proposal-procedures/UpdateCommitteeActionContainer.tsx @@ -1,108 +1,35 @@ -import React, { useMemo } from 'react'; -import { useTranslation } from 'react-i18next'; +import React from 'react'; import { Wallet } from '@lace/cardano'; -import { UpdateCommitteeAction } from '@lace/core'; +import { UpdateCommitteeAction, getUpdateCommitteeActionViewData } from '@lace/core'; import { useWalletStore } from '@src/stores'; -import { SignTxData } from '../types'; import { useCexplorerBaseUrl } from '../hooks'; interface Props { - dappInfo: SignTxData['dappInfo']; governanceAction: Wallet.Cardano.UpdateCommittee; deposit: Wallet.Cardano.ProposalProcedure['deposit']; rewardAccount: Wallet.Cardano.ProposalProcedure['rewardAccount']; anchor: Wallet.Cardano.ProposalProcedure['anchor']; - errorMessage?: string; } export const UpdateCommitteeActionContainer = ({ - dappInfo, governanceAction, deposit, rewardAccount, - anchor, - errorMessage + anchor }: Props): React.ReactElement => { - const { t } = useTranslation(); const { walletUI: { cardanoCoin } } = useWalletStore(); const explorerBaseUrl = useCexplorerBaseUrl(); + const data = getUpdateCommitteeActionViewData({ + anchor, + cardanoCoin, + deposit, + explorerBaseUrl, + governanceAction, + rewardAccount + }); - const translations = useMemo[0]['translations']>( - () => ({ - txDetails: { - title: t('core.ProposalProcedure.txDetails.title'), - txType: t('core.ProposalProcedure.txDetails.txType'), - deposit: t('core.ProposalProcedure.txDetails.deposit'), - rewardAccount: t('core.ProposalProcedure.txDetails.rewardAccount') - }, - procedure: { - title: t('core.ProposalProcedure.procedure.title'), - anchor: { - url: t('core.ProposalProcedure.procedure.anchor.url'), - hash: t('core.ProposalProcedure.procedure.anchor.hash') - } - }, - actionId: { - title: t('core.ProposalProcedure.governanceAction.actionId.title'), - index: t('core.ProposalProcedure.governanceAction.actionId.index'), - txId: t('core.ProposalProcedure.governanceAction.actionId.txId') - }, - membersToBeAdded: { - title: t('core.ProposalProcedure.governanceAction.updateCommitteeAction.membersToBeAdded.title'), - coldCredential: { - hash: t('core.ProposalProcedure.governanceAction.updateCommitteeAction.membersToBeAdded.coldCredential.hash'), - epoch: t( - 'core.ProposalProcedure.governanceAction.updateCommitteeAction.membersToBeAdded.coldCredential.epoch' - ) - } - }, - membersToBeRemoved: { - title: t('core.ProposalProcedure.governanceAction.updateCommitteeAction.membersToBeRemoved.title'), - hash: t('core.ProposalProcedure.governanceAction.updateCommitteeAction.membersToBeRemoved.hash') - } - }), - [t] - ); - - const { membersToBeAdded, membersToBeRemoved, governanceActionId } = governanceAction; - - const data: Parameters[0]['data'] = { - txDetails: { - txType: t('core.ProposalProcedure.governanceAction.updateCommitteeAction.title'), - deposit: Wallet.util.getFormattedAmount({ - amount: deposit.toString(), - cardanoCoin - }), - rewardAccount - }, - procedure: { - anchor: { - url: anchor.url, - hash: anchor.dataHash, - txHashUrl: `${explorerBaseUrl}/${anchor.dataHash}` - } - }, - ...(governanceActionId && { - actionId: { - index: governanceActionId.actionIndex.toString(), - id: governanceActionId.id || '' - } - }), - membersToBeAdded: [...membersToBeAdded].map(({ coldCredential: { hash }, epoch }) => ({ - coldCredential: { - hash: hash.toString() - }, - epoch: epoch.toString() - })), - membersToBeRemoved: [...membersToBeRemoved].map(({ hash }) => ({ - hash: hash.toString() - })) - }; - - return ( - - ); + return ; }; diff --git a/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/proposal-procedures/__tests__/HardForkInitiationActionContainer.test.tsx b/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/proposal-procedures/__tests__/HardForkInitiationActionContainer.test.tsx index ec6968d49..85abcd1b4 100644 --- a/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/proposal-procedures/__tests__/HardForkInitiationActionContainer.test.tsx +++ b/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/proposal-procedures/__tests__/HardForkInitiationActionContainer.test.tsx @@ -71,12 +71,6 @@ jest.mock('@lace/cardano', () => { }; }); -const dappInfo = { - name: 'dappName', - logo: 'dappLogo', - url: 'dappUrl' -}; -const errorMessage = 'errorMessage'; const deposit = BigInt('10000'); const rewardAccount = Wallet.Cardano.RewardAccount('stake_test1uqrw9tjymlm8wrwq7jk68n6v7fs9qz8z0tkdkve26dylmfc2ux2hj'); const anchor = { @@ -109,7 +103,7 @@ describe('Testing ProposalProceduresContainer component', () => { await act(async () => { ({ queryByTestId } = render( , { wrapper: getWrapper() @@ -120,10 +114,8 @@ describe('Testing ProposalProceduresContainer component', () => { expect(queryByTestId('HardForkInitiationAction')).toBeInTheDocument(); expect(mockHardForkInitiationAction).toHaveBeenLastCalledWith( { - dappInfo, data: { txDetails: { - txType: t('core.ProposalProcedure.governanceAction.hardForkInitiation.title'), deposit: depositPaidWithSymbol(deposit, cardanoCoinMock as Wallet.CoinId), rewardAccount }, @@ -142,33 +134,7 @@ describe('Testing ProposalProceduresContainer component', () => { index: hardForkInitiationAction.governanceActionId.actionIndex.toString(), id: hardForkInitiationAction.governanceActionId.id || '' } - }, - translations: { - txDetails: { - title: t('core.ProposalProcedure.txDetails.title'), - txType: t('core.ProposalProcedure.txDetails.txType'), - deposit: t('core.ProposalProcedure.txDetails.deposit'), - rewardAccount: t('core.ProposalProcedure.txDetails.rewardAccount') - }, - procedure: { - title: t('core.ProposalProcedure.procedure.title'), - anchor: { - url: t('core.ProposalProcedure.procedure.anchor.url'), - hash: t('core.ProposalProcedure.procedure.anchor.hash') - } - }, - protocolVersion: { - major: t('core.ProposalProcedure.governanceAction.hardForkInitiation.protocolVersion.major'), - minor: t('core.ProposalProcedure.governanceAction.hardForkInitiation.protocolVersion.minor'), - patch: t('core.ProposalProcedure.governanceAction.hardForkInitiation.protocolVersion.patch') - }, - actionId: { - title: t('core.ProposalProcedure.governanceAction.actionId.title'), - index: t('core.ProposalProcedure.governanceAction.actionId.index'), - txId: t('core.ProposalProcedure.governanceAction.actionId.txId') - } - }, - errorMessage + } }, {} ); diff --git a/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/proposal-procedures/__tests__/InfoActionContainer.test.tsx b/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/proposal-procedures/__tests__/InfoActionContainer.test.tsx index f6b6eb5fc..2da559aaf 100644 --- a/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/proposal-procedures/__tests__/InfoActionContainer.test.tsx +++ b/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/proposal-procedures/__tests__/InfoActionContainer.test.tsx @@ -13,6 +13,7 @@ import '@testing-library/jest-dom'; import { act } from 'react-dom/test-utils'; import { InfoActionContainer } from '../InfoActionContainer'; import { getWrapper } from '../../testing.utils'; +import { mockProposalProcedure } from '@lace/core'; jest.mock('react-i18next', () => { const original = jest.requireActual('react-i18next'); @@ -41,22 +42,8 @@ jest.mock('../../hooks', () => { }; }); -const dappInfo = { - name: 'dappName', - logo: 'dappLogo', - url: 'dappUrl' -}; -const errorMessage = 'errorMessage'; -const deposit = BigInt('10000'); -const rewardAccount = Wallet.Cardano.RewardAccount('stake_test1uqrw9tjymlm8wrwq7jk68n6v7fs9qz8z0tkdkve26dylmfc2ux2hj'); -const anchor = { - url: 'anchorUrl', - dataHash: Wallet.Crypto.Hash32ByteBase16(Buffer.from('anchorDataHashanchorDataHashanch').toString('hex')) -}; - -const infoAction = { - __typename: Wallet.Cardano.GovernanceActionType.info_action -} as Wallet.Cardano.InfoAction; +const infoActionMock = mockProposalProcedure[Wallet.Cardano.GovernanceActionType.info_action]; +const { deposit, rewardAccount, anchor, governanceAction: infoAction } = infoActionMock; describe('Testing ProposalProceduresContainer component', () => { afterEach(() => { @@ -69,9 +56,7 @@ describe('Testing ProposalProceduresContainer component', () => { await act(async () => { ({ queryByTestId } = render( - , + , { wrapper: getWrapper() } @@ -81,11 +66,8 @@ describe('Testing ProposalProceduresContainer component', () => { expect(queryByTestId('InfoAction')).toBeInTheDocument(); expect(mockInfoAction).toHaveBeenLastCalledWith( { - dappInfo, data: { - txDetails: { - txType: t('core.ProposalProcedure.governanceAction.infoAction.title') - }, + txDetails: {}, procedure: { anchor: { url: anchor.url, @@ -93,21 +75,7 @@ describe('Testing ProposalProceduresContainer component', () => { txHashUrl: `${mockedCExpolorerBaseUrl}/${anchor.dataHash}` } } - }, - translations: { - txDetails: { - title: t('core.ProposalProcedure.txDetails.title'), - txType: t('core.ProposalProcedure.txDetails.txType') - }, - procedure: { - title: t('core.ProposalProcedure.procedure.title'), - anchor: { - url: t('core.ProposalProcedure.procedure.anchor.url'), - hash: t('core.ProposalProcedure.procedure.anchor.hash') - } - } - }, - errorMessage + } }, {} ); diff --git a/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/proposal-procedures/__tests__/NewConstitutionActionContainer.test.tsx b/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/proposal-procedures/__tests__/NewConstitutionActionContainer.test.tsx index 82e3f9dd4..7bc55782d 100644 --- a/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/proposal-procedures/__tests__/NewConstitutionActionContainer.test.tsx +++ b/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/proposal-procedures/__tests__/NewConstitutionActionContainer.test.tsx @@ -71,12 +71,6 @@ jest.mock('@lace/cardano', () => { }; }); -const dappInfo = { - name: 'dappName', - logo: 'dappLogo', - url: 'dappUrl' -}; -const errorMessage = 'errorMessage'; const deposit = BigInt('10000'); const rewardAccount = Wallet.Cardano.RewardAccount('stake_test1uqrw9tjymlm8wrwq7jk68n6v7fs9qz8z0tkdkve26dylmfc2ux2hj'); const anchor = { @@ -107,9 +101,7 @@ describe('Testing ProposalProceduresContainer component', () => { await act(async () => { ({ queryByTestId } = render( - , + , { wrapper: getWrapper() } @@ -119,10 +111,8 @@ describe('Testing ProposalProceduresContainer component', () => { expect(queryByTestId('NewConstitutionAction')).toBeInTheDocument(); expect(mockNewConstitutionAction).toHaveBeenLastCalledWith( { - dappInfo, data: { txDetails: { - txType: t('core.ProposalProcedure.governanceAction.newConstitutionAction.title'), deposit: depositPaidWithSymbol(deposit, cardanoCoinMock as Wallet.CoinId), rewardAccount }, @@ -144,36 +134,7 @@ describe('Testing ProposalProceduresContainer component', () => { }, scriptHash: newConstitution.constitution.scriptHash.toString() } - }, - translations: { - txDetails: { - title: t('core.ProposalProcedure.txDetails.title'), - txType: t('core.ProposalProcedure.txDetails.txType'), - deposit: t('core.ProposalProcedure.txDetails.deposit'), - rewardAccount: t('core.ProposalProcedure.txDetails.rewardAccount') - }, - procedure: { - title: t('core.ProposalProcedure.procedure.title'), - anchor: { - url: t('core.ProposalProcedure.procedure.anchor.url'), - hash: t('core.ProposalProcedure.procedure.anchor.hash') - } - }, - constitution: { - title: t('core.ProposalProcedure.governanceAction.newConstitutionAction.constitution.title'), - anchor: { - dataHash: t('core.ProposalProcedure.governanceAction.newConstitutionAction.constitution.anchor.dataHash'), - url: t('core.ProposalProcedure.governanceAction.newConstitutionAction.constitution.anchor.url') - }, - scriptHash: t('core.ProposalProcedure.governanceAction.newConstitutionAction.constitution.scriptHash') - }, - actionId: { - title: t('core.ProposalProcedure.governanceAction.actionId.title'), - index: t('core.ProposalProcedure.governanceAction.actionId.index'), - txId: t('core.ProposalProcedure.governanceAction.actionId.txId') - } - }, - errorMessage + } }, {} ); diff --git a/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/proposal-procedures/__tests__/NoConfidenceActionContainer.test.tsx b/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/proposal-procedures/__tests__/NoConfidenceActionContainer.test.tsx index 2327db288..d4952e070 100644 --- a/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/proposal-procedures/__tests__/NoConfidenceActionContainer.test.tsx +++ b/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/proposal-procedures/__tests__/NoConfidenceActionContainer.test.tsx @@ -71,12 +71,6 @@ jest.mock('@lace/cardano', () => { }; }); -const dappInfo = { - name: 'dappName', - logo: 'dappLogo', - url: 'dappUrl' -}; -const errorMessage = 'errorMessage'; const deposit = BigInt('10000'); const rewardAccount = Wallet.Cardano.RewardAccount('stake_test1uqrw9tjymlm8wrwq7jk68n6v7fs9qz8z0tkdkve26dylmfc2ux2hj'); const anchor = { @@ -103,9 +97,7 @@ describe('Testing ProposalProceduresContainer component', () => { await act(async () => { ({ queryByTestId } = render( - , + , { wrapper: getWrapper() } @@ -115,10 +107,8 @@ describe('Testing ProposalProceduresContainer component', () => { expect(queryByTestId('NoConfidenceAction')).toBeInTheDocument(); expect(mockNoConfidenceAction).toHaveBeenLastCalledWith( { - dappInfo, data: { txDetails: { - txType: t('core.ProposalProcedure.governanceAction.noConfidenceAction.title'), deposit: depositPaidWithSymbol(deposit, cardanoCoinMock as Wallet.CoinId), rewardAccount }, @@ -133,28 +123,7 @@ describe('Testing ProposalProceduresContainer component', () => { index: noConfidence.governanceActionId.actionIndex.toString(), id: noConfidence.governanceActionId.id || '' } - }, - translations: { - txDetails: { - title: t('core.ProposalProcedure.txDetails.title'), - txType: t('core.ProposalProcedure.txDetails.txType'), - deposit: t('core.ProposalProcedure.txDetails.deposit'), - rewardAccount: t('core.ProposalProcedure.txDetails.rewardAccount') - }, - procedure: { - title: t('core.ProposalProcedure.procedure.title'), - anchor: { - url: t('core.ProposalProcedure.procedure.anchor.url'), - hash: t('core.ProposalProcedure.procedure.anchor.hash') - } - }, - actionId: { - title: t('core.ProposalProcedure.governanceAction.actionId.title'), - index: t('core.ProposalProcedure.governanceAction.actionId.index'), - txId: t('core.ProposalProcedure.governanceAction.actionId.txId') - } - }, - errorMessage + } }, {} ); diff --git a/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/proposal-procedures/__tests__/ParameterChangeActionContainer.test.tsx b/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/proposal-procedures/__tests__/ParameterChangeActionContainer.test.tsx index e694a4201..b29e801cd 100644 --- a/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/proposal-procedures/__tests__/ParameterChangeActionContainer.test.tsx +++ b/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/proposal-procedures/__tests__/ParameterChangeActionContainer.test.tsx @@ -73,12 +73,6 @@ jest.mock('@lace/cardano', () => { }; }); -const dappInfo = { - name: 'dappName', - logo: 'dappLogo', - url: 'dappUrl' -}; -const errorMessage = 'errorMessage'; const deposit = BigInt('10000'); const rewardAccount = Wallet.Cardano.RewardAccount('stake_test1uqrw9tjymlm8wrwq7jk68n6v7fs9qz8z0tkdkve26dylmfc2ux2hj'); const anchor = { @@ -189,7 +183,7 @@ describe('Testing ProposalProceduresContainer component', () => { await act(async () => { ({ queryByTestId } = render( , { wrapper: getWrapper() @@ -200,10 +194,8 @@ describe('Testing ProposalProceduresContainer component', () => { expect(queryByTestId('ParameterChangeAction')).toBeInTheDocument(); expect(mockParameterChangeAction).toHaveBeenLastCalledWith( { - dappInfo, data: { txDetails: { - txType: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.title'), deposit: depositPaidWithSymbol(deposit, cardanoCoinMock as Wallet.CoinId), rewardAccount }, @@ -307,218 +299,7 @@ describe('Testing ProposalProceduresContainer component', () => { } } } - }, - translations: { - txDetails: { - title: t('core.ProposalProcedure.txDetails.title'), - txType: t('core.ProposalProcedure.txDetails.txType'), - deposit: t('core.ProposalProcedure.txDetails.deposit'), - rewardAccount: t('core.ProposalProcedure.txDetails.rewardAccount') - }, - anchor: { - url: t('core.ProposalProcedure.procedure.anchor.url'), - hash: t('core.ProposalProcedure.procedure.anchor.hash') - }, - memory: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.memory'), - step: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.step'), - networkGroup: { - title: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.networkGroup.title'), - maxBBSize: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.networkGroup.maxBBSize'), - maxTxSize: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.networkGroup.maxTxSize'), - maxBHSize: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.networkGroup.maxBHSize'), - maxValSize: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.networkGroup.maxValSize'), - maxTxExUnits: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.networkGroup.maxTxExUnits'), - maxBlockExUnits: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.networkGroup.maxBlockExUnits' - ), - maxCollateralInputs: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.networkGroup.maxCollateralInputs' - ), - tooltip: { - maxBBSize: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.networkGroup.tooltip.maxBBSize' - ), - maxTxSize: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.networkGroup.tooltip.maxTxSize' - ), - maxBHSize: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.networkGroup.tooltip.maxBHSize' - ), - maxValSize: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.networkGroup.tooltip.maxValSize' - ), - maxTxExUnits: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.networkGroup.tooltip.maxTxExUnits' - ), - maxBlockExUnits: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.networkGroup.tooltip.maxBlockExUnits' - ), - maxCollateralInputs: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.networkGroup.tooltip.maxCollateralInputs' - ) - } - }, - economicGroup: { - title: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.economicGroup.title'), - minFeeA: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.economicGroup.minFeeA'), - minFeeB: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.economicGroup.minFeeB'), - keyDeposit: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.economicGroup.keyDeposit'), - poolDeposit: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.economicGroup.poolDeposit'), - rho: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.economicGroup.rho'), - tau: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.economicGroup.tau'), - minPoolCost: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.economicGroup.minPoolCost'), - coinsPerUTxOByte: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.economicGroup.coinsPerUTxOByte' - ), - prices: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.economicGroup.prices'), - tooltip: { - minFeeA: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.economicGroup.tooltip.minFeeA'), - minFeeB: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.economicGroup.tooltip.minFeeB'), - keyDeposit: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.economicGroup.tooltip.keyDeposit' - ), - poolDeposit: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.economicGroup.tooltip.poolDeposit' - ), - rho: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.economicGroup.tooltip.rho'), - tau: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.economicGroup.tooltip.tau'), - minPoolCost: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.economicGroup.tooltip.minPoolCost' - ), - coinsPerUTxOByte: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.economicGroup.tooltip.coinsPerUTxOByte' - ), - prices: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.economicGroup.tooltip.prices') - } - }, - technicalGroup: { - title: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.technicalGroup.title'), - a0: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.technicalGroup.a0'), - eMax: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.technicalGroup.eMax'), - nOpt: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.technicalGroup.nOpt'), - costModels: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.technicalGroup.costModels'), - collateralPercentage: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.technicalGroup.collateralPercentage' - ), - tooltip: { - a0: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.technicalGroup.tooltip.a0'), - eMax: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.technicalGroup.tooltip.eMax'), - nOpt: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.technicalGroup.tooltip.nOpt'), - costModels: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.technicalGroup.tooltip.costModels' - ), - collateralPercentage: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.technicalGroup.tooltip.collateralPercentage' - ) - } - }, - governanceGroup: { - title: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.title'), - govActionLifetime: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.govActionLifetime' - ), - govActionDeposit: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.govActionDeposit' - ), - drepDeposit: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.drepDeposit'), - drepActivity: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.drepActivity'), - ccMinSize: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.ccMinSize'), - ccMaxTermLength: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.ccMaxTermLength' - ), - dRepVotingThresholds: { - title: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.dRepVotingThresholds.title' - ), - motionNoConfidence: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.dRepVotingThresholds.motionNoConfidence' - ), - committeeNormal: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.dRepVotingThresholds.committeeNormal' - ), - committeeNoConfidence: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.dRepVotingThresholds.committeeNoConfidence' - ), - updateConstitution: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.dRepVotingThresholds.updateConstitution' - ), - hardForkInitiation: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.dRepVotingThresholds.hardForkInitiation' - ), - ppNetworkGroup: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.dRepVotingThresholds.ppNetworkGroup' - ), - ppEconomicGroup: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.dRepVotingThresholds.ppEconomicGroup' - ), - ppTechnicalGroup: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.dRepVotingThresholds.ppTechnicalGroup' - ), - ppGovernanceGroup: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.dRepVotingThresholds.ppGovernanceGroup' - ), - treasuryWithdrawal: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.dRepVotingThresholds.treasuryWithdrawal' - ) - }, - tooltip: { - govActionLifetime: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.tooltip.govActionLifetime' - ), - govActionDeposit: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.tooltip.govActionDeposit' - ), - drepDeposit: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.tooltip.drepDeposit' - ), - drepActivity: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.tooltip.drepActivity' - ), - ccMinSize: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.tooltip.ccMinSize' - ), - ccMaxTermLength: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.tooltip.ccMaxTermLength' - ), - dRepVotingThresholds: { - title: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.tooltip.dRepVotingThresholds.title' - ), - motionNoConfidence: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.tooltip.dRepVotingThresholds.motionNoConfidence' - ), - committeeNormal: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.tooltip.dRepVotingThresholds.committeeNormal' - ), - committeeNoConfidence: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.tooltip.dRepVotingThresholds.committeeNoConfidence' - ), - updateConstitution: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.tooltip.dRepVotingThresholds.updateConstitution' - ), - hardForkInitiation: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.tooltip.dRepVotingThresholds.hardForkInitiation' - ), - ppNetworkGroup: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.tooltip.dRepVotingThresholds.ppNetworkGroup' - ), - ppEconomicGroup: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.tooltip.dRepVotingThresholds.ppEconomicGroup' - ), - ppTechnicalGroup: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.tooltip.dRepVotingThresholds.ppTechnicalGroup' - ), - ppGovernanceGroup: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.tooltip.dRepVotingThresholds.ppGovernanceGroup' - ), - treasuryWithdrawal: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.tooltip.dRepVotingThresholds.treasuryWithdrawal' - ) - } - } - } - }, - errorMessage + } }, {} ); diff --git a/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/proposal-procedures/__tests__/TreasuryWithdrawalsActionContainer.test.tsx b/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/proposal-procedures/__tests__/TreasuryWithdrawalsActionContainer.test.tsx index 88d93774d..0c3eae914 100644 --- a/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/proposal-procedures/__tests__/TreasuryWithdrawalsActionContainer.test.tsx +++ b/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/proposal-procedures/__tests__/TreasuryWithdrawalsActionContainer.test.tsx @@ -71,12 +71,6 @@ jest.mock('@lace/cardano', () => { }; }); -const dappInfo = { - name: 'dappName', - logo: 'dappLogo', - url: 'dappUrl' -}; -const errorMessage = 'errorMessage'; const deposit = BigInt('10000'); const rewardAccount = Wallet.Cardano.RewardAccount('stake_test1uqrw9tjymlm8wrwq7jk68n6v7fs9qz8z0tkdkve26dylmfc2ux2hj'); const anchor = { @@ -104,7 +98,7 @@ describe('Testing ProposalProceduresContainer component', () => { await act(async () => { ({ queryByTestId } = render( , { wrapper: getWrapper() @@ -115,10 +109,8 @@ describe('Testing ProposalProceduresContainer component', () => { expect(queryByTestId('TreasuryWithdrawalsAction')).toBeInTheDocument(); expect(mockTreasuryWithdrawalsAction).toHaveBeenLastCalledWith( { - dappInfo, data: { txDetails: { - txType: t('core.ProposalProcedure.governanceAction.treasuryWithdrawals.title'), deposit: depositPaidWithSymbol(deposit, cardanoCoinMock as Wallet.CoinId), rewardAccount }, @@ -136,33 +128,7 @@ describe('Testing ProposalProceduresContainer component', () => { cardanoCoin: cardanoCoinMock as Wallet.CoinId }) })) - }, - translations: { - txDetails: { - title: t('core.ProposalProcedure.txDetails.title'), - txType: t('core.ProposalProcedure.txDetails.txType'), - deposit: t('core.ProposalProcedure.txDetails.deposit'), - rewardAccount: t('core.ProposalProcedure.txDetails.rewardAccount') - }, - procedure: { - title: t('core.ProposalProcedure.procedure.title'), - anchor: { - url: t('core.ProposalProcedure.procedure.anchor.url'), - hash: t('core.ProposalProcedure.procedure.anchor.hash') - } - }, - actionId: { - title: t('core.ProposalProcedure.governanceAction.actionId.title'), - index: t('core.ProposalProcedure.governanceAction.actionId.index'), - txId: t('core.ProposalProcedure.governanceAction.actionId.txId') - }, - withdrawals: { - title: t('core.ProposalProcedure.governanceAction.treasuryWithdrawals.title'), - rewardAccount: t('core.ProposalProcedure.governanceAction.treasuryWithdrawals.withdrawals.rewardAccount'), - lovelace: t('core.ProposalProcedure.governanceAction.treasuryWithdrawals.withdrawals.lovelace') - } - }, - errorMessage + } }, {} ); diff --git a/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/proposal-procedures/__tests__/UpdateCommitteeActionContainer.test.tsx b/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/proposal-procedures/__tests__/UpdateCommitteeActionContainer.test.tsx index 39bc1874d..adc979e75 100644 --- a/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/proposal-procedures/__tests__/UpdateCommitteeActionContainer.test.tsx +++ b/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/proposal-procedures/__tests__/UpdateCommitteeActionContainer.test.tsx @@ -71,12 +71,6 @@ jest.mock('@lace/cardano', () => { }; }); -const dappInfo = { - name: 'dappName', - logo: 'dappLogo', - url: 'dappUrl' -}; -const errorMessage = 'errorMessage'; const deposit = BigInt('10000'); const rewardAccount = Wallet.Cardano.RewardAccount('stake_test1uqrw9tjymlm8wrwq7jk68n6v7fs9qz8z0tkdkve26dylmfc2ux2hj'); const anchor = { @@ -129,9 +123,7 @@ describe('Testing ProposalProceduresContainer component', () => { await act(async () => { ({ queryByTestId } = render( - , + , { wrapper: getWrapper() } @@ -141,10 +133,8 @@ describe('Testing ProposalProceduresContainer component', () => { expect(queryByTestId('UpdateCommitteeAction')).toBeInTheDocument(); expect(mockUpdateCommitteeAction).toHaveBeenLastCalledWith( { - dappInfo, data: { txDetails: { - txType: t('core.ProposalProcedure.governanceAction.updateCommitteeAction.title'), deposit: depositPaidWithSymbol(deposit, cardanoCoinMock as Wallet.CoinId), rewardAccount }, @@ -166,43 +156,7 @@ describe('Testing ProposalProceduresContainer component', () => { epoch: epoch.toString() })), membersToBeRemoved: [...updateCommittee.membersToBeRemoved].map(({ hash }) => ({ hash: hash.toString() })) - }, - translations: { - txDetails: { - title: t('core.ProposalProcedure.txDetails.title'), - txType: t('core.ProposalProcedure.txDetails.txType'), - deposit: t('core.ProposalProcedure.txDetails.deposit'), - rewardAccount: t('core.ProposalProcedure.txDetails.rewardAccount') - }, - procedure: { - title: t('core.ProposalProcedure.procedure.title'), - anchor: { - url: t('core.ProposalProcedure.procedure.anchor.url'), - hash: t('core.ProposalProcedure.procedure.anchor.hash') - } - }, - actionId: { - title: t('core.ProposalProcedure.governanceAction.actionId.title'), - index: t('core.ProposalProcedure.governanceAction.actionId.index'), - txId: t('core.ProposalProcedure.governanceAction.actionId.txId') - }, - membersToBeAdded: { - title: t('core.ProposalProcedure.governanceAction.updateCommitteeAction.membersToBeAdded.title'), - coldCredential: { - hash: t( - 'core.ProposalProcedure.governanceAction.updateCommitteeAction.membersToBeAdded.coldCredential.hash' - ), - epoch: t( - 'core.ProposalProcedure.governanceAction.updateCommitteeAction.membersToBeAdded.coldCredential.epoch' - ) - } - }, - membersToBeRemoved: { - title: t('core.ProposalProcedure.governanceAction.updateCommitteeAction.membersToBeRemoved.title'), - hash: t('core.ProposalProcedure.governanceAction.updateCommitteeAction.membersToBeRemoved.hash') - } - }, - errorMessage + } }, {} ); diff --git a/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/utils.ts b/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/utils.ts index be1de143b..25f77a897 100644 --- a/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/utils.ts +++ b/apps/browser-extension-wallet/src/features/dapp/components/confirm-transaction/utils.ts @@ -7,7 +7,6 @@ import type { UserPromptService } from '@lib/scripts/background/services'; import { DAPP_CHANNELS, cardanoCoin } from '@src/utils/constants'; import { runtime } from 'webextension-polyfill'; import { of } from 'rxjs'; -import { VoterTypeEnum, getVoterType } from '@src/utils/tx-inspection'; const { CertificateType } = Wallet.Cardano; @@ -145,9 +144,6 @@ export const getTxType = async (tx: Wallet.Cardano.Tx): Promise - Wallet.Cardano.DRepID(Wallet.HexBlob.toTypedBech32('drep', Wallet.HexBlob(value))); - export const pubDRepKeyToHash = async ( pubDRepKeyHex: Wallet.Crypto.Ed25519PublicKeyHex ): Promise => { @@ -168,7 +164,17 @@ export const depositPaidWithSymbol = (deposit: bigint, coinId: Wallet.CoinId): s } }; -export const getDRepId = (voter: Wallet.Cardano.Voter): Wallet.Cardano.DRepID | string => - getVoterType(voter.__typename) === VoterTypeEnum.DREP - ? drepIDasBech32FromHash(voter.credential.hash) - : voter.credential.hash.toString(); +export const hasValidDrepRegistration = (history: Wallet.Cardano.HydratedTx[]): boolean => { + for (const transaction of history) { + const drepRegistrationOrRetirementCerticicate = transaction.body.certificates?.find((cert) => + [CertificateType.UnregisterDelegateRepresentative, CertificateType.RegisterDelegateRepresentative].includes( + cert.__typename + ) + ); + + if (drepRegistrationOrRetirementCerticicate) { + return drepRegistrationOrRetirementCerticicate.__typename === CertificateType.RegisterDelegateRepresentative; + } + } + return false; +}; diff --git a/apps/browser-extension-wallet/src/stores/slices/activity-detail-slice.ts b/apps/browser-extension-wallet/src/stores/slices/activity-detail-slice.ts index f23a0dc73..c42a1b3d8 100644 --- a/apps/browser-extension-wallet/src/stores/slices/activity-detail-slice.ts +++ b/apps/browser-extension-wallet/src/stores/slices/activity-detail-slice.ts @@ -19,11 +19,6 @@ import { MAX_POOLS_COUNT } from '@lace/staking'; import { ActivityStatus, DelegationActivityType, TransactionActivityType } from '@lace/core'; import type { ActivityType } from '@lace/core'; import { formatDate, formatTime } from '@src/utils/format-date'; -import { - certificateTransformer, - governanceProposalsTransformer, - votingProceduresTransformer -} from '@src/views/browser-view/features/activity/helpers/common-tx-transformer'; import { createHistoricalOwnInputResolver, HistoricalOwnInputResolverArgs } from '@src/utils/own-input-resolver'; import { getCollateral } from '@cardano-sdk/core'; import { hasPhase2ValidationFailed } from '@src/utils/phase2-validation'; @@ -129,7 +124,6 @@ const buildGetActivityDetail = const { blockchainProvider: { chainHistoryProvider, stakePoolProvider, assetProvider }, inMemoryWallet: wallet, - walletUI: { cardanoCoin }, activityDetail, walletInfo, walletState @@ -250,16 +244,10 @@ const buildGetActivityDetail = metadata: txMetadata, includedUtcDate: blocks?.utcDate, includedUtcTime: blocks?.utcTime, - // TODO: store the raw data here and transform it later so we always have the raw data when needed.(LW-9570) - votingProcedures: votingProceduresTransformer(tx.body.votingProcedures), - proposalProcedures: governanceProposalsTransformer({ - cardanoCoin, - coinPrices, - fiatCurrency, - proposalProcedures: tx.body.proposalProcedures - }), - certificates: certificateTransformer(cardanoCoin, coinPrices, fiatCurrency, tx.body.certificates), - collateral: collateralInAda + collateral: collateralInAda, + votingProcedures: tx.body.votingProcedures, + proposalProcedures: tx.body.proposalProcedures, + certificates: tx.body.certificates }; if (type === DelegationActivityType.delegation && delegationInfo) { diff --git a/apps/browser-extension-wallet/src/types/activity-detail.ts b/apps/browser-extension-wallet/src/types/activity-detail.ts index 6927a1011..fcdc766e0 100644 --- a/apps/browser-extension-wallet/src/types/activity-detail.ts +++ b/apps/browser-extension-wallet/src/types/activity-detail.ts @@ -1,14 +1,11 @@ +import { Wallet } from '@lace/cardano'; import type { TransactionMetadataProps, TxOutputInput, ActivityStatus, RewardsInfo, TransactionActivityType, - ActivityType, - TxDetailsVotingProceduresTitles, - TxDetailsProposalProceduresTitles, - TxDetailsCertificateTitles, - TxDetails + ActivityType } from '@lace/core'; export enum TxDirections { @@ -38,9 +35,9 @@ type TransactionActivity = { addrOutputs?: TxOutputInput[]; metadata?: TransactionMetadataProps['metadata']; pools?: TransactionPool[]; - votingProcedures?: TxDetails[]; - proposalProcedures?: TxDetails[]; - certificates?: TxDetails[]; + votingProcedures?: Wallet.Cardano.VotingProcedures; + proposalProcedures?: Wallet.Cardano.ProposalProcedure[]; + certificates?: Wallet.Cardano.Certificate[]; }; type RewardsActivity = { diff --git a/apps/browser-extension-wallet/src/utils/tx-inspection.ts b/apps/browser-extension-wallet/src/utils/tx-inspection.ts index f36a72a0b..0cee507b9 100644 --- a/apps/browser-extension-wallet/src/utils/tx-inspection.ts +++ b/apps/browser-extension-wallet/src/utils/tx-inspection.ts @@ -19,7 +19,7 @@ import { } from '@lace/core'; import { TxDirection, TxDirections } from '@src/types'; -const { CertificateType, GovernanceActionType, Vote, VoterType, InputSource } = Wallet.Cardano; +const { CertificateType, GovernanceActionType, InputSource } = Wallet.Cardano; const hasWalletStakeAddress = ( withdrawals: Wallet.Cardano.HydratedTx['body']['withdrawals'], @@ -218,27 +218,6 @@ export const inspectTxValues = async ({ return inspectionProperties.totalOutputsValue; }; -export enum VoterTypeEnum { - CONSTITUTIONAL_COMMITTEE = 'constitutionalCommittee', - SPO = 'spo', - DREP = 'drep' -} - -export const getVoterType = (voterType: Wallet.Cardano.VoterType): VoterTypeEnum => { - switch (voterType) { - case VoterType.ccHotKeyHash: - case VoterType.ccHotScriptHash: - return VoterTypeEnum.CONSTITUTIONAL_COMMITTEE; - case VoterType.stakePoolKeyHash: - return VoterTypeEnum.SPO; - case VoterType.dRepKeyHash: - case VoterType.dRepScriptHash: - return VoterTypeEnum.DREP; - default: - return VoterTypeEnum.DREP; - } -}; - export enum CredentialType { KeyHash = 'KeyHash', ScriptHash = 'ScriptHash' @@ -254,21 +233,3 @@ export const getCredentialType = (credentialType: Wallet.Cardano.CredentialType) return CredentialType.ScriptHash; } }; - -export enum VotesEnum { - YES = 'yes', - NO = 'no', - ABSTAIN = 'abstain' -} - -export const getVote = (vote: Wallet.Cardano.Vote): VotesEnum => { - switch (vote) { - case Vote.yes: - return VotesEnum.YES; - case Vote.no: - return VotesEnum.NO; - case Vote.abstain: - default: - return VotesEnum.ABSTAIN; - } -}; diff --git a/apps/browser-extension-wallet/src/views/browser-view/features/activity/components/TransactionDetailsProxy.tsx b/apps/browser-extension-wallet/src/views/browser-view/features/activity/components/TransactionDetailsProxy.tsx index e5bab6689..15bdab285 100644 --- a/apps/browser-extension-wallet/src/views/browser-view/features/activity/components/TransactionDetailsProxy.tsx +++ b/apps/browser-extension-wallet/src/views/browser-view/features/activity/components/TransactionDetailsProxy.tsx @@ -7,8 +7,8 @@ import { useAddressBookContext, withAddressBookContext } from '@src/features/add import type { TransactionActivityDetail, TxDirection } from '@src/types'; import { TxDirections } from '@src/types'; import { APP_MODE_POPUP } from '@src/utils/constants'; -import { config } from '@src/config'; import { PostHogAction } from '@providers/AnalyticsProvider/analyticsTracker'; +import { useCexplorerBaseUrl } from '@src/features/dapp/components/confirm-transaction/hooks'; import { useObservable } from '@lace/common'; import { getAllWalletsAddresses } from '@src/utils/get-all-wallets-addresses'; import { walletRepository } from '@lib/wallet-api-ui'; @@ -26,8 +26,8 @@ export const TransactionDetailsProxy = withAddressBookContext( const { inMemoryWallet, walletInfo, - environmentName, - walletUI: { cardanoCoin, appMode } + walletUI: { cardanoCoin, appMode }, + currentChain } = useWalletStore(); const isPopupView = appMode === APP_MODE_POPUP; const openExternalLink = useExternalLinkOpener(); @@ -38,16 +38,12 @@ export const TransactionDetailsProxy = withAddressBookContext( // Prepare address book data as Map const { list: addressList } = useAddressBookContext(); + const explorerBaseUrl = useCexplorerBaseUrl(); const addressToNameMap = useMemo( () => new Map(addressList?.map((item: AddressListType) => [item.address, item.name])), [addressList] ); - const { CEXPLORER_BASE_URL, CEXPLORER_URL_PATHS } = config(); - const explorerBaseUrl = useMemo( - () => `${CEXPLORER_BASE_URL[environmentName]}/${CEXPLORER_URL_PATHS.Tx}`, - [CEXPLORER_BASE_URL, CEXPLORER_URL_PATHS.Tx, environmentName] - ); const getHeaderDescription = () => { if (activityInfo.type === DelegationActivityType.delegation) return '1 token'; return ` (${activityInfo?.assetAmount})`; @@ -114,8 +110,10 @@ export const TransactionDetailsProxy = withAddressBookContext( votingProcedures={votingProcedures} certificates={certificates} handleOpenExternalHashLink={handleOpenExternalHashLink} - openExternalLink={openExternalLink} collateral={collateral} + chainNetworkId={currentChain.networkId} + cardanoCoin={cardanoCoin} + explorerBaseUrl={explorerBaseUrl} /> ); } diff --git a/apps/browser-extension-wallet/src/views/browser-view/features/activity/helpers/common-tx-transformer.ts b/apps/browser-extension-wallet/src/views/browser-view/features/activity/helpers/common-tx-transformer.ts index d75bbe69a..e1903bfea 100644 --- a/apps/browser-extension-wallet/src/views/browser-view/features/activity/helpers/common-tx-transformer.ts +++ b/apps/browser-extension-wallet/src/views/browser-view/features/activity/helpers/common-tx-transformer.ts @@ -4,29 +4,16 @@ import BigNumber from 'bignumber.js'; import { Wallet } from '@lace/cardano'; import { CurrencyInfo, TxDirections } from '@types'; -import { inspectTxValues, inspectTxType, getVoterType, getVote } from '@src/utils/tx-inspection'; +import { inspectTxValues, inspectTxType } from '@src/utils/tx-inspection'; import { formatDate, formatTime } from '@src/utils/format-date'; import { getTransactionTotalAmount } from '@src/utils/get-transaction-total-amount'; import type { TransformedActivity, TransformedTransactionActivity } from './types'; -import { - ActivityStatus, - DelegationActivityType, - TxDetails, - TxDetailsCertificateTitles, - TxDetailsVotingProceduresTitles, - TxDetailsProposalProceduresTitles, - ConwayEraCertificatesTypes, - TxDetail -} from '@lace/core'; +import { ActivityStatus, DelegationActivityType } from '@lace/core'; import capitalize from 'lodash/capitalize'; import dayjs from 'dayjs'; -import isEmpty from 'lodash/isEmpty'; -import { PriceResult } from '@hooks'; -import { formatPercentages } from '@lace/common'; -import { depositPaidWithSymbol } from '@src/features/dapp/components/confirm-transaction/utils'; import { hasPhase2ValidationFailed } from '@src/utils/phase2-validation'; -const { util, GovernanceActionType, PlutusLanguageVersion, CertificateType } = Wallet.Cardano; +const { util } = Wallet.Cardano; export interface TxTransformerInput { tx: Wallet.TxInFlight | Wallet.Cardano.HydratedTx; @@ -264,553 +251,11 @@ export const txTransformer = async ({ ]; }; -const drepMapper = (drep: Wallet.Cardano.DelegateRepresentative) => { - if (Wallet.Cardano.isDRepAlwaysAbstain(drep)) { - return 'alwaysAbstain'; - } else if (Wallet.Cardano.isDRepAlwaysNoConfidence(drep)) { - return 'alwaysNoConfidence'; - } else if (Wallet.Cardano.isDRepCredential(drep)) { - return Wallet.Cardano.DRepID(drep.hash); - } - throw new Error('incorrect drep supplied'); -}; - -export const certificateTransformer = ( - cardanoCoin: Wallet.CoinId, - coinPrices: PriceResult, - fiatCurrency: CurrencyInfo, - certificates?: Wallet.Cardano.Certificate[] -): TxDetails[] => - certificates - ?.filter((certificate) => - Object.values(ConwayEraCertificatesTypes).includes( - certificate.__typename as unknown as ConwayEraCertificatesTypes - ) - ) - .map((conwayEraCertificate) => { - const transformedCertificate: TxDetails = [ - { title: 'certificateType', details: [conwayEraCertificate.__typename] } - ]; - - if ('coldCredential' in conwayEraCertificate) { - transformedCertificate.push({ - title: 'coldCredential', - details: [conwayEraCertificate.coldCredential.hash.toString()] - }); - } - - if ('hotCredential' in conwayEraCertificate) { - transformedCertificate.push({ - title: 'hotCredential', - details: [conwayEraCertificate.hotCredential.hash.toString()] - }); - } - - if ('stakeCredential' in conwayEraCertificate) { - transformedCertificate.push({ - title: 'stakeKey', - details: [conwayEraCertificate.stakeCredential.hash.toString()] - }); - } - - if ('dRepCredential' in conwayEraCertificate) { - transformedCertificate.push({ - title: 'drepId', - details: [conwayEraCertificate.dRepCredential.hash.toString()] - }); - } - - if ('anchor' in conwayEraCertificate && conwayEraCertificate.anchor) { - transformedCertificate.push( - { - title: 'anchorHash', - details: [conwayEraCertificate.anchor.dataHash.toString()] - }, - { - title: 'anchorURL', - details: [conwayEraCertificate.anchor.url] - } - ); - } - - if ('poolId' in conwayEraCertificate) { - transformedCertificate.push({ - title: 'poolId', - details: [conwayEraCertificate.poolId.toString()] - }); - } - - if ('dRep' in conwayEraCertificate) { - transformedCertificate.push({ - title: 'drep', - details: [drepMapper(conwayEraCertificate.dRep)] - }); - } - - if ('deposit' in conwayEraCertificate) { - const depositTitle = - conwayEraCertificate.__typename === CertificateType.UnregisterDelegateRepresentative - ? 'depositReturned' - : 'depositPaid'; - transformedCertificate.push({ - title: depositTitle, - info: `${depositTitle}Info`, - details: [ - [ - Wallet.util.getFormattedAmount({ amount: conwayEraCertificate.deposit.toString(), cardanoCoin }), - `${Wallet.util.convertLovelaceToFiat({ - lovelaces: conwayEraCertificate.deposit.toString(), - fiat: coinPrices?.cardano?.price - })} ${fiatCurrency?.code}` - ] - ] - }); - } - - return transformedCertificate; - }); - -export const votingProceduresTransformer = ( - votingProcedures: Wallet.Cardano.VotingProcedures -): TxDetails[] => { - const votingProcedureDetails: TxDetails[] = []; - - votingProcedures?.forEach((procedure) => - procedure.votes.forEach((vote) => { - const detail: TxDetails = [ - { - title: 'voterType', - details: [getVoterType(procedure.voter.__typename)] - }, - { - title: 'voterCredential', - details: [procedure.voter.credential.hash.toString()] - }, - { title: 'voteTypes', details: [getVote(vote.votingProcedure.vote)] } - ]; - - if (vote.votingProcedure.anchor) { - detail.push( - { title: 'anchorURL', details: [vote.votingProcedure.anchor.url] }, - { title: 'anchorHash', details: [vote.votingProcedure.anchor.dataHash.toString()] } - ); - } - - votingProcedureDetails.push(detail.filter((el: TxDetail) => !isEmpty(el))); - }) - ); - - return votingProcedureDetails; -}; - -export const governanceProposalsTransformer = ({ - cardanoCoin, - coinPrices, - fiatCurrency, - proposalProcedures -}: { - cardanoCoin: Wallet.CoinId; - coinPrices: PriceResult; - fiatCurrency: CurrencyInfo; - proposalProcedures?: Wallet.Cardano.ProposalProcedure[]; -}): TxDetails[] => - proposalProcedures?.map((procedure) => { - const transformedProposal: TxDetails = [ - { title: 'type', details: [procedure.governanceAction.__typename] }, - { - ...(procedure.governanceAction.__typename === GovernanceActionType.parameter_change_action && { - title: 'deposit', - info: 'deposit', - details: [ - [ - Wallet.util.getFormattedAmount({ amount: procedure.deposit.toString(), cardanoCoin }), - `${Wallet.util.convertLovelaceToFiat({ - lovelaces: procedure.deposit.toString(), - fiat: coinPrices?.cardano?.price - })} ${fiatCurrency?.code}` - ] - ] - }) - }, - { title: 'rewardAccount', details: [procedure.anchor.dataHash.toString()] }, - { title: 'anchorURL', details: [procedure.anchor.url] }, - { title: 'anchorHash', details: [procedure.anchor.dataHash.toString()] } - ]; - - if ('governanceActionId' in procedure.governanceAction && procedure.governanceAction.governanceActionId) { - transformedProposal.push( - { - title: 'governanceActionID', - details: [procedure.governanceAction.governanceActionId.id.toString()] - }, - { - title: 'actionIndex', - details: [procedure.governanceAction.governanceActionId.actionIndex.toString()] - } - ); - } - - if ('withdrawals' in procedure.governanceAction) { - procedure.governanceAction.withdrawals.forEach(({ rewardAccount, coin }) => { - transformedProposal.push({ - header: 'withdrawal', - details: [ - { - title: 'withdrawalRewardAccount', - details: [rewardAccount] - }, - { - title: 'withdrawalAmount', - details: [ - Wallet.util.getFormattedAmount({ - amount: coin.toString(), - cardanoCoin - }) - ] - } - ] - }); - }); - } - - if ('constitution' in procedure.governanceAction) { - transformedProposal.push( - { - title: 'constitutionAnchorURL', - details: [procedure.governanceAction.constitution.anchor.url] - }, - { - title: 'constitutionScriptHash', - details: [procedure.governanceAction.constitution.scriptHash.toString()] - } - ); - } - - if ('membersToBeAdded' in procedure.governanceAction) { - const membersToBeAdded: TxDetail[] = []; - procedure.governanceAction.membersToBeAdded.forEach(({ coldCredential, epoch }) => { - membersToBeAdded.push( - { - title: 'coldCredentialHash', - details: [coldCredential.hash] - }, - { - title: 'epoch', - details: [epoch.toString()] - } - ); - }); - - if (membersToBeAdded.length > 0) { - transformedProposal.push({ - header: 'membersToBeAdded', - details: membersToBeAdded - }); - } - } - - if ('membersToBeRemoved' in procedure.governanceAction) { - const membersToBeRemoved: TxDetail[] = []; - procedure.governanceAction.membersToBeRemoved.forEach(({ hash }) => { - membersToBeRemoved.push({ - title: 'hash', - details: [hash.toString()] - }); - }); - - if (membersToBeRemoved.length > 0) { - transformedProposal.push({ - header: 'membersToBeRemoved', - details: membersToBeRemoved - }); - } - } - - if ('newQuorumThreshold' in procedure.governanceAction) { - transformedProposal.push({ - title: 'newQuorumThreshold', - details: [ - `${formatPercentages( - procedure.governanceAction.newQuorumThreshold.numerator / - procedure.governanceAction.newQuorumThreshold.denominator - )}%` - ] - }); - } - - if ('protocolVersion' in procedure.governanceAction) { - transformedProposal.push( - { - title: 'protocolVersionMajor', - details: [procedure.governanceAction.protocolVersion.major.toString()] - }, - { - title: 'protocolVersionMinor', - details: [procedure.governanceAction.protocolVersion.minor.toString()] - } - ); - } - - if (procedure.governanceAction.__typename === GovernanceActionType.parameter_change_action) { - const { - protocolParamUpdate: { - maxExecutionUnitsPerTransaction, - maxExecutionUnitsPerBlock, - maxBlockBodySize, - maxTxSize, - maxBlockHeaderSize, - maxValueSize, - maxCollateralInputs, - minFeeCoefficient, - minFeeConstant, - stakeKeyDeposit, - poolDeposit, - monetaryExpansion, - treasuryExpansion, - minPoolCost, - coinsPerUtxoByte, - poolInfluence, - poolRetirementEpochBound, - desiredNumberOfPools, - collateralPercentage, - costModels, - governanceActionValidityPeriod, - governanceActionDeposit, - dRepDeposit, - dRepInactivityPeriod, - minCommitteeSize, - committeeTermLimit, - dRepVotingThresholds, - prices - } - } = procedure.governanceAction; - transformedProposal.push( - { - header: 'maxTxExUnits', - details: [ - { - title: 'memory', - details: [maxExecutionUnitsPerTransaction.memory.toString()] - }, - { - title: 'step', - details: [maxExecutionUnitsPerTransaction.steps.toString()] - } - ] - }, - { - header: 'maxBlockExUnits', - details: [ - { - title: 'memory', - details: [maxExecutionUnitsPerBlock.memory.toString()] - }, - { - title: 'step', - details: [maxExecutionUnitsPerBlock.steps.toString()] - } - ] - }, - { - header: 'networkGroup', - details: [ - { - title: 'maxBBSize', - details: [maxBlockBodySize?.toString()] - }, - { - title: 'maxTxSize', - details: [maxTxSize?.toString()] - }, - { - title: 'maxBHSize', - details: [maxBlockHeaderSize?.toString()] - }, - { - title: 'maxValSize', - details: [maxValueSize?.toString()] - }, - { - title: 'maxCollateralInputs', - details: [maxCollateralInputs?.toString()] - } - ] - }, - { - header: 'economicGroup', - details: [ - { - title: 'minFeeA', - details: [minFeeCoefficient?.toString()] - }, - { - title: 'minFeeB', - details: [minFeeConstant?.toString()] - }, - { - title: 'keyDeposit', - details: [stakeKeyDeposit?.toString()] - }, - { - title: 'poolDeposit', - details: [poolDeposit?.toString()] - }, - { - title: 'rho', - details: [monetaryExpansion?.toString()] - }, - { - title: 'tau', - details: [treasuryExpansion?.toString()] - }, - { - title: 'minPoolCost', - details: [minPoolCost?.toString()] - }, - { - title: 'coinsPerUTxOByte', - details: [coinsPerUtxoByte?.toString()] - } - ] - }, - { - header: 'costModels', - details: [ - { - title: 'PlutusV1', - details: costModels.get(PlutusLanguageVersion.V1).map((model) => model.toString()) - }, - { - title: 'PlutusV2', - details: costModels.get(PlutusLanguageVersion.V2).map((model) => model.toString()) - } - ] - }, - { - header: 'technicalGroup', - details: [ - { - title: 'a0', - details: [poolInfluence?.toString()] - }, - { - title: 'eMax', - details: [poolRetirementEpochBound?.toString()] - }, - { - title: 'nOpt', - details: [desiredNumberOfPools?.toString()] - }, - { - title: 'collateralPercentage', - details: [collateralPercentage?.toString()] - } - ] - }, - { - header: 'prices', - details: [ - { - title: 'memory', - details: [prices.memory.toString()] - }, - { - title: 'step', - details: [prices.steps.toString()] - } - ] - }, - { - header: 'governanceGroup', - details: [ - { - title: 'govActionLifetime', - details: [governanceActionValidityPeriod?.toString()] - }, - { - title: 'govActionDeposit', - details: [depositPaidWithSymbol(BigInt(governanceActionDeposit), cardanoCoin)] - }, - { - title: 'drepDeposit', - details: [depositPaidWithSymbol(BigInt(dRepDeposit), cardanoCoin)] - }, - { - title: 'drepActivity', - details: [dRepInactivityPeriod?.toString()] - }, - { - title: 'ccMinSize', - details: [minCommitteeSize?.toString()] - }, - { - title: 'ccMaxTermLength', - details: [committeeTermLimit?.toString()] - } - ] - } - ); - - if (dRepVotingThresholds) { - const { - motionNoConfidence, - committeeNormal, - commiteeNoConfidence, - hardForkInitiation, - ppNetworkGroup, - ppEconomicGroup, - ppTechnicalGroup, - ppGovernanceGroup, - treasuryWithdrawal, - updateConstitution - } = dRepVotingThresholds; - transformedProposal.push({ - header: 'dRepVotingThresholds', - details: [ - { - title: 'motionNoConfidence', - details: [`${formatPercentages(motionNoConfidence.numerator / motionNoConfidence.denominator)}%`] - }, - { - title: 'committeeNormal', - details: [`${formatPercentages(committeeNormal.numerator / committeeNormal.denominator)}%`] - }, - { - title: 'committeeNoConfidence', - details: [`${formatPercentages(commiteeNoConfidence.numerator / commiteeNoConfidence.denominator)}%`] - }, - { - title: 'updateConstitution', - details: [`${formatPercentages(updateConstitution.numerator / updateConstitution.denominator)}%`] - }, - { - title: 'hardForkInitiation', - details: [`${formatPercentages(hardForkInitiation.numerator / hardForkInitiation.denominator)}%`] - }, - { - title: 'ppNetworkGroup', - details: [`${formatPercentages(ppNetworkGroup.numerator / ppNetworkGroup.denominator)}%`] - }, - { - title: 'ppEconomicGroup', - details: [`${formatPercentages(ppEconomicGroup.numerator / ppEconomicGroup.denominator)}%`] - }, - { - title: 'ppTechnicalGroup', - details: [`${formatPercentages(ppTechnicalGroup.numerator / ppTechnicalGroup.denominator)}%`] - }, - { - title: 'ppGovernanceGroup', - details: [`${formatPercentages(ppGovernanceGroup.numerator / ppGovernanceGroup.denominator)}%`] - }, - { - title: 'treasuryWithdrawal', - details: [`${formatPercentages(treasuryWithdrawal.numerator / treasuryWithdrawal.denominator)}%`] - } - ] - }); - } - } - - return transformedProposal; - }); +export interface CertificateMetadata { + certificateType: Wallet.Cardano.CertificateType; + poolId?: string; + stakeKeyHash?: string; + drepId?: string; + alwaysAbstain?: boolean; + alwaysNoConfidence?: boolean; +} diff --git a/packages/cardano/src/wallet/util/drep.ts b/packages/cardano/src/wallet/util/drep.ts new file mode 100644 index 000000000..72ec374f1 --- /dev/null +++ b/packages/cardano/src/wallet/util/drep.ts @@ -0,0 +1,7 @@ +import { Hash28ByteBase16 } from '@cardano-sdk/crypto'; +import { Cardano } from '@cardano-sdk/core'; +import { HexBlob } from '@cardano-sdk/util'; + +export const drepIDasBech32FromHash = (value: Hash28ByteBase16): Cardano.DRepID => + // eslint-disable-next-line new-cap + Cardano.DRepID(HexBlob.toTypedBech32('drep', HexBlob(value))); diff --git a/packages/cardano/src/wallet/util/index.ts b/packages/cardano/src/wallet/util/index.ts index 81841df4e..6bab1d105 100644 --- a/packages/cardano/src/wallet/util/index.ts +++ b/packages/cardano/src/wallet/util/index.ts @@ -3,3 +3,5 @@ export * from './observable'; export * from './asset-balance'; export * from './stake-pool-transformer'; export * from './calculate-deposit-reclaim'; +export * from './drep'; +export * from './voter'; diff --git a/packages/cardano/src/wallet/util/voter.ts b/packages/cardano/src/wallet/util/voter.ts new file mode 100644 index 000000000..32187f66d --- /dev/null +++ b/packages/cardano/src/wallet/util/voter.ts @@ -0,0 +1,97 @@ +import { Cardano } from '@cardano-sdk/core'; +import { drepIDasBech32FromHash } from './drep'; + +const { VoterType, Vote } = Cardano; + +export enum VoterTypeEnum { + CONSTITUTIONAL_COMMITTEE = 'constitutionalCommittee', + SPO = 'spo', + DREP = 'drep' +} + +export const getVoterType = (voterType: Cardano.VoterType): VoterTypeEnum => { + switch (voterType) { + case VoterType.ccHotKeyHash: + case VoterType.ccHotScriptHash: + return VoterTypeEnum.CONSTITUTIONAL_COMMITTEE; + case VoterType.stakePoolKeyHash: + return VoterTypeEnum.SPO; + case VoterType.dRepKeyHash: + case VoterType.dRepScriptHash: + return VoterTypeEnum.DREP; + default: + return VoterTypeEnum.DREP; + } +}; + +export const getDRepId = (voter: Cardano.Voter): Cardano.DRepID | string => + getVoterType(voter.__typename) === VoterTypeEnum.DREP + ? drepIDasBech32FromHash(voter.credential.hash) + : voter.credential.hash.toString(); + +export enum VotesEnum { + YES = 'yes', + NO = 'no', + ABSTAIN = 'abstain' +} + +export const getVote = (vote: Cardano.Vote): VotesEnum => { + switch (vote) { + case Vote.yes: + return VotesEnum.YES; + case Vote.no: + return VotesEnum.NO; + case Vote.abstain: + default: + return VotesEnum.ABSTAIN; + } +}; + +type VotingProcedureView = { + voter: { + type: VoterTypeEnum; + dRepId?: string; + }; + votes: { + actionId: { + index: number; + txHash: string; + txHashUrl?: string; + }; + votingProcedure: { + vote: VotesEnum; + anchor: { + url: string; + hash: string; + } | null; + }; + }[]; +}; + +export const mapVotingProcedureToView = ( + votingProcedure: Cardano.VotingProcedures[number], + explorerBaseUrl: string +): VotingProcedureView => { + const voterType = getVoterType(votingProcedure.voter.__typename); + + return { + voter: { + type: voterType, + dRepId: getDRepId(votingProcedure.voter) + }, + votes: votingProcedure.votes.map((vote) => ({ + actionId: { + index: vote.actionId.actionIndex, + txHash: vote.actionId.id.toString(), + txHashUrl: `${explorerBaseUrl}/${vote.actionId.id}` + }, + votingProcedure: { + vote: getVote(vote.votingProcedure.vote), + anchor: !!vote.votingProcedure.anchor && { + url: vote.votingProcedure.anchor.url, + hash: vote.votingProcedure.anchor.dataHash.toString() + } + } + })) + }; +}; diff --git a/packages/core/.storybook/__mocks__/cardano.ts b/packages/core/.storybook/__mocks__/cardano.ts index 7c65b255b..2544ef6d9 100644 --- a/packages/core/.storybook/__mocks__/cardano.ts +++ b/packages/core/.storybook/__mocks__/cardano.ts @@ -1,10 +1,15 @@ import { Cardano, util } from '@cardano-sdk/core'; -import * as WalletUtil from '../../../cardano/src/wallet/util'; +import * as Crypto from '@cardano-sdk/crypto'; + +import * as cardanoUtils from '../../../cardano/src/wallet/util'; +import * as drep from '../../../cardano/src/wallet/util/drep'; export const Wallet = { util: { ...util, - ...WalletUtil + ...cardanoUtils, + ...drep }, - Cardano + Cardano, + Crypto }; diff --git a/packages/core/src/ui/components/ActivityDetail/TransactionDetails.stories.tsx b/packages/core/src/ui/components/ActivityDetail/TransactionDetails.stories.tsx index 97acb4e7b..755917e1d 100644 --- a/packages/core/src/ui/components/ActivityDetail/TransactionDetails.stories.tsx +++ b/packages/core/src/ui/components/ActivityDetail/TransactionDetails.stories.tsx @@ -6,7 +6,18 @@ import { TransactionDetails } from './TransactionDetails'; import { ComponentProps } from 'react'; import { ActivityStatus } from '../Activity/AssetActivityItem'; import { Wallet } from '@lace/cardano'; -import { ConwayEraCertificatesTypes } from './types'; +import { mockProposalProcedure } from '@src/ui/utils'; +import { mockVotingProcedures } from '@src/ui/utils/voting-procedures-mock'; +const { Cardano, Crypto } = Wallet; +const REWARD_ACCOUNT = Cardano.RewardAccount('stake_test1uqrw9tjymlm8wrwq7jk68n6v7fs9qz8z0tkdkve26dylmfc2ux2hj'); +const STAKE_KEY_HASH = Cardano.RewardAccount.toHash(REWARD_ACCOUNT); + +// Storybook doesn't support parameters with BigInt +const DUMMY_DEPOSIT = '100000' as never as bigint; +const KEY_HASH_CREDENTIAL = { + type: Cardano.CredentialType.KeyHash, + hash: Crypto.Hash28ByteBase16(STAKE_KEY_HASH) +}; const meta: Meta = { title: 'Sanchonet/ActivityDetail/TransactionDetails', @@ -53,31 +64,27 @@ const data: ComponentProps = { isPopupView: false, votingProcedures: [], amountTransformer: (amount) => `${Number(amount) * adaPrice} USD`, - openExternalLink: (url) => window.open(url, '_blank', 'noopener,noreferrer'), handleOpenExternalHashLink: () => { console.log('handle on hash click', '639a43144dc2c0ead16f2fb753360f4b4f536502dbdb8aa5e424b00abb7534ff'); }, + chainNetworkId: 0, + cardanoCoin: { + id: '1', + name: 'Cardano', + decimals: 6, + symbol: 'tADA' + }, + explorerBaseUrl: 'some-test-url', ownAddresses: [] }; -const stakeVoteDelegationCertificate = [ - { - title: 'certificateType', - details: [ConwayEraCertificatesTypes.StakeVoteDelegation] - }, - { - title: 'stakeKey', - details: ['stake1u929x2y7nnfm797upl7v9rc39pqg87pk5cygvnn2edqmvuq6h48su'] - }, - { - title: 'poolId', - details: ['pool1k0ucs0fau2vhr3p7qh7mnpfgrllwwda7petxjz2gzzaxkyp8f88'] - }, - { - title: 'drep', - details: ['drep1cs234l5mtapethapx8cq97nkpa27xf84phruh5f6jqxa78ymlp4'] - } -]; +const stakeVoteDelegationCertificate: Wallet.Cardano.StakeVoteDelegationCertificate = { + __typename: Cardano.CertificateType.StakeVoteDelegation, + poolId: Cardano.PoolId('pool126zlx7728y7xs08s8epg9qp393kyafy9rzr89g4qkvv4cv93zem'), + stakeCredential: KEY_HASH_CREDENTIAL, + dRep: KEY_HASH_CREDENTIAL +}; + export const StakeVoteDelegationCertificate: Story = { args: { ...data, @@ -92,25 +99,12 @@ export const StakeVoteDelegationCertificates: Story = { } }; -const stakeRegistrationDelegationCertificate = [ - { - title: 'certificateType', - details: [ConwayEraCertificatesTypes.StakeRegistrationDelegation] - }, - { - title: 'stakeKey', - details: ['stake1u929x2y7nnfm797upl7v9rc39pqg87pk5cygvnn2edqmvuq6h48su'] - }, - { - title: 'poolId', - details: ['pool1k0ucs0fau2vhr3p7qh7mnpfgrllwwda7petxjz2gzzaxkyp8f88'] - }, - { - title: 'depositPaid', - info: 'depositPaidInfo', - details: [['2.00 ADA', '0.08 USD']] - } -]; +const stakeRegistrationDelegationCertificate: Wallet.Cardano.StakeRegistrationDelegationCertificate = { + __typename: Cardano.CertificateType.StakeRegistrationDelegation, + deposit: DUMMY_DEPOSIT, + poolId: Cardano.PoolId('pool1syqhydhdzcuqhwtt6q4m63f9g8e7262wzsvk7e0r0njsyjyd0yn'), + stakeCredential: KEY_HASH_CREDENTIAL +}; export const StakeRegistrationDelegationCertificate: Story = { args: { @@ -120,25 +114,12 @@ export const StakeRegistrationDelegationCertificate: Story = { } }; -const voteRegistrationDelegationCertificate = [ - { - title: 'certificateType', - details: [ConwayEraCertificatesTypes.VoteRegistrationDelegation] - }, - { - title: 'stakeKey', - details: ['stake1u929x2y7nnfm797upl7v9rc39pqg87pk5cygvnn2edqmvuq6h48su'] - }, - { - title: 'drepId', - details: ['drep1cs234l5mtapethapx8cq97nkpa27xf84phruh5f6jqxa78ymlp4'] - }, - { - title: 'depositPaid', - info: 'depositPaidInfo', - details: [['2.00 ADA', '0.08 USD']] - } -]; +const voteRegistrationDelegationCertificate: Wallet.Cardano.VoteRegistrationDelegationCertificate = { + __typename: Cardano.CertificateType.VoteRegistrationDelegation, + stakeCredential: KEY_HASH_CREDENTIAL, + dRep: KEY_HASH_CREDENTIAL, + deposit: DUMMY_DEPOSIT +}; export const VoteRegistrationDelegationCertificate: Story = { args: { @@ -148,29 +129,13 @@ export const VoteRegistrationDelegationCertificate: Story = { } }; -const stakeVoteRegistrationDelegationCertificate = [ - { - title: 'certificateType', - details: [ConwayEraCertificatesTypes.StakeVoteRegistrationDelegation] - }, - { - title: 'stakeKey', - details: ['stake1u929x2y7nnfm797upl7v9rc39pqg87pk5cygvnn2edqmvuq6h48su'] - }, - { - title: 'poolId', - details: ['pool1k0ucs0fau2vhr3p7qh7mnpfgrllwwda7petxjz2gzzaxkyp8f88'] - }, - { - title: 'drepId', - details: ['drep1cs234l5mtapethapx8cq97nkpa27xf84phruh5f6jqxa78ymlp4'] - }, - { - title: 'depositPaid', - info: 'depositPaidInfo', - details: [['2.00 ADA', '0.08 USD']] - } -]; +const stakeVoteRegistrationDelegationCertificate: Wallet.Cardano.StakeVoteRegistrationDelegationCertificate = { + __typename: Cardano.CertificateType.StakeVoteRegistrationDelegation, + poolId: Cardano.PoolId('pool126zlx7728y7xs08s8epg9qp393kyafy9rzr89g4qkvv4cv93zem'), + stakeCredential: KEY_HASH_CREDENTIAL, + dRep: KEY_HASH_CREDENTIAL, + deposit: DUMMY_DEPOSIT +}; export const StakeVoteRegistrationDelegationCertificate: Story = { args: { @@ -180,26 +145,14 @@ export const StakeVoteRegistrationDelegationCertificate: Story = { } }; -const updateDRep = [ - { - title: 'certificateType', - details: [ConwayEraCertificatesTypes.UpdateDelegateRepresentative] - }, - { - title: 'drepId', - details: ['65ge6g54g5dd5'] - }, - { - title: 'anchorHash', - details: ['3d2a9d15382c14f5ca260a2f5bfb645fe148bfe10c1d0e1d305b7b1393e2bd97'] - }, - { - title: 'anchorURL', - details: [ - 'https://raw.githubusercontent.com/Ryun1/gov-metadata/main/governace-action/metadata.jsonldr1q99...uqvzlalu' - ] +const updateDRep: Wallet.Cardano.UpdateDelegateRepresentativeCertificate = { + __typename: Cardano.CertificateType.UpdateDelegateRepresentative, + dRepCredential: KEY_HASH_CREDENTIAL, + anchor: { + url: 'anchorUrl', + dataHash: Crypto.Hash32ByteBase16(Buffer.from('anchorDataHashanchorDataHashanch').toString('hex')) } -]; +}; export const UpdateDRep: Story = { name: 'Update DRep', @@ -210,26 +163,14 @@ export const UpdateDRep: Story = { } }; -const resignCommittee = [ - { - title: 'certificateType', - details: [ConwayEraCertificatesTypes.ResignCommitteeCold] - }, - { - title: 'coldCredential', - details: ['65ge6g54g5dd5'] - }, - { - title: 'anchorHash', - details: ['3d2a9d15382c14f5ca260a2f5bfb645fe148bfe10c1d0e1d305b7b1393e2bd97'] - }, - { - title: 'anchorURL', - details: [ - 'https://raw.githubusercontent.com/Ryun1/gov-metadata/main/governace-action/metadata.jsonldr1q99...uqvzlalu' - ] +const resignCommittee: Wallet.Cardano.ResignCommitteeColdCertificate = { + __typename: Cardano.CertificateType.ResignCommitteeCold, + coldCredential: KEY_HASH_CREDENTIAL, + anchor: { + url: 'anchorUrl', + dataHash: Crypto.Hash32ByteBase16(Buffer.from('anchorDataHashanchorDataHashanch').toString('hex')) } -]; +}; export const ResignCommittee: Story = { args: { @@ -239,20 +180,11 @@ export const ResignCommittee: Story = { } }; -const authorizeCommittee = [ - { - title: 'certificateType', - details: [ConwayEraCertificatesTypes.AuthorizeCommitteeHot] - }, - { - title: 'coldCredential', - details: ['cc_cold 65ge6g54g5dd5'] - }, - { - title: 'hotCredential', - details: ['cc_hot stake1u929x2y7nnfm797upl7v9rc39pqg87pk5cygvnn2edqmvuq6h48su'] - } -]; +const authorizeCommittee: Wallet.Cardano.AuthorizeCommitteeHotCertificate = { + __typename: Cardano.CertificateType.AuthorizeCommitteeHot, + coldCredential: KEY_HASH_CREDENTIAL, + hotCredential: KEY_HASH_CREDENTIAL +}; export const AuthorizeCommittee: Story = { args: { @@ -262,31 +194,15 @@ export const AuthorizeCommittee: Story = { } }; -const dRepRegistration = [ - { - title: 'certificateType', - details: [ConwayEraCertificatesTypes.RegisterDelegateRepresentative] - }, - { - title: 'drepId', - details: ['drep170ef53apap7dadzemkcd7lujlzk5hyzvzzjj7f3sx89ecn3ft6u'] - }, - { - title: 'anchorHash', - details: ['3d2a9d15382c14f5ca260a2f5bfb645fe148bfe10c1d0e1d305b7b1393e2bd97'] - }, - { - title: 'anchorURL', - details: [ - 'https://raw.githubusercontent.com/Ryun1/gov-metadata/main/governace-action/metadata.jsonldr1q99...uqvzlalu' - ] - }, - { - title: 'depositPaid', - info: 'depositPaidInfo', - details: [['0.35 ADA', '0.08 USD']] +const dRepRegistration: Wallet.Cardano.RegisterDelegateRepresentativeCertificate = { + __typename: Cardano.CertificateType.RegisterDelegateRepresentative, + dRepCredential: KEY_HASH_CREDENTIAL, + deposit: DUMMY_DEPOSIT, + anchor: { + url: 'anchorUrl', + dataHash: Crypto.Hash32ByteBase16(Buffer.from('anchorDataHashanchorDataHashanch').toString('hex')) } -]; +}; export const DRepRegistration: Story = { name: 'DRep Registration', @@ -297,21 +213,11 @@ export const DRepRegistration: Story = { } }; -const dRepDeRegistration = [ - { - title: 'certificateType', - details: [ConwayEraCertificatesTypes.UnregisterDelegateRepresentative] - }, - { - title: 'drepId', - details: ['drep170ef53apap7dadzemkcd7lujlzk5hyzvzzjj7f3sx89ecn3ft6u'] - }, - { - title: 'depositReturned', - info: 'depositReturnedInfo', - details: [['0.35 ADA', '0.08 USD']] - } -]; +const dRepDeRegistration: Wallet.Cardano.UnRegisterDelegateRepresentativeCertificate = { + __typename: Cardano.CertificateType.UnregisterDelegateRepresentative, + dRepCredential: KEY_HASH_CREDENTIAL, + deposit: DUMMY_DEPOSIT +}; export const DRepDeRegistration: Story = { name: 'DRep De-Registration', @@ -322,20 +228,11 @@ export const DRepDeRegistration: Story = { } }; -const voteDelegation = [ - { - title: 'certificateType', - details: [ConwayEraCertificatesTypes.VoteDelegation] - }, - { - title: 'stakeKey', - details: ['stake1u929x2y7nnfm797upl7v9rc39pqg87pk5cygvnn2edqmvuq6h48su'] - }, - { - title: 'drepId', - details: ['drep1cs234l5mtapethapx8cq97nkpa27xf84phruh5f6jqxa78ymlp4'] - } -]; +const voteDelegation: Wallet.Cardano.VoteDelegationCertificate = { + __typename: Cardano.CertificateType.VoteDelegation, + dRep: { __typename: 'AlwaysAbstain' }, + stakeCredential: KEY_HASH_CREDENTIAL +}; export const VoteDelegation: Story = { args: { @@ -345,575 +242,67 @@ export const VoteDelegation: Story = { } }; -const confirmVote = [ - { - title: 'voterType', - details: ['drep'] - }, - { - title: 'voterCredential', - details: ['drep1cs234l5mtapethapx8cq97nkpa27xf84phruh5f6jqxa78ymlp4'] - }, - { - title: 'voteTypes', - details: ['yes'] - }, - { - title: 'anchorURL', - details: ['https://shorturl.at/eK145'] - }, - { - title: 'anchorHash', - details: ['9067f223838d88b83f660c05eedf7f6f65c45de31e522c1bcb6a1eb287b17e89'] - } -]; - export const ConfirmVote: Story = { args: { ...data, name: 'Confirm Vote', - votingProcedures: [confirmVote, confirmVote] + votingProcedures: mockVotingProcedures, + explorerBaseUrl: 'https://some-test-url.io' } }; -const parameterChangeAction = [ - { - title: 'type', - details: [Wallet.Cardano.GovernanceActionType.parameter_change_action] - }, - { - title: 'deposit', - details: ['stake1u89sa...css5vgr'] - }, - { - title: 'rewardAccount', - details: ['https://www.someurl.io'] - }, - { - title: 'anchorURL', - details: ['https://www.someurl.io'] - }, - { - title: 'anchorHash', - details: ['000000...0000'] - }, - { - header: 'maxTxExUnits', - details: [ - { - title: 'memory', - details: ['100000000'] - }, - { - title: 'step', - details: ['10000000000000'] - } - ] - }, - { - header: 'maxBlockExUnits', - details: [ - { - title: 'memory', - details: ['50000000'] - }, - { - title: 'step', - details: ['40000000000'] - } - ] - }, - { - header: 'networkGroup', - details: [ - { - title: 'maxBBSize', - details: ['65536'] - }, - { - title: 'maxTxSize', - details: ['16384'] - }, - { - title: 'maxBHSize', - details: ['1100'] - }, - { - title: 'maxValSize', - details: ['5000'] - }, - { - title: 'maxCollateralInputs', - details: ['3'] - } - ] - }, - { - header: 'economicGroup', - details: [ - { - title: 'minFeeA', - details: ['44'] - }, - { - title: 'minFeeB', - details: ['155381'] - }, - { - title: 'keyDeposit', - details: ['2000000'] - }, - { - title: 'poolDeposit', - details: ['500000000'] - }, - { - title: 'rho', - details: ['0.003'] - }, - { - title: 'tau', - details: ['0.2'] - }, - { - title: 'minPoolCost', - details: ['340000000'] - }, - { - title: 'coinsPerUTxOByte', - details: ['34482'] - } - ] - }, - { - header: 'costModels', - details: [ - { - title: 'PlutusV1', - details: ['197209'] - }, - { - title: 'PlutusV2', - details: ['197209'] - } - ] - }, - { - header: 'technicalGroup', - details: [ - { - title: 'a0', - details: ['0.3'] - }, - { - title: 'eMax', - details: ['18'] - }, - { - title: 'nOpt', - details: ['150'] - }, - { - title: 'collateralPercentage', - details: ['150'] - } - ] - }, - { - header: 'prices', - details: [ - { - title: 'memory', - details: ['0.0577'] - }, - { - title: 'step', - details: ['0.0000721'] - } - ] - }, - { - header: 'governanceGroup', - details: [ - { - title: 'govActionLifetime', - details: ['10'] - }, - { - title: 'govActionDeposit', - details: ['500 ADA'] - }, - { - title: 'drepDeposit', - details: ['1000 ADA'] - }, - { - title: 'drepActivity', - details: ['5'] - }, - { - title: 'ccMinSize', - details: ['7'] - }, - { - title: 'ccMaxTermLength', - details: ['25'] - } - ] - }, - { - header: 'dRepVotingThresholds', - details: [ - { - title: 'motionNoConfidence', - details: ['51%'] - }, - { - title: 'committeeNormal', - details: ['67%'] - }, - { - title: 'committeeNoConfidence', - details: ['80%'] - }, - { - title: 'updateConstitution', - details: ['75%'] - }, - { - title: 'hardForkInitiation', - details: ['90%'] - }, - { - title: 'ppNetworkGroup', - details: ['70%'] - }, - { - title: 'ppEconomicGroup', - details: ['70%'] - }, - { - title: 'ppTechnicalGroup', - details: ['70%'] - }, - { - title: 'ppGovernanceGroup', - details: ['70%'] - }, - { - title: 'treasuryWithdrawal', - details: ['51%'] - } - ] - } -]; - export const ParameterChangeAction: Story = { args: { ...data, name: 'Parameter Change Action', - proposalProcedures: [parameterChangeAction] + proposalProcedures: [mockProposalProcedure[Cardano.GovernanceActionType.parameter_change_action]] } }; -const hardForkInitiationAction = [ - { - title: 'type', - details: [Wallet.Cardano.GovernanceActionType.hard_fork_initiation_action] - }, - { - title: 'deposit', - info: 'deposit', - details: [['2.00 ADA', '0.18 USD']] - }, - { title: 'rewardAccount', details: ['23bcf2892e8182a68e3aac6f9f42ed3317d115ebad12a17232681175'] }, - { - title: 'anchorURL', - details: [ - 'https://raw.githubusercontent.com/Ryun1/gov-metadata/main/governace-action/metadata.jsonldr1q99...uqvzlalu' - ] - }, - { - title: 'anchorHash', - details: ['3d2a9d15382c14f5ca260a2f5bfb645fe148bfe10c1d0e1d305b7b1393e2bd97'] - }, - { - title: 'governanceActionID', - details: ['d0b1f7be72731a97e9728e0f1c358d576fd28aa9f290d53ce1ef803a1a753ba8'] - }, - { - title: 'actionIndex', - details: ['0'] - }, - { - title: 'protocolVersionMajor', - details: ['1'] - }, - { - title: 'protocolVersionMinor', - details: ['2'] - }, - { - title: 'protocolVersionPatch', - details: ['3'] - } -]; - export const HardForkInitiationAction: Story = { args: { ...data, name: 'Hard Fork Initiation Action', - proposalProcedures: [hardForkInitiationAction] + proposalProcedures: [mockProposalProcedure[Cardano.GovernanceActionType.hard_fork_initiation_action]] } }; -const infoAction = [ - { - title: 'type', - details: [Wallet.Cardano.GovernanceActionType.info_action] - }, - { - title: 'deposit', - info: 'deposit', - details: [['2.00 ADA', '0.18 USD']] - }, - { - title: 'anchorURL', - details: [ - 'https://raw.githubusercontent.com/Ryun1/gov-metadata/main/governace-action/metadata.jsonldr1q99...uqvzlalu' - ] - }, - { - title: 'anchorHash', - details: ['3d2a9d15382c14f5ca260a2f5bfb645fe148bfe10c1d0e1d305b7b1393e2bd97'] - }, - { - title: 'governanceActionID', - details: ['d0b1f7be72731a97e9728e0f1c358d576fd28aa9f290d53ce1ef803a1a753ba8'] - }, - { - title: 'actionIndex', - details: ['0'] - } -]; - export const InfoAction: Story = { args: { ...data, name: 'Info Action', - proposalProcedures: [infoAction] + proposalProcedures: [mockProposalProcedure[Cardano.GovernanceActionType.info_action]] } }; -const newConstitutionAction = [ - { - title: 'type', - details: [Wallet.Cardano.GovernanceActionType.new_constitution] - }, - { - title: 'anchorURL', - details: [ - 'https://raw.githubusercontent.com/Ryun1/gov-metadata/main/governace-action/metadata.jsonldr1q99...uqvzlalu' - ] - }, - { - title: 'anchorHash', - details: ['3d2a9d15382c14f5ca260a2f5bfb645fe148bfe10c1d0e1d305b7b1393e2bd97'] - }, - { - title: 'governanceActionID', - details: ['d0b1f7be72731a97e9728e0f1c358d576fd28aa9f290d53ce1ef803a1a753ba8'] - }, - { - title: 'actionIndex', - details: ['0'] - }, - { - title: 'constitutionAnchorURL', - details: ['https://www.someurl.io'] - }, - { - title: 'constitutionScriptHash', - details: ['cb0ec2692497b458e46812c8a5bfa2931d1a2d965a99893828ec810f'] - } -]; - export const NewConstitutionAction: Story = { args: { ...data, name: 'New Constitution Action', - proposalProcedures: [newConstitutionAction] + proposalProcedures: [mockProposalProcedure[Cardano.GovernanceActionType.new_constitution]] } }; -const noConfidenceAction = [ - { - title: 'type', - details: [Wallet.Cardano.GovernanceActionType.no_confidence] - }, - { - title: 'deposit', - info: 'deposit', - details: [['2.00 ADA', '0.18 USD']] - }, - { title: 'rewardAccount', details: ['23bcf2892e8182a68e3aac6f9f42ed3317d115ebad12a17232681175'] }, - { - title: 'anchorURL', - details: [ - 'https://raw.githubusercontent.com/Ryun1/gov-metadata/main/governace-action/metadata.jsonldr1q99...uqvzlalu' - ] - }, - { - title: 'anchorHash', - details: ['3d2a9d15382c14f5ca260a2f5bfb645fe148bfe10c1d0e1d305b7b1393e2bd97'] - }, - { - title: 'governanceActionID', - details: ['d0b1f7be72731a97e9728e0f1c358d576fd28aa9f290d53ce1ef803a1a753ba8'] - }, - { - title: 'actionIndex', - details: ['0'] - } -]; - export const NoConfidenceAction: Story = { args: { ...data, name: 'No Confidence Action', - proposalProcedures: [noConfidenceAction] + proposalProcedures: [mockProposalProcedure[Cardano.GovernanceActionType.no_confidence]] } }; -const updateCommitteeAction = [ - { - title: 'type', - details: [Wallet.Cardano.GovernanceActionType.update_committee] - }, - { - title: 'deposit', - info: 'deposit', - details: [['2.00 ADA', '0.18 USD']] - }, - { title: 'rewardAccount', details: ['23bcf2892e8182a68e3aac6f9f42ed3317d115ebad12a17232681175'] }, - { - title: 'anchorURL', - details: [ - 'https://raw.githubusercontent.com/Ryun1/gov-metadata/main/governace-action/metadata.jsonldr1q99...uqvzlalu' - ] - }, - { - title: 'anchorHash', - details: ['3d2a9d15382c14f5ca260a2f5bfb645fe148bfe10c1d0e1d305b7b1393e2bd97'] - }, - { - title: 'governanceActionID', - details: ['d0b1f7be72731a97e9728e0f1c358d576fd28aa9f290d53ce1ef803a1a753ba8'] - }, - { - title: 'actionIndex', - details: ['0'] - }, - { - header: 'membersToBeAdded', - details: [ - { - title: 'coldCredentialHash', - details: ['30000000000000000000000000000000000000000000000000000000'] - }, - { - title: 'epoch', - details: ['1'] - }, - { - title: 'coldCredentialHash', - details: ['40000000000000000000000000000000000000000000000000000000'] - }, - { - title: 'epoch', - details: ['2'] - } - ] - }, - { - header: 'membersToBeRemoved', - details: [ - { - title: 'hash', - details: ['00000000000000000000000000000000000000000000000000000000'] - } - ] - }, - { - title: 'newQuorumThreshold', - details: ['0.4%'] - } -]; - export const UpdateCommitteeAction: Story = { args: { ...data, name: 'Update Committee Action', - proposalProcedures: [updateCommitteeAction] + proposalProcedures: [mockProposalProcedure[Cardano.GovernanceActionType.update_committee]] } }; -const treasuryWithdrawalsAction = [ - { - title: 'type', - details: [Wallet.Cardano.GovernanceActionType.treasury_withdrawals_action] - }, - { - title: 'deposit', - info: 'deposit', - details: [['2.00 ADA', '0.18 USD']] - }, - { title: 'rewardAccount', details: ['23bcf2892e8182a68e3aac6f9f42ed3317d115ebad12a17232681175'] }, - { - title: 'anchorURL', - details: [ - 'https://raw.githubusercontent.com/Ryun1/gov-metadata/main/governace-action/metadata.jsonldr1q99...uqvzlalu' - ] - }, - { - title: 'anchorHash', - details: ['3d2a9d15382c14f5ca260a2f5bfb645fe148bfe10c1d0e1d305b7b1393e2bd97'] - }, - { - title: 'governanceActionID', - details: ['d0b1f7be72731a97e9728e0f1c358d576fd28aa9f290d53ce1ef803a1a753ba8'] - }, - { - title: 'actionIndex', - details: ['0'] - }, - { - header: 'withdrawal', - details: [ - { - title: 'withdrawalRewardAccount', - details: ['23bcf2892e8182a68e3aac6f9f42ed3317d115ebad12a17232681175'] - }, - { - title: 'withdrawalAmount', - details: ['1030939916423 ADA'] - }, - { - title: 'withdrawalRewardAccount', - details: ['23bcf2892e8182a68e3aac6f9f42ed3317d115ebad12a17232681175'] - }, - { - title: 'withdrawalAmount', - details: ['1030939916423 ADA'] - } - ] - } -]; - export const TreasuryWithdrawalsAction: Story = { args: { ...data, name: 'Treasury Withdrawals Action', - proposalProcedures: [treasuryWithdrawalsAction] + proposalProcedures: [mockProposalProcedure[Cardano.GovernanceActionType.treasury_withdrawals_action]] } }; diff --git a/packages/core/src/ui/components/ActivityDetail/TransactionDetails.tsx b/packages/core/src/ui/components/ActivityDetail/TransactionDetails.tsx index e3b1460ff..f9c6c3b37 100644 --- a/packages/core/src/ui/components/ActivityDetail/TransactionDetails.tsx +++ b/packages/core/src/ui/components/ActivityDetail/TransactionDetails.tsx @@ -13,18 +13,13 @@ import styles from './TransactionDetails.module.scss'; import { TransactionInputOutput } from './TransactionInputOutput'; import { TransactionFee } from './TransactionFee'; import { ActivityDetailHeader } from './ActivityDetailHeader'; -import { TxDetailList } from './TxDetailsList'; -import { - TxDetailsVotingProceduresTitles, - TxDetailsProposalProceduresTitles, - TxDetailsCertificateTitles, - TxDetails, - TxDetail, - TransactionActivityType -} from './types'; import { Collateral, CollateralStatus } from './Collateral'; +import { Wallet } from '@lace/cardano'; +import { TxDetailsCertificates } from './components/TxDetailsCertificates/TxDetailsCertificates'; +import { TxDetailsVotingProcedures } from './components/TxDetailsVotingProcedures'; +import { TxDetailsProposalProcedures } from './components/TxDetailsProposalProcedures'; +import { TransactionActivityType } from './types'; import { useTranslation } from 'react-i18next'; -import { TranslationKey } from '@lace/translation'; // eslint-disable-next-line @typescript-eslint/no-explicit-any const displayMetadataMsg = (value: any[]): string => value?.find((val: any) => val.hasOwnProperty('msg'))?.msg || ''; @@ -83,13 +78,15 @@ export interface TransactionDetailsProps { ownAddresses: string[]; addressToNameMap: Map; isPopupView?: boolean; - openExternalLink?: (url: string) => void; handleOpenExternalHashLink?: () => void; sendAnalyticsInputs?: () => void; sendAnalyticsOutputs?: () => void; - votingProcedures?: TxDetails[]; - proposalProcedures?: TxDetails[]; - certificates?: TxDetails[]; + votingProcedures?: Wallet.Cardano.VotingProcedures; + proposalProcedures?: Wallet.Cardano.ProposalProcedure[]; + certificates?: Wallet.Cardano.Certificate[]; + chainNetworkId: Wallet.Cardano.NetworkId; + cardanoCoin: Wallet.CoinId; + explorerBaseUrl: string; } const TOAST_DEFAULT_DURATION = 3; @@ -130,107 +127,22 @@ export const TransactionDetails = ({ ownAddresses, addressToNameMap, isPopupView, - openExternalLink, handleOpenExternalHashLink, sendAnalyticsInputs, sendAnalyticsOutputs, proposalProcedures, votingProcedures, + collateral, certificates, - collateral + chainNetworkId, + cardanoCoin, + explorerBaseUrl }: TransactionDetailsProps): React.ReactElement => { const { t } = useTranslation(); const isSending = status === ActivityStatus.PENDING; const isSuccess = status === ActivityStatus.SUCCESS; - const renderAnchorHashDetails = (url: string) => ( -
openExternalLink(url)}> - {url} -
- ); - - // Translate certificate typenames - // TODO: refactor this one - const translatedCertificates = certificates?.map((certificate) => - certificate?.map( - (detail) => - ({ - ...detail, - ...('title' in detail && - detail.title === 'certificateType' && { - details: [t(`core.assetActivityItem.entry.name.${detail.details[0]}` as unknown as TranslationKey)] - }), - ...('title' in detail && - detail.title === 'anchorURL' && { - details: [renderAnchorHashDetails(detail.details[0] as string)] - }) - } as unknown as TxDetail) - ) - ); - - // Translate governance proposal typenames - // TODO: find a way to translate in the mappers - // TODO: refactor this one - const translatedProposalProcedures = proposalProcedures?.map((proposal) => - proposal?.map( - (p) => - ({ - ...p, - ...('title' in p && - p.title === 'type' && { - details: [t(`core.activityDetails.governanceActions.${p.details[0]}` as unknown as TranslationKey)] - }), - ...('title' in p && - p.title === 'anchorURL' && { - details: [renderAnchorHashDetails(p.details[0] as string)] - }), - ...('header' in p && { - details: p.details.map((detail) => ({ - ...detail, - ...('title' in detail && - ['govActionLifetime', 'drepActivity', 'ccMaxTermLength'].includes(detail.title) && { - details: [ - ` - ${Number(detail.details[0])} - ${t( - // eslint-disable-next-line sonarjs/no-nested-template-literals - `core.activityDetails.${ - Number(detail.details[0]) === 0 || Number(detail.details[0]) > 1 ? 'epochs' : 'epoch' - }` - )} - ` - ] - }), - ...('title' in detail && - detail.title === 'anchorURL' && { - details: [renderAnchorHashDetails(detail.details[0] as string)] - }) - })) - }) - } as unknown as TxDetail) - ) - ); - - // Translate voting procedure typenames - // TODO: refactor this one - const translatedVotingProcedures = votingProcedures?.map((proposal) => - proposal?.map( - (p) => - ({ - ...p, - ...('title' in p && - ['voterType', 'voteTypes'].includes(p.title) && { - details: [t(`core.activityDetails.${p.title}.${p.details[0]}` as unknown as TranslationKey)] - }), - ...('title' in p && - p.title === 'anchorURL' && { - details: [renderAnchorHashDetails(p.details[0] as string)] - }) - } as unknown as TxDetail) - ) - ); - const getCollateralStatus = (): CollateralStatus => { switch (status) { case ActivityStatus.SPENDABLE: @@ -430,163 +342,21 @@ export const TransactionDetails = ({ label: t('core.activityDetails.depositReclaim') })} - {votingProcedures?.length > 0 && ( - - testId="voting-procedures" - title={t('core.activityDetails.votingProcedures')} - subTitle={t('core.activityDetails.votingProcedure')} - lists={translatedVotingProcedures} - translations={{ - voterType: t('core.activityDetails.votingProcedureTitles.voterType'), - drepId: t('core.activityDetails.votingProcedureTitles.drepId'), - voterCredential: t('core.activityDetails.votingProcedureTitles.voterCredential'), - voteTypes: t('core.activityDetails.votingProcedureTitles.voteTypes'), - anchorHash: t('core.activityDetails.votingProcedureTitles.anchorHash'), - anchorURL: t('core.activityDetails.votingProcedureTitles.anchorURL') - }} - withSeparatorLine - /> + )} {proposalProcedures?.length > 0 && ( - - testId="proposal-procedures" - title={t('core.activityDetails.proposalProcedures')} - subTitle={t('core.activityDetails.proposalProcedure')} - lists={translatedProposalProcedures} - withSeparatorLine - translations={{ - type: t('core.activityDetails.proposalProcedureTitles.type'), - deposit: t('core.activityDetails.proposalProcedureTitles.deposit'), - rewardAccount: t('core.activityDetails.proposalProcedureTitles.rewardAccount'), - anchorHash: t('core.activityDetails.proposalProcedureTitles.anchorHash'), - anchorURL: t('core.activityDetails.proposalProcedureTitles.anchorURL'), - governanceActionID: t('core.activityDetails.proposalProcedureTitles.governanceActionID'), - actionIndex: t('core.activityDetails.proposalProcedureTitles.actionIndex'), - newQuorumThreshold: t('core.activityDetails.proposalProcedureTitles.newQuorumThreshold'), - withdrawal: t('core.activityDetails.proposalProcedureTitles.withdrawal'), - withdrawalRewardAccount: t('core.activityDetails.proposalProcedureTitles.withdrawalRewardAccount'), - withdrawalAmount: t('core.activityDetails.proposalProcedureTitles.withdrawalAmount'), - constitutionAnchorURL: t('core.activityDetails.proposalProcedureTitles.constitutionAnchorURL'), - constitutionScriptHash: t('core.activityDetails.proposalProcedureTitles.constitutionScriptHash'), - coldCredentialHash: t('core.activityDetails.proposalProcedureTitles.coldCredentialHash'), - epoch: t('core.activityDetails.proposalProcedureTitles.epoch'), - membersToBeAdded: t('core.activityDetails.proposalProcedureTitles.membersToBeAdded'), - hash: t('core.activityDetails.proposalProcedureTitles.hash'), - membersToBeRemoved: t('core.activityDetails.proposalProcedureTitles.membersToBeRemoved'), - protocolVersionMajor: t('core.activityDetails.proposalProcedureTitles.protocolVersionMajor'), - protocolVersionMinor: t('core.activityDetails.proposalProcedureTitles.protocolVersionMinor'), - protocolVersionPatch: t('core.activityDetails.proposalProcedureTitles.protocolVersionPatch'), - maxTxExUnits: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.networkGroup.maxTxExUnits'), - maxBlockExUnits: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.networkGroup.maxBlockExUnits' - ), - networkGroup: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.networkGroup.title'), - economicGroup: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.economicGroup.title'), - technicalGroup: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.technicalGroup.title'), - costModels: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.technicalGroup.costModels'), - PlutusV1: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.technicalGroup.PlutusV1'), - PlutusV2: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.technicalGroup.PlutusV2'), - governanceGroup: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.title'), - dRepVotingThresholds: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.dRepVotingThresholds.title' - ), - memory: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.memory'), - step: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.step'), - maxBBSize: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.networkGroup.maxBBSize'), - maxTxSize: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.networkGroup.maxTxSize'), - maxBHSize: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.networkGroup.maxBHSize'), - maxValSize: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.networkGroup.maxValSize'), - maxCollateralInputs: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.networkGroup.maxCollateralInputs' - ), - minFeeA: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.economicGroup.minFeeA'), - minFeeB: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.economicGroup.minFeeB'), - keyDeposit: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.economicGroup.keyDeposit'), - poolDeposit: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.economicGroup.poolDeposit'), - rho: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.economicGroup.rho'), - tau: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.economicGroup.tau'), - minPoolCost: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.economicGroup.minPoolCost'), - coinsPerUTxOByte: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.economicGroup.coinsPerUTxOByte' - ), - a0: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.technicalGroup.a0'), - eMax: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.technicalGroup.eMax'), - nOpt: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.technicalGroup.nOpt'), - collateralPercentage: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.technicalGroup.collateralPercentage' - ), - prices: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.economicGroup.prices'), - govActionLifetime: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.govActionLifetime' - ), - govActionDeposit: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.govActionDeposit' - ), - drepDeposit: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.drepDeposit'), - drepActivity: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.drepActivity' - ), - ccMinSize: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.ccMinSize'), - ccMaxTermLength: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.ccMaxTermLength' - ), - motionNoConfidence: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.dRepVotingThresholds.motionNoConfidence' - ), - committeeNormal: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.dRepVotingThresholds.committeeNormal' - ), - committeeNoConfidence: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.dRepVotingThresholds.committeeNoConfidence' - ), - updateConstitution: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.dRepVotingThresholds.updateConstitution' - ), - hardForkInitiation: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.dRepVotingThresholds.hardForkInitiation' - ), - ppNetworkGroup: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.dRepVotingThresholds.ppNetworkGroup' - ), - ppEconomicGroup: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.dRepVotingThresholds.ppEconomicGroup' - ), - ppTechnicalGroup: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.dRepVotingThresholds.ppTechnicalGroup' - ), - ppGovernanceGroup: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.dRepVotingThresholds.ppGovernanceGroup' - ), - treasuryWithdrawal: t( - 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.dRepVotingThresholds.treasuryWithdrawal' - ) - }} + )} {certificates?.length > 0 && ( - - title={t('core.activityDetails.certificates')} - subTitle={t('core.activityDetails.certificate')} - testId="certificates" - lists={translatedCertificates} - withSeparatorLine - translations={{ - certificate: t('core.activityDetails.certificateTitles.certificate'), - certificateType: t('core.activityDetails.certificateTitles.certificateType'), - coldCredential: t('core.activityDetails.certificateTitles.coldCredential'), - hotCredential: t('core.activityDetails.certificateTitles.hotCredential'), - stakeKey: t('core.activityDetails.certificateTitles.stakeKey'), - drepId: t('core.activityDetails.certificateTitles.drepId'), - anchorURL: t('core.activityDetails.certificateTitles.anchorURL'), - anchorHash: t('core.activityDetails.certificateTitles.anchorHash'), - poolId: t('core.activityDetails.certificateTitles.poolId'), - drep: t('core.activityDetails.certificateTitles.drep'), - depositPaid: t('core.activityDetails.certificateTitles.depositPaid'), - depositPaidInfo: t('core.activityDetails.certificateTitles.depositPaidInfo'), - depositReturned: t('core.activityDetails.certificateTitles.depositReturned'), - depositReturnedInfo: t('core.activityDetails.certificateTitles.depositReturnedInfo') - }} + )} {addrInputs?.length > 0 && ( diff --git a/packages/core/src/ui/components/ActivityDetail/TxDetailsList.tsx b/packages/core/src/ui/components/ActivityDetail/TxDetailsGroup.tsx similarity index 57% rename from packages/core/src/ui/components/ActivityDetail/TxDetailsList.tsx rename to packages/core/src/ui/components/ActivityDetail/TxDetailsGroup.tsx index 330d22638..3b16a6487 100644 --- a/packages/core/src/ui/components/ActivityDetail/TxDetailsList.tsx +++ b/packages/core/src/ui/components/ActivityDetail/TxDetailsGroup.tsx @@ -4,32 +4,25 @@ import cn from 'classnames'; import React, { useState } from 'react'; import { DownOutlined, InfoCircleOutlined } from '@ant-design/icons'; import { Button } from '@lace/common'; -import { TranslationsFor } from '@src/ui/utils/types'; import { ReactComponent as BracketDown } from '../../assets/icons/bracket-down.component.svg'; -import { DetailRows } from './components'; import styles from './TransactionInputOutput.module.scss'; -import { TxDetails } from './types'; import { Text } from '@lace/ui'; -interface TxDetailListProps { +interface TxDetailsGroupProps { testId: string; title: string; - subTitle: string; - lists: TxDetails[]; - translations: T extends string ? TranslationsFor : never; + children: React.ReactNode; tooltipContent?: React.ReactNode; withSeparatorLine?: boolean; } -export const TxDetailList = ({ +export const TxDetailsGroup = ({ testId, title, - subTitle, - lists, + children, tooltipContent, - withSeparatorLine, - translations -}: TxDetailListProps): React.ReactElement => { + withSeparatorLine +}: TxDetailsGroupProps): React.ReactElement => { const [isVisible, setIsVisible] = useState(); const Icon = BracketDown ? ( @@ -64,23 +57,7 @@ export const TxDetailList = ({ className={styles.arrowBtn} /> - {isVisible && ( -
- {lists.map((list, idx) => ( - -
0 })} /> - {lists.length > 1 && ( -
- {`${subTitle} ${ - idx + 1 - }`} -
- )} - translations={translations} testId={testId} list={list} /> - - ))} -
- )} + {isVisible && children}
); }; diff --git a/packages/core/src/ui/components/ActivityDetail/__tests__/TransactionDetails.test.tsx b/packages/core/src/ui/components/ActivityDetail/__tests__/TransactionDetails.test.tsx index 26a3d9558..35d1dc545 100644 --- a/packages/core/src/ui/components/ActivityDetail/__tests__/TransactionDetails.test.tsx +++ b/packages/core/src/ui/components/ActivityDetail/__tests__/TransactionDetails.test.tsx @@ -3,9 +3,17 @@ import * as React from 'react'; import { render, within, fireEvent } from '@testing-library/react'; import '@testing-library/jest-dom'; import { TransactionDetails, TransactionDetailsProps } from '../TransactionDetails'; +import { Wallet } from '@lace/cardano'; const transactionDate = '2021/09/10'; +export const cardanoCoin: Wallet.CoinId = { + id: '1', + name: 'Cardano', + decimals: 6, + symbol: 'A' +}; + describe('Testing ActivityDetailsBrowser component', () => { const addrListProps: TransactionDetailsProps = { name: 'Name', @@ -36,7 +44,10 @@ describe('Testing ActivityDetailsBrowser component', () => { amountTransformer: (amount) => `${amount} $`, coinSymbol: 'ADA', ownAddresses: [], - addressToNameMap: new Map() + addressToNameMap: new Map(), + chainNetworkId: Wallet.Cardano.NetworkId.Testnet, + cardanoCoin, + explorerBaseUrl: '' }; test('should display transaction hash and copy button', async () => { diff --git a/packages/core/src/ui/components/ActivityDetail/components/DetailRow.module.scss b/packages/core/src/ui/components/ActivityDetail/components/DetailRow.module.scss deleted file mode 100644 index 83b9354ec..000000000 --- a/packages/core/src/ui/components/ActivityDetail/components/DetailRow.module.scss +++ /dev/null @@ -1,45 +0,0 @@ -@import '../../../styles/theme.scss'; -@import '../../../../../../common/src/ui/styles/abstracts/typography'; - -.details { - color: var(--text-color-primary, #ffffff); - display: flex; - justify-content: space-between; - margin-bottom: size_unit(4); - width: 100%; - - .title { - align-items: center; - gap: 8px; - display: flex; - flex: 0 0 50%; - align-self: baseline; - color: var(--text-color-primary, #ffffff); - @include text-body-semi-bold; - } - - .detail { - align-items: end; - display: flex; - flex-direction: column; - gap: size_unit(2); - color: var(--text-color-primary, #ffffff); - text-align: right; - word-break: break-all; - @include text-body-medium; - - @media (max-width: $breakpoint-popup) { - flex-direction: column; - } - - .subitems { - display: flex; - flex-direction: column; - width: 100%; - align-items: flex-end; - .subitem { - color: var(--text-color-secondary, #878e9e); - } - } - } -} diff --git a/packages/core/src/ui/components/ActivityDetail/components/DetailRow.tsx b/packages/core/src/ui/components/ActivityDetail/components/DetailRow.tsx deleted file mode 100644 index c70d7c85b..000000000 --- a/packages/core/src/ui/components/ActivityDetail/components/DetailRow.tsx +++ /dev/null @@ -1,31 +0,0 @@ -/* eslint-disable no-magic-numbers */ -import React from 'react'; -import styles from './DetailRow.module.scss'; -import { DetailRowSubitems } from './DetailRowSubitems'; -import { InfoItem } from './InfoItem'; - -type DetailsRowProps = { - title: string; - info?: string; - dataTestId?: string; - details: (string | [string, string])[]; -}; - -// TODO: add proper data mappers, eg: strings, urls, elements, arrays etc -export const DetailRow = ({ title, info, details, dataTestId }: DetailsRowProps): React.ReactElement => ( -
-
- {title} - {info && } -
-
- {details.map((detail, idx) => ( - - {typeof detail === 'string' && detail} - {typeof detail === 'object' && - (detail.length === 2 ? : detail)} - - ))} -
-
-); diff --git a/packages/core/src/ui/components/ActivityDetail/components/DetailRowSubitems.tsx b/packages/core/src/ui/components/ActivityDetail/components/DetailRowSubitems.tsx deleted file mode 100644 index 3adf72383..000000000 --- a/packages/core/src/ui/components/ActivityDetail/components/DetailRowSubitems.tsx +++ /dev/null @@ -1,16 +0,0 @@ -import React from 'react'; -import styles from './DetailRow.module.scss'; - -export interface DetailRowSubitems { - item: string; - subitem: string; - dataTestId?: string; -} -export const DetailRowSubitems = ({ item, subitem, dataTestId }: DetailRowSubitems): React.ReactElement => ( -
- {item} - - {subitem} - -
-); diff --git a/packages/core/src/ui/components/ActivityDetail/components/DetailRows.tsx b/packages/core/src/ui/components/ActivityDetail/components/DetailRows.tsx deleted file mode 100644 index 74ac64329..000000000 --- a/packages/core/src/ui/components/ActivityDetail/components/DetailRows.tsx +++ /dev/null @@ -1,47 +0,0 @@ -import React from 'react'; -import cn from 'classnames'; -import { DetailRow } from './DetailRow'; -import { TxDetails } from '../types'; -import { TranslationsFor } from '@src/ui/utils/types'; -import styles from '../TransactionInputOutput.module.scss'; -import { Text } from '@lace/ui'; - -type DetailRowsProps = { - list: TxDetails; - testId: string; - translations: T extends string ? TranslationsFor : never; -}; - -export const DetailRows = function DetailRows({ - list, - testId, - translations -}: DetailRowsProps): React.ReactElement { - return ( - <> - {list?.map((item, index) => - 'title' in item ? ( - - ) : ( - <> -
0 })} - > - - {translations[item.header]} - -
- - - ) - )} - - ); -}; diff --git a/packages/core/src/ui/components/ActivityDetail/components/InfoItem.tsx b/packages/core/src/ui/components/ActivityDetail/components/InfoItem.tsx deleted file mode 100644 index 143510eab..000000000 --- a/packages/core/src/ui/components/ActivityDetail/components/InfoItem.tsx +++ /dev/null @@ -1,19 +0,0 @@ -import React from 'react'; -import { InfoCircleOutlined } from '@ant-design/icons'; -import { Tooltip } from 'antd'; - -import { ReactComponent as Info } from '../../../assets/icons/info-icon.component.svg'; - -export interface InfoItemProps { - title: string; - dataTestId?: string; -} -export const InfoItem = ({ title, dataTestId = '' }: InfoItemProps): React.ReactElement => ( - - {Info ? ( - - ) : ( - - )} - -); diff --git a/packages/core/src/ui/components/ActivityDetail/components/TxDetailsCertificates/CertificateView.tsx b/packages/core/src/ui/components/ActivityDetail/components/TxDetailsCertificates/CertificateView.tsx new file mode 100644 index 000000000..fb87c1150 --- /dev/null +++ b/packages/core/src/ui/components/ActivityDetail/components/TxDetailsCertificates/CertificateView.tsx @@ -0,0 +1,154 @@ +/* eslint-disable complexity */ +import React from 'react'; +import { Wallet } from '@lace/cardano'; +import { ConfirmStakeRegistrationDelegation } from '@src/ui/components/ConfirmStakeRegistrationDelegation'; +import { ConfirmStakeVoteDelegation } from '@src/ui/components/ConfirmStakeVoteDelegation'; +import { ConfirmStakeVoteRegistrationDelegation } from '@src/ui/components/ConfirmStakeVoteRegistrationDelegation'; +import { ConfirmVoteRegistrationDelegation } from '@src/ui/components/ConfirmVoteRegistrationDelegation'; +import { ConfirmDRepRegistration } from '@src/ui/components/ConfirmDRepRegistration'; +import { ConfirmDRepRetirement } from '@src/ui/components/ConfirmDRepRetirement'; +import { ConfirmDRepUpdate } from '@src/ui/components/ConfirmDRepUpdate'; +import { ConfirmVoteDelegation } from '@src/ui/components/ConfirmVoteDelegation'; +import { AuthorizeCommitteeCertificate } from '@src/ui/components/AuthorizeCommitteeCertificate'; +import { ResignCommitteeCertificate } from '@src/ui/components/ResignCommitteeCertificate'; + +interface CertificateViewProps { + chainNetworkId: Wallet.Cardano.NetworkId; + certificate: Wallet.Cardano.Certificate; + cardanoCoin: Wallet.CoinId; +} + +const { CertificateType, RewardAddress } = Wallet.Cardano; + +export const CertificateView = ({ + certificate, + chainNetworkId, + cardanoCoin +}: CertificateViewProps): React.ReactElement => { + switch (certificate.__typename) { + case CertificateType.StakeVoteDelegation: + return ( + + ); + case CertificateType.StakeRegistrationDelegation: + return ( + + ); + case CertificateType.StakeVoteRegistrationDelegation: + return ( + + ); + case CertificateType.VoteRegistrationDelegation: + return ( + + ); + case CertificateType.RegisterDelegateRepresentative: + return ( + + ); + case CertificateType.UnregisterDelegateRepresentative: + return ( + + ); + case CertificateType.UpdateDelegateRepresentative: + return ( + + ); + case CertificateType.VoteDelegation: + return ( + + ); + case CertificateType.AuthorizeCommitteeHot: + return ( + + ); + case CertificateType.ResignCommitteeCold: + return ( + + ); + default: + throw new Error(`Not supported certificate: ${certificate.__typename}`); + } +}; diff --git a/packages/core/src/ui/components/ActivityDetail/components/TxDetailsCertificates/TxDetailsCertificates.module.scss b/packages/core/src/ui/components/ActivityDetail/components/TxDetailsCertificates/TxDetailsCertificates.module.scss new file mode 100644 index 000000000..add3b802a --- /dev/null +++ b/packages/core/src/ui/components/ActivityDetail/components/TxDetailsCertificates/TxDetailsCertificates.module.scss @@ -0,0 +1,8 @@ +@import '../../../../styles/theme.scss'; +@import '../../../../../../../common/src/ui/styles/abstracts/typography'; + +.devider { + margin-top: 12px; + padding-top: 12px; + border-top: 1px solid var(--light-mode-light-grey-plus, var(--dark-mode-mid-grey)); +} \ No newline at end of file diff --git a/packages/core/src/ui/components/ActivityDetail/components/TxDetailsCertificates/TxDetailsCertificates.tsx b/packages/core/src/ui/components/ActivityDetail/components/TxDetailsCertificates/TxDetailsCertificates.tsx new file mode 100644 index 000000000..f908400d1 --- /dev/null +++ b/packages/core/src/ui/components/ActivityDetail/components/TxDetailsCertificates/TxDetailsCertificates.tsx @@ -0,0 +1,37 @@ +import { Wallet } from '@lace/cardano'; +import React from 'react'; +import { TxDetailsGroup } from '../../TxDetailsGroup'; +import { CertificateView } from './CertificateView'; +import { useTranslation } from 'react-i18next'; +import classNames from 'classnames'; +import { Box } from '@lace/ui'; +import styles from './TxDetailsCertificates.module.scss'; + +interface TxDetailsCertificatesProps { + chainNetworkId: Wallet.Cardano.NetworkId; + certificates: Wallet.Cardano.Certificate[]; + cardanoCoin: Wallet.CoinId; +} + +export const TxDetailsCertificates = ({ + certificates, + chainNetworkId, + cardanoCoin +}: TxDetailsCertificatesProps): React.ReactElement => { + const { t } = useTranslation(); + + return ( + + {certificates.map((cert, index) => ( + 0 + })} + key={`${cert.__typename}_${index}`} + > + + + ))} + + ); +}; diff --git a/packages/core/src/ui/components/ActivityDetail/components/TxDetailsProposalProcedures/ProposalProcedureAction.tsx b/packages/core/src/ui/components/ActivityDetail/components/TxDetailsProposalProcedures/ProposalProcedureAction.tsx new file mode 100644 index 000000000..a7ed165e3 --- /dev/null +++ b/packages/core/src/ui/components/ActivityDetail/components/TxDetailsProposalProcedures/ProposalProcedureAction.tsx @@ -0,0 +1,132 @@ +import { Wallet } from '@lace/cardano'; +import { + HardForkInitiationAction, + InfoAction, + NewConstitutionAction, + NoConfidenceAction, + ParameterChangeAction, + TreasuryWithdrawalsAction, + UpdateCommitteeAction +} from '@src/ui/components/ProposalProcedures'; +import { + getHardForkInitiationActionViewData, + getInfoActionViewData, + getNewConstitutionActionViewData, + getNoConfidenceActionViewData, + getParameterChangeActionViewData, + getTreasuryWithdrawalsActionViewData, + getUpdateCommitteeActionViewData +} from '@src/ui/utils'; +import React from 'react'; + +interface ProposalProcedureActionProps { + proposalProcedure: Wallet.Cardano.ProposalProcedure; + cardanoCoin: Wallet.CoinId; + explorerBaseUrl: string; +} + +export const ProposalProcedureAction = ({ + proposalProcedure: { deposit, rewardAccount, anchor, governanceAction }, + cardanoCoin, + explorerBaseUrl +}: ProposalProcedureActionProps): React.ReactElement => { + switch (governanceAction.__typename) { + case Wallet.Cardano.GovernanceActionType.parameter_change_action: + return ( + + ); + case Wallet.Cardano.GovernanceActionType.hard_fork_initiation_action: + return ( + + ); + + case Wallet.Cardano.GovernanceActionType.info_action: + return ( + + ); + case Wallet.Cardano.GovernanceActionType.new_constitution: + return ( + + ); + case Wallet.Cardano.GovernanceActionType.no_confidence: + return ( + + ); + case Wallet.Cardano.GovernanceActionType.treasury_withdrawals_action: + return ( + + ); + case Wallet.Cardano.GovernanceActionType.update_committee: + return ( + + ); + default: + throw new Error('unsupported governanceAction'); + } +}; diff --git a/packages/core/src/ui/components/ActivityDetail/components/TxDetailsProposalProcedures/TxDetailsProposalProcedures.tsx b/packages/core/src/ui/components/ActivityDetail/components/TxDetailsProposalProcedures/TxDetailsProposalProcedures.tsx new file mode 100644 index 000000000..3007ea0af --- /dev/null +++ b/packages/core/src/ui/components/ActivityDetail/components/TxDetailsProposalProcedures/TxDetailsProposalProcedures.tsx @@ -0,0 +1,34 @@ +import React from 'react'; +import { Wallet } from '@lace/cardano'; +import { useTranslation } from 'react-i18next'; +import { ProposalProcedureAction } from './ProposalProcedureAction'; +import { TxDetailsGroup } from '../../TxDetailsGroup'; + +interface TxDetailsProposalProceduresProps { + proposalProcedures: Wallet.Cardano.ProposalProcedure[]; + cardanoCoin: Wallet.CoinId; + explorerBaseUrl: string; +} + +export const TxDetailsProposalProcedures = ({ + proposalProcedures, + cardanoCoin, + explorerBaseUrl +}: TxDetailsProposalProceduresProps): React.ReactElement => { + const { t } = useTranslation(); + + return ( + + <> + {proposalProcedures.map((procedure) => ( + + ))} + + + ); +}; diff --git a/packages/core/src/ui/components/ActivityDetail/components/TxDetailsProposalProcedures/index.ts b/packages/core/src/ui/components/ActivityDetail/components/TxDetailsProposalProcedures/index.ts new file mode 100644 index 000000000..42669d039 --- /dev/null +++ b/packages/core/src/ui/components/ActivityDetail/components/TxDetailsProposalProcedures/index.ts @@ -0,0 +1 @@ +export { TxDetailsProposalProcedures } from './TxDetailsProposalProcedures'; diff --git a/packages/core/src/ui/components/ActivityDetail/components/TxDetailsVotingProcedures.tsx b/packages/core/src/ui/components/ActivityDetail/components/TxDetailsVotingProcedures.tsx new file mode 100644 index 000000000..064bb642a --- /dev/null +++ b/packages/core/src/ui/components/ActivityDetail/components/TxDetailsVotingProcedures.tsx @@ -0,0 +1,27 @@ +import React from 'react'; +import { Wallet } from '@lace/cardano'; +import { VotingProcedures } from '../../VotingProcedures'; +import { TxDetailsGroup } from '../TxDetailsGroup'; +import { useTranslation } from 'react-i18next'; + +interface TxDetailsVotingProceduresProps { + explorerBaseUrl: string; + votingProcedures: Wallet.Cardano.VotingProcedures; +} + +export const TxDetailsVotingProcedures = ({ + votingProcedures, + explorerBaseUrl +}: TxDetailsVotingProceduresProps): React.ReactElement => { + const { t } = useTranslation(); + + return ( + + + Wallet.util.mapVotingProcedureToView(votingProcedure, explorerBaseUrl) + )} + /> + + ); +}; diff --git a/packages/core/src/ui/components/ActivityDetail/components/index.ts b/packages/core/src/ui/components/ActivityDetail/components/index.ts deleted file mode 100644 index c470084f1..000000000 --- a/packages/core/src/ui/components/ActivityDetail/components/index.ts +++ /dev/null @@ -1 +0,0 @@ -export * from './DetailRows'; diff --git a/packages/core/src/ui/components/AuthorizeCommitteeCertificate/AuthorizeCommitteeCertificate.tsx b/packages/core/src/ui/components/AuthorizeCommitteeCertificate/AuthorizeCommitteeCertificate.tsx new file mode 100644 index 000000000..9cddc67f3 --- /dev/null +++ b/packages/core/src/ui/components/AuthorizeCommitteeCertificate/AuthorizeCommitteeCertificate.tsx @@ -0,0 +1,53 @@ +import React from 'react'; +import { Cell, Grid, TransactionSummary } from '@lace/ui'; +import { useTranslation } from 'react-i18next'; + +interface Translations { + labels: { + hotCredential: string; + coldCredential: string; + }; +} +interface Props { + metadata: { + hotCredential: string; + coldCredential: string; + }; +} + +export const AuthorizeCommitteeCertificate = ({ metadata }: Props): JSX.Element => { + const { t } = useTranslation(); + + const translations: Translations = { + labels: { + hotCredential: t('core.activityDetails.certificateTitles.hotCredential'), + coldCredential: t('core.activityDetails.certificateTitles.coldCredential') + } + }; + + return ( + + + + + + + + + + + + ); +}; diff --git a/packages/core/src/ui/components/AuthorizeCommitteeCertificate/index.ts b/packages/core/src/ui/components/AuthorizeCommitteeCertificate/index.ts new file mode 100644 index 000000000..0a26dff18 --- /dev/null +++ b/packages/core/src/ui/components/AuthorizeCommitteeCertificate/index.ts @@ -0,0 +1 @@ +export { AuthorizeCommitteeCertificate } from './AuthorizeCommitteeCertificate'; diff --git a/packages/core/src/ui/components/ConfirmDRepRegistration/ConfirmDRepRegistration.stories.tsx b/packages/core/src/ui/components/ConfirmDRepRegistration/ConfirmDRepRegistration.stories.tsx index cab80863c..99c00aa9e 100644 --- a/packages/core/src/ui/components/ConfirmDRepRegistration/ConfirmDRepRegistration.stories.tsx +++ b/packages/core/src/ui/components/ConfirmDRepRegistration/ConfirmDRepRegistration.stories.tsx @@ -29,20 +29,6 @@ export default meta; type Story = StoryObj; const data: ComponentProps = { - dappInfo: { - logo: 'https://cdn.mint.handle.me/favicon.png', - name: 'Mint', - url: 'https://preprod.mint.handle.me' - }, - translations: { - labels: { - depositPaid: 'Deposit paid', - drepId: 'DRep ID', - hash: 'Hash', - url: 'URL' - }, - metadata: 'Metadata' - }, metadata: { depositPaid: '0.35 ADA', drepId: '65ge6g54g5dd5', @@ -56,9 +42,3 @@ export const Overview: Story = { ...data } }; -export const WithError: Story = { - args: { - ...data, - errorMessage: 'Something went wrong' - } -}; diff --git a/packages/core/src/ui/components/ConfirmDRepRegistration/ConfirmDRepRegistration.tsx b/packages/core/src/ui/components/ConfirmDRepRegistration/ConfirmDRepRegistration.tsx index 644b457fe..ea3e792ae 100644 --- a/packages/core/src/ui/components/ConfirmDRepRegistration/ConfirmDRepRegistration.tsx +++ b/packages/core/src/ui/components/ConfirmDRepRegistration/ConfirmDRepRegistration.tsx @@ -1,19 +1,16 @@ import React from 'react'; -import { Box, Cell, Grid, TransactionSummary, Flex } from '@lace/ui'; -import { DappInfo, DappInfoProps } from '../DappInfo'; -import { ErrorPane } from '@lace/common'; -interface Props { - dappInfo: Omit; - errorMessage?: string; - translations: { - labels: { - url: string; - hash: string; - drepId: string; - depositPaid: string; - }; - metadata: string; +import { Cell, Grid, TransactionSummary } from '@lace/ui'; +import { useTranslation } from 'react-i18next'; + +interface Translations { + labels: { + url: string; + hash: string; + drepId: string; + depositPaid: string; }; +} +interface Props { metadata: { url: string; hash: string; @@ -22,19 +19,26 @@ interface Props { }; } -export const ConfirmDRepRegistration = ({ dappInfo, errorMessage, translations, metadata }: Props): JSX.Element => ( - - - - - {errorMessage && ( - - - - )} +export const ConfirmDRepRegistration = ({ metadata }: Props): JSX.Element => { + const { t } = useTranslation(); + + const translations: Translations = { + labels: { + depositPaid: t('core.DRepRegistration.depositPaid'), + drepId: t('core.DRepRegistration.drepId'), + hash: t('core.DRepRegistration.hash'), + url: t('core.DRepRegistration.url') + } + }; + + return ( - + {metadata.url && ( @@ -61,5 +65,5 @@ export const ConfirmDRepRegistration = ({ dappInfo, errorMessage, translations, /> - -); + ); +}; diff --git a/packages/core/src/ui/components/ConfirmDRepRetirement/ConfirmDRepRetirement.stories.tsx b/packages/core/src/ui/components/ConfirmDRepRetirement/ConfirmDRepRetirement.stories.tsx index 9957bf2a9..99d354f0a 100644 --- a/packages/core/src/ui/components/ConfirmDRepRetirement/ConfirmDRepRetirement.stories.tsx +++ b/packages/core/src/ui/components/ConfirmDRepRetirement/ConfirmDRepRetirement.stories.tsx @@ -29,18 +29,6 @@ export default meta; type Story = StoryObj; const data: ComponentProps = { - dappInfo: { - logo: 'https://cdn.mint.handle.me/favicon.png', - name: 'Mint', - url: 'https://preprod.mint.handle.me' - }, - translations: { - labels: { - depositReturned: 'Deposit paid', - drepId: 'DRep ID' - }, - metadata: 'Metadata' - }, metadata: { depositReturned: '0.35 ADA', drepId: '65ge6g54g5dd5' @@ -52,9 +40,3 @@ export const Overview: Story = { ...data } }; -export const WithError: Story = { - args: { - ...data, - errorMessage: 'Something went wrong' - } -}; diff --git a/packages/core/src/ui/components/ConfirmDRepRetirement/ConfirmDRepRetirement.tsx b/packages/core/src/ui/components/ConfirmDRepRetirement/ConfirmDRepRetirement.tsx index 59219813a..b51b34523 100644 --- a/packages/core/src/ui/components/ConfirmDRepRetirement/ConfirmDRepRetirement.tsx +++ b/packages/core/src/ui/components/ConfirmDRepRetirement/ConfirmDRepRetirement.tsx @@ -1,37 +1,32 @@ import React from 'react'; -import { Box, Cell, Grid, TransactionSummary, Flex } from '@lace/ui'; -import { DappInfo, DappInfoProps } from '../DappInfo'; -import { ErrorPane } from '@lace/common'; +import { Cell, Grid, TransactionSummary } from '@lace/ui'; +import { useTranslation } from 'react-i18next'; interface Props { - dappInfo: Omit; - errorMessage?: string; - translations: { - labels: { - drepId: string; - depositReturned: string; - }; - metadata: string; - }; metadata: { drepId: string; depositReturned: string; }; } -export const ConfirmDRepRetirement = ({ dappInfo, errorMessage, translations, metadata }: Props): JSX.Element => ( - - - - - {errorMessage && ( - - - - )} +export const ConfirmDRepRetirement = ({ metadata }: Props): JSX.Element => { + const { t } = useTranslation(); + + const translations = { + labels: { + depositReturned: t('core.DRepRetirement.depositReturned'), + drepId: t('core.DRepRetirement.drepId') + } + }; + + return ( - + - -); + ); +}; diff --git a/packages/core/src/ui/components/ConfirmDRepUpdate/ConfirmDRepUpdate.stories.tsx b/packages/core/src/ui/components/ConfirmDRepUpdate/ConfirmDRepUpdate.stories.tsx index 2d136f641..436efbf83 100644 --- a/packages/core/src/ui/components/ConfirmDRepUpdate/ConfirmDRepUpdate.stories.tsx +++ b/packages/core/src/ui/components/ConfirmDRepUpdate/ConfirmDRepUpdate.stories.tsx @@ -29,19 +29,6 @@ export default meta; type Story = StoryObj; const data: ComponentProps = { - dappInfo: { - logo: 'https://cdn.mint.handle.me/favicon.png', - name: 'Mint', - url: 'https://preprod.mint.handle.me' - }, - translations: { - labels: { - drepId: 'DRep ID', - hash: 'Hash', - url: 'URL' - }, - metadata: 'Metadata' - }, metadata: { drepId: '65ge6g54g5dd5', hash: '9bba8233cdd086f0325daba465d568a88970d42536f9e71e92a80d5922ded885', @@ -63,10 +50,3 @@ export const Empty: Story = { } } }; - -export const WithError: Story = { - args: { - ...data, - errorMessage: 'Something went wrong' - } -}; diff --git a/packages/core/src/ui/components/ConfirmDRepUpdate/ConfirmDRepUpdate.tsx b/packages/core/src/ui/components/ConfirmDRepUpdate/ConfirmDRepUpdate.tsx index e86ee2b77..20d1961e6 100644 --- a/packages/core/src/ui/components/ConfirmDRepUpdate/ConfirmDRepUpdate.tsx +++ b/packages/core/src/ui/components/ConfirmDRepUpdate/ConfirmDRepUpdate.tsx @@ -1,19 +1,8 @@ import React from 'react'; -import { Box, Cell, Grid, TransactionSummary, Flex } from '@lace/ui'; -import { DappInfo, DappInfoProps } from '../DappInfo'; -import { ErrorPane } from '@lace/common'; +import { Cell, Grid, TransactionSummary } from '@lace/ui'; +import { useTranslation } from 'react-i18next'; interface Props { - dappInfo: Omit; - errorMessage?: string; - translations: { - labels: { - url: string; - hash: string; - drepId: string; - }; - metadata: string; - }; metadata: { url?: string; hash?: string; @@ -21,19 +10,26 @@ interface Props { }; } -export const ConfirmDRepUpdate = ({ dappInfo, errorMessage, translations, metadata }: Props): JSX.Element => ( - - - - - {errorMessage && ( - - - - )} +export const ConfirmDRepUpdate = ({ metadata }: Props): JSX.Element => { + const { t } = useTranslation(); + + const translations = { + metadata: t('core.DRepUpdate.metadata'), + labels: { + drepId: t('core.DRepUpdate.drepId'), + hash: t('core.DRepUpdate.hash'), + url: t('core.DRepUpdate.url') + } + }; + + return ( - + {metadata.url && ( @@ -53,5 +49,5 @@ export const ConfirmDRepUpdate = ({ dappInfo, errorMessage, translations, metada /> - -); + ); +}; diff --git a/packages/core/src/ui/components/ConfirmStakeRegistrationDelegation/ConfirmStakeRegistrationDelegation.stories.tsx b/packages/core/src/ui/components/ConfirmStakeRegistrationDelegation/ConfirmStakeRegistrationDelegation.stories.tsx index 86c53affd..6c307f1fb 100644 --- a/packages/core/src/ui/components/ConfirmStakeRegistrationDelegation/ConfirmStakeRegistrationDelegation.stories.tsx +++ b/packages/core/src/ui/components/ConfirmStakeRegistrationDelegation/ConfirmStakeRegistrationDelegation.stories.tsx @@ -29,19 +29,6 @@ export default meta; type Story = StoryObj; const data: ComponentProps = { - dappInfo: { - logo: 'https://cdn.mint.handle.me/favicon.png', - name: 'Mint', - url: 'https://preprod.mint.handle.me' - }, - translations: { - labels: { - stakeKeyHash: 'Stake key hash', - poolId: 'Pool Id', - depositPaid: 'Deposit paid' - }, - metadata: 'Metadata' - }, metadata: { stakeKeyHash: '13cf55d175ea848b87deb3e914febd7e028e2bf6534475d52fb9c3d0', poolId: 'pool1zuevzm3xlrhmwjw87ec38mzs02tlkwec9wxpgafcaykmwg7efhh', @@ -54,9 +41,3 @@ export const Overview: Story = { ...data } }; -export const WithError: Story = { - args: { - ...data, - errorMessage: 'Something went wrong' - } -}; diff --git a/packages/core/src/ui/components/ConfirmStakeRegistrationDelegation/ConfirmStakeRegistrationDelegation.tsx b/packages/core/src/ui/components/ConfirmStakeRegistrationDelegation/ConfirmStakeRegistrationDelegation.tsx index ada22bfaf..84ee2c30b 100644 --- a/packages/core/src/ui/components/ConfirmStakeRegistrationDelegation/ConfirmStakeRegistrationDelegation.tsx +++ b/packages/core/src/ui/components/ConfirmStakeRegistrationDelegation/ConfirmStakeRegistrationDelegation.tsx @@ -1,19 +1,8 @@ import React from 'react'; -import { Box, Cell, Grid, TransactionSummary, Flex } from '@lace/ui'; -import { DappInfo, DappInfoProps } from '../DappInfo'; -import { ErrorPane } from '@lace/common'; +import { Cell, Grid, TransactionSummary, Flex } from '@lace/ui'; +import { useTranslation } from 'react-i18next'; interface Props { - dappInfo: Omit; - errorMessage?: string; - translations: { - labels: { - poolId: string; - stakeKeyHash: string; - depositPaid: string; - }; - metadata: string; - }; metadata: { poolId: string; stakeKeyHash: string; @@ -21,34 +10,36 @@ interface Props { }; } -export const ConfirmStakeRegistrationDelegation = ({ - dappInfo, - errorMessage, - translations, - metadata -}: Props): JSX.Element => ( - - - - - {errorMessage && ( - - - - )} - - - - - - - - - - - - - - - -); +export const ConfirmStakeRegistrationDelegation = ({ metadata }: Props): JSX.Element => { + const { t } = useTranslation(); + const translations = { + labels: { + poolId: t('core.StakeRegistrationDelegation.poolId'), + stakeKeyHash: t('core.StakeRegistrationDelegation.stakeKeyHash'), + depositPaid: t('core.StakeRegistrationDelegation.depositPaid') + } + }; + + return ( + + + + + + + + + + + + + + + + + ); +}; diff --git a/packages/core/src/ui/components/ConfirmStakeVoteDelegation/ConfirmStakeVoteDelegation.stories.tsx b/packages/core/src/ui/components/ConfirmStakeVoteDelegation/ConfirmStakeVoteDelegation.stories.tsx index 0693e3c81..c88b0c83d 100644 --- a/packages/core/src/ui/components/ConfirmStakeVoteDelegation/ConfirmStakeVoteDelegation.stories.tsx +++ b/packages/core/src/ui/components/ConfirmStakeVoteDelegation/ConfirmStakeVoteDelegation.stories.tsx @@ -29,22 +29,6 @@ export default meta; type Story = StoryObj; const data: ComponentProps = { - dappInfo: { - logo: 'https://cdn.mint.handle.me/favicon.png', - name: 'Mint', - url: 'https://preprod.mint.handle.me' - }, - translations: { - labels: { - drepId: 'DRep ID', - alwaysAbstain: 'Abstain', - alwaysNoConfidence: 'No Confidence', - stakeKeyHash: 'Stake key hash', - poolId: 'Pool Id' - }, - option: 'Yes', - metadata: 'Metadata' - }, metadata: { drepId: 'drep1ruvgm0auzdplfn7g2jf3kcnpnw5mlhwxaxj8crag8h6t2ye9y9g', alwaysAbstain: false, @@ -59,12 +43,6 @@ export const Overview: Story = { ...data } }; -export const WithError: Story = { - args: { - ...data, - errorMessage: 'Something went wrong' - } -}; export const WithAbstain: Story = { args: { diff --git a/packages/core/src/ui/components/ConfirmStakeVoteDelegation/ConfirmStakeVoteDelegation.tsx b/packages/core/src/ui/components/ConfirmStakeVoteDelegation/ConfirmStakeVoteDelegation.tsx index 77cfd3243..37caa3792 100644 --- a/packages/core/src/ui/components/ConfirmStakeVoteDelegation/ConfirmStakeVoteDelegation.tsx +++ b/packages/core/src/ui/components/ConfirmStakeVoteDelegation/ConfirmStakeVoteDelegation.tsx @@ -1,22 +1,8 @@ import React from 'react'; -import { Box, Cell, Grid, TransactionSummary, Flex } from '@lace/ui'; -import { DappInfo, DappInfoProps } from '../DappInfo'; -import { ErrorPane } from '@lace/common'; +import { Cell, Grid, TransactionSummary, Flex } from '@lace/ui'; +import { useTranslation } from 'react-i18next'; interface Props { - dappInfo: Omit; - errorMessage?: string; - translations: { - labels: { - poolId: string; - stakeKeyHash: string; - drepId: string; - alwaysAbstain: string; - alwaysNoConfidence: string; - }; - option: string; - metadata: string; - }; metadata: { poolId: string; stakeKeyHash: string; @@ -26,41 +12,52 @@ interface Props { }; } -export const ConfirmStakeVoteDelegation = ({ dappInfo, errorMessage, translations, metadata }: Props): JSX.Element => ( - - - - - {errorMessage && ( - - - - )} - - - - - {metadata.drepId && ( +export const ConfirmStakeVoteDelegation = ({ metadata }: Props): JSX.Element => { + const { t } = useTranslation(); + + const translations = { + option: t('core.StakeVoteDelegation.option'), + labels: { + poolId: t('core.StakeVoteDelegation.poolId'), + stakeKeyHash: t('core.StakeVoteDelegation.stakeKeyHash'), + drepId: t('core.StakeVoteDelegation.drepId'), + alwaysAbstain: t('core.StakeVoteDelegation.alwaysAbstain'), + alwaysNoConfidence: t('core.StakeVoteDelegation.alwaysNoConfidence') + } + }; + + return ( + + - + - )} - {metadata.alwaysAbstain && ( + {metadata.drepId && ( + + + + )} + {metadata.alwaysAbstain && ( + + + + )} + {metadata.alwaysNoConfidence && ( + + + + )} - + - )} - {metadata.alwaysNoConfidence && ( - + - )} - - - - - - - - -); + + + ); +}; diff --git a/packages/core/src/ui/components/ConfirmStakeVoteRegistrationDelegation/ConfirmStakeVoteRegistrationDelegation.stories.tsx b/packages/core/src/ui/components/ConfirmStakeVoteRegistrationDelegation/ConfirmStakeVoteRegistrationDelegation.stories.tsx index 309d840eb..075c105c7 100644 --- a/packages/core/src/ui/components/ConfirmStakeVoteRegistrationDelegation/ConfirmStakeVoteRegistrationDelegation.stories.tsx +++ b/packages/core/src/ui/components/ConfirmStakeVoteRegistrationDelegation/ConfirmStakeVoteRegistrationDelegation.stories.tsx @@ -29,23 +29,6 @@ export default meta; type Story = StoryObj; const data: ComponentProps = { - dappInfo: { - logo: 'https://cdn.mint.handle.me/favicon.png', - name: 'Mint', - url: 'https://preprod.mint.handle.me' - }, - translations: { - labels: { - drepId: 'DRep ID', - alwaysAbstain: 'Abstain', - alwaysNoConfidence: 'No Confidence', - stakeKeyHash: 'Stake key hash', - poolId: 'Pool Id', - depositPaid: 'Deposit paid' - }, - option: 'Yes', - metadata: 'Metadata' - }, metadata: { drepId: 'drep1ruvgm0auzdplfn7g2jf3kcnpnw5mlhwxaxj8crag8h6t2ye9y9g', alwaysAbstain: false, @@ -61,12 +44,6 @@ export const Overview: Story = { ...data } }; -export const WithError: Story = { - args: { - ...data, - errorMessage: 'Something went wrong' - } -}; export const WithAbstain: Story = { args: { diff --git a/packages/core/src/ui/components/ConfirmStakeVoteRegistrationDelegation/ConfirmStakeVoteRegistrationDelegation.tsx b/packages/core/src/ui/components/ConfirmStakeVoteRegistrationDelegation/ConfirmStakeVoteRegistrationDelegation.tsx index a8e0789e4..07216d68c 100644 --- a/packages/core/src/ui/components/ConfirmStakeVoteRegistrationDelegation/ConfirmStakeVoteRegistrationDelegation.tsx +++ b/packages/core/src/ui/components/ConfirmStakeVoteRegistrationDelegation/ConfirmStakeVoteRegistrationDelegation.tsx @@ -1,23 +1,8 @@ import React from 'react'; -import { Box, Cell, Grid, TransactionSummary, Flex } from '@lace/ui'; -import { DappInfo, DappInfoProps } from '../DappInfo'; -import { ErrorPane } from '@lace/common'; +import { Cell, Grid, TransactionSummary, Flex } from '@lace/ui'; +import { useTranslation } from 'react-i18next'; interface Props { - dappInfo: Omit; - errorMessage?: string; - translations: { - labels: { - poolId: string; - stakeKeyHash: string; - drepId: string; - alwaysAbstain: string; - alwaysNoConfidence: string; - depositPaid: string; - }; - option: string; - metadata: string; - }; metadata: { poolId: string; stakeKeyHash: string; @@ -28,49 +13,56 @@ interface Props { }; } -export const ConfirmStakeVoteRegistrationDelegation = ({ - dappInfo, - errorMessage, - translations, - metadata -}: Props): JSX.Element => ( - - - - - {errorMessage && ( - - - - )} - - - - - {metadata.drepId && ( +export const ConfirmStakeVoteRegistrationDelegation = ({ metadata }: Props): JSX.Element => { + const { t } = useTranslation(); + + const translations = { + option: t('core.StakeVoteDelegationRegistration.option'), + labels: { + poolId: t('core.StakeVoteDelegationRegistration.poolId'), + stakeKeyHash: t('core.StakeVoteDelegationRegistration.stakeKeyHash'), + drepId: t('core.StakeVoteDelegationRegistration.drepId'), + alwaysAbstain: t('core.StakeVoteDelegationRegistration.alwaysAbstain'), + alwaysNoConfidence: t('core.StakeVoteDelegationRegistration.alwaysNoConfidence'), + depositPaid: t('core.StakeVoteDelegationRegistration.depositPaid') + } + }; + + return ( + + + + + + {metadata.drepId && ( + + + + )} + {metadata.alwaysAbstain && ( + + + + )} + {metadata.alwaysNoConfidence && ( + + + + )} - + - )} - {metadata.alwaysAbstain && ( - + - )} - {metadata.alwaysNoConfidence && ( - + - )} - - - - - - - - - - - -); + + + ); +}; diff --git a/packages/core/src/ui/components/ConfirmVoteDelegation/ConfirmVoteDelegation.stories.tsx b/packages/core/src/ui/components/ConfirmVoteDelegation/ConfirmVoteDelegation.stories.tsx index 2b0f7d96a..a9595d5b4 100644 --- a/packages/core/src/ui/components/ConfirmVoteDelegation/ConfirmVoteDelegation.stories.tsx +++ b/packages/core/src/ui/components/ConfirmVoteDelegation/ConfirmVoteDelegation.stories.tsx @@ -29,20 +29,6 @@ export default meta; type Story = StoryObj; const data: ComponentProps = { - dappInfo: { - logo: 'https://cdn.mint.handle.me/favicon.png', - name: 'Mint', - url: 'https://preprod.mint.handle.me' - }, - translations: { - labels: { - drepId: 'DRep ID', - alwaysAbstain: 'Abstain', - alwaysNoConfidence: 'No Confidence' - }, - option: 'Yes', - metadata: 'Metadata' - }, metadata: { drepId: 'drep1ruvgm0auzdplfn7g2jf3kcnpnw5mlhwxaxj8crag8h6t2ye9y9g', alwaysAbstain: false, @@ -55,12 +41,6 @@ export const Overview: Story = { ...data } }; -export const WithError: Story = { - args: { - ...data, - errorMessage: 'Something went wrong' - } -}; export const WithAbstain: Story = { args: { diff --git a/packages/core/src/ui/components/ConfirmVoteDelegation/ConfirmVoteDelegation.tsx b/packages/core/src/ui/components/ConfirmVoteDelegation/ConfirmVoteDelegation.tsx index 4eae2a274..fc013e785 100644 --- a/packages/core/src/ui/components/ConfirmVoteDelegation/ConfirmVoteDelegation.tsx +++ b/packages/core/src/ui/components/ConfirmVoteDelegation/ConfirmVoteDelegation.tsx @@ -1,20 +1,8 @@ import React from 'react'; -import { Box, Cell, Grid, TransactionSummary, Flex } from '@lace/ui'; -import { DappInfo, DappInfoProps } from '../DappInfo'; -import { ErrorPane } from '@lace/common'; +import { Cell, Grid, TransactionSummary } from '@lace/ui'; +import { useTranslation } from 'react-i18next'; interface Props { - dappInfo: Omit; - errorMessage?: string; - translations: { - labels: { - drepId: string; - alwaysAbstain: string; - alwaysNoConfidence: string; - }; - option: string; - metadata: string; - }; metadata: { drepId?: string; alwaysAbstain: boolean; @@ -22,19 +10,26 @@ interface Props { }; } -export const ConfirmVoteDelegation = ({ dappInfo, errorMessage, translations, metadata }: Props): JSX.Element => ( - - - - - {errorMessage && ( - - - - )} +export const ConfirmVoteDelegation = ({ metadata }: Props): JSX.Element => { + const { t } = useTranslation(); + const translations = { + metadata: t('core.VoteDelegation.metadata'), + option: t('core.VoteDelegation.option'), + labels: { + drepId: t('core.VoteDelegation.drepId'), + alwaysAbstain: t('core.VoteDelegation.alwaysAbstain'), + alwaysNoConfidence: t('core.VoteDelegation.alwaysNoConfidence') + } + }; + + return ( - + {metadata.drepId && ( @@ -64,5 +59,5 @@ export const ConfirmVoteDelegation = ({ dappInfo, errorMessage, translations, me )} - -); + ); +}; diff --git a/packages/core/src/ui/components/ConfirmVoteRegistrationDelegation/ConfirmVoteRegistrationDelegation.stories.tsx b/packages/core/src/ui/components/ConfirmVoteRegistrationDelegation/ConfirmVoteRegistrationDelegation.stories.tsx index c6ece5b76..d7fad93ad 100644 --- a/packages/core/src/ui/components/ConfirmVoteRegistrationDelegation/ConfirmVoteRegistrationDelegation.stories.tsx +++ b/packages/core/src/ui/components/ConfirmVoteRegistrationDelegation/ConfirmVoteRegistrationDelegation.stories.tsx @@ -29,22 +29,6 @@ export default meta; type Story = StoryObj; const data: ComponentProps = { - dappInfo: { - logo: 'https://cdn.mint.handle.me/favicon.png', - name: 'Mint', - url: 'https://preprod.mint.handle.me' - }, - translations: { - labels: { - drepId: 'DRep ID', - alwaysAbstain: 'Abstain', - alwaysNoConfidence: 'No Confidence', - depositPaid: 'Deposit paid', - stakeKeyHash: 'Stake key hash' - }, - option: 'Yes', - metadata: 'Metadata' - }, metadata: { drepId: 'drep1ruvgm0auzdplfn7g2jf3kcnpnw5mlhwxaxj8crag8h6t2ye9y9g', alwaysAbstain: false, @@ -59,12 +43,6 @@ export const Overview: Story = { ...data } }; -export const WithError: Story = { - args: { - ...data, - errorMessage: 'Something went wrong' - } -}; export const WithAbstain: Story = { args: { diff --git a/packages/core/src/ui/components/ConfirmVoteRegistrationDelegation/ConfirmVoteRegistrationDelegation.tsx b/packages/core/src/ui/components/ConfirmVoteRegistrationDelegation/ConfirmVoteRegistrationDelegation.tsx index 39f184e26..8fe46c5a3 100644 --- a/packages/core/src/ui/components/ConfirmVoteRegistrationDelegation/ConfirmVoteRegistrationDelegation.tsx +++ b/packages/core/src/ui/components/ConfirmVoteRegistrationDelegation/ConfirmVoteRegistrationDelegation.tsx @@ -1,22 +1,8 @@ import React from 'react'; -import { Box, Cell, Grid, TransactionSummary, Flex } from '@lace/ui'; -import { DappInfo, DappInfoProps } from '../DappInfo'; -import { ErrorPane } from '@lace/common'; +import { Cell, Grid, TransactionSummary } from '@lace/ui'; +import { useTranslation } from 'react-i18next'; interface Props { - dappInfo: Omit; - errorMessage?: string; - translations: { - labels: { - drepId: string; - alwaysAbstain: string; - alwaysNoConfidence: string; - stakeKeyHash: string; - depositPaid: string; - }; - option: string; - metadata: string; - }; metadata: { drepId?: string; alwaysAbstain: boolean; @@ -26,24 +12,27 @@ interface Props { }; } -export const ConfirmVoteRegistrationDelegation = ({ - dappInfo, - errorMessage, - translations, - metadata -}: Props): JSX.Element => ( - - - - - {errorMessage && ( - - - - )} +export const ConfirmVoteRegistrationDelegation = ({ metadata }: Props): JSX.Element => { + const { t } = useTranslation(); + const translations = { + option: t('core.VoteRegistrationDelegation.option'), + labels: { + drepId: t('core.VoteRegistrationDelegation.drepId'), + alwaysAbstain: t('core.VoteRegistrationDelegation.alwaysAbstain'), + alwaysNoConfidence: t('core.VoteRegistrationDelegation.alwaysNoConfidence'), + depositPaid: t('core.VoteRegistrationDelegation.depositPaid'), + stakeKeyHash: t('core.VoteRegistrationDelegation.stakeKeyHash') + } + }; + + return ( - + {metadata.drepId && ( @@ -67,5 +56,5 @@ export const ConfirmVoteRegistrationDelegation = ({ - -); + ); +}; diff --git a/packages/core/src/ui/components/DappTransaction/DappTransaction.tsx b/packages/core/src/ui/components/DappTransaction/DappTransaction.tsx index 4888f7986..2a5757ef0 100644 --- a/packages/core/src/ui/components/DappTransaction/DappTransaction.tsx +++ b/packages/core/src/ui/components/DappTransaction/DappTransaction.tsx @@ -86,17 +86,8 @@ const groupAddresses = (addresses: Map | { [Symbol.toPrimitive](hint: 'string'): string } -): string => { - const bytes = Uint8Array.from(Buffer.from(value, 'hex')); - const decoder = new TextDecoder('utf-8'); - // Decode the Uint8Array to a UTF-8 string - return decoder.decode(bytes); -}; - const getFallbackName = (asset: AssetInfoWithAmount) => - tryDecodeAsUtf8(asset.assetInfo.name) ? tryDecodeAsUtf8(asset.assetInfo.name) : asset.assetInfo.assetId; + Wallet.Cardano.AssetName.toUTF8(asset.assetInfo.name) || asset.assetInfo.assetId; const getAssetTokenName = (assetWithAmount: AssetInfoWithAmount) => { if (isNFT(assetWithAmount)) { diff --git a/packages/core/src/ui/components/ProposalProcedures/HardForkInitiationAction/HardForkInitiationAction.stories.tsx b/packages/core/src/ui/components/ProposalProcedures/HardForkInitiationAction/HardForkInitiationAction.stories.tsx index 61c09528c..ad069f724 100644 --- a/packages/core/src/ui/components/ProposalProcedures/HardForkInitiationAction/HardForkInitiationAction.stories.tsx +++ b/packages/core/src/ui/components/ProposalProcedures/HardForkInitiationAction/HardForkInitiationAction.stories.tsx @@ -29,14 +29,8 @@ export default meta; type Story = StoryObj; const data: ComponentProps = { - dappInfo: { - logo: 'https://cdn.mint.handle.me/favicon.png', - name: 'Mint', - url: 'https://preprod.mint.handle.me' - }, data: { txDetails: { - txType: 'Hard Fork Initiation', deposit: '2000', rewardAccount: 'stake1u89sasnfyjtmgk8ydqfv3fdl52f36x3djedfnzfc9rkgzrcss5vgr' }, @@ -56,31 +50,6 @@ const data: ComponentProps = { minor: '1', patch: '1' } - }, - translations: { - txDetails: { - title: 'Transaction Details', - txType: 'Transaction Type', - deposit: 'Deposit', - rewardAccount: 'Reward Account' - }, - procedure: { - anchor: { - hash: 'Anchor Hash', - url: 'Anchor URL' - }, - title: 'Procedure' - }, - actionId: { - title: 'Action ID', - index: 'Index', - txId: 'TX ID' - }, - protocolVersion: { - major: 'Protocol Version Major', - minor: 'Protocol Version Minor', - patch: 'Protocol Version Patch' - } } }; @@ -89,10 +58,3 @@ export const Overview: Story = { ...data } }; - -export const WithError: Story = { - args: { - ...data, - errorMessage: 'Something went wrong' - } -}; diff --git a/packages/core/src/ui/components/ProposalProcedures/HardForkInitiationAction/HardForkInitiationAction.tsx b/packages/core/src/ui/components/ProposalProcedures/HardForkInitiationAction/HardForkInitiationAction.tsx index 6a722f101..1971ca339 100644 --- a/packages/core/src/ui/components/ProposalProcedures/HardForkInitiationAction/HardForkInitiationAction.tsx +++ b/packages/core/src/ui/components/ProposalProcedures/HardForkInitiationAction/HardForkInitiationAction.tsx @@ -1,37 +1,54 @@ import React from 'react'; -import { Box, Grid, Flex, Divider, Metadata, Cell } from '@lace/ui'; -import { DappInfo, DappInfoProps } from '../../DappInfo'; -import { ErrorPane } from '@lace/common'; +import { Grid, Divider, Metadata, Cell } from '@lace/ui'; import * as Types from './HardForkInitiationActionTypes'; -import { TransactionDetails } from '../components/TransactionDetails'; +import { ProposalProcedureTransactionDetails } from '../components/ProposalProcedureTransactionDetails'; import { Procedure } from '../components/Procedure'; import { ActionId } from '../components/ActionId'; +import { useTranslation } from 'react-i18next'; export interface HardForkInitiationActionProps { - dappInfo: Omit; - errorMessage?: string; data: Types.Data; - translations: Types.Translations; } export const HardForkInitiationAction = ({ - dappInfo, - errorMessage, - data: { procedure, txDetails, actionId, protocolVersion }, - translations -}: HardForkInitiationActionProps): JSX.Element => ( - - - - - {errorMessage && ( - - - - )} + data: { procedure, txDetails, actionId, protocolVersion } +}: HardForkInitiationActionProps): JSX.Element => { + const { t } = useTranslation(); + const translations: Types.Translations = { + txDetails: { + title: t('core.ProposalProcedure.txDetails.title'), + txType: t('core.ProposalProcedure.txDetails.txType'), + deposit: t('core.ProposalProcedure.txDetails.deposit'), + rewardAccount: t('core.ProposalProcedure.txDetails.rewardAccount') + }, + procedure: { + title: t('core.ProposalProcedure.procedure.title'), + anchor: { + url: t('core.ProposalProcedure.procedure.anchor.url'), + hash: t('core.ProposalProcedure.procedure.anchor.hash') + } + }, + protocolVersion: { + major: t('core.ProposalProcedure.governanceAction.hardForkInitiation.protocolVersion.major'), + minor: t('core.ProposalProcedure.governanceAction.hardForkInitiation.protocolVersion.minor'), + patch: t('core.ProposalProcedure.governanceAction.hardForkInitiation.protocolVersion.patch') + }, + actionId: { + title: t('core.ProposalProcedure.governanceAction.actionId.title'), + index: t('core.ProposalProcedure.governanceAction.actionId.index'), + txId: t('core.ProposalProcedure.governanceAction.actionId.txId') + } + }; + + return ( {/* tx details section */} - + @@ -58,5 +75,5 @@ export const HardForkInitiationAction = ({ )} - -); + ); +}; diff --git a/packages/core/src/ui/components/ProposalProcedures/HardForkInitiationAction/HardForkInitiationActionTypes.ts b/packages/core/src/ui/components/ProposalProcedures/HardForkInitiationAction/HardForkInitiationActionTypes.ts index bd8ae61b7..1ca635e5f 100644 --- a/packages/core/src/ui/components/ProposalProcedures/HardForkInitiationAction/HardForkInitiationActionTypes.ts +++ b/packages/core/src/ui/components/ProposalProcedures/HardForkInitiationAction/HardForkInitiationActionTypes.ts @@ -1,6 +1,6 @@ import * as ProcedureTypes from '../components/ProcedureTypes'; import * as ActionIdTypes from '../components/ActionIdTypes'; -import * as TxDetailsTypes from '../components/TransactionDetailsTypes'; +import * as TxDetailsTypes from '../components/ProposalProcedureTransactionDetailsTypes'; export interface Data { txDetails: TxDetailsTypes.TxDetails; diff --git a/packages/core/src/ui/components/ProposalProcedures/InfoAction/InfoAction.stories.tsx b/packages/core/src/ui/components/ProposalProcedures/InfoAction/InfoAction.stories.tsx index 2dd07ef93..0edbb489a 100644 --- a/packages/core/src/ui/components/ProposalProcedures/InfoAction/InfoAction.stories.tsx +++ b/packages/core/src/ui/components/ProposalProcedures/InfoAction/InfoAction.stories.tsx @@ -29,15 +29,8 @@ export default meta; type Story = StoryObj; const data: ComponentProps = { - dappInfo: { - logo: 'https://cdn.mint.handle.me/favicon.png', - name: 'Mint', - url: 'https://preprod.mint.handle.me' - }, data: { - txDetails: { - txType: 'Info action' - }, + txDetails: {}, procedure: { anchor: { hash: '26bfdcc75a7f4d0cd8c71f0189bc5ca5ad2f4a3db6240c82b5a0edac7f9203e0', @@ -45,19 +38,6 @@ const data: ComponentProps = { txHashUrl: 'https://www.someurl.io' } } - }, - translations: { - txDetails: { - title: 'Transaction Details', - txType: 'Transaction Type' - }, - procedure: { - anchor: { - hash: 'Anchor Hash', - url: 'Anchor URL' - }, - title: 'Procedure' - } } }; @@ -66,10 +46,3 @@ export const Overview: Story = { ...data } }; - -export const WithError: Story = { - args: { - ...data, - errorMessage: 'Something went wrong' - } -}; diff --git a/packages/core/src/ui/components/ProposalProcedures/InfoAction/InfoAction.tsx b/packages/core/src/ui/components/ProposalProcedures/InfoAction/InfoAction.tsx index b84260bd9..bea0b2cb6 100644 --- a/packages/core/src/ui/components/ProposalProcedures/InfoAction/InfoAction.tsx +++ b/packages/core/src/ui/components/ProposalProcedures/InfoAction/InfoAction.tsx @@ -1,40 +1,45 @@ -import React from 'react'; -import { Box, Grid, Flex, Divider, Cell } from '@lace/ui'; -import { DappInfo, DappInfoProps } from '../../DappInfo'; -import { ErrorPane } from '@lace/common'; +import React, { useMemo } from 'react'; +import { Grid, Divider, Cell } from '@lace/ui'; import * as Types from './InfoActionTypes'; -import { TransactionDetails } from '../components/TransactionDetails'; +import { ProposalProcedureTransactionDetails } from '../components/ProposalProcedureTransactionDetails'; import { Procedure } from '../components/Procedure'; +import { useTranslation } from 'react-i18next'; export interface InfoActionProps { - dappInfo: Omit; - errorMessage?: string; data: Types.Data; - translations: Types.Translations; } -export const InfoAction = ({ - dappInfo, - errorMessage, - data: { procedure, txDetails }, - translations -}: InfoActionProps): JSX.Element => ( - - - - - {errorMessage && ( - - - - )} +export const InfoAction = ({ data: { procedure, txDetails } }: InfoActionProps): JSX.Element => { + const { t } = useTranslation(); + const translations = useMemo( + () => ({ + txDetails: { + title: t('core.ProposalProcedure.txDetails.title'), + txType: t('core.ProposalProcedure.txDetails.txType') + }, + procedure: { + title: t('core.ProposalProcedure.procedure.title'), + anchor: { + url: t('core.ProposalProcedure.procedure.anchor.url'), + hash: t('core.ProposalProcedure.procedure.anchor.hash') + } + } + }), + [t] + ); + return ( - + {/* procedure section */} - -); + ); +}; diff --git a/packages/core/src/ui/components/ProposalProcedures/InfoAction/InfoActionTypes.ts b/packages/core/src/ui/components/ProposalProcedures/InfoAction/InfoActionTypes.ts index 2f8853991..1006df470 100644 --- a/packages/core/src/ui/components/ProposalProcedures/InfoAction/InfoActionTypes.ts +++ b/packages/core/src/ui/components/ProposalProcedures/InfoAction/InfoActionTypes.ts @@ -1,5 +1,5 @@ import * as ProcedureTypes from '../components/ProcedureTypes'; -import * as TxDetailsTypes from '../components/TransactionDetailsTypes'; +import * as TxDetailsTypes from '../components/ProposalProcedureTransactionDetailsTypes'; export interface Data { txDetails: TxDetailsTypes.TxDetails; procedure: ProcedureTypes.Procedure; diff --git a/packages/core/src/ui/components/ProposalProcedures/NewConstitutionAction/NewConstitutionAction.stories.tsx b/packages/core/src/ui/components/ProposalProcedures/NewConstitutionAction/NewConstitutionAction.stories.tsx index b5ac821cc..6c426c16d 100644 --- a/packages/core/src/ui/components/ProposalProcedures/NewConstitutionAction/NewConstitutionAction.stories.tsx +++ b/packages/core/src/ui/components/ProposalProcedures/NewConstitutionAction/NewConstitutionAction.stories.tsx @@ -29,14 +29,8 @@ export default meta; type Story = StoryObj; const data: ComponentProps = { - dappInfo: { - logo: 'https://cdn.mint.handle.me/favicon.png', - name: 'Mint', - url: 'https://preprod.mint.handle.me' - }, data: { txDetails: { - txType: 'New Constitution', deposit: '2000', rewardAccount: 'stake1u89sasnfyjtmgk8ydqfv3fdl52f36x3djedfnzfc9rkgzrcss5vgr' }, @@ -58,34 +52,6 @@ const data: ComponentProps = { }, scriptHash: 'cb0ec2692497b458e46812c8a5bfa2931d1a2d965a99893828ec810f' } - }, - translations: { - txDetails: { - title: 'Transaction Details', - txType: 'Transaction Type', - deposit: 'Deposit', - rewardAccount: 'Reward Account' - }, - procedure: { - anchor: { - hash: 'Anchor Hash', - url: 'Anchor URL' - }, - title: 'Procedure' - }, - actionId: { - title: 'Action ID', - index: 'Index', - txId: 'TX ID' - }, - constitution: { - title: 'Constitution Details', - anchor: { - dataHash: 'Anchor Data Hash', - url: 'Anchor URL' - }, - scriptHash: 'Script Hash' - } } }; @@ -94,10 +60,3 @@ export const Overview: Story = { ...data } }; - -export const WithError: Story = { - args: { - ...data, - errorMessage: 'Something went wrong' - } -}; diff --git a/packages/core/src/ui/components/ProposalProcedures/NewConstitutionAction/NewConstitutionAction.tsx b/packages/core/src/ui/components/ProposalProcedures/NewConstitutionAction/NewConstitutionAction.tsx index 7fb710ab0..e4f684582 100644 --- a/packages/core/src/ui/components/ProposalProcedures/NewConstitutionAction/NewConstitutionAction.tsx +++ b/packages/core/src/ui/components/ProposalProcedures/NewConstitutionAction/NewConstitutionAction.tsx @@ -1,37 +1,59 @@ -import React from 'react'; -import { Box, Grid, Flex, Divider, Metadata, MetadataLink, Cell } from '@lace/ui'; -import { DappInfo, DappInfoProps } from '../../DappInfo'; -import { ErrorPane } from '@lace/common'; +import React, { useMemo } from 'react'; +import { Grid, Divider, Metadata, MetadataLink, Cell } from '@lace/ui'; import * as Types from './NewConstitutionActionTypes'; -import { TransactionDetails } from '../components/TransactionDetails'; +import { ProposalProcedureTransactionDetails } from '../components/ProposalProcedureTransactionDetails'; import { Procedure } from '../components/Procedure'; import { ActionId } from '../components/ActionId'; - +import { useTranslation } from 'react-i18next'; export interface NewConstitutionActionProps { - dappInfo: Omit; - errorMessage?: string; data: Types.Data; - translations: Types.Translations; } export const NewConstitutionAction = ({ - dappInfo, - errorMessage, - data: { txDetails, procedure, constitution, actionId }, - translations -}: NewConstitutionActionProps): JSX.Element => ( - - - - - {errorMessage && ( - - - - )} + data: { txDetails, procedure, constitution, actionId } +}: NewConstitutionActionProps): JSX.Element => { + const { t } = useTranslation(); + const translations = useMemo( + () => ({ + txDetails: { + title: t('core.ProposalProcedure.txDetails.title'), + txType: t('core.ProposalProcedure.txDetails.txType'), + deposit: t('core.ProposalProcedure.txDetails.deposit'), + rewardAccount: t('core.ProposalProcedure.txDetails.rewardAccount') + }, + procedure: { + title: t('core.ProposalProcedure.procedure.title'), + anchor: { + url: t('core.ProposalProcedure.procedure.anchor.url'), + hash: t('core.ProposalProcedure.procedure.anchor.hash') + } + }, + constitution: { + title: t('core.ProposalProcedure.governanceAction.newConstitutionAction.constitution.title'), + anchor: { + dataHash: t('core.ProposalProcedure.governanceAction.newConstitutionAction.constitution.anchor.dataHash'), + url: t('core.ProposalProcedure.governanceAction.newConstitutionAction.constitution.anchor.url') + }, + scriptHash: t('core.ProposalProcedure.governanceAction.newConstitutionAction.constitution.scriptHash') + }, + actionId: { + title: t('core.ProposalProcedure.governanceAction.actionId.title'), + index: t('core.ProposalProcedure.governanceAction.actionId.index'), + txId: t('core.ProposalProcedure.governanceAction.actionId.txId') + } + }), + [t] + ); + + return ( {/* txDetails section */} - + @@ -59,5 +81,5 @@ export const NewConstitutionAction = ({ )} - -); + ); +}; diff --git a/packages/core/src/ui/components/ProposalProcedures/NewConstitutionAction/NewConstitutionActionTypes.ts b/packages/core/src/ui/components/ProposalProcedures/NewConstitutionAction/NewConstitutionActionTypes.ts index 4d53001a2..23dbd5089 100644 --- a/packages/core/src/ui/components/ProposalProcedures/NewConstitutionAction/NewConstitutionActionTypes.ts +++ b/packages/core/src/ui/components/ProposalProcedures/NewConstitutionAction/NewConstitutionActionTypes.ts @@ -1,6 +1,6 @@ import * as ProcedureTypes from '../components/ProcedureTypes'; import * as ActionIdTypes from '../components/ActionIdTypes'; -import * as TxDetailsTypes from '../components/TransactionDetailsTypes'; +import * as TxDetailsTypes from '../components/ProposalProcedureTransactionDetailsTypes'; export interface Data { procedure: ProcedureTypes.Procedure; diff --git a/packages/core/src/ui/components/ProposalProcedures/NoConfidenceAction/NoConfidenceAction.stories.tsx b/packages/core/src/ui/components/ProposalProcedures/NoConfidenceAction/NoConfidenceAction.stories.tsx index 916673236..90c469e48 100644 --- a/packages/core/src/ui/components/ProposalProcedures/NoConfidenceAction/NoConfidenceAction.stories.tsx +++ b/packages/core/src/ui/components/ProposalProcedures/NoConfidenceAction/NoConfidenceAction.stories.tsx @@ -29,14 +29,8 @@ export default meta; type Story = StoryObj; const data: ComponentProps = { - dappInfo: { - logo: 'https://cdn.mint.handle.me/favicon.png', - name: 'Mint', - url: 'https://preprod.mint.handle.me' - }, data: { txDetails: { - txType: 'No Confidence', deposit: '2000', rewardAccount: 'stake1u89sasnfyjtmgk8ydqfv3fdl52f36x3djedfnzfc9rkgzrcss5vgr' }, @@ -51,26 +45,6 @@ const data: ComponentProps = { index: '0', id: '26bfdcc75a7f4d0cd8c71f0189bc5ca5ad2f4a3db6240c82b5a0edac7f9203e0' } - }, - translations: { - txDetails: { - title: 'Transaction Details', - txType: 'Transaction Type', - deposit: 'Deposit', - rewardAccount: 'Reward Account' - }, - procedure: { - anchor: { - hash: 'Anchor Hash', - url: 'Anchor URL' - }, - title: 'Procedure' - }, - actionId: { - title: 'Action ID', - index: 'Index', - txId: 'TX ID' - } } }; @@ -79,10 +53,3 @@ export const Overview: Story = { ...data } }; - -export const WithError: Story = { - args: { - ...data, - errorMessage: 'Something went wrong' - } -}; diff --git a/packages/core/src/ui/components/ProposalProcedures/NoConfidenceAction/NoConfidenceAction.tsx b/packages/core/src/ui/components/ProposalProcedures/NoConfidenceAction/NoConfidenceAction.tsx index 73034a6fe..c23284377 100644 --- a/packages/core/src/ui/components/ProposalProcedures/NoConfidenceAction/NoConfidenceAction.tsx +++ b/packages/core/src/ui/components/ProposalProcedures/NoConfidenceAction/NoConfidenceAction.tsx @@ -1,37 +1,53 @@ -import React from 'react'; -import { Box, Grid, Flex, Divider, Cell } from '@lace/ui'; -import { DappInfo, DappInfoProps } from '../../DappInfo'; -import { ErrorPane } from '@lace/common'; +import React, { useMemo } from 'react'; +import { Grid, Divider, Cell } from '@lace/ui'; import * as Types from './NoConfidenceActionTypes'; -import { TransactionDetails } from '../components/TransactionDetails'; +import { ProposalProcedureTransactionDetails } from '../components/ProposalProcedureTransactionDetails'; import { Procedure } from '../components/Procedure'; import { ActionId } from '../components/ActionId'; +import { useTranslation } from 'react-i18next'; export interface NoConfidenceActionProps { - dappInfo: Omit; - errorMessage?: string; data: Types.Data; - translations: Types.Translations; } export const NoConfidenceAction = ({ - dappInfo, - errorMessage, - data: { procedure, txDetails, actionId }, - translations -}: NoConfidenceActionProps): JSX.Element => ( - - - - - {errorMessage && ( - - - - )} + data: { procedure, txDetails, actionId } +}: NoConfidenceActionProps): JSX.Element => { + const { t } = useTranslation(); + + const translations = useMemo( + () => ({ + txDetails: { + title: t('core.ProposalProcedure.txDetails.title'), + txType: t('core.ProposalProcedure.txDetails.txType'), + deposit: t('core.ProposalProcedure.txDetails.deposit'), + rewardAccount: t('core.ProposalProcedure.txDetails.rewardAccount') + }, + procedure: { + title: t('core.ProposalProcedure.procedure.title'), + anchor: { + url: t('core.ProposalProcedure.procedure.anchor.url'), + hash: t('core.ProposalProcedure.procedure.anchor.hash') + } + }, + actionId: { + title: t('core.ProposalProcedure.governanceAction.actionId.title'), + index: t('core.ProposalProcedure.governanceAction.actionId.index'), + txId: t('core.ProposalProcedure.governanceAction.actionId.txId') + } + }), + [t] + ); + + return ( {/* tx details section */} - + @@ -47,5 +63,5 @@ export const NoConfidenceAction = ({ )} - -); + ); +}; diff --git a/packages/core/src/ui/components/ProposalProcedures/NoConfidenceAction/NoConfidenceActionTypes.ts b/packages/core/src/ui/components/ProposalProcedures/NoConfidenceAction/NoConfidenceActionTypes.ts index 0cdfcea7d..c71fd5dca 100644 --- a/packages/core/src/ui/components/ProposalProcedures/NoConfidenceAction/NoConfidenceActionTypes.ts +++ b/packages/core/src/ui/components/ProposalProcedures/NoConfidenceAction/NoConfidenceActionTypes.ts @@ -1,6 +1,6 @@ import * as ProcedureTypes from '../components/ProcedureTypes'; import * as ActionIdTypes from '../components/ActionIdTypes'; -import * as TxDetailsTypes from '../components/TransactionDetailsTypes'; +import * as TxDetailsTypes from '../components/ProposalProcedureTransactionDetailsTypes'; export interface Data { procedure: ProcedureTypes.Procedure; diff --git a/packages/core/src/ui/components/ProposalProcedures/ParameterChangeAction/ParameterChangeAction.stories.tsx b/packages/core/src/ui/components/ProposalProcedures/ParameterChangeAction/ParameterChangeAction.stories.tsx index 45ffa160b..b6ed3bb67 100644 --- a/packages/core/src/ui/components/ProposalProcedures/ParameterChangeAction/ParameterChangeAction.stories.tsx +++ b/packages/core/src/ui/components/ProposalProcedures/ParameterChangeAction/ParameterChangeAction.stories.tsx @@ -29,14 +29,8 @@ export default meta; type Story = StoryObj; const data: ComponentProps = { - dappInfo: { - logo: 'https://cdn.mint.handle.me/favicon.png', - name: 'Mint', - url: 'https://preprod.mint.handle.me' - }, data: { txDetails: { - txType: 'Protocol Parameter Update', deposit: '2000', rewardAccount: 'stake1u89sasnfyjtmgk8ydqfv3fdl52f36x3djedfnzfc9rkgzrcss5vgr' }, @@ -112,120 +106,6 @@ const data: ComponentProps = { } } } - }, - translations: { - txDetails: { - title: 'Transaction Details', - txType: 'Transaction Type', - deposit: 'Deposit', - rewardAccount: 'Reward Account' - }, - memory: 'Memory', - step: 'Step', - anchor: { - hash: 'Anchor Hash', - url: 'Anchor URL' - }, - networkGroup: { - title: 'Network Group', - maxBBSize: 'Max BB Size', - maxTxSize: 'Max Tx Size', - maxBHSize: 'Max BH Size', - maxValSize: 'Max Val Size', - maxTxExUnits: 'Max TX Ex Units', - maxBlockExUnits: 'Max BLK Ex Units', - maxCollateralInputs: 'Max Coll Inputs', - tooltip: { - maxBBSize: 'Max block body size', - maxTxSize: 'Max transaction size', - maxBHSize: 'Max block header size', - maxValSize: 'Max size of a serialized asset value', - maxTxExUnits: 'Max script execution units in a single transaction', - maxBlockExUnits: 'Max script execution units in a single block', - maxCollateralInputs: 'Max number of collateral inputs' - } - }, - economicGroup: { - title: 'Economic Group', - minFeeA: 'Min Fee A', - minFeeB: 'Min Fee B', - keyDeposit: 'Key Deposit', - poolDeposit: 'Pool Deposit', - rho: 'Rho', - tau: 'Tau', - minPoolCost: 'Min Pool Cost', - coinsPerUTxOByte: 'Coins/UTxO Byte', - prices: 'Price', - tooltip: { - minFeeA: 'Min fee coefficient', - minFeeB: 'Min fee constant', - keyDeposit: 'Delegation key Lovelace deposit', - poolDeposit: 'Pool registration Lovelace deposit', - rho: 'Monetary expansion', - tau: 'Treasury expansion', - minPoolCost: 'Min fixed rewards cut for pools', - coinsPerUTxOByte: 'Min Lovelace deposit per byte of serialized UTxO', - prices: 'Prices of Plutus execution units' - } - }, - technicalGroup: { - title: 'Technical Group', - a0: 'A0', - eMax: 'EMax', - nOpt: 'NOpt', - costModels: 'Cost Models', - collateralPercentage: 'Coll Percentage', - tooltip: { - a0: 'Pool pledge influence', - eMax: 'Pool retirement maximum epoch', - nOpt: 'Desired number of pools', - costModels: 'Plutus execution cost models', - collateralPercentage: 'Proportion of collateral needed for scripts' - } - }, - governanceGroup: { - title: 'Governance Group', - govActionLifetime: 'Gov Act Lifetime', - govActionDeposit: 'Gov Act Deposit', - drepDeposit: 'DRep Deposit', - drepActivity: 'DRep Activity', - ccMinSize: 'CC Min Size', - ccMaxTermLength: 'CC Max Term Length', - dRepVotingThresholds: { - title: 'Governance voting thresholds', - motionNoConfidence: 'Motion No Conf', - committeeNormal: 'Comm Normal', - committeeNoConfidence: 'Comm No Conf', - updateConstitution: 'Update Const', - hardForkInitiation: 'Hard Fork Init', - ppNetworkGroup: 'PP Network Grp', - ppEconomicGroup: 'PP Economic Grp', - ppTechnicalGroup: 'PP Technical Grp', - ppGovernanceGroup: 'PP Governance Grp', - treasuryWithdrawal: 'Treasury Withdraw' - }, - tooltip: { - govActionLifetime: 'governance action maximum lifetime in epochs', - govActionDeposit: 'governance action deposit', - drepDeposit: 'DRep deposit amount', - drepActivity: 'DRep activity period in epochs', - ccMinSize: 'Min constitutional committee size', - ccMaxTermLength: 'Max term length (in epochs) for the constitutional committee members', - dRepVotingThresholds: { - title: 'DRep voting thresholds', - motionNoConfidence: '1. Motion of no-confidence', - committeeNormal: '2a. New committee/threshold (normal state)', - committeeNoConfidence: '2b. New committee/threshold (state of no-confidence)', - updateConstitution: '3. Update to the Constitution or proposal policy', - hardForkInitiation: '4. Hard-fork initiation', - ppNetworkGroup: '5a. Protocol parameter changes, network group', - ppEconomicGroup: '5b. Protocol parameter changes, economic group', - ppTechnicalGroup: '5c. Protocol parameter changes, technical group', - ppGovernanceGroup: '5d. Protocol parameter changes, governance group', - treasuryWithdrawal: '6. Treasury withdrawal' - } - } - } } }; @@ -234,10 +114,3 @@ export const Overview: Story = { ...data } }; - -export const WithError: Story = { - args: { - ...data, - errorMessage: 'Something went wrong' - } -}; diff --git a/packages/core/src/ui/components/ProposalProcedures/ParameterChangeAction/ParameterChangeAction.tsx b/packages/core/src/ui/components/ProposalProcedures/ParameterChangeAction/ParameterChangeAction.tsx index 13ae37171..bbd924dcb 100644 --- a/packages/core/src/ui/components/ProposalProcedures/ParameterChangeAction/ParameterChangeAction.tsx +++ b/packages/core/src/ui/components/ProposalProcedures/ParameterChangeAction/ParameterChangeAction.tsx @@ -1,91 +1,269 @@ import React from 'react'; -import { Box, Grid, Flex, Divider, Metadata, MetadataLink, Cell } from '@lace/ui'; -import { DappInfo, DappInfoProps } from '../../DappInfo'; -import { ErrorPane } from '@lace/common'; -import { TransactionDetails } from '../components/TransactionDetails'; +import { Box, Grid, Divider, Metadata, MetadataLink, Cell } from '@lace/ui'; +import { ProposalProcedureTransactionDetails } from '../components/ProposalProcedureTransactionDetails'; import * as Types from './ParameterChangeActionTypes'; import { EconomicGroup } from './EconomicGroup'; import { NetworkGroup } from './NetworkGroup'; import { TechnicalGroup } from './TechnicalGroup'; import { GovernanceGroup } from './GovernanceGroup'; import { Card } from '../components/Card'; +import { useTranslation } from 'react-i18next'; interface ParameterChangeActionProps { - dappInfo: Omit; - errorMessage?: string; data: Types.Data; - translations: Types.Translations; } export const ParameterChangeAction = ({ - dappInfo, - errorMessage, - data: { txDetails, protocolParamUpdate, anchor }, - translations + data: { txDetails, protocolParamUpdate, anchor } }: ParameterChangeActionProps): JSX.Element => { + const { t } = useTranslation(); const { economicGroup, governanceGroup, networkGroup, technicalGroup, maxTxExUnits, maxBlockExUnits } = protocolParamUpdate; + // TODO: consider encapsulating it inside the component itself, check if all the translations have the fallback to the parent int provider (LW-9920) + + const translations: Types.Translations = { + txDetails: { + title: t('core.ProposalProcedure.txDetails.title'), + txType: t('core.ProposalProcedure.txDetails.txType'), + deposit: t('core.ProposalProcedure.txDetails.deposit'), + rewardAccount: t('core.ProposalProcedure.txDetails.rewardAccount') + }, + anchor: { + url: t('core.ProposalProcedure.procedure.anchor.url'), + hash: t('core.ProposalProcedure.procedure.anchor.hash') + }, + memory: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.memory'), + step: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.step'), + networkGroup: { + title: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.networkGroup.title'), + maxBBSize: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.networkGroup.maxBBSize'), + maxTxSize: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.networkGroup.maxTxSize'), + maxBHSize: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.networkGroup.maxBHSize'), + maxValSize: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.networkGroup.maxValSize'), + maxTxExUnits: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.networkGroup.maxTxExUnits'), + maxBlockExUnits: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.networkGroup.maxBlockExUnits'), + maxCollateralInputs: t( + 'core.ProposalProcedure.governanceAction.protocolParamUpdate.networkGroup.maxCollateralInputs' + ), + tooltip: { + maxBBSize: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.networkGroup.tooltip.maxBBSize'), + maxTxSize: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.networkGroup.tooltip.maxTxSize'), + maxBHSize: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.networkGroup.tooltip.maxBHSize'), + maxValSize: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.networkGroup.tooltip.maxValSize'), + maxTxExUnits: t( + 'core.ProposalProcedure.governanceAction.protocolParamUpdate.networkGroup.tooltip.maxTxExUnits' + ), + maxBlockExUnits: t( + 'core.ProposalProcedure.governanceAction.protocolParamUpdate.networkGroup.tooltip.maxBlockExUnits' + ), + maxCollateralInputs: t( + 'core.ProposalProcedure.governanceAction.protocolParamUpdate.networkGroup.tooltip.maxCollateralInputs' + ) + } + }, + economicGroup: { + title: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.economicGroup.title'), + minFeeA: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.economicGroup.minFeeA'), + minFeeB: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.economicGroup.minFeeB'), + keyDeposit: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.economicGroup.keyDeposit'), + poolDeposit: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.economicGroup.poolDeposit'), + rho: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.economicGroup.rho'), + tau: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.economicGroup.tau'), + minPoolCost: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.economicGroup.minPoolCost'), + coinsPerUTxOByte: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.economicGroup.coinsPerUTxOByte'), + prices: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.economicGroup.prices'), + tooltip: { + minFeeA: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.economicGroup.tooltip.minFeeA'), + minFeeB: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.economicGroup.tooltip.minFeeB'), + keyDeposit: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.economicGroup.tooltip.keyDeposit'), + poolDeposit: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.economicGroup.tooltip.poolDeposit'), + rho: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.economicGroup.tooltip.rho'), + tau: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.economicGroup.tooltip.tau'), + minPoolCost: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.economicGroup.tooltip.minPoolCost'), + coinsPerUTxOByte: t( + 'core.ProposalProcedure.governanceAction.protocolParamUpdate.economicGroup.tooltip.coinsPerUTxOByte' + ), + prices: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.economicGroup.tooltip.prices') + } + }, + technicalGroup: { + title: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.technicalGroup.title'), + a0: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.technicalGroup.a0'), + eMax: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.technicalGroup.eMax'), + nOpt: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.technicalGroup.nOpt'), + costModels: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.technicalGroup.costModels'), + collateralPercentage: t( + 'core.ProposalProcedure.governanceAction.protocolParamUpdate.technicalGroup.collateralPercentage' + ), + tooltip: { + a0: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.technicalGroup.tooltip.a0'), + eMax: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.technicalGroup.tooltip.eMax'), + nOpt: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.technicalGroup.tooltip.nOpt'), + costModels: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.technicalGroup.tooltip.costModels'), + collateralPercentage: t( + 'core.ProposalProcedure.governanceAction.protocolParamUpdate.technicalGroup.tooltip.collateralPercentage' + ) + } + }, + governanceGroup: { + title: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.title'), + govActionLifetime: t( + 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.govActionLifetime' + ), + govActionDeposit: t( + 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.govActionDeposit' + ), + drepDeposit: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.drepDeposit'), + drepActivity: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.drepActivity'), + ccMinSize: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.ccMinSize'), + ccMaxTermLength: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.ccMaxTermLength'), + dRepVotingThresholds: { + title: t( + 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.dRepVotingThresholds.title' + ), + motionNoConfidence: t( + 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.dRepVotingThresholds.motionNoConfidence' + ), + committeeNormal: t( + 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.dRepVotingThresholds.committeeNormal' + ), + committeeNoConfidence: t( + 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.dRepVotingThresholds.committeeNoConfidence' + ), + updateConstitution: t( + 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.dRepVotingThresholds.updateConstitution' + ), + hardForkInitiation: t( + 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.dRepVotingThresholds.hardForkInitiation' + ), + ppNetworkGroup: t( + 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.dRepVotingThresholds.ppNetworkGroup' + ), + ppEconomicGroup: t( + 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.dRepVotingThresholds.ppEconomicGroup' + ), + ppTechnicalGroup: t( + 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.dRepVotingThresholds.ppTechnicalGroup' + ), + ppGovernanceGroup: t( + 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.dRepVotingThresholds.ppGovernanceGroup' + ), + treasuryWithdrawal: t( + 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.dRepVotingThresholds.treasuryWithdrawal' + ) + }, + tooltip: { + govActionLifetime: t( + 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.tooltip.govActionLifetime' + ), + govActionDeposit: t( + 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.tooltip.govActionDeposit' + ), + drepDeposit: t( + 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.tooltip.drepDeposit' + ), + drepActivity: t( + 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.tooltip.drepActivity' + ), + ccMinSize: t('core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.tooltip.ccMinSize'), + ccMaxTermLength: t( + 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.tooltip.ccMaxTermLength' + ), + dRepVotingThresholds: { + title: t( + 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.tooltip.dRepVotingThresholds.title' + ), + motionNoConfidence: t( + 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.tooltip.dRepVotingThresholds.motionNoConfidence' + ), + committeeNormal: t( + 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.tooltip.dRepVotingThresholds.committeeNormal' + ), + committeeNoConfidence: t( + 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.tooltip.dRepVotingThresholds.committeeNoConfidence' + ), + updateConstitution: t( + 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.tooltip.dRepVotingThresholds.updateConstitution' + ), + hardForkInitiation: t( + 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.tooltip.dRepVotingThresholds.hardForkInitiation' + ), + ppNetworkGroup: t( + 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.tooltip.dRepVotingThresholds.ppNetworkGroup' + ), + ppEconomicGroup: t( + 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.tooltip.dRepVotingThresholds.ppEconomicGroup' + ), + ppTechnicalGroup: t( + 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.tooltip.dRepVotingThresholds.ppTechnicalGroup' + ), + ppGovernanceGroup: t( + 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.tooltip.dRepVotingThresholds.ppGovernanceGroup' + ), + treasuryWithdrawal: t( + 'core.ProposalProcedure.governanceAction.protocolParamUpdate.governanceGroup.tooltip.dRepVotingThresholds.treasuryWithdrawal' + ) + } + } + } + }; + return ( - - - - - {errorMessage && ( - - - - )} - - {/* tx details section */} - - <> - - - - - {anchor.txHashUrl ? ( - - ) : ( - - )} - - + + {/* tx details section */} + + <> - - - - - - + - - + {anchor.txHashUrl ? ( + + ) : ( + + )} - - - - - + + + + + + + + + + + + + + + + + ); }; diff --git a/packages/core/src/ui/components/ProposalProcedures/ParameterChangeAction/ParameterChangeActionTypes.ts b/packages/core/src/ui/components/ProposalProcedures/ParameterChangeAction/ParameterChangeActionTypes.ts index 90efec01d..38e0d6873 100644 --- a/packages/core/src/ui/components/ProposalProcedures/ParameterChangeAction/ParameterChangeActionTypes.ts +++ b/packages/core/src/ui/components/ProposalProcedures/ParameterChangeAction/ParameterChangeActionTypes.ts @@ -1,5 +1,5 @@ import * as ProcedureTypes from '../components/ProcedureTypes'; -import * as TxDetailsTypes from '../components/TransactionDetailsTypes'; +import * as TxDetailsTypes from '../components/ProposalProcedureTransactionDetailsTypes'; export interface Data { protocolParamUpdate: ProtocolParamUpdate; diff --git a/packages/core/src/ui/components/ProposalProcedures/TreasuryWithdrawalsAction/TreasuryWithdrawalsAction.stories.tsx b/packages/core/src/ui/components/ProposalProcedures/TreasuryWithdrawalsAction/TreasuryWithdrawalsAction.stories.tsx index 7aae0caa7..7424b0e5c 100644 --- a/packages/core/src/ui/components/ProposalProcedures/TreasuryWithdrawalsAction/TreasuryWithdrawalsAction.stories.tsx +++ b/packages/core/src/ui/components/ProposalProcedures/TreasuryWithdrawalsAction/TreasuryWithdrawalsAction.stories.tsx @@ -29,14 +29,8 @@ export default meta; type Story = StoryObj; const data: ComponentProps = { - dappInfo: { - logo: 'https://cdn.mint.handle.me/favicon.png', - name: 'Mint', - url: 'https://preprod.mint.handle.me' - }, data: { txDetails: { - txType: 'Treasury Withdrawals', deposit: '2000', rewardAccount: 'stake1u89sasnfyjtmgk8ydqfv3fdl52f36x3djedfnzfc9rkgzrcss5vgr' }, @@ -57,31 +51,6 @@ const data: ComponentProps = { index: '0', id: '26bfdcc75a7f4d0cd8c71f0189bc5ca5ad2f4a3db6240c82b5a0edac7f9203e0' } - }, - translations: { - txDetails: { - title: 'Transaction Details', - txType: 'Transaction Type', - deposit: 'Deposit', - rewardAccount: 'Reward Account' - }, - procedure: { - anchor: { - hash: 'Anchor Hash', - url: 'Anchor URL' - }, - title: 'Procedure' - }, - actionId: { - title: 'Action ID', - index: 'Index', - txId: 'TX ID' - }, - withdrawals: { - title: 'Withdrawal Details', - lovelace: 'Lovelace Withdrawn', - rewardAccount: 'Reward Account' - } } }; @@ -90,10 +59,3 @@ export const Overview: Story = { ...data } }; - -export const WithError: Story = { - args: { - ...data, - errorMessage: 'Something went wrong' - } -}; diff --git a/packages/core/src/ui/components/ProposalProcedures/TreasuryWithdrawalsAction/TreasuryWithdrawalsAction.tsx b/packages/core/src/ui/components/ProposalProcedures/TreasuryWithdrawalsAction/TreasuryWithdrawalsAction.tsx index 38a8d2196..b1e438403 100644 --- a/packages/core/src/ui/components/ProposalProcedures/TreasuryWithdrawalsAction/TreasuryWithdrawalsAction.tsx +++ b/packages/core/src/ui/components/ProposalProcedures/TreasuryWithdrawalsAction/TreasuryWithdrawalsAction.tsx @@ -1,71 +1,90 @@ -import React from 'react'; -import { Box, Grid, Flex, Divider, sx, Text, Metadata, Cell } from '@lace/ui'; -import { DappInfo, DappInfoProps } from '../../DappInfo'; -import { ErrorPane } from '@lace/common'; +import React, { useMemo } from 'react'; +import { Grid, Divider, sx, Text, Metadata, Cell } from '@lace/ui'; import * as Types from './TreasuryWithdrawalsActionTypes'; -import { TransactionDetails } from '../components/TransactionDetails'; +import { ProposalProcedureTransactionDetails } from '../components/ProposalProcedureTransactionDetails'; import { ActionId } from '../components/ActionId'; import { Procedure } from '../components/Procedure'; +import { useTranslation } from 'react-i18next'; interface TreasuryWithdrawalsActionProps { - dappInfo: Omit; - errorMessage?: string; data: Types.Data; - translations: Types.Translations; } export const TreasuryWithdrawalsAction = ({ - dappInfo, - errorMessage, - data: { txDetails, procedure, withdrawals, actionId }, - translations + data: { txDetails, procedure, withdrawals, actionId } }: TreasuryWithdrawalsActionProps): JSX.Element => { + const { t } = useTranslation(); + const textCss = sx({ color: '$text_primary' }); + const translations = useMemo( + () => ({ + txDetails: { + title: t('core.ProposalProcedure.txDetails.title'), + txType: t('core.ProposalProcedure.txDetails.txType'), + deposit: t('core.ProposalProcedure.txDetails.deposit'), + rewardAccount: t('core.ProposalProcedure.txDetails.rewardAccount') + }, + procedure: { + title: t('core.ProposalProcedure.procedure.title'), + anchor: { + url: t('core.ProposalProcedure.procedure.anchor.url'), + hash: t('core.ProposalProcedure.procedure.anchor.hash') + } + }, + actionId: { + title: t('core.ProposalProcedure.governanceAction.actionId.title'), + index: t('core.ProposalProcedure.governanceAction.actionId.index'), + txId: t('core.ProposalProcedure.governanceAction.actionId.txId') + }, + withdrawals: { + title: t('core.ProposalProcedure.governanceAction.treasuryWithdrawals.title'), + rewardAccount: t('core.ProposalProcedure.governanceAction.treasuryWithdrawals.withdrawals.rewardAccount'), + lovelace: t('core.ProposalProcedure.governanceAction.treasuryWithdrawals.withdrawals.lovelace') + } + }), + [t] + ); + return ( - - - - - {errorMessage && ( - - - + + {/* tx details section */} + + + + + {/* procedure section */} + + + + {translations.withdrawals.title} + + + {withdrawals.map((withdrawal) => ( + + + + + + + + + ))} + {actionId && ( + <> + + + + + )} - - {/* tx details section */} - - - - - {/* procedure section */} - - - - {translations.withdrawals.title} - - - {withdrawals.map((withdrawal) => ( - - - - - - - - - ))} - {actionId && ( - <> - - - - - - )} - - + ); }; diff --git a/packages/core/src/ui/components/ProposalProcedures/TreasuryWithdrawalsAction/TreasuryWithdrawalsActionTypes.ts b/packages/core/src/ui/components/ProposalProcedures/TreasuryWithdrawalsAction/TreasuryWithdrawalsActionTypes.ts index 7de7a0fc0..cfc906569 100644 --- a/packages/core/src/ui/components/ProposalProcedures/TreasuryWithdrawalsAction/TreasuryWithdrawalsActionTypes.ts +++ b/packages/core/src/ui/components/ProposalProcedures/TreasuryWithdrawalsAction/TreasuryWithdrawalsActionTypes.ts @@ -1,6 +1,6 @@ import * as ProcedureTypes from '../components/ProcedureTypes'; import * as ActionIdTypes from '../components/ActionIdTypes'; -import * as TxDetailsTypes from '../components/TransactionDetailsTypes'; +import * as TxDetailsTypes from '../components/ProposalProcedureTransactionDetailsTypes'; export interface Data { actionId?: ActionIdTypes.Data; diff --git a/packages/core/src/ui/components/ProposalProcedures/UpdateCommitteeAction/UpdateCommitteeActionAction.stories.tsx b/packages/core/src/ui/components/ProposalProcedures/UpdateCommitteeAction/UpdateCommitteeActionAction.stories.tsx index cd807a979..3422b9ddf 100644 --- a/packages/core/src/ui/components/ProposalProcedures/UpdateCommitteeAction/UpdateCommitteeActionAction.stories.tsx +++ b/packages/core/src/ui/components/ProposalProcedures/UpdateCommitteeAction/UpdateCommitteeActionAction.stories.tsx @@ -29,14 +29,8 @@ export default meta; type Story = StoryObj; const data: ComponentProps = { - dappInfo: { - logo: 'https://cdn.mint.handle.me/favicon.png', - name: 'Mint', - url: 'https://preprod.mint.handle.me' - }, data: { txDetails: { - txType: 'Hard Fork Initiation', deposit: '2000', rewardAccount: 'stake1u89sasnfyjtmgk8ydqfv3fdl52f36x3djedfnzfc9rkgzrcss5vgr' }, @@ -77,42 +71,6 @@ const data: ComponentProps = { denominator: '5', numerator: '1' } - }, - translations: { - txDetails: { - title: 'Transaction Details', - txType: 'Transaction Type', - deposit: 'Deposit', - rewardAccount: 'Reward Account' - }, - procedure: { - anchor: { - hash: 'Anchor Hash', - url: 'Anchor URL' - }, - title: 'Procedure' - }, - actionId: { - title: 'Action ID', - index: 'Index', - txId: 'TX ID' - }, - membersToBeAdded: { - title: 'Members To Be Added', - coldCredential: { - hash: 'Cold Credential Hash', - epoch: 'Epoch' - } - }, - membersToBeRemoved: { - title: 'Members To Be Removed', - hash: 'Hash' - }, - newQuorumThreshold: { - title: 'New Quorum Threshold', - denominator: 'Denominator', - numerator: 'Numerator' - } } }; @@ -121,10 +79,3 @@ export const Overview: Story = { ...data } }; - -export const WithError: Story = { - args: { - ...data, - errorMessage: 'Something went wrong' - } -}; diff --git a/packages/core/src/ui/components/ProposalProcedures/UpdateCommitteeAction/UpdateCommitteeActionAction.tsx b/packages/core/src/ui/components/ProposalProcedures/UpdateCommitteeAction/UpdateCommitteeActionAction.tsx index 97237316d..743c203ae 100644 --- a/packages/core/src/ui/components/ProposalProcedures/UpdateCommitteeAction/UpdateCommitteeActionAction.tsx +++ b/packages/core/src/ui/components/ProposalProcedures/UpdateCommitteeAction/UpdateCommitteeActionAction.tsx @@ -1,97 +1,118 @@ import React from 'react'; -import { Box, Grid, Flex, Divider, sx, Text, Metadata, Cell } from '@lace/ui'; -import { DappInfo, DappInfoProps } from '../../DappInfo'; -import { ErrorPane } from '@lace/common'; +import { Grid, Divider, sx, Text, Metadata, Cell } from '@lace/ui'; import * as Types from './UpdateCommitteeActionTypes'; import { Procedure } from '../components/Procedure'; -import { TransactionDetails } from '../components/TransactionDetails'; +import { ProposalProcedureTransactionDetails } from '../components/ProposalProcedureTransactionDetails'; import { ActionId } from '../components/ActionId'; +import { useTranslation } from 'react-i18next'; interface UpdateCommitteeActionProps { - dappInfo: Omit; - errorMessage?: string; data: Types.Data; - translations: Types.Translations; } export const UpdateCommitteeAction = ({ - dappInfo, - errorMessage, - data: { procedure, txDetails, membersToBeAdded, membersToBeRemoved, actionId }, - translations + data: { procedure, txDetails, membersToBeAdded, membersToBeRemoved, actionId } }: UpdateCommitteeActionProps): JSX.Element => { + const { t } = useTranslation(); const textCss = sx({ color: '$text_primary' }); + const translations: Types.Translations = { + txDetails: { + title: t('core.ProposalProcedure.txDetails.title'), + txType: t('core.ProposalProcedure.txDetails.txType'), + deposit: t('core.ProposalProcedure.txDetails.deposit'), + rewardAccount: t('core.ProposalProcedure.txDetails.rewardAccount') + }, + procedure: { + title: t('core.ProposalProcedure.procedure.title'), + anchor: { + url: t('core.ProposalProcedure.procedure.anchor.url'), + hash: t('core.ProposalProcedure.procedure.anchor.hash') + } + }, + actionId: { + title: t('core.ProposalProcedure.governanceAction.actionId.title'), + index: t('core.ProposalProcedure.governanceAction.actionId.index'), + txId: t('core.ProposalProcedure.governanceAction.actionId.txId') + }, + membersToBeAdded: { + title: t('core.ProposalProcedure.governanceAction.updateCommitteeAction.membersToBeAdded.title'), + coldCredential: { + hash: t('core.ProposalProcedure.governanceAction.updateCommitteeAction.membersToBeAdded.coldCredential.hash'), + epoch: t('core.ProposalProcedure.governanceAction.updateCommitteeAction.membersToBeAdded.coldCredential.epoch') + } + }, + membersToBeRemoved: { + title: t('core.ProposalProcedure.governanceAction.updateCommitteeAction.membersToBeRemoved.title'), + hash: t('core.ProposalProcedure.governanceAction.updateCommitteeAction.membersToBeRemoved.hash') + } + }; + return ( - - - - - {errorMessage && ( - - - + + {/* tx details section */} + + + + + {/* procedure section */} + + + + + {membersToBeAdded.length > 0 && ( + <> + + + {translations.membersToBeAdded.title} + + + {membersToBeAdded.map(({ coldCredential, epoch }) => ( + + + + + + + + + ))} + + )} + {membersToBeRemoved.length > 0 && ( + <> + + + {translations.membersToBeRemoved.title} + + + {membersToBeRemoved.map(({ hash }) => ( + + + + + + + + + ))} + + )} + {actionId && ( + <> + + + + + )} - - {/* tx details section */} - - - - - {/* procedure section */} - - - - - {membersToBeAdded.length > 0 && ( - <> - - - {translations.membersToBeAdded.title} - - - {membersToBeAdded.map(({ coldCredential, epoch }) => ( - - - - - - - - - ))} - - )} - {membersToBeRemoved.length > 0 && ( - <> - - - {translations.membersToBeRemoved.title} - - - {membersToBeRemoved.map(({ hash }) => ( - - - - - - - - - ))} - - )} - {actionId && ( - <> - - - - - - )} - - + ); }; diff --git a/packages/core/src/ui/components/ProposalProcedures/UpdateCommitteeAction/UpdateCommitteeActionTypes.ts b/packages/core/src/ui/components/ProposalProcedures/UpdateCommitteeAction/UpdateCommitteeActionTypes.ts index ce8b90745..3484ff23f 100644 --- a/packages/core/src/ui/components/ProposalProcedures/UpdateCommitteeAction/UpdateCommitteeActionTypes.ts +++ b/packages/core/src/ui/components/ProposalProcedures/UpdateCommitteeAction/UpdateCommitteeActionTypes.ts @@ -1,6 +1,6 @@ import * as ProcedureTypes from '../components/ProcedureTypes'; import * as ActionIdTypes from '../components/ActionIdTypes'; -import * as TxDetailsTypes from '../components/TransactionDetailsTypes'; +import * as TxDetailsTypes from '../components/ProposalProcedureTransactionDetailsTypes'; interface MembersToBeAdded { coldCredential: { diff --git a/packages/core/src/ui/components/ProposalProcedures/components/TransactionDetails.tsx b/packages/core/src/ui/components/ProposalProcedures/components/ProposalProcedureTransactionDetails.tsx similarity index 51% rename from packages/core/src/ui/components/ProposalProcedures/components/TransactionDetails.tsx rename to packages/core/src/ui/components/ProposalProcedures/components/ProposalProcedureTransactionDetails.tsx index 8a21c6b00..465bc06a5 100644 --- a/packages/core/src/ui/components/ProposalProcedures/components/TransactionDetails.tsx +++ b/packages/core/src/ui/components/ProposalProcedures/components/ProposalProcedureTransactionDetails.tsx @@ -1,13 +1,20 @@ import React from 'react'; import { Metadata, Text, sx, Cell } from '@lace/ui'; -import * as Types from './TransactionDetailsTypes'; +import * as Types from './ProposalProcedureTransactionDetailsTypes'; interface Props { - data: Types.TxDetails; + txTitle: string; + deposit?: string; + rewardAccount?: string; translations: Types.Translations; } -export const TransactionDetails = ({ data, translations }: Props): JSX.Element => { +export const ProposalProcedureTransactionDetails = ({ + txTitle, + deposit, + rewardAccount, + translations +}: Props): JSX.Element => { const textCss = sx({ color: '$text_primary' }); @@ -20,16 +27,16 @@ export const TransactionDetails = ({ data, translations }: Props): JSX.Element = - + - {data.rewardAccount && ( + {rewardAccount && ( - + )} - {data.deposit && ( + {deposit && ( - + )} diff --git a/packages/core/src/ui/components/ProposalProcedures/components/TransactionDetailsTypes.ts b/packages/core/src/ui/components/ProposalProcedures/components/ProposalProcedureTransactionDetailsTypes.ts similarity index 91% rename from packages/core/src/ui/components/ProposalProcedures/components/TransactionDetailsTypes.ts rename to packages/core/src/ui/components/ProposalProcedures/components/ProposalProcedureTransactionDetailsTypes.ts index 744b83200..169db5a5c 100644 --- a/packages/core/src/ui/components/ProposalProcedures/components/TransactionDetailsTypes.ts +++ b/packages/core/src/ui/components/ProposalProcedures/components/ProposalProcedureTransactionDetailsTypes.ts @@ -1,5 +1,4 @@ export interface TxDetails { - txType: string; deposit?: string; rewardAccount?: string; } diff --git a/packages/core/src/ui/components/ResignCommitteeCertificate/ResignCommitteeCertificate.tsx b/packages/core/src/ui/components/ResignCommitteeCertificate/ResignCommitteeCertificate.tsx new file mode 100644 index 000000000..bbed8063b --- /dev/null +++ b/packages/core/src/ui/components/ResignCommitteeCertificate/ResignCommitteeCertificate.tsx @@ -0,0 +1,59 @@ +import React from 'react'; +import { Cell, Grid, TransactionSummary } from '@lace/ui'; +import { useTranslation } from 'react-i18next'; + +interface Translations { + labels: { + url: string; + hash: string; + coldCredential: string; + }; +} +interface Props { + metadata: { + coldCredential: string; + hash: string; + url: string; + }; +} + +export const ResignCommitteeCertificate = ({ metadata }: Props): JSX.Element => { + const { t } = useTranslation(); + + const translations: Translations = { + labels: { + coldCredential: t('core.activityDetails.certificateTitles.coldCredential'), + hash: t('core.DRepRegistration.hash'), + url: t('core.DRepRegistration.url') + } + }; + + return ( + + + + + + + + {metadata.url && ( + + + + )} + {metadata.hash && ( + + + + )} + + ); +}; diff --git a/packages/core/src/ui/components/ResignCommitteeCertificate/index.ts b/packages/core/src/ui/components/ResignCommitteeCertificate/index.ts new file mode 100644 index 000000000..d6e9d3dfd --- /dev/null +++ b/packages/core/src/ui/components/ResignCommitteeCertificate/index.ts @@ -0,0 +1 @@ +export { ResignCommitteeCertificate } from './ResignCommitteeCertificate'; diff --git a/packages/core/src/ui/components/VotingProcedures/VotingProcedures.stories.tsx b/packages/core/src/ui/components/VotingProcedures/VotingProcedures.stories.tsx index b44f16a91..0a0be2c8d 100644 --- a/packages/core/src/ui/components/VotingProcedures/VotingProcedures.stories.tsx +++ b/packages/core/src/ui/components/VotingProcedures/VotingProcedures.stories.tsx @@ -2,6 +2,7 @@ import type { Meta, StoryObj } from '@storybook/react'; import { VotingProcedures } from './VotingProcedures'; import { ComponentProps } from 'react'; +import { Wallet } from '@lace/cardano'; const customViewports = { popup: { @@ -28,16 +29,15 @@ const meta: Meta = { export default meta; type Story = StoryObj; +const TX_HASH_URL = + 'https://cexplorer.io/address/addr1q9wlvfl74g9h8txw5v0lfew2gjsw9z56d5kj8mmv5d8tudcx9eh8zefr3cxuje02lu6tgy083xkl39rr5xkj483vvd6q8nlapq'; +const URL = 'https://shorturl.at/eK145'; + const data: ComponentProps = { - dappInfo: { - logo: 'https://cdn.mint.handle.me/favicon.png', - name: 'Mint', - url: 'https://preprod.mint.handle.me' - }, data: [ { voter: { - type: 'DRep', + type: Wallet.util.getVoterType(Wallet.Cardano.VoterType.dRepKeyHash), dRepId: 'drep1cs234l5mtapethapx8cq97nkpa27xf84phruh5f6jqxa78ymlp4' }, votes: [ @@ -45,35 +45,68 @@ const data: ComponentProps = { actionId: { index: 0, txHash: '26bfdcc75a7f4d0cd8c71f0189bc5ca5ad2f4a3db6240c82b5a0edac7f9203e0', - txHashUrl: - 'https://cexplorer.io/address/addr1q9wlvfl74g9h8txw5v0lfew2gjsw9z56d5kj8mmv5d8tudcx9eh8zefr3cxuje02lu6tgy083xkl39rr5xkj483vvd6q8nlapq' + txHashUrl: TX_HASH_URL }, votingProcedure: { anchor: { hash: '9067f223838d88b83f660c05eedf7f6f65c45de31e522c1bcb6a1eb287b17e89', - url: 'https://shorturl.at/eK145' + url: URL }, - vote: 'Yes' + vote: Wallet.util.getVote(Wallet.Cardano.Vote.yes) } } ] } - ], - translations: { - voterType: 'Voter Type', - procedureTitle: 'Procedure', - actionIdTitle: 'Action ID', - vote: 'Vote', - actionId: { - index: 'Index', - txHash: 'TX Hash' - }, - anchor: { - hash: 'Anchor Hash', - url: 'Anchor URL' + ] +}; + +const dataMultiple: ComponentProps = { + data: [ + { + voter: { + type: Wallet.util.getVoterType(Wallet.Cardano.VoterType.dRepKeyHash), + dRepId: 'drep1cs234l5mtapethapx8cq97nkpa27xf84phruh5f6jqxa78ymlp4' + }, + votes: [ + { + actionId: { + index: 0, + txHash: '26bfdcc75a7f4d0cd8c71f0189bc5ca5ad2f4a3db6240c82b5a0edac7f9203e0', + txHashUrl: TX_HASH_URL + }, + votingProcedure: { + anchor: { + hash: '9067f223838d88b83f660c05eedf7f6f65c45de31e522c1bcb6a1eb287b17e89', + url: URL + }, + vote: Wallet.util.getVote(Wallet.Cardano.Vote.yes) + } + } + ] }, - dRepId: 'DRep ID' - } + { + voter: { + type: Wallet.util.getVoterType(Wallet.Cardano.VoterType.dRepKeyHash), + dRepId: 'drep1cs234l5mtapethapx8cq97nkpa27xf84phruh5f6jqxa78ymlp4' + }, + votes: [ + { + actionId: { + index: 0, + txHash: '26bfdcc75a7f4d0cd8c71f0189bc5ca5ad2f4a3db6240c82b5a0edac7f9203e0', + txHashUrl: TX_HASH_URL + }, + votingProcedure: { + anchor: { + hash: '9067f223838d88b83f660c05eedf7f6f65c45de31e522c1bcb6a1eb287b17e89', + url: URL + }, + vote: Wallet.util.getVote(Wallet.Cardano.Vote.no) + } + } + ] + } + ] }; export const Overview: Story = { @@ -81,41 +114,9 @@ export const Overview: Story = { ...data } }; -export const WithError: Story = { - args: { - ...data, - errorMessage: 'Something went wrong' - } -}; export const MultipleVotes: Story = { args: { - ...data, - data: [ - ...data.data, - { - voter: { - type: 'DRep', - dRepId: 'drep1cs234l5mtapethapx8cq97nkpa27xf84phruh5f6jqxa78ymlp5' - }, - votes: [ - { - actionId: { - index: 0, - txHash: '26bfdcc75a7f4d0cd8c71f0189bc5ca5ad2f4a3db6240c82b5a0edac7f9203e0', - txHashUrl: - 'https://cexplorer.io/address/addr1q9wlvfl74g9h8txw5v0lfew2gjsw9z56d5kj8mmv5d8tudcx9eh8zefr3cxuje02lu6tgy083xkl39rr5xkj483vvd6q8nlapq' - }, - votingProcedure: { - anchor: { - hash: '9067f223838d88b83f660c05eedf7f6f65c45de31e522c1bcb6a1eb287b17e89', - url: 'https://shorturl.at/eK145' - }, - vote: 'Yes' - } - } - ] - } - ] + ...dataMultiple } }; diff --git a/packages/core/src/ui/components/VotingProcedures/VotingProcedures.tsx b/packages/core/src/ui/components/VotingProcedures/VotingProcedures.tsx index dc40824e7..615d9fa7f 100644 --- a/packages/core/src/ui/components/VotingProcedures/VotingProcedures.tsx +++ b/packages/core/src/ui/components/VotingProcedures/VotingProcedures.tsx @@ -1,11 +1,12 @@ import React, { Fragment } from 'react'; -import { Box, Cell, Grid, Flex, Metadata, MetadataLink, Text, Divider, sx } from '@lace/ui'; -import { DappInfo, DappInfoProps } from '../DappInfo'; -import { ErrorPane } from '@lace/common'; +import { Box, Cell, Grid, Metadata, MetadataLink, Text, Divider, sx } from '@lace/ui'; +import { useTranslation } from 'react-i18next'; +import { TranslationKey } from '@lace/translation'; +import { VoterTypeEnum, VotesEnum } from '@lace/cardano/dist/wallet/util'; type VotingProcedure = { voter: { - type: string; + type: VoterTypeEnum; dRepId?: string; }; votes: { @@ -15,7 +16,7 @@ type VotingProcedure = { txHashUrl?: string; // Dependent on having an explorer to link }; votingProcedure: { - vote: string; + vote: VotesEnum; anchor: { url: string; hash: string; @@ -25,43 +26,35 @@ type VotingProcedure = { }; interface Props { - dappInfo: Omit; - errorMessage?: string; data: VotingProcedure[]; - translations: { - actionIdTitle: string; - actionId: { - index: string; - txHash: string; - }; - anchor: { - url: string; - hash: string; - } | null; - dRepId: string; - procedureTitle: string; - vote: string; - voterType: string; - }; } const indexCounter = (text: string, idx: number, length: number): string => (length > 1 ? `${text} ${idx + 1}` : text); -export const VotingProcedures = ({ dappInfo, errorMessage, data, translations }: Props): JSX.Element => { +export const VotingProcedures = ({ data }: Props): JSX.Element => { + const { t } = useTranslation(); const textCss = sx({ color: '$text_primary' }); + const translations = { + voterType: t('core.VotingProcedures.voterType'), + procedureTitle: t('core.VotingProcedures.procedureTitle'), + actionIdTitle: t('core.VotingProcedures.actionIdTitle'), + vote: t('core.VotingProcedures.vote'), + actionId: { + index: t('core.VotingProcedures.actionId.index'), + txHash: t('core.VotingProcedures.actionId.txHash') + }, + anchor: { + hash: t('core.VotingProcedures.anchor.hash'), + url: t('core.VotingProcedures.anchor.url') + }, + dRepId: t('core.VotingProcedures.dRepId') + }; + return ( - - - - - {errorMessage && ( - - - - )} + <> {data.map(({ voter, votes }, idx) => ( 0 ? '$40' : '$0'}> @@ -71,7 +64,10 @@ export const VotingProcedures = ({ dappInfo, errorMessage, data, translations }: - + {voter.dRepId && ( @@ -89,7 +85,10 @@ export const VotingProcedures = ({ dappInfo, errorMessage, data, translations }: - + {votingProcedure.anchor && ( <> @@ -130,6 +129,6 @@ export const VotingProcedures = ({ dappInfo, errorMessage, data, translations }: ))} - + ); }; diff --git a/packages/core/src/ui/utils/governance-action-mocks.ts b/packages/core/src/ui/utils/governance-action-mocks.ts new file mode 100644 index 000000000..032cdd96f --- /dev/null +++ b/packages/core/src/ui/utils/governance-action-mocks.ts @@ -0,0 +1,221 @@ +/* eslint-disable new-cap */ +/* eslint-disable no-magic-numbers */ +import { Cardano } from '@cardano-sdk/core'; +import { Hash28ByteBase16, Hash32ByteBase16 } from '@cardano-sdk/crypto'; + +const DUMMY_DEPOSIT = '100000' as never as bigint; +const rewardAccount = Cardano.RewardAccount('stake_test1uqrw9tjymlm8wrwq7jk68n6v7fs9qz8z0tkdkve26dylmfc2ux2hj'); +const anchor = { + url: 'anchorUrl', + // eslint-disable-next-line new-cap + dataHash: Hash32ByteBase16(Buffer.from('anchorDataHashanchorDataHashanch').toString('hex')) +}; + +const hardForkInitiationAction = { + __typename: Cardano.GovernanceActionType.hard_fork_initiation_action +} as Cardano.HardForkInitiationAction; +const infoAction = { + __typename: Cardano.GovernanceActionType.info_action +} as Cardano.InfoAction; +const newConstitution = { + __typename: Cardano.GovernanceActionType.new_constitution +} as Cardano.NewConstitution; +const noConfidence = { + __typename: Cardano.GovernanceActionType.no_confidence +} as Cardano.NoConfidence; +const parameterChangeAction = { + __typename: Cardano.GovernanceActionType.parameter_change_action +} as Cardano.ParameterChangeAction; +const treasuryWithdrawalsAction = { + __typename: Cardano.GovernanceActionType.treasury_withdrawals_action +} as Cardano.TreasuryWithdrawalsAction; +const updateCommittee = { + __typename: Cardano.GovernanceActionType.update_committee +} as Cardano.UpdateCommittee; + +export const mockProposalProcedure: Record< + Cardano.GovernanceActionType, + { + governanceAction: Cardano.GovernanceAction; + deposit: Cardano.ProposalProcedure['deposit']; + rewardAccount: Cardano.ProposalProcedure['rewardAccount']; + anchor: Cardano.ProposalProcedure['anchor']; + } +> = { + [Cardano.GovernanceActionType.hard_fork_initiation_action]: { + deposit: DUMMY_DEPOSIT, + rewardAccount, + anchor, + governanceAction: { + ...hardForkInitiationAction, + protocolVersion: { + major: 5, + minor: 0 + } + } + }, + [Cardano.GovernanceActionType.info_action]: { + deposit: DUMMY_DEPOSIT, + rewardAccount, + anchor, + governanceAction: infoAction + }, + [Cardano.GovernanceActionType.new_constitution]: { + deposit: DUMMY_DEPOSIT, + rewardAccount, + anchor, + governanceAction: { + ...newConstitution, + constitution: { + anchor: { + dataHash: Hash32ByteBase16(Buffer.from('anchorDataHashanchorDataHashanch').toString('hex')), + url: 'https://www.someurl.io' + }, + scriptHash: Hash28ByteBase16(Buffer.from('1234567890123456789012345678').toString('hex')) + } + } + }, + [Cardano.GovernanceActionType.no_confidence]: { + deposit: DUMMY_DEPOSIT, + rewardAccount, + anchor, + governanceAction: noConfidence + }, + [Cardano.GovernanceActionType.parameter_change_action]: { + deposit: DUMMY_DEPOSIT, + rewardAccount, + anchor, + governanceAction: { + ...parameterChangeAction, + protocolParamUpdate: { + maxBlockBodySize: 1, + maxTxSize: 2, + maxBlockHeaderSize: 3, + maxValueSize: 4, + maxExecutionUnitsPerTransaction: { + memory: 5, + steps: 6 + }, + maxExecutionUnitsPerBlock: { + memory: 7, + steps: 8 + }, + maxCollateralInputs: 9, + stakeKeyDeposit: 10, + poolDeposit: 11, + minFeeCoefficient: 12, + minFeeConstant: 13, + treasuryExpansion: '14', + monetaryExpansion: '15', + minPoolCost: 16, + coinsPerUtxoByte: 17, + prices: { + memory: 18, + steps: 19 + }, + poolInfluence: '20', + poolRetirementEpochBound: 21, + desiredNumberOfPools: 22, + costModels: new Map([ + [0, [23, 24]], + [1, [25, 26]] + ]), + collateralPercentage: 27, + governanceActionDeposit: 28, + dRepDeposit: 29, + governanceActionValidityPeriod: Cardano.EpochNo(30), + dRepInactivityPeriod: Cardano.EpochNo(31), + minCommitteeSize: 32, + committeeTermLimit: 33, + dRepVotingThresholds: { + motionNoConfidence: { + numerator: 34, + denominator: 35 + }, + committeeNormal: { + numerator: 36, + denominator: 37 + }, + commiteeNoConfidence: { + numerator: 38, + denominator: 39 + }, + updateConstitution: { + numerator: 40, + denominator: 41 + }, + hardForkInitiation: { + numerator: 42, + denominator: 43 + }, + ppNetworkGroup: { + numerator: 44, + denominator: 45 + }, + ppEconomicGroup: { + numerator: 46, + denominator: 47 + }, + ppTechnicalGroup: { + numerator: 48, + denominator: 49 + }, + ppGovernanceGroup: { + numerator: 50, + denominator: 51 + }, + treasuryWithdrawal: { + numerator: 55, + denominator: 56 + } + } + } + } + }, + [Cardano.GovernanceActionType.treasury_withdrawals_action]: { + deposit: DUMMY_DEPOSIT, + rewardAccount, + anchor, + governanceAction: { + ...treasuryWithdrawalsAction, + withdrawals: new Set([ + { rewardAccount, coin: BigInt('10000000') }, + { rewardAccount, coin: BigInt('10000001') } + ]) + } + }, + [Cardano.GovernanceActionType.update_committee]: { + deposit: DUMMY_DEPOSIT, + rewardAccount, + anchor, + governanceAction: { + ...updateCommittee, + membersToBeAdded: new Set([ + { + coldCredential: { + type: 0, + hash: Hash28ByteBase16(Buffer.from('updateCommitteecoldCredenti1').toString('hex')) + }, + epoch: Cardano.EpochNo(1) + }, + { + coldCredential: { + type: 1, + hash: Hash28ByteBase16(Buffer.from('updateCommitteecoldCredenti2').toString('hex')) + }, + epoch: Cardano.EpochNo(2) + } + ]), + membersToBeRemoved: new Set([ + { + type: 0, + hash: Hash28ByteBase16(Buffer.from('updateCommitteecoldCredenti2').toString('hex')) + }, + { + type: 1, + hash: Hash28ByteBase16(Buffer.from('updateCommitteecoldCredenti3').toString('hex')) + } + ]) + } + } +}; diff --git a/packages/core/src/ui/utils/governance-action.ts b/packages/core/src/ui/utils/governance-action.ts new file mode 100644 index 000000000..aa36d5bc8 --- /dev/null +++ b/packages/core/src/ui/utils/governance-action.ts @@ -0,0 +1,377 @@ +import { Cardano } from '@cardano-sdk/core'; +import { Wallet } from '@lace/cardano'; +import { formatPercentages } from '@lace/common'; +import { + HardForkInitiationAction, + InfoAction, + NewConstitutionAction, + NoConfidenceAction, + ParameterChangeAction, + TreasuryWithdrawalsAction, + UpdateCommitteeAction +} from '../components/ProposalProcedures'; + +export const getParameterChangeActionViewData = ({ + governanceAction, + deposit, + rewardAccount, + anchor, + cardanoCoin, + explorerBaseUrl +}: { + governanceAction: Cardano.ParameterChangeAction; + deposit: Cardano.ProposalProcedure['deposit']; + rewardAccount: Cardano.ProposalProcedure['rewardAccount']; + anchor: Cardano.ProposalProcedure['anchor']; + cardanoCoin: Wallet.CoinId; + explorerBaseUrl: string; +}): Parameters[0]['data'] => { + const { + protocolParamUpdate: { + maxBlockBodySize, + maxTxSize, + maxBlockHeaderSize, + maxValueSize, + maxExecutionUnitsPerTransaction, + maxExecutionUnitsPerBlock, + maxCollateralInputs, + stakeKeyDeposit, + poolDeposit, + minFeeCoefficient, + minFeeConstant, + treasuryExpansion, + monetaryExpansion, + minPoolCost, + coinsPerUtxoByte, + prices, + poolInfluence, + poolRetirementEpochBound, + desiredNumberOfPools, + costModels, + collateralPercentage, + governanceActionDeposit, + dRepDeposit, + governanceActionValidityPeriod, + dRepInactivityPeriod, + minCommitteeSize, + committeeTermLimit, + dRepVotingThresholds: { + motionNoConfidence, + committeeNormal, + commiteeNoConfidence, + updateConstitution, + hardForkInitiation, + ppNetworkGroup, + ppEconomicGroup, + ppTechnicalGroup, + ppGovernanceGroup, + treasuryWithdrawal + } + } + } = governanceAction; + + return { + txDetails: { + deposit: Wallet.util.getFormattedAmount({ + amount: deposit.toString(), + cardanoCoin + }), + rewardAccount + }, + anchor: { + url: anchor.url, + hash: anchor.dataHash, + txHashUrl: `${explorerBaseUrl}/${anchor.dataHash}` + }, + protocolParamUpdate: { + maxTxExUnits: { + memory: maxExecutionUnitsPerTransaction.memory.toString(), + step: maxExecutionUnitsPerTransaction.steps.toString() + }, + maxBlockExUnits: { + memory: maxExecutionUnitsPerBlock.memory.toString(), + step: maxExecutionUnitsPerBlock.steps.toString() + }, + networkGroup: { + maxBBSize: maxBlockBodySize.toString(), + maxTxSize: maxTxSize.toString(), + maxBHSize: maxBlockHeaderSize.toString(), + maxValSize: maxValueSize.toString(), + maxCollateralInputs: maxCollateralInputs.toString() + }, + economicGroup: { + minFeeA: minFeeCoefficient.toString(), + minFeeB: minFeeConstant.toString(), + keyDeposit: stakeKeyDeposit.toString(), + poolDeposit: poolDeposit.toString(), + rho: monetaryExpansion, + tau: treasuryExpansion, + minPoolCost: minPoolCost.toString(), + coinsPerUTxOByte: coinsPerUtxoByte.toString(), + price: { + memory: prices.memory.toString(), + step: prices.steps.toString() + } + }, + technicalGroup: { + a0: poolInfluence, + eMax: poolRetirementEpochBound.toString(), + nOpt: desiredNumberOfPools.toString(), + costModels: { + PlutusV1: Object.entries(costModels.get(Cardano.PlutusLanguageVersion.V1)).reduce( + (acc, cur) => ({ ...acc, [cur[0]]: cur[1] }), + {} + ), + PlutusV2: Object.entries(costModels.get(Cardano.PlutusLanguageVersion.V2)).reduce( + (acc, cur) => ({ ...acc, [cur[0]]: cur[1] }), + {} + ) + }, + collateralPercentage: collateralPercentage.toString() + }, + governanceGroup: { + govActionLifetime: governanceActionValidityPeriod.toString(), + govActionDeposit: governanceActionDeposit.toString(), + drepDeposit: dRepDeposit.toString(), + drepActivity: dRepInactivityPeriod.toString(), + ccMinSize: minCommitteeSize.toString(), + ccMaxTermLength: committeeTermLimit.toString(), + dRepVotingThresholds: { + motionNoConfidence: formatPercentages(motionNoConfidence.numerator / motionNoConfidence.denominator), + committeeNormal: formatPercentages(committeeNormal.numerator / committeeNormal.denominator), + committeeNoConfidence: formatPercentages(commiteeNoConfidence.numerator / commiteeNoConfidence.denominator), + updateToConstitution: formatPercentages(updateConstitution.numerator / updateConstitution.denominator), + hardForkInitiation: formatPercentages(hardForkInitiation.numerator / hardForkInitiation.denominator), + ppNetworkGroup: formatPercentages(ppNetworkGroup.numerator / ppNetworkGroup.denominator), + ppEconomicGroup: formatPercentages(ppEconomicGroup.numerator / ppEconomicGroup.denominator), + ppTechnicalGroup: formatPercentages(ppTechnicalGroup.numerator / ppTechnicalGroup.denominator), + ppGovGroup: formatPercentages(ppGovernanceGroup.numerator / ppGovernanceGroup.denominator), + treasuryWithdrawal: formatPercentages(treasuryWithdrawal.numerator / treasuryWithdrawal.denominator) + } + } + } + }; +}; + +export const getHardForkInitiationActionViewData = ({ + governanceAction, + deposit, + rewardAccount, + anchor, + cardanoCoin, + explorerBaseUrl +}: { + governanceAction: Cardano.HardForkInitiationAction; + deposit: Cardano.ProposalProcedure['deposit']; + rewardAccount: Cardano.ProposalProcedure['rewardAccount']; + anchor: Cardano.ProposalProcedure['anchor']; + cardanoCoin: Wallet.CoinId; + explorerBaseUrl: string; +}): Parameters[0]['data'] => ({ + txDetails: { + deposit: Wallet.util.getFormattedAmount({ + amount: deposit.toString(), + cardanoCoin + }), + rewardAccount + }, + procedure: { + anchor: { + url: anchor.url, + hash: anchor.dataHash, + txHashUrl: `${explorerBaseUrl}/${anchor.dataHash}` + } + }, + protocolVersion: { + major: governanceAction.protocolVersion.major.toString(), + minor: governanceAction.protocolVersion.minor.toString() + }, + ...(governanceAction.governanceActionId && { + actionId: { + index: governanceAction.governanceActionId.actionIndex.toString(), + id: governanceAction.governanceActionId.id || '' + } + }) +}); + +export const getInfoActionViewData = ({ + anchor, + explorerBaseUrl +}: { + anchor: Cardano.ProposalProcedure['anchor']; + explorerBaseUrl: string; +}): Parameters[0]['data'] => ({ + txDetails: {}, + procedure: { + anchor: { + url: anchor.url, + hash: anchor.dataHash, + txHashUrl: `${explorerBaseUrl}/${anchor.dataHash}` + } + } +}); + +export const getNewConstitutionActionViewData = ({ + governanceAction, + deposit, + rewardAccount, + anchor, + cardanoCoin, + explorerBaseUrl +}: { + governanceAction: Cardano.NewConstitution; + deposit: Cardano.ProposalProcedure['deposit']; + rewardAccount: Cardano.ProposalProcedure['rewardAccount']; + anchor: Cardano.ProposalProcedure['anchor']; + cardanoCoin: Wallet.CoinId; + explorerBaseUrl: string; +}): Parameters[0]['data'] => ({ + txDetails: { + deposit: Wallet.util.getFormattedAmount({ + amount: deposit.toString(), + cardanoCoin + }), + rewardAccount + }, + procedure: { + anchor: { + url: anchor.url, + hash: anchor.dataHash, + txHashUrl: `${explorerBaseUrl}/${anchor.dataHash}` + } + }, + ...(governanceAction.governanceActionId && { + actionId: { + index: governanceAction.governanceActionId.actionIndex.toString(), + id: governanceAction.governanceActionId.id || '' + } + }), + constitution: { + anchor: { + dataHash: governanceAction.constitution.anchor.dataHash.toString(), + url: governanceAction.constitution.anchor.url.toString() + }, + ...(governanceAction.constitution.scriptHash && { scriptHash: governanceAction.constitution.scriptHash.toString() }) + } +}); + +export const getNoConfidenceActionViewData = ({ + governanceAction, + deposit, + rewardAccount, + anchor, + cardanoCoin, + explorerBaseUrl +}: { + governanceAction: Cardano.NoConfidence; + deposit: Cardano.ProposalProcedure['deposit']; + rewardAccount: Cardano.ProposalProcedure['rewardAccount']; + anchor: Cardano.ProposalProcedure['anchor']; + cardanoCoin: Wallet.CoinId; + explorerBaseUrl: string; +}): Parameters[0]['data'] => ({ + txDetails: { + deposit: Wallet.util.getFormattedAmount({ + amount: deposit.toString(), + cardanoCoin + }), + rewardAccount + }, + procedure: { + anchor: { + url: anchor.url, + hash: anchor.dataHash, + txHashUrl: `${explorerBaseUrl}/${anchor.dataHash}` + } + }, + ...(governanceAction.governanceActionId && { + actionId: { + index: governanceAction.governanceActionId.actionIndex.toString(), + id: governanceAction.governanceActionId.id || '' + } + }) +}); + +export const getTreasuryWithdrawalsActionViewData = ({ + governanceAction, + deposit, + anchor, + rewardAccount, + cardanoCoin, + explorerBaseUrl +}: { + governanceAction: Cardano.TreasuryWithdrawalsAction; + deposit: Cardano.ProposalProcedure['deposit']; + rewardAccount: Cardano.ProposalProcedure['rewardAccount']; + anchor: Cardano.ProposalProcedure['anchor']; + cardanoCoin: Wallet.CoinId; + explorerBaseUrl: string; +}): Parameters[0]['data'] => ({ + txDetails: { + deposit: Wallet.util.getFormattedAmount({ + amount: deposit.toString(), + cardanoCoin + }), + rewardAccount + }, + procedure: { + anchor: { + url: anchor.url, + hash: anchor.dataHash, + txHashUrl: `${explorerBaseUrl}/${anchor.dataHash}` + } + }, + withdrawals: [...governanceAction.withdrawals].map((withdrawal) => ({ + rewardAccount: withdrawal.rewardAccount.toString(), + lovelace: Wallet.util.getFormattedAmount({ + amount: withdrawal.coin.toString(), + cardanoCoin + }) + })) +}); + +export const getUpdateCommitteeActionViewData = ({ + anchor, + cardanoCoin, + deposit, + explorerBaseUrl, + governanceAction, + rewardAccount +}: { + governanceAction: Cardano.UpdateCommittee; + deposit: Cardano.ProposalProcedure['deposit']; + rewardAccount: Cardano.ProposalProcedure['rewardAccount']; + anchor: Cardano.ProposalProcedure['anchor']; + cardanoCoin: Wallet.CoinId; + explorerBaseUrl: string; +}): Parameters[0]['data'] => ({ + txDetails: { + deposit: Wallet.util.getFormattedAmount({ + amount: deposit.toString(), + cardanoCoin + }), + rewardAccount + }, + procedure: { + anchor: { + url: anchor.url, + hash: anchor.dataHash, + txHashUrl: `${explorerBaseUrl}/${anchor.dataHash}` + } + }, + ...(governanceAction.governanceActionId && { + actionId: { + index: governanceAction.governanceActionId.actionIndex.toString(), + id: governanceAction.governanceActionId.id || '' + } + }), + membersToBeAdded: [...governanceAction.membersToBeAdded].map(({ coldCredential: { hash }, epoch }) => ({ + coldCredential: { + hash: hash.toString() + }, + epoch: epoch.toString() + })), + membersToBeRemoved: [...governanceAction.membersToBeRemoved].map(({ hash }) => ({ + hash: hash.toString() + })) +}); diff --git a/packages/core/src/ui/utils/index.ts b/packages/core/src/ui/utils/index.ts index 1892c7749..bc298cbc5 100644 --- a/packages/core/src/ui/utils/index.ts +++ b/packages/core/src/ui/utils/index.ts @@ -2,3 +2,5 @@ export * from './sanitize-number'; export * from './handle'; export * from './address-form'; export * from './render-address-tag'; +export * from './governance-action'; +export * from './governance-action-mocks'; diff --git a/packages/core/src/ui/utils/voting-procedures-mock.ts b/packages/core/src/ui/utils/voting-procedures-mock.ts new file mode 100644 index 000000000..9b924d6c0 --- /dev/null +++ b/packages/core/src/ui/utils/voting-procedures-mock.ts @@ -0,0 +1,52 @@ +import { Wallet } from '@lace/cardano'; + +export const mockVotingProcedures = [ + { + voter: { + __typename: Wallet.Cardano.VoterType.dRepKeyHash, + credential: { + type: Wallet.Cardano.CredentialType.KeyHash, + hash: Wallet.Crypto.Hash28ByteBase16(Buffer.from('dRepCredentialHashdRepCrede1').toString('hex')) + } + }, + votes: [ + { + actionId: { + id: Wallet.Cardano.TransactionId('724a0a88b9470a714fc5bf84daf5851fa259a9b89e1a5453f6f5cd6595ad9820'), + actionIndex: 0 + }, + votingProcedure: { + vote: Wallet.Cardano.Vote.yes, + anchor: { + url: 'anchorUrl', + dataHash: Wallet.Crypto.Hash32ByteBase16(Buffer.from('anchorDataHashanchorDataHashanc1').toString('hex')) + } + } + } + ] + }, + { + voter: { + __typename: Wallet.Cardano.VoterType.ccHotKeyHash, + credential: { + type: Wallet.Cardano.CredentialType.KeyHash, + hash: Wallet.Crypto.Hash28ByteBase16(Buffer.from('dRepCredentialHashdRepCrede2').toString('hex')) + } + }, + votes: [ + { + actionId: { + id: Wallet.Cardano.TransactionId('55555a88b9470a714fc5bf84daf5851fa259a9b89e1a5453f6f5cd6595ad9820'), + actionIndex: 0 + }, + votingProcedure: { + vote: Wallet.Cardano.Vote.yes, + anchor: { + url: 'anchorUrl', + dataHash: Wallet.Crypto.Hash32ByteBase16(Buffer.from('anchorDataHashanchorDataHashanc2').toString('hex')) + } + } + } + ] + } +];