update notif engine

Signed-off-by: Vishal <[email protected]>

src/pages/Notification/index.tsx

@@ -3,7 +3,11 @@ import { ErrorContext } from "@/contexts/error";
 import API from "@/services/API";
 import { INotification } from "@/types/notification";
 import React, { useEffect, useState } from "react";
-import { Notification, BgService } from "./notification-engine";
+import {
+  setup_notification,
+  disable_notification,
+  setup_present,
+} from "./notification-engine";
 
 interface NotificationCardProps {
   notif: INotification;
@@ -57,8 +61,11 @@ export default function NotificationPage() {
   const { setError } = React.useContext(ErrorContext);
 
   const [notifications, setNotifs] = useState<INotification[]>(null);
+  const [status, setStatus] = useState<boolean>(false);
 
   useEffect(() => {
+    setup_present().then(setStatus);
+
     const notifications = "/notification";
     API.get(notifications)
       .then((response) => {
@@ -80,34 +87,17 @@ export default function NotificationPage() {
   return (
     <div className="max-w-4xl mx-auto py-12">
       <h1>Latest Updates</h1>
-      <button onClick={Notification.requestPermission}>
-        Get alerts on Notification!
-      </button>
-      <button
-        onClick={async () => {
-          console.log("Registering service!");
-          const x = await BgService.registerServiceWorker(
-            "https://team-dev.dtutimes.com/notification-service.js",
-          );
-          console.log("Service worker registered", x);
-        }}
-      >
-        Register service worker
-      </button>
-      <button
-        onClick={async () => {
-          console.log("services: ", await BgService.getRegistration());
-        }}
-      >
-        Console log bg services
-      </button>
-      <button
-        onClick={async () => {
-          console.log("services: ", await BgService.unregisterServiceWorker());
-        }}
-      >
-        Console log bg services
-      </button>
+      <div>
+        {status ? (
+          <button className="ml-2" onClick={disable_notification}>
+            Disable Notifications
+          </button>
+        ) : (
+          <button className="mr-2" onClick={setup_notification}>
+            Get alerts on Notification!
+          </button>
+        )}
+      </div>
       {notifications.map((notif) => {
         return <NotificationCard key={notif._id} notif={notif} />;
       })}

src/pages/Notification/notification-engine.ts

@@ -1,13 +1,6 @@
-export class Notification {
+class Notification {
   static notify = window.Notification;
 
-  public static isPermissionGranted() {
-    if (!Notification.isSupported()) {
-      throw new Error("Notification API is not supported");
-    }
-    return Notification.notify.permission === "granted";
-  }
-
   public static async requestPermission() {
     if (!Notification.isSupported()) {
       throw new Error("Notification API is not supported");
@@ -17,31 +10,12 @@ export class Notification {
     return permission;
   }
 
-  public static constructNotification(
-    title: string,
-    options: NotificationOptions,
-  ) {
-    return new Notification.notify(title, options);
-  }
-
   public static isSupported() {
     return Notification.notify !== undefined;
   }
-
-  public static async displayNotification(
-    title: string,
-    options: NotificationOptions,
-  ) {
-    const permission = await Notification.requestPermission();
-    if (permission === "granted") {
-      Notification.constructNotification(title, options);
-    } else {
-      console.error("Permission denied");
-    }
-  }
 }
 
-export class BgService {
+class BgService {
   static bg = window.navigator;
 
   public static isSupported() {
@@ -55,13 +29,33 @@ export class BgService {
   }
 
   public static async unregisterServiceWorker() {
-    const registrations = await BgService.bg.serviceWorker.getRegistrations();
+    const registrations = await BgService.getRegistrations();
     registrations.forEach((registration) => registration.unregister());
     return registrations;
   }
 
-  public static async getRegistration() {
-    const registration = await BgService.bg.serviceWorker.getRegistration();
+  public static async getRegistrations() {
+    const registration = await BgService.bg.serviceWorker.getRegistrations();
+    console.log("Service worker registered", registration);
     return registration;
   }
 }
+
+export async function setup_notification() {
+  Notification.requestPermission();
+
+  const worker = await BgService.registerServiceWorker(
+    "https://team-dev.dtutimes.com/notification-service.js",
+  );
+
+  console.log("Service worker registered", worker);
+}
+
+export async function disable_notification() {
+  await BgService.unregisterServiceWorker();
+}
+
+export async function setup_present() {
+  const services = await BgService.getRegistrations();
+  return services.length > 0;
+}