Remove subscriptions from server when disabled

Author: ybizeul

internal/feed/feedConfig.go

@@ -133,6 +133,23 @@ func (config *FeedConfig) AddSubscription(s webpush.Subscription) error {
 	return nil
 }
 
+func (config *FeedConfig) DeleteSubscription(s webpush.Subscription) error {
+	keepSubscriptions := []webpush.Subscription{}
+
+	for _, t := range config.Subscriptions {
+		if s.Endpoint == t.Endpoint && s.Keys.Auth == t.Keys.Auth && s.Keys.P256dh == t.Keys.P256dh {
+			continue
+		}
+		keepSubscriptions = append(keepSubscriptions, t)
+	}
+	config.Subscriptions = keepSubscriptions
+	err := config.Write()
+	if err != nil {
+		return err
+	}
+	return nil
+}
+
 func (p *PIN) IsValid(s string) error {
 	if p.Expiration.Before(time.Now()) {
 		code := 401

internal/handlers/handlers.go

@@ -167,6 +167,7 @@ func (api *ApiHandler) GetServer() *chi.Mux {
 		r.Delete("/{feedName}/{itemName}", api.feedItemDeleteHandlerFunc)
 
 		r.Post("/{feedName}/subscription", api.feedSubscriptionHandlerFunc)
+		r.Delete("/{feedName}/subscription", api.feedUnsubscribeHandlerFunc)
 	})
 	r.Get("/*", RootHandlerFunc)
 
@@ -352,12 +353,14 @@ func (api *ApiHandler) feedPostHandlerFunc(w http.ResponseWriter, r *http.Reques
 
 	// Send push notifications
 	for _, subscription := range f.Config.Subscriptions {
+		slog.Info("Sending push notification", slog.String("endpoint", subscription.Endpoint))
 		resp, _ := webpush.SendNotification([]byte(fmt.Sprintf("New item posted to feed %s", f.Name())), &subscription, &webpush.Options{
 			Subscriber:      "example@example.com", // Do not include "mailto:"
 			VAPIDPublicKey:  api.Config.NotificationSettings.VAPIDPublicKey,
 			VAPIDPrivateKey: api.Config.NotificationSettings.VAPIDPrivateKey,
 			TTL:             30,
 		})
+		slog.Info("Response", slog.Any("resp", resp))
 		defer resp.Body.Close()
 	}
 
@@ -456,3 +459,56 @@ func (api *ApiHandler) feedSubscriptionHandlerFunc(w http.ResponseWriter, r *htt
 		return
 	}
 }
+
+func (api *ApiHandler) feedUnsubscribeHandlerFunc(w http.ResponseWriter, r *http.Request) {
+
+	slog.Default().WithGroup("http").Debug("Feed subscription request", slog.Any("request", r))
+
+	secret, _ := utils.GetSecret(r)
+
+	feedName, _ := url.QueryUnescape(chi.URLParam(r, "feedName"))
+	if feedName == "" {
+		utils.CloseWithCodeAndMessage(w, 500, "Unable to obtain feed name")
+	}
+
+	f, err := feed.GetFeed(path.Join(api.BasePath, feedName))
+
+	if err != nil {
+		yberr := err.(*feed.FeedError)
+		utils.CloseWithCodeAndMessage(w, yberr.Code, yberr.Error())
+		return
+	}
+
+	err = f.IsSecretValid(secret)
+
+	if err != nil {
+		yberr := err.(*feed.FeedError)
+		utils.CloseWithCodeAndMessage(w, yberr.Code, yberr.Error())
+		return
+	}
+
+	body, err := io.ReadAll(r.Body)
+
+	defer r.Body.Close()
+
+	if err != nil {
+		utils.CloseWithCodeAndMessage(w, 500, "Unable to read subscription")
+		return
+	}
+
+	var s webpush.Subscription
+
+	err = json.Unmarshal(body, &s)
+
+	if err != nil {
+		utils.CloseWithCodeAndMessage(w, 500, "Unable to parse subscription")
+		return
+	}
+
+	err = f.Config.DeleteSubscription(s)
+
+	if err != nil {
+		utils.CloseWithCodeAndMessage(w, 500, "Unable to add subscription")
+		return
+	}
+}

web/ui/src/YBFeed/YBNotificationToggle.tsx

@@ -18,6 +18,7 @@ export function NotificationToggle(props:NotificationToggleProps) {
     const [notificationsOn,setNotificationsOn] = useState(false)
     const [loading,setLoading] = useState(false)
     const [canPushNotifications, setCanPushNotification] = useState(false)
+
     async function subscribe(): Promise<Boolean> {
         return new Promise((resolve, reject) => {
             if (!vapid) {
@@ -46,7 +47,32 @@ export function NotificationToggle(props:NotificationToggleProps) {
                 .catch(err => console.error(err));
         })
     }
-  
+    async function unsubscribe(): Promise<Boolean> {
+        return new Promise((resolve, reject) => {
+            if (!vapid) {
+                reject("VAPID not declared")
+            }
+            const connection = new FeedConnector()
+
+            navigator.serviceWorker.ready
+                .then(function(registration) {  
+                    return registration.pushManager.getSubscription()
+                })
+                .then(function(subscription) {
+                    if (subscription) {
+                        subscription.unsubscribe()
+                        connection.RemoveSubscription(feedName,JSON.stringify(subscription))
+                            .then((r) => {
+                                resolve(true)
+                            })
+                    }
+                    else {
+                        reject("Unable to unsubscribe (empty subscription)")
+                    }
+                })
+                .catch(err => console.error(err));
+        })
+    }
     function urlBase64ToUint8Array(base64String: string) {
         const padding = '='.repeat((4 - (base64String.length % 4)) % 4);
         const base64 = (base64String + padding)
@@ -66,15 +92,9 @@ export function NotificationToggle(props:NotificationToggleProps) {
                 .then(function(subscription) {
                     if (subscription) {
                         if (notificationsOn) {
-                            subscription.unsubscribe()
-                                .then((b) => {
-                                    if (b) {
-                                        setNotificationsOn(false)
-                                    }
-                                })
-                                .catch((e) => {
-                                    console.log(e)
-                                    message.error("Error")
+                            unsubscribe()
+                                .then(() => {
+                                    setNotificationsOn(false)
                                 })
                         }
                     }

web/ui/src/YBFeed/index.ts

@@ -165,4 +165,28 @@ export class FeedConnector {
             })
         })
     }
+    async RemoveSubscription(feedName: string, subscription: any): Promise<boolean> {
+        return new Promise((resolve, reject) => {
+            fetch(this.feedUrl(feedName)+"/subscription",{
+                method: "DELETE",
+                credentials: "include",
+                body: subscription
+            })
+            .then((f) => {
+                if (f.status !== 200) {
+                    f.text().then((b) => {
+                        reject(new YBFeedError(f.status, b))
+                    })
+                    .catch((e) => {
+                        reject(new YBFeedError(f.status, "Server Unavailable"))
+                    })
+                }
+                resolve(true)
+            })
+            .catch((e) => {
+                reject(new YBFeedError(e.status, "Server Unavailable"))
+            })
+        })
+    }
+
 }