Skip to content

Commit 4dfcd76

Browse files
DevRozaDevDevRozaDev
authored
Merge pull request #344 from invariant-labs/staging
Update master
2 parents 64cb913 + 340a333 commit 4dfcd76

File tree

14 files changed

+64
-76
lines changed

14 files changed

+64
-76
lines changed

‎package-lock.json‎

Lines changed: 5 additions & 4 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@
1818
"dependencies": {
1919
"@emotion/react": "^11.11.4",
2020
"@emotion/styled": "^11.11.5",
21-
"@invariant-labs/a0-sdk": "^0.2.29",
21+
"@invariant-labs/a0-sdk": "^0.2.32",
2222
"@mui/icons-material": "^5.15.15",
2323
"@mui/material": "^5.15.15",
2424
"@nightlylabs/wallet-selector-polkadot": "^0.2.6",

‎src/components/Stats/Liquidity/Liquidity.tsx‎

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ import { colors, typography } from '@static/theme'
66
import { useStyles } from './style'
77
import { TimeData } from '@store/reducers/stats'
88
import { Grid, Typography } from '@mui/material'
9-
import { formatNumber, formatNumbers, showPrefix } from '@utils/utils'
9+
import { formatNumber } from '@utils/utils'
1010

1111
interface LiquidityInterface {
1212
liquidityPercent: number
@@ -31,8 +31,7 @@ const Liquidity: React.FC<LiquidityInterface> = ({
3131
<Typography className={classes.liquidityHeader}>Liquidity</Typography>
3232
<Grid className={classes.volumePercentHeader}>
3333
<Typography className={classes.volumeLiquidityHeader}>
34-
${formatNumbers()(liquidityVolume.toString())}
35-
{showPrefix(liquidityVolume)}
34+
${formatNumber(liquidityVolume)}
3635
</Typography>
3736
<Grid className={classes.volumeStatusContainer}>
3837
<Grid

‎src/components/Stats/PoolListItem/PoolListItem.tsx‎

Lines changed: 23 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ import React from 'react'
22
import { theme } from '@static/theme'
33
import { useStyles } from './style'
44
import { Box, Grid, Typography, useMediaQuery } from '@mui/material'
5-
import { addressToTicker, formatNumbers, parseFeeToPathFee, showPrefix } from '@utils/utils'
5+
import { addressToTicker, formatNumber, parseFeeToPathFee } from '@utils/utils'
66
import ArrowDropDownIcon from '@mui/icons-material/ArrowDropDown'
77
import ArrowDropUpIcon from '@mui/icons-material/ArrowDropUp'
88
import { useNavigate } from 'react-router-dom'
@@ -62,7 +62,7 @@ const PoolListItem: React.FC<IProps> = ({
6262
const { classes } = useStyles()
6363

6464
const navigate = useNavigate()
65-
const isXs = useMediaQuery(theme.breakpoints.down('xs'))
65+
const isSm = useMediaQuery(theme.breakpoints.down('sm'))
6666

6767
const handleOpenPosition = () => {
6868
navigate(
@@ -82,9 +82,9 @@ const PoolListItem: React.FC<IProps> = ({
8282
container
8383
classes={{ container: classes.container }}
8484
style={hideBottomLine ? { border: 'none' } : undefined}>
85-
{!isXs ? <Typography>{tokenIndex}</Typography> : null}
85+
{!isSm ? <Typography>{tokenIndex}</Typography> : null}
8686
<Grid className={classes.imageContainer}>
87-
{!isXs && (
87+
{!isSm && (
8888
<Box className={classes.iconsWrapper}>
8989
<img src={iconFrom} alt='Token from' />
9090
<img src={iconTo} alt='Token to' />
@@ -96,7 +96,7 @@ const PoolListItem: React.FC<IProps> = ({
9696
</Typography>
9797
</Grid>
9898
</Grid>
99-
{/* {!isXs ? (
99+
{/* {!isSm ? (
100100
<Typography>
101101
{`${apy > 1000 ? '>1000' : apy.toFixed(2)}%`}
102102
<Tooltip
@@ -137,24 +137,26 @@ const PoolListItem: React.FC<IProps> = ({
137137
</Typography>
138138
) : null} */}
139139
<Typography>{fee}%</Typography>
140-
<Typography>{`$${formatNumbers()(volume.toString())}${showPrefix(volume)}`}</Typography>
141-
<Typography>{`$${formatNumbers()(TVL.toString())}${showPrefix(TVL)}`}</Typography>
142-
<Box className={classes.action}>
143-
<TooltipHover text='Exchange'>
144-
<button className={classes.actionButton} onClick={handleOpenSwap}>
145-
<img width={32} height={32} src={icons.horizontalSwapIcon} alt={'Exchange'} />
146-
</button>
147-
</TooltipHover>
148-
<TooltipHover text='Add position'>
149-
<button className={classes.actionButton} onClick={handleOpenPosition}>
150-
<img width={32} height={32} src={icons.plusIcon} alt={'Open'} />
151-
</button>
152-
</TooltipHover>
153-
</Box>
140+
<Typography>{`$${formatNumber(volume)}`}</Typography>
141+
<Typography>{`$${formatNumber(TVL)}`}</Typography>
142+
{!isSm && (
143+
<Box className={classes.action}>
144+
<TooltipHover text='Exchange'>
145+
<button className={classes.actionButton} onClick={handleOpenSwap}>
146+
<img width={32} height={32} src={icons.horizontalSwapIcon} alt={'Exchange'} />
147+
</button>
148+
</TooltipHover>
149+
<TooltipHover text='Add position'>
150+
<button className={classes.actionButton} onClick={handleOpenPosition}>
151+
<img width={32} height={32} src={icons.plusIcon} alt={'Open'} />
152+
</button>
153+
</TooltipHover>
154+
</Box>
155+
)}
154156
</Grid>
155157
) : (
156158
<Grid container classes={{ container: classes.container, root: classes.header }}>
157-
{!isXs && (
159+
{!isSm && (
158160
<Typography style={{ lineHeight: '11px' }}>
159161
N<sup>o</sup>
160162
</Typography>
@@ -241,7 +243,7 @@ const PoolListItem: React.FC<IProps> = ({
241243
<ArrowDropDownIcon className={classes.icon} />
242244
) : null}
243245
</Typography>
244-
<Typography align='right'>Action</Typography>
246+
{!isSm && <Typography align='right'>Action</Typography>}
245247
</Grid>
246248
)}
247249
</Grid>

‎src/components/Stats/PoolListItem/style.ts‎

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -23,13 +23,12 @@ export const useStyles = makeStyles()(() => ({
2323
},
2424

2525
[theme.breakpoints.down('sm')]: {
26+
gridTemplateColumns: '32.5% 17.5% 35% 15% ',
27+
2628
'& p': {
29+
justifyContent: 'flex-start',
2730
...typography.caption1
2831
}
29-
},
30-
31-
[theme.breakpoints.down('xs')]: {
32-
gridTemplateColumns: '28% 15% 30% 25%'
3332
}
3433
},
3534

@@ -72,8 +71,9 @@ export const useStyles = makeStyles()(() => ({
7271
display: 'block'
7372
},
7473

75-
[theme.breakpoints.down('xs')]: {
76-
marginLeft: 0
74+
[theme.breakpoints.down('sm')]: {
75+
marginLeft: 0,
76+
justifyContent: 'flex-start'
7777
}
7878
},
7979
icon: {

‎src/components/Stats/TokenListItem/TokenListItem.tsx‎

Lines changed: 9 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ import ArrowDropDownIcon from '@mui/icons-material/ArrowDropDown'
44
import ArrowDropUpIcon from '@mui/icons-material/ArrowDropUp'
55
import { useStyles } from './style'
66
import { Grid, Typography, useMediaQuery } from '@mui/material'
7-
import { formatNumbers, showPrefix } from '@utils/utils'
7+
import { formatNumber } from '@utils/utils'
88
import { SortTypeTokenList } from '@store/consts/static'
99

1010
interface IProps {
@@ -39,7 +39,7 @@ const TokenListItem: React.FC<IProps> = ({
3939
const { classes } = useStyles()
4040
// const isNegative = priceChange < 0
4141

42-
const isXDown = useMediaQuery(theme.breakpoints.down('sm'))
42+
const isSm = useMediaQuery(theme.breakpoints.down('sm'))
4343
const hideName = useMediaQuery(theme.breakpoints.down('xs'))
4444

4545
return (
@@ -49,29 +49,30 @@ const TokenListItem: React.FC<IProps> = ({
4949
container
5050
classes={{ container: classes.container, root: classes.tokenList }}
5151
style={hideBottomLine ? { border: 'none' } : undefined}>
52-
{!hideName && <Typography component='p'>{itemNumber}</Typography>}
52+
{!hideName && !isSm && <Typography component='p'>{itemNumber}</Typography>}
5353
<Grid className={classes.tokenName}>
54-
{!isXDown && <img src={icon} alt='Token icon'></img>}
54+
{!isSm && <img src={icon} alt='Token icon'></img>}
5555
<Typography>
5656
{hideName ? symbol : name}
5757
{!hideName && <span className={classes.tokenSymbol}>{` (${symbol})`}</span>}
5858
</Typography>
5959
</Grid>
60-
<Typography>{`~$${formatNumbers()(price.toString())}${showPrefix(price)}`}</Typography>
60+
<Typography>{`~$${formatNumber(price)}`}</Typography>
61+
6162
{/* {!hideName && (
6263
<Typography style={{ color: isNegative ? colors.invariant.Error : colors.green.main }}>
6364
{isNegative ? `${priceChange.toFixed(2)}%` : `+${priceChange.toFixed(2)}%`}
6465
</Typography>
6566
)} */}
66-
<Typography>{`$${formatNumbers()(volume.toString())}${showPrefix(volume)}`}</Typography>
67-
<Typography>{`$${formatNumbers()(TVL.toString())}${showPrefix(TVL)}`}</Typography>
67+
<Typography>{`$${formatNumber(volume)}`}</Typography>
68+
<Typography>{`$${formatNumber(TVL)}`}</Typography>
6869
</Grid>
6970
) : (
7071
<Grid
7172
container
7273
style={{ color: colors.invariant.textGrey, fontWeight: 400 }}
7374
classes={{ container: classes.container, root: classes.header }}>
74-
{!hideName && (
75+
{!hideName && !isSm && (
7576
<Typography style={{ lineHeight: '12px' }}>
7677
N<sup>o</sup>
7778
</Typography>

‎src/components/Stats/TokenListItem/style.ts‎

Lines changed: 2 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -12,14 +12,10 @@ export const useStyles = makeStyles()((theme: Theme) => ({
1212
whiteSpace: 'nowrap',
1313

1414
[theme.breakpoints.down('sm')]: {
15-
gridTemplateColumns: '5% 35% 15% 17.5% 16.5% 15%',
15+
gridTemplateColumns: '30% 22.5% 32.5% 15%',
1616
'& p': {
17-
...typography.caption2
17+
...typography.caption1
1818
}
19-
},
20-
21-
[theme.breakpoints.down('xs')]: {
22-
gridTemplateColumns: '15% 25% 35% 25%'
2319
}
2420
},
2521

‎src/components/Stats/Volume/Volume.tsx‎

Lines changed: 2 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ import { useStyles } from './style'
77
import { TimeData } from '@store/reducers/stats'
88
import { Grid, Typography, useMediaQuery } from '@mui/material'
99
import { Box } from '@mui/system'
10-
import { formatNumber, formatNumbers, showPrefix } from '@utils/utils'
10+
import { formatNumber } from '@utils/utils'
1111

1212
interface StatsInterface {
1313
percentVolume: number
@@ -38,10 +38,7 @@ const Volume: React.FC<StatsInterface> = ({ percentVolume, volume, data, classNa
3838
<Box className={classes.volumeContainer}>
3939
<Typography className={classes.volumeHeader}>Volume</Typography>
4040
<div className={classes.volumePercentContainer}>
41-
<Typography className={classes.volumePercentHeader}>
42-
${formatNumbers()(volume.toString())}
43-
{showPrefix(volume)}
44-
</Typography>
41+
<Typography className={classes.volumePercentHeader}>${formatNumber(volume)}</Typography>
4542
<Box className={classes.volumeStatusContainer}>
4643
<Box
4744
className={classNames(

‎src/components/Stats/volumeBar/VolumeBar.tsx‎

Lines changed: 4 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ import classNames from 'classnames'
33
import { theme } from '@static/theme'
44
import { useStyles } from './style'
55
import { Box, Grid, Typography, useMediaQuery } from '@mui/material'
6-
import { formatNumbers, showPrefix } from '@utils/utils'
6+
import { formatNumber } from '@utils/utils'
77

88
interface Iprops {
99
percentVolume: number
@@ -30,10 +30,7 @@ const VolumeBar: React.FC<Iprops> = ({
3030
<Grid container classes={{ container: classes.container }}>
3131
<Box className={classes.tokenName}>
3232
<Typography className={classes.tokenHeader}>Volume 24H:</Typography>
33-
<Typography className={classes.tokenContent}>
34-
${formatNumbers()(volume.toString())}
35-
{showPrefix(volume)}
36-
</Typography>
33+
<Typography className={classes.tokenContent}>${formatNumber(volume)}</Typography>
3734
{!isXDown && (
3835
<Typography
3936
className={classNames(
@@ -48,10 +45,7 @@ const VolumeBar: React.FC<Iprops> = ({
4845
</Box>
4946
<Box className={classes.tokenName}>
5047
<Typography className={classes.tokenHeader}>TVL 24H:</Typography>
51-
<Typography className={classes.tokenContent}>
52-
${formatNumbers()(tvlVolume.toString())}
53-
{showPrefix(tvlVolume)}
54-
</Typography>
48+
<Typography className={classes.tokenContent}>${formatNumber(tvlVolume)}</Typography>
5549
{!isXDown && (
5650
<Typography
5751
className={classNames(
@@ -64,10 +58,7 @@ const VolumeBar: React.FC<Iprops> = ({
6458
</Box>
6559
<Box className={classes.tokenName}>
6660
<Typography className={classes.tokenHeader}>Fees 24H:</Typography>
67-
<Typography className={classes.tokenContent}>
68-
${formatNumbers()(feesVolume.toString())}
69-
{showPrefix(feesVolume)}
70-
</Typography>
61+
<Typography className={classes.tokenContent}>${formatNumber(feesVolume)}</Typography>
7162
{!isXDown && (
7263
<Typography
7364
className={classNames(

‎src/components/Swap/Swap.tsx‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,7 @@ import settingIcon from '@static/svg/settings.svg'
1111
import SwapArrows from '@static/svg/swap-arrows.svg'
1212
import {
1313
DEFAULT_TOKEN_DECIMAL,
14+
MAX,
1415
REFRESHER_INTERVAL,
1516
SWAP_SAFE_TRANSACTION_FEE
1617
} from '@store/consts/static'
@@ -353,7 +354,7 @@ export const Swap: React.FC<ISwap> = ({
353354
if (
354355
tokenFrom !== null &&
355356
convertBalanceToBigint(amountFrom, Number(tokens[tokenFrom]?.decimals ?? 0n)) !== 0n &&
356-
isError(SwapError.Unknown)
357+
(amountFrom.replace('.', '') == MAX.toString() || amountTo === '')
357358
) {
358359
return 'Not enough liquidity'
359360
}

0 commit comments

Comments
 (0)