Skip to content

Commit cdd9e63

Browse files
aalavandhanaalavandhan
committed
ui bug fixes, staking balance fix
1 parent 728bea6 commit cdd9e63

File tree

11 files changed

+112
-46
lines changed

11 files changed

+112
-46
lines changed

‎frontend/.yarn/install-state.gz‎

6.06 KB
Binary file not shown.

‎frontend/craco.config.js‎

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,13 @@ module.exports = {
1111
configure: (webpackConfig) => {
1212
webpackConfig.module.rules.push({
1313
test: /\.js$/,
14-
include: [path.resolve(__dirname, 'node_modules/@web3-onboard'), path.resolve(__dirname, 'node_modules/viem')], // Include @web3-onboard and viem packages
14+
include: [
15+
path.resolve(__dirname, 'node_modules/@web3-onboard/core'),
16+
path.resolve(__dirname, 'node_modules/@web3-onboard/injected-wallets'),
17+
path.resolve(__dirname, 'node_modules/@web3-onboard/wagmi'),
18+
path.resolve(__dirname, 'node_modules/@wagmi'),
19+
path.resolve(__dirname, 'node_modules/viem'),
20+
],
1521
use: {
1622
loader: 'babel-loader',
1723
options: {

‎frontend/package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@
66
"@ampleforthorg/sdk": "1.0.33",
77
"@apollo/client": "^3.3.16",
88
"@craco/craco": "^6.1.2",
9-
"@headlessui/react": "^1.4.1",
9+
"@headlessui/react": "^1.7.18",
1010
"@heroicons/react": "v1",
1111
"@testing-library/jest-dom": "^5.11.4",
1212
"@testing-library/react": "^11.1.0",

‎frontend/src/App.tsx‎

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -15,10 +15,10 @@ import { GeyserFirstContainer } from 'components/GeyserFirst/GeyserFirstContaine
1515
function App() {
1616
return (
1717
<Web3Provider>
18-
<WalletContextProvider>
19-
<SubgraphProvider>
20-
<GeyserContextProvider>
21-
<VaultContextProvider>
18+
<SubgraphProvider>
19+
<GeyserContextProvider>
20+
<VaultContextProvider>
21+
<WalletContextProvider>
2222
<StatsContextProvider>
2323
<Router>
2424
<Header />
@@ -46,10 +46,10 @@ function App() {
4646
</Routes>
4747
</Router>
4848
</StatsContextProvider>
49-
</VaultContextProvider>
50-
</GeyserContextProvider>
51-
</SubgraphProvider>
52-
</WalletContextProvider>
49+
</WalletContextProvider>
50+
</VaultContextProvider>
51+
</GeyserContextProvider>
52+
</SubgraphProvider>
5353
</Web3Provider>
5454
)
5555
}

‎frontend/src/components/GeyserFirst/EstimatedRewards.tsx‎

Lines changed: 23 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -34,26 +34,39 @@ export const EstimatedRewards: React.FC<Props> = ({ parsedUserInput }) => {
3434
} = useContext(StatsContext)
3535

3636
useEffect(() => {
37+
let isMounted = true
3738
setIsCalculating(true)
3839
const debounceTimer = setTimeout(async () => {
39-
const aggregateDepositUSD = new BigNumber(parsedUserInput.toString())
40-
.div(10 ** stakingTokenDecimals)
41-
.plus(currentStake)
42-
.times(stakingTokenPrice)
43-
const isZero = aggregateDepositUSD.eq('0')
44-
const newRewards = isZero ? 0.0 : await computeRewardsFromAdditionalStakes(parsedUserInput)
45-
const newDeposits = isZero ? 0.0 : aggregateDepositUSD.toNumber()
46-
setRewards(newRewards)
47-
setDeposits(newDeposits)
48-
setIsCalculating(false)
40+
try {
41+
const aggregateDepositUSD = new BigNumber(parsedUserInput.toString())
42+
.div(10 ** stakingTokenDecimals)
43+
.plus(currentStake)
44+
.times(stakingTokenPrice)
45+
const isZero = aggregateDepositUSD.eq('0')
46+
const newRewards = isZero ? 0.0 : await computeRewardsFromAdditionalStakes(parsedUserInput)
47+
const newDeposits = isZero ? 0.0 : aggregateDepositUSD.toNumber()
48+
49+
if (isMounted) {
50+
setRewards(newRewards)
51+
setDeposits(newDeposits)
52+
setIsCalculating(false)
53+
}
54+
} catch (error) {
55+
if (isMounted) {
56+
setIsCalculating(false)
57+
}
58+
console.error('Error calculating rewards:', error)
59+
}
4960
}, 500)
5061

5162
return () => {
63+
isMounted = false
5264
clearTimeout(debounceTimer)
5365
}
5466
}, [parsedUserInput, computeRewardsFromAdditionalStakes, currentStake, stakingTokenPrice, stakingTokenDecimals])
5567

5668
const geyserRewardsUSD = rewards * rewardTokenPrice
69+
5770
return (
5871
<EstimatedRewardsContainer>
5972
<ColoredDiv />

‎frontend/src/components/GeyserFirst/GeyserStakeView.tsx‎

Lines changed: 19 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -67,23 +67,29 @@ export const GeyserStakeView = () => {
6767
setParsedUserInput(BigNumber.from('0'))
6868
}
6969

70+
const setDefaultInputAmount = () => {
71+
if (stakingTokenInfo.price > 0) {
72+
const initialStakeAmountUSD = 1000
73+
const stakeAmt = Math.max(initialStakeAmountUSD / stakingTokenInfo.price, 0.000001)
74+
const stakeAmtFP = parseUnits(stakeAmt.toFixed(stakingTokenInfo.decimals), stakingTokenInfo.decimals)
75+
setUserInput(stakeAmt)
76+
setParsedUserInput(BigNumber.from(stakeAmtFP))
77+
}
78+
}
79+
7080
useEffect(() => {
7181
refreshInputAmount()
72-
if (geyserAction === GeyserAction.STAKE && stakingTokenInfo.price > 0) {
73-
if (currentStakeAmount.eq(0)) {
74-
if (stakableAmount.gt(0)) {
75-
setUserInput(formatUnits(stakableAmount, stakingTokenDecimals))
76-
setParsedUserInput(stakableAmount)
77-
} else {
78-
const initialStakeAmountUSD = 1000
79-
const stakeAmt = Math.max(initialStakeAmountUSD / stakingTokenInfo.price, 0.000001)
80-
const stakeAmtFP = parseUnits(stakeAmt.toFixed(stakingTokenInfo.decimals), stakingTokenInfo.decimals)
81-
setUserInput(stakeAmt)
82-
setParsedUserInput(BigNumber.from(stakeAmtFP))
83-
}
82+
if (geyserAction === GeyserAction.STAKE) {
83+
if (!address) {
84+
setDefaultInputAmount()
85+
} else if (currentStakeAmount.eq(0) && stakableAmount.eq(0)) {
86+
setDefaultInputAmount()
87+
} else if (currentStakeAmount.eq(0) && stakableAmount.gt(0)) {
88+
setUserInput(formatUnits(stakableAmount, stakingTokenDecimals))
89+
setParsedUserInput(stakableAmount)
8490
}
8591
}
86-
}, [geyserAction, stakingTokenBalance, currentStakeable])
92+
}, [address, geyserAction, stakingTokenBalance, currentStakeable])
8793

8894
const handleGeyserInteraction = () => {
8995
if (geyserAction === GeyserAction.STAKE) {

‎frontend/src/components/GeyserFirst/UnstakeSummary.tsx‎

Lines changed: 14 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -33,15 +33,25 @@ export const UnstakeSummary: React.FC<Props> = ({ userInput, parsedUserInput })
3333
const rewardUSD = rewardAmount * rewardTokenPrice + bonusRewards.reduce((m, b) => m + rewardsShare * b.value, 0)
3434

3535
useEffect(() => {
36+
let isMounted = true
3637
;(async () => {
3738
try {
38-
setRewardAmount(await computeRewardsFromUnstake(parsedUserInput))
39-
setRewardsShare(await computeRewardsShareFromUnstake(parsedUserInput))
39+
const computedRewardAmount = await computeRewardsFromUnstake(parsedUserInput)
40+
const computedRewardsShare = await computeRewardsShareFromUnstake(parsedUserInput)
41+
if (isMounted) {
42+
setRewardAmount(computedRewardAmount)
43+
setRewardsShare(computedRewardsShare)
44+
}
4045
} catch (e) {
41-
console.log('Error: user input higher than user stake')
46+
if (isMounted) {
47+
console.log('Error: user input higher than user stake')
48+
}
4249
}
4350
})()
44-
}, [parsedUserInput])
51+
return () => {
52+
isMounted = false
53+
}
54+
}, [parsedUserInput, computeRewardsFromUnstake, computeRewardsShareFromUnstake])
4555

4656
return (
4757
<Container>

‎frontend/src/components/Header.tsx‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -104,7 +104,9 @@ const RightContainer = styled.div`
104104
${tw`ml-0 order-3 w-4/12`}
105105
`
106106

107-
const HeaderTabItem = styled(Tab)<{ isSelected: boolean }>`
107+
const HeaderTabItem = styled(Tab).withConfig({
108+
shouldForwardProp: (prop) => prop !== 'isSelected',
109+
})<{ isSelected: boolean }>`
108110
${tw`font-normal tracking-wider px-4 py-2 text-center cursor-pointer`}
109111
${({ isSelected }) => (isSelected ? tw`text-black font-bold` : tw`text-gray hover:text-black`)};
110112
${({ isSelected }) => isSelected && `background-color: #f9f9f9;`}

‎frontend/src/components/Home.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -99,7 +99,7 @@ export const Home = () => {
9999
</TableCell>
100100
<DataCell>{g.tvl > 0 ? `${safeNumeral(g.tvl, '$0,0')}` : 'N/A'}</DataCell>
101101
<DataCell>{g.rewards > 0 ? `${safeNumeral(g.rewards, '$0,0')}` : 'N/A'}</DataCell>
102-
<ApyCell>{g.apy > 0 ? `>${safeNumeral(g.apy, '0.00%')}` : 'N/A'}</ApyCell>
102+
<ApyCell>{g.apy > 0 ? `~${safeNumeral(g.apy, '0.00%')}` : 'N/A'}</ApyCell>
103103
</BodyRow>
104104
))}
105105
</tbody>

‎frontend/src/context/StatsContext.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -50,7 +50,7 @@ export const StatsContextProvider: React.FC = ({ children }) => {
5050
const [geyserStats, setGeyserStats] = useState<GeyserStats>(defaultGeyserStats())
5151
const [vaultStats, setVaultStats] = useState<VaultStats>(defaultVaultStats())
5252

53-
const { signer, provider } = useContext(Web3Context)
53+
const { signer, provider, validNetwork } = useContext(Web3Context)
5454
const { selectedGeyserInfo, allTokensInfos } = useContext(GeyserContext)
5555
const { selectedVault, currentLock } = useContext(VaultContext)
5656

@@ -179,7 +179,7 @@ export const StatsContextProvider: React.FC = ({ children }) => {
179179
;(async () => {
180180
try {
181181
const { geyser: selectedGeyser, stakingTokenInfo, rewardTokenInfo } = selectedGeyserInfo
182-
if (selectedGeyser && stakingTokenInfo.address && rewardTokenInfo.address) {
182+
if (validNetwork && selectedGeyser && stakingTokenInfo.address && rewardTokenInfo.address) {
183183
if (mounted) {
184184
await refreshStats()
185185
}

0 commit comments

Comments
 (0)