atagen

malice

public
Star0
Watch0
20fe182f3204e4d4923607816147c3fa0ae4cccc
2
ssh://brewery@pls.lobotomise.me:33/atagen/malice.git

Blame: web/src/lib/notifications.ts

db4e552594cbatagen2026-10-26 04:43 UTC1
import { get, writable } from 'svelte/store';
db4e552594cbatagen2026-10-26 04:43 UTC2
import { mediaUrl } from './api';
db4e552594cbatagen2026-10-26 04:43 UTC3
import {
db4e552594cbatagen2026-10-26 04:43 UTC4
  arrivalIn,
db4e552594cbatagen2026-10-26 04:43 UTC5
  type Arrival,
db4e552594cbatagen2026-10-26 04:43 UTC6
  badgeTotal,
db4e552594cbatagen2026-10-26 04:43 UTC7
  isRoomWatched,
db4e552594cbatagen2026-10-26 04:43 UTC8
  notifyingCount,
db4e552594cbatagen2026-10-26 04:43 UTC9
  planNotification,
db4e552594cbatagen2026-10-26 04:43 UTC10
  roomTag,
db4e552594cbatagen2026-10-26 04:43 UTC11
  sourceFromSummary,
db4e552594cbatagen2026-10-26 04:43 UTC12
  sourceFromTimeline,
db4e552594cbatagen2026-10-26 04:43 UTC13
  type NotificationPlan
db4e552594cbatagen2026-10-26 04:43 UTC14
} from './notification-model';
20fe182f3204atagen2026-10-26 05:50 UTC15
import { effectiveRooms } from './mute';
20fe182f3204atagen2026-10-26 05:50 UTC16
import { selectedRoomId, sessionUser, timelines } from './store';
db4e552594cbatagen2026-10-26 04:43 UTC17
import type { RoomSummary } from './types';
db4e552594cbatagen2026-10-26 04:43 UTC18
db4e552594cbatagen2026-10-26 04:43 UTC19
const SETTLE_MS = 300;
db4e552594cbatagen2026-10-26 04:43 UTC20
db4e552594cbatagen2026-10-26 04:43 UTC21
export const OPEN_ROOM_MESSAGE = 'malice-open-room';
db4e552594cbatagen2026-10-26 04:43 UTC22
db4e552594cbatagen2026-10-26 04:43 UTC23
export type NotificationPermissionState = NotificationPermission | 'unsupported';
db4e552594cbatagen2026-10-26 04:43 UTC24
db4e552594cbatagen2026-10-26 04:43 UTC25
const supported = typeof Notification !== 'undefined';
db4e552594cbatagen2026-10-26 04:43 UTC26
const preferenceKey = (account: string) => `malice.notifications.${account}`;
db4e552594cbatagen2026-10-26 04:43 UTC27
db4e552594cbatagen2026-10-26 04:43 UTC28
export const notificationsEnabled = writable(false);
db4e552594cbatagen2026-10-26 04:43 UTC29
export const notificationPermission = writable<NotificationPermissionState>(supported ? Notification.permission : 'unsupported');
db4e552594cbatagen2026-10-26 04:43 UTC30
db4e552594cbatagen2026-10-26 04:43 UTC31
function readPreference(account: string | null | undefined): boolean {
db4e552594cbatagen2026-10-26 04:43 UTC32
  if (!account) return false;
db4e552594cbatagen2026-10-26 04:43 UTC33
  try {
db4e552594cbatagen2026-10-26 04:43 UTC34
    return localStorage.getItem(preferenceKey(account)) === '1';
db4e552594cbatagen2026-10-26 04:43 UTC35
  } catch {
db4e552594cbatagen2026-10-26 04:43 UTC36
    return false;
db4e552594cbatagen2026-10-26 04:43 UTC37
  }
db4e552594cbatagen2026-10-26 04:43 UTC38
}
db4e552594cbatagen2026-10-26 04:43 UTC39
db4e552594cbatagen2026-10-26 04:43 UTC40
function writePreference(account: string, enabled: boolean): void {
db4e552594cbatagen2026-10-26 04:43 UTC41
  try {
db4e552594cbatagen2026-10-26 04:43 UTC42
    localStorage.setItem(preferenceKey(account), enabled ? '1' : '0');
db4e552594cbatagen2026-10-26 04:43 UTC43
  } catch {}
db4e552594cbatagen2026-10-26 04:43 UTC44
}
db4e552594cbatagen2026-10-26 04:43 UTC45
db4e552594cbatagen2026-10-26 04:43 UTC46
/** Must run inside a user gesture, since browsers refuse the permission prompt otherwise. */
db4e552594cbatagen2026-10-26 04:43 UTC47
export async function enableNotifications(): Promise<void> {
db4e552594cbatagen2026-10-26 04:43 UTC48
  const account = get(sessionUser);
db4e552594cbatagen2026-10-26 04:43 UTC49
  if (!supported || !account) return;
db4e552594cbatagen2026-10-26 04:43 UTC50
  const result = Notification.permission === 'default' ? await Notification.requestPermission() : Notification.permission;
db4e552594cbatagen2026-10-26 04:43 UTC51
  notificationPermission.set(result);
db4e552594cbatagen2026-10-26 04:43 UTC52
  const on = result === 'granted';
db4e552594cbatagen2026-10-26 04:43 UTC53
  writePreference(account, on);
db4e552594cbatagen2026-10-26 04:43 UTC54
  notificationsEnabled.set(on);
db4e552594cbatagen2026-10-26 04:43 UTC55
}
db4e552594cbatagen2026-10-26 04:43 UTC56
db4e552594cbatagen2026-10-26 04:43 UTC57
export function disableNotifications(): void {
db4e552594cbatagen2026-10-26 04:43 UTC58
  const account = get(sessionUser);
db4e552594cbatagen2026-10-26 04:43 UTC59
  if (account) writePreference(account, false);
db4e552594cbatagen2026-10-26 04:43 UTC60
  notificationsEnabled.set(false);
db4e552594cbatagen2026-10-26 04:43 UTC61
}
db4e552594cbatagen2026-10-26 04:43 UTC62
db4e552594cbatagen2026-10-26 04:43 UTC63
function active(): boolean {
db4e552594cbatagen2026-10-26 04:43 UTC64
  return supported && get(notificationsEnabled) && Notification.permission === 'granted';
db4e552594cbatagen2026-10-26 04:43 UTC65
}
db4e552594cbatagen2026-10-26 04:43 UTC66
db4e552594cbatagen2026-10-26 04:43 UTC67
async function registration(): Promise<ServiceWorkerRegistration | null> {
db4e552594cbatagen2026-10-26 04:43 UTC68
  if (!('serviceWorker' in navigator) || !navigator.serviceWorker.controller) return null;
db4e552594cbatagen2026-10-26 04:43 UTC69
  try {
db4e552594cbatagen2026-10-26 04:43 UTC70
    return await navigator.serviceWorker.ready;
db4e552594cbatagen2026-10-26 04:43 UTC71
  } catch {
db4e552594cbatagen2026-10-26 04:43 UTC72
    return null;
db4e552594cbatagen2026-10-26 04:43 UTC73
  }
db4e552594cbatagen2026-10-26 04:43 UTC74
}
db4e552594cbatagen2026-10-26 04:43 UTC75
db4e552594cbatagen2026-10-26 04:43 UTC76
async function show(plan: NotificationPlan, openRoom: (roomId: string) => void): Promise<void> {
db4e552594cbatagen2026-10-26 04:43 UTC77
  const icon = mediaUrl(plan.iconMxc, 128) ?? undefined;
db4e552594cbatagen2026-10-26 04:43 UTC78
  const options: NotificationOptions & { renotify?: boolean } = {
db4e552594cbatagen2026-10-26 04:43 UTC79
    body: plan.body,
db4e552594cbatagen2026-10-26 04:43 UTC80
    tag: plan.tag,
db4e552594cbatagen2026-10-26 04:43 UTC81
    icon,
db4e552594cbatagen2026-10-26 04:43 UTC82
    renotify: plan.renotify,
db4e552594cbatagen2026-10-26 04:43 UTC83
    data: { roomId: plan.roomId }
db4e552594cbatagen2026-10-26 04:43 UTC84
  };
db4e552594cbatagen2026-10-26 04:43 UTC85
  const reg = await registration();
db4e552594cbatagen2026-10-26 04:43 UTC86
  if (reg) {
db4e552594cbatagen2026-10-26 04:43 UTC87
    await reg.showNotification(plan.title, options);
db4e552594cbatagen2026-10-26 04:43 UTC88
    return;
db4e552594cbatagen2026-10-26 04:43 UTC89
  }
db4e552594cbatagen2026-10-26 04:43 UTC90
  const note = new Notification(plan.title, options);
db4e552594cbatagen2026-10-26 04:43 UTC91
  note.onclick = () => {
db4e552594cbatagen2026-10-26 04:43 UTC92
    window.focus();
db4e552594cbatagen2026-10-26 04:43 UTC93
    openRoom(plan.roomId);
db4e552594cbatagen2026-10-26 04:43 UTC94
    note.close();
db4e552594cbatagen2026-10-26 04:43 UTC95
  };
db4e552594cbatagen2026-10-26 04:43 UTC96
}
db4e552594cbatagen2026-10-26 04:43 UTC97
db4e552594cbatagen2026-10-26 04:43 UTC98
async function closeRoom(roomId: string): Promise<void> {
db4e552594cbatagen2026-10-26 04:43 UTC99
  const reg = await registration();
db4e552594cbatagen2026-10-26 04:43 UTC100
  if (!reg) return;
db4e552594cbatagen2026-10-26 04:43 UTC101
  for (const note of await reg.getNotifications({ tag: roomTag(roomId) })) note.close();
db4e552594cbatagen2026-10-26 04:43 UTC102
}
db4e552594cbatagen2026-10-26 04:43 UTC103
db4e552594cbatagen2026-10-26 04:43 UTC104
function setBadge(total: number): void {
db4e552594cbatagen2026-10-26 04:43 UTC105
  const nav = navigator as Navigator & { setAppBadge?: (n: number) => Promise<void>; clearAppBadge?: () => Promise<void> };
db4e552594cbatagen2026-10-26 04:43 UTC106
  if (total > 0) void nav.setAppBadge?.(total).catch(() => undefined);
db4e552594cbatagen2026-10-26 04:43 UTC107
  else void nav.clearAppBadge?.().catch(() => undefined);
db4e552594cbatagen2026-10-26 04:43 UTC108
}
db4e552594cbatagen2026-10-26 04:43 UTC109
db4e552594cbatagen2026-10-26 04:43 UTC110
/** Watches room summaries for notifying unread increases, shows and clears notifications, and keeps the app badge current. */
db4e552594cbatagen2026-10-26 04:43 UTC111
export function startNotifications(openRoom: (roomId: string) => void): () => void {
db4e552594cbatagen2026-10-26 04:43 UTC112
  let previous = new Map<string, RoomSummary>();
db4e552594cbatagen2026-10-26 04:43 UTC113
  let notified = new Set<string>();
db4e552594cbatagen2026-10-26 04:43 UTC114
  let badge = -1;
db4e552594cbatagen2026-10-26 04:43 UTC115
db4e552594cbatagen2026-10-26 04:43 UTC116
  const unsubscribeSession = sessionUser.subscribe((account) => notificationsEnabled.set(readPreference(account)));
db4e552594cbatagen2026-10-26 04:43 UTC117
db4e552594cbatagen2026-10-26 04:43 UTC118
  void registration().then(async (reg) => {
db4e552594cbatagen2026-10-26 04:43 UTC119
    for (const note of (await reg?.getNotifications()) ?? []) {
db4e552594cbatagen2026-10-26 04:43 UTC120
      const roomId = (note.data as { roomId?: unknown } | null)?.roomId;
db4e552594cbatagen2026-10-26 04:43 UTC121
      if (typeof roomId === 'string') notified.add(roomId);
db4e552594cbatagen2026-10-26 04:43 UTC122
    }
db4e552594cbatagen2026-10-26 04:43 UTC123
  });
db4e552594cbatagen2026-10-26 04:43 UTC124
db4e552594cbatagen2026-10-26 04:43 UTC125
  const watched = (roomId: string) =>
db4e552594cbatagen2026-10-26 04:43 UTC126
    isRoomWatched(roomId, get(selectedRoomId), document.visibilityState === 'visible', document.hasFocus());
db4e552594cbatagen2026-10-26 04:43 UTC127
db4e552594cbatagen2026-10-26 04:43 UTC128
  const clearRead = (list: RoomSummary[]) => {
db4e552594cbatagen2026-10-26 04:43 UTC129
    for (const room of list) {
db4e552594cbatagen2026-10-26 04:43 UTC130
      if (notified.has(room.room_id) && (notifyingCount(room) === 0 || watched(room.room_id))) {
db4e552594cbatagen2026-10-26 04:43 UTC131
        notified.delete(room.room_id);
db4e552594cbatagen2026-10-26 04:43 UTC132
        void closeRoom(room.room_id);
db4e552594cbatagen2026-10-26 04:43 UTC133
      }
db4e552594cbatagen2026-10-26 04:43 UTC134
    }
db4e552594cbatagen2026-10-26 04:43 UTC135
  };
db4e552594cbatagen2026-10-26 04:43 UTC136
db4e552594cbatagen2026-10-26 04:43 UTC137
  const waiting = new Map<string, Arrival & { timer: ReturnType<typeof setTimeout> }>();
db4e552594cbatagen2026-10-26 04:43 UTC138
db4e552594cbatagen2026-10-26 04:43 UTC139
  const queue = (roomId: string, mention: boolean) => {
db4e552594cbatagen2026-10-26 04:43 UTC140
    clearTimeout(waiting.get(roomId)?.timer);
db4e552594cbatagen2026-10-26 04:43 UTC141
    const timer = setTimeout(() => {
db4e552594cbatagen2026-10-26 04:43 UTC142
      waiting.delete(roomId);
20fe182f3204atagen2026-10-26 05:50 UTC143
      const room = get(effectiveRooms).find((r) => r.room_id === roomId);
db4e552594cbatagen2026-10-26 04:43 UTC144
      if (!room || !active() || watched(roomId) || notifyingCount(room) === 0) return;
db4e552594cbatagen2026-10-26 04:43 UTC145
      const source = sourceFromTimeline(get(timelines)[roomId]) ?? sourceFromSummary(room);
db4e552594cbatagen2026-10-26 04:43 UTC146
      notified.add(roomId);
db4e552594cbatagen2026-10-26 04:43 UTC147
      void show(planNotification(room, source, { mention }), openRoom);
db4e552594cbatagen2026-10-26 04:43 UTC148
    }, SETTLE_MS);
db4e552594cbatagen2026-10-26 04:43 UTC149
    waiting.set(roomId, { mention, timer });
db4e552594cbatagen2026-10-26 04:43 UTC150
  };
db4e552594cbatagen2026-10-26 04:43 UTC151
db4e552594cbatagen2026-10-26 04:43 UTC152
  const onRooms = (list: RoomSummary[]) => {
db4e552594cbatagen2026-10-26 04:43 UTC153
    const next = new Map(list.map((room) => [room.room_id, room]));
db4e552594cbatagen2026-10-26 04:43 UTC154
    const prior = previous;
db4e552594cbatagen2026-10-26 04:43 UTC155
    previous = next;
db4e552594cbatagen2026-10-26 04:43 UTC156
    if (!active()) {
db4e552594cbatagen2026-10-26 04:43 UTC157
      if (badge !== 0) setBadge((badge = 0));
db4e552594cbatagen2026-10-26 04:43 UTC158
      return;
db4e552594cbatagen2026-10-26 04:43 UTC159
    }
db4e552594cbatagen2026-10-26 04:43 UTC160
    const total = badgeTotal(list);
db4e552594cbatagen2026-10-26 04:43 UTC161
    if (total !== badge) setBadge((badge = total));
db4e552594cbatagen2026-10-26 04:43 UTC162
    const now = Date.now();
db4e552594cbatagen2026-10-26 04:43 UTC163
    for (const room of list) {
db4e552594cbatagen2026-10-26 04:43 UTC164
      const arrival = arrivalIn(prior.get(room.room_id), room, now);
db4e552594cbatagen2026-10-26 04:43 UTC165
      if (!arrival || watched(room.room_id)) continue;
db4e552594cbatagen2026-10-26 04:43 UTC166
      queue(room.room_id, arrival.mention || (waiting.get(room.room_id)?.mention ?? false));
db4e552594cbatagen2026-10-26 04:43 UTC167
    }
db4e552594cbatagen2026-10-26 04:43 UTC168
    clearRead(list);
db4e552594cbatagen2026-10-26 04:43 UTC169
  };
db4e552594cbatagen2026-10-26 04:43 UTC170
20fe182f3204atagen2026-10-26 05:50 UTC171
  const unsubscribeRooms = effectiveRooms.subscribe(onRooms);
20fe182f3204atagen2026-10-26 05:50 UTC172
  const unsubscribeEnabled = notificationsEnabled.subscribe(() => onRooms(get(effectiveRooms)));
20fe182f3204atagen2026-10-26 05:50 UTC173
  const onAttention = () => clearRead(get(effectiveRooms));
db4e552594cbatagen2026-10-26 04:43 UTC174
  const onMessage = (ev: MessageEvent) => {
db4e552594cbatagen2026-10-26 04:43 UTC175
    const data = ev.data as { type?: unknown; roomId?: unknown } | null;
db4e552594cbatagen2026-10-26 04:43 UTC176
    if (data?.type === OPEN_ROOM_MESSAGE && typeof data.roomId === 'string') openRoom(data.roomId);
db4e552594cbatagen2026-10-26 04:43 UTC177
  };
db4e552594cbatagen2026-10-26 04:43 UTC178
  window.addEventListener('focus', onAttention);
db4e552594cbatagen2026-10-26 04:43 UTC179
  document.addEventListener('visibilitychange', onAttention);
db4e552594cbatagen2026-10-26 04:43 UTC180
  const unsubscribeSelected = selectedRoomId.subscribe(onAttention);
db4e552594cbatagen2026-10-26 04:43 UTC181
  if ('serviceWorker' in navigator) navigator.serviceWorker.addEventListener('message', onMessage);
db4e552594cbatagen2026-10-26 04:43 UTC182
db4e552594cbatagen2026-10-26 04:43 UTC183
  return () => {
db4e552594cbatagen2026-10-26 04:43 UTC184
    unsubscribeSession();
db4e552594cbatagen2026-10-26 04:43 UTC185
    unsubscribeRooms();
db4e552594cbatagen2026-10-26 04:43 UTC186
    unsubscribeEnabled();
db4e552594cbatagen2026-10-26 04:43 UTC187
    unsubscribeSelected();
db4e552594cbatagen2026-10-26 04:43 UTC188
    for (const { timer } of waiting.values()) clearTimeout(timer);
db4e552594cbatagen2026-10-26 04:43 UTC189
    window.removeEventListener('focus', onAttention);
db4e552594cbatagen2026-10-26 04:43 UTC190
    document.removeEventListener('visibilitychange', onAttention);
db4e552594cbatagen2026-10-26 04:43 UTC191
    if ('serviceWorker' in navigator) navigator.serviceWorker.removeEventListener('message', onMessage);
db4e552594cbatagen2026-10-26 04:43 UTC192
  };
db4e552594cbatagen2026-10-26 04:43 UTC193
}