Skip to content

Commit 03dff0d

Browse files
committed
Refactor deploy action row components to accept individual props instead of deploy objects and add optional contractLink and accountLink support.
1 parent 51b6ba6 commit 03dff0d

9 files changed

Lines changed: 189 additions & 96 deletions

src/apps/popup/pages/deploy-details/components/action-rows/associated-action-rows.tsx

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -20,13 +20,15 @@ interface AssociatedActionRowsProps {
2020
contractPackageHash: string;
2121
contractName: string;
2222
callerAccountInfo: Maybe<IAccountInfo>;
23+
contractLink?: Maybe<string>;
2324
}
2425

2526
export const AssociatedActionRows = ({
2627
publicKey,
2728
contractPackageHash,
2829
contractName,
29-
callerAccountInfo
30+
callerAccountInfo,
31+
contractLink
3032
}: AssociatedActionRowsProps) => {
3133
const { t } = useTranslation();
3234

@@ -47,6 +49,7 @@ export const AssociatedActionRows = ({
4749
isAction
4850
csprName={callerAccountInfo?.csprName}
4951
imgLogo={callerAccountInfo?.brandingLogo}
52+
accountLink={callerAccountInfo?.explorerLink}
5053
/>
5154
</AlignedFlexRow>
5255
<AlignedFlexRow gap={SpacingSize.Small}>
@@ -59,7 +62,7 @@ export const AssociatedActionRows = ({
5962
accountName={contractName}
6063
iconUrl={DeployIcon.AssociatedKeys}
6164
/>
62-
<Link color="contentAction" href={link} target="_blank">
65+
<Link color="contentAction" href={contractLink ?? link} target="_blank">
6366
<Typography type="captionRegular">{contractName}</Typography>
6467
</Link>
6568
</AlignedFlexRow>

src/apps/popup/pages/deploy-details/components/action-rows/auction-action-rows.tsx

Lines changed: 37 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,6 @@ import {
1111
AmountRow,
1212
ContainerWithAmount
1313
} from '@popup/pages/deploy-details/components/common';
14-
import { getEntryPointName } from '@popup/pages/deploy-details/utils';
1514

1615
import { AccountInfoRow } from '@libs/ui/components/account-info-row/account-info-row';
1716

@@ -20,19 +19,22 @@ const ManageAuctionBidAction = ({
2019
title,
2120
fiatAmount,
2221
contractPackageHash,
23-
contractName
22+
contractName,
23+
contractLink
2424
}: {
2525
amount: string;
2626
title: string;
2727
fiatAmount: string;
2828
contractPackageHash: string;
2929
contractName: string;
30+
contractLink?: Maybe<string>;
3031
}) => (
3132
<ActionContainerWithLink
3233
title={title}
3334
contractName={contractName}
3435
contractIcon={DeployIcon.Auction}
3536
contractPackageHash={contractPackageHash}
37+
contractLink={contractLink}
3638
>
3739
<AmountRow
3840
amount={amount}
@@ -77,6 +79,7 @@ const DelegationAuctionAction = ({
7779
isAction
7880
iconSize={20}
7981
csprName={toValidatorAccountInfo?.csprName}
82+
accountLink={toValidatorAccountInfo?.explorerLink}
8083
/>
8184
)}
8285
{(isUndelegate || isRedelegate) && (
@@ -89,6 +92,7 @@ const DelegationAuctionAction = ({
8992
isAction
9093
iconSize={20}
9194
csprName={fromValidatorAccountInfo?.csprName}
95+
accountLink={fromValidatorAccountInfo?.explorerLink}
9296
/>
9397
<AccountInfoRow
9498
publicKey={toValidator}
@@ -98,6 +102,7 @@ const DelegationAuctionAction = ({
98102
isAction
99103
iconSize={20}
100104
csprName={toValidatorAccountInfo?.csprName}
105+
accountLink={toValidatorAccountInfo?.explorerLink}
101106
/>
102107
</>
103108
)}
@@ -106,19 +111,32 @@ const DelegationAuctionAction = ({
106111
};
107112

108113
interface AuctionActionRowsProps {
109-
deploy: IAuctionDeploy;
114+
entryPoint: IAuctionDeploy['entryPoint'];
115+
formattedDecimalAmount: IAuctionDeploy['formattedDecimalAmount'];
116+
fiatAmount: IAuctionDeploy['fiatAmount'];
117+
fromValidator: IAuctionDeploy['fromValidator'];
118+
toValidator: IAuctionDeploy['toValidator'];
119+
fromValidatorAccountInfo: IAuctionDeploy['fromValidatorAccountInfo'];
120+
toValidatorAccountInfo: IAuctionDeploy['toValidatorAccountInfo'];
121+
contractName: IAuctionDeploy['contractName'];
122+
contractPackageHash: IAuctionDeploy['contractPackageHash'];
123+
title: string;
124+
contractLink?: Maybe<string>;
110125
}
111126

112-
export const AuctionActionRows = ({ deploy }: AuctionActionRowsProps) => {
113-
const {
114-
entryPoint,
115-
formattedDecimalAmount,
116-
fiatAmount,
117-
fromValidator,
118-
toValidator,
119-
fromValidatorAccountInfo,
120-
toValidatorAccountInfo
121-
} = deploy;
127+
export const AuctionActionRows = ({
128+
entryPoint,
129+
formattedDecimalAmount,
130+
fiatAmount,
131+
fromValidator,
132+
toValidator,
133+
fromValidatorAccountInfo,
134+
toValidatorAccountInfo,
135+
contractPackageHash,
136+
contractName,
137+
title,
138+
contractLink
139+
}: AuctionActionRowsProps) => {
122140
const isManageAuctionBidDeploy =
123141
entryPoint === AuctionDeployEntryPoint.activate ||
124142
entryPoint === AuctionDeployEntryPoint.withdraw ||
@@ -129,16 +147,15 @@ export const AuctionActionRows = ({ deploy }: AuctionActionRowsProps) => {
129147
entryPoint === AuctionDeployEntryPoint.undelegate ||
130148
entryPoint === AuctionDeployEntryPoint.redelegate;
131149

132-
const title = getEntryPointName(deploy, true);
133-
134150
if (isManageAuctionBidDeploy) {
135151
return (
136152
<ManageAuctionBidAction
137153
amount={formattedDecimalAmount}
138154
title={title}
139155
fiatAmount={fiatAmount}
140-
contractName={deploy.contractName}
141-
contractPackageHash={deploy.contractPackageHash}
156+
contractName={contractName}
157+
contractPackageHash={contractPackageHash}
158+
contractLink={contractLink}
142159
/>
143160
);
144161
}
@@ -161,8 +178,9 @@ export const AuctionActionRows = ({ deploy }: AuctionActionRowsProps) => {
161178
return (
162179
<DefaultActionRows
163180
title={title}
164-
contractPackageHash={deploy.contractPackageHash}
165-
contractName={deploy.contractName}
181+
contractPackageHash={contractPackageHash}
182+
contractName={contractName}
183+
contractLink={contractLink}
166184
iconUrl={DeployIcon.Auction}
167185
/>
168186
);

src/apps/popup/pages/deploy-details/components/action-rows/cep18-action-rows.tsx

Lines changed: 30 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
import { ICep18Deploy } from 'casper-wallet-core/src/domain/deploys/entities';
2+
import { Maybe } from 'casper-wallet-core/src/typings/common';
23
import React from 'react';
34

45
import { Cep18DeployEntryPoint, DeployIcon } from '@src/constants';
@@ -9,32 +10,39 @@ import {
910
ContractInfoRow,
1011
SimpleContainer
1112
} from '@popup/pages/deploy-details/components/common';
12-
import { getEntryPointName } from '@popup/pages/deploy-details/utils';
1313

1414
import { AccountInfoRow } from '@libs/ui/components/account-info-row/account-info-row';
1515

1616
interface Cep18ActionRowsProps {
17-
deploy: ICep18Deploy;
17+
title: string;
18+
entryPoint: ICep18Deploy['entryPoint'];
19+
recipientKey: ICep18Deploy['recipientKey'];
20+
contractPackageHash: ICep18Deploy['contractPackageHash'];
21+
contractName: ICep18Deploy['contractName'];
22+
formattedDecimalAmount: ICep18Deploy['formattedDecimalAmount'];
23+
recipientAccountInfo: ICep18Deploy['recipientAccountInfo'];
24+
symbol: ICep18Deploy['symbol'];
25+
iconUrl: ICep18Deploy['iconUrl'];
26+
contractLink?: Maybe<string>;
1827
}
1928

20-
export const Cep18ActionRows = ({ deploy }: Cep18ActionRowsProps) => {
21-
const {
22-
entryPoint,
23-
recipientKey,
24-
contractPackageHash,
25-
contractName,
26-
formattedDecimalAmount,
27-
recipientAccountInfo,
28-
symbol,
29-
iconUrl
30-
} = deploy;
29+
export const Cep18ActionRows = ({
30+
title,
31+
entryPoint,
32+
recipientKey,
33+
contractPackageHash,
34+
contractName,
35+
formattedDecimalAmount,
36+
recipientAccountInfo,
37+
symbol,
38+
iconUrl,
39+
contractLink
40+
}: Cep18ActionRowsProps) => {
3141
const isTransfer = entryPoint === Cep18DeployEntryPoint.transfer;
3242
const isMint = entryPoint === Cep18DeployEntryPoint.mint;
3343
const isBurn = entryPoint === Cep18DeployEntryPoint.burn;
3444
const isApprove = entryPoint === Cep18DeployEntryPoint.approve;
3545

36-
const title = getEntryPointName(deploy, true);
37-
3846
if (isTransfer || isMint) {
3947
return (
4048
<SimpleContainer title={title}>
@@ -45,6 +53,7 @@ export const Cep18ActionRows = ({ deploy }: Cep18ActionRowsProps) => {
4553
iconUrl={iconUrl}
4654
defaultSvg={DeployIcon.Cep18Default}
4755
additionalInfo="token(s)"
56+
contractLink={contractLink}
4857
/>
4958
<AccountInfoRow
5059
publicKey={recipientKey}
@@ -53,6 +62,7 @@ export const Cep18ActionRows = ({ deploy }: Cep18ActionRowsProps) => {
5362
iconSize={20}
5463
csprName={recipientAccountInfo?.csprName}
5564
imgLogo={recipientAccountInfo?.brandingLogo}
65+
accountLink={recipientAccountInfo?.explorerLink}
5666
/>
5767
</SimpleContainer>
5868
);
@@ -72,13 +82,15 @@ export const Cep18ActionRows = ({ deploy }: Cep18ActionRowsProps) => {
7282
iconUrl={iconUrl}
7383
defaultSvg={DeployIcon.Cep18Default}
7484
additionalInfo="token(s)"
85+
contractLink={contractLink}
7586
/>
7687
<AccountInfoRow
7788
publicKey={recipientKey}
7889
label="to"
7990
iconSize={20}
8091
csprName={recipientAccountInfo?.csprName}
8192
imgLogo={recipientAccountInfo?.brandingLogo}
93+
accountLink={recipientAccountInfo?.explorerLink}
8294
/>
8395
</SimpleContainer>
8496
);
@@ -94,6 +106,7 @@ export const Cep18ActionRows = ({ deploy }: Cep18ActionRowsProps) => {
94106
iconUrl={iconUrl}
95107
defaultSvg={DeployIcon.Cep18Default}
96108
additionalInfo="token(s)"
109+
contractLink={contractLink}
97110
/>
98111
<AccountInfoRow
99112
publicKey={recipientKey}
@@ -102,6 +115,7 @@ export const Cep18ActionRows = ({ deploy }: Cep18ActionRowsProps) => {
102115
iconSize={20}
103116
csprName={recipientAccountInfo?.csprName}
104117
imgLogo={recipientAccountInfo?.brandingLogo}
118+
accountLink={recipientAccountInfo?.explorerLink}
105119
/>
106120
</SimpleContainer>
107121
);
@@ -114,6 +128,7 @@ export const Cep18ActionRows = ({ deploy }: Cep18ActionRowsProps) => {
114128
contractName={contractName}
115129
iconUrl={iconUrl || DeployIcon.Cep18Default}
116130
additionalInfo="CEP-18 Token"
131+
contractLink={contractLink}
117132
/>
118133
);
119134
};

0 commit comments

Comments
 (0)