Skip to content

Commit 9f2d88c

Browse files
Fix/bridge 1 (#1162)
1 parent e4210dd commit 9f2d88c

File tree

3 files changed

+140
-137
lines changed

3 files changed

+140
-137
lines changed

src/containers/portal/components/avataIpfs/AvataImgIpfs.tsx

Lines changed: 10 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,25 +1,24 @@
1-
import { useQuery } from '@tanstack/react-query';
21
import useQueueIpfsContent from 'src/hooks/useQueueIpfsContent';
32
import cx from 'classnames';
3+
import { useEffect, useState } from 'react';
44
import styles from './styles.module.scss';
55

66
const getRoboHashImage = (addressCyber: string) =>
77
`https://robohash.org/${addressCyber}`;
88

99
function AvataImgIpfs({ img = '', cidAvatar, addressCyber, ...props }) {
1010
const { fetchWithDetails } = useQueueIpfsContent();
11+
const [avatar, setAvatar] = useState<string | undefined>(undefined);
1112

12-
const { data: avatar } = useQuery(
13-
['getAvatar', cidAvatar],
14-
async () => {
15-
const details = await fetchWithDetails!(cidAvatar, 'image');
16-
return details?.content;
17-
},
18-
19-
{
20-
enabled: Boolean(fetchWithDetails && cidAvatar),
13+
useEffect(() => {
14+
if (!fetchWithDetails || !cidAvatar) {
15+
return;
2116
}
22-
);
17+
18+
fetchWithDetails(cidAvatar, 'image').then((value) => {
19+
setAvatar(value?.content);
20+
});
21+
}, [fetchWithDetails, cidAvatar]);
2322

2423
const avatarImage =
2524
avatar ||

src/pages/teleport/bridge/actionBar.bridge.tsx

Lines changed: 123 additions & 123 deletions
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,6 @@ import BigNumber from 'bignumber.js';
1010
import { useSigningClient } from 'src/contexts/signerClient';
1111
import { Option } from 'src/types';
1212
import { Coin } from '@cosmjs/launchpad';
13-
import { useIbcDenom } from 'src/contexts/ibcDenom';
1413
import {
1514
MsgTransferEncodeObject,
1615
SigningStargateClient,
@@ -59,12 +58,12 @@ type Props = {
5958
ibcClient: null | SigningStargateClient;
6059
denomIbc: null | string;
6160
sourceChannel: string | null;
61+
coinDecimals: number;
6262
};
6363

6464
function ActionBar({ stateActionBar }: { stateActionBar: Props }) {
6565
const { pingTxsIbc } = useIbcHistory();
6666
const { signingClient, signer } = useSigningClient();
67-
const { tracesDenom } = useIbcDenom();
6867
const [stage, setStage] = useState(STAGE_INIT);
6968
const [txHash, setTxHash] = useState<Option<string>>(undefined);
7069
const [txHashIbc, setTxHashIbc] = useState(null);
@@ -82,6 +81,7 @@ function ActionBar({ stateActionBar }: { stateActionBar: Props }) {
8281
denomIbc,
8382
sourceChannel,
8483
networkB,
84+
coinDecimals,
8585
} = stateActionBar;
8686

8787
const clearState = () => {
@@ -93,149 +93,149 @@ function ActionBar({ stateActionBar }: { stateActionBar: Props }) {
9393
};
9494

9595
const depositOnClick = useCallback(async () => {
96-
if (ibcClient && denomIbc && signer && tracesDenom) {
97-
const [{ address }] = await ibcClient.signer.getAccounts();
98-
const [{ address: counterpartyAccount }] = await signer.getAccounts();
99-
const responseChainId = await ibcClient.getChainId();
96+
if (!ibcClient || !denomIbc || !signer) {
97+
return;
98+
}
99+
100+
const [{ address }] = await ibcClient.signer.getAccounts();
101+
const [{ address: counterpartyAccount }] = await signer.getAccounts();
102+
const responseChainId = await ibcClient.getChainId();
103+
104+
setStage(STAGE_SUBMITTED);
105+
106+
const sourcePort = 'transfer';
107+
108+
const timeoutTimestamp = Long.fromString(
109+
`${new Date().getTime() + TIMEOUT_TIMESTAMP}000000`
110+
);
100111

101-
setStage(STAGE_SUBMITTED);
112+
const amount = convertAmountReverce(tokenAmount, coinDecimals);
102113

103-
const sourcePort = 'transfer';
114+
const transferAmount = coinFunc(amount, denomIbc);
115+
const msg: MsgTransferEncodeObject = {
116+
typeUrl: '/ibc.applications.transfer.v1.MsgTransfer',
117+
value: MsgTransfer.fromPartial({
118+
sourcePort,
119+
sourceChannel: sourceChannel || '',
120+
sender: address,
121+
receiver: counterpartyAccount,
122+
timeoutTimestamp: BigInt(timeoutTimestamp.toNumber()),
123+
token: transferAmount,
124+
}),
125+
};
104126

105-
const timeoutTimestamp = Long.fromString(
106-
`${new Date().getTime() + TIMEOUT_TIMESTAMP}000000`
127+
try {
128+
const response = await ibcClient.signAndBroadcast(
129+
address,
130+
[msg],
131+
1.5,
132+
''
107133
);
108134

109-
const [{ coinDecimals: coinDecimalsA }] = tracesDenom(denomIbc);
110-
const amount = convertAmountReverce(tokenAmount, coinDecimalsA);
135+
console.log('response', response);
111136

112-
const transferAmount = coinFunc(amount, denomIbc);
113-
const msg: MsgTransferEncodeObject = {
114-
typeUrl: '/ibc.applications.transfer.v1.MsgTransfer',
115-
value: MsgTransfer.fromPartial({
116-
sourcePort,
117-
sourceChannel: sourceChannel || '',
118-
sender: address,
119-
receiver: counterpartyAccount,
120-
timeoutTimestamp: BigInt(timeoutTimestamp.toNumber()),
121-
token: transferAmount,
122-
}),
123-
};
124-
125-
try {
126-
const response = await ibcClient.signAndBroadcast(
127-
address,
128-
[msg],
129-
1.5,
130-
''
137+
if (response.code === 0) {
138+
setTxHashIbc(response.transactionHash);
139+
setLinkIbcTxs(
140+
`${networks[responseChainId].explorerUrlToTx.replace(
141+
'{txHash}',
142+
response.transactionHash.toUpperCase()
143+
)}`
131144
);
132145

133-
console.log('response', response);
134-
135-
if (response.code === 0) {
136-
setTxHashIbc(response.transactionHash);
137-
setLinkIbcTxs(
138-
`${networks[responseChainId].explorerUrlToTx.replace(
139-
'{txHash}',
140-
response.transactionHash.toUpperCase()
141-
)}`
142-
);
143-
const [{ coinDecimals: coinDecimalsSelect }] =
144-
tracesDenom(tokenSelect);
145-
const amountSelect = convertAmountReverce(
146-
tokenAmount,
147-
coinDecimalsSelect
148-
);
149-
const transferData = {
150-
txHash: response.transactionHash,
151-
address: counterpartyAccount,
152-
sourceChainId: responseChainId,
153-
destChainId: networkB,
154-
sender: address,
155-
recipient: counterpartyAccount,
156-
createdAt: getNowUtcTime(),
157-
amount: coinFunc(amountSelect, tokenSelect),
158-
};
159-
pingTxsIbc(ibcClient, transferData);
160-
setStage(STAGE_CONFIRMED_IBC);
161-
// if (response.rawLog.length > 0) {
162-
// parseRawLog(response.rawLog);
163-
// }
164-
} else {
165-
setTxHashIbc(null);
166-
setErrorMessage(response.rawLog.toString());
167-
setStage(STAGE_ERROR);
168-
}
169-
} catch (e) {
170-
console.error(`error: `, e);
146+
const transferData = {
147+
txHash: response.transactionHash,
148+
address: counterpartyAccount,
149+
sourceChainId: responseChainId,
150+
destChainId: networkB,
151+
sender: address,
152+
recipient: counterpartyAccount,
153+
createdAt: getNowUtcTime(),
154+
amount: coinFunc(amount, tokenSelect),
155+
};
156+
pingTxsIbc(ibcClient, transferData);
157+
setStage(STAGE_CONFIRMED_IBC);
158+
// if (response.rawLog.length > 0) {
159+
// parseRawLog(response.rawLog);
160+
// }
161+
} else {
171162
setTxHashIbc(null);
172-
setErrorMessage(e.toString());
163+
setErrorMessage(response.rawLog.toString());
173164
setStage(STAGE_ERROR);
174165
}
166+
} catch (e) {
167+
console.error(`error: `, e);
168+
setTxHashIbc(null);
169+
setErrorMessage(e.toString());
170+
setStage(STAGE_ERROR);
175171
}
172+
176173
// eslint-disable-next-line react-hooks/exhaustive-deps
177174
}, [ibcClient, tokenAmount, denomIbc, signingClient, networkB]);
178175

179176
const withdrawOnClick = useCallback(async () => {
180-
if (signer && signingClient && tracesDenom) {
181-
let prefix;
182-
setStage(STAGE_SUBMITTED);
183-
if (networks[networkB]) {
184-
prefix = networks[networkB].prefix;
185-
}
186-
const [{ address }] = await signer.getAccounts();
187-
const sourcePort = 'transfer';
188-
const counterpartyAccount = fromBech32(address, prefix);
189-
const timeoutTimestamp = Long.fromString(
190-
`${new Date().getTime() + TIMEOUT_TIMESTAMP}000000`
177+
if (!signer || !signingClient) {
178+
return;
179+
}
180+
181+
let prefix;
182+
setStage(STAGE_SUBMITTED);
183+
if (networks[networkB]) {
184+
prefix = networks[networkB].prefix;
185+
}
186+
const [{ address }] = await signer.getAccounts();
187+
const sourcePort = 'transfer';
188+
const counterpartyAccount = fromBech32(address, prefix);
189+
const timeoutTimestamp = Long.fromString(
190+
`${new Date().getTime() + TIMEOUT_TIMESTAMP}000000`
191+
);
192+
193+
const amount = convertAmountReverce(tokenAmount, coinDecimals);
194+
const transferAmount = coinFunc(amount, tokenSelect);
195+
const msg = {
196+
typeUrl: '/ibc.applications.transfer.v1.MsgTransfer',
197+
value: {
198+
sourcePort,
199+
sourceChannel,
200+
sender: address,
201+
receiver: counterpartyAccount,
202+
timeoutTimestamp,
203+
token: transferAmount,
204+
},
205+
};
206+
try {
207+
const response = await signingClient.signAndBroadcast(
208+
address,
209+
[msg],
210+
fee,
211+
''
191212
);
192-
const [{ coinDecimals: coinDecimalsA }] = tracesDenom(tokenSelect);
193-
const amount = convertAmountReverce(tokenAmount, coinDecimalsA);
194-
const transferAmount = coinFunc(amount, tokenSelect);
195-
const msg = {
196-
typeUrl: '/ibc.applications.transfer.v1.MsgTransfer',
197-
value: {
198-
sourcePort,
199-
sourceChannel,
200-
sender: address,
201-
receiver: counterpartyAccount,
202-
timeoutTimestamp,
203-
token: transferAmount,
204-
},
205-
};
206-
try {
207-
const response = await signingClient.signAndBroadcast(
213+
if (response.code === 0) {
214+
setTxHash(response.transactionHash);
215+
const ChainId = await signingClient.getChainId();
216+
const transferData = {
217+
txHash: response.transactionHash,
208218
address,
209-
[msg],
210-
fee,
211-
''
212-
);
213-
if (response.code === 0) {
214-
setTxHash(response.transactionHash);
215-
const ChainId = await signingClient.getChainId();
216-
const transferData = {
217-
txHash: response.transactionHash,
218-
address,
219-
sourceChainId: ChainId,
220-
destChainId: networkB,
221-
sender: address,
222-
recipient: counterpartyAccount,
223-
createdAt: getNowUtcTime(),
224-
amount: transferAmount,
225-
};
226-
pingTxsIbc(signingClient, transferData);
227-
} else {
228-
setTxHash(undefined);
229-
setErrorMessage(response.rawLog.toString());
230-
setStage(STAGE_ERROR);
231-
}
232-
} catch (e) {
233-
console.error(`error: `, e);
219+
sourceChainId: ChainId,
220+
destChainId: networkB,
221+
sender: address,
222+
recipient: counterpartyAccount,
223+
createdAt: getNowUtcTime(),
224+
amount: transferAmount,
225+
};
226+
pingTxsIbc(signingClient, transferData);
227+
} else {
234228
setTxHash(undefined);
235-
setErrorMessage(e.toString());
229+
setErrorMessage(response.rawLog.toString());
236230
setStage(STAGE_ERROR);
237231
}
232+
} catch (e) {
233+
console.error(`error: `, e);
234+
setTxHash(undefined);
235+
setErrorMessage(e.toString());
236+
setStage(STAGE_ERROR);
238237
}
238+
239239
// eslint-disable-next-line react-hooks/exhaustive-deps
240240
}, [tokenSelect, signer, tokenAmount, sourceChannel, networkB]);
241241

src/pages/teleport/bridge/bridge.tsx

Lines changed: 7 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -235,12 +235,15 @@ function Bridge() {
235235
[tokenSelect, denomIbc]
236236
);
237237

238+
useEffect(() => {
239+
const [{ coinDecimals }] = tracesDenom(tokenSelect);
240+
setTokenACoinDecimals(coinDecimals);
241+
}, [tokenSelect, tracesDenom]);
242+
238243
useEffect(() => {
239244
const token = getDenomToken(networkA);
240245
setTokenA(token);
241-
const [{ coinDecimals }] = tracesDenom(token);
242-
setTokenACoinDecimals(coinDecimals);
243-
}, [networkA, tracesDenom, getDenomToken]);
246+
}, [networkA, getDenomToken]);
244247

245248
useEffect(() => {
246249
const token = getDenomToken(networkB);
@@ -275,6 +278,7 @@ function Bridge() {
275278
denomIbc,
276279
sourceChannel,
277280
networkB,
281+
coinDecimals: tokenACoinDecimals,
278282
};
279283

280284
return (

0 commit comments

Comments
 (0)