Merge pull request #10719 from MetaMask/Version-v9.2.1

Version v9.2.1 RC

.circleci/config.yml

@@ -135,16 +135,20 @@ jobs:
     steps:
       - checkout
       - restore_cache:
-          key: dependency-cache-{{ checksum "yarn.lock" }}
+          key: dependency-cache-v1-{{ checksum "yarn.lock" }}
       - run:
           name: Install deps
           command: |
             .circleci/scripts/deps-install.sh
       - save_cache:
-          key: dependency-cache-{{ checksum "yarn.lock" }}
+          key: dependency-cache-v1-{{ checksum "yarn.lock" }}
           paths:
             - node_modules/
             - build-artifacts/yarn-install-har/
+      - run:
+          name: Postinstall
+          command: |
+            yarn setup:postinstall
       - persist_to_workspace:
           root: .
           paths:

.circleci/scripts/deps-install.sh

@@ -5,7 +5,7 @@ set -x
 # Exit immediately if a command exits with a non-zero status.
 set -e
 
-yarn setup-ci
+yarn install --frozen-lockfile --har
 
 # Move HAR file into directory with consistent name so that we can cache it
 mkdir -p build-artifacts/yarn-install-har

CHANGELOG.md

@@ -2,6 +2,10 @@
 
 ## Current Develop Branch
 
