From 8dac44fa5bb356b64f799b4a80d83ee7edf2d150 Mon Sep 17 00:00:00 2001 From: vidvidvid Date: Mon, 3 Feb 2025 23:12:25 +0100 Subject: [PATCH] ion/eth -> ion/mode --- packages/ui/app/veion/page.tsx | 17 ++-- packages/ui/components/TokenPair.tsx | 2 +- .../dialogs/VeIon/MigrateIonDialog.tsx | 18 +++- .../components/veion/DelegateVeIonTable.tsx | 4 +- packages/ui/components/veion/LPRow.tsx | 91 +++++++++++-------- packages/ui/components/veion/MyVeionTable.tsx | 4 +- packages/ui/hooks/useLiquidityCalculations.ts | 58 +++++++----- packages/ui/hooks/veion/useMarketRows.ts | 1 - packages/ui/hooks/veion/useVeAPR.ts | 15 +-- packages/ui/hooks/veion/useVeIONData.ts | 2 +- packages/ui/utils/getLiquidityTokens.ts | 25 +++-- packages/ui/utils/getStakingTokens.ts | 13 ++- packages/ui/utils/veion/tokenUtils.ts | 4 +- 13 files changed, 148 insertions(+), 106 deletions(-) diff --git a/packages/ui/app/veion/page.tsx b/packages/ui/app/veion/page.tsx index 4c4d544348..26d8cb1437 100644 --- a/packages/ui/app/veion/page.tsx +++ b/packages/ui/app/veion/page.tsx @@ -38,8 +38,7 @@ export default function VeIon() { const chainId = useChainId(); const searchParams = useSearchParams(); const querychain = searchParams.get('chain'); - const queryToken = searchParams.get('token'); - const selectedtoken = queryToken ?? 'eth'; + const selectedtoken = querychain === '8453' ? 'eth' : 'mode'; const chain = querychain ? querychain : String(chainId); return ( @@ -105,6 +104,7 @@ export default function VeIon() { onClick: () => setIsAddLiquidityOpen(true), get: 'vAMM' }} + chain={+chain} /> setIsMigrateOpen(true), get: 'vAMM' }} + chain={+chain} /> setIsDialogOpen(true), get: 'veION' }} + chain={+chain} /> @@ -152,11 +154,6 @@ export default function VeIon() { - + ); diff --git a/packages/ui/components/TokenPair.tsx b/packages/ui/components/TokenPair.tsx index ce42718e42..13c69ffaa4 100644 --- a/packages/ui/components/TokenPair.tsx +++ b/packages/ui/components/TokenPair.tsx @@ -18,7 +18,7 @@ const TokenPair = ({ className="rounded-full" /> {`${token2} void; + selectedToken: 'eth' | 'mode' | 'weth'; } export default function MigrateIonDialog({ isOpen, - onOpenChange + onOpenChange, + selectedToken }: MigrateIonDialogProps) { const { isConnected, address, chainId } = useAccount(); const [amount, setAmount] = useState(''); @@ -37,8 +39,14 @@ export default function MigrateIonDialog({ const { currentChain } = useVeIONContext(); const { removeLiquidity, isPending } = useVeIONActions(); - const stakingContractAddress = getStakingToContract(currentChain, 'eth'); - const stakingTokenAddress = getAvailableStakingToken(currentChain, 'eth'); + const stakingContractAddress = getStakingToContract( + currentChain, + selectedToken + ); + const stakingTokenAddress = getAvailableStakingToken( + currentChain, + selectedToken + ); const allStakedAmount = useReadContract({ abi: StakingContractAbi, @@ -75,7 +83,7 @@ export default function MigrateIonDialog({ await removeLiquidity({ liquidity: amount, - selectedToken: 'eth' + selectedToken }); allStakedAmount.refetch(); @@ -100,7 +108,7 @@ export default function MigrateIonDialog({ setAmount(val || '')} - tokenName="ion/eth" + tokenName={`ion/${selectedToken}`} token={stakingTokenAddress} chain={currentChain} max={ diff --git a/packages/ui/components/veion/DelegateVeIonTable.tsx b/packages/ui/components/veion/DelegateVeIonTable.tsx index 707d3a32e4..2d4a00ea34 100644 --- a/packages/ui/components/veion/DelegateVeIonTable.tsx +++ b/packages/ui/components/veion/DelegateVeIonTable.tsx @@ -66,9 +66,7 @@ function DelegateVeionTable({ onUndelegateSuccess }: DelegateVeionTableProps) {
{row.getValue('tokensLocked')}
-
- Balancer LP -
+
Aero LP
) diff --git a/packages/ui/components/veion/LPRow.tsx b/packages/ui/components/veion/LPRow.tsx index 549a8edd6e..ce3993c762 100644 --- a/packages/ui/components/veion/LPRow.tsx +++ b/packages/ui/components/veion/LPRow.tsx @@ -1,4 +1,5 @@ import { ArrowRight } from 'lucide-react'; +import { mode } from 'viem/chains'; import { Button } from '@ui/components/ui/button'; import { Card, CardContent } from '@ui/components/ui/card'; @@ -19,49 +20,63 @@ type Detail = { get: string; }; -const LPRow = ({ summary, detail }: { summary: Summary; detail: Detail }) => ( -
- - -

{summary.title}

-
- -

{summary.amount}

- {summary.Icon} -
- - +const LPRow = ({ + summary, + detail, + chain +}: { + summary: Summary; + detail: Detail; + chain: number; +}) => { + const token2 = chain == mode.id ? 'mode' : 'eth'; - - -
-

{detail.title}

-

GET

-
-
-
+ return ( +
+ + +

{summary.title}

+
-

- ION/WETH +

{summary.amount}

+ {summary.Icon} +
+ + + + + +
+

{detail.title}

+

GET

+
+
+
+ +

+ ION/{token2.toUpperCase()} +

+ +
+

+ {detail.get}

-
-

{detail.get}

-
- - -
-); + + +
+ ); +}; export default LPRow; diff --git a/packages/ui/components/veion/MyVeionTable.tsx b/packages/ui/components/veion/MyVeionTable.tsx index fe9d00b252..77de24f103 100644 --- a/packages/ui/components/veion/MyVeionTable.tsx +++ b/packages/ui/components/veion/MyVeionTable.tsx @@ -64,9 +64,7 @@ function MyVeionTable() {
{row.getValue('tokensLocked')}
-
- Balancer LP -
+
Aero LP
) diff --git a/packages/ui/hooks/useLiquidityCalculations.ts b/packages/ui/hooks/useLiquidityCalculations.ts index b80ee36acc..aaf6f9e20b 100644 --- a/packages/ui/hooks/useLiquidityCalculations.ts +++ b/packages/ui/hooks/useLiquidityCalculations.ts @@ -1,4 +1,3 @@ -// useLiquidityCalculations.ts import { useMemo } from 'react'; import { formatEther, parseUnits, type Address } from 'viem'; @@ -9,7 +8,8 @@ import { getReservesABI, getReservesContract, getReservesArgs, - getToken + getToken, + getPoolToken } from '@ui/utils/getStakingTokens'; interface UseLiquidityCalculationsProps { @@ -23,7 +23,6 @@ export function useLiquidityCalculations({ chainId, selectedToken }: UseLiquidityCalculationsProps) { - // Fetch reserves data const reserves = useReadContract({ abi: getReservesABI(chainId), address: getReservesContract(chainId), @@ -37,17 +36,23 @@ export function useLiquidityCalculations({ } }); - // Fetch balances + // Fetch ION balance const { data: ionBalance, refetch: refetchIonBalance } = useBalance({ address, token: getToken(chainId), chainId }); + // Fetch selected token balance with correct token address const { data: selectedTokenBalance, refetch: refetchSelectedTokenBalance } = useBalance({ address, - ...(selectedToken !== 'eth' && { token: getToken(chainId) }), + // For ETH, don't provide a token address + // For MODE, use the correct MODE token address from getPoolToken + // For WETH, use the WETH address from getPoolToken + ...(selectedToken !== 'eth' && { + token: getPoolToken(selectedToken) + }), chainId }); @@ -59,9 +64,25 @@ export function useLiquidityCalculations({ ]); }; - // Process reserve data considering chain specifics + const calculateTokenAmount = (ionAmount: string): string => { + if (!processedReserves || !ionAmount || processedReserves.ion === 0n) + return ''; + + try { + const parsedIonAmount = parseUnits(ionAmount, 18); + const tokenVal = + (parsedIonAmount * processedReserves.token) / processedReserves.ion; + return formatEther(tokenVal); + } catch (error) { + console.warn('Error calculating token amount:', error); + return ''; + } + }; + const processedReserves = useMemo(() => { - if (reserves.status !== 'success' || !reserves.data) return null; + if (reserves.status !== 'success' || !reserves.data) { + return null; + } const resData = reserves.data as | [bigint, bigint, bigint] @@ -74,29 +95,18 @@ export function useLiquidityCalculations({ }; } - return { + const result = { ion: resData[0], token: resData[1] }; - }, [reserves.status, reserves.data, chainId]); - const calculateTokenAmount = (ionAmount: string): string => { - if (!processedReserves || !ionAmount || processedReserves.ion === 0n) - return ''; - - try { - const parsedIonAmount = parseUnits(ionAmount, 18); - const tokenVal = - (parsedIonAmount * processedReserves.token) / processedReserves.ion; - return formatEther(tokenVal); - } catch (error) { - console.warn('Error calculating token amount:', error); - return ''; - } - }; + return result; + }, [reserves.status, reserves.data, chainId]); const getMaximumIonInput = (): string => { - if (!processedReserves || !selectedTokenBalance || !ionBalance) return '0'; + if (!processedReserves || !selectedTokenBalance || !ionBalance) { + return '0'; + } try { const maxIonBasedOnBalance = ionBalance.value; diff --git a/packages/ui/hooks/veion/useMarketRows.ts b/packages/ui/hooks/veion/useMarketRows.ts index 9e74015a9a..44488768f5 100644 --- a/packages/ui/hooks/veion/useMarketRows.ts +++ b/packages/ui/hooks/veion/useMarketRows.ts @@ -16,7 +16,6 @@ import { multipliers } from '@ui/utils/multipliers'; import { useVoteData } from './useVoteData'; import type { FlywheelReward } from '@ionicprotocol/types'; -import { useVeAPR } from './useVeAPR'; export const useMarketRows = ( chain: number | string, diff --git a/packages/ui/hooks/veion/useVeAPR.ts b/packages/ui/hooks/veion/useVeAPR.ts index 7c72c0b902..094a9440f5 100644 --- a/packages/ui/hooks/veion/useVeAPR.ts +++ b/packages/ui/hooks/veion/useVeAPR.ts @@ -1,9 +1,12 @@ import { useCallback, useEffect, useMemo, useState } from 'react'; -import { Address, createPublicClient, getContract, PublicClient } from 'viem'; + import { usePublicClient } from 'wagmi'; -import { getiVoterContract, getVoterContract } from '@ui/constants/veIon'; +import { getVoterContract } from '@ui/constants/veIon'; import { MarketSide } from '@ui/types/veION'; + +import type { Address } from 'viem'; + import { bribeRewardsAbi } from '@ionicprotocol/sdk/src/generated'; interface UseVeAPRParams { @@ -59,7 +62,7 @@ export function useVeAPR({ })) as Address; if (!rewardAccumulator) { - console.log('No reward accumulator for market:', key); + // console.log('No reward accumulator for market:', key); return; } @@ -74,7 +77,7 @@ export function useVeAPR({ !bribeAddress || bribeAddress === '0x0000000000000000000000000000000000000000' ) { - console.log('No bribe contract for market:', key); + // console.log('No bribe contract for market:', key); return; } @@ -89,10 +92,10 @@ export function useVeAPR({ ...bribeContract, functionName: 'getAllLpRewardTokens' })) as Address[]; - console.log('Reward tokens:', rewardTokens); + // console.log('Reward tokens:', rewardTokens); if (!rewardTokens.length) { - console.log('No reward tokens for market:', key); + // console.log('No reward tokens for market:', key); return; } diff --git a/packages/ui/hooks/veion/useVeIONData.ts b/packages/ui/hooks/veion/useVeIONData.ts index d4c473cb64..aeb499bf82 100644 --- a/packages/ui/hooks/veion/useVeIONData.ts +++ b/packages/ui/hooks/veion/useVeIONData.ts @@ -48,7 +48,7 @@ export function useVeIonData(chainId: number) { }, // Mode staked amount { - address: getStakingToContract(34443, 'eth'), + address: getStakingToContract(34443, 'mode'), abi: StakingContractAbi, functionName: 'totalSupply', chainId: 34443 diff --git a/packages/ui/utils/getLiquidityTokens.ts b/packages/ui/utils/getLiquidityTokens.ts index d363c17f73..858263ef63 100644 --- a/packages/ui/utils/getLiquidityTokens.ts +++ b/packages/ui/utils/getLiquidityTokens.ts @@ -1,7 +1,6 @@ import { BaseReservesContractAddr } from '@ui/constants/baselp'; import { ModeLpAddressPool } from '@ui/constants/lp'; import { ModeTradingContractAddress } from '@ui/constants/modetradingfees'; -import { OPReservesContractAddr } from '@ui/constants/oplp'; export const LIQUIDITY_POOLS = { // Base pools @@ -20,19 +19,19 @@ export const LIQUIDITY_POOLS = { chainId: 34443, lpAddress: ModeLpAddressPool, ionAddress: '0x18470019bF0E94611f15852F7e93cf5D65BC34CA' - }, - // Optimism pools - OP_WETH_POOL: { - chainId: 10, - lpAddress: OPReservesContractAddr, - wethAddress: '0x4200000000000000000000000000000000000006' - }, - OP_DUAL_POOL: { - chainId: 10, - lpAddress: '0x39B50c59782F8aa57628b115Dc2Fd87b322E60b9', - wethAddress: '0x4200000000000000000000000000000000000006', - ionAddress: '0x887d1c6A4f3548279c2a8A9D0FA61B5D458d14fC' } + // Optimism pools + // OP_WETH_POOL: { + // chainId: 10, + // lpAddress: OPReservesContractAddr, + // wethAddress: '0x4200000000000000000000000000000000000006' + // }, + // OP_DUAL_POOL: { + // chainId: 10, + // lpAddress: '0x39B50c59782F8aa57628b115Dc2Fd87b322E60b9', + // wethAddress: '0x4200000000000000000000000000000000000006', + // ionAddress: '0x887d1c6A4f3548279c2a8A9D0FA61B5D458d14fC' + // } } as const; export const LP_TYPES = ['eth', 'mode', 'op', 'weth'] as const; diff --git a/packages/ui/utils/getStakingTokens.ts b/packages/ui/utils/getStakingTokens.ts index 4991cdffd3..3ed5ce4f0d 100644 --- a/packages/ui/utils/getStakingTokens.ts +++ b/packages/ui/utils/getStakingTokens.ts @@ -117,9 +117,18 @@ export function getReservesArgs( if (chain === optimism.id || chain === base.id) { return []; } - if (chain === mode.id && (token === 'weth' || token === 'eth')) { - return [getToken(+chain), getPoolToken('weth'), false]; + + // MODE specific logic - we need to include MODE token case + if (chain === mode.id) { + if (token === 'weth' || token === 'eth') { + return [getToken(chain), getPoolToken('weth'), false]; + } + if (token === 'mode') { + // For MODE/ION pair, pass ion token, mode token address, and false for the reverse flag + return [getToken(chain), getPoolToken('mode'), false]; + } } + return []; } diff --git a/packages/ui/utils/veion/tokenUtils.ts b/packages/ui/utils/veion/tokenUtils.ts index 5e776c7b08..1ead015383 100644 --- a/packages/ui/utils/veion/tokenUtils.ts +++ b/packages/ui/utils/veion/tokenUtils.ts @@ -17,8 +17,8 @@ export function getTokenType(chainId: ChainId): 'eth' | 'mode' | 'weth' { export const getLPRatio = (chainId: ChainId, lpType: LpTokenType) => { // AeroSwap pools are 50-50, Balancer pools are 80-20 const isBalancer = [ - LpTokenType.OP_ETH, - LpTokenType.BASE_ETH, + // LpTokenType.OP_ETH, + // LpTokenType.BASE_ETH, LpTokenType.MODE_ETH ].includes(lpType);