Skip to content

Commit 18af9be

Browse files
marslavishmarslavish
committed
feat: update staking
1 parent 210e900 commit 18af9be

20 files changed

+416
-271
lines changed

‎templates/chain-admin/components/staking/AllValidators.tsx

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,5 @@
11
import { useState } from 'react';
22
import { Text } from '@interchain-ui/react';
3-
import { ChainName } from 'cosmos-kit';
43

54
import { DelegateModal } from './DelegateModal';
65
import AllValidatorsList from './AllValidatorsList';
@@ -20,7 +19,7 @@ export const AllValidators = ({
2019
balance: string;
2120
updateData: () => void;
2221
unbondingDays: string;
23-
chainName: ChainName;
22+
chainName: string;
2423
logos: {
2524
[key: string]: string;
2625
};

‎templates/chain-admin/components/staking/AllValidatorsList.tsx

Lines changed: 4 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,5 @@
11
import React, { Dispatch, SetStateAction, useMemo } from 'react';
2-
import { ChainName } from 'cosmos-kit';
3-
import { useChain } from '@cosmos-kit/react';
2+
import { useChain } from '@interchain-kit/react';
43
import {
54
Text,
65
Button,
@@ -24,15 +23,15 @@ const AllValidatorsList = ({
2423
setSelectedValidator,
2524
}: {
2625
validators: Validator[];
27-
chainName: ChainName;
26+
chainName: string;
2827
openModal: () => void;
2928
setSelectedValidator: Dispatch<SetStateAction<Validator | undefined>>;
3029
logos: {
3130
[key: string]: string;
3231
};
3332
}) => {
34-
const { assets } = useChain(chainName);
35-
const coin = getNativeAsset(assets!);
33+
const { assetList } = useChain(chainName);
34+
const coin = getNativeAsset(assetList);
3635

3736
const columns = useMemo(() => {
3837
const _columns: GridColumn[] = [

‎templates/chain-admin/components/staking/DelegateModal.tsx

Lines changed: 67 additions & 77 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,6 @@
11
import { useState } from 'react';
2-
import { cosmos } from 'interchain-query';
3-
import { StdFee } from '@cosmjs/amino';
4-
import { useChain } from '@cosmos-kit/react';
5-
import { ChainName } from 'cosmos-kit';
2+
import { StdFee } from '@interchainjs/cosmos-types/types';
3+
import { useChain } from '@interchain-kit/react';
64
import BigNumber from 'bignumber.js';
75
import {
86
BasicModal,
@@ -12,26 +10,29 @@ import {
1210
Callout,
1311
Text,
1412
} from '@interchain-ui/react';
13+
import { useDelegate } from '@interchainjs/react/cosmos/staking/v1beta1/tx.rpc.react';
14+
import { MsgDelegate } from '@interchainjs/react/cosmos/staking/v1beta1/tx';
15+
import { defaultContext } from '@tanstack/react-query';
1516

1617
import {
1718
type ExtendedValidator as Validator,
1819
formatValidatorMetaInfo,
1920
getAssetLogoUrl,
2021
isGreaterThanZero,
21-
shiftDigits,
2222
calcDollarValue,
2323
toBaseAmount,
2424
getExponentFromAsset,
2525
getNativeAsset,
26+
convertGasToTokenAmount,
2627
} from '@/utils';
27-
import { Prices, UseDisclosureReturn, useTx } from '@/hooks';
28-
29-
const { delegate } = cosmos.staking.v1beta1.MessageComposer.fromPartial;
28+
import {
29+
Prices,
30+
UseDisclosureReturn,
31+
useSigningClient,
32+
useToastHandlers,
33+
} from '@/hooks';
3034

31-
export type MaxAmountAndFee = {
32-
maxAmount: number;
33-
fee: StdFee;
34-
};
35+
const DEFAULT_DELEGATION_GAS = '200000';
3536

3637
export const DelegateModal = ({
3738
balance,
@@ -49,7 +50,7 @@ export const DelegateModal = ({
4950
balance: string;
5051
updateData: () => void;
5152
unbondingDays: string;
52-
chainName: ChainName;
53+
chainName: string;
5354
modalControl: UseDisclosureReturn;
5455
selectedValidator: Validator;
5556
logoUrl: string;
@@ -59,87 +60,78 @@ export const DelegateModal = ({
5960
showDescription?: boolean;
6061
}) => {
6162
const { isOpen, onClose } = modalControl;
62-
const { address, estimateFee, assets } = useChain(chainName);
63+
const { address, assetList, chain } = useChain(chainName);
6364

6465
const [amount, setAmount] = useState<number | undefined>(0);
65-
const [isDelegating, setIsDelegating] = useState(false);
66-
const [isSimulating, setIsSimulating] = useState(false);
67-
const [maxAmountAndFee, setMaxAmountAndFee] = useState<MaxAmountAndFee>();
6866

69-
const coin = getNativeAsset(assets!);
67+
const coin = getNativeAsset(assetList);
7068
const exp = getExponentFromAsset(coin);
71-
const { tx } = useTx(chainName);
69+
70+
const toastHandlers = useToastHandlers();
71+
const { data: signingClient } = useSigningClient(chainName);
72+
const { mutate: delegate, isLoading: isDelegating } = useDelegate({
73+
clientResolver: signingClient,
74+
options: {
75+
context: defaultContext,
76+
...toastHandlers,
77+
},
78+
});
7279

7380
const onModalClose = () => {
7481
onClose();
7582
setAmount(0);
76-
setIsDelegating(false);
77-
setIsSimulating(false);
7883
};
7984

80-
const onDelegateClick = async () => {
85+
const onDelegateClick = () => {
8186
if (!address || !amount) return;
8287

83-
setIsDelegating(true);
84-
85-
const msg = delegate({
88+
const msg = MsgDelegate.fromPartial({
8689
delegatorAddress: address,
8790
validatorAddress: selectedValidator.address,
8891
amount: {
89-
amount: toBaseAmount(amount, exp), // shiftDigits(amount, exp),
92+
amount: toBaseAmount(amount, exp),
9093
denom: coin.base,
9194
},
9295
});
9396

94-
const isMaxAmountAndFeeExists =
95-
maxAmountAndFee &&
96-
new BigNumber(amount).isEqualTo(maxAmountAndFee.maxAmount);
97-
98-
await tx([msg], {
99-
fee: isMaxAmountAndFeeExists ? maxAmountAndFee.fee : null,
100-
onSuccess: () => {
101-
setMaxAmountAndFee(undefined);
102-
closeOuterModal && closeOuterModal();
103-
updateData();
104-
onModalClose();
97+
const fee: StdFee = {
98+
amount: [
99+
{
100+
denom: coin.base,
101+
amount: '0',
102+
},
103+
],
104+
gas: DEFAULT_DELEGATION_GAS,
105+
};
106+
107+
delegate(
108+
{
109+
signerAddress: address,
110+
message: msg,
111+
fee,
112+
memo: 'Delegate',
105113
},
106-
});
107-
108-
setIsDelegating(false);
114+
{
115+
onSuccess: () => {
116+
closeOuterModal?.();
117+
updateData();
118+
onModalClose();
119+
},
120+
}
121+
);
109122
};
110123

111-
const handleMaxClick = async () => {
112-
if (!address) return;
113-
114-
if (Number(balance) === 0) {
115-
setAmount(0);
116-
return;
117-
}
118-
119-
setIsSimulating(true);
120-
121-
const msg = delegate({
122-
delegatorAddress: address,
123-
validatorAddress: selectedValidator.address,
124-
amount: {
125-
amount: shiftDigits(balance, exp),
126-
denom: coin.base,
127-
},
128-
});
129-
130-
try {
131-
const fee = await estimateFee([msg]);
132-
const feeAmount = new BigNumber(fee.amount[0].amount).shiftedBy(-exp);
133-
const balanceAfterFee = new BigNumber(balance)
134-
.minus(feeAmount)
135-
.toNumber();
136-
setMaxAmountAndFee({ fee, maxAmount: balanceAfterFee });
137-
setAmount(balanceAfterFee);
138-
} catch (error) {
139-
console.log(error);
140-
} finally {
141-
setIsSimulating(false);
142-
}
124+
const handleMaxClick = () => {
125+
const feeAmount = convertGasToTokenAmount(
126+
DEFAULT_DELEGATION_GAS,
127+
chain,
128+
exp
129+
);
130+
const balanceAfterFee = Math.max(
131+
new BigNumber(balance).minus(feeAmount).toNumber(),
132+
0
133+
);
134+
setAmount(balanceAfterFee);
143135
};
144136

145137
const headerExtra = (
@@ -195,7 +187,7 @@ export const DelegateModal = ({
195187
? calcDollarValue(coin.base, amount, prices)
196188
: undefined,
197189
minValue: 0,
198-
maxValue: maxAmountAndFee?.maxAmount ?? Number(balance),
190+
maxValue: Number(balance),
199191
value: amount,
200192
onValueChange: (val) => {
201193
setAmount(val);
@@ -222,17 +214,15 @@ export const DelegateModal = ({
222214
},
223215
{
224216
label: 'Max',
225-
onClick: () => setAmount(Number(balance)),
217+
onClick: handleMaxClick,
226218
},
227219
],
228220
}}
229221
footer={
230222
<Button
231223
intent="tertiary"
232224
onClick={onDelegateClick}
233-
disabled={
234-
!isGreaterThanZero(amount) || isDelegating || isSimulating
235-
}
225+
disabled={!isGreaterThanZero(amount) || isDelegating}
236226
isLoading={isDelegating}
237227
>
238228
Delegate

‎templates/chain-admin/components/staking/MyValidators.tsx

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,5 @@
11
import { useState } from 'react';
22
import { Text } from '@interchain-ui/react';
3-
import { ChainName } from 'cosmos-kit';
43

54
import MyValidatorsList from './MyValidatorsList';
65
import { ValidatorInfoModal } from './ValidatorInfoModal';
@@ -26,7 +25,7 @@ export const MyValidators = ({
2625
balance: string;
2726
updateData: () => void;
2827
unbondingDays: string;
29-
chainName: ChainName;
28+
chainName: string;
3029
prices: Prices;
3130
logos: {
3231
[key: string]: string;

‎templates/chain-admin/components/staking/MyValidatorsList.tsx

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -6,10 +6,10 @@ import {
66
ValidatorNameCell,
77
ValidatorTokenAmountCell,
88
} from '@interchain-ui/react';
9-
import { ChainName } from 'cosmos-kit';
9+
import { useChain } from '@interchain-kit/react';
10+
1011
import { getNativeAsset } from '@/utils';
1112
import { type ExtendedValidator as Validator } from '@/utils';
12-
import { useChain } from '@cosmos-kit/react';
1313

1414
const MyValidatorsList = ({
1515
myValidators,
@@ -19,15 +19,15 @@ const MyValidatorsList = ({
1919
setSelectedValidator,
2020
}: {
2121
myValidators: Validator[];
22-
chainName: ChainName;
22+
chainName: string;
2323
openModal: () => void;
2424
setSelectedValidator: Dispatch<SetStateAction<Validator | undefined>>;
2525
logos: {
2626
[key: string]: string;
2727
};
2828
}) => {
29-
const { assets } = useChain(chainName);
30-
const coin = getNativeAsset(assets!);
29+
const { assetList } = useChain(chainName);
30+
const coin = getNativeAsset(assetList);
3131

3232
return (
3333
<ValidatorList

0 commit comments

Comments
 (0)