coracle/flotilla
1
6
Fork 24
Code Issues 34 Pull Requests 2 Actions Packages Projects 5 Releases Wiki Activity

Rework subscription storage

Browse Source
This commit is contained in:
Jon Staab
2026-01-23 16:51:02 -08:00
parent 2528e4acad
commit 646b8f8736
6 changed files with 219 additions and 170 deletions
Download Patch File Download Diff File Expand all files Collapse all files
capacitor.config.ts
+4 -4
View File
@@ -27,10 +27,10 @@ const config: CapacitorConfig = {
},
},
// Use this for live reload https://capacitorjs.com/docs/guides/live-reload
// server: {
// url: "http://192.168.1.65:1847",
// cleartext: true
// },
server: {
url: "http://192.168.1.65:1847",
cleartext: true
},
};
export default config;
src/app/core/state.ts
+23 -15
View File
@@ -42,6 +42,7 @@ import {
import {
getter,
throttled,
withGetter,
deriveArray,
makeDeriveEvent,
makeLoadItem,
@@ -278,12 +279,6 @@ export type SettingsValues = {
relay_auth: RelayAuthMode
send_delay: number
font_size: number
alerts_push: boolean
alerts_sound: boolean
alerts_badge: boolean
alerts_spaces: boolean
alerts_mentions: boolean
alerts_messages: boolean
muted_rooms: string[]
}
@@ -301,12 +296,6 @@ export const defaultSettings: SettingsValues = {
relay_auth: RelayAuthMode.Conservative,
send_delay: 0,
font_size: 1.1,
alerts_push: false,
alerts_sound: false,
alerts_badge: false,
alerts_spaces: true,
alerts_mentions: true,
alerts_messages: true,
muted_rooms: [],
}
@@ -348,9 +337,28 @@ export const relaysMostlyRestricted = writable<Record<string, string>>({})
// Push notifications
export const pushToken = writable<string | undefined>()
export const pushSecret = writable<string | undefined>()
export const notificationSettings = withGetter(
writable<{
push: boolean
sound: boolean
badge: boolean
spaces: boolean,
mentions: boolean,
messages: boolean,
token?: string
subscription?: {
key: string
callback: string
}
}>({
push: false,
sound: false,
badge: false,
spaces: true,
mentions: true,
messages: true,
})
)
// Chats
src/app/util/notifications.ts
+127 -90
View File
@@ -69,8 +69,7 @@ import {
MESSAGE_KINDS,
PUSH_BRIDGE,
PUSH_SERVER,
pushToken,
pushSecret,
notificationSettings,
chatsById,
hasNip29,
getSettings,
@@ -335,56 +334,86 @@ export const clearBadges = async () => {
}
}
// Local notifications
// Push notifications
interface IPushAdapter {
request: (prompt: boolean) => Promise<string>
cancel: () => Promise<void>
request: (prompt?: boolean) => Promise<string>
enable: () => Promise<void>
disable: () => Promise<void>
start: () => Unsubscriber
}
class CapacitorNotifications implements IPushAdapter {
async sync(signal: AbortSignal) {
const token = get(pushToken)
PushNotifications.addListener(
"pushNotificationActionPerformed",
async (action: ActionPerformed) => {
console.log('====== action', JSON.stringify(action))
const event = parseJson(action.notification.data.event)
const relays = [action.notification.data.relay]
if (!token) {
return
goto(await getEventPath(event, relays))
},
)
class CapacitorNotifications implements IPushAdapter {
async request(prompt = true) {
let status = await PushNotifications.checkPermissions()
if (prompt && status.receive === "prompt") {
status = await PushNotifications.requestPermissions()
}
const info: Maybe<{
secret: string
callback: string
}> = await tryCatch(async () => {
const secret = get(pushSecret)
if (status.receive !== "granted") {
return status.receive
}
if (secret) {
const res = await fetch(buildUrl(PUSH_SERVER, "subscription", secret), {signal})
let {token} = notificationSettings.get()
if (res.ok) {
const {callback} = await res.json()
if (!token) {
PushNotifications.addListener("registration", ({value}: Token) => {
token = value
})
if (callback) {
return {secret, callback}
} else {
pushSecret.set(undefined)
}
}
}
PushNotifications.addListener("registrationError", (error: RegistrationError) => {
console.error(error)
})
const ios = Capacitor.getPlatform() === "ios"
const channel = ios ? "apns" : "fcm"
const url = buildUrl(PUSH_SERVER, "subscription", channel)
const json = await postJson(url, {token}, {signal})
await Promise.all([
PushNotifications.register(),
poll({
condition: () => Boolean(token),
signal: AbortSignal.timeout(5000),
}),
])
if (json) {
pushSecret.set(json.sk)
notificationSettings.update(assoc('token', token))
}
return {secret: json.sk, callback: json.callback}
}
})
return token ? "granted" : "denied"
}
if (!info) {
return
async syncServer(signal: AbortSignal) {
const {token} = notificationSettings.get()
if (!token) {
throw new Error("Attempted to sync push server without a token")
}
const channel = Capacitor.getPlatform() === "ios" ? "apns" : "fcm"
const url = buildUrl(PUSH_SERVER, "subscription", channel)
const json = await postJson(url, {token}, {signal})
if (json?.callback && json?.id) {
notificationSettings.update(assoc('subscription', json))
} else {
console.warn("Failed to register with push server")
}
}
async syncRelays(signal: AbortSignal) {
const {subscription} = notificationSettings.get()
if (!subscription) {
throw new Error("Attempted to sync relays without a subscription")
}
const canPush = (relay?: RelayProfile) =>
@@ -402,19 +431,23 @@ class CapacitorNotifications implements IPushAdapter {
}
}
const syncSubscription = async (
const syncRelay = async (
key: string,
relay: string,
filters: Filter[],
ignore: Filter[] = [],
) => {
if (signal.aborted) {
return
}
const stuff = await getPushStuff(relay)
if (!stuff) {
console.warn(`Failed to subscribe ${relay} to ${key} notifications: unsupported`)
} else {
const {url, pubkey} = stuff
const identifier = String(hash(info.callback + relay + key))
const identifier = String(hash(subscription.callback + relay + key))
const thunk = publishThunk({
signal,
@@ -426,7 +459,7 @@ class CapacitorNotifications implements IPushAdapter {
pubkey,
JSON.stringify([
["relay", relay],
["callback", info.callback],
["callback", subscription.callback],
...ignore.map(filter => ["ignore", JSON.stringify(filter)]),
...filters.map(filter => ["filter", JSON.stringify(filter)]),
]),
@@ -451,7 +484,7 @@ class CapacitorNotifications implements IPushAdapter {
const filters = [{kinds: MESSAGE_KINDS}, makeCommentFilter(CONTENT_KINDS)]
const ignore = [{"#h": [muted_rooms]}]
syncSubscription("spaces", relay, filters, ignore)
syncRelay("spaces", relay, filters, ignore)
}
const $pubkey = pubkey.get()!
@@ -459,59 +492,56 @@ class CapacitorNotifications implements IPushAdapter {
for (const relay of getPubkeyRelays($pubkey, RelayMode.Messaging)) {
const filters = [{kinds: DM_KINDS, "#p": [$pubkey]}]
syncSubscription("messages", relay, filters)
syncRelay("messages", relay, filters)
}
}
async request(prompt = true) {
let status = await PushNotifications.checkPermissions()
if (prompt && status.receive === "prompt") {
status = await PushNotifications.requestPermissions()
}
if (status.receive !== "granted") {
return status.receive
}
let token = get(pushToken)
if (!token) {
PushNotifications.addListener("registration", ({value}: Token) => {
token = value
})
PushNotifications.addListener("registrationError", (error: RegistrationError) => {
console.error(error)
})
await Promise.all([
PushNotifications.register(),
poll({
condition: () => Boolean(token),
signal: AbortSignal.timeout(5000),
}),
])
pushToken.set(token)
}
return token ? "granted" : "denied"
}
start() {
const {token} = notificationSettings.get()
const controller = new AbortController()
const {signal} = controller
this.sync(controller.signal)
if (!token) {
console.warn("Attempted to start push notifications without a callback")
} else {
call(async () => {
try {
if (!notificationSettings.get().subscription) {
await this.syncServer(signal)
}
if (notificationSettings.get().subscription) {
await this.syncRelays(signal)
}
} catch (e) {
console.error(e)
}
})
}
return () => controller.abort()
}
async cancel() {
async enable() {
notificationSettings.update(assoc('push', true))
}
async disable() {
const {token, subscription, ...settings} = notificationSettings.get()
await PushNotifications.unregister()
pushSecret.set(undefined)
pushToken.set(undefined)
if (subscription) {
const res = await fetch(buildUrl(PUSH_SERVER, 'subscription', subscription.key), {
method: 'delete',
})
if (!res.ok) {
console.warn("Failed to delete push subscription")
}
}
notificationSettings.set({...settings, push: false})
}
}
@@ -550,9 +580,9 @@ class WebNotifications implements IPushAdapter {
start() {
return onNotification(event => {
const {alerts_messages, alerts_mentions, alerts_spaces} = getSettings()
const {alerts_push, alerts_messages, alerts_mentions, alerts_spaces} = getSettings()
if (document.hidden && Notification?.permission === "granted") {
if (alerts_push && document.hidden && Notification?.permission === "granted") {
if (alerts_messages && matchFilters(dmFilters, event)) {
this.notify(event, "New direct message", "Someone sent you a direct message.")
} else if (
@@ -568,14 +598,17 @@ class WebNotifications implements IPushAdapter {
})
}
async cancel() {
// pass
async enable() {
notificationSettings.update(assoc('push', true))
}
async disable() {
notificationSettings.update(assoc('push', false))
}
}
export class Push {
static _adapter: IPushAdapter | undefined
static _unsubscriber: Unsubscriber | undefined
static _getAdapter() {
if (!Push._adapter) {
@@ -600,14 +633,18 @@ export class Push {
}
})
Push._unsubscriber = () => controller.abort()
return () => controller.abort()
}
static request() {
return Push._getAdapter().request()
}
static cancel() {
return Push._getAdapter().cancel()
static enable() {
return Push._getAdapter().enable()
}
static disable() {
return Push._getAdapter().disable()
}
}
src/lib/components/Drawer.svelte
+1 -1
View File
@@ -12,7 +12,7 @@
onclick={onClose}>
</button>
<div
class="scroll-container py-sai pr-sair absolute bottom-0 right-0 top-0 w-80 overflow-auto bg-base-200 text-base-content lg:w-96"
class="scroll-container py-sai pr-sair absolute bottom-0 right-0 top-0 w-72 overflow-auto bg-base-200 text-base-content lg:w-96"
transition:translate={{axis: "x", duration: 300}}>
{@render children?.()}
</div>
src/routes/+layout.svelte
+6 -12
View File
@@ -28,7 +28,7 @@
import {setupAnalytics} from "@app/util/analytics"
import {authPolicy, blockPolicy, trustPolicy, mostlyRestrictedPolicy} from "@app/util/policies"
import {kv, db} from "@app/core/storage"
import {userSettingsValues} from "@app/core/state"
import {userSettingsValues, notificationSettings} from "@app/core/state"
import {syncApplicationData} from "@app/core/sync"
import * as commands from "@app/core/commands"
import * as requests from "@app/core/requests"
@@ -44,17 +44,6 @@
const policies = [authPolicy, blockPolicy, trustPolicy, mostlyRestrictedPolicy]
PushNotifications.addListener(
"pushNotificationActionPerformed",
async (action: ActionPerformed) => {
console.log('====== action', JSON.stringify(action))
const event = parseJson(action.notification.data.event)
const relays = [action.notification.data.relay]
goto(await getEventPath(event, relays))
},
)
// Add stuff to window for convenience
Object.assign(window, {
get,
@@ -114,6 +103,11 @@
store: shouldUnwrap,
storage: kv,
}),
sync({
key: "notificationSettings",
store: notificationSettings,
storage: kv,
}),
])
// Set up our storage adapters
src/routes/settings/alerts/+page.svelte
+58 -48
View File
@@ -1,63 +1,73 @@
<script lang="ts">
import cx from "classnames"
import {sleep, remove} from "@welshman/lib"
import {sleep, equals, remove} from "@welshman/lib"
import {displayRelayUrl} from "@welshman/util"
import {Capacitor} from "@capacitor/core"
import {Badge} from "@capawesome/capacitor-badge"
import CloseCircle from "@assets/icons/close-circle.svg?dataurl"
import {preventDefault} from "@lib/html"
import Icon from "@lib/components/Icon.svelte"
import Spinner from "@lib/components/Spinner.svelte"
import Button from "@lib/components/Button.svelte"
import RoomName from "@app/components/RoomName.svelte"
import {pushToast} from "@app/util/toast"
import {Push, clearBadges} from "@app/util/notifications"
import {userSettingsValues, splitRoomId} from "@app/core/state"
import {notificationSettings, userSettingsValues, splitRoomId} from "@app/core/state"
import {publishSettings} from "@app/core/commands"
const reset = () => {
settings = {...$userSettingsValues}
}
const onAlertsBadgeChange = () => {
if (!settings.alerts_badge) {
clearBadges()
}
}
const onAlertsPushChange = () => {
if (settings.alerts_push) {
Push.request().then(permissions => {
if (permissions !== "granted") {
sleep(300).then(() => {
settings.alerts_push = false
pushToast({
theme: "error",
message: "Failed to request notification permissions.",
})
})
}
})
}
settings = {...notificationSettings.get()}
}
const removeMutedRoom = (id: string) => {
settings.muted_rooms = remove(id, settings.muted_rooms)
muted_rooms = remove(id, muted_rooms)
}
const onsubmit = preventDefault(async () => {
await publishSettings($state.snapshot(settings))
loading = true
if (settings.alerts_push) {
await Alerts.start()
} else {
await Alerts.cancel()
try {
if (!settings.badge) {
clearBadges()
}
if (settings.push) {
const permissions = await Push.request()
if (permissions !== "granted") {
await sleep(300)
settings.push = false
pushToast({
theme: "error",
message: "Failed to request notification permissions.",
})
return
}
await Push.enable()
await Push.start()
} else {
await Push.disable()
}
if (!equals(muted_rooms, $userSettingsValues.muted_rooms)) {
publishSettings($state.snapshot({...$userSettingsValues, muted_rooms}))
}
notificationSettings.set(settings)
pushToast({message: "Your settings have been saved!"})
} finally {
loading = false
}
pushToast({message: "Your settings have been saved!"})
})
let settings = $state({...$userSettingsValues})
let loading = $state(false)
let settings = $state({...notificationSettings.get()})
let muted_rooms = $state($userSettingsValues.muted_rooms)
</script>
<form class="content column gap-4" {onsubmit}>
@@ -72,15 +82,14 @@
<input
type="checkbox"
class="toggle toggle-primary"
bind:checked={settings.alerts_badge}
onchange={onAlertsBadgeChange} />
bind:checked={settings.badge} />
</div>
{/if}
{/await}
{#if !Capacitor.isNativePlatform()}
<div class="flex justify-between">
<p>Play sound for new activity</p>
<input type="checkbox" class="toggle toggle-primary" bind:checked={settings.alerts_sound} />
<input type="checkbox" class="toggle toggle-primary" bind:checked={settings.sound} />
</div>
{/if}
<div class="flex justify-between">
@@ -88,39 +97,38 @@
<input
type="checkbox"
class="toggle toggle-primary"
bind:checked={settings.alerts_push}
onchange={onAlertsPushChange} />
bind:checked={settings.push} />
</div>
</div>
<div
class={cx("card2 bg-alt col-4 shadow-md", {
"pointer-events-none opacity-50":
!settings.alerts_badge && !settings.alerts_sound && !settings.alerts_push,
!settings.badge && !settings.sound && !settings.push,
})}>
<strong class="text-lg">Alert Types</strong>
<div class="flex justify-between">
<p>Notify me about new activity</p>
<input type="checkbox" class="toggle toggle-primary" bind:checked={settings.alerts_spaces} />
<input type="checkbox" class="toggle toggle-primary" bind:checked={settings.spaces} />
</div>
<div class="flex justify-between">
<p>Always notify me when mentioned</p>
<input type="checkbox" class="toggle toggle-primary" checked={settings.alerts_mentions} />
<input type="checkbox" class="toggle toggle-primary" checked={settings.mentions} />
</div>
<div class="flex justify-between">
<p>Notify me about new messages</p>
<input
type="checkbox"
class="toggle toggle-primary"
bind:checked={settings.alerts_messages} />
bind:checked={settings.messages} />
</div>
</div>
<div
class={cx("card2 bg-alt col-4 shadow-md", {
"pointer-events-none opacity-50":
!settings.alerts_badge && !settings.alerts_sound && !settings.alerts_push,
!settings.badge && !settings.sound && !settings.push,
})}>
<strong class="text-lg">Muted Rooms</strong>
{#each settings.muted_rooms as id (id)}
{#each muted_rooms as id (id)}
{@const [url, h] = splitRoomId(id)}
<div class="flex-inline badge badge-neutral mr-1 gap-1">
<Button class="flex items-center" onclick={() => removeMutedRoom(id)}>
@@ -133,7 +141,9 @@
{/each}
</div>
<div class="mt-4 flex flex-row items-center justify-between gap-4">
<Button class="btn btn-neutral" onclick={reset}>Discard Changes</Button>
<Button type="submit" class="btn btn-primary">Save Changes</Button>
<Button class="btn btn-neutral" onclick={reset} disabled={loading}>Discard Changes</Button>
<Button type="submit" class="btn btn-primary" disabled={loading}>
<Spinner {loading}>Save Changes</Spinner>
</Button>
</div>
</form>