diff --git a/.storybook/initial-states/approval-screens/add-suggested-token.js b/.storybook/initial-states/approval-screens/add-suggested-token.js
index 5cd10451c..d8218a2ce 100644
--- a/.storybook/initial-states/approval-screens/add-suggested-token.js
+++ b/.storybook/initial-states/approval-screens/add-suggested-token.js
@@ -2,82 +2,82 @@ export const suggestedAssets = [
   {
     asset: {
       address: '0x6b175474e89094c44da98b954eedeac495271d0f',
-      symbol: 'META',
+      symbol: 'ETH',
       decimals: 18,
-      image: 'metamark.svg',
-      unlisted: false
+      image: './images/eth_logo.svg',
+      unlisted: false,
     },
   },
   {
     asset: {
-      'address': '0xB8c77482e45F1F44dE1745F52C74426C631bDD52',
-      'symbol': '0X',
-      'decimals': 18,
-      'image': '0x.svg',
-      'unlisted': false
+      address: '0xB8c77482e45F1F44dE1745F52C74426C631bDD52',
+      symbol: '0X',
+      decimals: 18,
+      image: '0x.svg',
+      unlisted: false,
     },
   },
   {
     asset: {
-      'address': '0x1f9840a85d5af5bf1d1762f925bdaddc4201f984',
-      'symbol': 'AST',
-      'decimals': 18,
-      'image': 'ast.png',
-      'unlisted': false
+      address: '0x1f9840a85d5af5bf1d1762f925bdaddc4201f984',
+      symbol: 'AST',
+      decimals: 18,
+      image: 'ast.png',
+      unlisted: false,
     },
   },
   {
     asset: {
-      'address': '0x9f8f72aa9304c8b593d555f12ef6589cc3a579a2',
-      'symbol': 'BAT',
-      'decimals': 18,
-      'image': 'BAT_icon.svg',
-      'unlisted': false
+      address: '0x9f8f72aa9304c8b593d555f12ef6589cc3a579a2',
+      symbol: 'BAT',
+      decimals: 18,
+      image: 'BAT_icon.svg',
+      unlisted: false,
     },
   },
   {
     asset: {
-      'address': '0xe83cccfabd4ed148903bf36d4283ee7c8b3494d1',
-      'symbol': 'CVL',
-      'decimals': 18,
-      'image': 'CVL_token.svg',
-      'unlisted': false
+      address: '0xe83cccfabd4ed148903bf36d4283ee7c8b3494d1',
+      symbol: 'CVL',
+      decimals: 18,
+      image: 'CVL_token.svg',
+      unlisted: false,
     },
   },
   {
     asset: {
-      'address': '0x0bc529c00C6401aEF6D220BE8C6Ea1667F6Ad93e',
-      'symbol': 'GLA',
-      'decimals': 18,
-      'image': 'gladius.svg',
-      'unlisted': false
+      address: '0x0bc529c00C6401aEF6D220BE8C6Ea1667F6Ad93e',
+      symbol: 'GLA',
+      decimals: 18,
+      image: 'gladius.svg',
+      unlisted: false,
     },
   },
   {
     asset: {
-      'address': '0x467Bccd9d29f223BcE8043b84E8C8B282827790F',
-      'symbol': 'GNO',
-      'decimals': 18,
-      'image': 'gnosis.svg',
-      'unlisted': false
+      address: '0x467Bccd9d29f223BcE8043b84E8C8B282827790F',
+      symbol: 'GNO',
+      decimals: 18,
+      image: 'gnosis.svg',
+      unlisted: false,
     },
   },
   {
     asset: {
-      'address': '0xff20817765cb7f73d4bde2e66e067e58d11095c2',
-      'symbol': 'OMG',
-      'decimals': 18,
-      'image': 'omg.jpg',
-      'unlisted': false
+      address: '0xff20817765cb7f73d4bde2e66e067e58d11095c2',
+      symbol: 'OMG',
+      decimals: 18,
+      image: 'omg.jpg',
+      unlisted: false,
     },
   },
   {
     asset: {
-      'address': '0x8e870d67f660d95d5be530380d0ec0bd388289e1',
-      'symbol': 'WED',
-      'decimals': 18,
-      'image': 'wed.png',
-      'unlisted': false
+      address: '0x8e870d67f660d95d5be530380d0ec0bd388289e1',
+      symbol: 'WED',
+      decimals: 18,
+      image: 'wed.png',
+      unlisted: false,
     },
   },
-]
+];
diff --git a/.storybook/test-data.js b/.storybook/test-data.js
index 23c88c485..22ec45e2a 100644
--- a/.storybook/test-data.js
+++ b/.storybook/test-data.js
@@ -172,9 +172,9 @@ const state = {
       },
       '0x6b175474e89094c44da98b954eedeac495271d0f': {
         address: '0x6b175474e89094c44da98b954eedeac495271d0f',
-        symbol: 'META',
+        symbol: 'ETH',
         decimals: 18,
-        image: 'metamark.svg',
+        image: './images/eth_logo.svg',
         unlisted: false,
       },
       '0xB8c77482e45F1F44dE1745F52C74426C631bDD52': {
diff --git a/ui/pages/confirm-add-suggested-token/confirm-add-suggested-token.stories.js b/ui/pages/confirm-add-suggested-token/confirm-add-suggested-token.stories.js
index c1f7d9558..ea1947804 100644
--- a/ui/pages/confirm-add-suggested-token/confirm-add-suggested-token.stories.js
+++ b/ui/pages/confirm-add-suggested-token/confirm-add-suggested-token.stories.js
@@ -1,107 +1,65 @@
 /* eslint-disable react/prop-types */
-import React, { useEffect } from 'react';
-import { text } from '@storybook/addon-knobs';
-import { store, getNewState } from '../../../.storybook/preview';
+import React from 'react';
+import { Provider } from 'react-redux';
 import { suggestedAssets as mockSuggestedAssets } from '../../../.storybook/initial-states/approval-screens/add-suggested-token';
-import { updateMetamaskState } from '../../store/actions';
+
+import configureStore from '../../store/store';
+
+import mockState from '../../../.storybook/test-data';
+
 import ConfirmAddSuggestedToken from '.';
 
+const store = configureStore({
+  metamask: {
+    ...mockState.metamask,
+    suggestedAssets: [...mockSuggestedAssets],
+    tokens: [],
+  },
+});
+
 export default {
   title: 'Pages/ConfirmAddSuggestedToken',
-
-  argTypes: {
-    tokens: {
-      control: 'array',
-      table: { category: 'Data' },
-    },
-    suggestedAssets: {
-      control: 'array',
-      table: { category: 'Data' },
-    },
-  },
+  decorators: [(story) => <Provider store={store}>{story()}</Provider>],
 };
 
-const { metamask: state } = store.getState();
-
-const PageSet = ({ children, suggestedAssets, tokens }) => {
-  const symbol = text('symbol', 'META');
-  const image = text('Icon URL', 'metamark.svg');
-
-  useEffect(() => {
-    if (!suggestedAssets?.length) {
-      return;
-    }
-
-    suggestedAssets[0].asset.image = image;
-    suggestedAssets[0].asset.symbol = symbol;
-
-    store.dispatch(
-      updateMetamaskState(
-        getNewState(state, {
-          suggestedAssets,
-        }),
-      ),
-    );
-  }, [image, suggestedAssets, symbol]);
-
-  useEffect(() => {
-    store.dispatch(
-      updateMetamaskState(
-        getNewState(state, {
-          tokens,
-        }),
-      ),
-    );
-  }, [tokens]);
-
-  return children;
-};
-
-export const DefaultStory = ({ suggestedAssets, tokens }) => {
-  return (
-    <PageSet suggestedAssets={suggestedAssets} tokens={tokens}>
-      <ConfirmAddSuggestedToken />
-    </PageSet>
-  );
-};
+export const DefaultStory = () => <ConfirmAddSuggestedToken />;
 DefaultStory.storyName = 'Default';
-DefaultStory.args = {
-  suggestedAssets: [...mockSuggestedAssets],
-  tokens: [],
-};
 
-export const WithDuplicateAddress = ({ suggestedAssets, tokens }) => {
-  return (
-    <PageSet suggestedAssets={suggestedAssets} tokens={tokens}>
-      <ConfirmAddSuggestedToken />
-    </PageSet>
-  );
-};
-WithDuplicateAddress.args = {
-  suggestedAssets: [...mockSuggestedAssets],
-  tokens: [
-    {
-      ...mockSuggestedAssets[0].asset,
-    },
-  ],
-};
+export const WithDuplicateAddress = () => <ConfirmAddSuggestedToken />;
+const WithDuplicateAddressStore = configureStore({
+  metamask: {
+    ...mockState.metamask,
+    suggestedAssets: [...mockSuggestedAssets],
+    tokens: [
+      {
+        ...mockSuggestedAssets[0].asset,
+      },
+    ],
+  },
+});
+WithDuplicateAddress.decorators = [
+  (story) => <Provider store={WithDuplicateAddressStore}>{story()}</Provider>,
+];
 
-export const WithDuplicateSymbolAndDifferentAddress = ({
-  suggestedAssets,
-  tokens,
-}) => {
-  return (
-    <PageSet suggestedAssets={suggestedAssets} tokens={tokens}>
-      <ConfirmAddSuggestedToken />
-    </PageSet>
-  );
-};
-WithDuplicateSymbolAndDifferentAddress.args = {
-  suggestedAssets: [...mockSuggestedAssets],
-  tokens: [
-    {
-      ...mockSuggestedAssets[0].asset,
-      address: '0xNonSuggestedAddress',
-    },
-  ],
-};
+export const WithDuplicateSymbolAndDifferentAddress = () => (
+  <ConfirmAddSuggestedToken />
+);
+const WithDuplicateSymbolAndDifferentAddressStore = configureStore({
+  metamask: {
+    ...mockState.metamask,
+    suggestedAssets: [...mockSuggestedAssets],
+    tokens: [
+      {
+        ...mockSuggestedAssets[0].asset,
+        address: '0xNonSuggestedAddress',
+      },
+    ],
+  },
+});
+WithDuplicateSymbolAndDifferentAddress.decorators = [
+  (story) => (
+    <Provider store={WithDuplicateSymbolAndDifferentAddressStore}>
+      {story()}
+    </Provider>
+  ),
+];