1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
|
import { initializeApp } from "firebase/app";
import { getMessaging, Messaging, onMessage } from "firebase/messaging";
const firebaseConfig = {
apiKey: "AIzaSyAkxH71PlZJxhD7vuN_Q8kn3TtNnB09_cU",
authDomain: "updates-9eab8.firebaseapp.com",
projectId: "updates-9eab8",
storageBucket: "updates-9eab8.firebasestorage.app",
messagingSenderId: "347275855103",
appId: "1:347275855103:web:fb59a7504792c2736538ca"
};
const app = initializeApp(firebaseConfig);
export const messaging: Messaging = getMessaging(app);
// Handle foreground messages
export const initializeForegroundNotifications = () => {
onMessage(messaging, (payload) => {
console.log('[firebase.ts] Message received in foreground:', payload);
// Check if browser supports notifications
if (!("Notification" in window)) {
console.log("This browser does not support desktop notifications");
return;
}
// Check notification permission
if (Notification.permission === "granted") {
// Create notification
const notificationTitle = payload.notification?.title || 'New Update';
const notificationOptions: NotificationOptions = {
body: payload.notification?.body || 'You have a new notification',
icon: payload.notification?.icon || '/android/android-launchericon-192-192.png',
badge: '/android/android-launchericon-72-72.png',
tag: payload.data?.tag || 'default-tag',
requireInteraction: payload.data?.requireInteraction === 'true',
silent: false,
data: {
url: payload.data?.url || '/',
gameId: payload.data?.gameId,
...payload.data
}
};
// Add image if provided
if (payload.notification?.image) {
notificationOptions.badge = payload.notification.image;
}
// Create and show the notification
const notification = new Notification(notificationTitle, notificationOptions);
// Handle notification click
notification.onclick = (event) => {
event.preventDefault();
notification.close();
// Navigate to the URL if provided
const url = payload.data?.url || '/';
window.open(url, '_blank');
};
// Handle notification error
notification.onerror = (event) => {
console.error('[firebase.ts] Notification error:', event);
};
// Auto-close notification after 10 seconds if not require interaction
if (payload.data?.requireInteraction !== 'true') {
setTimeout(() => {
notification.close();
}, 10000);
}
} else {
console.log('[firebase.ts] Notification permission not granted');
}
});
console.log('[firebase.ts] Foreground notification handler initialized');
};
|
