Clean up code

app/scripts/transaction-manager.js

@@ -25,8 +25,9 @@ module.exports = class TransactionManager extends EventEmitter {
   getState () {
     var selectedAccount = this.getSelectedAccount()
     return {
+      transactions: this.getTxList(),
       unconfTxs: this.getUnapprovedTxList(),
-      transactions: this.getFilteredTxList({metamaskNetworkId: this.getNetwork(), from: selectedAccount}),
+      selectedAccountTxList: this.getFilteredTxList({metamaskNetworkId: this.getNetwork(), from: selectedAccount}),
     }
   }
 

ui/app/account-detail.js

@@ -29,7 +29,7 @@ function mapStateToProps (state) {
     network: state.metamask.network,
     unconfMsgs: valuesFor(state.metamask.unconfMsgs),
     shapeShiftTxList: state.metamask.shapeShiftTxList,
-    transactions: state.metamask.transactions,
+    transactions: state.metamask.selectedAccountTxList || [],
   }
 }
 
@@ -249,9 +249,8 @@ AccountDetailScreen.prototype.subview = function () {
 AccountDetailScreen.prototype.transactionList = function () {
   const {transactions, unconfMsgs, address, network, shapeShiftTxList } = this.props
   // sort by recency
-  var soretedTxs = transactions.sort((a, b) => b.time - a.time)
   return h(TransactionList, {
-    transactions: soretedTxs,
+    transactions: transactions.sort((a, b) => b.time - a.time),
     network,
     unconfMsgs,
     address,

ui/app/components/transaction-list-item-icon.js

@@ -13,36 +13,41 @@ function TransactionIcon () {
 
 TransactionIcon.prototype.render = function () {
   const { transaction, txParams, isMsg } = this.props
-  if (transaction.status === 'unapproved') {
-    return h('.unapproved-tx', {
-      style: {
-        width: '15px',
-        height: '15px',
-        background: '#00bfff',
-        borderRadius: '13px',
-      },
-    })
+  switch (transaction.status) {
+    case 'unapproved':
+      return h('.unapproved-tx', {
+        style: {
+          width: '24px',
+          height: '24px',
+          background: '#4dffff',
+          border: 'solid',
+          borderColor: '#AEAEAE',
+          borderWidth: '0.5px',
+          borderRadius: '13px',
+        },
+      })
 
-  } else if (transaction.status === 'rejected') {
-    return h('i.fa.fa-exclamation-triangle.fa-lg.warning', {
-      style: {
-        width: '24px',
-      },
-    })
-  } else if (transaction.status === 'signed') {
-    return h('i.fa.fa-ellipsis-h', {
-      style: {
-        fontSize: '27px',
-      },
-    })
-  } else if (transaction.status === 'failed') {
-    return h('i.fa.fa-exclamation-triangle.fa-lg.warning', {
-      style: {
-        fontSize: '24px',
-      },
-    })
-  }
+    case 'rejected':
+      return h('i.fa.fa-exclamation-triangle.fa-lg.warning', {
+        style: {
+          width: '24px',
+        },
+      })
 
+    case 'failed':
+      return h('i.fa.fa-exclamation-triangle.fa-lg.error', {
+        style: {
+          width: '24px',
+        },
+      })
+
+    case 'signed':
+      return h('i.fa.fa-ellipsis-h', {
+        style: {
+          fontSize: '27px',
+        },
+      })
+  }
 
   if (isMsg) {
     return h('i.fa.fa-certificate.fa-lg', {

ui/app/components/transaction-list.js

@@ -13,13 +13,13 @@ function TransactionList () {
 }
 
 TransactionList.prototype.render = function () {
-  const { transactions = [], network, unconfMsgs } = this.props
+  const { transactions, network, unconfMsgs } = this.props
 
   var shapeShiftTxList
   if (network === '1') {
     shapeShiftTxList = this.props.shapeShiftTxList
   }
-  const txsToRender = !shapeShiftTxList ? transactions.concat(unconfMsgs) : txsToRender.concat(unconfMsgs, shapeShiftTxList)
+  const txsToRender = !shapeShiftTxList ? transactions.concat(unconfMsgs) : transactions.concat(unconfMsgs, shapeShiftTxList)
   .sort((a, b) => b.time - a.time)
 
   return (