Merge remote-tracking branch 'origin/develop' into master-sync

.circleci/config.yml

@@ -485,7 +485,7 @@ jobs:
     steps:
       - add_ssh_keys:
           fingerprints:
-            - "5e:a3:2d:35:b6:25:b5:87:b1:41:11:0d:77:50:96:73"
+            - "3d:49:29:f4:b2:e8:ea:af:d1:32:eb:2a:fc:15:85:d8"
       - checkout
       - attach_workspace:
           at: .

.circleci/scripts/release-commit-version-bump.sh

@@ -16,6 +16,16 @@ then
     exit 1
 fi
 
+if [[ -z "${GITHUB_TOKEN:-}" ]]
+then
+    printf '%s\n' 'GITHUB_TOKEN environment variable must be set'
+    exit 1
+elif [[ -z "${GITHUB_TOKEN_USER:-}" ]]
+then
+    printf '%s\n' 'GITHUB_TOKEN_USER environment variable must be set'
+    exit 1
+fi
+
 printf '%s\n' 'Commit the manifest version and changelog if the manifest has changed'
 
 if git diff --quiet app/manifest/_base.json;

.circleci/scripts/release-create-release-pr.sh

@@ -16,12 +16,6 @@ then
     exit 1
 fi
 
-if [[ -z "${GITHUB_TOKEN:-}" ]]
-then
-    printf '%s\n' 'GITHUB_TOKEN environment variable must be set'
-    exit 1
-fi
-
 function install_github_cli ()
 {
     printf '%s\n' 'Installing hub CLI'

.eslintrc.js

@@ -108,7 +108,7 @@ module.exports = {
     },
     {
       files: ['**/*.test.js'],
-      excludedFiles: ['ui/**/*.test.js', 'ui/app/__mocks__/*.js'],
+      excludedFiles: ['ui/**/*.test.js', 'ui/__mocks__/*.js'],
       extends: ['@metamask/eslint-config-mocha'],
       rules: {
         'mocha/no-setup-in-describe': 'off',
@@ -125,7 +125,7 @@ module.exports = {
       },
     },
     {
-      files: ['ui/**/*.test.js', 'ui/app/__mocks__/*.js'],
+      files: ['ui/**/*.test.js', 'ui/__mocks__/*.js'],
       extends: ['@metamask/eslint-config-jest'],
       rules: {
         'jest/no-restricted-matchers': 'off',

.gitignore

@@ -39,7 +39,7 @@ test-builds
 build-artifacts
 
 #ignore css output and sourcemaps
-ui/app/css/output/
+ui/css/output/
 
 notes.txt
 

.storybook/i18n.js

@@ -1,12 +1,12 @@
 import React, { Component, createContext, useMemo } from 'react';
 import PropTypes from 'prop-types';
-import { getMessage } from '../ui/app/helpers/utils/i18n-helper';
-import { I18nContext } from '../ui/app/contexts/i18n';
+import { getMessage } from '../ui/helpers/utils/i18n-helper';
+import { I18nContext } from '../ui/contexts/i18n';
 
-export { I18nContext }
+export { I18nContext };
 
 export const I18nProvider = (props) => {
-  const { currentLocale, current, en } = props
+  const { currentLocale, current, en } = props;
 
   const t = useMemo(() => {
     return (key, ...args) =>

.storybook/main.js

@@ -1,9 +1,9 @@
-const path = require('path')
+const path = require('path');
 
-const CopyWebpackPlugin = require('copy-webpack-plugin')
+const CopyWebpackPlugin = require('copy-webpack-plugin');
 
 module.exports = {
-  stories: ['../ui/app/**/*.stories.js'],
+  stories: ['../ui/**/*.stories.js'],
   addons: [
     '@storybook/addon-knobs',
     '@storybook/addon-actions',
@@ -12,7 +12,7 @@ module.exports = {
     './i18n-party-addon/register.js',
   ],
   webpackFinal: async (config) => {
-    config.module.strictExportPresence = true
+    config.module.strictExportPresence = true;
     config.module.rules.push({
       test: /\.scss$/,
       loaders: [
@@ -31,12 +31,12 @@ module.exports = {
             sourceMap: true,
             implementation: require('sass'),
             sassOptions: {
-              includePaths: ['ui/app/css/'],
+              includePaths: ['ui/css/'],
             },
           },
         },
       ],
-    })
+    });
     config.plugins.push(
       new CopyWebpackPlugin({
         patterns: [
@@ -51,7 +51,7 @@ module.exports = {
           },
         ],
       }),
-    )
-    return config
+    );
+    return config;
   },
-}
+};

.storybook/preview.js

@@ -3,12 +3,12 @@ import { addDecorator, addParameters } from '@storybook/react';
 import { useGlobals } from '@storybook/api';
 import { withKnobs } from '@storybook/addon-knobs';
 import { Provider } from 'react-redux';
-import configureStore from '../ui/app/store/store';
-import '../ui/app/css/index.scss';
+import configureStore from '../ui/store/store';
+import '../ui/css/index.scss';
 import localeList from '../app/_locales/index.json';
 import * as allLocales from './locales';
 import { I18nProvider, LegacyI18nProvider } from './i18n';
-import testData from './test-data.js'
+import testData from './test-data.js';
 
 addParameters({
   backgrounds: {
@@ -41,7 +41,7 @@ const styles = {
   alignItems: 'center',
 };
 
-const store = configureStore(testData)
+const store = configureStore(testData);
 
 const metamaskDecorator = (story, context) => {
   const currentLocale = context.globals.locale;

app/_locales/en/messages.json

@@ -556,6 +556,12 @@
   "dismiss": {
     "message": "Dismiss"
   },
+  "dismissReminderDescriptionField": {
+    "message": "Turn this on to dismiss the recovery phrase backup reminder message. We highly recommend that you back up your seed phrase to avoid loss of funds"
+  },
+  "dismissReminderField": {
+    "message": "Dismiss recovery phrase backup reminder"
+  },
   "done": {
     "message": "Done"
   },
@@ -684,6 +690,9 @@
   "estimatedProcessingTimes": {
     "message": "Estimated Processing Times"
   },
+  "ethGasPriceFetchWarning": {
+    "message": "Backup gas price is provided as the main gas estimation service is unavailable right now."
+  },
   "eth_accounts": {
     "message": "View the addresses of your permitted accounts (required)",
     "description": "The description for the `eth_accounts` permission"
@@ -780,6 +789,9 @@
   "gasPriceExtremelyLow": {
     "message": "Gas Price Extremely Low"
   },
+  "gasPriceFetchFailed": {
+    "message": "Gas price estimation failed due to network error."
+  },
   "gasPriceInfoTooltipContent": {
     "message": "Gas price specifies the amount of Ether you are willing to pay for each unit of gas."
   },
@@ -1966,8 +1978,8 @@
   "swapSelectQuotePopoverDescription": {
     "message": "Below are all the quotes gathered from multiple liquidity sources."
   },
-  "swapSlippageTooLow": {
-    "message": "Slippage must be greater than zero"
+  "swapSlippageNegative": {
+    "message": "Slippage must be greater or equal to zero"
   },
   "swapSource": {
     "message": "Liquidity source"

app/_locales/es/messages.json

@@ -1690,9 +1690,6 @@
   "swapSelectQuotePopoverDescription": {
     "message": "A continuación se muestran todas las cotizaciones recopiladas de múltiples fuentes de liquidez."
   },
-  "swapSlippageTooLow": {
-    "message": "El deslizamiento debe ser mayor que cero"
-  },
   "swapSource": {
     "message": "Fuente de liquidez"
   },

app/_locales/es_419/messages.json

@@ -1690,9 +1690,6 @@
   "swapSelectQuotePopoverDescription": {
     "message": "A continuación se muestran todas las cotizaciones recopiladas de múltiples fuentes de liquidez."
   },
-  "swapSlippageTooLow": {
-    "message": "El deslizamiento debe ser mayor que cero"
-  },
   "swapSource": {
     "message": "Fuente de liquidez"
   },

app/_locales/hi/messages.json

@@ -1660,9 +1660,6 @@
   "swapSelectQuotePopoverDescription": {
     "message": "नीचे दिए गए सभी उद्धरण कई चलनिधि स्रोतों से एकत्र किए गए हैं।"
   },
-  "swapSlippageTooLow": {
-    "message": "स्लिपेज शून्य से अधिक होना चाहिए"
-  },
   "swapSource": {
     "message": "चलनिधि का स्रोत"
   },

app/_locales/id/messages.json

@@ -1660,9 +1660,6 @@
   "swapSelectQuotePopoverDescription": {
     "message": "Di bawah ini adalah semua kuota yang dikumpulkan dari beberapa sumber likuiditas."
   },
-  "swapSlippageTooLow": {
-    "message": "Slippage harus lebih besar dari nol"
-  },
   "swapSource": {
     "message": "Sumber likuiditas"
   },

app/_locales/it/messages.json

@@ -1702,9 +1702,6 @@
   "swapSelectQuotePopoverDescription": {
     "message": "Sotto trovi tutte le quotazioni raccolte da multiple sorgenti di liquidità."
   },
-  "swapSlippageTooLow": {
-    "message": "Lo slippage deve essere maggiore di zero"
-  },
   "swapSource": {
     "message": "Sorgente di liquidità"
   },

app/_locales/ja/messages.json

@@ -1690,9 +1690,6 @@
   "swapSelectQuotePopoverDescription": {
     "message": "以下は複数の流動性ソースから収集したすべての見積です。"
   },
-  "swapSlippageTooLow": {
-    "message": "スリッページは 0 より多くする必要があります。"
-  },
   "swapSource": {
     "message": "流動性ソース"
   },

app/_locales/ko/messages.json

@@ -1660,9 +1660,6 @@
   "swapSelectQuotePopoverDescription": {
     "message": "다음은 여러 유동성 소스에서 수집한 전체 견적입니다."
   },
-  "swapSlippageTooLow": {
-    "message": "슬리패지는 0보다 커야 합니다."
-  },
   "swapSource": {
     "message": "유동성 소스"
   },

app/_locales/ru/messages.json

@@ -1660,9 +1660,6 @@
   "swapSelectQuotePopoverDescription": {
     "message": "Ниже приведены все котировки, собранные из нескольких источников ликвидности."
   },
-  "swapSlippageTooLow": {
-    "message": "Проскальзывание должно быть больше нуля"
-  },
   "swapSource": {
     "message": "Источник ликвидности"
   },

app/_locales/tl/messages.json

@@ -1657,9 +1657,6 @@
   "swapSelectQuotePopoverDescription": {
     "message": "Makikita sa ibaba ang lahat ng quote na nakuha mula sa maraming pinagkukunan ng liquidity."
   },
-  "swapSlippageTooLow": {
-    "message": "Dapat ay mas malaki sa zero ang slippage"
-  },
   "swapSource": {
     "message": "Pinagkunan ng liquidity"
   },

app/_locales/vi/messages.json

@@ -1660,9 +1660,6 @@
   "swapSelectQuotePopoverDescription": {
     "message": "Dưới đây là tất cả các báo giá thu thập từ nhiều nguồn thanh khoản."
   },
-  "swapSlippageTooLow": {
-    "message": "Mức trượt giá phải lớn hơn 0"
-  },
   "swapSource": {
     "message": "Nguồn thanh khoản"
   },

app/_locales/zh_CN/messages.json

@@ -1690,9 +1690,6 @@
   "swapSelectQuotePopoverDescription": {
     "message": "以下是从多个流动资金来源收集到的所有报价。"
   },
-  "swapSlippageTooLow": {
-    "message": "滑点必须大于零"
-  },
   "swapSource": {
     "message": "流动资金来源"
   },

app/scripts/controllers/app-state.js

@@ -23,6 +23,7 @@ export default class AppStateController extends EventEmitter {
       timeoutMinutes: 0,
       connectedStatusPopoverHasBeenShown: true,
       defaultHomeActiveTabName: null,
+      browserEnvironment: {},
       ...initState,
     });
     this.timer = null;
@@ -158,4 +159,12 @@ export default class AppStateController extends EventEmitter {
       timeoutMinutes * 60 * 1000,
     );
   }
+
+  /**
+   * Sets the current browser and OS environment
+   * @returns {void}
+   */
+  setBrowserEnvironment(os, browser) {
+    this.store.updateState({ browserEnvironment: { os, browser } });
+  }
 }

app/scripts/controllers/preferences.js

@@ -43,6 +43,7 @@ export default class PreferencesController {
       useBlockie: false,
       useNonceField: false,
       usePhishDetect: true,
+      dismissSeedBackUpReminder: false,
 
       // WARNING: Do not use feature flags for security-sensitive things.
       // Feature flag toggling is available in the global namespace
@@ -669,7 +670,7 @@ export default class PreferencesController {
 
   /**
    * A setter for the `useLedgerLive` property
-   * @param {bool} domain - Value for ledger live support
+   * @param {bool} useLedgerLive - Value for ledger live support
    * @returns {Promise<string>} A promise of the update to useLedgerLive
    */
   async setLedgerLivePreference(useLedgerLive) {
@@ -685,6 +686,17 @@ export default class PreferencesController {
     return this.store.getState().useLedgerLive;
   }
 
+  /**
+   * A setter for the user preference to dismiss the seed phrase backup reminder
+   * @param {bool} dismissBackupReminder- User preference for dismissing the back up reminder
+   * @returns {void}
+   */
+  async setDismissSeedBackUpReminder(dismissSeedBackUpReminder) {
+    await this.store.updateState({
+      dismissSeedBackUpReminder,
+    });
+  }
+
   //
   // PRIVATE METHODS
   //

app/scripts/controllers/swaps.js

@@ -4,9 +4,9 @@ import BigNumber from 'bignumber.js';
 import { ObservableStore } from '@metamask/obs-store';
 import { mapValues, cloneDeep } from 'lodash';
 import abi from 'human-standard-token-abi';
-import { calcTokenAmount } from '../../../ui/app/helpers/utils/token-util';
-import { calcGasTotal } from '../../../ui/app/pages/send/send.utils';
-import { conversionUtil } from '../../../ui/app/helpers/utils/conversion-util';
+import { calcTokenAmount } from '../../../ui/helpers/utils/token-util';
+import { calcGasTotal } from '../../../ui/pages/send/send.utils';
+import { conversionUtil } from '../../../ui/helpers/utils/conversion-util';
 import {
   DEFAULT_ERC20_APPROVE_GAS,
   QUOTES_EXPIRED_ERROR,
@@ -20,7 +20,7 @@ import {
   fetchTradesInfo as defaultFetchTradesInfo,
   fetchSwapsFeatureLiveness as defaultFetchSwapsFeatureLiveness,
   fetchSwapsQuoteRefreshTime as defaultFetchSwapsQuoteRefreshTime,
-} from '../../../ui/app/pages/swaps/swaps.util';
+} from '../../../ui/pages/swaps/swaps.util';
 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

app/scripts/controllers/transactions/index.js

@@ -16,8 +16,8 @@ import {
   BnMultiplyByFraction,
   addHexPrefix,
 } from '../../lib/util';
-import { TRANSACTION_NO_CONTRACT_ERROR_KEY } from '../../../../ui/app/helpers/constants/error-keys';
-import { getSwapsTokensReceivedFromTxMeta } from '../../../../ui/app/pages/swaps/swaps.util';
+import { TRANSACTION_NO_CONTRACT_ERROR_KEY } from '../../../../ui/helpers/constants/error-keys';
+import { getSwapsTokensReceivedFromTxMeta } from '../../../../ui/pages/swaps/swaps.util';
 import {
   TRANSACTION_STATUSES,
   TRANSACTION_TYPES,

app/scripts/metamask-controller.js

@@ -476,6 +476,17 @@ export default class MetamaskController extends EventEmitter {
       this.submitPassword(password);
     }
 
+    // Lazily update the store with the current extension environment
+    this.extension.runtime.getPlatformInfo(({ os }) => {
+      this.appStateController.setBrowserEnvironment(
+        os,
+        // This method is presently only supported by Firefox
+        this.extension.runtime.getBrowserInfo === undefined
+          ? 'chrome'
+          : 'firefox',
+      );
+    });
+
     // TODO:LegacyProvider: Delete
     this.publicConfigStore = this.createPublicConfigStore();
   }
@@ -722,6 +733,10 @@ export default class MetamaskController extends EventEmitter {
         preferencesController.addKnownMethodData,
         preferencesController,
       ),
+      setDismissSeedBackUpReminder: nodeify(
+        this.preferencesController.setDismissSeedBackUpReminder,
+        this.preferencesController,
+      ),
 
       // AddressController
       setAddressBook: nodeify(

app/scripts/metamask-controller.test.js

@@ -52,6 +52,7 @@ const ExtensionizerMock = {
     onInstalled: {
       addListener: () => undefined,
     },
+    getPlatformInfo: async () => 'mac',
   },
 };
 

development/build/static.js

@@ -35,7 +35,7 @@ const copyTargets = [
     dest: `fonts/fontawesome`,
   },
   {
-    src: `./ui/app/css/output/`,
+    src: `./ui/css/output/`,
     pattern: `*.css`,
     dest: ``,
   },

development/build/styles.js

@@ -18,8 +18,8 @@ function createStyleTasks({ livereload }) {
   const prod = createTask(
     'styles:prod',
     createScssBuildTask({
-      src: 'ui/app/css/index.scss',
-      dest: 'ui/app/css/output',
+      src: 'ui/css/index.scss',
+      dest: 'ui/css/output',
       devMode: false,
     }),
   );
@@ -27,15 +27,15 @@ function createStyleTasks({ livereload }) {
   const dev = createTask(
     'styles:dev',
     createScssBuildTask({
-      src: 'ui/app/css/index.scss',
-      dest: 'ui/app/css/output',
+      src: 'ui/css/index.scss',
+      dest: 'ui/css/output',
       devMode: true,
-      pattern: 'ui/app/**/*.scss',
+      pattern: 'ui/**/*.scss',
     }),
   );
 
   const lint = createTask('lint-scss', function () {
-    return gulp.src('ui/app/css/itcss/**/*.scss').pipe(
+    return gulp.src('ui/css/itcss/**/*.scss').pipe(
       gulpStylelint({
         reporters: [{ formatter: 'string', console: true }],
         fix: true,

development/verify-locale-strings.js

@@ -171,8 +171,8 @@ async function verifyEnglishLocale() {
   // In the meantime we'll use glob to specify which paths can be strict searched
   // and gradually phase out the key based search
   const globsToStrictSearch = [
-    'ui/app/components/app/metamask-translation/*.js',
-    'ui/app/pages/confirmation/templates/*.js',
+    'ui/components/app/metamask-translation/*.js',
+    'ui/pages/confirmation/templates/*.js',
   ];
   const testGlob = '**/*.test.js';
   const javascriptFiles = await glob(['ui/**/*.js', 'shared/**/*.js'], {

jest.config.js

@@ -1,7 +1,7 @@
 module.exports = {
   restoreMocks: true,
   coverageDirectory: 'jest-coverage/',
-  collectCoverageFrom: ['<rootDir>/ui/app/**/swaps/**'],
+  collectCoverageFrom: ['<rootDir>/ui/**/swaps/**'],
   coveragePathIgnorePatterns: ['.stories.js', '.snap'],
   coverageThreshold: {
     global: {

lavamoat/node/policy.json

@@ -950,6 +950,16 @@
         "buffer-equal": true
       }
     },
+    "are-we-there-yet": {
+      "builtin": {
+        "events.EventEmitter": true,
+        "util.inherits": true
+      },
+      "packages": {
+        "delegates": true,
+        "readable-stream": true
+      }
+    },
     "arr-diff": {
       "packages": {
         "arr-flatten": true,
@@ -1302,6 +1312,7 @@
         "anymatch": true,
         "async-each": true,
         "braces": true,
+        "fsevents": true,
         "glob-parent": true,
         "inherits": true,
         "is-binary-path": true,
@@ -1553,6 +1564,16 @@
         "through2": true
       }
     },
+    "detect-libc": {
+      "builtin": {
+        "child_process.spawnSync": true,
+        "fs.readdirSync": true,
+        "os.platform": true
+      },
+      "globals": {
+        "process.env": true
+      }
+    },
     "detective": {
       "packages": {
         "acorn-node": true,
@@ -1993,6 +2014,45 @@
         "process.version": true
       }
     },
+    "fsevents": {
+      "builtin": {
+        "events.EventEmitter": true,
+        "fs.stat": true,
+        "path.join": true,
+        "util.inherits": true
+      },
+      "globals": {
+        "__dirname": true,
+        "process.nextTick": true,
+        "process.platform": true,
+        "setImmediate": true
+      },
+      "native": true,
+      "packages": {
+        "node-pre-gyp": true
+      }
+    },
+    "gauge": {
+      "builtin": {
+        "util.format": true
+      },
+      "globals": {
+        "clearInterval": true,
+        "process": true,
+        "setImmediate": true,
+        "setInterval": true
+      },
+      "packages": {
+        "aproba": true,
+        "console-control-strings": true,
+        "has-unicode": true,
+        "object-assign": true,
+        "signal-exit": true,
+        "string-width": true,
+        "strip-ansi": true,
+        "wide-align": true
+      }
+    },
     "get-assigned-identifiers": {
       "builtin": {
         "assert.equal": true
@@ -2373,6 +2433,16 @@
         "process.argv": true
       }
     },
+    "has-unicode": {
+      "builtin": {
+        "os.type": true
+      },
+      "globals": {
+        "process.env.LANG": true,
+        "process.env.LC_ALL": true,
+        "process.env.LC_CTYPE": true
+      }
+    },
     "has-value": {
       "packages": {
         "get-value": true,
@@ -2526,6 +2596,11 @@
         "is-plain-object": true
       }
     },
+    "is-fullwidth-code-point": {
+      "packages": {
+        "number-is-nan": true
+      }
+    },
     "is-glob": {
       "packages": {
         "is-extglob": true
@@ -2910,6 +2985,56 @@
         "setTimeout": true
       }
     },
+    "node-pre-gyp": {
+      "builtin": {
+        "events.EventEmitter": true,
+        "fs.existsSync": true,
+        "fs.readFileSync": true,
+        "fs.renameSync": true,
+        "path.dirname": true,
+        "path.existsSync": true,
+        "path.join": true,
+        "path.resolve": true,
+        "url.parse": true,
+        "url.resolve": true,
+        "util.inherits": true
+      },
+      "globals": {
+        "__dirname": true,
+        "console.log": true,
+        "process.arch": true,
+        "process.cwd": true,
+        "process.env": true,
+        "process.platform": true,
+        "process.version.substr": true,
+        "process.versions": true
+      },
+      "packages": {
+        "detect-libc": true,
+        "nopt": true,
+        "npmlog": true,
+        "rimraf": true,
+        "semver": true
+      }
+    },
+    "nopt": {
+      "builtin": {
+        "path": true,
+        "stream.Stream": true,
+        "url": true
+      },
+      "globals": {
+        "console": true,
+        "process.argv": true,
+        "process.env.DEBUG_NOPT": true,
+        "process.env.NOPT_DEBUG": true,
+        "process.platform": true
+      },
+      "packages": {
+        "abbrev": true,
+        "osenv": true
+      }
+    },
     "normalize-path": {
       "packages": {
         "remove-trailing-separator": true
@@ -2925,6 +3050,22 @@
         "once": true
       }
     },
+    "npmlog": {
+      "builtin": {
+        "events.EventEmitter": true,
+        "util": true
+      },
+      "globals": {
+        "process.nextTick": true,
+        "process.stderr": true
+      },
+      "packages": {
+        "are-we-there-yet": true,
+        "console-control-strings": true,
+        "gauge": true,
+        "set-blocking": true
+      }
+    },
     "object-copy": {
       "packages": {
         "copy-descriptor": true,
@@ -2991,6 +3132,54 @@
         "readable-stream": true
       }
     },
+    "os-homedir": {
+      "builtin": {
+        "os.homedir": true
+      },
+      "globals": {
+        "process.env": true,
+        "process.getuid": true,
+        "process.platform": true
+      }
+    },
+    "os-tmpdir": {
+      "globals": {
+        "process.env.SystemRoot": true,
+        "process.env.TEMP": true,
+        "process.env.TMP": true,
+        "process.env.TMPDIR": true,
+        "process.env.windir": true,
+        "process.platform": true
+      }
+    },
+    "osenv": {
+      "builtin": {
+        "child_process.exec": true,
+        "path": true
+      },
+      "globals": {
+        "process.env.COMPUTERNAME": true,
+        "process.env.ComSpec": true,
+        "process.env.EDITOR": true,
+        "process.env.HOSTNAME": true,
+        "process.env.PATH": true,
+        "process.env.PROMPT": true,
+        "process.env.PS1": true,
+        "process.env.Path": true,
+        "process.env.SHELL": true,
+        "process.env.USER": true,
+        "process.env.USERDOMAIN": true,
+        "process.env.USERNAME": true,
+        "process.env.VISUAL": true,
+        "process.env.path": true,
+        "process.nextTick": true,
+        "process.platform": true
+      },
+      "packages": {
+        "os-homedir": true,
+        "os-tmpdir": true
+      }
+    },
     "parent-module": {
       "packages": {
         "callsites": true
@@ -3573,6 +3762,12 @@
         "process": true
       }
     },
+    "set-blocking": {
+      "globals": {
+        "process.stderr": true,
+        "process.stdout": true
+      }
+    },
     "set-value": {
       "packages": {
         "extend-shallow": true,
@@ -3766,6 +3961,7 @@
     },
     "string-width": {
       "packages": {
+        "code-point-at": true,
         "emoji-regex": true,
         "is-fullwidth-code-point": true,
         "strip-ansi": true
@@ -4322,6 +4518,11 @@
         "isexe": true
       }
     },
+    "wide-align": {
+      "packages": {
+        "string-width": true
+      }
+    },
     "write": {
       "builtin": {
         "fs.createWriteStream": true,

package.json

@@ -49,7 +49,7 @@
     "verify-locales": "node ./development/verify-locale-strings.js",
     "verify-locales:fix": "node ./development/verify-locale-strings.js --fix",
     "mozilla-lint": "addons-linter dist/firefox",
-    "watch": "mocha --watch --require test/env.js --require test/setup.js --reporter min --recursive \"test/unit/**/*.js\" \"ui/app/**/*.test.js\" \"shared/**/*.test.js\"",
+    "watch": "mocha --watch --require test/env.js --require test/setup.js --reporter min --recursive \"test/unit/**/*.js\" \"ui/**/*.test.js\" \"shared/**/*.test.js\"",
     "devtools:react": "react-devtools",
     "devtools:redux": "remotedev --hostname=localhost --port=8000",
     "start:dev": "concurrently -k -n build,react,redux yarn:start yarn:devtools:react yarn:devtools:redux",
@@ -328,7 +328,8 @@
       "gc-stats": false,
       "github:assemblyscript/assemblyscript": false,
       "tiny-secp256k1": false,
-      "@lavamoat/preinstall-always-fail": false
+      "@lavamoat/preinstall-always-fail": false,
+      "fsevents": false
     }
   }
 }

test/e2e/metamask-ui.spec.js

@@ -1117,16 +1117,10 @@ describe('MetaMask', function () {
     });
 
     it('finds the transaction in the transactions list', async function () {
-      await driver.wait(async () => {
-        const confirmedTxes = await driver.findElements(
-          '.transaction-list__completed-transactions .transaction-list-item',
-        );
-        return confirmedTxes.length === 1;
-      }, 10000);
-
       await driver.waitForSelector(
         {
-          css: '.transaction-list-item__primary-currency',
+          css:
+            '.transaction-list__completed-transactions .transaction-list-item__primary-currency',
           text: '-1 TST',
         },
         { timeout: 10000 },
@@ -1219,15 +1213,9 @@ describe('MetaMask', function () {
     });
 
     it('finds the transaction in the transactions list', async function () {
-      await driver.wait(async () => {
-        const confirmedTxes = await driver.findElements(
-          '.transaction-list__completed-transactions .transaction-list-item',
-        );
-        return confirmedTxes.length === 2;
-      }, 10000);
-
       await driver.waitForSelector({
-        css: '.transaction-list-item__primary-currency',
+        css:
+          '.transaction-list__completed-transactions .transaction-list-item__primary-currency',
         text: '-1.5 TST',
       });
 
@@ -1235,11 +1223,23 @@ describe('MetaMask', function () {
         css: '.list-item__heading',
         text: 'Send TST',
       });
+    });
+
+    it('checks balance', async function () {
+      await driver.clickElement({
+        text: 'Assets',
+        tag: 'button',
+      });
 
       await driver.waitForSelector({
-        css: '.token-overview__primary-balance',
+        css: '.asset-list-item__token-button',
         text: '7.5 TST',
       });
+
+      await driver.clickElement({
+        text: 'Activity',
+        tag: 'button',
+      });
     });
   });
 
@@ -1368,13 +1368,6 @@ describe('MetaMask', function () {
     });
 
     it('finds the transaction in the transactions list', async function () {
-      await driver.wait(async () => {
-        const confirmedTxes = await driver.findElements(
-          '.transaction-list__completed-transactions .transaction-list-item',
-        );
-        return confirmedTxes.length === 3;
-      }, 10000);
-
       await driver.waitForSelector({
         // Select only the heading of the first entry in the transaction list.
         css:
@@ -1427,13 +1420,6 @@ describe('MetaMask', function () {
     });
 
     it('finds the transaction in the transactions list', async function () {
-      await driver.wait(async () => {
-        const confirmedTxes = await driver.findElements(
-          '.transaction-list__completed-transactions .transaction-list-item',
-        );
-        return confirmedTxes.length === 4;
-      }, 10000);
-
       await driver.waitForSelector({
         // Select the heading of the first transaction list item in the
         // completed transaction list with text matching Send TST
@@ -1443,7 +1429,8 @@ describe('MetaMask', function () {
       });
 
       await driver.waitForSelector({
-        css: '.transaction-list-item__primary-currency',
+        css:
+          '.transaction-list__completed-transactions .transaction-list-item:first-child .transaction-list-item__primary-currency',
         text: '-1.5 TST',
       });
     });
@@ -1509,13 +1496,6 @@ describe('MetaMask', function () {
     });
 
     it('finds the transaction in the transactions list', async function () {
-      await driver.wait(async () => {
-        const confirmedTxes = await driver.findElements(
-          '.transaction-list__completed-transactions .transaction-list-item',
-        );
-        return confirmedTxes.length === 5;
-      }, 10000);
-
       await driver.waitForSelector({
         css:
           '.transaction-list__completed-transactions .transaction-list-item:first-child .list-item__heading',
@@ -1526,6 +1506,10 @@ describe('MetaMask', function () {
 
   describe('Hide token', function () {
     it('hides the token when clicked', async function () {
+      await driver.clickElement({ text: 'Assets', tag: 'button' });
+
+      await driver.clickElement({ text: 'TST', tag: 'span' });
+
       await driver.clickElement('[data-testid="asset-options__button"]');
 
       await driver.clickElement('[data-testid="asset-options__hide"]');

test/jest/background.js

@@ -1,4 +1,4 @@
-import * as actions from '../../ui/app/store/actions';
+import * as actions from '../../ui/store/actions';
 
 export const setBackgroundConnection = (backgroundConnection = {}) => {
   actions._setBackgroundConnection(backgroundConnection);

test/jest/rendering.js

@@ -4,8 +4,8 @@ import { render } from '@testing-library/react';
 import { MemoryRouter } from 'react-router-dom';
 import PropTypes from 'prop-types';
 
-import { I18nContext, LegacyI18nProvider } from '../../ui/app/contexts/i18n';
-import { getMessage } from '../../ui/app/helpers/utils/i18n-helper';
+import { I18nContext, LegacyI18nProvider } from '../../ui/contexts/i18n';
+import { getMessage } from '../../ui/helpers/utils/i18n-helper';
 import * as en from '../../app/_locales/en/messages.json';
 
 export const I18nProvider = (props) => {

test/lib/render-helpers.js

@@ -1,13 +1,19 @@
 import React, { useMemo } from 'react';
 import { Provider } from 'react-redux';
 import { render } from '@testing-library/react';
-import { mount } from 'enzyme';
+import { mount, shallow } from 'enzyme';
 import { MemoryRouter } from 'react-router-dom';
 import PropTypes from 'prop-types';
-import { I18nContext, LegacyI18nProvider } from '../../ui/app/contexts/i18n';
-import { getMessage } from '../../ui/app/helpers/utils/i18n-helper';
+import { I18nContext, LegacyI18nProvider } from '../../ui/contexts/i18n';
+import { getMessage } from '../../ui/helpers/utils/i18n-helper';
 import * as en from '../../app/_locales/en/messages.json';
 
+export function shallowWithContext(jsxComponent) {
+  return shallow(jsxComponent, {
+    context: { t: (str1, str2) => (str2 ? str1 + str2 : str1) },
+  });
+}
+
 export function mountWithRouter(component, store = {}, pathname = '/') {
   // Instantiate router context
   const router = {

test/unit-global/balance-formatter.test.js

@@ -1,6 +1,6 @@
 import assert from 'assert';
 import currencyFormatter from 'currency-formatter';
-import availableCurrencies from '../../ui/app/helpers/constants/available-conversions.json';
+import availableCurrencies from '../../ui/helpers/constants/available-conversions.json';
 
 describe('currencyFormatting', function () {
   it('be able to format any infura currency', function (done) {

ui/app/components/app/signature-request/signature-request.constants.js

@@ -1,3 +0,0 @@
-import { ENVIRONMENT_TYPE_NOTIFICATION } from '../../../../../shared/constants/app';
-
-export { ENVIRONMENT_TYPE_NOTIFICATION };

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

@@ -4,8 +4,8 @@ import { debounce } from 'lodash';
 import Fuse from 'fuse.js';
 import InputAdornment from '@material-ui/core/InputAdornment';
 import classnames from 'classnames';
-import { ENVIRONMENT_TYPE_POPUP } from '../../../../../shared/constants/app';
-import { getEnvironmentType } from '../../../../../app/scripts/lib/util';
+import { ENVIRONMENT_TYPE_POPUP } from '../../../../shared/constants/app';
+import { getEnvironmentType } from '../../../../app/scripts/lib/util';
 import Identicon from '../../ui/identicon';
 import SiteIcon from '../../ui/site-icon';
 import UserPreferencedCurrencyDisplay from '../user-preferenced-currency-display';

ui/components/app/account-menu/account-menu.test.js

@@ -2,7 +2,7 @@ import React from 'react';
 import sinon from 'sinon';
 import configureMockStore from 'redux-mock-store';
 import { Provider } from 'react-redux';
-import { mountWithRouter } from '../../../../../test/lib/render-helpers';
+import { mountWithRouter } from '../../../../test/lib/render-helpers';
 import AccountMenu from '.';
 
 describe('Account Menu', () => {

ui/components/app/alerts/unconnected-account-alert/unconnected-account-alert.test.js

@@ -6,11 +6,11 @@ import thunk from 'redux-thunk';
 import { fireEvent } from '@testing-library/react';
 import configureMockStore from 'redux-mock-store';
 
-import { tick } from '../../../../../../test/lib/tick';
-import { renderWithProvider } from '../../../../../../test/lib/render-helpers';
+import { tick } from '../../../../../test/lib/tick';
+import { renderWithProvider } from '../../../../../test/lib/render-helpers';
 
 import * as actions from '../../../../store/actions';
-import { KOVAN_CHAIN_ID } from '../../../../../../shared/constants/network';
+import { KOVAN_CHAIN_ID } from '../../../../../shared/constants/network';
 import UnconnectedAccountAlert from '.';
 
 describe('Unconnected Account Alert', () => {

ui/components/app/confirm-page-container/confirm-page-container-content/confirm-page-container-content.component.js

@@ -22,6 +22,7 @@ export default class ConfirmPageContainerContent extends Component {
     titleComponent: PropTypes.node,
     warning: PropTypes.string,
     origin: PropTypes.string.isRequired,
+    ethGasPriceWarning: PropTypes.string,
     // Footer
     onCancelAll: PropTypes.func,
     onCancel: PropTypes.func,
@@ -81,11 +82,15 @@ export default class ConfirmPageContainerContent extends Component {
       unapprovedTxCount,
       rejectNText,
       origin,
+      ethGasPriceWarning,
     } = this.props;
 
     return (
       <div className="confirm-page-container-content">
         {warning && <ConfirmPageContainerWarning warning={warning} />}
+        {ethGasPriceWarning && (
+          <ConfirmPageContainerWarning warning={ethGasPriceWarning} />
+        )}
         <ConfirmPageContainerSummary
           className={classnames({
             'confirm-page-container-summary--border':

ui/components/app/confirm-page-container/confirm-page-container-content/confirm-page-container-warning/index.scss

@@ -1,7 +1,6 @@
 .confirm-page-container-warning {
   background-color: #fffcdb;
   display: flex;
-  justify-content: center;
   align-items: center;
   border-bottom: 1px solid $geyser;
   padding: 12px 24px;

ui/components/app/confirm-page-container/confirm-page-container-header/confirm-page-container-header.component.js

@@ -3,8 +3,8 @@ import PropTypes from 'prop-types';
 import {
   ENVIRONMENT_TYPE_POPUP,
   ENVIRONMENT_TYPE_NOTIFICATION,
-} from '../../../../../../shared/constants/app';
-import { getEnvironmentType } from '../../../../../../app/scripts/lib/util';
+} from '../../../../../shared/constants/app';
+import { getEnvironmentType } from '../../../../../app/scripts/lib/util';
 import NetworkDisplay from '../../network-display';
 import Identicon from '../../../ui/identicon';
 import { shortenAddress } from '../../../../helpers/utils/util';

ui/components/app/confirm-page-container/confirm-page-container-header/confirm-page-container-header.component.test.js

@@ -3,10 +3,10 @@ import { shallow } from 'enzyme';
 import sinon from 'sinon';
 import { Provider } from 'react-redux';
 import configureStore from '../../../../store/store';
-import testData from '../../../../../../.storybook/test-data';
+import testData from '../../../../../.storybook/test-data';
 import ConfirmPageContainerHeader from './confirm-page-container-header.component';
 
-const util = require('../../../../../../app/scripts/lib/util');
+const util = require('../../../../../app/scripts/lib/util');
 
 describe('Confirm Detail Row Component', () => {
   describe('render', () => {

ui/components/app/confirm-page-container/confirm-page-container.component.js

@@ -43,6 +43,7 @@ export default class ConfirmPageContainer extends Component {
     warning: PropTypes.string,
     unapprovedTxCount: PropTypes.number,
     origin: PropTypes.string.isRequired,
+    ethGasPriceWarning: PropTypes.string,
     // Navigation
     totalTx: PropTypes.number,
     positionOfCurrentTx: PropTypes.number,
@@ -103,6 +104,7 @@ export default class ConfirmPageContainer extends Component {
       hideSenderToRecipient,
       showAccountInHeader,
       origin,
+      ethGasPriceWarning,
     } = this.props;
     const renderAssetImage = contentComponent || !identiconAddress;
 
@@ -162,6 +164,7 @@ export default class ConfirmPageContainer extends Component {
             unapprovedTxCount={unapprovedTxCount}
             rejectNText={this.context.t('rejectTxsN', [unapprovedTxCount])}
             origin={origin}
+            ethGasPriceWarning={ethGasPriceWarning}
           />
         )}
         {contentComponent && (