From 9de4db766acdbe7b5ae1ed7a0dbfa00f3193afbf Mon Sep 17 00:00:00 2001
From: Jonathan Zernik <yzernik@gmail.com>
Date: Sat, 3 Oct 2020 20:21:35 -0700
Subject: [PATCH] Improve transctions display in wallet transactions tab (#275)

---
 .../src/pages/wallet/Wallet.js                | 52 +++++++++++++------
 1 file changed, 37 insertions(+), 15 deletions(-)

diff --git a/frontend/squeak-node-frontend/src/pages/wallet/Wallet.js b/frontend/squeak-node-frontend/src/pages/wallet/Wallet.js
index 0f2ac8e8..b8b6a3d5 100644
--- a/frontend/squeak-node-frontend/src/pages/wallet/Wallet.js
+++ b/frontend/squeak-node-frontend/src/pages/wallet/Wallet.js
@@ -181,21 +181,9 @@ export default function WalletPage() {
   function TransactionsContent() {
     return (
       <>
-        <div>
-        {transactions.map(transaction =>
-          <Box
-            p={1}
-            key={transaction.getTxHash()}
-            >
-          <TransactionItem
-            key={transaction.getTxHash()}
-            // handleTransactionClick={() => goToSqueakPage(transaction.getSqueakHash())}
-            handleTransactionClick={() => console.log("clicked transaction")}
-            transaction={transaction}>
-          </TransactionItem>
-          </Box>
-        )}
-        </div>
+        <Grid container spacing={4}>
+          {TransactionsGridItem()}
+        </Grid>
       </>
     )
   }
@@ -315,6 +303,40 @@ export default function WalletPage() {
     )
   }
 
+  function TransactionsGridItem() {
+    return (
+      <Grid item xs={12}>
+      <Widget disableWidgetMenu>
+      <Grid
+        container
+        direction="row"
+        justify="flex-start"
+        alignItems="center"
+      >
+        <Grid item xs={12}>
+        <div>
+        {transactions.map(transaction =>
+          <Box
+            p={1}
+            key={transaction.getTxHash()}
+            >
+          <TransactionItem
+            key={transaction.getTxHash()}
+            // handleTransactionClick={() => goToSqueakPage(transaction.getSqueakHash())}
+            handleTransactionClick={() => console.log("clicked transaction")}
+            transaction={transaction}>
+          </TransactionItem>
+          </Box>
+        )}
+        </div>
+        </Grid>
+      </Grid>
+      </Widget>
+      </Grid>
+
+    )
+  }
+
   function ChannelsGridItem() {
     return (
         <Grid item lg={3} md={4} sm={6} xs={12}>