Skip to content

Commit ee09782

Browse files
zuzunkerzuzunker
authored
Merge pull request #4501 from Cerkoryn/drep-neutrality
Make dRep selection more neutral and dRep-agnostic
2 parents 9507f60 + ac711c7 commit ee09782

File tree

10 files changed

+57
-209
lines changed

10 files changed

+57
-209
lines changed

‎packages/yoroi-extension/app/UI/components/DrepPromotionBanner/DrepPromotionBanner.tsx‎

Lines changed: 2 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -2,11 +2,9 @@ import { Button, Stack, Typography, styled, useTheme } from '@mui/material';
22
import BigNumber from 'bignumber.js';
33
import { observer } from 'mobx-react';
44
import { useCallback, useEffect, useMemo, useState } from 'react';
5-
import { dRepNormalize } from '../../../api/ada/lib/cardanoCrypto/utils';
65
import LocalStorageApi from '../../../api/localStorage/index';
76
import globalMessages from '../../../i18n/global-messages';
87
import { ROUTES } from '../../../routes-config';
9-
import { YOROI_DREP_ID } from '../../features/governace/common/constants';
108
import { IconWrapper, Icons } from '../icons';
119
import { Ilustration } from './Ilustration';
1210

@@ -71,17 +69,14 @@ export const DrepPromotionBanner = observer(({ stores, onClose, intl }) => {
7169

7270
const [governanceInfo, setGovernanceInfo] = useState({
7371
isParticipatingToGovernance: false,
74-
isDelegatingToYoroiDrep: false,
7572
});
7673

7774
useEffect(() => {
7875
const getGovStatus = () => {
7976
const govInfo = stores.delegation.governanceStatus?.drepDelegation;
8077
if (govInfo) {
8178
const isParticipatingToGovernance = govInfo !== null;
82-
const drepEncoded = dRepNormalize(govInfo?.drep, govInfo?.drepKind);
83-
const isDelegatingToYoroiDrep = isParticipatingToGovernance && drepEncoded === YOROI_DREP_ID;
84-
setGovernanceInfo({ isParticipatingToGovernance, isDelegatingToYoroiDrep });
79+
setGovernanceInfo({ isParticipatingToGovernance });
8580
}
8681
};
8782

@@ -126,10 +121,7 @@ export const DrepPromotionBanner = observer(({ stores, onClose, intl }) => {
126121
},
127122
}}
128123
onClick={() => {
129-
stores.routing.goToRoute({
130-
route: ROUTES.GOVERNANCE.ROOT,
131-
query: { delegateToYoroiDrep: true },
132-
});
124+
stores.routing.goToRoute({ route: ROUTES.GOVERNANCE.ROOT });
133125
}}
134126
>
135127
{intl.formatMessage(globalMessages.delegateVote)}

‎packages/yoroi-extension/app/UI/features/governace/common/constants.ts‎

Lines changed: 0 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -5,23 +5,12 @@ import {
55

66
export const LEARN_MORE_LINK =
77
'https://help.yoroi-wallet.com/en/article/how-can-i-participate-in-governance-through-yoroi-155o8l3/ ';
8-
export const YOROI_VOTING_RECORD_LINK =
9-
'https://2025budget.intersectmbo.org/voters/drep1ygr9tuapcanc3kpeyy4dc3vmrz9cfe5q7v9wj3x9j0ap3tswtre9j';
108
export const FIND_DREPS_LINK = 'https://beta.cexplorer.io/drep?tab=list';
119
export const FIND_DREPS_LINK_TESTNET = 'https://preprod.cexplorer.io/drep';
12-
export const YOROI_DREP_ID = 'drep1ygr9tuapcanc3kpeyy4dc3vmrz9cfe5q7v9wj3x9j0ap3tswtre9j';
13-
export const YOROI_DREP_ID_TESTNET = 'drep1y23nc498g205wtvp9esysyxam0n7msusm5d734xqlzhvkgq3pn5r7';
14-
export const EMURGO_DREP_ID = 'drep1ytvlwvyjmzfyn56n0zz4f6lj94wxhmsl5zky6knnzrf4jygpyahug';
1510

1611
export const DREP_ALWAYS_ABSTAIN = API_ABSTAIN;
1712
export const DREP_ALWAYS_NO_CONFIDENCE = API_NO_CONFIDENCE;
1813

19-
export const drepNames = {
20-
[YOROI_DREP_ID]: 'Yoroi W₳llet',
21-
[EMURGO_DREP_ID]: 'EMURGO',
22-
[YOROI_DREP_ID_TESTNET]: 'Testnet DRep',
23-
};
24-
2514
export const GOVERNANCE_STATUS = {
2615
IDLE: 'idle',
2716
HOVER: 'hover',

‎packages/yoroi-extension/app/UI/features/governace/common/hooks/useGovernanceDelegationStatus.tsx‎

Lines changed: 7 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import * as React from 'react';
2-
import { DREP_ALWAYS_ABSTAIN, DREP_ALWAYS_NO_CONFIDENCE, YOROI_DREP_ID, YOROI_DREP_ID_TESTNET } from '../../common/constants';
2+
import { DREP_ALWAYS_ABSTAIN, DREP_ALWAYS_NO_CONFIDENCE } from '../../common/constants';
33
import { useGovernance } from '../../module/GovernanceContextProvider';
44

55
type UseGovernanceDelegationStatusParams = {
@@ -10,33 +10,27 @@ type UseGovernanceDelegationStatusParams = {
1010
type UseGovernanceDelegationStatusResult = {
1111
isAbstain: boolean;
1212
isNoConfidence: boolean;
13-
isDelegationToYoroiDrep: boolean;
14-
isDelegationToOtherDrep: boolean;
13+
isDelegationToDrep: boolean;
1514
drepID: string;
1615
};
1716

1817
export const useGovernanceDelegationStatus = ({
1918
governanceStatus,
2019
isDelegated,
2120
}: UseGovernanceDelegationStatusParams): UseGovernanceDelegationStatusResult => {
22-
const { isTestnet } = useGovernance();
23-
2421
return React.useMemo(() => {
25-
const yoroiDrepId = isTestnet ? YOROI_DREP_ID_TESTNET : YOROI_DREP_ID;
26-
const drepID = governanceStatus?.drep ? governanceStatus?.drep : yoroiDrepId;
22+
const drepID = governanceStatus?.drep ?? null;
2723

2824
const isAbstain = isDelegated && governanceStatus?.drep === null && governanceStatus?.status === DREP_ALWAYS_ABSTAIN;
2925
const isNoConfidence =
3026
isDelegated && governanceStatus?.drep === null && governanceStatus?.status === DREP_ALWAYS_NO_CONFIDENCE;
31-
const isDelegationToYoroiDrep = isDelegated && !(isAbstain || isNoConfidence) && drepID === yoroiDrepId;
32-
const isDelegationToOtherDrep = isDelegated && !(isAbstain || isNoConfidence) && drepID !== yoroiDrepId;
27+
const isDelegationToDrep = isDelegated && !(isAbstain || isNoConfidence) && drepID != null;
3328

3429
return {
3530
isAbstain,
3631
isNoConfidence,
37-
isDelegationToYoroiDrep,
38-
isDelegationToOtherDrep,
39-
drepID,
32+
isDelegationToDrep,
33+
drepID: drepID ?? '',
4034
};
41-
}, [governanceStatus?.status, governanceStatus?.drep, isDelegated, isTestnet]);
35+
}, [governanceStatus?.status, governanceStatus?.drep, isDelegated]);
4236
};

‎packages/yoroi-extension/app/UI/features/governace/common/hooks/useStrings.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -168,7 +168,7 @@ export const messages = Object.freeze(
168168
},
169169
chooseDelegationOption: {
170170
id: 'governance.chooseDelegationOption',
171-
defaultMessage: '!!!Choose to delegate your voting power to Yoroi DRep or explore other options',
171+
defaultMessage: '!!!Your delegation to DReps helps shaping Cardano’s future. You may change your governance status at any time.',
172172
},
173173
exploreOtherDRepsOrAbstain: {
174174
id: 'governance.exploreOtherDRepsOrAbstain',

‎packages/yoroi-extension/app/UI/features/governace/useCases/GovernanceOptions/DRepOptions.tsx‎

Lines changed: 9 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@ import { useGovernance } from '../../module/GovernanceContextProvider';
99
import { useGovernanceDelegationToYoroiDrep } from '../../common/hooks/useGovernanceDelegationToYoroiDrep';
1010
import { useGovernanceStatusState } from '../../common/hooks/useGovernanceStatusState';
1111
import { useGovernanceDelegationStatus } from '../../common/hooks/useGovernanceDelegationStatus';
12-
import { GOVERNANCE_STATUS, YOROI_DREP_ID, YOROI_DREP_ID_TESTNET, YOROI_VOTING_RECORD_LINK } from '../../common/constants';
12+
import { GOVERNANCE_STATUS } from '../../common/constants';
1313
import { OptionsSkeletonScreen } from '../../common/SkeletonCardLoaders';
1414

1515
interface DRepOptionsScreenProps {}
@@ -19,14 +19,14 @@ export const DRepOptions: React.FC<DRepOptionsScreenProps> = () => {
1919
const strings = useStrings();
2020
const theme: any = useTheme();
2121

22-
const { submitedTransactions, isTestnet } = useGovernance();
23-
const { loadingUnsignTx, delegateToDrep, openDelegateModalForCustomDrep, delegateToAbstain, delegateToNoConfidence } =
22+
const { submitedTransactions } = useGovernance();
23+
const { loadingUnsignTx, openDelegateModalForCustomDrep, delegateToAbstain, delegateToNoConfidence } =
2424
useGovernanceDelegationToYoroiDrep();
2525
const isPendingDrepDelegationTx = submitedTransactions.length > 0 && submitedTransactions[0]?.isDrepDelegation === true;
2626

2727
const { governanceStatusState: cardState, governanceStatus } = useGovernanceStatusState();
2828
const isDelegated = cardState === GOVERNANCE_STATUS.DELEGATED;
29-
const { isAbstain, isNoConfidence, isDelegationToYoroiDrep, isDelegationToOtherDrep } = useGovernanceDelegationStatus({
29+
const { isAbstain, isNoConfidence, isDelegationToDrep } = useGovernanceDelegationStatus({
3030
governanceStatus,
3131
isDelegated,
3232
});
@@ -35,40 +35,23 @@ export const DRepOptions: React.FC<DRepOptionsScreenProps> = () => {
3535
navigateTo.selectRevampStatus();
3636
};
3737

38-
const drepYoroiId = isTestnet ? YOROI_DREP_ID_TESTNET : YOROI_DREP_ID;
39-
4038
const drepOptionsConfig = [
41-
{
42-
key: 'yoroi',
43-
title: isTestnet ? strings.yoroiTestnetDRep : strings.yoroiDRep,
44-
description: strings.yoroiDRepInfo,
45-
buttonText: strings.delegateLabel,
46-
variant: 'primary' as const,
47-
icon: <Icon.YoroiLogo fill={theme.palette.ds.gray_min} />,
48-
onAction: () => delegateToDrep(drepYoroiId),
49-
onViewDetails: isTestnet ? undefined : () => window.open(YOROI_VOTING_RECORD_LINK, '_blank'),
50-
status: cardState,
51-
drepId: governanceStatus.drep,
52-
isDelegated: isDelegationToYoroiDrep,
53-
},
5439
{
5540
key: 'others',
56-
title: strings.otherDReps,
57-
description: strings.designatingSomeoneElse,
58-
buttonText: isDelegationToOtherDrep ? strings.delegateToOtherDrep : strings.delegateLabel,
59-
variant: 'outlined' as const,
41+
title: strings.delegateToDRep,
42+
description: strings.identifyDrep,
43+
buttonText: isDelegationToDrep ? strings.changeToDrep : strings.delegateLabel,
6044
icon: <Icon.VotingDrep />,
6145
onAction: () => openDelegateModalForCustomDrep(),
6246
status: cardState,
6347
drepId: governanceStatus.drep,
64-
isDelegated: isDelegationToOtherDrep,
48+
isDelegated: isDelegationToDrep,
6549
},
6650
{
6751
key: 'abstain',
6852
title: strings.abstain,
6953
description: strings.chooseAbstain,
7054
buttonText: isAbstain ? strings.changeToDrep : strings.delegateLabel,
71-
variant: 'outlined' as const,
7255
icon: <Icon.VotingAbstain />,
7356
onAction: () => (isAbstain ? openDelegateModalForCustomDrep() : delegateToAbstain()),
7457
status: cardState,
@@ -80,7 +63,6 @@ export const DRepOptions: React.FC<DRepOptionsScreenProps> = () => {
8063
title: strings.noConfidence,
8164
description: strings.chooseNoConfidence,
8265
buttonText: isNoConfidence ? strings.changeToDrep : strings.delegateLabel,
83-
variant: 'outlined' as const,
8466
icon: <Icon.VotingNoConfidence />,
8567
onAction: () => (isNoConfidence ? openDelegateModalForCustomDrep() : delegateToNoConfidence()),
8668
status: cardState,
@@ -101,7 +83,7 @@ export const DRepOptions: React.FC<DRepOptionsScreenProps> = () => {
10183
<TitleSection>
10284
<Typography variant="h5">{strings.chooseVotingPower}</Typography>
10385
<Typography variant="body1" color="ds.text_gray_low">
104-
{strings.letYoroiDRepVoteForYou}
86+
{strings.chooseDelegationOption}
10587
</Typography>
10688
</TitleSection>
10789

@@ -113,10 +95,8 @@ export const DRepOptions: React.FC<DRepOptionsScreenProps> = () => {
11395
title={option.title}
11496
description={option.description}
11597
buttonText={option.buttonText}
116-
variant={option.variant}
11798
icon={option.icon}
11899
onAction={option.onAction}
119-
onViewDetails={option.onViewDetails}
120100
status={option.status}
121101
drepId={option.drepId}
122102
isDelegated={option.isDelegated}

‎packages/yoroi-extension/app/UI/features/governace/useCases/GovernanceOptions/DrepOptionsCard.tsx‎

Lines changed: 18 additions & 63 deletions
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,16 @@
1-
import { Box, Typography, Button, Stack, Link } from '@mui/material';
1+
import { Box, Typography, Button } from '@mui/material';
22
import { styled } from '@mui/system';
33
import { useStrings } from '../../common/hooks/useStrings';
44
import { GOVERNANCE_STATUS, GovernanceStatusState } from '../../common/constants';
5-
import { LoadingButton } from '@mui/lab';
65
import { CopyButton } from '../../../../components';
76
import { truncateFormatter } from '../../../../common/helpers/formatters';
87

98
interface ActionCardProps {
109
title: string;
1110
description: string;
1211
buttonText: string;
13-
variant: 'primary' | 'outlined';
1412
icon?: React.ReactNode;
1513
onAction: () => void;
16-
onViewDetails?: () => void;
1714
status: GovernanceStatusState;
1815
drepId: string | null;
1916
isDelegated: boolean;
@@ -24,22 +21,18 @@ export const DrepOptionsCard: React.FC<ActionCardProps> = ({
2421
title,
2522
description,
2623
buttonText,
27-
variant,
2824
icon,
2925
onAction,
30-
onViewDetails,
3126
status,
3227
drepId,
3328
isDelegated,
3429
pending = false,
3530
}) => {
36-
const strings = useStrings();
37-
3831
return (
39-
<ActionCardContainer variant={variant} status={status} isCardDelegated={isDelegated} pending={pending}>
32+
<ActionCardContainer status={status} isCardDelegated={isDelegated} pending={pending}>
4033
<CardWrapper>
4134
<CardTitleRow>
42-
<CardIcon variant={variant} isDelegated={isDelegated}>
35+
<CardIcon isDelegated={isDelegated}>
4336
{icon}
4437
</CardIcon>
4538
<Typography variant="h5">{title}</Typography>
@@ -51,36 +44,15 @@ export const DrepOptionsCard: React.FC<ActionCardProps> = ({
5144
</CardWrapper>
5245

5346
<CTASet>
54-
{variant === 'primary' ? (
55-
<Stack direction="column" spacing={12} width="100%">
56-
{(status === GOVERNANCE_STATUS.DELEGATED || drepId === null) && !isDelegated && (
57-
// @ts-ignore
58-
<LoadingButton variant="primary" onClick={onAction} fullWidth height="40px">
59-
{buttonText}
60-
</LoadingButton>
61-
)}
62-
63-
{onViewDetails && (
64-
<Link
65-
textAlign="center"
66-
onClick={e => {
67-
e.stopPropagation();
68-
onViewDetails();
69-
}}
70-
rel="noopener"
71-
underline="hover"
72-
sx={{ cursor: 'pointer' }}
73-
>
74-
{strings.yoroiVotingRecord}
75-
</Link>
76-
)}
77-
</Stack>
78-
) : (
79-
// @ts-ignore
80-
<Button height="40px" variant="secondary" onClick={onAction} fullWidth sx={{ padding: '13px 10px !important' }}>
81-
{buttonText}
82-
</Button>
83-
)}
47+
<Button
48+
fullWidth
49+
onClick={onAction}
50+
sx={{ height: '40px', padding: '13px 10px !important' }}
51+
/* @ts-ignore */
52+
variant="secondary"
53+
>
54+
{buttonText}
55+
</Button>
8456
</CTASet>
8557
</ActionCardContainer>
8658
);
@@ -147,26 +119,23 @@ const DelegatingLabel = () => {
147119
);
148120
};
149121

150-
type ActionCardVariant = 'primary' | 'outlined';
151-
152122
interface ActionCardContainerProps {
153-
variant: ActionCardVariant;
154123
status: GovernanceStatusState;
155124
isCardDelegated?: boolean;
156125
pending?: boolean;
157126
}
158127

159128
export const ActionCardContainer = styled(Box, {
160-
shouldForwardProp: prop => prop !== 'variant' && prop !== 'status' && prop !== 'isCardDelegated' && prop !== 'pending',
161-
})<ActionCardContainerProps>(({ pending, theme, variant, status, isCardDelegated }: any) => {
129+
shouldForwardProp: prop => prop !== 'status' && prop !== 'isCardDelegated' && prop !== 'pending',
130+
})<ActionCardContainerProps>(({ pending, theme, status, isCardDelegated }: any) => {
162131
const base: React.CSSProperties = {
163132
boxSizing: 'border-box',
164133
display: 'flex',
165134
flexDirection: 'column',
166135
justifyContent: 'space-between',
167136
alignItems: 'flex-start',
168137
padding: '16px',
169-
gap: variant === 'primary' ? '16px' : '12px',
138+
gap: '12px',
170139
width: '294px',
171140
height: '320px',
172141
borderRadius: '8px',
@@ -191,15 +160,6 @@ export const ActionCardContainer = styled(Box, {
191160
background: theme.palette.ds.bg_gradient_2,
192161
};
193162
}
194-
if (variant === 'primary') {
195-
return {
196-
...base,
197-
backgroundImage: theme.palette.ds.bg_gradient_1,
198-
'&:hover': {
199-
backgroundImage: theme.palette.ds.bg_gradient_2,
200-
},
201-
};
202-
}
203163

204164
return {
205165
...base,
@@ -240,16 +200,11 @@ const CardTitleRow = styled(Box)(() => ({
240200
}));
241201

242202
const CardIcon = styled(Box, {
243-
shouldForwardProp: prop => prop !== 'variant' && prop !== 'isDelegated',
244-
})<{ variant: 'primary' | 'outlined'; isDelegated?: boolean }>(({ variant, isDelegated, theme }: any) => ({
203+
shouldForwardProp: prop => prop !== 'isDelegated',
204+
})<{ isDelegated?: boolean }>(({ isDelegated, theme }: any) => ({
245205
width: '48px',
246206
height: '48px',
247-
background:
248-
variant === 'primary'
249-
? theme.palette.ds.primary_500
250-
: isDelegated
251-
? theme.palette.ds.secondary_200
252-
: theme.palette.ds.gray_100,
207+
background: isDelegated ? theme.palette.ds.secondary_200 : theme.palette.ds.gray_100,
253208
borderRadius: '1200px',
254209
display: 'flex',
255210
alignItems: 'center',

0 commit comments

Comments
 (0)