From b9f2f8c2a78332a2522d49baedf25e894273ef38 Mon Sep 17 00:00:00 2001
From: Alexander Tseung <alextsg@gmail.com>
Date: Thu, 7 Dec 2017 00:01:11 -0500
Subject: [PATCH] Show retry button on submitted transactions greater than 30
 seconds, add hover styling

---
 ui/app/components/transaction-list-item.js | 8 +++++++-
 ui/app/css/index.css                       | 4 ++++
 2 files changed, 11 insertions(+), 1 deletion(-)

diff --git a/ui/app/components/transaction-list-item.js b/ui/app/components/transaction-list-item.js
index fa6c5915d..42ef665b1 100644
--- a/ui/app/components/transaction-list-item.js
+++ b/ui/app/components/transaction-list-item.js
@@ -28,6 +28,12 @@ function TransactionListItem () {
   Component.call(this)
 }
 
+TransactionListItem.prototype.showRetryButton = function () {
+  const { transaction = {} } = this.props
+  const { status, time } = transaction
+  return status === 'submitted' && Date.now() - time > 30000
+}
+
 TransactionListItem.prototype.render = function () {
   const { transaction, network, conversionRate, currentCurrency } = this.props
   const { status } = transaction
@@ -114,7 +120,7 @@ TransactionListItem.prototype.render = function () {
         }) : h('.flex-column'),
       ]),
 
-      transaction.status === 'submitted' && h('.transition-list-item__retry', {
+      this.showRetryButton() && h('.transition-list-item__retry.grow-on-hover', {
         onClick: event => {
           event.stopPropagation()
           this.resubmit()
diff --git a/ui/app/css/index.css b/ui/app/css/index.css
index 0630c4c12..c0bf18c23 100644
--- a/ui/app/css/index.css
+++ b/ui/app/css/index.css
@@ -108,6 +108,10 @@ button:not([disabled]):active, input[type="submit"]:not([disabled]):active {
   transform: scale(0.95);
 }
 
+.grow-on-hover:hover {
+  transform: scale(1.05);
+}
+
 a {
   text-decoration: none;
   color: inherit;