Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Update prod env #819

Merged
merged 13 commits into from
Dec 18, 2024
Merged

Update prod env #819

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
13 commits
Select commit Hold shift + click to select a range
3cffc44
fix positioning of plot markers and add last global buy and sell pric…
zielvna Dec 16, 2024
489b909
fix active liquidity button position
zielvna Dec 16, 2024
3559ad6
remove unnecessary console logs
zielvna Dec 16, 2024
3b51ade
remove popular pools
zielvna Dec 17, 2024
ab66c6b
refactor plot
zielvna Dec 17, 2024
68d4d63
add buy and sell markers to plot on position details page
zielvna Dec 17, 2024
e3efbcf
fix build
zielvna Dec 17, 2024
7e5a31e
fix typescript issues
zielvna Dec 17, 2024
0af0e55
Merge pull request #816 from invariant-labs/remove-popular-pools
zielvna Dec 17, 2024
e644555
fix various bugs
zielvna Dec 17, 2024
a02cdf2
Merge pull request #812 from invariant-labs/plot-refactor
zielvna Dec 17, 2024
3f2d80b
Merge pull request #817 from invariant-labs/bug-fixes-2
wojciech-cichocki Dec 18, 2024
4cc9424
Merge pull request #818 from invariant-labs/dev
wojciech-cichocki Dec 18, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 4 additions & 1 deletion src/components/NewPosition/RangeSelector/RangeSelector.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -461,7 +461,10 @@ export const RangeSelector: React.FC<IRangeSelector> = ({
<Grid container flexDirection='column'>
<Typography className={classes.currentPrice}>Current price</Typography>
<Typography className={classes.globalPrice}>Global price</Typography>
<Typography className={classes.buySellPrice}>Buy/sell price</Typography>
<Typography className={classes.lastGlobalBuyPrice}>Last global buy price</Typography>
<Typography className={classes.lastGlobalSellPrice}>
Last global sell price
</Typography>
</Grid>
</Grid>
</Grid>
Expand Down
15 changes: 15 additions & 0 deletions src/components/NewPosition/RangeSelector/style.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -165,6 +165,7 @@ const useStyles = makeStyles()(theme => {
display: 'flex',
flexDirection: 'row',
alignItems: 'center',
justifyContent: 'flex-end',
cursor: 'default'
},
activeLiquidityIcon: {
Expand Down Expand Up @@ -241,6 +242,20 @@ const useStyles = makeStyles()(theme => {
...typography.caption2,
textAlign: 'right',
marginLeft: 4
},
lastGlobalBuyPrice: {
display: 'inline-block',
color: colors.invariant.plotGreen,
...typography.caption2,
textAlign: 'right',
marginLeft: 4
},
lastGlobalSellPrice: {
display: 'inline-block',
color: colors.invariant.plotRed,
...typography.caption2,
textAlign: 'right',
marginLeft: 4
}
}
})
Expand Down
2 changes: 1 addition & 1 deletion src/components/PopularPools/Card/StatsLabel/style.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,7 @@ export const useStyles = makeStyles()(() => ({
...typography.caption4,
color: colors.invariant.green,
textShadow: '0px 0px 5px rgba(46, 224, 154, 1)',
fontWeight: 700,
fontWeight: 500,
fontSize: 20
}
}))
2 changes: 2 additions & 0 deletions src/components/PositionDetails/PositionDetails.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -311,6 +311,8 @@ const PositionDetails: React.FC<IProps> = ({
}
}
globalPrice={globalPrice}
tokenAPriceData={xToY ? tokenXPriceData : tokenYPriceData}
tokenBPriceData={xToY ? tokenYPriceData : tokenXPriceData}
/>
</Grid>
</Grid>
Expand Down
12 changes: 11 additions & 1 deletion src/components/PositionDetails/SinglePositionPlot/SinglePositionPlot.stories.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -49,7 +49,17 @@ export const Primary: Story = {
decimal: 12
},
xToY: true,
hasTicksError: false
hasTicksError: false,
tokenAPriceData: {
price: 100000,
buyPrice: 105000,
sellPrice: 95000
},
tokenBPriceData: {
price: 4000,
buyPrice: 4100,
sellPrice: 3900
}
},
render: args => {
return (
Expand Down
17 changes: 13 additions & 4 deletions src/components/PositionDetails/SinglePositionPlot/SinglePositionPlot.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,8 @@ import {
calcPriceByTickIndex,
calcTicksAmountInRange,
numberToString,
spacingMultiplicityGte
spacingMultiplicityGte,
TokenPriceData
} from '@utils/utils'
import { PlotTickData } from '@store/reducers/positions'
import React, { useEffect, useState } from 'react'
Expand Down Expand Up @@ -35,6 +36,8 @@ export interface ISinglePositionPlot {
min: number
max: number
}
tokenAPriceData: TokenPriceData | undefined
tokenBPriceData: TokenPriceData | undefined
}

const SinglePositionPlot: React.FC<ISinglePositionPlot> = ({
Expand All @@ -53,7 +56,9 @@ const SinglePositionPlot: React.FC<ISinglePositionPlot> = ({
xToY,
hasTicksError,
reloadHandler,
volumeRange
volumeRange,
tokenAPriceData,
tokenBPriceData
}) => {
const { classes } = useStyles()

Expand Down Expand Up @@ -185,8 +190,10 @@ const SinglePositionPlot: React.FC<ISinglePositionPlot> = ({
</Typography>
</Tooltip>
<Grid container flexDirection='column'>
<Typography className={classes.currentPrice}>Current price ━━━</Typography>
<Typography className={classes.globalPrice}>Global price ━━━</Typography>
<Typography className={classes.currentPrice}>Current price</Typography>
<Typography className={classes.globalPrice}>Global price</Typography>
<Typography className={classes.lastGlobalBuyPrice}>Last global buy price</Typography>
<Typography className={classes.lastGlobalSellPrice}>Last global sell price</Typography>
</Grid>
</Grid>
</Grid>
Expand All @@ -212,6 +219,8 @@ const SinglePositionPlot: React.FC<ISinglePositionPlot> = ({
reloadHandler={reloadHandler}
volumeRange={volumeRange}
globalPrice={globalPrice}
tokenAPriceData={tokenAPriceData}
tokenBPriceData={tokenBPriceData}
/>
</Grid>
<Grid className={classes.minMaxInfo}>
Expand Down
15 changes: 15 additions & 0 deletions src/components/PositionDetails/SinglePositionPlot/style.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -91,6 +91,7 @@ export const useStyles = makeStyles()((theme: Theme) => ({
display: 'flex',
flexDirection: 'row',
alignItems: 'center',
justifyContent: 'flex-end',
cursor: 'default'
},
activeLiquidityIcon: {
Expand Down Expand Up @@ -151,6 +152,20 @@ export const useStyles = makeStyles()((theme: Theme) => ({
...typography.caption2,
textAlign: 'right',
marginLeft: 4
},
lastGlobalBuyPrice: {
display: 'inline-block',
color: colors.invariant.plotGreen,
...typography.caption2,
textAlign: 'right',
marginLeft: 4
},
lastGlobalSellPrice: {
display: 'inline-block',
color: colors.invariant.plotRed,
...typography.caption2,
textAlign: 'right',
marginLeft: 4
}
}))

Expand Down
8 changes: 4 additions & 4 deletions src/components/PriceRangePlot/PriceRangePlot.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -327,7 +327,7 @@ export const PriceRangePlot: React.FC<IPriceRangePlot> = ({
const unitLen = innerWidth / (plotMax - plotMin)
return (
<svg
x={(tokenAPriceData.buyPrice / tokenBPriceData.price - plotMin) * unitLen}
x={(tokenAPriceData.buyPrice / tokenBPriceData.price - plotMin) * unitLen - 20}
y={0}
width={60}
height={innerHeight}>
Expand All @@ -337,7 +337,7 @@ export const PriceRangePlot: React.FC<IPriceRangePlot> = ({
</filter>
</defs>
<rect x={14} y={20} width='16' height={innerHeight} filter='url(#shadow)' opacity='0.3' />
<rect x={19} y={20} width='3' height={innerHeight} fill={colors.white.main} />
<rect x={19} y={20} width='3' height={innerHeight} fill={colors.invariant.plotGreen} />
</svg>
)
}
Expand All @@ -350,7 +350,7 @@ export const PriceRangePlot: React.FC<IPriceRangePlot> = ({
const unitLen = innerWidth / (plotMax - plotMin)
return (
<svg
x={(tokenAPriceData.sellPrice / tokenBPriceData.price - plotMin) * unitLen}
x={(tokenAPriceData.sellPrice / tokenBPriceData.price - plotMin) * unitLen - 20}
y={0}
width={60}
height={innerHeight}>
Expand All @@ -360,7 +360,7 @@ export const PriceRangePlot: React.FC<IPriceRangePlot> = ({
</filter>
</defs>
<rect x={14} y={20} width='16' height={innerHeight} filter='url(#shadow)' opacity='0.3' />
<rect x={19} y={20} width='3' height={innerHeight} fill={colors.white.main} />
<rect x={19} y={20} width='3' height={innerHeight} fill={colors.invariant.plotRed} />
</svg>
)
}
Expand Down
112 changes: 57 additions & 55 deletions src/components/Stats/PoolList/PoolList.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -131,61 +131,63 @@ const PoolList: React.FC<PoolListInterface> = ({
const pages = Math.ceil(data.length / 10)

return (
<div className={classNames({ [classes.loadingOverlay]: isLoading })}>
<Grid container direction='column' classes={{ root: classes.container }}>
<>
<PoolListItem
displayType='header'
onSort={setSortType}
sortType={sortType}
network={network}
/>
{data.length > 0 || isLoading ? (
paginator(page).map((element, index) => (
<PoolListItem
displayType='token'
tokenIndex={index + 1 + (page - 1) * 10}
symbolFrom={element.symbolFrom}
symbolTo={element.symbolTo}
iconFrom={element.iconFrom}
iconTo={element.iconTo}
volume={element.volume}
TVL={element.TVL}
// lockedX={element.lockedX}
// lockedY={element.lockedY}
// liquidityX={element.liquidityX}
// liquidityY={element.liquidityY}
// isLocked={element.lockedX > 0 || element.lockedY > 0}
fee={element.fee}
apy={element.apy}
hideBottomLine={pages === 1 && index + 1 === data.length}
apyData={element.apyData}
key={index}
addressFrom={element.addressFrom}
addressTo={element.addressTo}
network={network}
isUnknownFrom={element.isUnknownFrom}
isUnknownTo={element.isUnknownTo}
poolAddress={element.poolAddress}
copyAddressHandler={copyAddressHandler}
/>
))
) : (
<NotFoundPlaceholder title='No pools found...' />
)}
{pages > 1 ? (
<Grid className={classes.pagination}>
<PaginationList
pages={pages}
defaultPage={1}
handleChangePage={handleChangePagination}
variant='flex-end'
/>
</Grid>
) : null}
</>
</Grid>
</div>
<Grid
container
direction='column'
classes={{ root: classes.container }}
className={classNames({ [classes.loadingOverlay]: isLoading })}>
<>
<PoolListItem
displayType='header'
onSort={setSortType}
sortType={sortType}
network={network}
/>
{data.length > 0 || isLoading ? (
paginator(page).map((element, index) => (
<PoolListItem
displayType='token'
tokenIndex={index + 1 + (page - 1) * 10}
symbolFrom={element.symbolFrom}
symbolTo={element.symbolTo}
iconFrom={element.iconFrom}
iconTo={element.iconTo}
volume={element.volume}
TVL={element.TVL}
// lockedX={element.lockedX}
// lockedY={element.lockedY}
// liquidityX={element.liquidityX}
// liquidityY={element.liquidityY}
// isLocked={element.lockedX > 0 || element.lockedY > 0}
fee={element.fee}
apy={element.apy}
hideBottomLine={pages === 1 && index + 1 === data.length}
apyData={element.apyData}
key={index}
addressFrom={element.addressFrom}
addressTo={element.addressTo}
network={network}
isUnknownFrom={element.isUnknownFrom}
isUnknownTo={element.isUnknownTo}
poolAddress={element.poolAddress}
copyAddressHandler={copyAddressHandler}
/>
))
) : (
<NotFoundPlaceholder title='No pools found...' />
)}
{pages > 1 ? (
<Grid className={classes.pagination}>
<PaginationList
pages={pages}
defaultPage={1}
handleChangePage={handleChangePagination}
variant='flex-end'
/>
</Grid>
) : null}
</>
</Grid>
)
}
export default PoolList
Loading
Loading