From 539013919b1433dbf90d7933c8776e2b560302d4 Mon Sep 17 00:00:00 2001
From: Craig Raw <craigraw@gmail.com>
Date: Fri, 10 Jul 2020 12:48:36 +0200
Subject: [PATCH] balance chart, transactions view refactor, tx viewer coin
 labels updating

---
 .../sparrow/control/BalanceChart.java         | 84 +++++++++++++++++++
 .../sparrow/control/CoinLabel.java            | 14 +++-
 .../sparrow/control/DateAxisFormatter.java    | 44 ++++++++++
 .../control/TransactionsTreeTable.java        |  4 +-
 .../sparrow/control/UtxosTreeTable.java       |  4 +-
 .../transaction/HeadersController.java        |  8 +-
 .../sparrow/transaction/InputController.java  | 10 ++-
 .../sparrow/transaction/InputsController.java |  6 ++
 .../sparrow/transaction/OutputController.java |  6 ++
 .../transaction/OutputsController.java        | 10 ++-
 .../wallet/TransactionsController.java        | 51 ++++++++++-
 .../sparrow/wallet/UtxosController.java       | 12 ++-
 .../wallet/WalletTransactionsEntry.java       | 42 +++++++++-
 .../sparrow/wallet/transactions.css           | 20 +++++
 .../sparrow/wallet/transactions.fxml          | 50 +++++++++--
 15 files changed, 337 insertions(+), 28 deletions(-)
 create mode 100644 src/main/java/com/sparrowwallet/sparrow/control/BalanceChart.java
 create mode 100644 src/main/java/com/sparrowwallet/sparrow/control/DateAxisFormatter.java

