Show confirm transaction screen when clicking a pending transaction in the list.

4 files changed, 20 insertions, 7 deletions

diff --git a/ui/app/actions.js b/ui/app/actions.js
index 3a65155a6..9c0ca794e 100644
--- a/ui/app/actions.js
+++ b/ui/app/actions.js
@@ -421,7 +421,7 @@ function signTx (txData) {
       if (err) return dispatch(actions.displayWarning(err.message))
       dispatch(actions.hideWarning())
     })
-    dispatch(actions.showConfTxPage())
+    dispatch(actions.showConfTxPage({}))
   }
 }
 
@@ -626,10 +626,11 @@ function showAccountsPage () {
   }
 }
 
-function showConfTxPage (transForward = true) {
+function showConfTxPage ({transForward = true, id}) {
   return {
     type: actions.SHOW_CONF_TX_PAGE,
-    transForward: transForward,
+    transForward,
+    id,
   }
 }
 
diff --git a/ui/app/components/buy-button-subview.js b/ui/app/components/buy-button-subview.js
index 15281171c..6cf6e9eb9 100644
--- a/ui/app/components/buy-button-subview.js
+++ b/ui/app/components/buy-button-subview.js
@@ -245,7 +245,7 @@ BuyButtonSubview.prototype.navigateTo = function (url) {
 
 BuyButtonSubview.prototype.backButtonContext = function () {
   if (this.props.context === 'confTx') {
-    this.props.dispatch(actions.showConfTxPage(false))
+    this.props.dispatch(actions.showConfTxPage({transForward: false}))
   } else {
     this.props.dispatch(actions.goHome())
   }
diff --git a/ui/app/components/tx-list.js b/ui/app/components/tx-list.js
index 04d2eaa79..6cbd123f8 100644
--- a/ui/app/components/tx-list.js
+++ b/ui/app/components/tx-list.js
@@ -5,8 +5,9 @@ const inherits = require('util').inherits
 const selectors = require('../selectors')
 const Identicon = require('./identicon')
 const { formatBalance, formatDate } = require('../util')
+const { showConfTxPage } = require('../actions')
 
-module.exports = connect(mapStateToProps)(TxList)
+module.exports = connect(mapStateToProps, mapDispatchToProps)(TxList)
 
 function mapStateToProps (state) {
   return {
@@ -15,6 +16,12 @@ function mapStateToProps (state) {
   }
 }
 
+function mapDispatchToProps (dispatch) {
+  return {
+    showConfTxPage: ({ id }) => dispatch(showConfTxPage({ id }))
+  }
+}
+
 inherits(TxList, Component)
 function TxList () {
   Component.call(this)
@@ -22,7 +29,7 @@ function TxList () {
 
 TxList.prototype.render = function () {
 
-  // console.log('transactions to render', txsToRender)
+  const { txsToRender, showConfTxPage } = this.props
 
   return h('div.flex-column.tx-list-container', {}, [
 
@@ -73,18 +80,23 @@ TxList.prototype.renderTransactionListItem = function (transaction) {
     address: transaction.txParams.to,
     transactionStatus: transaction.status,
     transactionAmount: formatBalance(transaction.txParams.value, 6),
+    transActionId: transaction.id,
   }
+
   const {
     address,
     transactionStatus,
     transactionAmount,
     dateString,
+    transActionId,
   } = props
+  const { showConfTxPage } = this.props
 
   return h('div.tx-list-item', {
     key: transaction.id,
   }, [
     h('div.flex-column.tx-list-item__wrapper', {
+      onClick: () => transactionStatus === 'unapproved' && showConfTxPage({id: transActionId}),
       style: {},
     }, [
 
diff --git a/ui/app/reducers/app.js b/ui/app/reducers/app.js
index b2e5543ea..c55ba179f 100644
--- a/ui/app/reducers/app.js
+++ b/ui/app/reducers/app.js
@@ -360,7 +360,7 @@ function reduceApp (state, action) {
       return extend(appState, {
         currentView: {
           name: 'confTx',
-          context: 0,
+          context: action.id && indexForPending(state, action.id) || 0,
         },
         transForward: action.transForward,
         warning: null,