@log-drop/web 1.0.0-alpha1

package/dist/logdrop-sw.js

@@ -0,0 +1,372 @@
+// LogDrop Service Worker v1
+// Handles: push events, notification clicks, subscription changes, ping/pong handshake
+
+const LOGDROP_SW_VERSION = '1';
+
+// install: skip waiting so new SW activates immediately
+self.addEventListener('install', () => self.skipWaiting());
+
+// activate: claim all clients immediately
+self.addEventListener('activate', (event) => event.waitUntil(self.clients.claim()));
+
+// message: respond to ping/pong handshake from PushModule
+self.addEventListener('message', (event) => {
+  if (event.data && event.data.type === 'logdrop:ping') {
+    // Reply to the specific client that sent the ping
+    if (event.source && typeof event.source.postMessage === 'function') {
+      event.source.postMessage({ type: 'logdrop:pong', version: LOGDROP_SW_VERSION });
+    }
+  } else if (event.data && event.data.type === 'logdrop:push-config') {
+    event.waitUntil(storePushConfig(event.data.config || {}));
+  } else if (event.data && event.data.type === 'logdrop:drain-pending') {
+    event.waitUntil(drainPendingPushes(event.source));
+  }
+});
+
+// push: show notification
+self.addEventListener('push', (event) => {
+  event.waitUntil(handlePush(event).catch(err => {
+    console.error('[logdrop-sw] push handler error:', err);
+  }));
+});
+
+/**
+ * Display a notification derived from a push event payload, normalizing formats and handling actions.
+ *
+ * Parses the incoming PushEvent payload (attempting JSON, falling back to text), supports both
+ * Firebase-style `{ notification: { ... }, data: { ... } }` and flat `{ title, body, data }` shapes,
+ * normalizes `title`, `body`, `tag`, `requireInteraction`, `image`, and `silent`, maps provided
+ * action buttons into Notification actions and records an `actionUrls` lookup in `options.data`,
+ * then shows the notification via the ServiceWorker registration.
+ *
+ * @param {PushEvent} event - The push event containing an optional payload; if JSON parsing fails,
+ *                            the payload falls back to `{ title: 'LogDrop', body: <text> }`.
+ */
+async function handlePush(event) {
+  let payload = {};
+  try {
+    if (event.data) {
+      payload = event.data.json();
+    }
+  } catch {
+    payload = { title: 'LogDrop', body: event.data ? event.data.text() : '' };
+  }
+
+  const clients = await self.clients.matchAll({ type: 'window', includeUncontrolled: true });
+  for (const client of clients) {
+    try { client.postMessage({ type: 'logdrop:push-received', payload }); } catch { /* ignore */ }
+  }
+  if (clients.length === 0) {
+    await storePendingMessage('logdrop:push-received', payload);
+  }
+
+  // Data-only actions are delivered to open pages immediately or persisted for
+  // the next page load. Visible notifications continue through the code below.
+  if (payload.silent === true && !payload.notification && !payload.title && !payload.body) {
+    return;
+  }
+
+  // Support both FCM console format { notification: { title, body }, data: {} }
+  // and our flat format { title, body, data: {} }
+  const notification = payload.notification || payload;
+  const title = notification.title || payload.title || 'LogDrop Notification';
+  const options = {
+    body: notification.body || payload.body || '',
+    tag: notification.tag || payload.tag || 'logdrop',
+    data: payload.data || payload,
+    requireInteraction: notification.requireInteraction || payload.requireInteraction || false,
+  };
+
+  // Action buttons — store action URLs in data so notificationclick can route them
+  if (Array.isArray(notification.actions || payload.actions)) {
+    const actions = notification.actions || payload.actions;
+    options.actions = actions.map(a => ({ action: a.action, title: a.title, icon: a.icon })).filter(a => a.action && a.title);
+    // Store action URL map in data for click routing
+    const actionUrls = {};
+    actions.forEach(a => { if (a.action && a.url) actionUrls[a.action] = a.url; });
+    options.data = { ...(options.data || {}), actionUrls };
+  }
+
+  if (notification.image || payload.image) options.image = notification.image || payload.image;
+  if (notification.silent || payload.silent) options.silent = true;
+
+  await self.registration.showNotification(title, options);
+}
+
+// notificationclick: handle user clicking the notification
+self.addEventListener('notificationclick', (event) => {
+  event.notification.close();
+  event.waitUntil(handleNotificationClick(event));
+});
+
+/**
+ * Handle a notification click by broadcasting the click to open window clients, then focusing or opening the appropriate page and performing best-effort click tracking.
+ *
+ * Broadcasts the click to open clients, honors doNothing, and routes deeplinks according to their browser mode.
+ * @param {NotificationEvent} event - The notification click event containing `notification.data` and an optional `action` identifier.
+ */
+async function handleNotificationClick(event) {
+  const data = event.notification.data || {};
+  const actionUrls = data.actionUrls || {};
+  const action = data.action && typeof data.action === 'object' ? data.action : {};
+  const doNothing = data.click && data.click.doNothing === true;
+  const rawUrl = (event.action && actionUrls[event.action]) || action.target || data.url || null;
+
+  // 1. Post message to all open page clients so PushModule can invoke onRemoteMessageReceived
+  const clients = await self.clients.matchAll({ type: 'window', includeUncontrolled: true });
+  for (const client of clients) {
+    try {
+      client.postMessage({ type: 'logdrop:notification-click', payload: data, action: event.action || null });
+    } catch { /* ignore */ }
+  }
+  if (clients.length === 0) {
+    try { await storePendingMessage('logdrop:notification-click', data); } catch { /* best effort */ }
+  }
+
+  // doNothing still reports the click, but must not focus or open a page.
+  if (doNothing) return;
+
+  // 2. Only navigate if a URL was explicitly provided
+  if (!rawUrl) {
+    if (clients.length > 0) await clients[0].focus();
+    else await self.clients.openWindow(self.location.origin);
+    return;
+  }
+
+  const url = rawUrl.startsWith('/') || /^[a-z][a-z0-9+.-]*:/i.test(rawUrl)
+    ? rawUrl
+    : 'https://' + rawUrl;
+  const externalBrowser = String(action.deeplinkMode || '').toUpperCase() === 'EXTERNAL_BROWSER';
+
+  // 3. EXTERNAL_BROWSER opens a new page. INLINE/INTERNAL_BROWSER reuse an
+  // existing page when possible, matching mobile's single-app navigation.
+  try {
+    if (externalBrowser || clients.length === 0) {
+      await self.clients.openWindow(url);
+    } else {
+      const client = clients[0];
+      await client.focus();
+      if (typeof client.navigate === 'function') await client.navigate(url);
+    }
+  } catch (err) {
+    const fallback = action.fallbackTarget;
+    if (fallback) {
+      try { await self.clients.openWindow(fallback); } catch { /* ignore */ }
+    } else {
+      console.error('[logdrop-sw] navigation failed:', err);
+    }
+  }
+
+  // 4. Best-effort click tracking (fire-and-forget)
+  if (data.clickTrackingUrl) {
+    try {
+      await fetch(data.clickTrackingUrl, { method: 'POST', keepalive: true });
+    } catch { /* ignore — tracking is non-critical */ }
+  }
+}
+
+// pushsubscriptionchange: re-subscribe when browser rotates subscription
+self.addEventListener('pushsubscriptionchange', (event) => {
+  event.waitUntil(handleSubscriptionChange(event));
+});
+
+/**
+ * Re-subscribes after browser rotation and persists the new subscription through the same protobuf users/update flow used by the SDKs.
+ *
+ * Attempts to load stored push configuration from IndexedDB; if required auth or VAPID data is missing, the next page init performs reconciliation.
+ * @param {PushSubscriptionChangeEvent} event - The subscription change event from the Service Worker.
+ */
+async function handleSubscriptionChange(event) {
+  // Retrieve stored config from IndexedDB (set by PushModule via postMessage on init)
+  // If unavailable, we cannot re-subscribe automatically without the VAPID key.
+  let config = null;
+  try {
+    config = await getStoredPushConfig();
+  } catch { /* ignore */ }
+
+  if (!config || !config.vapidPublicKey || !config.apiBase || !config.apiKey ||
+      !config.sessionToken || !config.deviceUuid) {
+    // Cannot re-subscribe without config — the next page load will handle it
+    return;
+  }
+
+  const applicationServerKey = urlBase64ToUint8Array(config.vapidPublicKey);
+  const subscription = await self.registration.pushManager.subscribe({
+    userVisibleOnly: true,
+    applicationServerKey,
+  });
+
+  const subscriptionPayload = subscription.toJSON();
+  const body = encodeWebPushUserUpdate(config.deviceUuid, subscriptionPayload);
+  const response = await fetch(`${config.apiBase}/users/update`, {
+    method: 'POST',
+    headers: {
+      'Content-Type': 'application/x-protobuf',
+      'Accept': 'application/x-protobuf',
+      'x-api-key': config.apiKey,
+      'x-session-token': config.sessionToken,
+    },
+    body,
+    keepalive: true,
+  });
+  if (!response.ok) throw new Error(`Web Push subscription sync failed: HTTP ${response.status}`);
+}
+
+function encodeWebPushUserUpdate(deviceUuid, subscription) {
+  const writeVarint = (target, value) => {
+    let remaining = Math.max(0, Math.floor(Number(value) || 0));
+    while (remaining > 0x7f) {
+      target.push((remaining % 128) | 0x80);
+      remaining = Math.floor(remaining / 128);
+    }
+    target.push(remaining);
+  };
+  const writeTag = (target, field, wireType) => writeVarint(target, (field << 3) | wireType);
+  const writeString = (target, field, value) => {
+    if (!value) return;
+    const bytes = new TextEncoder().encode(String(value));
+    writeTag(target, field, 2);
+    writeVarint(target, bytes.length);
+    target.push(...bytes);
+  };
+  const writeInt64 = (target, field, value) => {
+    if (!Number.isSafeInteger(value) || value <= 0) return;
+    writeTag(target, field, 0);
+    writeVarint(target, value);
+  };
+  const writeMessage = (target, field, bytes) => {
+    if (!bytes.length) return;
+    writeTag(target, field, 2);
+    writeVarint(target, bytes.length);
+    target.push(...bytes);
+  };
+
+  const keys = subscription.keys || {};
+  const webPush = [];
+  writeString(webPush, 1, subscription.endpoint);
+  writeString(webPush, 2, keys.p256dh);
+  writeString(webPush, 3, keys.auth);
+  writeInt64(webPush, 4, Number(subscription.expirationTime));
+
+  const device = [];
+  writeString(device, 1, deviceUuid);
+  writeString(device, 12, 'WEB');
+  writeMessage(device, 16, webPush);
+
+  const request = [];
+  writeMessage(request, 2, device);
+  return new Uint8Array(request);
+}
+
+// ---------------------------------------------------------------------------
+// Config storage via IndexedDB
+// Used by pushsubscriptionchange to re-subscribe without page context
+// ---------------------------------------------------------------------------
+
+const IDB_NAME = 'logdrop-push';
+const IDB_STORE = 'config';
+const IDB_KEY = 'push-config';
+const IDB_PENDING_STORE = 'pending';
+
+/**
+ * Open (or create) the IndexedDB database used for push configuration.
+ *
+ * Creates the required object store on database upgrade and resolves with the open IDBDatabase instance.
+ * @returns {Promise<IDBDatabase>} A promise that resolves with the opened IndexedDB database, or rejects with the underlying error.
+ */
+function openConfigDB() {
+  return new Promise((resolve, reject) => {
+    const req = self.indexedDB.open(IDB_NAME, 2);
+    req.onupgradeneeded = (e) => {
+      const db = e.target.result;
+      if (!db.objectStoreNames.contains(IDB_STORE)) db.createObjectStore(IDB_STORE);
+      if (!db.objectStoreNames.contains(IDB_PENDING_STORE)) {
+        db.createObjectStore(IDB_PENDING_STORE, { autoIncrement: true });
+      }
+    };
+    req.onsuccess = (e) => resolve(e.target.result);
+    req.onerror = (e) => reject(e.target.error);
+  });
+}
+
+/**
+ * Retrieve the stored push configuration from IndexedDB.
+ *
+ * Reads the value stored under IDB_KEY in the IDB_STORE object store and resolves
+ * with that object or `null` if no value is present.
+ *
+ * @returns {Promise<Object|null>} The stored push configuration object, or `null` if not found.
+ * @throws {DOMException|Error} Rejects with the underlying IndexedDB error if the read operation fails.
+ */
+async function getStoredPushConfig() {
+  const db = await openConfigDB();
+  return new Promise((resolve, reject) => {
+    const tx = db.transaction(IDB_STORE, 'readonly');
+    const req = tx.objectStore(IDB_STORE).get(IDB_KEY);
+    req.onsuccess = (e) => resolve(e.target.result ?? null);
+    req.onerror = (e) => reject(e.target.error);
+  });
+}
+
+async function storePushConfig(config) {
+  const db = await openConfigDB();
+  return new Promise((resolve, reject) => {
+    const tx = db.transaction(IDB_STORE, 'readwrite');
+    tx.objectStore(IDB_STORE).put(config, IDB_KEY);
+    tx.oncomplete = () => resolve();
+    tx.onerror = () => reject(tx.error);
+  });
+}
+
+async function storePendingMessage(type, payload) {
+  const db = await openConfigDB();
+  return new Promise((resolve, reject) => {
+    const tx = db.transaction(IDB_PENDING_STORE, 'readwrite');
+    tx.objectStore(IDB_PENDING_STORE).add({ type, payload });
+    tx.oncomplete = () => resolve();
+    tx.onerror = () => reject(tx.error);
+  });
+}
+
+async function drainPendingPushes(client) {
+  if (!client || typeof client.postMessage !== 'function') return;
+  const db = await openConfigDB();
+  const payloads = await new Promise((resolve, reject) => {
+    const tx = db.transaction(IDB_PENDING_STORE, 'readwrite');
+    const store = tx.objectStore(IDB_PENDING_STORE);
+    const req = store.getAll();
+    req.onsuccess = () => {
+      const values = req.result || [];
+      store.clear();
+      resolve(values);
+    };
+    req.onerror = () => reject(req.error);
+  });
+  for (const message of payloads) {
+    client.postMessage({
+      type: message && message.type ? message.type : 'logdrop:push-received',
+      payload: message && Object.prototype.hasOwnProperty.call(message, 'payload')
+        ? message.payload
+        : message,
+    });
+  }
+}
+
+// ---------------------------------------------------------------------------
+// Helpers
+/**
+ * Convert a URL-safe Base64 string into a Uint8Array of decoded bytes.
+ * @param {string} base64String - URL-safe Base64 (may use '-' and '_' and may be missing padding).
+ * @returns {Uint8Array} The decoded bytes.
+ */
+
+function urlBase64ToUint8Array(base64String) {
+  const padding = '='.repeat((4 - base64String.length % 4) % 4);
+  const base64 = (base64String + padding).replace(/-/g, '+').replace(/_/g, '/');
+  const rawData = self.atob(base64);
+  const output = new Uint8Array(rawData.length);
+  for (let i = 0; i < rawData.length; i++) {
+    output[i] = rawData.charCodeAt(i);
+  }
+  return output;
+}