Implement support for notifications (#12523)

* Setup basic notification page

* Add basic notification implementation

* Register for push notifications

* Implement dispatching

* Add fields

* Handle image and link

* Add notification config

* Add field for users notification tokens

* Implement saving of notification tokens

* Implement VAPID key generation

* Implement public key encoding

* Implement webpush from server

* Implement push notification handling

* Make notifications config only

* Add maskable icon

* Use zod form to control notification settings in the UI

* Use js

* Always open notification

* Support multiple endpoints

* Handle cleaning up expired notification registrations

* Correctly unsubscribe notifications

* Change ttl dynamically

* Add note about notification latency and features

* Cleanup docs

* Fix firefox pushes

* Add links to docs and improve formatting

* Improve wording

* Fix docstring

Co-authored-by: Blake Blackshear <blake@frigate.video>

* Handle case where native auth is not enabled

* Show errors in UI

---------

Co-authored-by: Blake Blackshear <blake@frigate.video>

web/public/notifications-worker.js

@@ -0,0 +1,39 @@
+// Notifications Worker
+
+self.addEventListener("push", function (event) {
+  // @ts-expect-error we know this exists
+  if (event.data) {
+    // @ts-expect-error we know this exists
+    const data = event.data.json();
+    // @ts-expect-error we know this exists
+    self.registration.showNotification(data.title, {
+      body: data.message,
+      icon: "/images/maskable-icon.png",
+      image: data.image,
+      badge: "/images/maskable-badge.png",
+      tag: data.id,
+      data: { id: data.id, link: data.direct_url },
+    });
+  } else {
+    // pass
+    // This push event has no data
+  }
+});
+
+self.addEventListener("notificationclick", (event) => {
+  // @ts-expect-error we know this exists
+  if (event.notification) {
+    // @ts-expect-error we know this exists
+    event.notification.close();
+
+    // @ts-expect-error we know this exists
+    if (event.notification.data) {
+      const url = event.notification.data.link;
+      // eslint-disable-next-line no-undef
+      if (clients.openWindow) {
+        // eslint-disable-next-line no-undef
+        return clients.openWindow(url);
+      }
+    }
+  }
+});