From 2b7903f7d589002c87744c83374a7c98fc65caf9 Mon Sep 17 00:00:00 2001
From: Jamie Holdstock <jholdstock@decred.org>
Date: Sat, 12 Jun 2021 13:52:19 +0800
Subject: [PATCH] Add database and logout tabs to admin page.

Buttons to logout and download DB backup are now moved into new tabs. Also the database size is displayed in the database tab.
---
 database/ticket.go          | 11 +++++++++++
 webapi/cache.go             |  8 ++++++++
 webapi/public/css/vspd.css  |  9 ++-------
 webapi/templates/admin.html | 38 +++++++++++++++++++++++++------------
 4 files changed, 47 insertions(+), 19 deletions(-)

diff --git a/database/ticket.go b/database/ticket.go
index 1b1b1d0..0473b21 100644
--- a/database/ticket.go
+++ b/database/ticket.go
@@ -271,6 +271,17 @@ func (vdb *VspDatabase) GetTicketByHash(ticketHash string) (Ticket, bool, error)
 	return ticket, found, err
 }
 
+// Size returns the current size of the database in bytes. Note that this may
+// not exactly match the size of the database file stored on disk.
+func (vdb *VspDatabase) Size() (uint64, error) {
+	var size uint64
+	err := vdb.db.View(func(tx *bolt.Tx) error {
+		size = uint64(tx.Size())
+		return nil
+	})
+	return size, err
+}
+
 // CountTickets returns the total number of voted, revoked, and currently voting
 // tickets. This func iterates over every ticket so should be used sparingly.
 func (vdb *VspDatabase) CountTickets() (int64, int64, int64, error) {
diff --git a/webapi/cache.go b/webapi/cache.go
index 9c96c02..836e64a 100644
--- a/webapi/cache.go
+++ b/webapi/cache.go
@@ -13,6 +13,7 @@ import (
 	"github.com/decred/dcrd/chaincfg/v3"
 	"github.com/decred/vspd/database"
 	"github.com/decred/vspd/rpc"
+	"github.com/dustin/go-humanize"
 )
 
 // apiCache is used to cache values which are commonly used by the API, so
@@ -20,6 +21,7 @@ import (
 type apiCache struct {
 	UpdateTime        string
 	PubKey            string
+	DatabaseSize      string
 	Voting            int64
 	Voted             int64
 	Revoked           int64
@@ -54,6 +56,11 @@ func initCache() {
 func updateCache(ctx context.Context, db *database.VspDatabase,
 	dcrd rpc.DcrdConnect, netParams *chaincfg.Params) error {
 
+	dbSize, err := db.Size()
+	if err != nil {
+		return err
+	}
+
 	// Get latest counts of voting, voted and revoked tickets.
 	voting, voted, revoked, err := db.CountTickets()
 	if err != nil {
@@ -75,6 +82,7 @@ func updateCache(ctx context.Context, db *database.VspDatabase,
 	defer cacheMtx.Unlock()
 
 	cache.UpdateTime = dateTime(time.Now().Unix())
+	cache.DatabaseSize = humanize.Bytes(dbSize)
 	cache.Voting = voting
 	cache.Voted = voted
 	cache.Revoked = revoked
diff --git a/webapi/public/css/vspd.css b/webapi/public/css/vspd.css
index 2c69ff3..d16c8c7 100644
--- a/webapi/public/css/vspd.css
+++ b/webapi/public/css/vspd.css
@@ -96,11 +96,6 @@ footer .code {
     border-color: transparent;
 }
 
-.btn-small {
-    padding: 6px 10px;
-    font-size: 13px;
-}
-
 .block__content h1 {
     color: #091440;
     font-size: 24px;
@@ -196,7 +191,7 @@ footer .code {
     list-style:none;
     display:flex;
     padding: 0;
-    margin: 0 0 30px;
+    margin: 0 0 25px;
 }
 
 .tabset > ul label {
@@ -239,7 +234,7 @@ footer .code {
     left:-999em;
 }
 .tabset > div > section {
-    padding: 0;
+    padding: 0 10px 10px 10px;
 }
 
 .tabset > input:nth-child(1):checked ~ div > section:nth-child(1),
diff --git a/webapi/templates/admin.html b/webapi/templates/admin.html
index 8844f39..e1e6ba7 100644
--- a/webapi/templates/admin.html
+++ b/webapi/templates/admin.html
@@ -4,18 +4,9 @@
     <div class="container">
 
         <div class="d-flex flex-wrap">
-            <h1 class="mr-auto text-nowrap">Admin Panel</h1>
-            
-            <div class="row">
-                <a class="m-2 btn btn-primary btn-small" href="/admin/backup" download>Backup</a>
-                
-                <form class="p-2" action="/admin/logout" method="post">
-                    <button type="submit" class="btn btn-primary btn-small">Logout</button>
-                </form>
-            </div>
+            <h1>Admin Panel</h1>
         </div>
         
-
         {{ template "vsp-stats" . }}
 
     </div>
@@ -33,7 +24,6 @@
                         name="tabset_1"
                         id="tabset_1_1"
                         hidden
-                        aria-hidden="true"
                         {{ with .SearchResult }}{{ else }}checked{{ end }}
                     >
                     <input
@@ -41,12 +31,25 @@
                         name="tabset_1"
                         id="tabset_1_2"
                         hidden
-                        aria-hidden="true"
                         {{ with .SearchResult }}checked{{ end }}
                     >
+                    <input
+                        type="radio"
+                        name="tabset_1"
+                        id="tabset_1_3"
+                        hidden
+                    >
+                    <input
+                        type="radio"
+                        name="tabset_1"
+                        id="tabset_1_4"
+                        hidden
+                    >
                     <ul>
                         <li><label for="tabset_1_1">Wallet Status</label></li>
                         <li><label for="tabset_1_2">Ticket Search</label></li>
+                        <li><label for="tabset_1_3">Database</label></li>
+                        <li><label for="tabset_1_4">Logout</label></li>
                     </ul>
                     
                     <div>
@@ -276,6 +279,17 @@
                             {{ end }}
                         </section>
 
+                        <section>
+                            <p>Database size: {{ .WebApiCache.DatabaseSize }}</p>
+                            <a class="btn btn-primary" href="/admin/backup" download>Download Backup</a>
+                        </section>
+
+                        <section>
+                            <form action="/admin/logout" method="post">
+                                <button type="submit" class="btn btn-primary">Logout</button>
+                            </form>
+                        </section>
+
                     </div>
                 </div>