Skip to content

Commit

Permalink
notifications adjustments
Browse files Browse the repository at this point in the history
  • Loading branch information
@ybizeul
ybizeul committed Oct 12, 2024
1 parent 504a6c9 commit bfa23ed
Show file tree
Hide file tree
Showing 3 changed files with 123 additions and 67 deletions.
2 changes: 0 additions & 2 deletions web/ui/src/APIClient.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -53,14 +53,12 @@ export class APIClient {

get(path: string, auth?: AxiosBasicCredentials) {
return new Promise<unknown>((resolve, reject) => {
console.log(this.baseURL + path)
this.request({
url: this.baseURL + path,
method: 'GET',
auth,
})
.then((result) => {
console.log(result)
resolve(result)
})
.catch(e => {
Expand Down
103 changes: 47 additions & 56 deletions web/ui/src/YBFeed/Components/YBNotificationToggleComponent.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ import { YBFeedConnector } from '../'

import { defaultNotificationProps } from '../config';

import { Subscribe } from '../../notifications';
import { Subscribe, Subscribed, Unsubscribe } from '../../notifications';

interface NotificationToggleProps {
vapid: string
Expand All @@ -21,6 +21,24 @@ export function YBNotificationToggleComponent(props:NotificationToggleProps) {
const [loading,setLoading] = useState(false)
const [canPushNotifications, setCanPushNotification] = useState(false)

useEffect(() => {
navigator.serviceWorker.getRegistration()
.then((registration) => {
console.log("got registration", registration)
if (! registration) {
return
}
setCanPushNotification(registration.pushManager !== undefined)
})
},[])

useEffect(() => {
Subscribed()
.then((registration) => {
console.log("got registration", registration)
setNotificationsOn(registration)
})
},[])
// const subscribe = (): Promise<boolean> => {
// return new Promise((resolve, reject) => {
// if (!vapid) {
Expand Down Expand Up @@ -61,36 +79,37 @@ export function YBNotificationToggleComponent(props:NotificationToggleProps) {
// })
// }

async function unsubscribe(): Promise<boolean> {
return new Promise((resolve, reject) => {
if (!vapid) {
reject("VAPID not declared")
}
const connection = new YBFeedConnector()

navigator.serviceWorker.ready
.then((registration) => {
return registration.pushManager.getSubscription()
})
.then(function(subscription) {
if (!subscription) {
reject("Unable to unsubscribe (empty subscription)")
return
}
subscription.unsubscribe()
connection.RemoveSubscription(feedName,JSON.stringify(subscription))
.then(() => {
resolve(true)
})
})
.catch(err => console.error(err));
})
}
// async function unsubscribe(): Promise<boolean> {
// return new Promise((resolve, reject) => {
// if (!vapid) {
// reject("VAPID not declared")
// }
// const connection = new YBFeedConnector()

// navigator.serviceWorker.ready
// .then((registration) => {
// return registration.pushManager.getSubscription()
// })
// .then(function(subscription) {
// if (!subscription) {
// reject("Unable to unsubscribe (empty subscription)")
// return
// }
// subscription.unsubscribe()
// connection.RemoveSubscription(feedName,JSON.stringify(subscription))
// .then(() => {
// resolve(true)
// })
// })
// .catch(err => console.error(err));
// })
// }

const toggleNotifications = () => {
console.log("toggle notification")
if ('serviceWorker' in navigator) {
console.log("get registration for", window.location.href)
const connection = new YBFeedConnector()

navigator.serviceWorker.getRegistration(window.location.href)
.then((registration) => {
Expand All @@ -112,7 +131,6 @@ export function YBNotificationToggleComponent(props:NotificationToggleProps) {
console.log("got subscription", subscription)
if (s.endpoint) {
setNotificationsOn(true)
const connection = new YBFeedConnector()
connection.AddSubscription(feedName,JSON.stringify(subscription))
.then(() => {
console.log("subscription added")
Expand All @@ -131,8 +149,9 @@ export function YBNotificationToggleComponent(props:NotificationToggleProps) {

if (notificationsOn) {
console.log("unsubscribing")
unsubscribe()
Unsubscribe()
.then(() => {
connection.RemoveSubscription(feedName,JSON.stringify(subscription))
console.log("done")
setNotificationsOn(false)
})
Expand Down Expand Up @@ -161,34 +180,6 @@ export function YBNotificationToggleComponent(props:NotificationToggleProps) {
}
}

useEffect(() => {
if ('serviceWorker' in navigator && feedName) {
console.log("registering service worker")
navigator.serviceWorker.register('/service-worker.js',{scope: "/" + feedName})
.then((registration) => {
console.log("got registration", registration)
if (! registration) {
return
}
setCanPushNotification(registration.pushManager !== undefined)
if (registration.scope === window.location.href) {
if (registration.pushManager) {
return registration.pushManager.getSubscription();
}
}
})
.then((subscription) => {
console.log("got subscription", subscription)
if (subscription) {
setNotificationsOn(true)
}
})
.catch(error => {
console.error('Service Worker registration failed:', error);
})
}
})

console.log("render YBNotificationToggleComponent")

return(
Expand Down
85 changes: 76 additions & 9 deletions web/ui/src/notifications.ts
View file
Original file line number Diff line number Diff line change
@@ -1,31 +1,98 @@
if ('serviceWorker' in navigator) {
console.log("registering service worker")
navigator.serviceWorker.register('/service-worker.js')
.then((registration) => {
console.log("got registration", registration)
if (! registration) {
return
}
// setCanPushNotification(registration.pushManager !== undefined)
// if (registration.scope === window.location.href) {
// if (registration.pushManager) {
// return registration.pushManager.getSubscription();
// }
// }
})
// .then((subscription) => {
// console.log("got subscription", subscription)
// if (subscription) {
// setNotificationsOn(true)
// }
// })
.catch(error => {
console.error('Service Worker registration failed:', error);
})
}

export function Subscribe(vapid: string) {
return new Promise((resolve, reject) => {
if (!vapid) {
reject("VAPID not declared")
}

console.log("getting registration for", window.location.href)
navigator.serviceWorker.getRegistration(window.location.href)
navigator.serviceWorker.getRegistration()
.then((registration) => {
if (!registration) {
console.log("no registration")
return
}
console.log("subscribing",vapid)
return registration.pushManager.subscribe({
registration.pushManager.subscribe({
userVisibleOnly: true,
applicationServerKey: urlBase64ToUint8Array(vapid),
});
}).then(
(subscription) => {
console.log("got subscription", subscription)
if (!subscription) {
reject("Unable to subscribe (empty subscription)")
}
resolve(subscription)
console.log("adding subscription to backend", subscription)
})
})
.then((subscription) => {
console.log("got subscription", subscription)
.catch((err) => {
reject(err)
});
})
}

export function Unsubscribe(): Promise<boolean> {
return new Promise((resolve, reject) => {
navigator.serviceWorker.ready
.then((registration) => {
return registration.pushManager.getSubscription()
})
.then(function(subscription) {
if (!subscription) {
reject("Unable to subscribe (empty subscription)")
reject(new Error("Unable to unsubscribe (empty subscription)"))
return
}
resolve(subscription)
console.log("adding subscription to backend", subscription)
subscription.unsubscribe()
resolve(true)
})
.catch((err) => {
.catch(err => {
console.error(err)
reject(err)
});
})
}

export function Subscribed(): Promise<boolean> {
return new Promise((resolve, reject) => {
navigator.serviceWorker.ready
.then((registration) => {
return registration.pushManager.getSubscription()
})
.then(function(subscription) {
if (!subscription) {
resolve(false)
return
}
resolve(true)
})
.catch(err => {
console.error(err)
reject(err)
});
})
Expand Down

0 comments on commit bfa23ed

Please sign in to comment.