From ac09b2dcc3e63844e97b5e00503e6aa536aab489 Mon Sep 17 00:00:00 2001
From: Majorfi <major-tom.eth@pm.me>
Date: Mon, 16 Oct 2023 11:51:14 +0200
Subject: [PATCH] fix: forknet balances

---
 apps/common/components/BalanceReminderPopover.tsx | 9 +++++++--
 apps/common/contexts/useWallet.tsx                | 3 +++
 2 files changed, 10 insertions(+), 2 deletions(-)

diff --git a/apps/common/components/BalanceReminderPopover.tsx b/apps/common/components/BalanceReminderPopover.tsx
index d063acc4e..6c6884fe6 100755
--- a/apps/common/components/BalanceReminderPopover.tsx
+++ b/apps/common/components/BalanceReminderPopover.tsx
@@ -7,6 +7,7 @@ import {IconAddToMetamask} from '@yearn-finance/web-lib/icons/IconAddToMetamask'
 import {IconCross} from '@yearn-finance/web-lib/icons/IconCross';
 import {IconWallet} from '@yearn-finance/web-lib/icons/IconWallet';
 import {toAddress, truncateHex} from '@yearn-finance/web-lib/utils/address';
+import {cl} from '@yearn-finance/web-lib/utils/cl';
 import {formatAmount} from '@yearn-finance/web-lib/utils/format.number';
 import {ImageWithFallback} from '@common/components/ImageWithFallback';
 import {useWallet} from '@common/contexts/useWallet';
@@ -89,7 +90,7 @@ function TokenItem({element}: {element: TBalanceReminderElement}): ReactElement
 }
 
 export function BalanceReminderPopover(): ReactElement {
-	const {balances: tokens, isLoading, triggerForknetBalances} = useWallet();
+	const {balances: tokens, isLoading, triggerForknetBalances, shouldUseForknetBalances} = useWallet();
 	const {address, ens, isActive, onDesactivate} = useWeb3();
 	const {vaults} = useYearn();
 
@@ -155,7 +156,11 @@ export function BalanceReminderPopover(): ReactElement {
 						<Popover.Panel className={'yearn--shadow absolute right-0 top-6 z-[1000] mt-3 w-screen max-w-xs md:-right-4 md:top-4'}>
 							<div className={'overflow-hidden'}>
 								<div className={'relative bg-neutral-0 p-0'}>
-									<div className={'absolute left-4 top-4 opacity-0 transition-colors hover:opacity-100'}>
+									<div
+										className={cl(
+											'absolute left-4 top-4 opacity-0 transition-colors hover:opacity-100',
+											shouldUseForknetBalances ? 'opacity-100' : 'opacity-0'
+										)}>
 										<button
 											onClick={(): void => {
 												// Special command to enable dev forknet balances
diff --git a/apps/common/contexts/useWallet.tsx b/apps/common/contexts/useWallet.tsx
index 4525531b1..8cced007c 100755
--- a/apps/common/contexts/useWallet.tsx
+++ b/apps/common/contexts/useWallet.tsx
@@ -72,6 +72,7 @@ export type TWalletContext = {
 	cumulatedValueInVaults: number;
 	balancesNonce: number;
 	isLoading: boolean;
+	shouldUseForknetBalances: boolean;
 	refresh: (tokenList?: TUseBalancesTokens[]) => Promise<TChainTokens>;
 	triggerForknetBalances: () => void;
 };
@@ -97,6 +98,7 @@ const defaultProps = {
 	cumulatedValueInVaults: 0,
 	balancesNonce: 0,
 	isLoading: true,
+	shouldUseForknetBalances: false,
 	refresh: async (): Promise<TChainTokens> => ({}),
 	triggerForknetBalances: (): void => {}
 };
@@ -335,6 +337,7 @@ export const WalletContextApp = memo(function WalletContextApp({children}: {chil
 			balancesNonce: nonce,
 			cumulatedValueInVaults,
 			isLoading: isLoading || false,
+			shouldUseForknetBalances,
 			refresh: onRefresh,
 			triggerForknetBalances: (): void => set_shouldUseForknetBalances((s): boolean => !s)
 		}),