WIP: fixing askPermission chain

src/App.vue

@@ -261,7 +261,30 @@
 
 <script lang="ts">
 import { Vue, Component } from "vue-facing-decorator";
-import axios from "axios";
+import axios, { AxiosError } from "axios";
+
+interface ServiceWorkerMessage {
+  type: string;
+  data: string;
+}
+
+interface ServiceWorkerResponse {
+  // Define the properties and their types
+  success: boolean;
+  message?: string;
+}
+
+// Example interface for error
+interface ErrorResponse {
+  message: string;
+  // Other properties as needed
+}
+
+interface VapidResponse {
+  data: {
+    vapidKey: string;
+  };
+}
 
 @Component
 export default class App extends Vue {
@@ -269,31 +292,60 @@ export default class App extends Vue {
   mounted() {
     axios
       .get("https://timesafari-pwa.anomalistlabs.com/web-push/vapid")
-      .then((response) => {
+      .then((response: VapidResponse) => {
         this.b64 = response.data.vapidKey;
         console.log(this.b64);
       })
-      .catch((error) => {
+      .catch((error: AxiosError) => {
         console.error("API error", error);
       });
   }
 
+  private sendMessageToServiceWorker(
+    message: ServiceWorkerMessage,
+  ): Promise<unknown> {
+    return new Promise((resolve, reject) => {
+      if (navigator.serviceWorker.controller) {
+        const messageChannel = new MessageChannel();
+
+        messageChannel.port1.onmessage = (event: MessageEvent) => {
+          if (event.data.error) {
+            reject(event.data.error as ErrorResponse);
+          } else {
+            resolve(event.data as ServiceWorkerResponse);
+          }
+        };
+
+        navigator.serviceWorker.controller.postMessage(message, [
+          messageChannel.port2,
+        ]);
+      } else {
+        reject("Service worker controller not available");
+      }
+    });
+  }
+
   private askPermission(): Promise<NotificationPermission> {
     if ("serviceWorker" in navigator && navigator.serviceWorker.controller) {
       const secret = localStorage.getItem("secret");
 
       if (secret) {
-        navigator.serviceWorker.controller.postMessage({
+        const message: ServiceWorkerMessage = {
           type: "SEND_LOCAL_DATA",
           data: secret,
-        });
+        };
-      }
-    }
 
+        this.sendMessageToServiceWorker(message)
+          .then((response) => {
+            // The service worker has received the message and responded
+            console.log("Response from service worker:", response);
+            // Perform the next action here
             // Check if Notifications are supported
             if (!("Notification" in window)) {
               alert("This browser does not support notifications.");
-      return Promise.reject("This browser does not support notifications.");
+              return Promise.reject(
+                "This browser does not support notifications.",
+              );
             }
 
             // Check existing permissions
@@ -303,9 +355,11 @@ export default class App extends Vue {
 
             // Request permission
             return new Promise((resolve, reject) => {
-      const permissionResult = Notification.requestPermission((result) => {
+              const permissionResult = Notification.requestPermission(
+                (result) => {
                   resolve(result);
-      });
+                },
+              );
 
               if (permissionResult) {
                 permissionResult.then(resolve, reject);
@@ -314,12 +368,20 @@ export default class App extends Vue {
               console.log("Permission result:", permissionResult);
 
               if (permissionResult !== "granted") {
-        alert("We need notification permission to provide certain features.");
+                alert(
+                  "We need notification permission to provide certain features.",
+                );
                 return Promise.reject("We weren't granted permission.");
               }
 
               return permissionResult;
             });
+          })
+          .catch((error) => {
+            console.error("Error:", error);
+          });
+      }
+    }
   }
 
   async turnOnNotifications() {

sw_scripts/additional-scripts.js

@@ -27,5 +27,6 @@ self.addEventListener('message', event => {
     if (event.data && event.data.type === 'SEND_LOCAL_DATA') {
         self.secret = event.data.data;
         console.log('Data stored in service worker:', self.secret);
+	event.ports[0].postMessage({ success: true });
     }
 });

sw_scripts/safari-notifications.js

@@ -7,12 +7,14 @@ function validateBase64(s) {
     }
 }
 
+
 function decodeBase64(s) {
     validateBase64(s);
     var i, d = atob(s), b = new Uint8Array(d.length);
     for (i = 0; i < d.length; i++) b[i] = d.charCodeAt(i);
     return b;
-};
+}
+
 
 async function getSettingById(id) {
   return new Promise((resolve, reject) => {
@@ -40,6 +42,7 @@ async function getSettingById(id) {
   });
 }
 
+
 function getAllAccounts() {
   return new Promise((resolve, reject) => {
     let openRequest = indexedDB.open('TimeSafariAccounts');
@@ -82,12 +85,13 @@ async function getNotificationCount() {
     let secret = null;
     if ('secret' in self) {
         secret = self.secret;
-        const secretUint8Array = decodeBase64(secret);
+        const secretUint8Array = self.decodeBase64(secret);
+/**		
         const settings = await getSettingById(1);
         const activeDid = settings['activeDid'];
+	
         const accounts = await fetchAllAccounts();
 
-/**	
         let result = null;
         for (var i = 0; i < accounts.length; i++) {
             let account = accounts[i];
@@ -107,3 +111,4 @@ async function getNotificationCount() {
 }
 
 self.getNotificationCount = getNotificationCount;
+self.decodeBase64 = decodeBase64