Display network status for finished Signer requests (#2983)

* Display confirmation for finished requests

* Update box padding

js/src/ui/TxHash/txHash.css

@@ -23,6 +23,7 @@
 
 .hash {
   padding-top: 1em;
+  word-break: break-all;
 }
 
 .confirm {
@@ -31,11 +32,13 @@
 }
 
 .progressbar {
-  margin: 0.5em !important;
+  margin: 0.5em 0 !important;
   width: 30% !important;
+  min-width: 220px;
   display: inline-block !important;
   height: 0.75em !important;
 }
 
 .progressinfo {
+  text-align: center;
 }

js/src/ui/TxHash/txHash.js

@@ -30,7 +30,8 @@ class TxHash extends Component {
 
   static propTypes = {
     hash: PropTypes.string.isRequired,
-    isTest: PropTypes.bool
+    isTest: PropTypes.bool,
+    summary: PropTypes.bool
   }
 
   state = {
@@ -55,13 +56,20 @@ class TxHash extends Component {
   }
 
   render () {
-    const { hash, isTest } = this.props;
+    const { hash, isTest, summary } = this.props;
+    let header = null;
 
-    return (
-      <div className={ styles.details }>
+    if (!summary) {
+      header = (
         <div className={ styles.header }>
           The transaction has been posted to the network with a transaction hash of
         </div>
+      );
+    }
+
+    return (
+      <div className={ styles.details }>
+        { header }
         <div className={ styles.hash }>
           <a href={ txLink(hash, isTest) } target='_blank'>{ hash }</a>
         </div>