diff --git a/test/integration/lib/currency-localization.js b/test/integration/lib/currency-localization.js
index 915fcffab..bbbe56ac7 100644
--- a/test/integration/lib/currency-localization.js
+++ b/test/integration/lib/currency-localization.js
@@ -36,7 +36,7 @@ async function runCurrencyLocalizationTest (assert) {
   await timeout(1000)
   reactTriggerChange(selectState[0])
   await timeout(1000)
-  const txView = await queryAsync($, '.transaction-view')
+  const txView = await queryAsync($, '.home__main-view')
   const heroBalance = await findAsync($(txView), '.transaction-view-balance__balance')
   const fiatAmount = await findAsync($(heroBalance), '.transaction-view-balance__secondary-balance')
   assert.equal(fiatAmount[0].textContent, '₱102,707.97PHP')
diff --git a/ui/app/components/app/index.scss b/ui/app/components/app/index.scss
index 7578aa204..cc3cedfde 100644
--- a/ui/app/components/app/index.scss
+++ b/ui/app/components/app/index.scss
@@ -52,8 +52,6 @@
 
 @import 'transaction-breakdown/index';
 
-@import 'transaction-view/index';
-
 @import 'transaction-view-balance/index';
 
 @import 'transaction-list/index';
diff --git a/ui/app/components/app/transaction-view/index.js b/ui/app/components/app/transaction-view/index.js
deleted file mode 100644
index 9eb0c3c83..000000000
--- a/ui/app/components/app/transaction-view/index.js
+++ /dev/null
@@ -1 +0,0 @@
-export { default } from './transaction-view.component'
diff --git a/ui/app/components/app/transaction-view/index.scss b/ui/app/components/app/transaction-view/index.scss
deleted file mode 100644
index 13187f0e5..000000000
--- a/ui/app/components/app/transaction-view/index.scss
+++ /dev/null
@@ -1,28 +0,0 @@
-.transaction-view {
-  flex: 1 1 66.5%;
-  background: $white;
-  min-width: 0;
-  display: flex;
-  flex-direction: column;
-  overflow-y: auto;
-
-  &__balance-wrapper {
-    @media screen and (max-width: $break-small) {
-      display: flex;
-      flex-direction: column;
-      justify-content: flex-start;
-      align-items: center;
-      flex: 0 0 auto;
-      padding-top: 16px;
-    }
-
-    @media screen and (min-width: $break-large) {
-      display: flex;
-      flex-direction: row;
-      justify-content: flex-start;
-      align-items: center;
-      margin: 2.3em 2.37em .8em;
-      flex: 0 0 auto;
-    }
-  }
-}
diff --git a/ui/app/components/app/transaction-view/transaction-view.component.js b/ui/app/components/app/transaction-view/transaction-view.component.js
deleted file mode 100644
index 7014ca173..000000000
--- a/ui/app/components/app/transaction-view/transaction-view.component.js
+++ /dev/null
@@ -1,27 +0,0 @@
-import React, { PureComponent } from 'react'
-import PropTypes from 'prop-types'
-import Media from 'react-media'
-import MenuBar from '../menu-bar'
-import TransactionViewBalance from '../transaction-view-balance'
-import TransactionList from '../transaction-list'
-
-export default class TransactionView extends PureComponent {
-  static contextTypes = {
-    t: PropTypes.func,
-  }
-
-  render () {
-    return (
-      <div className="transaction-view">
-        <Media
-          query="(max-width: 575px)"
-          render={() => <MenuBar />}
-        />
-        <div className="transaction-view__balance-wrapper">
-          <TransactionViewBalance />
-        </div>
-        <TransactionList />
-      </div>
-    )
-  }
-}
diff --git a/ui/app/pages/home/home.component.js b/ui/app/pages/home/home.component.js
index 4278f5c4b..3fd986981 100644
--- a/ui/app/pages/home/home.component.js
+++ b/ui/app/pages/home/home.component.js
@@ -7,7 +7,9 @@ import HomeNotification from '../../components/app/home-notification'
 import DaiMigrationNotification from '../../components/app/dai-migration-component'
 import MultipleNotifications from '../../components/app/multiple-notifications'
 import WalletView from '../../components/app/wallet-view'
-import TransactionView from '../../components/app/transaction-view'
+import TransactionList from '../../components/app/transaction-list'
+import TransactionViewBalance from '../../components/app/transaction-view-balance'
+import MenuBar from '../../components/app/menu-bar'
 
 import {
   RESTORE_VAULT_ROUTE,
@@ -167,13 +169,30 @@ export default class Home extends PureComponent {
         <div className="home__container">
           <Media
             query="(min-width: 576px)"
-            render={() => <WalletView />}
-          />
-          { !history.location.pathname.match(/^\/confirm-transaction/)
-            ? (
-              <TransactionView />
-            )
-            : null }
+          >
+            {
+              (isWideViewport) => (
+                <>
+                  { isWideViewport ? <WalletView /> : null }
+                  {
+                    !history.location.pathname.match(/^\/confirm-transaction/)
+                      ? (
+                        <div className="home__main-view">
+                          {
+                            !isWideViewport ? <MenuBar /> : null
+                          }
+                          <div className="home__balance-wrapper">
+                            <TransactionViewBalance />
+                          </div>
+                          <TransactionList />
+                        </div>
+                      )
+                      : null
+                  }
+                </>
+              )
+            }
+          </Media>
           { this.renderNotifications() }
         </div>
       </div>
diff --git a/ui/app/pages/home/index.scss b/ui/app/pages/home/index.scss
index 4d043ce3c..fa574043a 100644
--- a/ui/app/pages/home/index.scss
+++ b/ui/app/pages/home/index.scss
@@ -1,4 +1,35 @@
-.home__container {
-  display: flex;
-  flex: 1 1 auto;
+.home {
+  &__container {
+    display: flex;
+    flex: 1 1 auto;
+  }
+
+  &__main-view {
+    flex: 1 1 66.5%;
+    background: $white;
+    min-width: 0;
+    display: flex;
+    flex-direction: column;
+    overflow-y: auto;
+  }
+
+  &__balance-wrapper {
+    @media screen and (max-width: $break-small) {
+      display: flex;
+      flex-direction: column;
+      justify-content: flex-start;
+      align-items: center;
+      flex: 0 0 auto;
+      padding-top: 16px;
+    }
+
+    @media screen and (min-width: $break-large) {
+      display: flex;
+      flex-direction: row;
+      justify-content: flex-start;
+      align-items: center;
+      margin: 2.3em 2.37em .8em;
+      flex: 0 0 auto;
+    }
+  }
 }