From 08d8d45ecb7218ca1b10999262266edcd4ea4273 Mon Sep 17 00:00:00 2001
From: Jon Staab <shtaab@gmail.com>
Date: Tue, 18 Feb 2025 09:03:10 -0800
Subject: [PATCH] Refactor confirm to avoid passing closures

---
 src/app/components/ChannelMessageMenu.svelte  |  4 +--
 .../ChannelMessageMenuMobile.svelte           |  4 +--
 ...elete.svelte => EventDeleteConfirm.svelte} |  0
 src/app/components/EventMenu.svelte           |  4 +--
 src/app/components/SpaceCheck.svelte          | 16 ++--------
 src/app/components/SpaceInviteAccept.svelte   | 24 +++-----------
 src/app/components/SpaceJoinConfirm.svelte    | 32 +++++++++++++++++++
 src/app/components/SpaceVisitConfirm.svelte   | 24 ++++++++++++++
 8 files changed, 69 insertions(+), 39 deletions(-)
 rename src/app/components/{ConfirmDelete.svelte => EventDeleteConfirm.svelte} (100%)
 create mode 100644 src/app/components/SpaceJoinConfirm.svelte
 create mode 100644 src/app/components/SpaceVisitConfirm.svelte

diff --git a/src/app/components/ChannelMessageMenu.svelte b/src/app/components/ChannelMessageMenu.svelte
index d224c9ef..fe248e20 100644
--- a/src/app/components/ChannelMessageMenu.svelte
+++ b/src/app/components/ChannelMessageMenu.svelte
@@ -4,7 +4,7 @@
   import Icon from "@lib/components/Icon.svelte"
   import EventInfo from "@app/components/EventInfo.svelte"
   import EventReport from "@app/components/EventReport.svelte"
-  import ConfirmDelete from "@app/components/ConfirmDelete.svelte"
+  import EventDeleteConfirm from "@app/components/EventDeleteConfirm.svelte"
   import {pushModal} from "@app/modal"
 
   const {url, event, onClick} = $props()
@@ -21,7 +21,7 @@
 
   const showDelete = () => {
     onClick()
-    pushModal(ConfirmDelete, {url, event})
+    pushModal(EventDeleteConfirm, {url, event})
   }
 </script>
 
diff --git a/src/app/components/ChannelMessageMenuMobile.svelte b/src/app/components/ChannelMessageMenuMobile.svelte
index d952cd7d..8a362725 100644
--- a/src/app/components/ChannelMessageMenuMobile.svelte
+++ b/src/app/components/ChannelMessageMenuMobile.svelte
@@ -6,7 +6,7 @@
   import Icon from "@lib/components/Icon.svelte"
   import EmojiPicker from "@lib/components/EmojiPicker.svelte"
   import EventInfo from "@app/components/EventInfo.svelte"
-  import ConfirmDelete from "@app/components/ConfirmDelete.svelte"
+  import EventDeleteConfirm from "@app/components/EventDeleteConfirm.svelte"
   import {publishReaction} from "@app/commands"
   import {pushModal} from "@app/modal"
 
@@ -26,7 +26,7 @@
 
   const showInfo = () => pushModal(EventInfo, {event}, {replaceState: true})
 
-  const showDelete = () => pushModal(ConfirmDelete, {url, event})
+  const showDelete = () => pushModal(EventDeleteConfirm, {url, event})
 </script>
 
 <div class="col-2">
diff --git a/src/app/components/ConfirmDelete.svelte b/src/app/components/EventDeleteConfirm.svelte
similarity index 100%
rename from src/app/components/ConfirmDelete.svelte
rename to src/app/components/EventDeleteConfirm.svelte
diff --git a/src/app/components/EventMenu.svelte b/src/app/components/EventMenu.svelte
index b9c9f7de..1bef798c 100644
--- a/src/app/components/EventMenu.svelte
+++ b/src/app/components/EventMenu.svelte
@@ -7,7 +7,7 @@
   import EventInfo from "@app/components/EventInfo.svelte"
   import EventReport from "@app/components/EventReport.svelte"
   import EventShare from "@app/components/EventShare.svelte"
