diff --git a/package.json b/package.json index 1ea9f93a..4a04798c 100644 --- a/package.json +++ b/package.json @@ -11,8 +11,8 @@ "@chakra-ui/toast": "2.1.0", "@clover-network/clover-connector": "^1.0.0", "@datastructures-js/priority-queue": "6.1.1", - "@emotion/react": "^11", - "@emotion/styled": "^11", + "@emotion/react": "11.11.1", + "@emotion/styled": "11.11.0", "@gelatonetwork/limit-orders-lib": "4.3.0-alpha.6", "@jcoreio/async-throttle": "^1.4.3", "@lifi/sdk": "1.1.3", diff --git a/src/app/assets/icons/index.tsx b/src/app/assets/icons/index.tsx index 8607a418..6135df78 100644 --- a/src/app/assets/icons/index.tsx +++ b/src/app/assets/icons/index.tsx @@ -88,6 +88,10 @@ import { ReactComponent as PeckShieldAudit } from 'app/assets/images/peckShieldA import { ReactComponent as ParaSwap } from 'app/assets/images/paraSwap.svg'; import { ReactComponent as Algebra } from 'app/assets/images/algebra.svg'; +import { ReactComponent as V3Icon } from 'app/assets/images/V3Icon.svg'; +import { ReactComponent as V2Icon } from 'app/assets/images/V2Icon.svg'; +import { ReactComponent as X2Icon } from 'app/assets/images/X2Icon.svg'; + const { ci, grayDarker, danger, warning } = colors; const iconSize = { xs: '12px', @@ -98,6 +102,17 @@ const iconSize = { const { md } = iconSize; +export const V3IconBadge = ({ w = md, h = md, ...rest }) => { + return ; +}; +export const X2IconBadge = ({ w = md, h = md, ...rest }) => { + return ; +}; + +export const V2IconBadge = ({ w = md, h = md, ...rest }) => { + return ; +}; + export const ZokyoAuditLogo = ({ w = md, h = md, color = ci, ...rest }) => { return ; }; diff --git a/src/app/assets/images/V2Icon.svg b/src/app/assets/images/V2Icon.svg new file mode 100644 index 00000000..6b4378e7 --- /dev/null +++ b/src/app/assets/images/V2Icon.svg @@ -0,0 +1,37 @@ + + + + + + + + + + V2 + diff --git a/src/app/assets/images/V3Icon.svg b/src/app/assets/images/V3Icon.svg new file mode 100644 index 00000000..5e0673a1 --- /dev/null +++ b/src/app/assets/images/V3Icon.svg @@ -0,0 +1,17 @@ + + + diff --git a/src/app/assets/images/X2Icon.svg b/src/app/assets/images/X2Icon.svg new file mode 100644 index 00000000..07fdcccb --- /dev/null +++ b/src/app/assets/images/X2Icon.svg @@ -0,0 +1,24 @@ + + + + + + 2X + diff --git a/src/app/components/NewTokenAmountPanel/NewTokenAmountPanel.tsx b/src/app/components/NewTokenAmountPanel/NewTokenAmountPanel.tsx index bc460eef..3b4c47f1 100644 --- a/src/app/components/NewTokenAmountPanel/NewTokenAmountPanel.tsx +++ b/src/app/components/NewTokenAmountPanel/NewTokenAmountPanel.tsx @@ -110,15 +110,16 @@ const NewTokenAmountPanel = ({ token?.symbol !== 'FTM' ? [token?.address ?? ''] : [WFTM.address], token?.chainId ?? 1, ); - tokensPrices.forEach(price => { - if ( - price.address.toLowerCase() === token?.address.toLowerCase() || - (token?.symbol === 'FTM' && - price.address.toLowerCase() === WFTM.address.toLowerCase()) - ) { - setTokenPrice(price.rate); - } - }); + tokensPrices && + tokensPrices.forEach(price => { + if ( + price.address.toLowerCase() === token?.address.toLowerCase() || + (token?.symbol === 'FTM' && + price.address.toLowerCase() === WFTM.address.toLowerCase()) + ) { + setTokenPrice(price.rate); + } + }); }; fetchTokenPrice(); diff --git a/src/app/components/RangeSelector/RangeSelector.tsx b/src/app/components/RangeSelector/RangeSelector.tsx index df04aeff..1a6d0c1e 100644 --- a/src/app/components/RangeSelector/RangeSelector.tsx +++ b/src/app/components/RangeSelector/RangeSelector.tsx @@ -1,10 +1,7 @@ import { Bound } from 'store/v3/mint/actions'; - import { RangeSelectorPart } from '../RangeSelectorPart'; - import type { Props } from './RangeSelector.d'; import { useMemo } from 'react'; -import { useTranslation } from 'react-i18next'; import { Grid, GridItem, Skeleton } from '@chakra-ui/react'; import { Heading } from '../Typography'; import { StyledCurrentPrice, StyledCurrentPriceWrapper } from './styled'; @@ -26,8 +23,6 @@ export default function RangeSelector({ isAfterPrice, mintInfo, }: Props) { - const { t } = useTranslation(); - const tokenA = (currencyA ?? undefined)?.wrapped; const tokenB = (currencyB ?? undefined)?.wrapped; diff --git a/src/app/components/Select/Select.tsx b/src/app/components/Select/Select.tsx index 4fcf44ad..c016101b 100644 --- a/src/app/components/Select/Select.tsx +++ b/src/app/components/Select/Select.tsx @@ -1,8 +1,8 @@ -import React, { FC, useCallback } from 'react'; +import React, { useCallback } from 'react'; import { Props } from './Select.d'; import { StyledContainer, StyledHeading, StyledItem } from './styles'; -const Select: FC = ({ +const Select = ({ labels = [], selected = 0, disabled = false, diff --git a/src/app/components/TWAP/TWAPOrders.tsx b/src/app/components/TWAP/TWAPOrders.tsx index 92576302..e548f757 100644 --- a/src/app/components/TWAP/TWAPOrders.tsx +++ b/src/app/components/TWAP/TWAPOrders.tsx @@ -1,7 +1,6 @@ import { Orders } from '@orbs-network/twap-ui-spiritswap'; import useWallets from 'app/hooks/useWallets'; import { useTokens } from 'app/hooks/useTokens'; -import { getProvider } from 'app/connectors/EthersConnector/login'; import { LimitOrderContainer } from 'app/pages/Swap/components/LimitOrders/styles'; import { getTokenImageUrl } from '../ImageLogo'; @@ -14,9 +13,7 @@ function TWAPOrders({ showChart }: { showChart: boolean }) { { - return await getProvider(); - }} + getProvider={() => window.ethereum} getTokenImageUrl={getTokenImageUrl} /> diff --git a/src/app/components/TWAP/TWAPPanel.tsx b/src/app/components/TWAP/TWAPPanel.tsx index 5019662e..2a87943b 100644 --- a/src/app/components/TWAP/TWAPPanel.tsx +++ b/src/app/components/TWAP/TWAPPanel.tsx @@ -1,5 +1,4 @@ import { ModalToken } from 'app/components/ModalToken'; -import { getProvider } from 'app/connectors/EthersConnector/login'; import { useTokens } from 'app/hooks/useTokens'; import useWallets from 'app/hooks/useWallets'; import { TWAP } from '@orbs-network/twap-ui-spiritswap'; @@ -29,7 +28,7 @@ function TWAPPanel({ gasPrice, panelProps }: TWAPPanelProps) { TokenSelectModal={ModalToken} dappTokens={tokens} account={account} - getProvider={getProvider} + getProvider={() => window.ethereum} getTokenImageUrl={getTokenImageUrl} onSrcTokenSelected={(token: Token) => handleChangeToken(token, () => {}, 0) diff --git a/src/app/components/TransactionFlow/utils/helper.ts b/src/app/components/TransactionFlow/utils/helper.ts index b447a7a3..ccfc359f 100644 --- a/src/app/components/TransactionFlow/utils/helper.ts +++ b/src/app/components/TransactionFlow/utils/helper.ts @@ -69,7 +69,7 @@ export const buildAddLiquidity = ( | AddLiquidityTradeV3 | null, isV2?: boolean, - type?: number, // classic: 0, stable: 1, concentrated: 2, weighted: 3 + type?: number, // varible: 0, stable: 1, concentrated: 2, weighted: 3 isStable?: boolean, ): StepProps | {} => { let action: Function = addLiquidity; @@ -91,12 +91,12 @@ export const buildAddLiquidity = ( } } - if (type === 3) { - action = addWeightedLiquidity; - if (liquidityTrade) { - params = Object.values(liquidityTrade); - } - } + // if (type === 3) { + // action = addWeightedLiquidity; + // if (liquidityTrade) { + // params = Object.values(liquidityTrade); + // } + // } return { number, diff --git a/src/app/connectors/EthersConnector/index.tsx b/src/app/connectors/EthersConnector/index.tsx index 95435867..768041be 100644 --- a/src/app/connectors/EthersConnector/index.tsx +++ b/src/app/connectors/EthersConnector/index.tsx @@ -19,6 +19,7 @@ import { WorkerCall } from 'types'; import useWallets from 'app/hooks/useWallets'; import getNotificationIcon from '../getNotificationIcon'; import { selectAddress, selectPendingTransactions } from 'store/user/selectors'; +import { ethers } from 'ethers'; const EthersConnector = ({ children }) => { const toast = useToast(); @@ -245,7 +246,11 @@ const EthersConnector = ({ children }) => { Object.keys(inQueue).forEach(hash => { if (!hash) return; - const receiptPromise = provider!.getTransactionReceipt(hash); + const newProvider = provider + ? new ethers.providers.Web3Provider(provider, 'any') + : undefined; + + const receiptPromise = newProvider!.getTransactionReceipt(hash); const match = pending.find( transaction => `${transaction.hash}` === `${hash}`, diff --git a/src/app/connectors/EthersConnector/login.ts b/src/app/connectors/EthersConnector/login.ts index 49494cac..d6c47c1f 100644 --- a/src/app/connectors/EthersConnector/login.ts +++ b/src/app/connectors/EthersConnector/login.ts @@ -69,7 +69,7 @@ const useLogin = () => { dispatch(resetUserStatistics()); } } catch (error) { - console.log(error); + console.error(error); } }, [dispatch, setLoggedIn], diff --git a/src/app/hooks/useGetTokensPrices.ts b/src/app/hooks/useGetTokensPrices.ts index bc8133f9..2574b679 100644 --- a/src/app/hooks/useGetTokensPrices.ts +++ b/src/app/hooks/useGetTokensPrices.ts @@ -27,6 +27,7 @@ const useGetTokensPrices = ({ try { setLoadingPrices(true); const data = await getTokensDetails(tokenAddresses, chainId); + if (!data) return setTokensPrices({}); let tokenObjectPrices = {}; data?.forEach(token => { if (token.address === BASE_TOKEN_ADDRESS) { diff --git a/src/app/hooks/usePieChartData.ts b/src/app/hooks/usePieChartData.ts index 22a4f424..ceead58f 100644 --- a/src/app/hooks/usePieChartData.ts +++ b/src/app/hooks/usePieChartData.ts @@ -87,7 +87,6 @@ const usePieChartData = ({ farmsList }: { farmsList: BoostedFarm[] }) => { datasets: [ { data, - borderColor: ['white'], borderWidth: 1, hoverBorderWidth: 2, diff --git a/src/app/index.tsx b/src/app/index.tsx index 8b141c64..ca55b73d 100644 --- a/src/app/index.tsx +++ b/src/app/index.tsx @@ -42,10 +42,8 @@ export function App() { - <> - - - + + ); diff --git a/src/app/interfaces/Farm.ts b/src/app/interfaces/Farm.ts index 859e6acd..b3349fb4 100644 --- a/src/app/interfaces/Farm.ts +++ b/src/app/interfaces/Farm.ts @@ -207,10 +207,9 @@ export interface GaugeFarm { export enum FarmType { ALL, - CLASSIC, + VARIABLE, STABLE, CONCENTRATED, - ADMIN, } export enum EcosystemFarmType { diff --git a/src/app/pages/Farms/Farm/Farm.tsx b/src/app/pages/Farms/Farm/Farm.tsx index be868c3f..b63b6fc5 100644 --- a/src/app/pages/Farms/Farm/Farm.tsx +++ b/src/app/pages/Farms/Farm/Farm.tsx @@ -6,7 +6,6 @@ import { YourApr } from '../components/YourApr'; import { IconButton } from 'app/components/IconButton'; import { StyledContainer } from './styles'; import { ReactComponent as SparklesIcon } from 'app/assets/images/sparkles.svg'; -import { BoostFactor } from '../components/BoostFactor'; import Web3Monitoring from 'app/connectors/EthersConnector/transactions'; import { transactionResponse } from 'utils/web3/actions/utils'; import { checkAddress, formatNumber, getRoundedSFs } from 'app/utils'; @@ -22,7 +21,6 @@ import { AccordionPanel, Spinner, Skeleton, - Flex, } from '@chakra-ui/react'; import { RetrieveTokens } from '../components/RetrieveTokens/RetrieveTokens'; import { @@ -41,7 +39,7 @@ import BigNumber from 'bignumber.js'; import { formatUnits } from 'ethers/lib/utils'; import { Props } from './Farm.d'; import useGetTokensPrices from 'app/hooks/useGetTokensPrices'; -import { LIQUIDITY, resolveRoutePath } from 'app/router/routes'; +import { LIQUIDITY } from 'app/router/routes'; import { RetrieveConcentratedPosition } from '../components/RetrieveConcentratedPosition/RetrieveConcentratedPosition'; export const Farm = ({ @@ -306,6 +304,7 @@ export const Farm = ({ return earnedRewards; } + // eslint-disable-next-line react-hooks/exhaustive-deps }, [concentratedEarned, concentratedBonusEarned]); const hasConcenctratedRewards = concentratedEarned || concentratedBonusEarned; diff --git a/src/app/pages/Farms/FarmController/index.tsx b/src/app/pages/Farms/FarmController/index.tsx index fddb7a1f..1a61e502 100644 --- a/src/app/pages/Farms/FarmController/index.tsx +++ b/src/app/pages/Farms/FarmController/index.tsx @@ -44,7 +44,7 @@ const MemorizeTokenList = memo(({ farm }: IFarm) => ( ecosystem={farm.ecosystem} apr={farm.apr} rewardToken={farm.rewardToken} - farmType={farm.type} + farmType={farm.label} lpAddress={farm.lpAddress} type={farm.type} hideTypeIcons={Boolean(farm.concentrated)} diff --git a/src/app/pages/Farms/Farms.tsx b/src/app/pages/Farms/Farms.tsx index e7732b47..ef09832f 100644 --- a/src/app/pages/Farms/Farms.tsx +++ b/src/app/pages/Farms/Farms.tsx @@ -1,6 +1,6 @@ import { FARMS } from 'constants/icons'; import { useState, useEffect, useMemo, useCallback } from 'react'; -import { Box, Button, HStack, useDisclosure } from '@chakra-ui/react'; +import { Box, HStack, useDisclosure } from '@chakra-ui/react'; import { CardHeader } from 'app/components/CardHeader'; import Web3Monitoring from 'app/connectors/EthersConnector/transactions'; import { IFarm, IFarmFilters } from 'app/interfaces/Farm'; @@ -37,7 +37,6 @@ import { ConnectWallet } from 'app/components/ConnectWallet'; import { FarmCreateModal } from './components/FarmCreateModal'; import { ethers } from 'ethers'; import useWallets from 'app/hooks/useWallets'; -import useLogin from 'app/connectors/EthersConnector/login'; import { FARMS as FARMS_ROUTE } from 'app/router/routes'; import { useEternalFarmingRewards } from 'app/hooks/v3/useEternalFarmingsRewards'; @@ -50,7 +49,6 @@ export const Farms = () => { const { addToQueue } = Web3Monitoring(); const { userLiquidity, userConcentratedLiquidity } = GetWalletBalance(); const { account } = useWallets(); - const { handleLogin } = useLogin(); const pageTitle = `${t('common.name')} - ${t(`${translationPath}.title`)}`; const navigate = useNavigate(); const [sortType, setSortType] = useState(0); @@ -86,10 +84,10 @@ export const Farms = () => { const [farmFilters, setFarmFilters] = useState(initialFarmFilters); - const onCreateFarm = () => { - if (!account) handleLogin(); - farmCreate.onOpen(); - }; + // const onCreateFarm = () => { + // if (!account) handleLogin(); + // farmCreate.onOpen(); + // }; // Function that runs when component receives a new farm address (creation ecofarm) useMemo(() => { @@ -220,7 +218,6 @@ export const Farms = () => { }; useEffect(() => { - // if (!address && farmMasterData && farmMasterData.length > 0) { if (!address && farmMasterData && farmMasterData.length > 0) { let result: any = farmMasterData; @@ -277,7 +274,6 @@ export const Farms = () => { /> - {' '}
{!address && ( diff --git a/src/app/pages/Farms/components/FarmControls/FarmControls.tsx b/src/app/pages/Farms/components/FarmControls/FarmControls.tsx index c4e4d60b..f172749a 100644 --- a/src/app/pages/Farms/components/FarmControls/FarmControls.tsx +++ b/src/app/pages/Farms/components/FarmControls/FarmControls.tsx @@ -22,7 +22,6 @@ export default function FarmControls({ setSortType, debouncedResults, }) { - const translationPath = 'farms.common'; const { t } = useTranslation(); const isMobile = useMobile(); @@ -30,12 +29,7 @@ export default function FarmControls({ diff --git a/src/app/pages/Inspirit/components/Voting/components/TokenTableV3/TokenTableV3.tsx b/src/app/pages/Inspirit/components/Voting/components/TokenTableV3/TokenTableV3.tsx index f4997c31..b23926f6 100644 --- a/src/app/pages/Inspirit/components/Voting/components/TokenTableV3/TokenTableV3.tsx +++ b/src/app/pages/Inspirit/components/Voting/components/TokenTableV3/TokenTableV3.tsx @@ -14,7 +14,6 @@ import { useEffect, useMemo, useState } from 'react'; import { useAppSelector } from 'store/hooks'; import { selectFarmsStaked, - selectLiquidityWallet, selectLockedInSpiritAmount, } from 'store/user/selectors'; import FarmsData from './FarmsData'; @@ -28,6 +27,7 @@ import { selectSaturatedGauges } from 'store/general/selectors'; import useMobile from 'utils/isMobile'; import { MobileTable } from '../MobileTable'; import useWallets from 'app/hooks/useWallets'; +import { selectFarmMasterData } from 'store/farms/selectors'; const TokenTableV3 = ({ errorMessage, @@ -49,9 +49,9 @@ const TokenTableV3 = ({ const { account, isLoggedIn } = useWallets(); const isMobile = useMobile(); const translationPath = 'inSpirit.voting'; - const stakedFarms = useAppSelector(selectFarmsStaked); const lockedSpiritBalance = useAppSelector(selectLockedInSpiritAmount); + const farms = useAppSelector(selectFarmMasterData); const [searchValues, setSearchValues] = useState(''); const [showMobileTableFilters, setShowMobileTableFilters] = useState(false); @@ -61,7 +61,7 @@ const TokenTableV3 = ({ setSearchValues(query); }; - const { boostedV2, boostedStable } = useAppSelector(selectSaturatedGauges); + const { boostedCombine } = useAppSelector(selectSaturatedGauges); const toggleMobileTableFilters = () => { setShowMobileTableFilters(!showMobileTableFilters); @@ -74,19 +74,44 @@ const TokenTableV3 = ({ useEffect(() => { const getBoostedFarms = async () => { - const userBoostedV2 = getUserFarms(boostedV2, stakedFarms); - const userBoostedStable = getUserFarms(boostedStable, stakedFarms); + const userBoostedCombine = getUserFarms(boostedCombine, stakedFarms); + const combineFarmsData = farms.filter(farm => farm.type === 'combine'); + + let stableFarms: any = []; + let variableFarms: any = []; + let userStableFarms: any = []; + let userVariableFarms: any = []; + + boostedCombine?.forEach(farm => { + const { fulldata } = farm; + const farmData = combineFarmsData.find( + combineFarm => combineFarm.gaugeAddress === fulldata.gaugeAddress, + ); + + if (farmData.stable) stableFarms.push(farm); + else variableFarms.push(farm); + }); + + userBoostedCombine?.forEach(farm => { + const { fulldata } = farm; + const farmData = combineFarmsData.find( + combineFarm => combineFarm.lpAddress === fulldata.farmAddress, + ); + + if (farmData.stable) userStableFarms.push(farm); + else userVariableFarms.push(farm); + }); onUpdateFarm({ - v2Classics: sortFn(boostedV2, 'yourVote', 'des'), - userv2Classics: sortFn(userBoostedV2, 'yourVote', 'des'), - stables: sortFn(boostedStable, 'yourVote', 'des'), - userStables: sortFn(userBoostedStable, 'yourVote', 'des'), + variableCombine: sortFn(variableFarms, 'yourVote', 'des'), + userVariableCombine: sortFn(userVariableFarms, 'yourVote', 'des'), + stableCombine: sortFn(stableFarms, 'yourVote', 'des'), + userStableCombine: sortFn(userStableFarms, 'yourVote', 'des'), }); }; getBoostedFarms(); // eslint-disable-next-line react-hooks/exhaustive-deps - }, [searchValues, userOnly, farmType, account, boostedV2, boostedStable]); + }, [searchValues, userOnly, farmType, account]); const filteredBribes = useMemo(() => { if (searchValues) { diff --git a/src/app/pages/Inspirit/components/Voting/components/VotingPanel/VotingPanel.tsx b/src/app/pages/Inspirit/components/Voting/components/VotingPanel/VotingPanel.tsx index d4daeee1..ebbe8594 100644 --- a/src/app/pages/Inspirit/components/Voting/components/VotingPanel/VotingPanel.tsx +++ b/src/app/pages/Inspirit/components/Voting/components/VotingPanel/VotingPanel.tsx @@ -24,21 +24,18 @@ const VotingPanel = ({ cleanError, newBribeDisclosure, }) => { + const allFarms = useAppSelector(selectFarmMasterData); const [userOnly, setUserOnly] = useState(false); - const [classicFarms, setclassicFarms] = useState({ - farms: [], - userFarms: [], - }); - const [stableFarms, setStableFarms] = useState({ - farms: [], - userFarms: [], - }); - - const [v2Farms, setV2Farms] = useState({ + const [variableCombineFarms, setVariableCombineFarms] = useState( + { + farms: [], + userFarms: [], + }, + ); + const [stableCombineFarms, setStableCombineFarms] = useState({ farms: [], userFarms: [], }); - const [selectedFarms, setSelectedFarms] = useState([]); const [sortBy, setSortBy] = useState(); const [sortDirection, setSortDirection] = useState(); @@ -50,16 +47,19 @@ const VotingPanel = ({ }; const updatingFarm = ({ - classics, - userClassics, - stables, - userStables, - v2Classics, - userv2Classics, + variableCombine, + userVariableCombine, + stableCombine, + userStableCombine, }) => { - setclassicFarms({ farms: classics, userFarms: userClassics }); - setV2Farms({ farms: v2Classics, userFarms: userv2Classics }); - setStableFarms({ farms: stables, userFarms: userStables }); + setVariableCombineFarms({ + farms: variableCombine, + userFarms: userVariableCombine, + }); + setStableCombineFarms({ + farms: stableCombine, + userFarms: userStableCombine, + }); }; const handleSort = (by, direction) => { @@ -69,11 +69,12 @@ const VotingPanel = ({ }; useEffect(() => { - if (farmType.index === 0) { - const filterInactivesFarms = stableFarms.farms.filter( + // Combine farms + if (farmType.value === 'Variable') { + const filterInactivesFarms = variableCombineFarms.farms.filter( farm => !inactiveInspirit.includes(farm.name.toUpperCase()), ); - const filterInactivesUserFarms = stableFarms.userFarms.filter( + const filterInactivesUserFarms = variableCombineFarms.userFarms.filter( farm => !inactiveInspirit.includes(farm.name.toUpperCase()), ); setSelectedFarms( @@ -84,11 +85,12 @@ const VotingPanel = ({ ), ); } - if (farmType.index === 1) { - const filterInactivesFarms = v2Farms.farms.filter( + if (farmType.value === 'Stable') { + // Combine farms + const filterInactivesFarms = stableCombineFarms.farms.filter( farm => !inactiveInspirit.includes(farm.name.toUpperCase()), ); - const filterInactivesUserFarms = v2Farms.userFarms.filter( + const filterInactivesUserFarms = stableCombineFarms.userFarms.filter( farm => !inactiveInspirit.includes(farm.name.toUpperCase()), ); setSelectedFarms( @@ -99,18 +101,25 @@ const VotingPanel = ({ ), ); } - }, [farmType, userOnly, classicFarms, stableFarms, v2Farms]); + }, [ + farmType, + userOnly, + sortBy, + sortDirection, + variableCombineFarms.farms, + variableCombineFarms.userFarms, + stableCombineFarms.farms, + stableCombineFarms.userFarms, + variableCombineFarms, + ]); const farmsSize = selectedFarms?.length; - const allFarms = useAppSelector(selectFarmMasterData); - const farmsWithApr = allFarms.filter(farm => farm.apr !== '0'); const finalSelectedFarms: BoostedFarm[] = selectedFarms.map(listFarm => { const find = farmsWithApr.find( - farmInAllFarmList => - farmInAllFarmList.lpAddress === listFarm.fulldata.farmAddress, + farm => farm.lpAddress === listFarm.fulldata.farmAddress, ); if (find) { const poolLiquidity = find.totalLiquidity || 0; @@ -118,6 +127,10 @@ const VotingPanel = ({ const liquidityPer10kInspirit: number = (poolLiquidity / listFarm.weight) * 10000; + if (liquidityPer10kInspirit === Infinity) { + return { ...listFarm, liquidityPer10kInspirit: 0 }; + } + return { ...listFarm, liquidityPer10kInspirit }; } return { ...listFarm }; diff --git a/src/app/pages/Liquidity/Liquidity.tsx b/src/app/pages/Liquidity/Liquidity.tsx index 1dbd5ab2..68e5ce4f 100644 --- a/src/app/pages/Liquidity/Liquidity.tsx +++ b/src/app/pages/Liquidity/Liquidity.tsx @@ -28,7 +28,6 @@ import { YourLiquidityWrapper, CollapseSection, StyledLiquiditySetting, - StyledConcentratedLiqudityLabel, } from './styles'; import { Select } from 'app/components/Select'; import { Slippage } from './components/Slippage'; @@ -60,11 +59,7 @@ import { } from 'app/utils'; import UseIsLoading from 'app/hooks/UseIsLoading'; import { formatUnits, parseUnits } from 'ethers/lib/utils'; -import { - checkAllowance, - queryJoinPool, - addSobLiquidity, -} from 'utils/web3/actions'; +import { checkAllowance, addSobLiquidity } from 'utils/web3/actions'; import { buildCheckAndApprove, buildAddLiquidity, @@ -80,7 +75,6 @@ import pools from 'constants/farms'; import { ClassicPanel, StablePanel, - WeightedPanel, ConcentratedPanel, } from 'app/pages/Liquidity/components/Panels'; import { ActionButton } from './components/ActionButton'; @@ -111,16 +105,12 @@ import { Heading } from 'app/components/Typography'; import { ConfirmModalConcentrated } from './components/ConfirmModalConcentrated'; import { Switch } from 'app/components/Switch'; -// TODO: [DEV2-591] refactor liquidity component - -const TOKEN_TYPE_CLASSIC_INDEX = 0; -const TOKEN_TYPE_CLASSIC_LABEL = 'Variable'; +const TOKEN_TYPE_VARIABLE_INDEX = 0; +const TOKEN_TYPE_VARIABLE_LABEL = 'Variable'; const TOKEN_TYPE_STABLE_INDEX = 1; const TOKEN_TYPE_STABLE_LABEL = 'Stable'; const TOKEN_TYPE_CONCENTRATED_INDEX = 2; -const TOKEN_TYPE_CONCENTRATED_LABEL = 'Concentrated Liquidity'; -const TOKEN_TYPE_WEIGHTED_INDEX = 3; -const TOKEN_TYPE_WEIGHTED_LABEL = 'Weighted'; +const TOKEN_TYPE_CONCENTRATED_LABEL = 'Concentrated'; export function LiquidityPage() { const { t } = useTranslation(); @@ -154,7 +144,7 @@ export function LiquidityPage() { if (type === 'concentrated') { return TOKEN_TYPE_CONCENTRATED_INDEX; } - return TOKEN_TYPE_CLASSIC_INDEX; + return TOKEN_TYPE_VARIABLE_INDEX; }; const matchesToken = tokenParam => { @@ -341,26 +331,9 @@ export function LiquidityPage() { } = useDisclosure(); const [tokenTypeFilter, setTokenTypeFilter] = useState(liquidityTypeFromFarm); const isStableSelected = tokenTypeFilter === TOKEN_TYPE_STABLE_INDEX; - const isWeightedSelected = tokenTypeFilter === TOKEN_TYPE_WEIGHTED_INDEX; const isConcentratedSelected = tokenTypeFilter === TOKEN_TYPE_CONCENTRATED_INDEX; - const [inputErrors, setInputErrors] = useState({ - [TOKEN_TYPE_CLASSIC_INDEX]: undefined, - [TOKEN_TYPE_STABLE_INDEX]: undefined, - [TOKEN_TYPE_WEIGHTED_INDEX]: undefined, - }); - - const updateInputError = (indexType, message) => { - setInputErrors({ - ...inputErrors, - [indexType]: message, - }); - }; - - const setWeightedInputError = message => - updateInputError(TOKEN_TYPE_WEIGHTED_INDEX, message); - // Handle behaviour when user logouts useEffect(() => { resetPanel(); @@ -991,19 +964,11 @@ export function LiquidityPage() { amount: '2', }, ]; - } else if (!isWeightedSelected && liquidityTrade) { + } else if (liquidityTrade) { return [ { token: liquidityTrade.tokenA, amount: liquidityTrade.amountA }, { token: liquidityTrade.tokenB, amount: liquidityTrade.amountB }, ]; - } else if (isWeightedSelected) { - const tps = weightedPoolSelected?.tokens as Token[]; - if (tps) { - return tps.map(token => ({ - token, - amount: weightedPoolInputValue[token.symbol] ?? '0', - })); - } } else { const tps = tokenPoolSelected?.tokens as Token[]; if (tps) { @@ -1020,7 +985,6 @@ export function LiquidityPage() { // eslint-disable-next-line react-hooks/exhaustive-deps }, [ isStableSelected, - isWeightedSelected, isConcentratedSelected, liquidityTrade, firstToken, @@ -1040,9 +1004,7 @@ export function LiquidityPage() { tokenPoolSelected, ]); - const liquidityToReceive = isWeightedSelected - ? nonClassicTrade?.liquidity || 0 - : liquidityTrade?.liquidity || 0; + const liquidityToReceive = liquidityTrade?.liquidity || 0; const verifyAllowance = useCallback( async (tokenWithAmount: TokenAmount) => { @@ -1057,10 +1019,6 @@ export function LiquidityPage() { let approve_address = ROUTERV2_ADDRESS; - if (isWeightedSelected) { - approve_address = WEIGHTED_VAULT_ADDRESS; - } - if (isConcentratedSelected) { approve_address = NONFUNGIBLE_POSITION_ADDRESS; } @@ -1083,7 +1041,6 @@ export function LiquidityPage() { WEIGHTED_VAULT_ADDRESS, NONFUNGIBLE_POSITION_ADDRESS, account, - isWeightedSelected, isConcentratedSelected, isStableSelected, ], @@ -1111,10 +1068,6 @@ export function LiquidityPage() { const initialSteps = useCallback(() => { let approveAddress = ROUTERV2_ADDRESS; - if (isWeightedSelected) { - approveAddress = WEIGHTED_VAULT_ADDRESS; - } - if (isConcentratedSelected) { approveAddress = NONFUNGIBLE_POSITION_ADDRESS; } @@ -1169,29 +1122,6 @@ export function LiquidityPage() { ]; } - if (tokenTypeFilter === TOKEN_TYPE_WEIGHTED_INDEX) { - const tradeParams = { - pool: (tokenTypeFilter === TOKEN_TYPE_WEIGHTED_INDEX - ? weightedPoolSelected - : tokenPoolSelected) as SobTokenPool, - tokensWithValue: selectedTokensWithValue(), - account, - }; - - return [ - ...approveSteps, - buildAddLiquidity( - stepNumber, - account, - tradeParams as AddLiquidityTradeV2, - true, - tokenTypeFilter, - false, - ), - ...zapStep, - ]; - } - if (tokenTypeFilter === TOKEN_TYPE_CONCENTRATED_INDEX) { return [ ...approveSteps, @@ -1241,15 +1171,6 @@ export function LiquidityPage() { useEffect(() => { const [action] = steps.filter(step => step?.type === 'liquidity'); const [pool, tokensWithAmounts, account] = action?.params || []; - const queryJoin = async () => { - loadingOn(); - - if (action.params) { - const query = await queryJoinPool(pool, tokensWithAmounts, account); - setNonClassicTrade(query); - loadingOff(); - } - }; const queryBatchSwap = async () => { loadingOff(); @@ -1276,13 +1197,6 @@ export function LiquidityPage() { }); if (checkQuery && hasAllBalances && steps && steps.length) { - if ( - tokenTypeFilter === TOKEN_TYPE_WEIGHTED_INDEX && - pool?.type === 'weighted' - ) { - queryJoin(); - } - if ( tokenTypeFilter === TOKEN_TYPE_STABLE_INDEX && pool?.type === 'stable' @@ -1299,16 +1213,12 @@ export function LiquidityPage() { const poolsLabel = 'Pools'; const defaultTitle = 'Add liquidity'; switch (tokenTypeFilter) { - case TOKEN_TYPE_CLASSIC_INDEX: + case TOKEN_TYPE_VARIABLE_INDEX: return defaultTitle; case TOKEN_TYPE_STABLE_INDEX: return tokenPoolSelected ? `${TOKEN_TYPE_STABLE_LABEL} ${poolsLabel}` : defaultTitle; - case TOKEN_TYPE_WEIGHTED_INDEX: - return weightedPoolSelected - ? `${TOKEN_TYPE_WEIGHTED_LABEL} ${poolsLabel}` - : defaultTitle; default: return defaultTitle; } @@ -1335,12 +1245,7 @@ export function LiquidityPage() { tokensWithValue={selectedTokensWithValue()?.reverse()} price={liquidityToReceive || '0'} sharePool={liquidityTrade ? liquidityTrade.ownership : '-'} - isWeightedPool={tokenTypeFilter === TOKEN_TYPE_WEIGHTED_INDEX} - poolName={ - tokenTypeFilter === TOKEN_TYPE_WEIGHTED_INDEX - ? weightedPoolSelected?.name - : liquidityTrade?.lpSymbol - } + poolName={liquidityTrade?.lpSymbol} isLoading={isLoading} zapDirectly={zapDirectly} setZapDirectly={setZapDirectly} @@ -1419,10 +1324,7 @@ export function LiquidityPage() { onClose={onClose} isOpen={isOpen} disabled={ - !liquidityTrade && - !isStableSelected && - !isWeightedSelected && - !isConcentratedSelected + !liquidityTrade && !isStableSelected && !isConcentratedSelected } nextStep={() => void 0} notifications={notifications} @@ -1475,20 +1377,16 @@ export function LiquidityPage() {