diff --git a/src/main/java/com/sparrowwallet/sparrow/control/BalanceChart.java b/src/main/java/com/sparrowwallet/sparrow/control/BalanceChart.java
new file mode 100644
index 00000000..9ac36b1d
--- /dev/null
+++ b/src/main/java/com/sparrowwallet/sparrow/control/BalanceChart.java
@@ -0,0 +1,84 @@
+package com.sparrowwallet.sparrow.control;
+
+import com.sparrowwallet.drongo.BitcoinUnit;
+import com.sparrowwallet.drongo.wallet.Wallet;
+import com.sparrowwallet.sparrow.io.Config;
+import com.sparrowwallet.sparrow.wallet.TransactionEntry;
+import com.sparrowwallet.sparrow.wallet.WalletTransactionsEntry;
+import javafx.beans.NamedArg;
+import javafx.scene.Node;
+import javafx.scene.chart.*;
+
+import java.util.List;
+import java.util.Set;
+import java.util.stream.Collectors;
+
+public class BalanceChart extends LineChart<Number, Number> {
+    private XYChart.Series<Number, Number> balanceSeries;
+
+    private TransactionEntry selectedEntry;
+
+    public BalanceChart(@NamedArg("xAxis") Axis<Number> xAxis, @NamedArg("yAxis") Axis<Number> yAxis) {
+        super(xAxis, yAxis);
+    }
+
+    public void initialize(WalletTransactionsEntry walletTransactionsEntry) {
+        balanceSeries = new XYChart.Series<>();
+        getData().add(balanceSeries);
+        update(walletTransactionsEntry);
+
+        BitcoinUnit unit = Config.get().getBitcoinUnit();
+        setBitcoinUnit(walletTransactionsEntry.getWallet(), unit);
+    }
+
+    public void update(WalletTransactionsEntry walletTransactionsEntry) {
+        balanceSeries.getData().clear();
+
+        List<Data<Number, Number>> balanceDataList = walletTransactionsEntry.getChildren().stream()
+                .map(entry -> (TransactionEntry)entry)
+                .map(txEntry -> new XYChart.Data<>((Number)txEntry.getBlockTransaction().getDate().getTime(), (Number)txEntry.getBalance(), txEntry))
+                .collect(Collectors.toList());
+
+        if(!balanceDataList.isEmpty()) {
+            long min = balanceDataList.stream().map(data -> data.getXValue().longValue()).min(Long::compare).get();
+            long max = balanceDataList.stream().map(data -> data.getXValue().longValue()).max(Long::compare).get();
+
+            DateAxisFormatter dateAxisFormatter = new DateAxisFormatter(max - min);
+            NumberAxis xAxis = (NumberAxis)getXAxis();
+            xAxis.setTickLabelFormatter(dateAxisFormatter);
+        }
+
+        balanceSeries.getData().addAll(balanceDataList);
+
+        if(selectedEntry != null) {
+            select(selectedEntry);
+        }
+    }
+
+    public void select(TransactionEntry transactionEntry) {
+        Set<Node> selectedSymbols = lookupAll(".chart-line-symbol.selected");
+        for(Node selectedSymbol : selectedSymbols) {
+            selectedSymbol.getStyleClass().remove("selected");
+        }
+
+        for(int i = 0; i < balanceSeries.getData().size(); i++) {
+            XYChart.Data<Number, Number> data = balanceSeries.getData().get(i);
+            Node symbol = lookup(".chart-line-symbol.data" + i);
+            if(symbol != null) {
+                if(data.getXValue().equals(transactionEntry.getBlockTransaction().getDate().getTime())) {
+                    symbol.getStyleClass().add("selected");
+                    selectedEntry = transactionEntry;
+                }
+            }
+        }
+    }
+
+    public void setBitcoinUnit(Wallet wallet, BitcoinUnit unit) {
+        if(unit == null || unit.equals(BitcoinUnit.AUTO)) {
+            unit = wallet.getAutoUnit();
+        }
+
+        NumberAxis yaxis = (NumberAxis)getYAxis();
+        yaxis.setTickLabelFormatter(new CoinAxisFormatter(yaxis, unit));
+    }
+}
diff --git a/src/main/java/com/sparrowwallet/sparrow/control/CoinLabel.java b/src/main/java/com/sparrowwallet/sparrow/control/CoinLabel.java
index 304105ed..253db794 100644
--- a/src/main/java/com/sparrowwallet/sparrow/control/CoinLabel.java
+++ b/src/main/java/com/sparrowwallet/sparrow/control/CoinLabel.java
@@ -29,7 +29,7 @@ public class CoinLabel extends CopyableLabel {
     public CoinLabel(String text) {
         super(text);
         BTC_FORMAT.setMaximumFractionDigits(8);
-        valueProperty().addListener((observable, oldValue, newValue) -> setValueAsText((Long)newValue));
+        valueProperty().addListener((observable, oldValue, newValue) -> setValueAsText((Long)newValue, Config.get().getBitcoinUnit()));
         tooltip = new Tooltip();
         contextMenu = new CoinContextMenu();
     }
@@ -46,14 +46,22 @@ public class CoinLabel extends CopyableLabel {
         this.value.set(value);
     }
 
-    private void setValueAsText(Long value) {
+    public void refresh() {
+        refresh(Config.get().getBitcoinUnit());
+    }
+
+    public void refresh(BitcoinUnit bitcoinUnit) {
+        setValueAsText(getValue(), bitcoinUnit);
+    }
+
+    private void setValueAsText(Long value, BitcoinUnit bitcoinUnit) {
         setTooltip(tooltip);
         setContextMenu(contextMenu);
 
         String satsValue = String.format(Locale.ENGLISH, "%,d",value) + " sats";
         String btcValue = BTC_FORMAT.format(value.doubleValue() / Transaction.SATOSHIS_PER_BITCOIN) + " BTC";
 
-        BitcoinUnit unit = Config.get().getBitcoinUnit();
+        BitcoinUnit unit = bitcoinUnit;
         if(unit == null || unit.equals(BitcoinUnit.AUTO)) {
             unit = (value >= BitcoinUnit.getAutoThreshold() ? BitcoinUnit.BTC : BitcoinUnit.SATOSHIS);
         }
diff --git a/src/main/java/com/sparrowwallet/sparrow/control/DateAxisFormatter.java b/src/main/java/com/sparrowwallet/sparrow/control/DateAxisFormatter.java
new file mode 100644
index 00000000..438c6ab7
--- /dev/null
+++ b/src/main/java/com/sparrowwallet/sparrow/control/DateAxisFormatter.java
@@ -0,0 +1,44 @@
+package com.sparrowwallet.sparrow.control;
+
+import javafx.util.StringConverter;
+
+import java.text.DateFormat;
+import java.text.DecimalFormat;
+import java.text.ParseException;
+import java.text.SimpleDateFormat;
+import java.util.Date;
+
+public class DateAxisFormatter extends StringConverter<Number> {
+    private static final DateFormat HOUR_FORMAT = new SimpleDateFormat("HH:mm");
+    private static final DateFormat DAY_FORMAT = new SimpleDateFormat("d MMM");
+    private static final DateFormat MONTH_FORMAT = new SimpleDateFormat("MMM yy");
+
+    private final DateFormat dateFormat;
+    private int oddCounter;
+
+    public DateAxisFormatter(long duration) {
+        if(duration < (24 * 60 * 60 * 1000L)) {
+            dateFormat = HOUR_FORMAT;
+        } else if(duration < (365 * 24 * 60 * 60 * 1000L)) {
+            dateFormat = DAY_FORMAT;
+        } else {
+            dateFormat = MONTH_FORMAT;
+        }
+    }
+
+    @Override
+    public String toString(Number object) {
+        oddCounter++;
+        return oddCounter % 3 == 0 ? dateFormat.format(new Date(object.longValue())) : "";
+    }
+
+    @Override
+    public Number fromString(String string) {
+        try {
+            Date date = dateFormat.parse(string);
+            return date.getTime();
+        } catch (ParseException e) {
+            throw new RuntimeException(e);
+        }
+    }
+}
diff --git a/src/main/java/com/sparrowwallet/sparrow/control/TransactionsTreeTable.java b/src/main/java/com/sparrowwallet/sparrow/control/TransactionsTreeTable.java
index 81b6f693..e5ac147b 100644
--- a/src/main/java/com/sparrowwallet/sparrow/control/TransactionsTreeTable.java
+++ b/src/main/java/com/sparrowwallet/sparrow/control/TransactionsTreeTable.java
@@ -73,9 +73,7 @@ public class TransactionsTreeTable extends CoinTreeTable {
     }
 
     public void updateHistory(List<WalletNode> updatedNodes) {
-        //Recalculate from scratch and update accordingly - any changes may affect the balance of other transactions
-        WalletTransactionsEntry rootEntry = (WalletTransactionsEntry)getRoot().getValue();
-        rootEntry.updateTransactions();
+        //Transaction entries should have already been updated using WalletTransactionsEntry.updateHistory, so only a resort required
         sort();
     }
 
diff --git a/src/main/java/com/sparrowwallet/sparrow/control/UtxosTreeTable.java b/src/main/java/com/sparrowwallet/sparrow/control/UtxosTreeTable.java
index 375ef5ca..82d3e6f6 100644
--- a/src/main/java/com/sparrowwallet/sparrow/control/UtxosTreeTable.java
+++ b/src/main/java/com/sparrowwallet/sparrow/control/UtxosTreeTable.java
@@ -93,9 +93,7 @@ public class UtxosTreeTable extends CoinTreeTable {
     }
 
     public void updateHistory(List<WalletNode> updatedNodes) {
-        //Recalculate from scratch and update accordingly
-        WalletUtxosEntry rootEntry = (WalletUtxosEntry)getRoot().getValue();
-        rootEntry.updateUtxos();
+        //Utxo entries should have already been updated, so only a resort required
         sort();
     }
 
diff --git a/src/main/java/com/sparrowwallet/sparrow/transaction/HeadersController.java b/src/main/java/com/sparrowwallet/sparrow/transaction/HeadersController.java
index fc026772..16e7d1ca 100644
--- a/src/main/java/com/sparrowwallet/sparrow/transaction/HeadersController.java
+++ b/src/main/java/com/sparrowwallet/sparrow/transaction/HeadersController.java
@@ -10,6 +10,7 @@ import com.sparrowwallet.sparrow.EventManager;
 import com.sparrowwallet.sparrow.control.CoinLabel;
 import com.sparrowwallet.sparrow.control.IdLabel;
 import com.sparrowwallet.sparrow.control.CopyableLabel;
+import com.sparrowwallet.sparrow.event.BitcoinUnitChangedEvent;
 import com.sparrowwallet.sparrow.event.BlockTransactionFetchedEvent;
 import com.sparrowwallet.sparrow.event.TransactionChangedEvent;
 import com.sparrowwallet.sparrow.event.TransactionLocktimeChangedEvent;
@@ -356,4 +357,9 @@ public class HeadersController extends TransactionFormController implements Init
             }
         }
     }
