diff --git a/app/entry.worker.ts b/app/entry.worker.ts
index 1f462b7..8af55b8 100644
--- a/app/entry.worker.ts
+++ b/app/entry.worker.ts
@@ -1,47 +1,29 @@
///
-import type { NotificationPayload } from "~/utils/web-push.server";
-import { addBadge, removeBadge } from "~/utils/pwa.client";
+import handleInstall from "./service-worker/install";
+import handleActivate from "./service-worker/activate";
+import handlePush from "./service-worker/push";
+import handleNotificationClick from "./service-worker/notification-click";
+import handleFetch from "./service-worker/fetch";
declare let self: ServiceWorkerGlobalScope;
-const defaultOptions: NotificationOptions = {
- icon: "/icons/android-chrome-192x192.png",
- badge: "/icons/android-chrome-48x48.png",
- dir: "auto",
- image: undefined,
- silent: false,
-};
+self.addEventListener("install", (event) => {
+ event.waitUntil(handleInstall(event).then(() => self.skipWaiting()));
+});
+
+self.addEventListener("activate", (event) => {
+ event.waitUntil(handleActivate(event).then(() => self.clients.claim()));
+});
self.addEventListener("push", (event) => {
- const { title, ...payload }: NotificationPayload = JSON.parse(event?.data!.text());
- const options = Object.assign({}, defaultOptions, payload);
- event.waitUntil(async () => {
- await self.registration.showNotification(title, options);
- await addBadge(1);
- });
+ event.waitUntil(handlePush(event));
});
self.addEventListener("notificationclick", (event) => {
- event.waitUntil(
- (async () => {
- console.log("On notification click: ", event.notification.tag);
- // Android doesn’t close the notification when you click on it
- // See: http://crbug.com/463146
- event.notification.close();
- await removeBadge();
-
- if (event.action === "reply") {
- const recipient = encodeURIComponent(event.notification.data.recipient);
- return self.clients.openWindow?.(`/messages/${recipient}`);
- }
-
- if (event.action === "answer") {
- const recipient = encodeURIComponent(event.notification.data.recipient);
- return self.clients.openWindow?.(`/incoming-call/${recipient}`);
- }
-
- return self.clients.openWindow?.("/");
- })(),
- );
+ event.waitUntil(handleNotificationClick(event));
+});
+
+self.addEventListener("fetch", (event) => {
+ event.respondWith(handleFetch(event));
});
diff --git a/app/root.tsx b/app/root.tsx
index baf0265..c10cc97 100644
--- a/app/root.tsx
+++ b/app/root.tsx
@@ -1,4 +1,4 @@
-import { type FunctionComponent, type PropsWithChildren } from "react";
+import type { FunctionComponent, PropsWithChildren } from "react";
import type { LinksFunction } from "@remix-run/node";
import { Link, Links, LiveReload, Meta, Outlet, Scripts, ScrollRestoration, useCatch } from "@remix-run/react";
diff --git a/app/routes/__app/settings/notifications.tsx b/app/routes/__app/settings/notifications.tsx
index cfbb6f2..ddd60e5 100644
--- a/app/routes/__app/settings/notifications.tsx
+++ b/app/routes/__app/settings/notifications.tsx
@@ -2,12 +2,12 @@ import type { ActionFunction } from "@remix-run/node";
import { ClientOnly } from "remix-utils";
import { Form } from "@remix-run/react";
+import db from "~/utils/db.server";
import { notify } from "~/utils/web-push.server";
import Button from "~/features/settings/components/button";
import NotificationsSettings, {
FallbackNotificationsSettings,
} from "~/features/settings/components/settings/notifications-settings";
-import db from "~/utils/db.server";
export const action: ActionFunction = async () => {
const phoneNumber = await db.phoneNumber.findUnique({
@@ -34,7 +34,7 @@ export const action: ActionFunction = async () => {
title: "Reply",
},
],
- data: { recipient: "+33613370787" },
+ data: { recipient: "+33613370787", type: "message" },
});
return null;
};
@@ -48,7 +48,7 @@ export default function Notifications() {