Notification action (#12742)

frigate/comms/webpush.py

@@ -165,6 +165,7 @@ class WebPushClient(Communicator):  # type: ignore[misc]
                             "direct_url": direct_url,
                             "image": image,
                             "id": reviewId,
+                            "type": "alert",
                         }
                     ),
                 )

web/public/notifications-worker.js

@@ -5,6 +5,20 @@ self.addEventListener("push", function (event) {
   if (event.data) {
     // @ts-expect-error we know this exists
     const data = event.data.json();
+
+    let actions = [];
+
+    switch (data.type ?? "unknown") {
+      case "alert":
+        actions = [
+          {
+            action: "markReviewed",
+            title: "Mark as Reviewed",
+          },
+        ];
+        break;
+    }
+
     // @ts-expect-error we know this exists
     self.registration.showNotification(data.title, {
       body: data.message,
@@ -13,6 +27,7 @@ self.addEventListener("push", function (event) {
       badge: "/images/maskable-badge.png",
       tag: data.id,
       data: { id: data.id, link: data.direct_url },
+      actions,
     });
   } else {
     // pass
@@ -26,6 +41,17 @@ self.addEventListener("notificationclick", (event) => {
     // @ts-expect-error we know this exists
     event.notification.close();
 
+    switch (event.action ?? "default") {
+      case "markReviewed":
+        if (event.notification.data) {
+          fetch("/api/reviews/viewed", {
+            method: "POST",
+            headers: { "Content-Type": "application/json", "X-CSRF-TOKEN": 1 },
+            body: JSON.stringify({ ids: [event.notification.data.id] }),
+          });
+        }
+        break;
+      default:
         // @ts-expect-error we know this exists
         if (event.notification.data) {
           const url = event.notification.data.link;
@@ -36,4 +62,5 @@ self.addEventListener("notificationclick", (event) => {
           }
         }
     }
+  }
 });