From 7c9455f31be4d26a125ff3a676e6a488fe3a222c Mon Sep 17 00:00:00 2001
From: Silas <me@silentsilas.com>
Date: Mon, 5 Feb 2024 19:08:59 -0500
Subject: [PATCH] notification permission fixes, show server urls at bottom,
 service worker fixes

---
 src/components/Footer.ts                      |  2 ++
 src/components/Header.ts                      |  4 ++-
 .../settings/NotificationManager.ts           | 17 +++++++++----
 src/sw.js                                     | 25 +++++++++++++------
 src/utils/vite-env.d.ts                       |  4 +--
 5 files changed, 37 insertions(+), 15 deletions(-)

diff --git a/src/components/Footer.ts b/src/components/Footer.ts
index 03f7389..0578a8b 100644
--- a/src/components/Footer.ts
+++ b/src/components/Footer.ts
@@ -33,5 +33,7 @@ export const Footer = html`<footer class="container">
         second: "numeric",
       })}
     </p>
+    <p class="center">Server: <code>${import.meta.env.VITE_BASE_URL}</code></p>
+    <p class="center">API: <code>${import.meta.env.VITE_API_BASE_URL}</code></p>
   </div>
 </footer>`;
diff --git a/src/components/Header.ts b/src/components/Header.ts
index 3cc7716..2d055a2 100644
--- a/src/components/Header.ts
+++ b/src/components/Header.ts
@@ -1,7 +1,9 @@
 import { html } from "uhtml";
 
 export const Header = html` <hgroup>
-  <h1>SURE<span class="primary">DOG</span></h1>
+  <h1>
+    SURE<span class="primary"><a href="/">DOG</a></span>
+  </h1>
   <h2>
     <span class="primary">S</span>ecure <span class="primary">U</span>RL
     <span class="primary">Re</span>quests
diff --git a/src/components/settings/NotificationManager.ts b/src/components/settings/NotificationManager.ts
index 623a500..30f116d 100644
--- a/src/components/settings/NotificationManager.ts
+++ b/src/components/settings/NotificationManager.ts
@@ -23,7 +23,8 @@ export const NotificationManager = () => html` <h2>Notifications</h2>
   <p>
     <button
       @click=${subscribeUserToPush}
-      ?disabled=${notificationPermission.value === "granted"}
+      ?disabled=${notificationPermission.value === "granted" &&
+      pushSubscription.value !== null}
     >
       Enable Notifications
     </button>
@@ -94,12 +95,18 @@ export async function subscribeUserToPush(
 ) {
   event?.preventDefault();
   try {
-    const permission = await Notification.requestPermission();
-    if (permission !== "granted") {
-      throw new Error("Notification permission not granted");
+    notificationPermission.value = Notification.permission;
+    if (notificationPermission.value !== "granted") {
+      const permission = await Notification.requestPermission();
+
+      notificationPermission.value = permission;
     }
 
-    notificationPermission.value = permission;
+    if (notificationPermission.value !== "granted") {
+      throw new Error(
+        `Notification permission not granted: ${notificationPermission.value}`
+      );
+    }
 
     const registration = await navigator.serviceWorker.ready;
     let subscription = await registration.pushManager.getSubscription();
diff --git a/src/sw.js b/src/sw.js
index 61e54ef..4c01d00 100644
--- a/src/sw.js
+++ b/src/sw.js
@@ -24,13 +24,24 @@ self.addEventListener("push", function (e) {
   }
 });
 
-self.addEventListener("notificationclick", function (event) {
-  event.notification.close();
-  var url = event.notification.data.url;
-  event.waitUntil(
-    clients
-      .openWindow(event.notification.data.url)
-      .catch((err) => console.log(err))
+self.addEventListener("notificationclick", (e) => {
+  // Close the notification popout
+  e.notification.close();
+  // Get all the Window clients
+  e.waitUntil(
+    clients.matchAll({ type: "window" }).then((clientsArr) => {
+      // If a Window tab matching the targeted URL already exists, focus that;
+      const hadWindowToFocus = clientsArr.some((windowClient) =>
+        windowClient.url === e.notification.data.url
+          ? (windowClient.focus(), true)
+          : false
+      );
+      // Otherwise, open a new tab to the applicable URL and focus it.
+      if (!hadWindowToFocus)
+        clients
+          .openWindow(e.notification.data.url)
+          .then((windowClient) => (windowClient ? windowClient.focus() : null));
+    })
   );
 });
 
diff --git a/src/utils/vite-env.d.ts b/src/utils/vite-env.d.ts
index 3ec4b64..1056cdc 100644
--- a/src/utils/vite-env.d.ts
+++ b/src/utils/vite-env.d.ts
@@ -1,6 +1,6 @@
 /// <reference types="vite/client" />
 
 interface ImportMetaEnv {
-  VITE_BASE_URL?: string;
-  VITE_API_BASE_URL?: string;
+  readonly VITE_BASE_URL?: string;
+  readonly VITE_API_BASE_URL?: string;
 }