From 20369cc6155e66786691e944a882949f0e186524 Mon Sep 17 00:00:00 2001
From: Jon Staab <jstaab@protonmail.com>
Date: Fri, 3 Jul 2026 17:17:57 -0700
Subject: [PATCH] Split up spacejoin settings

---
 src/app/components/SpaceInviteAccept.svelte   |  6 ++++--
 src/app/components/SpaceJoin.svelte           |  6 ++++--
 .../components/SpaceJoinNotifications.svelte  | 19 +++++++++++++++++++
 ...Settings.svelte => SpaceJoinStatus.svelte} | 14 +-------------
 4 files changed, 28 insertions(+), 17 deletions(-)
 create mode 100644 src/app/components/SpaceJoinNotifications.svelte
 rename src/app/components/{SpaceJoinSettings.svelte => SpaceJoinStatus.svelte} (61%)

diff --git a/src/app/components/SpaceInviteAccept.svelte b/src/app/components/SpaceInviteAccept.svelte
index a64641c8..1ee1cc95 100644
--- a/src/app/components/SpaceInviteAccept.svelte
+++ b/src/app/components/SpaceInviteAccept.svelte
@@ -19,7 +19,8 @@
   import ModalSubtitle from "@lib/components/ModalSubtitle.svelte"
   import ModalFooter from "@lib/components/ModalFooter.svelte"
   import RelaySummary from "@app/components/RelaySummary.svelte"
-  import SpaceJoinSettings from "@app/components/SpaceJoinSettings.svelte"
+  import SpaceJoinNotifications from "@app/components/SpaceJoinNotifications.svelte"
+  import SpaceJoinStatus from "@app/components/SpaceJoinStatus.svelte"
   import {pushToast} from "@app/toast"
   import {goToSpace} from "@app/routes"
   import {relaysMostlyRestricted} from "@app/policies"
@@ -126,7 +127,8 @@
           <div class="card flex flex-col gap-4">
             <p class="opacity-75">You're about to join:</p>
             <RelaySummary url={inviteData.url} />
-            <SpaceJoinSettings url={inviteData.url} {error} bind:notifications />
+            <SpaceJoinNotifications bind:notifications />
+            <SpaceJoinStatus url={inviteData.url} {error} />
           </div>
         </div>
       </div>
diff --git a/src/app/components/SpaceJoin.svelte b/src/app/components/SpaceJoin.svelte
index 739401c3..d6bfd482 100644
--- a/src/app/components/SpaceJoin.svelte
+++ b/src/app/components/SpaceJoin.svelte
@@ -12,7 +12,8 @@
   import ModalFooter from "@lib/components/ModalFooter.svelte"
   import RelaySummary from "@app/components/RelaySummary.svelte"
   import SpaceAccessRequest from "@app/components/SpaceAccessRequest.svelte"
-  import SpaceJoinSettings from "@app/components/SpaceJoinSettings.svelte"
+  import SpaceJoinNotifications from "@app/components/SpaceJoinNotifications.svelte"
+  import SpaceJoinStatus from "@app/components/SpaceJoinStatus.svelte"
   import {attemptRelayAccess} from "@app/relays"
   import {addSpace} from "@app/groups"
   import {broadcastUserData} from "@app/profiles"
@@ -81,7 +82,8 @@
 <Modal tag="form" onsubmit={preventDefault(join)}>
   <ModalBody>
     <RelaySummary {url} />
-    <SpaceJoinSettings {url} {error} bind:notifications />
+    <SpaceJoinNotifications bind:notifications />
+    <SpaceJoinStatus {url} {error} />
   </ModalBody>
   <ModalFooter>
     <Button class="button button-link" onclick={back} disabled={loading}>
diff --git a/src/app/components/SpaceJoinNotifications.svelte b/src/app/components/SpaceJoinNotifications.svelte
new file mode 100644
index 00000000..055cdd88
--- /dev/null
+++ b/src/app/components/SpaceJoinNotifications.svelte
@@ -0,0 +1,19 @@
+<script lang="ts">
+  type Props = {
+    notifications: boolean
+  }
+
+  let {notifications = $bindable()}: Props = $props()
+</script>
+
+<div class="card card-sm">
+  <div class="flex justify-between gap-12">
+    <div class="flex flex-col gap-1">
+      <strong>Enable notifications for this space</strong>
+      <p class="text-xs opacity-75">
+        Get notified about new activity in this space. You can change this later in settings.
+      </p>
+    </div>
+    <input type="checkbox" class="toggle" bind:checked={notifications} />
+  </div>
+</div>
diff --git a/src/app/components/SpaceJoinSettings.svelte b/src/app/components/SpaceJoinStatus.svelte
similarity index 61%
rename from src/app/components/SpaceJoinSettings.svelte
rename to src/app/components/SpaceJoinStatus.svelte
index 4e4e7774..6b988487 100644
--- a/src/app/components/SpaceJoinSettings.svelte
+++ b/src/app/components/SpaceJoinStatus.svelte
@@ -7,23 +7,11 @@
   type Props = {
     url: string
     error?: string
-    notifications: boolean
   }
 
-  let {url, error, notifications = $bindable()}: Props = $props()
+  const {url, error}: Props = $props()
 </script>
 
-<div class="card card-sm">
-  <div class="flex justify-between gap-12">
-    <div class="flex flex-col gap-1">
-      <strong>Enable notifications for this space</strong>
-      <p class="text-xs opacity-75">
-        Get notified about new activity in this space. You can change this later in settings.
-      </p>
-    </div>
-    <input type="checkbox" class="toggle" bind:checked={notifications} />
-  </div>
-</div>
 <div class="card card-sm flex flex-col gap-2">
   <div class="flex justify-between">
     <strong>Connection Status</strong>