Made join-address pie show text instead when there is only one address

Affects issues:
- Close #1809

Plan/common/src/main/resources/assets/plan/web/js/graphs.js

@@ -419,31 +419,43 @@ function serverPie(id, serverSeries) {
 }
 
 function joinAddressPie(id, joinAddresses) {
-    graphs.push(Highcharts.chart(id, {
+    if (joinAddresses.data.length < 2) {
-        chart: {
+        document.getElementById(id).innerHTML = '<div class="card-body"><p></p></div>'
-            plotBackgroundColor: null,
+        document.getElementById(id).classList.remove('chart-area');
-            plotBorderWidth: null,
+
-            plotShadow: false,
+        // XSS danger appending join addresses directly, using innerText is safe.
-            type: 'pie'
+        for (let slice of joinAddresses.data) {
-        },
+            document.querySelector(`#${id} p`).innerText = `${slice.name}: ${slice.y}`;
-        title: {text: ''},
+        }
-        plotOptions: {
+    } else {
-            pie: {
+        document.getElementById(id).innerHTML = '';
-                allowPointSelect: true,
+        document.getElementById(id).classList.add('chart-area');
-                cursor: 'pointer',
+        graphs.push(Highcharts.chart(id, {
-                dataLabels: {
+            chart: {
-                    enabled: false
+                plotBackgroundColor: null,
-                },
+                plotBorderWidth: null,
-                showInLegend: true
+                plotShadow: false,
-            }
+                type: 'pie'
-        },
+            },
-        tooltip: {
+            title: {text: ''},
-            formatter: function () {
+            plotOptions: {
-                return '<b>' + this.point.name + ':</b> ' + this.y + ' (' + this.percentage.toFixed(2) + '%)';
+                pie: {
-            }
+                    allowPointSelect: true,
-        },
+                    cursor: 'pointer',
-        series: [joinAddresses]
+                    dataLabels: {
-    }));
+                        enabled: false
+                    },
+                    showInLegend: true
+                }
+            },
+            tooltip: {
+                formatter: function () {
+                    return '<b>' + this.point.name + ':</b> ' + this.y + ' (' + this.percentage.toFixed(2) + '%)';
+                }
+            },
+            series: [joinAddresses]
+        }));
+    }
 }
 
 function formatTimeAmount(ms) {