-}
+
+    @Subscribe
+    public void bitcoinUnitChanged(BitcoinUnitChangedEvent event) {
+        fee.refresh(event.getBitcoinUnit());
+    }
+}
\ No newline at end of file
diff --git a/src/main/java/com/sparrowwallet/sparrow/transaction/InputController.java b/src/main/java/com/sparrowwallet/sparrow/transaction/InputController.java
index 35e8895d..76a7fb10 100644
--- a/src/main/java/com/sparrowwallet/sparrow/transaction/InputController.java
+++ b/src/main/java/com/sparrowwallet/sparrow/transaction/InputController.java
@@ -9,10 +9,7 @@ import com.sparrowwallet.drongo.psbt.PSBTInput;
 import com.sparrowwallet.drongo.wallet.BlockTransaction;
 import com.sparrowwallet.sparrow.EventManager;
 import com.sparrowwallet.sparrow.control.*;
-import com.sparrowwallet.sparrow.event.BlockTransactionFetchedEvent;
-import com.sparrowwallet.sparrow.event.TransactionChangedEvent;
-import com.sparrowwallet.sparrow.event.TransactionLocktimeChangedEvent;
-import com.sparrowwallet.sparrow.event.ViewTransactionEvent;
+import com.sparrowwallet.sparrow.event.*;
 import javafx.fxml.FXML;
 import javafx.fxml.Initializable;
 import javafx.geometry.Pos;
