diff --git a/.env.base b/.env.base index 3e46abc63ef..a15243f1306 100644 --- a/.env.base +++ b/.env.base @@ -9,7 +9,6 @@ REACT_APP_FEATURE_ARBITRUM_NOVA=false REACT_APP_FEATURE_BASE=true REACT_APP_FEATURE_OPTIMISM=true REACT_APP_FEATURE_JAYPEGZ=true -REACT_APP_FEATURE_DEFI_DASHBOARD=true REACT_APP_FEATURE_MIXPANEL=true REACT_APP_FEATURE_SAVERS_VAULTS=true REACT_APP_FEATURE_SAVERS_VAULTS_DEPOSIT=true diff --git a/src/config.ts b/src/config.ts index 82d39f7d892..e369aaa9e03 100644 --- a/src/config.ts +++ b/src/config.ts @@ -64,7 +64,6 @@ const validators = { REACT_APP_MTPELERIN_REFERRAL_CODE: str(), REACT_APP_MTPELERIN_INTEGRATION_KEY: str(), REACT_APP_FRIENDLY_CAPTCHA_SITE_KEY: str(), - REACT_APP_FEATURE_DEFI_DASHBOARD: bool({ default: false }), REACT_APP_ZAPPER_API_KEY: str(), REACT_APP_COVALENT_API_KEY: str(), REACT_APP_FEATURE_LIFI_SWAP: bool({ default: false }), diff --git a/src/pages/Dashboard/Dashboard.tsx b/src/pages/Dashboard/Dashboard.tsx index 4a8042e1d9d..15fcc7c12ec 100644 --- a/src/pages/Dashboard/Dashboard.tsx +++ b/src/pages/Dashboard/Dashboard.tsx @@ -1,5 +1,5 @@ -import type { FlexProps, StackDirection, TabProps } from '@chakra-ui/react' -import { Flex, Stack, Tab, TabIndicator, TabList, Tabs, useMediaQuery } from '@chakra-ui/react' +import type { FlexProps, TabProps } from '@chakra-ui/react' +import { Flex, Tab, TabIndicator, TabList, Tabs, useMediaQuery } from '@chakra-ui/react' import { memo, useCallback, useMemo, useState } from 'react' import { useTranslate } from 'react-polyglot' import { Route, Switch, useHistory, useRouteMatch } from 'react-router' @@ -17,15 +17,11 @@ import { TransactionHistory } from 'pages/TransactionHistory/TransactionHistory' import { breakpoints } from 'theme/theme' import { DashboardHeader } from './components/DashboardHeader/DashboardHeader' -import { DashboardSidebar } from './DashboardSidebar' import { EarnDashboard } from './EarnDashboard' import { MobileActivity } from './MobileActivity' -import { Portfolio } from './Portfolio' import { RewardsDashboard } from './RewardsDashboard' import { WalletDashboard } from './WalletDashboard' -const direction: StackDirection = { base: 'column', xl: 'row' } -const maxWidth = { base: 'full', lg: 'full', xl: 'sm' } const mainPadding = { base: 0, md: 4 } const customTabActive = { color: 'text.base' } const customTabLast = { marginRight: 0 } @@ -69,7 +65,6 @@ export const Dashboard = memo(() => { const translate = useTranslate() const [slideIndex, setSlideIndex] = useState(0) const [isLargerThanMd] = useMediaQuery(`(min-width: ${breakpoints['md']})`, { ssr: false }) - const isDefiDashboardEnabled = useFeatureFlag('DefiDashboard') const { path } = useRouteMatch() const isNftsEnabled = useFeatureFlag('Jaypegz') const appIsMobile = isMobile || !isLargerThanMd @@ -166,50 +161,35 @@ export const Dashboard = memo(() => { ) } - if (isDefiDashboardEnabled) - return ( -
- - - - - - - - - - - - - - - - - - {isNftsEnabled && ( - - - - )} - - - Not found - - -
- ) - return ( -
+
- - - - - - - - + + + + + + + + + + + + + + + + + {isNftsEnabled && ( + + + + )} + + + Not found + +
) }) diff --git a/src/pages/Dashboard/Portfolio.tsx b/src/pages/Dashboard/Portfolio.tsx index 6f8637ef2ab..53c282d5fc8 100644 --- a/src/pages/Dashboard/Portfolio.tsx +++ b/src/pages/Dashboard/Portfolio.tsx @@ -4,7 +4,6 @@ import { Text } from 'components/Text' import { AccountTable } from './components/AccountList/AccountTable' import { DashboardChart } from './components/DashboardChart' -import { PortfolioBreakdown } from './PortfolioBreakdown' const cardBodyPx = { base: 4, md: 2 } const accountHeaderPaddingBottom = { base: 0, md: 4 } @@ -15,7 +14,6 @@ export const Portfolio = memo(() => { return ( - diff --git a/src/pages/Dashboard/PortfolioBreakdown.tsx b/src/pages/Dashboard/PortfolioBreakdown.tsx deleted file mode 100644 index 3aed80136a9..00000000000 --- a/src/pages/Dashboard/PortfolioBreakdown.tsx +++ /dev/null @@ -1,108 +0,0 @@ -import type { ResponsiveValue } from '@chakra-ui/react' -import { Card, CardBody, Flex, Skeleton, useColorModeValue } from '@chakra-ui/react' -import type { Property } from 'csstype' -import { memo, useCallback, useMemo } from 'react' -import { useHistory } from 'react-router' -import { Amount } from 'components/Amount/Amount' -import { CircularProgress } from 'components/CircularProgress/CircularProgress' -import { Text } from 'components/Text' -import { useFeatureFlag } from 'hooks/useFeatureFlag/useFeatureFlag' -import { bnOrZero } from 'lib/bignumber/bignumber' -import { - selectClaimableRewards, - selectEarnBalancesUserCurrencyAmountFull, - selectPortfolioTotalUserCurrencyBalanceExcludeEarnDupes, -} from 'state/slices/selectors' -import { useAppSelector } from 'state/store' - -type StatCardProps = { - percentage: number - value: string - label: string - color?: string - onClick: () => void - isLoading?: boolean -} - -const flexGap = { base: 0, xl: 6 } -const flexDirection: ResponsiveValue = { base: 'column', md: 'row' } - -const BreakdownCard: React.FC = ({ - percentage, - value, - label, - color, - onClick, - isLoading, -}) => { - const hoverBg = useColorModeValue('gray.100', 'gray.750') - const cardHover = useMemo(() => ({ bg: hoverBg }), [hoverBg]) - - return ( - - - - - - - - - - - - ) -} - -export const PortfolioBreakdown = memo(() => { - const history = useHistory() - const earnUserCurrencyBalance = useAppSelector(selectEarnBalancesUserCurrencyAmountFull).toFixed() - const claimableRewardsUserCurrencyBalanceFilter = useMemo(() => ({}), []) - const claimableRewardsUserCurrencyBalance = useAppSelector(state => - selectClaimableRewards(state, claimableRewardsUserCurrencyBalanceFilter), - ) - const portfolioTotalUserCurrencyBalance = useAppSelector( - selectPortfolioTotalUserCurrencyBalanceExcludeEarnDupes, - ) - const netWorth = useMemo( - () => - bnOrZero(earnUserCurrencyBalance) - .plus(portfolioTotalUserCurrencyBalance) - .plus(claimableRewardsUserCurrencyBalance) - .toFixed(), - [ - claimableRewardsUserCurrencyBalance, - earnUserCurrencyBalance, - portfolioTotalUserCurrencyBalance, - ], - ) - - const isDefiDashboardEnabled = useFeatureFlag('DefiDashboard') - - const handleWalletBalanceClick = useCallback(() => history.push('/accounts'), [history]) - const handleEarnBalanceClick = useCallback(() => history.push('/earn'), [history]) - - // *don't* show these if the DefiDashboard feature flag is enabled - if (isDefiDashboardEnabled) return null - - return ( - - - - - ) -}) diff --git a/src/state/slices/preferencesSlice/preferencesSlice.ts b/src/state/slices/preferencesSlice/preferencesSlice.ts index 64bed49d4f4..b276822c6b5 100644 --- a/src/state/slices/preferencesSlice/preferencesSlice.ts +++ b/src/state/slices/preferencesSlice/preferencesSlice.ts @@ -27,7 +27,6 @@ export type FeatureFlags = { SaversVaults: boolean SaversVaultsDeposit: boolean SaversVaultsWithdraw: boolean - DefiDashboard: boolean Cowswap: boolean ZrxSwap: boolean Mixpanel: boolean @@ -116,7 +115,6 @@ const initialState: Preferences = { SaversVaults: getConfig().REACT_APP_FEATURE_SAVERS_VAULTS, SaversVaultsDeposit: getConfig().REACT_APP_FEATURE_SAVERS_VAULTS_DEPOSIT, SaversVaultsWithdraw: getConfig().REACT_APP_FEATURE_SAVERS_VAULTS_WITHDRAW, - DefiDashboard: getConfig().REACT_APP_FEATURE_DEFI_DASHBOARD, Cowswap: getConfig().REACT_APP_FEATURE_COWSWAP, ZrxSwap: getConfig().REACT_APP_FEATURE_ZRX_SWAP, LifiSwap: getConfig().REACT_APP_FEATURE_LIFI_SWAP, diff --git a/src/test/mocks/store.ts b/src/test/mocks/store.ts index 42497a8c5d4..cb9f8af6d1a 100644 --- a/src/test/mocks/store.ts +++ b/src/test/mocks/store.ts @@ -83,7 +83,6 @@ export const mockStore: ReduxState = { SaversVaults: false, SaversVaultsDeposit: false, SaversVaultsWithdraw: false, - DefiDashboard: false, Mixpanel: false, LifiSwap: false, DynamicLpAssets: false,