add notification immediately after setting up subscription, and tweak messaging

src/views/HelpNotificationsView.vue

@@ -289,16 +289,10 @@
   </section>
 </template>
 <script lang="ts">
-import axios from "axios";
 import { Component, Vue } from "vue-facing-decorator";
 
 import QuickNav from "@/components/QuickNav.vue";
-import { db } from "@/db/index";
-import { MASTER_SETTINGS_KEY } from "@/db/tables/settings";
-import { DEFAULT_PUSH_SERVER } from "@/constants/app";
-
-// eslint-disable-next-line @typescript-eslint/no-var-requires
-const Buffer = require("buffer/").Buffer;
+import { sendTestThroughPushServer } from "@/libs/util";
 
 interface Notification {
   group: string;
@@ -346,61 +340,16 @@ export default class HelpNotificationsView extends Vue {
     }
 
     try {
-      await db.open();
-      const settings = await db.settings.get(MASTER_SETTINGS_KEY);
-      let pushUrl: string = DEFAULT_PUSH_SERVER as string;
-      if (settings?.webPushServer) {
-        pushUrl = settings.webPushServer;
-      }
-
-      // This is a special value that tells the service worker to send a direct notification to the device, skipping filters.
-      // This is shared with the service worker and should be a constant. Look for the same name in additional-scripts.js
-      // Use something other than "Daily Update" https://gitea.anomalistdesign.com/trent_larson/py-push-server/src/commit/3c0e196c11bc98060ec5934e99e7dbd591b5da4d/app.py#L213
-      const DIRECT_PUSH_TITLE = "DIRECT_NOTIFICATION";
-
-      const auth = Buffer.from(this.subscription.getKey("auth"));
-      const authB64 = auth
-        .toString("base64")
-        .replace(/\+/g, "-")
-        .replace(/\//g, "_")
-        .replace(/=+$/, "");
-      const p256dh = Buffer.from(this.subscription.getKey("p256dh"));
-      const p256dhB64 = p256dh
-        .toString("base64")
-        .replace(/\+/g, "-")
-        .replace(/\//g, "_")
-        .replace(/=+$/, "");
-      const newPayload = {
-        endpoint: this.subscription.endpoint,
-        keys: {
-          auth: authB64,
-          p256dh: p256dhB64,
-        },
-        message: `Test, where you will see this message ${
-          skipFilter ? "un" : ""
-        }filtered.`,
-        title: skipFilter ? DIRECT_PUSH_TITLE : "Your Web Push",
-      };
-      console.log("Sending a test web push message:", newPayload);
-      const payloadStr = JSON.stringify(newPayload);
-      const response = await axios.post(
-        pushUrl + "/web-push/send-test",
-        payloadStr,
-        {
-          headers: {
-            "Content-Type": "application/json",
-          },
-        },
-      );
-
-      console.log("Got response from web push server:", response);
+      await sendTestThroughPushServer(this.subscription, skipFilter);
 
       this.$notify(
         {
           group: "alert",
           type: "success",
           title: "Test Web Push Sent",
-          text: "Check your device for the test web push message, depending on the filtering you chose.",
+          text:
+            "Check your device for the test web push message" +
+            (skipFilter ? "." : " if there are new items in your feed."),
         },
         -1,
       );