+## 9.2.1 Thu Mar 25 2021
+- [#10692](https://github.com/MetaMask/metamask-extension/pull/10692): Prevent UI crash when a 'wallet_requestPermissions" confirmation is queued behind a "wallet_addEthereumChain" confirmation
+- [#10712](https://github.com/MetaMask/metamask-extension/pull/10712): Fix infinite spinner when request for token symbol fails while attempting an approve transaction
+
 ## 9.2.0 Tue Mar 09 2021
 - [#10546](https://github.com/MetaMask/metamask-extension/pull/10546): Add a warning when sending a token to its own contract address
 - [#10563](https://github.com/MetaMask/metamask-extension/pull/10563): Update references to MetaMask support

app/manifest/_base.json

@@ -78,6 +78,6 @@
     "notifications"
   ],
   "short_name": "__MSG_appName__",
-  "version": "9.2.0",
+  "version": "9.2.1",
   "web_accessible_resources": ["inpage.js", "phishing.html"]
 }

app/scripts/lib/account-tracker.js

@@ -286,7 +286,7 @@ export default class AccountTracker {
         return;
       }
       addresses.forEach((address, index) => {
-        const balance = bnToHex(result[index]);
+        const balance = result[index] ? bnToHex(result[index]) : '0x0';
         accounts[address] = { address, balance };
       });
       this.store.updateState({ accounts });

package.json

@@ -3,8 +3,8 @@
   "version": "0.0.0",
   "private": true,
   "scripts": {
-    "setup": "yarn install && yarn patch-package && yarn allow-scripts",
+    "setup": "yarn install && yarn setup:postinstall",
-    "setup-ci": "yarn install --frozen-lockfile --har && yarn patch-package && yarn allow-scripts",
+    "setup:postinstall": "yarn patch-package && yarn allow-scripts",
     "start": "node development/build/index.js dev",
     "start:lavamoat": "yarn build dev",
     "dist": "yarn build prod",

ui/app/helpers/constants/routes.js

@@ -104,6 +104,8 @@ const PATH_NAME_MAP = {
   [CONNECTED_ACCOUNTS_ROUTE]: 'Accounts Connected To This Site Page',
   [`${CONFIRM_TRANSACTION_ROUTE}/:id`]: 'Confirmation Root Page',
   [CONFIRM_TRANSACTION_ROUTE]: 'Confirmation Root Page',
+  // TODO: rename when this is the only confirmation page
+  [CONFIRMATION_V_NEXT_ROUTE]: 'New Confirmation Page',
   [`${CONFIRM_TRANSACTION_ROUTE}/:id${CONFIRM_TOKEN_METHOD_PATH}`]: 'Confirm Token Method Transaction Page',
   [`${CONFIRM_TRANSACTION_ROUTE}/:id${CONFIRM_SEND_ETHER_PATH}`]: 'Confirm Send Ether Transaction Page',
   [`${CONFIRM_TRANSACTION_ROUTE}/:id${CONFIRM_SEND_TOKEN_PATH}`]: 'Confirm Send Token Transaction Page',

ui/app/pages/confirm-approve/confirm-approve.js

@@ -88,7 +88,9 @@ export default function ConfirmApprove() {
     ? getCustomTxParamsData(data, { customPermissionAmount, decimals })
     : null;
 
-  return tokenSymbol ? (
+  return tokenSymbol === undefined ? (
+    <Loading />
+  ) : (
     <ConfirmTransactionBase
       toAddress={toAddress}
       identiconAddress={tokenAddress}
@@ -142,7 +144,5 @@ export default function ConfirmApprove() {
       hideSenderToRecipient
       customTxParamsData={customData}
     />
-  ) : (
-    <Loading />
   );
 }

ui/app/pages/confirmation/confirmation.js

@@ -17,7 +17,7 @@ import { DEFAULT_ROUTE } from '../../helpers/constants/routes';
 import { stripHttpsScheme } from '../../helpers/utils/util';
 import { useI18nContext } from '../../hooks/useI18nContext';
 import { useOriginMetadata } from '../../hooks/useOriginMetadata';
-import { getUnapprovedConfirmations } from '../../selectors';
+import { getUnapprovedTemplatedConfirmations } from '../../selectors';
 import NetworkDisplay from '../../components/app/network-display/network-display';
 import { COLORS, SIZES } from '../../helpers/constants/design-system';
 import Callout from '../../components/ui/callout';
@@ -115,7 +115,10 @@ export default function ConfirmationPage() {
   const t = useI18nContext();
   const dispatch = useDispatch();
   const history = useHistory();
-  const pendingConfirmations = useSelector(getUnapprovedConfirmations, isEqual);
+  const pendingConfirmations = useSelector(
+    getUnapprovedTemplatedConfirmations,
+    isEqual,
+  );
   const [currentPendingConfirmation, setCurrentPendingConfirmation] = useState(
     0,
   );

ui/app/pages/confirmation/templates/index.js

@@ -12,6 +12,10 @@ const APPROVAL_TEMPLATES = {
   [MESSAGE_TYPE.SWITCH_ETHEREUM_CHAIN]: switchEthereumChain,
 };
 
+export const TEMPLATED_CONFIRMATION_MESSAGE_TYPES = Object.keys(
+  APPROVAL_TEMPLATES,
+);
+
 const ALLOWED_TEMPLATE_KEYS = [
   'content',
   'approvalText',

ui/app/pages/home/home.component.js

@@ -73,7 +73,7 @@ export default class Home extends PureComponent {
     setWeb3ShimUsageAlertDismissed: PropTypes.func.isRequired,
     originOfCurrentTab: PropTypes.string,
     disableWeb3ShimUsageAlert: PropTypes.func.isRequired,
-    pendingApprovals: PropTypes.arrayOf(PropTypes.object).isRequired,
+    pendingConfirmations: PropTypes.arrayOf(PropTypes.object).isRequired,
   };
 
   state = {
@@ -91,7 +91,7 @@ export default class Home extends PureComponent {
       haveSwapsQuotes,
       showAwaitingSwapScreen,
       swapsFetchParams,
-      pendingApprovals,
+      pendingConfirmations,
     } = this.props;
 
     this.setState({ mounted: true });
@@ -109,7 +109,7 @@ export default class Home extends PureComponent {
       history.push(CONFIRM_TRANSACTION_ROUTE);
     } else if (Object.keys(suggestedTokens).length > 0) {
       history.push(CONFIRM_ADD_SUGGESTED_TOKEN_ROUTE);
-    } else if (pendingApprovals.length > 0) {
+    } else if (pendingConfirmations.length > 0) {
       history.push(CONFIRMATION_V_NEXT_ROUTE);
     }
   }

ui/app/pages/home/home.container.js

@@ -8,6 +8,7 @@ import {
   getIsMainnet,
   getOriginOfCurrentTab,
   getTotalUnapprovedCount,
+  getUnapprovedTemplatedConfirmations,
   getWeb3ShimUsageStateForOrigin,
   unconfirmedTransactionsCountSelector,
 } from '../../selectors';
@@ -52,12 +53,12 @@ const mapStateToProps = (state) => {
     connectedStatusPopoverHasBeenShown,
     defaultHomeActiveTabName,
     swapsState,
-    pendingApprovals = {},
   } = metamask;
   const accountBalance = getCurrentEthBalance(state);
   const { forgottenPassword, threeBoxLastUpdated } = appState;
   const totalUnapprovedCount = getTotalUnapprovedCount(state);
   const swapsEnabled = getSwapsFeatureLiveness(state);
+  const pendingConfirmations = getUnapprovedTemplatedConfirmations(state);
 
   const envType = getEnvironmentType();
   const isPopup = envType === ENVIRONMENT_TYPE_POPUP;
@@ -102,7 +103,7 @@ const mapStateToProps = (state) => {
     isMainnet: getIsMainnet(state),
     originOfCurrentTab,
     shouldShowWeb3ShimUsageNotification,
-    pendingApprovals: Object.values(pendingApprovals),
+    pendingConfirmations,
   };
 };
 

ui/app/selectors/selectors.js

@@ -16,6 +16,19 @@ import {
   hexToDecimal,
 } from '../helpers/utils/conversions.util';
 import { ETH_SWAPS_TOKEN_OBJECT } from '../helpers/constants/swaps';
+import { TEMPLATED_CONFIRMATION_MESSAGE_TYPES } from '../pages/confirmation/templates';
+
+/**
+ * One of the only remaining valid uses of selecting the network subkey of the
+ * metamask state tree is to determine if the network is currently 'loading'.
+ *
+ * This will be used for all cases where this state key is accessed only for that
+ * purpose.
+ * @param {Object} state - redux state object
+ */
+export function isNetworkLoading(state) {
+  return state.metamask.network === 'loading';
+}
 
 export function getNetworkIdentifier(state) {
   const {
@@ -301,6 +314,13 @@ export function getUnapprovedConfirmations(state) {
   return Object.values(pendingApprovals);
 }
 
+export function getUnapprovedTemplatedConfirmations(state) {
+  const unapprovedConfirmations = getUnapprovedConfirmations(state);
+  return unapprovedConfirmations.filter((approval) =>
+    TEMPLATED_CONFIRMATION_MESSAGE_TYPES.includes(approval.type),
+  );
+}
+
 function getSuggestedTokenCount(state) {
   const { suggestedTokens = {} } = state.metamask;
   return Object.keys(suggestedTokens).length;