change the notification detection to our own variables, and save the selected time

src/components/PushNotificationPermission.vue

@@ -19,8 +19,7 @@
             Would you like to be notified of new activity once a day?
           </p>
           <p v-else class="text-lg mb-4">
-            Waiting for system initialization, which may take up to 5
-            seconds...
+            Waiting for system initialization, which may take up to 5 seconds...
             <fa icon="spinner" spin />
           </p>
 
@@ -74,7 +73,12 @@
 import { Component, Vue } from "vue-facing-decorator";
 
 import { DEFAULT_PUSH_SERVER, NotificationIface } from "@/constants/app";
-import { logConsoleAndDb, retrieveSettingsForActiveAccount } from "@/db/index";
+import {
+  db,
+  logConsoleAndDb,
+  retrieveSettingsForActiveAccount,
+} from "@/db/index";
+import { MASTER_SETTINGS_KEY } from "@/db/tables/settings";
 import { urlBase64ToUint8Array } from "@/libs/crypto/vc/util";
 import * as libsUtil from "@/libs/util";
 
@@ -108,8 +112,10 @@ interface VapidResponse {
 
 @Component
 export default class PushNotificationPermission extends Vue {
-  $notify!: (notification: NotificationIface, timeout?: number) => void;
+  // eslint-disable-next-line
+  $notify!: (notification: NotificationIface, timeout?: number) => Promise<() => void>;
 
+  callback: (success: boolean, time: string) => void = () => {};
   hourAm = true;
   hourInput = "8";
   isVisible = false;
@@ -117,8 +123,9 @@ export default class PushNotificationPermission extends Vue {
   serviceWorkerReady = false;
   vapidKey = "";
 
-  async open() {
+  async open(callback?: (success: boolean, time: string) => void) {
     this.isVisible = true;
+    this.callback = callback || this.callback;
     try {
       const settings = await retrieveSettingsForActiveAccount();
       let pushUrl = DEFAULT_PUSH_SERVER;
@@ -253,7 +260,15 @@ export default class PushNotificationPermission extends Vue {
 
   private checkNotificationSupport(): Promise<void> {
     if (!("Notification" in window)) {
-      alert("This browser does not support notifications.");
+      this.$notify(
+        {
+          group: "alert",
+          type: "danger",
+          title: "Browser Notifications Not Supported",
+          text: "This browser does not support notifications.",
+        },
+        3000,
+      );
       return Promise.reject("This browser does not support notifications.");
     }
     if (window.Notification.permission === "granted") {
@@ -266,9 +281,16 @@ export default class PushNotificationPermission extends Vue {
     return window.Notification.requestPermission().then(
       (permission: string) => {
         if (permission !== "granted") {
-          alert(
-            "Allow this app permission to make notifications for personal reminders." +
-              " You can adjust them at any time in your settings.",
+          this.$notify(
+            {
+              group: "alert",
+              type: "danger",
+              title: "Error Requesting Notification Permission",
+              text:
+                "Allow this app permission to make notifications for personal reminders." +
+                " You can adjust them at any time in your settings.",
+            },
+            -1,
           );
           throw new Error("We weren't granted permission.");
         }
@@ -308,6 +330,7 @@ export default class PushNotificationPermission extends Vue {
   }
 
   public async turnOnNotifications() {
+    let notifyCloser = () => {};
     return this.askPermission()
       .then((permission) => {
         logConsoleAndDb("Permission granted: " + JSON.stringify(permission));
@@ -324,7 +347,7 @@ export default class PushNotificationPermission extends Vue {
       })
       .then(async (subscription) => {
         if (subscription) {
-          await this.$notify(
+          notifyCloser = await this.$notify(
             {
               group: "alert",
               type: "info",
@@ -374,6 +397,7 @@ export default class PushNotificationPermission extends Vue {
           "Subscription data sent to server and all finished successfully.",
         );
         await libsUtil.sendTestThroughPushServer(subscription, true);
+        notifyCloser();
         this.$notify(
           {
             group: "alert",
@@ -383,6 +407,14 @@ export default class PushNotificationPermission extends Vue {
           },
           -1,
         );
+        const timeText =
+          // eslint-disable-next-line
+          this.hourInput + ":" + this.minuteInput + " " + (this.hourAm ? "AM" : "PM");
+        await db.settings.update(MASTER_SETTINGS_KEY, {
+          notifyingNewActivity: true,
+          notifyingNewActivityTime: timeText,
+        });
+        this.callback(true, timeText);
       })
       .catch((error) => {
         logConsoleAndDb(
@@ -393,7 +425,15 @@ export default class PushNotificationPermission extends Vue {
             JSON.stringify(error),
           true,
         );
-        alert("Some error occurred setting notification permissions.");
+        this.$notify(
+          {
+            group: "alert",
+            type: "danger",
+            title: "Error Setting Notification Permissions",
+            text: "Could not set notification permissions.",
+          },
+          3000,
+        );
         // unsubscribe just in case we failed after getting a subscription
         navigator.serviceWorker?.ready
           .then((registration) => registration.pushManager.getSubscription())
@@ -445,9 +485,16 @@ export default class PushNotificationPermission extends Vue {
           );
 
           // Inform the user about the issue
-          alert(
-            "We encountered an issue setting up push notifications. " +
-              "If you wish to revoke notification permissions, please do so in your browser settings.",
+          this.$notify(
+            {
+              group: "alert",
+              type: "danger",
+              title: "Error Setting Push Notifications",
+              text:
+                "We encountered an issue setting up push notifications. " +
+                "If you wish to revoke notification permissions, please do so in your browser settings.",
+            },
+            -1,
           );
 
           reject(error);
@@ -458,7 +505,9 @@ export default class PushNotificationPermission extends Vue {
   private sendSubscriptionToServer(
     subscription: PushSubscriptionWithTime,
   ): Promise<void> {
-    logConsoleAndDb("About to send subscription... " + subscription);
+    logConsoleAndDb(
+      "About to send subscription... " + JSON.stringify(subscription),
+    );
     return fetch("/web-push/subscribe", {
       method: "POST",
       headers: {

src/components/UserNameDialog.vue

@@ -46,11 +46,14 @@ import { MASTER_SETTINGS_KEY } from "@/db/tables/settings";
 export default class UserNameDialog extends Vue {
   $notify!: (notification: NotificationIface, timeout?: number) => void;
 
-  callback: (name?: string) => void = () => {};
+  callback: (name: string) => void = () => {};
   givenName = "";
   visible = false;
 
-  async open(aCallback?: (name?: string) => void) {
+  /**
+   * @param aCallback - callback function for name, which may be ""
+   */
+  async open(aCallback?: (name: string) => void) {
     this.callback = aCallback || this.callback;
     const settings = await retrieveSettingsForActiveAccount();
     this.givenName = settings.firstName || "";