diff --git a/src/components/StakingVaults/EarnOpportunities.tsx b/src/components/StakingVaults/EarnOpportunities.tsx index e9b64accbac..97b02b184cb 100644 --- a/src/components/StakingVaults/EarnOpportunities.tsx +++ b/src/components/StakingVaults/EarnOpportunities.tsx @@ -3,7 +3,7 @@ import { Box, Button, HStack } from '@chakra-ui/react' import type { AccountId, AssetId } from '@shapeshiftoss/caip' import { foxAssetId, foxyAssetId, fromAssetId } from '@shapeshiftoss/caip' import qs from 'qs' -import { useEffect } from 'react' +import { useEffect, useMemo } from 'react' import { NavLink, useHistory, useLocation } from 'react-router-dom' import { Card } from 'components/Card/Card' import { Text } from 'components/Text' @@ -51,12 +51,16 @@ export const EarnOpportunities = ({ assetId, accountId }: EarnOpportunitiesProps } }, [setFarmingAccountId, accountId]) - const allRows = [...lpOpportunities, ...stakingOpportunities].filter( - row => - row.assetId.toLowerCase() === asset.assetId.toLowerCase() || - (row.underlyingAssetIds.length && row.underlyingAssetIds.includes(asset.assetId)) || - // show foxy opportunity in the foxy asset page - (row.assetId === foxAssetId && asset.assetId === foxyAssetId), + const allRows = useMemo( + () => + lpOpportunities.concat(stakingOpportunities).filter( + row => + row.assetId.toLowerCase() === asset.assetId.toLowerCase() || + (row.underlyingAssetIds.length && row.underlyingAssetIds.includes(asset.assetId)) || + // show foxy opportunity in the foxy asset page + (row.assetId === foxAssetId && asset.assetId === foxyAssetId), + ), + [asset.assetId, lpOpportunities, stakingOpportunities], ) const handleClick = (opportunity: EarnOpportunityType) => { diff --git a/src/state/slices/portfolioSlice/selectors.ts b/src/state/slices/portfolioSlice/selectors.ts index 4796eae06c6..9e4d0ec96ec 100644 --- a/src/state/slices/portfolioSlice/selectors.ts +++ b/src/state/slices/portfolioSlice/selectors.ts @@ -891,8 +891,9 @@ export const selectAssetEquityItemsByFilter = createDeepEqualOutputSelector( return { id: lpOpportunity.id, type: AssetEquityType.LP, - fiatAmount: underlyingBalances[assetId].fiatAmount, - amountCryptoPrecision: underlyingBalances[assetId].cryptoBalancePrecision, + // This should never happen but it may whilst data is loading + fiatAmount: underlyingBalances[assetId]?.fiatAmount ?? '0', + amountCryptoPrecision: underlyingBalances[assetId]?.cryptoBalancePrecision ?? '0', provider: lpOpportunity.provider, color: DefiProviderMetadata[lpOpportunity.provider].color, }