Skip to content

Commit 395edea

Browse files
maxaleksmaxaleks
authored
v3.1.0
2 parents cdb57c7 + 97816ba commit 395edea

File tree

30 files changed

+237
-138
lines changed

30 files changed

+237
-138
lines changed

‎config-overrides.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
const webpack = require('webpack');
2-
const CopyPlugin = require('copy-webpack-plugin');
32
const SentryWebpackPlugin = require('@sentry/webpack-plugin');
43

54
module.exports = {
65
webpack: function(config, env) {
6+
config.devtool = 'source-map';
77
config.experiments = {
88
asyncWebAssembly: true,
99
topLevelAwait: true,
@@ -49,7 +49,7 @@ module.exports = {
4949
Buffer: ['buffer', 'Buffer'],
5050
}),
5151
];
52-
if (process.env.SENTRY_ORG) {
52+
if (process.env.SENTRY_ORG && process.env.SENTRY_PROJECT && process.env.SENTRY_AUTH_TOKEN) {
5353
config.plugins.push(
5454
new SentryWebpackPlugin({
5555
org: process.env.SENTRY_ORG,

‎package.json‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "zkbob-ui",
3-
"version": "3.0.0",
3+
"version": "3.1.0",
44
"private": true,
55
"dependencies": {
66
"@dicebear/avatars": "^4.10.2",
@@ -44,7 +44,7 @@
4444
"wagmi": "^0.12.1",
4545
"web-vitals": "^1.0.1",
4646
"webpack": "^5.70.0",
47-
"zkbob-client-js": "5.1.1"
47+
"zkbob-client-js": "5.2.0"
4848
},
4949
"scripts": {
5050
"start": "react-app-rewired start",

‎src/assets/usdc.svg‎

Lines changed: 5 additions & 0 deletions
Loading

‎src/components/ConfirmTransactionModal/index.js‎

Lines changed: 11 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -30,16 +30,22 @@ export default ({
3030
<AmountContainer>
3131
<TokenIcon src={TOKENS_ICONS[currentPool.tokenSymbol]} />
3232
<Amount>
33-
{formatNumber(isMultitransfer
34-
? transfers.reduce((acc, curr) => acc.add(curr.amount), ethers.constants.Zero)
35-
: amount.sub(amountToConvert), 18
33+
{formatNumber(
34+
isMultitransfer
35+
? transfers.reduce((acc, curr) => acc.add(curr.amount), ethers.constants.Zero)
36+
: amount.sub(amountToConvert),
37+
currentPool.tokenDecimals,
38+
18
3639
)}{' '}
3740
</Amount>
3841
<TokenSymbol>{currentPool.tokenSymbol}</TokenSymbol>
3942
</AmountContainer>
4043
{!amountToConvert.isZero() && (
4144
<ConvertedAmount>
42-
+ {formatNumber(amountToConvert.mul(convertionDetails.price).div(ethers.utils.parseUnits('1', convertionDetails.decimals)))}{' '}
45+
+ {formatNumber(
46+
amountToConvert.mul(convertionDetails.price).div(ethers.utils.parseUnits('1', convertionDetails.decimals)),
47+
currentPool.tokenDecimals
48+
)}{' '}
4349
{convertionDetails.toTokenSymbol}
4450
</ConvertedAmount>
4551
)}
@@ -60,7 +66,7 @@ export default ({
6066
{!amountToConvert.isZero() && (
6167
<Row>
6268
<MediumText>Withdraw amount:</MediumText>
63-
<MediumText>{formatNumber(amount)} {currentPool.tokenSymbol}</MediumText>
69+
<MediumText>{formatNumber(amount, currentPool.tokenDecimals)} {currentPool.tokenSymbol}</MediumText>
6470
</Row>
6571
)}
6672
{numberOfTxs > 1 && (

‎src/components/ConvertOptions/index.js‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -6,12 +6,11 @@ import Switch from 'components/Switch';
66

77
import { formatNumber } from 'utils';
88

9-
const options = ['1', '5', '10'].map(ethers.utils.parseEther);
10-
119
export default ({
1210
amountToConvert, setAmountToConvert, amountToWithdraw,
1311
maxAmountToWithdraw, details, currentPool,
1412
}) => {
13+
const options = ['1', '5', '10'].map(opt => ethers.utils.parseUnits(opt, currentPool.tokenDecimals));
1514
const [isConverting, setIsConverting] = useState(false);
1615

1716
useEffect(() => {
@@ -37,7 +36,8 @@ export default ({
3736
{isConverting && (
3837
<Row>
3938
{options.map((option, index) => {
40-
let nativeAmount = formatNumber(option.mul(details.price).div(ethers.utils.parseUnits('1', details.decimals)));
39+
const nativeAmountWei = option.mul(details.price).div(ethers.utils.parseUnits('1', details.decimals));
40+
let nativeAmount = formatNumber(nativeAmountWei, currentPool.tokenDecimals);
4141
if (nativeAmount === '≈ 0') nativeAmount = '0';
4242
return (
4343
<OptionButton
@@ -46,7 +46,7 @@ export default ({
4646
active={amountToConvert.eq(option)}
4747
disabled={option.gt(amountToWithdraw) || option.gt(maxAmountToWithdraw)}
4848
>
49-
<TextBold>{formatNumber(option)} {currentPool.tokenSymbol}</TextBold>
49+
<TextBold>{formatNumber(option, currentPool.tokenDecimals)} {currentPool.tokenSymbol}</TextBold>
5050
<Text>
5151
~ {nativeAmount} {details.toTokenSymbol}
5252
</Text>

‎src/components/Header/index.js‎

Lines changed: 10 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -20,11 +20,11 @@ import { shortAddress, formatNumber } from 'utils';
2020
import { NETWORKS, CONNECTORS_ICONS, TOKENS_ICONS } from 'constants';
2121
import { useWindowDimensions } from 'hooks';
2222

23-
const { parseEther } = ethers.utils;
23+
const { parseUnits } = ethers.utils;
2424

25-
const formatBalance = (balance, isMobile) => {
26-
const decimals = (isMobile && balance.gte(parseEther('1000'))) ? 0 : null;
27-
return formatNumber(balance, decimals);
25+
const formatBalance = (balance, tokenDecimals, isMobile) => {
26+
const decimals = (isMobile && balance.gte(parseUnits('1000', tokenDecimals))) ? 0 : null;
27+
return formatNumber(balance, tokenDecimals, decimals);
2828
};
2929

3030
const BalanceSkeleton = isMobile => (
@@ -101,7 +101,11 @@ export default ({
101101
) : (
102102
<>
103103
<Balance>
104-
{formatBalance(currentPool.isNative ? nativeBalance.add(balance) : balance, isMobile)}{' '}
104+
{formatBalance(
105+
currentPool.isNative ? nativeBalance.add(balance) : balance,
106+
currentPool.tokenDecimals,
107+
isMobile
108+
)}{' '}
105109
{currentPool.tokenSymbol}{currentPool.isNative && '*'}
106110
</Balance>
107111
<DropdownIcon />
@@ -142,7 +146,7 @@ export default ({
142146
) : (
143147
<>
144148
<Balance>
145-
{formatBalance(poolBalance, isMobile)} {currentPool.tokenSymbol}
149+
{formatBalance(poolBalance, currentPool.tokenDecimals, isMobile)} {currentPool.tokenSymbol}
146150
</Balance>
147151
<DropdownIcon />
148152
</>

‎src/components/HistoryItem/index.js‎

Lines changed: 21 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -81,10 +81,10 @@ const AddressLink = ({ action, isMobile, currentChainId }) => {
8181
);
8282
};
8383

84-
const Fee = ({ fee, highFee, isMobile, tokenSymbol }) => (
84+
const Fee = ({ fee, highFee, isMobile, tokenSymbol, tokenDecimals }) => (
8585
<>
8686
{!fee.isZero() && (
87-
<FeeText>(fee {formatNumber(fee)} {tokenSymbol})</FeeText>
87+
<FeeText>(fee {formatNumber(fee, tokenDecimals)} {tokenSymbol})</FeeText>
8888
)}
8989
{highFee && (
9090
<Tooltip
@@ -114,9 +114,12 @@ export default ({ item, zkAccount, currentPool }) => {
114114
const isMobile = width <= 500;
115115
const currentChainId = currentPool.chainId;
116116
const tokenSymbol = useMemo(() => {
117+
if (item.timestamp <= currentPool.migration?.timestamp) {
118+
return currentPool.migration?.prevTokenSymbol;
119+
}
117120
const isWrapped = currentPool.isNative && item.type === HistoryTransactionType.Deposit;
118121
return (isWrapped ? 'W' : '') + currentPool.tokenSymbol;
119-
}, [currentPool, item.type]);
122+
}, [currentPool, item.type, item.timestamp]);
120123

121124
const onCopy = useCallback((text, result) => {
122125
if (result) {
@@ -145,8 +148,8 @@ export default ({ item, zkAccount, currentPool }) => {
145148
{(() => {
146149
const total = item.actions.reduce((acc, curr) => acc.add(curr.amount), ethers.constants.Zero);
147150
return (
148-
<Tooltip content={formatNumber(total, 18)} placement="top">
149-
<span>{formatNumber(total, 4)}</span>
151+
<Tooltip content={formatNumber(total, currentPool.tokenDecimals, 18)} placement="top">
152+
<span>{formatNumber(total, currentPool.tokenDecimals, 4)}</span>
150153
</Tooltip>
151154
);
152155
})()}
@@ -155,7 +158,12 @@ export default ({ item, zkAccount, currentPool }) => {
155158
</Row>
156159
{item.fee && (
157160
<FeeDesktop>
158-
<Fee fee={item.fee} highFee={item.highFee} tokenSymbol={tokenSymbol} />
161+
<Fee
162+
fee={item.fee}
163+
highFee={item.highFee}
164+
tokenSymbol={tokenSymbol}
165+
tokenDecimals={currentPool.tokenDecimals}
166+
/>
159167
</FeeDesktop>
160168
)}
161169
</Row>
@@ -174,7 +182,13 @@ export default ({ item, zkAccount, currentPool }) => {
174182
</RowSpaceBetween>
175183
{item.fee && (
176184
<FeeMobile>
177-
<Fee fee={item.fee} highFee={item.highFee} tokenSymbol={tokenSymbol} isMobile />
185+
<Fee
186+
fee={item.fee}
187+
highFee={item.highFee}
188+
tokenSymbol={tokenSymbol}
189+
tokenDecimals={currentPool.tokenDecimals}
190+
isMobile
191+
/>
178192
</FeeMobile>
179193
)}
180194
<RowSpaceBetween>

‎src/components/LatestAction/index.js‎

Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -15,9 +15,12 @@ export default ({ type, data, currentPool }) => {
1515
const history = useHistory();
1616
const location = useLocation();
1717
const tokenSymbol = useMemo(() => {
18+
if (data.timestamp <= currentPool.migration?.timestamp) {
19+
return currentPool.migration?.prevTokenSymbol;
20+
}
1821
const isWrapped = currentPool.isNative && data.type === HistoryTransactionType.Deposit;
1922
return (isWrapped ? 'W' : '') + currentPool.tokenSymbol;
20-
}, [currentPool, data.type]);
23+
}, [currentPool, data.type, data.timestamp]);
2124

2225
return (
2326
<Row>
@@ -28,8 +31,8 @@ export default ({ type, data, currentPool }) => {
2831
{(() => {
2932
const total = data.actions.reduce((acc, curr) => acc.add(curr.amount), ethers.constants.Zero);
3033
return (
31-
<Tooltip content={formatNumber(total, 18)} placement="top">
32-
<span>{formatNumber(total, 2)}</span>
34+
<Tooltip content={formatNumber(total, currentPool.tokenDecimals, 18)} placement="top">
35+
<span>{formatNumber(total, currentPool.tokenDecimals, 2)}</span>
3336
</Tooltip>
3437
);
3538
})()}

‎src/components/Limits/index.js‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -14,9 +14,9 @@ const Limit = ({ value, loading, currentPool }) => {
1414
}
1515
return !!value.total ? (
1616
<>
17-
<Value>{formatNumber(value.available)} {currentPool.tokenSymbol}</Value>
17+
<Value>{formatNumber(value.available, currentPool.tokenDecimals)} {currentPool.tokenSymbol}</Value>
1818
<Tooltip
19-
content={`out of ${formatNumber(value.total)} ${currentPool.tokenSymbol} total`}
19+
content={`out of ${formatNumber(value.total, currentPool.tokenDecimals)} ${currentPool.tokenSymbol} total`}
2020
placement="right"
2121
delay={0}
2222
>
@@ -25,7 +25,7 @@ const Limit = ({ value, loading, currentPool }) => {
2525
</>
2626
) : (
2727
<Value style={{ marginRight: 23 }}>
28-
{formatNumber(value)} {currentPool.tokenSymbol}
28+
{formatNumber(value, currentPool.tokenDecimals)} {currentPool.tokenSymbol}
2929
</Value>
3030
);
3131
}

‎src/components/MultitransferDetailsModal/index.js‎

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -49,7 +49,7 @@ const ListItem = ({ index, data, zkAccount, currentPool }) => {
4949
</Tooltip>
5050
</Tooltip>
5151
<Amount>
52-
{formatNumber(data.amount, 18)} {currentPool.tokenSymbol}
52+
{formatNumber(data.amount, currentPool.tokenDecimals, 18)} {currentPool.tokenSymbol}
5353
</Amount>
5454
</ItemContainer>
5555
);
@@ -69,7 +69,11 @@ export default ({ isOpen, onClose, onBack, transfers, isSent, zkAccount, current
6969
<AmountContainer>
7070
<TokenIcon src={TOKENS_ICONS[currentPool.tokenSymbol]} />
7171
<TotalAmount>
72-
{formatNumber(transfers.reduce((acc, curr) => acc.add(curr.amount), ethers.constants.Zero), 18)}
72+
{formatNumber(
73+
transfers.reduce((acc, curr) => acc.add(curr.amount), ethers.constants.Zero),
74+
currentPool.tokenDecimals,
75+
18
76+
)}
7377
{' '}
7478
</TotalAmount>
7579
<TokenSymbol>{currentPool.tokenSymbol}</TokenSymbol>

0 commit comments

Comments
 (0)