Using values from shared/constants/time to represent timing values (#11241)

app/scripts/background.js

@@ -19,6 +19,7 @@ import {
   ENVIRONMENT_TYPE_NOTIFICATION,
   ENVIRONMENT_TYPE_FULLSCREEN,
 } from '../../shared/constants/app';
+import { SECOND } from '../../shared/constants/time';
 import migrations from './migrations';
 import Migrator from './lib/migrator';
 import ExtensionPlatform from './platforms/extension';
@@ -491,7 +492,7 @@ async function openPopup() {
         clearInterval(interval);
         resolve();
       }
-    }, 1000);
+    }, SECOND);
   });
 }
 

app/scripts/controllers/app-state.js

@@ -1,6 +1,7 @@
 import EventEmitter from 'events';
 import { ObservableStore } from '@metamask/obs-store';
 import { METAMASK_CONTROLLER_EVENTS } from '../metamask-controller';
+import { MINUTE } from '../../../shared/constants/time';
 
 export default class AppStateController extends EventEmitter {
   /**
@@ -179,7 +180,7 @@ export default class AppStateController extends EventEmitter {
 
     this.timer = setTimeout(
       () => this.onInactiveTimeout(),
-      timeoutMinutes * 60 * 1000,
+      timeoutMinutes * MINUTE,
     );
   }
 

app/scripts/controllers/detect-tokens.js

@@ -4,9 +4,10 @@ import { warn } from 'loglevel';
 import SINGLE_CALL_BALANCES_ABI from 'single-call-balance-checker-abi';
 import { MAINNET_CHAIN_ID } from '../../../shared/constants/network';
 import { SINGLE_CALL_BALANCES_ADDRESS } from '../constants/contracts';
+import { MINUTE } from '../../../shared/constants/time';
 
 // By default, poll every 3 minutes
-const DEFAULT_INTERVAL = 180 * 1000;
+const DEFAULT_INTERVAL = MINUTE * 3;
 
 /**
  * A controller that polls for token exchange

app/scripts/controllers/incoming-transactions.js

@@ -18,8 +18,9 @@ import {
   RINKEBY_CHAIN_ID,
   ROPSTEN_CHAIN_ID,
 } from '../../../shared/constants/network';
+import { SECOND } from '../../../shared/constants/time';
 
-const fetchWithTimeout = getFetchWithTimeout(30000);
+const fetchWithTimeout = getFetchWithTimeout(SECOND * 30);
 
 /**
  * @typedef {import('../../../shared/constants/transaction').TransactionMeta} TransactionMeta

app/scripts/controllers/incoming-transactions.test.js

@@ -19,6 +19,7 @@ import {
   TRANSACTION_TYPES,
   TRANSACTION_STATUSES,
 } from '../../../shared/constants/transaction';
+import { MILLISECOND } from '../../../shared/constants/time';
 
 const IncomingTransactionsController = proxyquire('./incoming-transactions', {
   '../../../shared/modules/random-id': { default: () => 54321 },
@@ -26,7 +27,7 @@ const IncomingTransactionsController = proxyquire('./incoming-transactions', {
 
 const FAKE_CHAIN_ID = '0x1338';
 const MOCK_SELECTED_ADDRESS = '0x0101';
-const SET_STATE_TIMEOUT = 10;
+const SET_STATE_TIMEOUT = MILLISECOND * 10;
 
 const EXISTING_INCOMING_TX = { id: 777, hash: '0x123456' };
 const PREPOPULATED_INCOMING_TXS_BY_HASH = {

app/scripts/controllers/network/createJsonRpcClient.js

@@ -6,9 +6,10 @@ import createInflightMiddleware from 'eth-json-rpc-middleware/inflight-cache';
 import createBlockTrackerInspectorMiddleware from 'eth-json-rpc-middleware/block-tracker-inspector';
 import providerFromMiddleware from 'eth-json-rpc-middleware/providerFromMiddleware';
 import { PollingBlockTracker } from 'eth-block-tracker';
+import { SECOND } from '../../../../shared/constants/time';
 
 const inTest = process.env.IN_TEST === 'true';
-const blockTrackerOpts = inTest ? { pollingInterval: 1000 } : {};
+const blockTrackerOpts = inTest ? { pollingInterval: SECOND } : {};
 const getTestMiddlewares = () => {
   return inTest ? [createEstimateGasDelayTestMiddleware()] : [];
 };
@@ -51,7 +52,7 @@ function createChainIdMiddleware(chainId) {
 function createEstimateGasDelayTestMiddleware() {
   return createAsyncMiddleware(async (req, _, next) => {
     if (req.method === 'eth_estimateGas') {
-      await new Promise((resolve) => setTimeout(resolve, 2000));
+      await new Promise((resolve) => setTimeout(resolve, SECOND * 2));
     }
     return next();
   });

app/scripts/controllers/network/network.js

@@ -19,6 +19,7 @@ import {
   RINKEBY_CHAIN_ID,
   INFURA_BLOCKED_KEY,
 } from '../../../../shared/constants/network';
+import { SECOND } from '../../../../shared/constants/time';
 import {
   isPrefixedFormattedHexString,
   isSafeChainId,
@@ -29,7 +30,7 @@ import createInfuraClient from './createInfuraClient';
 import createJsonRpcClient from './createJsonRpcClient';
 
 const env = process.env.METAMASK_ENV;
-const fetchWithTimeout = getFetchWithTimeout(30000);
+const fetchWithTimeout = getFetchWithTimeout(SECOND * 30);
 
 let defaultProviderConfigOpts;
 if (process.env.IN_TEST === 'true') {

app/scripts/controllers/swaps.js

@@ -14,6 +14,7 @@ import {
   SWAPS_FETCH_ORDER_CONFLICT,
   SWAPS_CHAINID_CONTRACT_ADDRESS_MAP,
 } from '../../../shared/constants/swaps';
+
 import { isSwapsDefaultTokenAddress } from '../../../shared/modules/swaps.utils';
 
 import {
@@ -21,6 +22,7 @@ import {
   fetchSwapsFeatureLiveness as defaultFetchSwapsFeatureLiveness,
   fetchSwapsQuoteRefreshTime as defaultFetchSwapsQuoteRefreshTime,
 } from '../../../ui/pages/swaps/swaps.util';
+import { MINUTE, SECOND } from '../../../shared/constants/time';
 import { NETWORK_EVENTS } from './network';
 
 // The MAX_GAS_LIMIT is a number that is higher than the maximum gas costs we have observed on any aggregator
@@ -32,11 +34,11 @@ const POLL_COUNT_LIMIT = 3;
 
 // If for any reason the MetaSwap API fails to provide a refresh time,
 // provide a reasonable fallback to avoid further errors
-const FALLBACK_QUOTE_REFRESH_TIME = 60000;
+const FALLBACK_QUOTE_REFRESH_TIME = MINUTE;
 
 // This is the amount of time to wait, after successfully fetching quotes
 // and their gas estimates, before fetching for new quotes
-const QUOTE_POLLING_DIFFERENCE_INTERVAL = 10 * 1000;
+const QUOTE_POLLING_DIFFERENCE_INTERVAL = SECOND * 10;
 
 function calculateGasEstimateWithRefund(
   maxGas = MAX_GAS_LIMIT,
@@ -346,7 +348,7 @@ export default class SwapsController {
       const gasTimeout = setTimeout(() => {
         gasTimedOut = true;
         resolve({ gasLimit: null, simulationFails: true });
-      }, 5000);
+      }, SECOND * 5);
 
       // Remove gas from params that will be passed to the `estimateGas` call
       // Including it can cause the estimate to fail if the actual gas needed

app/scripts/controllers/swaps.test.js

@@ -12,6 +12,7 @@ import {
 } from '../../../shared/constants/network';
 import { ETH_SWAPS_TOKEN_OBJECT } from '../../../shared/constants/swaps';
 import { createTestProviderTools } from '../../../test/stub/provider';
+import { SECOND } from '../../../shared/constants/time';
 import SwapsController, { utils } from './swaps';
 import { NETWORK_EVENTS } from './network';
 
@@ -34,6 +35,8 @@ const TEST_AGG_ID_6 = 'TEST_AGG_6';
 const TEST_AGG_ID_BEST = 'TEST_AGG_BEST';
 const TEST_AGG_ID_APPROVAL = 'TEST_AGG_APPROVAL';
 
+const POLLING_TIMEOUT = SECOND * 1000;
+
 const MOCK_APPROVAL_NEEDED = {
   data:
     '0x095ea7b300000000000000000000000095e6f48254609a6ee006f7d493c8e5fb97094cef0000000000000000000000000000000000000000004a817c7ffffffdabf41c00',
@@ -836,7 +839,7 @@ describe('SwapsController', function () {
       it('clears polling timeout', function () {
         swapsController.pollingTimeout = setTimeout(
           () => assert.fail(),
-          1000000,
+          POLLING_TIMEOUT,
         );
         swapsController.resetSwapsState();
         assert.strictEqual(swapsController.pollingTimeout._idleTimeout, -1);
@@ -847,7 +850,7 @@ describe('SwapsController', function () {
       it('clears polling timeout', function () {
         swapsController.pollingTimeout = setTimeout(
           () => assert.fail(),
-          1000000,
+          POLLING_TIMEOUT,
         );
         swapsController.stopPollingForQuotes();
         assert.strictEqual(swapsController.pollingTimeout._idleTimeout, -1);
@@ -865,7 +868,7 @@ describe('SwapsController', function () {
       it('clears polling timeout', function () {
         swapsController.pollingTimeout = setTimeout(
           () => assert.fail(),
-          1000000,
+          POLLING_TIMEOUT,
         );
         swapsController.resetPostFetchState();
         assert.strictEqual(swapsController.pollingTimeout._idleTimeout, -1);

app/scripts/controllers/token-rates.js

@@ -3,11 +3,12 @@ import log from 'loglevel';
 import { normalize as normalizeAddress } from 'eth-sig-util';
 import getFetchWithTimeout from '../../../shared/modules/fetch-with-timeout';
 import { toChecksumHexAddress } from '../../../shared/modules/hexstring-utils';
+import { MINUTE, SECOND } from '../../../shared/constants/time';
 
-const fetchWithTimeout = getFetchWithTimeout(30000);
+const fetchWithTimeout = getFetchWithTimeout(SECOND * 30);
 
 // By default, poll every 3 minutes
-const DEFAULT_INTERVAL = 180 * 1000;
+const DEFAULT_INTERVAL = MINUTE * 3;
 
 /**
  * A controller that polls for token exchange

app/scripts/controllers/transactions/index.test.js

@@ -13,6 +13,7 @@ import {
   TRANSACTION_STATUSES,
   TRANSACTION_TYPES,
 } from '../../../../shared/constants/transaction';
+import { SECOND } from '../../../../shared/constants/time';
 import { METAMASK_CONTROLLER_EVENTS } from '../../metamask-controller';
 import TransactionController from '.';
 
@@ -468,7 +469,7 @@ describe('Transaction Controller', function () {
         },
       };
       // eslint-disable-next-line @babel/no-invalid-this
-      this.timeout(15000);
+      this.timeout(SECOND * 15);
       const wrongValue = '0x05';
 
       txController.addTransaction(txMeta);

app/scripts/lib/ens-ipfs/setup.js

@@ -1,8 +1,9 @@
 import extension from 'extensionizer';
 import getFetchWithTimeout from '../../../../shared/modules/fetch-with-timeout';
+import { SECOND } from '../../../../shared/constants/time';
 import resolveEnsToIpfsContentId from './resolver';
 
-const fetchWithTimeout = getFetchWithTimeout(30000);
+const fetchWithTimeout = getFetchWithTimeout(SECOND * 30);
 
 const supportedTopLevelDomains = ['eth'];
 

app/scripts/lib/network-store.js

@@ -1,7 +1,8 @@
 import log from 'loglevel';
+import { SECOND } from '../../../shared/constants/time';
 import getFetchWithTimeout from '../../../shared/modules/fetch-with-timeout';
 
-const fetchWithTimeout = getFetchWithTimeout(30000);
+const fetchWithTimeout = getFetchWithTimeout(SECOND * 30);
 
 const FIXTURE_SERVER_HOST = 'localhost';
 const FIXTURE_SERVER_PORT = 12345;

app/scripts/lib/segment.js

@@ -1,4 +1,5 @@
 import Analytics from 'analytics-node';
+import { SECOND } from '../../../shared/constants/time';
 
 const isDevOrTestEnvironment = Boolean(
   process.env.METAMASK_DEBUG || process.env.IN_TEST,
@@ -21,7 +22,7 @@ const SEGMENT_FLUSH_AT =
 // deal with short lived sessions that happen faster than the interval
 // e.g confirmations. This is set to 5,000ms (5 seconds) arbitrarily with the
 // intent of having a value less than 10 seconds.
-const SEGMENT_FLUSH_INTERVAL = 5000;
+const SEGMENT_FLUSH_INTERVAL = SECOND * 5;
 
 /**
  * Creates a mock segment module for usage in test environments. This is used

app/scripts/metamask-controller.js

@@ -29,6 +29,7 @@ import { TRANSACTION_STATUSES } from '../../shared/constants/transaction';
 import { MAINNET_CHAIN_ID } from '../../shared/constants/network';
 import { UI_NOTIFICATIONS } from '../../shared/notifications';
 import { toChecksumHexAddress } from '../../shared/modules/hexstring-utils';
+import { MILLISECOND } from '../../shared/constants/time';
 
 import ComposableObservableStore from './lib/ComposableObservableStore';
 import AccountTracker from './lib/account-tracker';
@@ -82,7 +83,10 @@ export default class MetamaskController extends EventEmitter {
 
     this.defaultMaxListeners = 20;
 
-    this.sendUpdate = debounce(this.privateSendUpdate.bind(this), 200);
+    this.sendUpdate = debounce(
+      this.privateSendUpdate.bind(this),
+      MILLISECOND * 200,
+    );
     this.opts = opts;
     this.extension = opts.extension;
     this.platform = opts.platform;

shared/modules/fetch-with-timeout.test.js

@@ -1,13 +1,14 @@
 import { strict as assert } from 'assert';
 import nock from 'nock';
 
+import { MILLISECOND, SECOND } from '../constants/time';
 import getFetchWithTimeout from './fetch-with-timeout';
 
 describe('getFetchWithTimeout', function () {
   it('fetches a url', async function () {
     nock('https://api.infura.io').get('/money').reply(200, '{"hodl": false}');
 
-    const fetchWithTimeout = getFetchWithTimeout(30000);
+    const fetchWithTimeout = getFetchWithTimeout(SECOND * 30);
     const response = await (
       await fetchWithTimeout('https://api.infura.io/money')
     ).json();
@@ -19,10 +20,10 @@ describe('getFetchWithTimeout', function () {
   it('throws when the request hits a custom timeout', async function () {
     nock('https://api.infura.io')
       .get('/moon')
-      .delay(2000)
+      .delay(SECOND * 2)
       .reply(200, '{"moon": "2012-12-21T11:11:11Z"}');
 
-    const fetchWithTimeout = getFetchWithTimeout(123);
+    const fetchWithTimeout = getFetchWithTimeout(MILLISECOND * 123);
 
     try {
       await fetchWithTimeout('https://api.infura.io/moon').then((r) =>
@@ -37,10 +38,10 @@ describe('getFetchWithTimeout', function () {
   it('should abort the request when the custom timeout is hit', async function () {
     nock('https://api.infura.io')
       .get('/moon')
-      .delay(2000)
+      .delay(SECOND * 2)
       .reply(200, '{"moon": "2012-12-21T11:11:11Z"}');
 
-    const fetchWithTimeout = getFetchWithTimeout(123);
+    const fetchWithTimeout = getFetchWithTimeout(MILLISECOND * 123);
 
     try {
       await fetchWithTimeout('https://api.infura.io/moon').then((r) =>

shared/modules/rpc.utils.js

@@ -1,6 +1,7 @@
+import { SECOND } from '../constants/time';
 import getFetchWithTimeout from './fetch-with-timeout';
 
-const fetchWithTimeout = getFetchWithTimeout(30000);
+const fetchWithTimeout = getFetchWithTimeout(SECOND * 30);
 
 /**
  * Makes a JSON RPC request to the given URL, with the given RPC method and params.

ui/components/app/loading-network-screen/loading-network-screen.component.js

@@ -2,6 +2,7 @@ import React, { PureComponent } from 'react';
 import PropTypes from 'prop-types';
 import Button from '../../ui/button';
 import LoadingScreen from '../../ui/loading-screen';
+import { SECOND } from '../../../../shared/constants/time';
 
 export default class LoadingNetworkScreen extends PureComponent {
   state = {
@@ -27,7 +28,7 @@ export default class LoadingNetworkScreen extends PureComponent {
   componentDidMount = () => {
     this.cancelCallTimeout = setTimeout(
       this.cancelCall,
-      this.props.cancelTime || 15000,
+      this.props.cancelTime || SECOND * 15,
     );
   };
 
@@ -87,7 +88,7 @@ export default class LoadingNetworkScreen extends PureComponent {
               window.clearTimeout(this.cancelCallTimeout);
               this.cancelCallTimeout = setTimeout(
                 this.cancelCall,
-                this.props.cancelTime || 15000,
+                this.props.cancelTime || SECOND * 15,
               );
             }}
           >
@@ -114,7 +115,7 @@ export default class LoadingNetworkScreen extends PureComponent {
       this.setState({ showErrorScreen: false });
       this.cancelCallTimeout = setTimeout(
         this.cancelCall,
-        this.props.cancelTime || 15000,
+        this.props.cancelTime || SECOND * 15,
       );
     }
   };

ui/components/app/modals/qr-scanner/qr-scanner.component.js

@@ -4,6 +4,7 @@ import log from 'loglevel';
 import { BrowserQRCodeReader } from '@zxing/library';
 import { getEnvironmentType } from '../../../../../app/scripts/lib/util';
 import { ENVIRONMENT_TYPE_FULLSCREEN } from '../../../../../shared/constants/app';
+import { SECOND } from '../../../../../shared/constants/time';
 import Spinner from '../../../ui/spinner';
 import WebcamUtils from '../../../../helpers/utils/webcam-utils';
 import PageContainerFooter from '../../../ui/page-container/page-container-footer/page-container-footer.component';
@@ -86,14 +87,14 @@ export default class QrScanner extends Component {
       const { permissions } = await WebcamUtils.checkStatus();
       if (permissions) {
         // Let the video stream load first...
-        await new Promise((resolve) => setTimeout(resolve, 2000));
+        await new Promise((resolve) => setTimeout(resolve, SECOND * 2));
         if (!this.mounted) {
           return;
         }
         this.setState({ ready: READY_STATE.READY });
       } else if (this.mounted) {
         // Keep checking for permissions
-        this.permissionChecker = setTimeout(this.checkPermissions, 1000);
+        this.permissionChecker = setTimeout(this.checkPermissions, SECOND);
       }
     } catch (error) {
       if (this.mounted) {

ui/components/app/selected-account/selected-account.component.js

@@ -5,6 +5,7 @@ import { shortenAddress } from '../../../helpers/utils/util';
 
 import Tooltip from '../../ui/tooltip';
 import { toChecksumHexAddress } from '../../../../shared/modules/hexstring-utils';
+import { SECOND } from '../../../../shared/constants/time';
 
 class SelectedAccount extends Component {
   state = {
@@ -50,7 +51,7 @@ class SelectedAccount extends Component {
               this.setState({ copied: true });
               this.copyTimeout = setTimeout(
                 () => this.setState({ copied: false }),
-                3000,
+                SECOND * 3,
               );
               copyToClipboard(checksummedAddress);
             }}

ui/components/app/sidebars/sidebar.component.js

@@ -2,6 +2,7 @@ import React, { Component } from 'react';
 import PropTypes from 'prop-types';
 import ReactCSSTransitionGroup from 'react-transition-group/CSSTransitionGroup';
 import CustomizeGas from '../gas-customization/gas-modal-page-container';
+import { MILLISECOND } from '../../../../shared/constants/time';
 
 export default class Sidebar extends Component {
   static propTypes = {
@@ -60,8 +61,8 @@ export default class Sidebar extends Component {
       <div>
         <ReactCSSTransitionGroup
           transitionName={transitionName}
-          transitionEnterTimeout={300}
-          transitionLeaveTimeout={200}
+          transitionEnterTimeout={MILLISECOND * 300}
+          transitionLeaveTimeout={MILLISECOND * 200}
         >
           {sidebarOpen && !sidebarShouldClose
             ? this.renderSidebarContent()

ui/components/app/transaction-list-item-details/transaction-list-item-details.component.js

@@ -10,6 +10,7 @@ import Button from '../../ui/button';
 import Tooltip from '../../ui/tooltip';
 import Copy from '../../ui/icon/copy-icon.component';
 import Popover from '../../ui/popover';
+import { SECOND } from '../../../../shared/constants/time';
 import { TRANSACTION_TYPES } from '../../../../shared/constants/transaction';
 
 export default class TransactionListItemDetails extends PureComponent {
@@ -102,7 +103,7 @@ export default class TransactionListItemDetails extends PureComponent {
 
     this.setState({ justCopied: true }, () => {
       copyToClipboard(hash);
-      setTimeout(() => this.setState({ justCopied: false }), 1000);
+      setTimeout(() => this.setState({ justCopied: false }), SECOND);
     });
   };
 

ui/components/ui/alert/index.js

@@ -1,6 +1,7 @@
 import classnames from 'classnames';
 import PropTypes from 'prop-types';
 import React, { Component } from 'react';
+import { MILLISECOND } from '../../../../shared/constants/time';
 
 class Alert extends Component {
   state = {
@@ -33,7 +34,7 @@ class Alert extends Component {
 
     setTimeout((_) => {
       this.setState({ visible: false });
-    }, 500);
+    }, MILLISECOND * 500);
   }
 
   render() {

ui/components/ui/callout/callout.js

@@ -3,6 +3,7 @@ import PropTypes from 'prop-types';
 import classnames from 'classnames';
 import InfoIconInverted from '../icon/info-icon-inverted.component';
 import { SEVERITIES } from '../../../helpers/constants/design-system';
+import { MILLISECOND } from '../../../../shared/constants/time';
 
 export default function Callout({
   severity,
@@ -29,7 +30,7 @@ export default function Callout({
     if (removed) {
       setTimeout(() => {
         dismiss();
-      }, 500);
+      }, MILLISECOND * 500);
     }
   }, [removed, dismiss]);
   return (

ui/helpers/utils/fetch-with-cache.js

@@ -1,10 +1,11 @@
+import { MINUTE, SECOND } from '../../../shared/constants/time';
 import getFetchWithTimeout from '../../../shared/modules/fetch-with-timeout';
 import { getStorageItem, setStorageItem } from './storage-helpers';
 
 const fetchWithCache = async (
   url,
   fetchOptions = {},
-  { cacheRefreshTime = 360000, timeout = 30000 } = {},
+  { cacheRefreshTime = MINUTE * 6, timeout = SECOND * 30 } = {},
 ) => {
   if (
     fetchOptions.body ||

ui/helpers/utils/i18n-helper.js

@@ -3,9 +3,10 @@ import React from 'react';
 import log from 'loglevel';
 import * as Sentry from '@sentry/browser';
 
+import { SECOND } from '../../../shared/constants/time';
 import getFetchWithTimeout from '../../../shared/modules/fetch-with-timeout';
 
-const fetchWithTimeout = getFetchWithTimeout(30000);
+const fetchWithTimeout = getFetchWithTimeout(SECOND * 30);
 
 const warned = {};
 const missingMessageErrors = {};

ui/hooks/useCopyToClipboard.js

@@ -1,5 +1,6 @@
 import { useState, useCallback } from 'react';
 import copyToClipboard from 'copy-to-clipboard';
+import { SECOND } from '../../shared/constants/time';
 import { useTimeout } from './useTimeout';
 
 /**
@@ -9,7 +10,7 @@ import { useTimeout } from './useTimeout';
  *
  * @return {[boolean, Function]}
  */
-const DEFAULT_DELAY = 3000;
+const DEFAULT_DELAY = SECOND * 3;
 
 export function useCopyToClipboard(delay = DEFAULT_DELAY) {
   const [copied, setCopied] = useState(false);

ui/hooks/useShouldShowSpeedUp.js

@@ -1,4 +1,5 @@
 import { useEffect, useState } from 'react';
+import { SECOND } from '../../shared/constants/time';
 
 /**
  * Evaluates whether the transaction is eligible to be sped up, and registers
@@ -24,7 +25,7 @@ export function useShouldShowSpeedUp(transactionGroup, isEarliestNonce) {
     // for determining enabled status change
     let timeoutId;
     if (!hasRetried && isEarliestNonce && !speedUpEnabled) {
-      if (Date.now() - submittedTime > 5000) {
+      if (Date.now() - submittedTime > SECOND * 5) {
         setSpeedUpEnabled(true);
       } else {
         timeoutId = setTimeout(() => {

ui/hooks/useTokenTracker.js

@@ -2,6 +2,7 @@ import { useState, useEffect, useRef, useCallback } from 'react';
 import TokenTracker from '@metamask/eth-token-tracker';
 import { useSelector } from 'react-redux';
 import { getCurrentChainId, getSelectedAddress } from '../selectors';
+import { SECOND } from '../../shared/constants/time';
 import { useEqualityCheck } from './useEqualityCheck';
 
 export function useTokenTracker(
@@ -52,7 +53,7 @@ export function useTokenTracker(
         provider: global.ethereumProvider,
         tokens: tokenList,
         includeFailedTokens,
-        pollingInterval: 8000,
+        pollingInterval: SECOND * 8,
       });
 
       tokenTracker.current.on('update', updateBalances);

ui/pages/confirm-decrypt-message/confirm-decrypt-message.component.js

@@ -10,6 +10,7 @@ import Tooltip from '../../components/ui/tooltip';
 import Copy from '../../components/ui/icon/copy-icon.component';
 
 import { ENVIRONMENT_TYPE_NOTIFICATION } from '../../../shared/constants/app';
+import { SECOND } from '../../../shared/constants/time';
 import { getEnvironmentType } from '../../../app/scripts/lib/util';
 import { conversionUtil } from '../../helpers/utils/conversion-util';
 
@@ -91,7 +92,7 @@ export default class ConfirmDecryptMessage extends Component {
       },
     });
     this.setState({ hasCopied: true });
-    setTimeout(() => this.setState({ hasCopied: false }), 3000);
+    setTimeout(() => this.setState({ hasCopied: false }), SECOND * 3);
   };
 
   renderHeader = () => {

ui/pages/create-account/connect-hardware/index.js

@@ -10,6 +10,7 @@ import {
 } from '../../../selectors';
 import { formatBalance } from '../../../helpers/utils/util';
 import { getMostRecentOverviewPage } from '../../../ducks/history/history';
+import { SECOND } from '../../../../shared/constants/time';
 import SelectHardware from './select-hardware';
 import AccountList from './account-list';
 
@@ -100,7 +101,7 @@ class ConnectHardwareForm extends Component {
     // Autohide the alert after 5 seconds
     setTimeout((_) => {
       this.props.hideAlert();
-    }, 5000);
+    }, SECOND * 5);
   }
 
   getPage = (device, page, hdPath) => {

ui/pages/mobile-sync/mobile-sync.component.js

@@ -7,11 +7,12 @@ import qrCode from 'qrcode-generator';
 
 import Button from '../../components/ui/button';
 import LoadingScreen from '../../components/ui/loading-screen';
+import { MINUTE, SECOND } from '../../../shared/constants/time';
 
 const PASSWORD_PROMPT_SCREEN = 'PASSWORD_PROMPT_SCREEN';
 const REVEAL_SEED_SCREEN = 'REVEAL_SEED_SCREEN';
-const KEYS_GENERATION_TIME = 30000;
-const IDLE_TIME = KEYS_GENERATION_TIME * 4;
+const KEYS_GENERATION_TIME = SECOND * 30;
+const IDLE_TIME = MINUTE * 2;
 
 export default class MobileSyncPage extends Component {
   static contextTypes = {

ui/pages/permissions-connect/permissions-connect.component.js

@@ -3,12 +3,13 @@ import React, { Component } from 'react';
 import { Switch, Route } from 'react-router-dom';
 import { getEnvironmentType } from '../../../app/scripts/lib/util';
 import { ENVIRONMENT_TYPE_NOTIFICATION } from '../../../shared/constants/app';
+import { MILLISECOND } from '../../../shared/constants/time';
 import { DEFAULT_ROUTE } from '../../helpers/constants/routes';
 import PermissionPageContainer from '../../components/app/permission-page-container';
 import ChooseAccount from './choose-account';
 import PermissionsRedirect from './redirect';
 
-const APPROVE_TIMEOUT = 1200;
+const APPROVE_TIMEOUT = MILLISECOND * 1200;
 
 export default class PermissionConnect extends Component {
   static propTypes = {

ui/pages/swaps/countdown-timer/countdown-timer.js

@@ -6,6 +6,7 @@ import { Duration } from 'luxon';
 import { I18nContext } from '../../../contexts/i18n';
 import InfoTooltip from '../../../components/ui/info-tooltip';
 import { getSwapsQuoteRefreshTime } from '../../../ducks/swaps/swaps';
+import { SECOND } from '../../../../shared/constants/time';
 
 // Return the mm:ss start time of the countdown timer.
 // If time has elapsed between `timeStarted` the time current time,
@@ -17,14 +18,14 @@ function getNewTimer(currentTime, timeStarted, timeBaseStart) {
 }
 
 function decreaseTimerByOne(timer) {
-  return Math.max(timer - 1000, 0);
+  return Math.max(timer - SECOND, 0);
 }
 
 function timeBelowWarningTime(timer, warningTime) {
   const [warningTimeMinutes, warningTimeSeconds] = warningTime.split(':');
   return (
     timer <=
-    (Number(warningTimeMinutes) * 60 + Number(warningTimeSeconds)) * 1000
+    (Number(warningTimeMinutes) * 60 + Number(warningTimeSeconds)) * SECOND
   );
 }
 
@@ -52,7 +53,7 @@ export default function CountdownTimer({
     if (intervalRef.current === undefined) {
       intervalRef.current = setInterval(() => {
         setTimer(decreaseTimerByOne);
-      }, 1000);
+      }, SECOND);
     }
 
     return function cleanup() {
@@ -75,7 +76,7 @@ export default function CountdownTimer({
       clearInterval(intervalRef.current);
       intervalRef.current = setInterval(() => {
         setTimer(decreaseTimerByOne);
-      }, 1000);
+      }, SECOND);
     }
   }, [timeStarted, timer, timerStart]);
 

ui/pages/swaps/swaps.util.js

@@ -16,6 +16,7 @@ import {
   WETH_SYMBOL,
   MAINNET_CHAIN_ID,
 } from '../../../shared/constants/network';
+import { SECOND } from '../../../shared/constants/time';
 import {
   calcTokenValue,
   calcTokenAmount,
@@ -239,7 +240,7 @@ export async function fetchTradesInfo(
     sourceToken,
     sourceAmount: calcTokenValue(value, sourceDecimals).toString(10),
     slippage,
-    timeout: 10000,
+    timeout: SECOND * 10,
     walletAddress: fromAddress,
   };
 
@@ -252,7 +253,7 @@ export async function fetchTradesInfo(
   const tradesResponse = await fetchWithCache(
     tradeURL,
     { method: 'GET' },
-    { cacheRefreshTime: 0, timeout: 15000 },
+    { cacheRefreshTime: 0, timeout: SECOND * 15 },
   );
   const newQuotes = tradesResponse.reduce((aggIdTradeMap, quote) => {
     if (