Fixing confirm-add-suggested-token storybook entry (#12261)

.storybook/initial-states/approval-screens/add-suggested-token.js

@@ -1,65 +1,83 @@
-export const suggestedTokens = {
-    "0x6b175474e89094c44da98b954eedeac495271d0f": {
-      "address": "0x6b175474e89094c44da98b954eedeac495271d0f",
-      "symbol": "META",
-      "decimals": 18,
-      "image": "metamark.svg",
-      "unlisted": false
+export const suggestedAssets = [
+  {
+    asset: {
+      address: '0x6b175474e89094c44da98b954eedeac495271d0f',
+      symbol: 'META',
+      decimals: 18,
+      image: 'metamark.svg',
+      unlisted: false
     },
-    "0xB8c77482e45F1F44dE1745F52C74426C631bDD52": {
-      "address": "0xB8c77482e45F1F44dE1745F52C74426C631bDD52",
-      "symbol": "0X",
-      "decimals": 18,
-      "image": "0x.svg",
-      "unlisted": false
+  },
+  {
+    asset: {
+      'address': '0xB8c77482e45F1F44dE1745F52C74426C631bDD52',
+      'symbol': '0X',
+      'decimals': 18,
+      'image': '0x.svg',
+      'unlisted': false
     },
-    "0x1f9840a85d5af5bf1d1762f925bdaddc4201f984": {
-      "address": "0x1f9840a85d5af5bf1d1762f925bdaddc4201f984",
-      "symbol": "AST",
-      "decimals": 18,
-      "image": "ast.png",
-      "unlisted": false
+  },
+  {
+    asset: {
+      'address': '0x1f9840a85d5af5bf1d1762f925bdaddc4201f984',
+      'symbol': 'AST',
+      'decimals': 18,
+      'image': 'ast.png',
+      'unlisted': false
     },
-    "0x9f8f72aa9304c8b593d555f12ef6589cc3a579a2": {
-      "address": "0x9f8f72aa9304c8b593d555f12ef6589cc3a579a2",
-      "symbol": "BAT",
-      "decimals": 18,
-      "image": "BAT_icon.svg",
-      "unlisted": false
+  },
+  {
+    asset: {
+      'address': '0x9f8f72aa9304c8b593d555f12ef6589cc3a579a2',
+      'symbol': 'BAT',
+      'decimals': 18,
+      'image': 'BAT_icon.svg',
+      'unlisted': false
     },
-    "0xe83cccfabd4ed148903bf36d4283ee7c8b3494d1": {
-      "address": "0xe83cccfabd4ed148903bf36d4283ee7c8b3494d1",
-      "symbol": "CVL",
-      "decimals": 18,
-      "image": "CVL_token.svg",
-      "unlisted": false
+  },
+  {
+    asset: {
+      'address': '0xe83cccfabd4ed148903bf36d4283ee7c8b3494d1',
+      'symbol': 'CVL',
+      'decimals': 18,
+      'image': 'CVL_token.svg',
+      'unlisted': false
     },
-    "0x0bc529c00C6401aEF6D220BE8C6Ea1667F6Ad93e": {
-      "address": "0x0bc529c00C6401aEF6D220BE8C6Ea1667F6Ad93e",
-      "symbol": "GLA",
-      "decimals": 18,
-      "image": "gladius.svg",
-      "unlisted": false
+  },
+  {
+    asset: {
+      'address': '0x0bc529c00C6401aEF6D220BE8C6Ea1667F6Ad93e',
+      'symbol': 'GLA',
+      'decimals': 18,
+      'image': 'gladius.svg',
+      'unlisted': false
     },
-    "0x467Bccd9d29f223BcE8043b84E8C8B282827790F": {
-      "address": "0x467Bccd9d29f223BcE8043b84E8C8B282827790F",
-      "symbol": "GNO",
-      "decimals": 18,
-      "image": "gnosis.svg",
-      "unlisted": false
+  },
+  {
+    asset: {
+      'address': '0x467Bccd9d29f223BcE8043b84E8C8B282827790F',
+      'symbol': 'GNO',
+      'decimals': 18,
+      'image': 'gnosis.svg',
+      'unlisted': false
     },
-    "0xff20817765cb7f73d4bde2e66e067e58d11095c2": {
-      "address": "0xff20817765cb7f73d4bde2e66e067e58d11095c2",
-      "symbol": "OMG",
-      "decimals": 18,
-      "image": "omg.jpg",
-      "unlisted": false
+  },
+  {
+    asset: {
+      'address': '0xff20817765cb7f73d4bde2e66e067e58d11095c2',
+      'symbol': 'OMG',
+      'decimals': 18,
+      'image': 'omg.jpg',
+      'unlisted': false
     },
-    "0x8e870d67f660d95d5be530380d0ec0bd388289e1": {
-      "address": "0x8e870d67f660d95d5be530380d0ec0bd388289e1",
-      "symbol": "WED",
-      "decimals": 18,
-      "image": "wed.png",
-      "unlisted": false
+  },
+  {
+    asset: {
+      'address': '0x8e870d67f660d95d5be530380d0ec0bd388289e1',
+      'symbol': 'WED',
+      'decimals': 18,
+      'image': 'wed.png',
+      'unlisted': false
     },
-  }
+  },
+]

.storybook/test-data.js

@@ -816,7 +816,7 @@ const state = {
       '0xaD6D458402F60fD3Bd25163575031ACDce07538D': './sai.svg',
     },
     hiddenTokens: [],
-    suggestedTokens: {},
+    suggestedAssets: {},
     useNonceField: false,
     usePhishDetect: true,
     lostIdentities: {},

ui/pages/confirm-add-suggested-token/confirm-add-suggested-token.stories.js

@@ -2,7 +2,7 @@
 import React, { useEffect } from 'react';
 import { text } from '@storybook/addon-knobs';
 import { store, getNewState } from '../../../.storybook/preview';
-import { suggestedTokens } from '../../../.storybook/initial-states/approval-screens/add-suggested-token';
+import { suggestedAssets } from '../../../.storybook/initial-states/approval-screens/add-suggested-token';
 import { updateMetamaskState } from '../../store/actions';
 import ConfirmAddSuggestedToken from '.';
 
@@ -16,32 +16,28 @@ const PageSet = ({ children }) => {
   const image = text('Icon URL', 'metamark.svg');
 
   const state = store.getState();
-  const suggestedTokensState = state.metamask.suggestedTokens;
+  const suggestedAssetsState = state.metamask.suggestedAssets;
 
   useEffect(() => {
-    suggestedTokensState[
-      '0x6b175474e89094c44da98b954eedeac495271d0f'
-    ].symbol = symbol;
+    suggestedAssetsState[0].symbol = symbol;
     store.dispatch(
       updateMetamaskState(
         getNewState(state.metamask, {
-          suggestedTokens: suggestedTokensState,
+          suggestedAssets: suggestedAssetsState,
         }),
       ),
     );
-  }, [symbol, suggestedTokensState, state.metamask]);
+  }, [symbol, suggestedAssetsState, state.metamask]);
   useEffect(() => {
-    suggestedTokensState[
-      '0x6b175474e89094c44da98b954eedeac495271d0f'
-    ].image = image;
+    suggestedAssetsState[0].image = image;
     store.dispatch(
       updateMetamaskState(
         getNewState(state.metamask, {
-          suggestedTokens: suggestedTokensState,
+          suggestedAssets: suggestedAssetsState,
         }),
       ),
     );
-  }, [image, suggestedTokensState, state.metamask]);
+  }, [image, suggestedAssetsState, state.metamask]);
 
   return children;
 };
@@ -51,7 +47,7 @@ export const AddSuggestedToken = () => {
   store.dispatch(
     updateMetamaskState(
       getNewState(state.metamask, {
-        suggestedTokens,
+        suggestedAssets,
       }),
     ),
   );