-  import ConfirmDelete from "@app/components/ConfirmDelete.svelte"
+  import EventDeleteConfirm from "@app/components/EventDeleteConfirm.svelte"
   import {pushModal} from "@app/modal"
 
   const {
@@ -41,7 +41,7 @@
 
   const showDelete = () => {
     onClick()
-    pushModal(ConfirmDelete, {url, event})
+    pushModal(EventDeleteConfirm, {url, event})
   }
 </script>
 
diff --git a/src/app/components/SpaceCheck.svelte b/src/app/components/SpaceCheck.svelte
index 06ff7750..66330c6d 100644
--- a/src/app/components/SpaceCheck.svelte
+++ b/src/app/components/SpaceCheck.svelte
@@ -1,36 +1,26 @@
 <script lang="ts">
   import {onMount} from "svelte"
-  import {goto} from "$app/navigation"
   import {ctx, sleep} from "@welshman/lib"
   import {displayRelayUrl} from "@welshman/util"
   import {preventDefault} from "@lib/html"
   import Icon from "@lib/components/Icon.svelte"
   import Button from "@lib/components/Button.svelte"
   import Spinner from "@lib/components/Spinner.svelte"
-  import Confirm from "@lib/components/Confirm.svelte"
   import ModalHeader from "@lib/components/ModalHeader.svelte"
   import ModalFooter from "@lib/components/ModalFooter.svelte"
+  import SpaceVisitConfirm, {confirmSpaceVisit} from "@app/components/SpaceVisitConfirm.svelte"
   import {attemptRelayAccess} from "@app/commands"
-  import {makeSpacePath} from "@app/routes"
   import {pushModal} from "@app/modal"
 
   const {url} = $props()
 
-  const path = makeSpacePath(url)
-
   const back = () => history.back()
 
-  const confirm = () => goto(path, {replaceState: true})
-
   const next = () => {
     if (!error && ctx.net.pool.get(url).stats.lastAuth === 0) {
-      pushModal(Confirm, {
-        confirm,
-        message: `This space does not appear to limit who can post to it. This can result
-                  in a large amount of spam or other objectionable content. Continue?`,
-      })
+      pushModal(SpaceVisitConfirm, {url}, {replaceState: true})
     } else {
-      confirm()
+      confirmSpaceVisit(url)
     }
   }
 
diff --git a/src/app/components/SpaceInviteAccept.svelte b/src/app/components/SpaceInviteAccept.svelte
index 8db039ea..86cfa2ad 100644
--- a/src/app/components/SpaceInviteAccept.svelte
+++ b/src/app/components/SpaceInviteAccept.svelte
@@ -1,5 +1,4 @@
 <script lang="ts">
-  import {goto} from "$app/navigation"
   import {ctx, tryCatch} from "@welshman/lib"
   import {isRelayUrl, normalizeRelayUrl} from "@welshman/util"
   import {preventDefault} from "@lib/html"
@@ -7,27 +6,16 @@
   import Button from "@lib/components/Button.svelte"
   import Field from "@lib/components/Field.svelte"
   import Icon from "@lib/components/Icon.svelte"
-  import Confirm from "@lib/components/Confirm.svelte"
   import ModalHeader from "@lib/components/ModalHeader.svelte"
   import ModalFooter from "@lib/components/ModalFooter.svelte"
   import InfoRelay from "@app/components/InfoRelay.svelte"
+  import SpaceJoinConfirm, {confirmSpaceJoin} from "@app/components/SpaceJoinConfirm.svelte"
   import {pushToast} from "@app/toast"
   import {pushModal} from "@app/modal"
-  import {addSpaceMembership, attemptRelayAccess} from "@app/commands"
-  import {makeSpacePath} from "@app/routes"
+  import {attemptRelayAccess} from "@app/commands"
 
   const back = () => history.back()
 
-  const confirm = async (url: string) => {
-    await addSpaceMembership(url)
-
-    goto(makeSpacePath(url), {replaceState: true})
-
-    pushToast({
-      message: "Welcome to the space!",
-    })
-  }
-
   const joinRelay = async (invite: string) => {
     const [raw, claim] = invite.split("|")
     const url = normalizeRelayUrl(raw)
@@ -40,13 +28,9 @@
     const connection = ctx.net.pool.get(url)
 
     if (connection.stats.lastAuth === 0) {
-      pushModal(Confirm, {
-        confirm: () => confirm(url),
-        message: `This space does not appear to limit who can post to it. This can result
-                  in a large amount of spam or other objectionable content. Continue?`,
-      })
+      pushModal(SpaceJoinConfirm, {url}, {replaceState: true})
     } else {
-      await confirm(url)
+      await confirmSpaceJoin(url)
     }
   }
 
diff --git a/src/app/components/SpaceJoinConfirm.svelte b/src/app/components/SpaceJoinConfirm.svelte
new file mode 100644
index 00000000..e5eb11c5
--- /dev/null
+++ b/src/app/components/SpaceJoinConfirm.svelte
@@ -0,0 +1,32 @@
+<script module lang="ts">
+  import {goto} from "$app/navigation"
+  import {makeSpacePath} from "@app/routes"
+  import {addSpaceMembership} from "@app/commands"
+  import {pushToast} from "@app/toast"
+
+  export const confirmSpaceJoin = async (url: string) => {
+    await addSpaceMembership(url)
+
+    goto(makeSpacePath(url), {replaceState: true})
+
+    pushToast({
+      message: "Welcome to the space!",
+    })
+  }
+</script>
+
+<script lang="ts">
+  import Confirm from "@lib/components/Confirm.svelte"
+
+  type Props = {
+    url: string
+  }
+
+  const {url}: Props = $props()
+
+  const confirm = () => confirmSpaceJoin(url)
+</script>
+
+<Confirm
+  {confirm}
+  message="This space does not appear to limit who can post to it. This can result in a large amount of spam or other objectionable content. Continue?" />
diff --git a/src/app/components/SpaceVisitConfirm.svelte b/src/app/components/SpaceVisitConfirm.svelte
new file mode 100644
index 00000000..5b687614
--- /dev/null
+++ b/src/app/components/SpaceVisitConfirm.svelte
@@ -0,0 +1,24 @@
+<script module lang="ts">
+  import {goto} from "$app/navigation"
+  import {makeSpacePath} from "@app/routes"
+
+  export const confirmSpaceVisit = (url: string) => {
+    goto(makeSpacePath(url), {replaceState: true})
+  }
+</script>
+
+<script lang="ts">
+  import Confirm from "@lib/components/Confirm.svelte"
+
+  type Props = {
+    url: string
+  }
+
+  const {url}: Props = $props()
+
+  const confirm = () => confirmSpaceVisit(url)
+</script>
+
+<Confirm
+  {confirm}
+  message="This space does not appear to limit who can post to it. This can result in a large amount of spam or other objectionable content. Continue?" />