@@ -498,4 +495,9 @@ public class InputController extends TransactionFormController implements Initia
             locktimeAbsolute.setText(Long.toString(event.getTransaction().getLocktime()));
         }
     }
+
+    @Subscribe
+    public void bitcoinUnitChanged(BitcoinUnitChangedEvent event) {
+        spends.refresh(event.getBitcoinUnit());
+    }
 }
diff --git a/src/main/java/com/sparrowwallet/sparrow/transaction/InputsController.java b/src/main/java/com/sparrowwallet/sparrow/transaction/InputsController.java
index 046bcf93..61d803ab 100644
--- a/src/main/java/com/sparrowwallet/sparrow/transaction/InputsController.java
+++ b/src/main/java/com/sparrowwallet/sparrow/transaction/InputsController.java
@@ -7,6 +7,7 @@ import com.sparrowwallet.drongo.wallet.BlockTransaction;
 import com.sparrowwallet.sparrow.EventManager;
 import com.sparrowwallet.sparrow.control.CoinLabel;
 import com.sparrowwallet.sparrow.control.CopyableLabel;
+import com.sparrowwallet.sparrow.event.BitcoinUnitChangedEvent;
 import com.sparrowwallet.sparrow.event.BlockTransactionFetchedEvent;
 import javafx.fxml.FXML;
 import javafx.fxml.Initializable;
@@ -160,4 +161,9 @@ public class InputsController extends TransactionFormController implements Initi
             updateBlockTransactionInputs(event.getInputTransactions());
         }
     }
+
+    @Subscribe
+    public void bitcoinUnitChanged(BitcoinUnitChangedEvent event) {
+        total.refresh(event.getBitcoinUnit());
+    }
 }
diff --git a/src/main/java/com/sparrowwallet/sparrow/transaction/OutputController.java b/src/main/java/com/sparrowwallet/sparrow/transaction/OutputController.java
index 8b64ff9f..7e0d7466 100644
--- a/src/main/java/com/sparrowwallet/sparrow/transaction/OutputController.java
+++ b/src/main/java/com/sparrowwallet/sparrow/transaction/OutputController.java
@@ -10,6 +10,7 @@ import com.sparrowwallet.sparrow.EventManager;
 import com.sparrowwallet.sparrow.control.AddressLabel;
 import com.sparrowwallet.sparrow.control.CoinLabel;
 import com.sparrowwallet.sparrow.control.CopyableLabel;
