Skip to content

Commit 37315e6

Browse files
p6tep6te
authored
Merge pull request #276 from invariant-labs/dev
Update staging
2 parents c1d8e90 + 18da8b5 commit 37315e6

File tree

44 files changed

+825
-753
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

44 files changed

+825
-753
lines changed

‎package-lock.json‎

Lines changed: 4 additions & 3 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
@@ -17,7 +17,7 @@
1717
"dependencies": {
1818
"@emotion/react": "^11.11.4",
1919
"@emotion/styled": "^11.11.5",
20-
"@invariant-labs/a0-sdk": "^0.2.16",
20+
"@invariant-labs/a0-sdk": "^0.2.17",
2121
"@mui/icons-material": "^5.15.15",
2222
"@mui/material": "^5.15.15",
2323
"@nightlylabs/wallet-selector-polkadot": "^0.2.5",

‎src/components/EmptyPlaceholder/EmptyPlaceholder.tsx‎

Lines changed: 11 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -9,9 +9,14 @@ export interface IEmptyPlaceholder {
99
onAction?: () => void
1010
className?: string
1111
style?: React.CSSProperties
12+
withButton?: boolean
1213
}
1314

14-
export const EmptyPlaceholder: React.FC<IEmptyPlaceholder> = ({ desc, onAction }) => {
15+
export const EmptyPlaceholder: React.FC<IEmptyPlaceholder> = ({
16+
desc,
17+
onAction,
18+
withButton = true
19+
}) => {
1520
const { classes } = useStyles()
1621

1722
return (
@@ -22,9 +27,11 @@ export const EmptyPlaceholder: React.FC<IEmptyPlaceholder> = ({ desc, onAction }
2227
<img className={classes.img} src={icons.empty} alt='Not connected' />
2328
<Typography className={classes.desc}>It's empty here...</Typography>
2429
{desc?.length && <Typography className={classes.desc}>{desc}</Typography>}
25-
<Button className={classes.button} onClick={onAction} variant='contained'>
26-
Add a position
27-
</Button>
30+
{withButton && (
31+
<Button className={classes.button} onClick={onAction} variant='contained'>
32+
Add a position
33+
</Button>
34+
)}
2835
</Grid>
2936
</Grid>
3037
</>

‎src/components/Header/Header.tsx‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ import { Box, Button, CardMedia, Grid, IconButton, useMediaQuery } from '@mui/ma
66
import icons from '@static/icons'
77
import Hamburger from '@static/svg/Hamburger.svg'
88
import { theme } from '@static/theme'
9-
import { AlephZeroNetworks, CHAINS } from '@store/consts/static'
9+
import { RPC, CHAINS } from '@store/consts/static'
1010
import { blurContent, unblurContent } from '@utils/uiUtils'
1111
import { useEffect, useState } from 'react'
1212
import { Link, useNavigate } from 'react-router-dom'
@@ -80,8 +80,8 @@ export const Header: React.FC<IHeader> = ({
8080
const testnetRPCs = [
8181
{
8282
networkType: Network.Testnet,
83-
rpc: AlephZeroNetworks.TEST,
84-
rpcName: 'Aleph zero'
83+
rpc: RPC.TEST,
84+
rpcName: 'Aleph Zero'
8585
}
8686
]
8787

‎src/components/Header/HeaderButton/HeaderButton.stories.tsx‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { AlephZeroNetworks } from '@store/consts/static'
1+
import { RPC } from '@store/consts/static'
22
import type { StoryObj } from '@storybook/react'
33
import { fn } from '@storybook/test'
44
import ChangeWalletButton from './ChangeWalletButton'
@@ -59,7 +59,7 @@ export const SelectNetwork: Story = {
5959
<div style={{ padding: '100px' }}>
6060
<SelectNetworkButton
6161
name={Network.Testnet}
62-
networks={[{ networkType: Network.Testnet, rpc: AlephZeroNetworks.TEST }]}
62+
networks={[{ networkType: Network.Testnet, rpc: RPC.TEST }]}
6363
onSelect={(networkType, rpc) => action('chosen: ' + networkType + ' ' + rpc)()}
6464
/>
6565
</div>
@@ -70,11 +70,11 @@ export const SelectRPC: Story = {
7070
render: () => (
7171
<div style={{ padding: '100px' }}>
7272
<SelectRPCButton
73-
rpc={AlephZeroNetworks.TEST}
73+
rpc={RPC.TEST}
7474
networks={[
7575
{
7676
networkType: Network.Testnet,
77-
rpc: AlephZeroNetworks.TEST,
77+
rpc: RPC.TEST,
7878
rpcName: 'Testnet'
7979
}
8080
]}

‎src/components/Inputs/DepositAmountInput/DepositAmountInput.tsx‎

Lines changed: 12 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -164,9 +164,18 @@ export const DepositAmountInput: React.FC<IProps> = ({
164164
priceLoading ? (
165165
<img src={loadingAnimation} className={classes.loading} alt='loading' />
166166
) : tokenPrice ? (
167-
<Typography className={classes.caption2}>
168-
~${formatNumber(usdBalance.toFixed(2))}
169-
</Typography>
167+
<Tooltip
168+
enterTouchDelay={0}
169+
leaveTouchDelay={Number.MAX_SAFE_INTEGER}
170+
title='Estimated USD Value of the Selected Tokens in Your Wallet'
171+
placement='bottom'
172+
classes={{
173+
tooltip: classes.tooltip
174+
}}>
175+
<Typography className={classes.estimatedBalance}>
176+
~${formatNumber(usdBalance.toFixed(2))}
177+
</Typography>
178+
</Tooltip>
170179
) : (
171180
<Tooltip
172181
enterTouchDelay={0}

‎src/components/Inputs/DepositAmountInput/style.ts‎

Lines changed: 21 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,19 @@ import { Theme } from '@mui/material'
22
import { colors, typography } from '@static/theme'
33
import { makeStyles } from 'tss-react/mui'
44

5+
const caption2styles = {
6+
...typography.caption2,
7+
color: colors.invariant.lightHover,
8+
overflow: 'hidden',
9+
whiteSpace: 'nowrap',
10+
textOverflow: 'ellipsis',
11+
display: 'flex',
12+
alignItems: 'center',
13+
14+
paddingBlock: 6,
15+
flexShrink: 1,
16+
marginRight: 6
17+
}
518
export const useStyles = makeStyles<{ isSelected: boolean }>()((theme: Theme, { isSelected }) => ({
619
wrapper: {
720
position: 'relative',
@@ -105,17 +118,7 @@ export const useStyles = makeStyles<{ isSelected: boolean }>()((theme: Theme, {
105118
marginRight: 10
106119
},
107120
caption2: {
108-
...typography.caption2,
109-
color: colors.invariant.lightHover,
110-
overflow: 'hidden',
111-
whiteSpace: 'nowrap',
112-
textOverflow: 'ellipsis',
113-
display: 'flex',
114-
alignItems: 'center',
115-
116-
paddingBlock: 6,
117-
flexShrink: 1,
118-
marginRight: 6,
121+
...caption2styles,
119122

120123
'&:hover': {
121124
color: isSelected ? colors.white.main : '',
@@ -124,6 +127,9 @@ export const useStyles = makeStyles<{ isSelected: boolean }>()((theme: Theme, {
124127
}
125128
}
126129
},
130+
estimatedBalance: {
131+
...caption2styles
132+
},
127133
maxButton: {
128134
color: colors.invariant.componentBcg,
129135
...typography.tiny2,
@@ -206,13 +212,11 @@ export const useStyles = makeStyles<{ isSelected: boolean }>()((theme: Theme, {
206212
height: 15
207213
},
208214
tooltip: {
209-
background: colors.invariant.componentBcg,
210-
border: `1px solid ${colors.invariant.lightGrey}`,
211-
borderRadius: 12,
212-
padding: 10,
215+
color: colors.invariant.textGrey,
213216
...typography.caption4,
214-
fontSize: 13,
215-
color: colors.white.main
217+
lineHeight: '24px',
218+
background: colors.black.full,
219+
borderRadius: 12
216220
},
217221
loadingBalance: {
218222
padding: '0 10px 0 20px',

‎src/components/Inputs/ExchangeAmountInput/ExchangeAmountInput.tsx‎

Lines changed: 11 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -18,8 +18,8 @@ interface IProps {
1818
style?: CSSProperties
1919
onMaxClick: () => void
2020
current: SwapToken | null
21-
tokens: SwapToken[]
22-
onSelect: (index: number) => void
21+
tokens: Record<string, SwapToken>
22+
onSelect: (address: string) => void
2323
disabled: boolean
2424
balance?: string
2525
hideBalances?: boolean
@@ -184,11 +184,18 @@ export const AmountInput: React.FC<IProps> = ({
184184
priceLoading ? (
185185
<img src={loadingAnimation} className={classes.loading} alt='loading' />
186186
) : tokenPrice ? (
187-
<>
187+
<Tooltip
188+
enterTouchDelay={0}
189+
leaveTouchDelay={Number.MAX_SAFE_INTEGER}
190+
title='Estimated USD Value of the Selected Tokens in Your Wallet'
191+
placement='bottom'
192+
classes={{
193+
tooltip: classes.tooltip
194+
}}>
188195
<Typography className={classes.caption2}>
189196
~${formatNumber(usdBalance.toFixed(2))}
190197
</Typography>
191-
</>
198+
</Tooltip>
192199
) : (
193200
<Tooltip
194201
enterTouchDelay={0}

‎src/components/Inputs/ExchangeAmountInput/style.ts‎

Lines changed: 4 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -128,13 +128,11 @@ export const useStyles = makeStyles<{ walletDisconnected: boolean }>()(
128128
height: 15
129129
},
130130
tooltip: {
131-
background: colors.invariant.componentBcg,
132-
border: `1px solid ${colors.invariant.lightGrey}`,
133-
borderRadius: 12,
134-
padding: 10,
131+
color: colors.invariant.textGrey,
135132
...typography.caption4,
136-
fontSize: 13,
137-
color: colors.white.main
133+
lineHeight: '24px',
134+
background: colors.black.full,
135+
borderRadius: 12
138136
},
139137
percentages: {
140138
flexShrink: 0,

‎src/components/Inputs/Select/Select.stories.tsx‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -2,8 +2,8 @@ import type { Meta, StoryObj } from '@storybook/react'
22
import { fn } from '@storybook/test'
33
import Select from './Select'
44

5-
const tokens: any[] = [
6-
{
5+
const tokens: any = {
6+
So11111111111111111111111111111111111111112: {
77
balance: 111,
88
decimals: 6,
99
symbol: 'SOL',
@@ -12,7 +12,7 @@ const tokens: any[] = [
1212
logoURI:
1313
'https://raw.githubusercontent.com/solana-labs/token-list/main/assets/mainnet/So11111111111111111111111111111111111111112/logo.png'
1414
},
15-
{
15+
'9n4nbM75f5Ui33ZbPYXn59EwSgE8CGsHtAeTH5YFeJ9E': {
1616
balance: 1000,
1717
decimals: 6,
1818
symbol: 'BTC',
@@ -21,7 +21,7 @@ const tokens: any[] = [
2121
logoURI:
2222
'https://raw.githubusercontent.com/solana-labs/token-list/main/assets/mainnet/9n4nbM75f5Ui33ZbPYXn59EwSgE8CGsHtAeTH5YFeJ9E/logo.png'
2323
},
24-
{
24+
EPjFWdd5AufqSSqeM2qN1xzybapC8G4wEGGkZwyTDt1v: {
2525
balance: 222,
2626
decimals: 6,
2727
symbol: 'USDC',
@@ -30,7 +30,7 @@ const tokens: any[] = [
3030
logoURI:
3131
'https://raw.githubusercontent.com/solana-labs/token-list/main/assets/mainnet/EPjFWdd5AufqSSqeM2qN1xzybapC8G4wEGGkZwyTDt1v/logo.png'
3232
}
33-
]
33+
}
3434

3535
const meta = {
3636
title: 'Inputs/Select',

0 commit comments

Comments
 (0)