fix(swap): keep fiat polling in routing

near · Apr 21, 2022 · b2d90f4 · b2d90f4
1 parent 575e6d4
commit b2d90f4
Show file tree

Hide file tree

Showing 2 changed files with 24 additions and 13 deletions.
diff --git a/packages/frontend/src/components/Routing.js b/packages/frontend/src/components/Routing.js
@@ -134,6 +134,7 @@ const Container = styled.div`
         }
     }
 `;
+
 class Routing extends Component {
     constructor(props) {
         super(props);
@@ -200,6 +201,7 @@ class Routing extends Component {
         } = this.props;
 
         fetchTokenFiatValues();
+        this.startPollingTokenFiatValue();
         handleRefreshUrl(router);
         refreshAccount();
 
@@ -232,6 +234,27 @@ class Routing extends Component {
         }
     }
 
+    componentWillUnmount = () => {
+        this.stopPollingTokenFiatValue();
+    }
+
+    startPollingTokenFiatValue = () => {
+        const { fetchTokenFiatValues } = this.props;
+
+        const handlePollTokenFiatValue = async () => {
+            await fetchTokenFiatValues().catch(() => { });
+            if (this.pollTokenFiatValue) {
+                this.pollTokenFiatValue = setTimeout(() => handlePollTokenFiatValue(), 30000);
+            }
+        };
+        this.pollTokenFiatValue = setTimeout(() => handlePollTokenFiatValue(), 30000);
+    }
+
+    stopPollingTokenFiatValue = () => {
+        clearTimeout(this.pollTokenFiatValue);
+        this.pollTokenFiatValue = null;
+    }
+
     render() {
         const { search, query: { tab }, hash, pathname } = this.props.router.location;
         const { account } = this.props;

diff --git a/packages/frontend/src/components/wallet/Wallet.js b/packages/frontend/src/components/wallet/Wallet.js
@@ -1,13 +1,11 @@
-import React, { useEffect } from 'react';
+import React from 'react';
 import { Translate } from 'react-localize-redux';
-import { useDispatch } from 'react-redux';
 import { Textfit } from 'react-textfit';
 import styled from 'styled-components';
 
 import { CREATE_IMPLICIT_ACCOUNT,CREATE_USN_CONTRACT } from '../../../../../features';
 import getCurrentLanguage from '../../hooks/getCurrentLanguage';
 import { useSplitFungibleTokens } from '../../hooks/splitFungibleTokens';
-import { actions as tokenFiatValueActions } from '../../redux/slices/tokenFiatValues';
 import classNames from '../../utils/classNames';
 import { SHOW_NETWORK_BANNER } from '../../utils/wallet';
 import Balance from '../common/balance/Balance';
@@ -30,8 +28,6 @@ import ReleaseNotesModal from './ReleaseNotesModal';
 import Sidebar from './Sidebar';
 import Tokens from './Tokens';
 
-const { fetchTokenFiatValues } = tokenFiatValueActions;
-
 const StyledContainer = styled(Container)`
     @media (max-width: 991px) {
         margin: -5px auto 0 auto;
@@ -343,20 +339,12 @@ export function Wallet({
 
 const FungibleTokens = ({ balance, tokensLoading, fungibleTokens, accountExists, totalAmount, currentLanguage }) => {
     const zeroBalanceAccount = accountExists === false;
-    const dispatch = useDispatch();
     const currentFungibleTokens = CREATE_USN_CONTRACT ? fungibleTokens[0][0] : fungibleTokens[0];
     const hideFungibleTokenSection =
         zeroBalanceAccount &&
         fungibleTokens?.length === 1 &&
         currentFungibleTokens?.onChainFTMetadata?.symbol === 'NEAR';
 
-    useEffect(() => {
-        const startPollingTokenFiatValue = setInterval(() => {
-            dispatch(fetchTokenFiatValues());
-        },30000);
-
-        return () => clearInterval(startPollingTokenFiatValue);
-    }, []);
     return (
         <>
             <div className='total-balance'>