added toast notifications

frontend/app.vue

@@ -26,9 +26,11 @@ import { getAuth, onAuthStateChanged, signInWithEmailAndPassword } from "firebas
 import { getMessaging, getToken, onMessage } from "firebase/messaging";
 import { PushNotifications } from '@capacitor/push-notifications';
 import { Device } from '@capacitor/device';
+import { useToast } from 'vue-toastification'
 
 const db = getFirestore()
 const route = useRoute()
+const toast = useToast()
 
 const isAuthenticated = ref(false)
 const user = ref('frikandel')
@@ -108,13 +110,9 @@ const setupNotifications = () => {
     PushNotifications.requestPermissions().then(result => {
       if (result.receive === 'granted') {
         // Register with Apple / Google to receive push via APNS/FCM
-        PushNotifications.register().then(() => {
-          FCM.subscribeTo({ topic: "all" })
-            .then((r) => alert(`Subscribed to topick all`))
-            .catch((err) => console.log(err));
-        });
+        PushNotifications.register()
       } else {
-        // Show some error
+        toast.error('Error tijdens het registrenen van push notificaties')
       }
     });
 
@@ -122,7 +120,7 @@ const setupNotifications = () => {
     PushNotifications.addListener('registration',
       (token) => {
         // alert('Push registration success, token: ' + token.value);
-	registrationToken.value = token
+	      registrationToken.value = token
 
 
       	fetch('https://api.xeovalyte.com/subscribetotopic', {
@@ -138,6 +136,7 @@ const setupNotifications = () => {
         	})
         	.catch(err => {
           		console.log(err)
+              toast.error('Error tijdens het registreren van push notificaties')
         	});
       }
     );
@@ -145,28 +144,20 @@ const setupNotifications = () => {
     // Some issue with our setup and push will not work
     PushNotifications.addListener('registrationError',
       (error) => {
-        // alert('Error on registration: ' + JSON.stringify(error));
+        toast.error('Error tijdens het registreren van push notificaties')
+
+        console.log(error)
       }
     );
 
     // Show us the notification payload if the app is open on our device
     PushNotifications.addListener('pushNotificationReceived',
       (notification) => {
-        const { show, onClick } = useWebNotification({
-          title: notification.title,
-          body: notification.body,
-          icon: '/ios/256.png',
-          dir: 'auto',
-          lang: 'en',
-          renotify: true,
-          tag: 'wrbapp',
+
+        toast.info(`${notification.title}`, {
+          onClick: () => navigateTo('/news')
         })
 
-        show()
-
-        onClick.on((event) => {
-          navigateTo('/news')
-        })
       }
     );
 
@@ -214,22 +205,10 @@ const registerSW = () => {
   onMessage(messaging.value, (payload) => {
     console.log('Message received. ', payload);
 
-    const { show, onClick } = useWebNotification({
-      title: payload.notification.title,
-      body: payload.notification.body,
-      icon: '/ios/256.png',
-      dir: 'auto',
-      lang: 'en',
-      renotify: true,
-      tag: 'wrbapp',
+    toast.info(`${payload.notification.title}`, {
+      onClick: () => navigateTo('/news')
     })
 
-    onClick.on((event) => {
-      navigateTo('/news')
-    })
-
-    show()
-
   });
 }