Send notifications

src/feed/LoginFeed.ts

@@ -1,3 +1,4 @@
+import Nostrich from "./nostrich.jpg";
 import { useEffect, useMemo } from "react";
 import { useDispatch, useSelector } from "react-redux";
 import { HexKey } from "../nostr";
@@ -61,9 +62,19 @@ export default function useLoginFeed() {
         }
 
         if ("Notification" in window && Notification.permission === "granted") {
-            for (let nx in notifications.filter(a => (a.created_at * 1000) > readNotifications)) {
-                //let n = new Notification(`New reply!`, { body: nx.content, icon: Nostrich });
-                //console.log(n);
+            for (let nx of notifications.filter(a => (a.created_at * 1000) > readNotifications)) {
+                if (Notification.permission === "granted") {
+                    let body = nx.content.substring(0, 50);
+                    let title = "Snort"
+                    navigator.serviceWorker.ready.then(worker => {
+                        worker.showNotification(title, {
+                            body: body,
+                            icon: Nostrich,
+                            tag: "notification",
+                        });
+
+                    })
+                }
             }
         }
         dispatch(addNotifications(notifications));

src/pages/Layout.tsx

@@ -51,15 +51,6 @@ export default function Layout() {
                     let res = await Notification.requestPermission();
                     console.debug(res);
                 }
-                if (Notification.permission === "granted") {
-                    let worker = await navigator.serviceWorker.ready;
-                    worker.showNotification("Vibration Sample", {
-                        body: "Buzz! Buzz!",
-                        icon: "../images/touch/chrome-touch-icon-192x192.png",
-                        vibrate: [200, 100, 200, 100, 200, 100, 200],
-                        tag: "vibration-sample",
-                    });
-                }
             } catch (e) {
                 console.error(e);
             }

src/state/Login.ts

@@ -68,7 +68,7 @@ const InitState = {
     latestRelays: 0,
     follows: [],
     notifications: [],
-    readNotifications: 0,
+    readNotifications: new Date().getTime(),
     dms: [],
     dmInteraction: 0
 } as LoginStore;