+import com.sparrowwallet.sparrow.event.BitcoinUnitChangedEvent;
 import com.sparrowwallet.sparrow.event.BlockTransactionOutputsFetchedEvent;
 import com.sparrowwallet.sparrow.event.ViewTransactionEvent;
 import com.sparrowwallet.sparrow.io.ElectrumServer;
@@ -142,4 +143,9 @@ public class OutputController extends TransactionFormController implements Initi
             updateSpent(event.getOutputTransactions());
         }
     }
+
+    @Subscribe
+    public void bitcoinUnitChanged(BitcoinUnitChangedEvent event) {
+        value.refresh(event.getBitcoinUnit());
+    }
 }
diff --git a/src/main/java/com/sparrowwallet/sparrow/transaction/OutputsController.java b/src/main/java/com/sparrowwallet/sparrow/transaction/OutputsController.java
index 155d0274..ef54bd22 100644
--- a/src/main/java/com/sparrowwallet/sparrow/transaction/OutputsController.java
+++ b/src/main/java/com/sparrowwallet/sparrow/transaction/OutputsController.java
@@ -1,9 +1,12 @@
 package com.sparrowwallet.sparrow.transaction;
 
+import com.google.common.eventbus.Subscribe;
 import com.sparrowwallet.drongo.protocol.Transaction;
 import com.sparrowwallet.drongo.protocol.TransactionOutput;
+import com.sparrowwallet.sparrow.EventManager;
 import com.sparrowwallet.sparrow.control.CoinLabel;
 import com.sparrowwallet.sparrow.control.CopyableLabel;
+import com.sparrowwallet.sparrow.event.BitcoinUnitChangedEvent;
 import javafx.fxml.FXML;
 import javafx.fxml.Initializable;
 import javafx.scene.chart.PieChart;
@@ -25,7 +28,7 @@ public class OutputsController extends TransactionFormController implements Init
 
     @Override
     public void initialize(URL location, ResourceBundle resources) {
-
+        EventManager.get().register(this);
     }
 
     public void setModel(OutputsForm form) {
@@ -47,4 +50,9 @@ public class OutputsController extends TransactionFormController implements Init
             addPieData(outputsPie, tx.getOutputs());
         }
     }
+
+    @Subscribe
+    public void bitcoinUnitChanged(BitcoinUnitChangedEvent event) {
+        total.refresh(event.getBitcoinUnit());
+    }
 }
diff --git a/src/main/java/com/sparrowwallet/sparrow/wallet/TransactionsController.java b/src/main/java/com/sparrowwallet/sparrow/wallet/TransactionsController.java
index f0959d22..ac00fb2b 100644
--- a/src/main/java/com/sparrowwallet/sparrow/wallet/TransactionsController.java
+++ b/src/main/java/com/sparrowwallet/sparrow/wallet/TransactionsController.java
@@ -2,10 +2,15 @@ package com.sparrowwallet.sparrow.wallet;
 
 import com.google.common.eventbus.Subscribe;
 import com.sparrowwallet.sparrow.EventManager;
+import com.sparrowwallet.sparrow.control.BalanceChart;
+import com.sparrowwallet.sparrow.control.CoinLabel;
+import com.sparrowwallet.sparrow.control.CopyableLabel;
 import com.sparrowwallet.sparrow.control.TransactionsTreeTable;
 import com.sparrowwallet.sparrow.event.*;
+import javafx.collections.ListChangeListener;
 import javafx.fxml.FXML;
 import javafx.fxml.Initializable;
+import javafx.scene.control.TreeItem;
 import javafx.scene.input.MouseEvent;
 
 import java.net.URL;
