Fix activity log inline buttons (#8908)

The inline speedup and speedup cancellation buttons in the activity log
were broken. An exception would be thrown upon either button being
clicked, and nothing would happen from the user's perspective.

Both handlers were being passed a transaction id, which was a holdover
from before the transaction list redesign. The handlers passed for
these two actions now have the transaction id embedded, so it doesn't
need to be passed in anymore. They expect the click event to be passed
through instead.

The handlers passed also didn't handle closing the transaction details
modal when clicked. After fixing the first problem, they still didn't
work because the speedup/cancel dialog was shown behind the transaction
details modal.

Both issues are now fixed. Both buttons now close the transaction
details modal, and trigger the appropriate action.

ui/app/components/app/transaction-activity-log/transaction-activity-log.component.js

@@ -36,34 +36,32 @@ export default class TransactionActivityLog extends PureComponent {
     global.platform.openTab({ url: etherscanUrl })
   }
 
-  renderInlineRetry (index, activity) {
+  renderInlineRetry (index) {
     const { t } = this.context
     const { inlineRetryIndex, primaryTransaction = {}, onRetry, isEarliestNonce } = this.props
     const { status } = primaryTransaction
-    const { id } = activity
 
     return isEarliestNonce && status !== CONFIRMED_STATUS && index === inlineRetryIndex
       ? (
         <div
           className="transaction-activity-log__action-link"
-          onClick={() => onRetry(id)}
+          onClick={onRetry}
         >
           { t('speedUpTransaction') }
         </div>
       ) : null
   }
 
-  renderInlineCancel (index, activity) {
+  renderInlineCancel (index) {
     const { t } = this.context
     const { inlineCancelIndex, primaryTransaction = {}, onCancel, isEarliestNonce } = this.props
     const { status } = primaryTransaction
-    const { id } = activity
 
     return isEarliestNonce && status !== CONFIRMED_STATUS && index === inlineCancelIndex
       ? (
         <div
           className="transaction-activity-log__action-link"
-          onClick={() => onCancel(id)}
+          onClick={onCancel}
         >
           { t('speedUpCancellation') }
         </div>
@@ -107,8 +105,8 @@ export default class TransactionActivityLog extends PureComponent {
           >
             { activityText }
           </div>
-          { this.renderInlineRetry(index, activity) }
+          { this.renderInlineRetry(index) }
-          { this.renderInlineCancel(index, activity) }
+          { this.renderInlineCancel(index) }
         </div>
       </div>
     )

ui/app/components/app/transaction-list-item-details/transaction-list-item-details.component.js

@@ -145,8 +145,6 @@ export default class TransactionListItemDetails extends PureComponent {
       transactionGroup,
       showSpeedUp,
       showRetry,
-      onCancel,
-      onRetry,
       recipientEns,
       recipientAddress,
       rpcPrefs: { blockExplorerUrl } = {},
@@ -253,8 +251,8 @@ export default class TransactionListItemDetails extends PureComponent {
               <TransactionActivityLog
                 transactionGroup={transactionGroup}
                 className="transaction-list-item-details__transaction-activity-log"
-                onCancel={onCancel}
+                onCancel={this.handleCancel}
-                onRetry={onRetry}
+                onRetry={this.handleRetry}
                 isEarliestNonce={isEarliestNonce}
               />
             </div>