Add events toast, add notification ui and acknowledgement of issues

NHAS · Apr 27, 2024 · 230a31f · 230a31f
1 parent 1211f6b
commit 230a31f
Show file tree

Hide file tree

Showing 7 changed files with 104 additions and 12 deletions.
diff --git a/ui/clustering.go b/ui/clustering.go
@@ -219,3 +219,27 @@ func clusterEventsUI(w http.ResponseWriter, r *http.Request) {
 		return
 	}
 }
+
+func clusterEventsAcknowledge(w http.ResponseWriter, r *http.Request) {
+	if r.Method != "POST" {
+		http.NotFound(w, r)
+		return
+	}
+
+	var acknowledgeError struct {
+		ErrorID string
+	}
+	err := json.NewDecoder(r.Body).Decode(&acknowledgeError)
+	if err != nil {
+		http.Error(w, "Bad Request", http.StatusBadRequest)
+		return
+	}
+
+	err = data.ResolveError(acknowledgeError.ErrorID)
+	if err != nil {
+		log.Println("failed to resolve error: ", err)
+		http.Error(w, err.Error(), http.StatusInternalServerError)
+	}
+
+	w.Write([]byte("Success!"))
+}
diff --git a/ui/notifications.go b/ui/notifications.go
@@ -30,7 +30,13 @@ func notificationsWS(notifications <-chan Notification) func(w http.ResponseWrit
 	servingConnections := map[string]chan<- Notification{}
 
 	go func() {
+
 		for notification := range notifications {
+
+			notificationsMapLck.Lock()
+			notificationsMap[notification.ID] = notification
+			notificationsMapLck.Unlock()
+
 			for key := range servingConnections {
 				go func(key string, notification Notification) {
 					servingConnections[key] <- notification
@@ -94,12 +100,16 @@ type Notification struct {
 }
 
 var (
-	notifications = map[string]Notification{}
+	notificationsMapLck sync.RWMutex
+	notificationsMap    = map[string]Notification{}
 )
 
 func getNotifications() []Notification {
 
-	notfs := maps.Values(notifications)
+	notificationsMapLck.RLock()
+	notfs := maps.Values(notificationsMap)
+	notificationsMapLck.RUnlock()
+
 	sort.Slice(notfs, func(i, j int) bool {
 		return notfs[i].Time.After(notfs[j].Time)
 	})
@@ -139,10 +149,11 @@ func startUpdateChecker(notifications chan<- Notification) {
 	}()
 }
 
-func recieveErrorNotifications(notifications chan<- Notification) func(key string, current, previous data.EventError, et data.EventType) error {
+func receiveErrorNotifications(notifications chan<- Notification) func(key string, current, previous data.EventError, et data.EventType) error {
 
 	return func(key string, current, previous data.EventError, et data.EventType) error {
-		if et == data.CREATED {
+		switch et {
+		case data.CREATED:
 
 			msg := Notification{
 				ID:         current.ErrorID,
@@ -155,6 +166,11 @@ func recieveErrorNotifications(notifications chan<- Notification) func(key strin
 			}
 
 			notifications <- msg
+		case data.DELETED:
+
+			notificationsMapLck.Lock()
+			delete(notificationsMap, previous.ErrorID)
+			notificationsMapLck.Unlock()
 		}
 		return nil
 	}

diff --git a/ui/src/js/events.js b/ui/src/js/events.js
@@ -0,0 +1,51 @@
+const acknowledgementButtons = document.querySelectorAll('.acknowledge');
+
+acknowledgementButtons.forEach(el => el.addEventListener('click', event => {
+    const errorid = event.target.getAttribute("errorid")
+
+    fetch("/cluster/events/acknowledge", {
+        method: 'POST',
+        mode: 'same-origin',
+        cache: 'no-cache',
+        credentials: 'same-origin',
+        redirect: 'follow',
+        headers: {
+            'Content-Type': 'application/json',
+            'WAG-CSRF': $("#csrf_token").val()
+        },
+        body: JSON.stringify({ ErrorID: errorid })
+    }).then((response) => {
+        if (response.status !== 200) {
+            response.text().then(txt => {
+                console.log("failed to acknowledge error: ", txt)
+                Toastify({
+                    text: txt,
+                    className: "error",
+                    position: "right",
+                    gravity: "bottom",
+                    stopOnFocus: true,
+                    style: {
+                        background: "#db0b3c",
+                    }
+                }).showToast();
+            })
+            return
+        }
+
+
+        response.text().then(txt => {
+            event.target.parentNode.parentNode.remove()
+
+            Toastify({
+                text: txt,
+                className: "info",
+                position: "right",
+                gravity: "bottom",
+                stopOnFocus: true,
+                style: {
+                    background: "#0bb329",
+                }
+            }).showToast();
+        })
+    })
+}))
diff --git a/ui/src/js/notifications.js b/ui/src/js/notifications.js
@@ -27,7 +27,8 @@ socket.onmessage = function (e) {
         position: "right",
         gravity: "top",
         offset: {
-            y: 30,
+            y: 60,
+            x: 10,
         },
         stopOnFocus: true,
         style: {

diff --git a/ui/templates/cluster/events.html b/ui/templates/cluster/events.html
@@ -1,9 +1,7 @@
 {{define "Content"}}
 
-
 <link href="/vendor/bootstrap-table/css/bootstrap-table.min.css" rel="stylesheet">
 
-
 <div class="row">
     <div class="col-sm">
         <div class="card shadow mb-4">
@@ -51,8 +49,8 @@ <h1 class="m-0 text-gray-900">Errors</h1>
                             {{range $line := .Errors}}
                             <tr>
                                 <td>{{.NodeID}} {{.FailedEventData}} {{.Error}}</td>
-                                <td> <button id="unlock" errorid="{{.ErrorID}}"
-                                        class="btn btn-danger">Acknowledge</button> </td>
+                                <td> <button class="acknowledge btn btn-danger"
+                                        errorid="{{.ErrorID}}">Acknowledge</button> </td>
                             </tr>
                             {{else}}
                             <tr>
@@ -68,6 +66,6 @@ <h1 class="m-0 text-gray-900">Errors</h1>
 </div>
 
 
-
+{{staticContent "events"}}
 
 {{end}}
diff --git a/ui/templates/menus.html b/ui/templates/menus.html
@@ -233,7 +233,8 @@ <h6 class="collapse-header">Tools:</h6>
                                     href="{{$val.Url}}" {{if $val.OpenNewTab}}target="_blank" rel="noopener noreferrer"
                                     {{end}}>
                                     <div>
-                                        <div class="small text-gray-500">{{$val.Time}}</div>
+                                        <div class="small text-gray-500">{{$val.Time.Format "02 Jan 06 15:04 MST"}}
+                                        </div>
                                         <span class="font-weight-bold">{{$val.Heading}}</span>
                                         {{range $val := $val.Message}}
                                         <p>{{$val}}</p>

diff --git a/ui/ui_webserver.go b/ui/ui_webserver.go
@@ -295,6 +295,7 @@ func StartWebServer(errs chan<- error) error {
 		protectedRoutes.HandleFunc("/cluster/members/control", contentType(nodeControl, JSON))
 
 		protectedRoutes.HandleFunc("/cluster/events/", clusterEventsUI)
+		protectedRoutes.HandleFunc("/cluster/events/acknowledge", clusterEventsAcknowledge)
 
 		protectedRoutes.HandleFunc("/diag/wg", wgDiagnositicsUI)
 		protectedRoutes.HandleFunc("/diag/wg/data", wgDiagnositicsData)
@@ -324,7 +325,7 @@ func StartWebServer(errs chan<- error) error {
 
 		notifications := make(chan Notification, 1)
 		protectedRoutes.HandleFunc("/notifications", notificationsWS(notifications))
-		data.RegisterEventListener(data.NodeErrors, true, recieveErrorNotifications(notifications))
+		data.RegisterEventListener(data.NodeErrors, true, receiveErrorNotifications(notifications))
 
 		should, err := data.ShouldCheckUpdates()
 		if err == nil && should {