@@ -13,9 +18,21 @@ import java.util.ResourceBundle;
 
 public class TransactionsController extends WalletFormController implements Initializable {
 
+    @FXML
+    private CoinLabel balance;
+
+    @FXML
+    private CopyableLabel fiatBalance;
+
+    @FXML
+    private CoinLabel mempoolBalance;
+
     @FXML
     private TransactionsTreeTable transactionsTable;
 
+    @FXML
+    private BalanceChart balanceChart;
+
     @Override
     public void initialize(URL location, ResourceBundle resources) {
         EventManager.get().register(this);
@@ -23,20 +40,46 @@ public class TransactionsController extends WalletFormController implements Init
 
     @Override
     public void initializeView() {
-        transactionsTable.initialize(getWalletForm().getWalletTransactionsEntry());
+        WalletTransactionsEntry walletTransactionsEntry = getWalletForm().getWalletTransactionsEntry();
+
+        transactionsTable.initialize(walletTransactionsEntry);
+
+        balance.setValue(walletTransactionsEntry.getBalance());
+        mempoolBalance.setValue(walletTransactionsEntry.getMempoolBalance());
+        balanceChart.initialize(walletTransactionsEntry);
+
+        transactionsTable.getSelectionModel().getSelectedIndices().addListener((ListChangeListener<Integer>) c -> {
+            TreeItem<Entry> selectedItem = transactionsTable.getSelectionModel().getSelectedItem();
+            if(selectedItem != null && selectedItem.getValue() instanceof TransactionEntry) {
+                balanceChart.select((TransactionEntry)selectedItem.getValue());
+            }
+        });
     }
 
     @Subscribe
     public void walletNodesChanged(WalletNodesChangedEvent event) {
         if(event.getWallet().equals(walletForm.getWallet())) {
-            transactionsTable.updateAll(getWalletForm().getWalletTransactionsEntry());
+            WalletTransactionsEntry walletTransactionsEntry = getWalletForm().getWalletTransactionsEntry();
+
+            transactionsTable.updateAll(walletTransactionsEntry);
+            balance.setValue(walletTransactionsEntry.getBalance());
+            mempoolBalance.setValue(walletTransactionsEntry.getMempoolBalance());
+            balanceChart.update(walletTransactionsEntry);
         }
     }
 
     @Subscribe
     public void walletHistoryChanged(WalletHistoryChangedEvent event) {
         if(event.getWallet().equals(walletForm.getWallet())) {
+            WalletTransactionsEntry walletTransactionsEntry = getWalletForm().getWalletTransactionsEntry();
+
+            //Will automatically update transactionsTable transactions and recalculate balances
+            walletTransactionsEntry.updateTransactions();
+
             transactionsTable.updateHistory(event.getHistoryChangedNodes());
+            balance.setValue(walletTransactionsEntry.getBalance());
+            mempoolBalance.setValue(walletTransactionsEntry.getMempoolBalance());
+            balanceChart.update(walletTransactionsEntry);
         }
     }
 
@@ -44,12 +87,16 @@ public class TransactionsController extends WalletFormController implements Init
     public void walletEntryLabelChanged(WalletEntryLabelChangedEvent event) {
         if(event.getWallet().equals(walletForm.getWallet())) {
             transactionsTable.updateLabel(event.getEntry());
+            balanceChart.update(getWalletForm().getWalletTransactionsEntry());
         }
     }
 
     @Subscribe
     public void bitcoinUnitChanged(BitcoinUnitChangedEvent event) {
         transactionsTable.setBitcoinUnit(getWalletForm().getWallet(), event.getBitcoinUnit());
+        balanceChart.setBitcoinUnit(getWalletForm().getWallet(), event.getBitcoinUnit());
+        balance.refresh(event.getBitcoinUnit());
+        mempoolBalance.refresh(event.getBitcoinUnit());
     }
 
     //TODO: Remove
diff --git a/src/main/java/com/sparrowwallet/sparrow/wallet/UtxosController.java b/src/main/java/com/sparrowwallet/sparrow/wallet/UtxosController.java
index 8f7943ba..dbd4d6ef 100644
--- a/src/main/java/com/sparrowwallet/sparrow/wallet/UtxosController.java
+++ b/src/main/java/com/sparrowwallet/sparrow/wallet/UtxosController.java
@@ -44,16 +44,22 @@ public class UtxosController extends WalletFormController implements Initializab
     @Subscribe
     public void walletNodesChanged(WalletNodesChangedEvent event) {
         if(event.getWallet().equals(walletForm.getWallet())) {
-            utxosTable.updateAll(getWalletForm().getWalletUtxosEntry());
-            utxosChart.update(getWalletForm().getWalletUtxosEntry());
+            WalletUtxosEntry walletUtxosEntry = getWalletForm().getWalletUtxosEntry();
+            utxosTable.updateAll(walletUtxosEntry);
+            utxosChart.update(walletUtxosEntry);
         }
     }
 
     @Subscribe
     public void walletHistoryChanged(WalletHistoryChangedEvent event) {
         if(event.getWallet().equals(walletForm.getWallet())) {
+            WalletUtxosEntry walletUtxosEntry = getWalletForm().getWalletUtxosEntry();
+
+            //Will automatically update utxosTable
+            walletUtxosEntry.updateUtxos();
+
             utxosTable.updateHistory(event.getHistoryChangedNodes());
-            utxosChart.update(getWalletForm().getWalletUtxosEntry());
+            utxosChart.update(walletUtxosEntry);
         }
     }
 
diff --git a/src/main/java/com/sparrowwallet/sparrow/wallet/WalletTransactionsEntry.java b/src/main/java/com/sparrowwallet/sparrow/wallet/WalletTransactionsEntry.java
index 896ac409..e5cb1f42 100644
--- a/src/main/java/com/sparrowwallet/sparrow/wallet/WalletTransactionsEntry.java
+++ b/src/main/java/com/sparrowwallet/sparrow/wallet/WalletTransactionsEntry.java
@@ -31,17 +31,24 @@ public class WalletTransactionsEntry extends Entry {
 
     protected void calculateBalances() {
         long balance = 0L;
+        long mempoolBalance = 0L;
 
         //Note transaction entries must be in ascending order. This sorting is ultimately done according to BlockTransactions' comparator
         getChildren().sort(Comparator.comparing(TransactionEntry.class::cast));
 
         for(Entry entry : getChildren()) {
             TransactionEntry transactionEntry = (TransactionEntry)entry;
-            balance += entry.getValue();
+            if(transactionEntry.getConfirmations() != 0) {
+                balance += entry.getValue();
+            } else {
+                mempoolBalance += entry.getValue();
+            }
+
             transactionEntry.setBalance(balance);
         }
 
         setBalance(balance);
+        setMempoolBalance(mempoolBalance);
     }
 
     public void updateTransactions() {
@@ -126,6 +133,39 @@ public class WalletTransactionsEntry extends Entry {
         return balance;
     }
 
+    /**
+     * Defines the wallet balance in the mempool
+     */
+    private LongProperty mempoolBalance;
+
+    public final void setMempoolBalance(long value) {
+        if(mempoolBalance != null || value != 0) {
+            mempoolBalanceProperty().set(value);
+        }
+    }
+
+    public final long getMempoolBalance() {
+        return mempoolBalance == null ? 0L : mempoolBalance.get();
+    }
+
+    public final LongProperty mempoolBalanceProperty() {
+        if(mempoolBalance == null) {
+            mempoolBalance = new LongPropertyBase(0L) {
+
+                @Override
+                public Object getBean() {
+                    return WalletTransactionsEntry.this;
+                }
+
+                @Override
+                public String getName() {
+                    return "mempoolBalance";
+                }
+            };
+        }
+        return mempoolBalance;
+    }
+
     private static class WalletTransaction {
         private final Wallet wallet;
         private final BlockTransaction blockTransaction;
diff --git a/src/main/resources/com/sparrowwallet/sparrow/wallet/transactions.css b/src/main/resources/com/sparrowwallet/sparrow/wallet/transactions.css
index 1f24160d..9bccb8c8 100644
--- a/src/main/resources/com/sparrowwallet/sparrow/wallet/transactions.css
+++ b/src/main/resources/com/sparrowwallet/sparrow/wallet/transactions.css
@@ -2,4 +2,24 @@
     -fx-font-weight: bold;
     -fx-font-size: 1.2em;
     -fx-padding: 10 0 10 0;
+}
+
+#balanceChart {
+    -fx-padding: 10 0 0 0;
+    -fx-max-width: 350px;
+    -fx-pref-width: 350px;
+    -fx-max-height: 150px;
+}
+
+.default-color0.chart-series-line {
+    -fx-stroke: rgba(105, 108, 119, 0.3);
+    -fx-stroke-width: 1px;
+}
+
+.chart-line-symbol {
+    -fx-background-color: rgba(105, 108, 119, 0.3);
+}
+
+.chart-line-symbol.selected {
+    -fx-background-color: rgba(30, 136, 207, 0.8);
 }
\ No newline at end of file
diff --git a/src/main/resources/com/sparrowwallet/sparrow/wallet/transactions.fxml b/src/main/resources/com/sparrowwallet/sparrow/wallet/transactions.fxml
index a30bf2e0..c212e794 100644
--- a/src/main/resources/com/sparrowwallet/sparrow/wallet/transactions.fxml
+++ b/src/main/resources/com/sparrowwallet/sparrow/wallet/transactions.fxml
@@ -7,15 +7,51 @@
 <?import javafx.scene.layout.*?>
 <?import com.sparrowwallet.sparrow.control.TransactionsTreeTable?>
 <?import javafx.geometry.Insets?>
+<?import com.sparrowwallet.sparrow.control.BalanceChart?>
+<?import javafx.scene.chart.NumberAxis?>
+<?import tornadofx.control.Form?>
+<?import tornadofx.control.Fieldset?>
+<?import tornadofx.control.Field?>
+<?import com.sparrowwallet.sparrow.control.CoinLabel?>
+<?import com.sparrowwallet.sparrow.control.CopyableLabel?>
 
 <BorderPane stylesheets="@transactions.css, @wallet.css, @../general.css" styleClass="wallet-pane" xmlns="http://javafx.com/javafx/10.0.2-internal" xmlns:fx="http://javafx.com/fxml/1" fx:controller="com.sparrowwallet.sparrow.wallet.TransactionsController">
-    <padding>
-        <Insets left="25.0" right="25.0" top="15.0" bottom="25.0" />
-    </padding>
-    <top>
-        <Label styleClass="transactions-treetable-label" text="Transactions" /> <!-- onMouseClicked="#advanceBlock" -->
-    </top>
     <center>
-        <TransactionsTreeTable fx:id="transactionsTable" />
+        <VBox spacing="10">
+            <padding>
+                <Insets left="25.0" right="25.0" top="25.0" bottom="25.0" />
+            </padding>
+            <GridPane styleClass="send-form" hgap="10.0" vgap="10.0">
+                <columnConstraints>
+                    <ColumnConstraints percentWidth="50" />
+                    <ColumnConstraints percentWidth="50" />
+                </columnConstraints>
+                <rowConstraints>
+                    <RowConstraints />
+                </rowConstraints>
+                <Form GridPane.columnIndex="0" GridPane.rowIndex="0">
+                    <Fieldset inputGrow="SOMETIMES" text="Transactions">
+                        <Field text="Balance:">
+                            <CoinLabel fx:id="balance"/>
+                        </Field>
+                        <Field text="Fiat balance:">
+                            <CopyableLabel fx:id="fiatBalance" />
+                        </Field>
+                        <Field text="Mempool:">
+                            <CoinLabel fx:id="mempoolBalance" />
+                        </Field>
+                    </Fieldset>
+                </Form>
+                <BalanceChart fx:id="balanceChart" animated="false" legendVisible="false" verticalGridLinesVisible="false" GridPane.columnIndex="1" GridPane.rowIndex="0">
+                    <xAxis>
+                        <NumberAxis side="BOTTOM" forceZeroInRange="false" minorTickVisible="false" />
+                    </xAxis>
+                    <yAxis>
+                        <NumberAxis side="LEFT" />
+                    </yAxis>
+                </BalanceChart>
+            </GridPane>
+            <TransactionsTreeTable fx:id="transactionsTable" VBox.vgrow="ALWAYS" />
+        </VBox>
     </center>
 </BorderPane>