From f823b570f3cc899649c820eecf62e0507226ebcb Mon Sep 17 00:00:00 2001
From: Sonata Green <sonatagreen@yahoo.com>
Date: Sat, 20 Aug 2016 14:52:03 -0500
Subject: [PATCH 1/5] Bare-bones transaction history.

---
 js/page/wallet.js | 37 ++++++++++++++++++++++++++++++++++++-
 1 file changed, 36 insertions(+), 1 deletion(-)

diff --git a/js/page/wallet.js b/js/page/wallet.js
index acfd5e67b..7821d5c1c 100644
--- a/js/page/wallet.js
+++ b/js/page/wallet.js
@@ -117,13 +117,44 @@ var WalletPage = React.createClass({
   getInitialState: function() {
     return {
       balance: "Checking balance...",
+      txlog: "Loading transactions...",
     }
   },
   componentWillMount: function() {
     lbry.getBalance((results) => {
       this.setState({
         balance: results,
-      });
+      })
+    });
+    lbry.call('get_transaction_history', {}, (results) => {
+      var out = 'Transaction history loaded.'
+      if (results.length == 0) {
+        out = 'No transactions yet.';
+      } else {
+        var rows = [];
+        rows.push(<tr className="transaction_history">
+                    <th className="transaction_history">Amount</th>
+                    <th className="transaction_history">Time</th>
+                    <th className="transaction_history">Date</th>
+                    <th className="transaction_history">Transaction</th>
+                  </tr>);
+        results.forEach(function(tx) {
+          rows.push(<tr className="transaction_history">
+                      <td className="transaction_history">{ (tx["amount"]>0 ? '+' : '' ) + tx["amount"] }</td>
+                      <td className="transaction_history">{ (new Date(tx["time"])).toLocaleTimeString() }</td>
+                      <td className="transaction_history">{ (new Date(tx["time"])).toLocaleDateString() }</td>
+                      <td className="transaction_history">
+                        <a className="transaction_explorer_link" href={"https://explorer.lbry.io/tx/"+tx["txid"]}>
+                          { tx["txid"] }
+                        </a>
+                      </td>
+                    </tr>)
+        });
+        out = <table className="transaction_history">{rows}</table>
+      }
+      this.setState({
+        txlog: out,
+      })
     });
   },
   render: function() {
@@ -139,6 +170,10 @@ var WalletPage = React.createClass({
           <h3>Claim Invite Code</h3>
           <Link href="?claim" label="Claim a LBRY beta invite code" button="alt" />
         </section>
+        <section className="card">
+          <h3>Transaction History</h3>
+          {this.state.txlog}
+        </section>
       </main>
     );
   }

From 0efe31e44485a0c881a4619028103aa9aa49ccb5 Mon Sep 17 00:00:00 2001
From: Sonata Green <sonatagreen@yahoo.com>
Date: Sat, 20 Aug 2016 15:38:01 -0500
Subject: [PATCH 2/5] fix date/time display

---
 js/page/wallet.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/js/page/wallet.js b/js/page/wallet.js
index 7821d5c1c..749dffaae 100644
--- a/js/page/wallet.js
+++ b/js/page/wallet.js
@@ -141,8 +141,8 @@ var WalletPage = React.createClass({
         results.forEach(function(tx) {
           rows.push(<tr className="transaction_history">
                       <td className="transaction_history">{ (tx["amount"]>0 ? '+' : '' ) + tx["amount"] }</td>
-                      <td className="transaction_history">{ (new Date(tx["time"])).toLocaleTimeString() }</td>
-                      <td className="transaction_history">{ (new Date(tx["time"])).toLocaleDateString() }</td>
+                      <td className="transaction_history">{ (new Date(parseInt(tx["time"])*1000)).toLocaleTimeString() }</td>
+                      <td className="transaction_history">{ (new Date(parseInt(tx["time"])*1000)).toLocaleDateString() }</td>
                       <td className="transaction_history">
                         <a className="transaction_explorer_link" href={"https://explorer.lbry.io/tx/"+tx["txid"]}>
                           { tx["txid"] }

From 6b97cc7f6af11e3e1ca50da1aa9bd5d48471ef7b Mon Sep 17 00:00:00 2001
From: Sonata Green <sonatagreen@yahoo.com>
Date: Sat, 20 Aug 2016 15:38:27 -0500
Subject: [PATCH 3/5] prettify transaction log a bit

---
 scss/_gui.scss | 11 ++++++++++-
 1 file changed, 10 insertions(+), 1 deletion(-)

diff --git a/scss/_gui.scss b/scss/_gui.scss
index 7f042b433..fc207d46e 100644
--- a/scss/_gui.scss
+++ b/scss/_gui.scss
@@ -211,4 +211,13 @@ input[type="text"], input[type="search"], textarea
   {
     margin-top: $spacing-vertical;
   }
-}
\ No newline at end of file
+}
+
+td.transaction_history, tr.transaction_history {
+    padding: 4px;
+}
+a.transaction_explorer_link {
+    color: $color-primary;
+    text-decoration: underline;
+    font-family: monospace;
+}

From 0b5ec7be77f166c9ef9ada62f01c4a06faca62d0 Mon Sep 17 00:00:00 2001
From: Sonata Green <sonatagreen@yahoo.com>
Date: Sat, 20 Aug 2016 16:52:31 -0500
Subject: [PATCH 4/5] fix double transactions

---
 js/page/wallet.js | 34 +++++++++++++++++++++++-----------
 1 file changed, 23 insertions(+), 11 deletions(-)

diff --git a/js/page/wallet.js b/js/page/wallet.js
index 749dffaae..32709640e 100644
--- a/js/page/wallet.js
+++ b/js/page/wallet.js
@@ -131,6 +131,7 @@ var WalletPage = React.createClass({
       if (results.length == 0) {
         out = 'No transactions yet.';
       } else {
+        var condensedTransactions = {};
         var rows = [];
         rows.push(<tr className="transaction_history">
                     <th className="transaction_history">Amount</th>
@@ -139,18 +140,29 @@ var WalletPage = React.createClass({
                     <th className="transaction_history">Transaction</th>
                   </tr>);
         results.forEach(function(tx) {
-          rows.push(<tr className="transaction_history">
-                      <td className="transaction_history">{ (tx["amount"]>0 ? '+' : '' ) + tx["amount"] }</td>
-                      <td className="transaction_history">{ (new Date(parseInt(tx["time"])*1000)).toLocaleTimeString() }</td>
-                      <td className="transaction_history">{ (new Date(parseInt(tx["time"])*1000)).toLocaleDateString() }</td>
-                      <td className="transaction_history">
-                        <a className="transaction_explorer_link" href={"https://explorer.lbry.io/tx/"+tx["txid"]}>
-                          { tx["txid"] }
-                        </a>
-                      </td>
-                    </tr>)
+          var txid = tx["txid"];
+          if (!(txid in condensedTransactions)) {
+            condensedTransactions[txid] = 0;
+          }
+          condensedTransactions[txid] += parseFloat(tx["amount"]);
         });
-        out = <table className="transaction_history">{rows}</table>
+        results.forEach(function(tx) {
+          var txid = tx["txid"];
+          var txval = condensedTransactions[txid];
+          var txdate = new Date(parseInt(tx["time"])*1000);
+          if (txid in condensedTransactions && txval != 0) {
+            rows.push(<tr key={txid} className="transaction_history">
+                        <td className="transaction_history">{ (txval>0 ? '+' : '' ) + txval }</td>
+                        <td className="transaction_history">{ txdate.toLocaleTimeString() }</td>
+                        <td className="transaction_history">{ txdate.toLocaleDateString() }</td>
+                        <td className="transaction_history">
+                          <a className="transaction_explorer_link" href={"https://explorer.lbry.io/tx/"+txid}>{txid}</a>
+                        </td>
+                      </tr>);
+            delete condensedTransactions[tx["txid"]];
+          }
+        });
+        out = <table className="transaction_history"><tbody>{rows}</tbody></table>
       }
       this.setState({
         txlog: out,

From a255d7aefa376de884db76e3eb7b0d0da953ba3e Mon Sep 17 00:00:00 2001
From: Sonata Green <sonatagreen@yahoo.com>
Date: Sun, 21 Aug 2016 12:54:37 -0500
Subject: [PATCH 5/5] use .table-standard for transaction history

---
 js/page/wallet.js | 24 ++++++++++++------------
 scss/_gui.scss    |  9 ---------
 2 files changed, 12 insertions(+), 21 deletions(-)

diff --git a/js/page/wallet.js b/js/page/wallet.js
index 32709640e..7156967ff 100644
--- a/js/page/wallet.js
+++ b/js/page/wallet.js
@@ -133,11 +133,11 @@ var WalletPage = React.createClass({
       } else {
         var condensedTransactions = {};
         var rows = [];
-        rows.push(<tr className="transaction_history">
-                    <th className="transaction_history">Amount</th>
-                    <th className="transaction_history">Time</th>
-                    <th className="transaction_history">Date</th>
-                    <th className="transaction_history">Transaction</th>
+        rows.push(<tr>
+                    <th>Amount</th>
+                    <th>Time</th>
+                    <th>Date</th>
+                    <th>Transaction</th>
                   </tr>);
         results.forEach(function(tx) {
           var txid = tx["txid"];
@@ -151,18 +151,18 @@ var WalletPage = React.createClass({
           var txval = condensedTransactions[txid];
           var txdate = new Date(parseInt(tx["time"])*1000);
           if (txid in condensedTransactions && txval != 0) {
-            rows.push(<tr key={txid} className="transaction_history">
-                        <td className="transaction_history">{ (txval>0 ? '+' : '' ) + txval }</td>
-                        <td className="transaction_history">{ txdate.toLocaleTimeString() }</td>
-                        <td className="transaction_history">{ txdate.toLocaleDateString() }</td>
-                        <td className="transaction_history">
+            rows.push(<tr key={txid}>
+                        <td>{ (txval>0 ? '+' : '' ) + txval }</td>
+                        <td>{ txdate.toLocaleTimeString() }</td>
+                        <td>{ txdate.toLocaleDateString() }</td>
+                        <td>
                           <a className="transaction_explorer_link" href={"https://explorer.lbry.io/tx/"+txid}>{txid}</a>
                         </td>
                       </tr>);
             delete condensedTransactions[tx["txid"]];
           }
         });
-        out = <table className="transaction_history"><tbody>{rows}</tbody></table>
+        out = <table className="table-standard"><tbody>{rows}</tbody></table>
       }
       this.setState({
         txlog: out,
@@ -182,7 +182,7 @@ var WalletPage = React.createClass({
           <h3>Claim Invite Code</h3>
           <Link href="?claim" label="Claim a LBRY beta invite code" button="alt" />
         </section>
-        <section className="card">
+        <section className="card" style={{'overflowX': 'auto'}}>
           <h3>Transaction History</h3>
           {this.state.txlog}
         </section>
diff --git a/scss/_gui.scss b/scss/_gui.scss
index fc207d46e..5b7df0e5b 100644
--- a/scss/_gui.scss
+++ b/scss/_gui.scss
@@ -212,12 +212,3 @@ input[type="text"], input[type="search"], textarea
     margin-top: $spacing-vertical;
   }
 }
-
-td.transaction_history, tr.transaction_history {
-    padding: 4px;
-}
-a.transaction_explorer_link {
-    color: $color-primary;
-    text-decoration: underline;
-    font-family: monospace;
-}