diff --git a/src/components/BottomMenuModal/AccountModal.tsx b/src/components/BottomMenuModal/AccountModal.tsx
index 9e5bb10e..d55147a1 100644
--- a/src/components/BottomMenuModal/AccountModal.tsx
+++ b/src/components/BottomMenuModal/AccountModal.tsx
@@ -9,6 +9,7 @@ import {
useWalletAddress,
} from '@etherspot/transaction-kit';
import { useLogout } from '@privy-io/react-auth';
+import Tippy from '@tippyjs/react';
import Avatar from 'boring-avatars';
import { BigNumber, ethers } from 'ethers';
import {
@@ -20,13 +21,12 @@ import {
Hierarchy as IconHierarchy,
Logout as LogoutIcon,
} from 'iconsax-react';
-import React, { useCallback, useContext, useEffect, useMemo } from 'react';
+import React, { useCallback, useMemo } from 'react';
import CopyToClipboard from 'react-copy-to-clipboard';
import { useTranslation } from 'react-i18next';
import { useNavigate } from 'react-router-dom';
import styled, { useTheme } from 'styled-components';
import { Chain } from 'viem';
-import Tippy from '@tippyjs/react';
// components
import FormTabSelect from '../Form/FormTabSelect';
@@ -50,17 +50,11 @@ import useAssets from '../../hooks/useAssets';
// services
import { clearDappStorage } from '../../services/dappLocalStorage';
-// context
-import { AccountBalancesContext } from '../../providers/AccountBalancesProvider';
-import { AccountNftsContext } from '../../providers/AccountNftsProvider';
-
interface AccountModalProps {
isContentVisible?: boolean; // for animation purpose to not render rest of content and return main wrapper only
}
const AccountModal = ({ isContentVisible }: AccountModalProps) => {
- const contextNfts = useContext(AccountNftsContext);
- const contextBalances = useContext(AccountBalancesContext);
const accountAddress = useWalletAddress();
const navigate = useNavigate();
const { logout } = useLogout();
@@ -124,17 +118,6 @@ const AccountModal = ({ isContentVisible }: AccountModalProps) => {
}, []);
}, [accountAddress, nfts]);
- useEffect(() => {
- if (!isContentVisible) {
- contextNfts?.data.setUpdateData(false);
- contextBalances?.data.setUpdateData(false);
- }
- if (isContentVisible) {
- contextNfts?.data.setUpdateData(true);
- contextBalances?.data.setUpdateData(true);
- }
- }, [isContentVisible, contextNfts?.data, contextBalances?.data]);
-
const onCopyAddressClick = useCallback(() => {
if (copied) {
setCopied(false);
diff --git a/src/components/BottomMenuModal/SendModal/index.tsx b/src/components/BottomMenuModal/SendModal/index.tsx
index d874a7be..9773ee51 100644
--- a/src/components/BottomMenuModal/SendModal/index.tsx
+++ b/src/components/BottomMenuModal/SendModal/index.tsx
@@ -1,6 +1,6 @@
/* eslint-disable @typescript-eslint/no-use-before-define */
import { Blend2 as IconBlend, Layer as IconLayers } from 'iconsax-react';
-import React, { useContext, useEffect } from 'react';
+import React from 'react';
import { useTranslation } from 'react-i18next';
import styled from 'styled-components';
@@ -16,7 +16,6 @@ import { SendModalData } from '../../../types';
// hooks
import useBottomMenuModal from '../../../hooks/useBottomMenuModal';
import useGlobalTransactionsBatch from '../../../hooks/useGlobalTransactionsBatch';
-import { AccountBalancesContext } from '../../../providers/AccountBalancesProvider';
interface SendModalProps extends React.PropsWithChildren {
isContentVisible?: boolean; // for animation purpose to not render rest of content and return main wrapper only
@@ -24,22 +23,12 @@ interface SendModalProps extends React.PropsWithChildren {
}
const SendModal = ({ isContentVisible, payload }: SendModalProps) => {
- const contextBalances = useContext(AccountBalancesContext);
const wrapperRef = React.useRef(null);
const { showBatchSendModal, setShowBatchSendModal } = useBottomMenuModal();
const [t] = useTranslation();
const { transactions: globalTransactionsBatch } =
useGlobalTransactionsBatch();
- useEffect(() => {
- if (!isContentVisible) {
- contextBalances?.data.setUpdateData(false);
- }
- if (isContentVisible) {
- contextBalances?.data.setUpdateData(true);
- }
- }, [isContentVisible, contextBalances?.data]);
-
if (!isContentVisible) {
return ;
}
diff --git a/src/components/BottomMenuModal/index.tsx b/src/components/BottomMenuModal/index.tsx
index fbb452de..7cd06bc4 100644
--- a/src/components/BottomMenuModal/index.tsx
+++ b/src/components/BottomMenuModal/index.tsx
@@ -1,8 +1,12 @@
/* eslint-disable @typescript-eslint/no-use-before-define */
-import React, { useEffect } from 'react';
+import React, { useContext, useEffect } from 'react';
import { Transition } from 'react-transition-group';
import styled from 'styled-components';
+// context
+import { AccountBalancesContext } from '../../providers/AccountBalancesProvider';
+import { AccountNftsContext } from '../../providers/AccountNftsProvider';
+
// modals
import AccountModal from './AccountModal';
import AppsModal from './AppsModal';
@@ -14,6 +18,8 @@ import useBottomMenuModal from '../../hooks/useBottomMenuModal';
const BottomMenuModal = () => {
const modalRef = React.useRef(null);
+ const contextNfts = useContext(AccountNftsContext);
+ const contextBalances = useContext(AccountBalancesContext);
const { active, activeIndex, hide } = useBottomMenuModal();
const lastValidActiveIndex = React.useRef(activeIndex ?? 0);
@@ -23,6 +29,13 @@ const BottomMenuModal = () => {
lastValidActiveIndex.current = activeIndex ?? 0;
}, [activeIndex]);
+ useEffect(() => {
+ if (activeIndex === 0 || activeIndex === 2) {
+ contextNfts?.data.setUpdateData(true);
+ contextBalances?.data.setUpdateData(true);
+ }
+ }, [contextNfts?.data, contextBalances?.data, activeIndex]);
+
return (
{(overlayState) => (