delete all if no id sent. proper managment and handling of subs

components/PwaManager.tsx

@@ -2,6 +2,7 @@ import React, { useEffect, useState } from 'react';
 import common from '../src/helpers/common'; // Ensure this path is correct
 //use session to get user role
 import { useSession } from "next-auth/react"
+import e from 'express';
 
 function PwaManager() {
     const [deferredPrompt, setDeferredPrompt] = useState(null);
@@ -240,6 +241,32 @@ function PwaManager() {
         });
     }
 
+    async function deleteAllSubscriptions(event: MouseEvent<HTMLButtonElement, MouseEvent>): Promise<void> {
+        event.preventDefault();
+        await fetch(`/api/notify`,
+            {
+                method: 'DELETE',
+                headers: {
+                    'Content-Type': 'application/json'
+                },
+                //send the current subscription to be removed
+                body: JSON.stringify({ id: session.user.id })
+            }
+        ).then(async response => {
+            if (!response.ok) {
+                throw new Error('Failed to delete subscription data on server.');
+            }
+            else {
+                console.log('ALL subscriptions data deleted on server.');
+                if (subscription) {
+                    await subscription.unsubscribe();
+                }
+                setSubscription(null);
+                setIsSubscribed(false);
+            }
+        });
+    }
+
     return (
         <>
             <div>
@@ -260,6 +287,12 @@ function PwaManager() {
                     className={`text-xs py-1 px-2 rounded-full focus:outline-none transition duration-150 ease-in-out ${isSubscribed ? 'bg-red-500 hover:bg-red-700 text-white' : 'bg-green-500 hover:bg-green-700 text-white'}`} >
                     {isSubscribed ? 'Unsubscribe from Notifications' : 'Subscribe to Notifications'}
                 </button>
+                <button
+                    onClick={deleteAllSubscriptions}
+                    className="text-xs py-1 px-2 rounded-full focus:outline-none bg-red-500 hover:bg-red-700 text-white"
+                >
+                    Delete All Subscriptions
+                </button>
             </div >
             <div>
                 <button
@@ -276,7 +309,7 @@ function PwaManager() {
                     className={`text-xs py-1 px-2 rounded-full focus:outline-none transition duration-150 ease-in-out ${!isSubscribed ? 'cursor-not-allowed bg-gray-300 text-gray-500' : 'bg-yellow-500 hover:bg-yellow-600 text-white'
                         }`}
                 >
-                    Send Reminder
+                    Broadcast Reminder
                 </button>
                 <button
                     onClick={sendTestCoverMe}
@@ -284,7 +317,7 @@ function PwaManager() {
                     className={`text-xs py-1 px-2 rounded-full focus:outline-none transition duration-150 ease-in-out ${!isSubscribed ? 'cursor-not-allowed bg-gray-300 text-gray-500' : 'bg-yellow-500 hover:bg-yellow-600 text-white'
                         }`}
                 >
-                    Send CoverMe
+                    Broadcast CoverMe
                 </button>
 
                 {notificationPermission !== "granted" && (