From 78d901328261d2306cf59c8e83fc217a63aa4a64 Mon Sep 17 00:00:00 2001
From: Owen Jacobson <owen@grimoire.ca>
Date: Sun, 26 Oct 2025 16:46:04 -0400
Subject: Add a button to the client to set up a push subscription.

Once a user has set up a push subscription, the client will re-establish it as needed whenever possible, falling back to manual intervention only when it is unable to create a push subscription.

This change imposes some architectural changes to the client, though they're not huge: the `session` type now includes a body of state (`push`) whose methods also call into the Pilcrow API. Previously, calls to the API were not made within the `session` types, and were instead only made by page and layout code, but orchestrating that for the push subscription lifecycle proved too complex to deal with. This is an experimental alternative, but it might be something we explore further in the future.
---
 ui/routes/(app)/me/+page.svelte | 12 ++++++++++++
 1 file changed, 12 insertions(+)

(limited to 'ui/routes/(app)')

diff --git a/ui/routes/(app)/me/+page.svelte b/ui/routes/(app)/me/+page.svelte
index 0c960c8..ddb1245 100644
--- a/ui/routes/(app)/me/+page.svelte
+++ b/ui/routes/(app)/me/+page.svelte
@@ -2,10 +2,16 @@
   import LogOut from '$lib/components/LogOut.svelte';
   import Invites from '$lib/components/Invites.svelte';
   import ChangePassword from '$lib/components/ChangePassword.svelte';
+  import PushSubscription from '$lib/components/PushSubscription.svelte';
 
   import { goto } from '$app/navigation';
   import * as api from '$lib/apiServer.js';
 
+  const { data } = $props();
+  const { session } = data;
+  const subscription = $derived(session.push.subscription);
+  const vapid = $derived(session.push.vapidKey);
+
   let invites = $state([]);
 
   async function logOut() {
@@ -25,10 +31,16 @@
       invites.push(response.data);
     }
   }
+
+  async function subscribe() {
+    await session.push.subscribe();
+  }
 </script>
 
 <ChangePassword {changePassword} />
 <hr />
+<PushSubscription {subscription} {vapid} {subscribe} />
+<hr />
 <Invites {invites} {createInvite} />
 <hr />
 <LogOut {logOut} />
-- 
cgit v1.2.3