From 5eaf0db4a5cafb33cae5be9ea12bcbd688d39d02 Mon Sep 17 00:00:00 2001
From: Eduard Urbach <e.urbach@gmail.com>
Date: Tue, 17 Apr 2018 18:20:53 +0200
Subject: [PATCH] Added UI for client error reports

---
 pages/admin/admin.pixy        |  1 +
 pages/admin/clienterrors.go   | 26 ++++++++++++++++++++++++++
 pages/admin/clienterrors.pixy | 19 +++++++++++++++++++
 pages/index.go                |  1 +
 styles/include/config.scarlet |  2 +-
 5 files changed, 48 insertions(+), 1 deletion(-)
 create mode 100644 pages/admin/clienterrors.go
 create mode 100644 pages/admin/clienterrors.pixy

diff --git a/pages/admin/admin.pixy b/pages/admin/admin.pixy
index 71bd9c4e..578f4ce7 100644
--- a/pages/admin/admin.pixy
+++ b/pages/admin/admin.pixy
@@ -2,6 +2,7 @@ component AdminTabs
 	.tabs
 		Tab("Server", "server", "/admin")
 		Tab("WebDev", "html5", "/admin/webdev")
+		Tab("Client errors", "exclamation", "/admin/errors/client")
 		Tab("Registrations", "user-plus", "/admin/registrations")
 		Tab("Purchases", "shopping-cart", "/admin/purchases")
 	
diff --git a/pages/admin/clienterrors.go b/pages/admin/clienterrors.go
new file mode 100644
index 00000000..f2e2771b
--- /dev/null
+++ b/pages/admin/clienterrors.go
@@ -0,0 +1,26 @@
+package admin
+
+import (
+	"sort"
+
+	"github.com/aerogo/aero"
+	"github.com/animenotifier/arn"
+	"github.com/animenotifier/notify.moe/components"
+)
+
+const maxReports = 80
+
+// ClientErrors shows client-side errors.
+func ClientErrors(ctx *aero.Context) string {
+	reports := arn.AllClientErrorReports()
+
+	sort.Slice(reports, func(i, j int) bool {
+		return reports[i].Created > reports[j].Created
+	})
+
+	if len(reports) > maxReports {
+		reports = reports[:maxReports]
+	}
+
+	return ctx.HTML(components.ClientErrors(reports))
+}
diff --git a/pages/admin/clienterrors.pixy b/pages/admin/clienterrors.pixy
new file mode 100644
index 00000000..ddc014c4
--- /dev/null
+++ b/pages/admin/clienterrors.pixy
@@ -0,0 +1,19 @@
+component ClientErrors(reports []*arn.ClientErrorReport)
+	AdminTabs
+	h1.mountable Client-side errors
+
+	table
+		tbody
+			each report in reports
+				tr.mountable
+					td
+						a(href="/api/clienterrorreport/" + report.ID, target="_blank")= report.Message
+					td
+						each line in strings.Split(report.Stack, "\n")
+							p= line
+					td.utc-date(data-date=report.Created)
+					td.edit-log-user
+						if report.CreatedBy != ""
+							Avatar(report.Creator())
+						else
+							span anonymous
diff --git a/pages/index.go b/pages/index.go
index c1721622..deac5d02 100644
--- a/pages/index.go
+++ b/pages/index.go
@@ -278,6 +278,7 @@ func Configure(app *aero.Application) {
 	l.Page("/admin", admin.Get)
 	l.Page("/admin/webdev", admin.WebDev)
 	l.Page("/admin/registrations", admin.UserRegistrations)
+	l.Page("/admin/errors/client", admin.ClientErrors)
 	l.Page("/admin/purchases", admin.PurchaseHistory)
 
 	// Editor
diff --git a/styles/include/config.scarlet b/styles/include/config.scarlet
index 7bb8d1a8..cccf12fe 100644
--- a/styles/include/config.scarlet
+++ b/styles/include/config.scarlet
@@ -75,7 +75,7 @@ calendar-entry-seen-background = ui-background
 calendar-entry-seen-hover-background = ui-background
 
 // Tables
-table-width-normal = 900px
+table-width-normal = 1100px
 
 // Feature cards
 const feature-card-saturation = 83%