From e09a232f3c99001c55f859dbb549fda36d602b98 Mon Sep 17 00:00:00 2001
From: bytedream <me@bytedream.dev>
Date: Tue, 3 Jun 2025 23:28:12 +0200
Subject: [PATCH] cancel subscriptions on signup popup destroy

---
 src/app/website/signup/RegisteredPopup.svelte | 5 ++++-
 src/app/website/signup/RulesPopup.svelte      | 6 ++++--
 src/app/website/signup/TeamPopup.svelte       | 5 ++++-
 3 files changed, 12 insertions(+), 4 deletions(-)

diff --git a/src/app/website/signup/RegisteredPopup.svelte b/src/app/website/signup/RegisteredPopup.svelte
index 89e6e7e..1b21593 100644
--- a/src/app/website/signup/RegisteredPopup.svelte
+++ b/src/app/website/signup/RegisteredPopup.svelte
@@ -1,6 +1,7 @@
 <script lang="ts">
   import { registeredPopupState } from '@app/website/signup/RegisteredPopup.ts';
   import Input from '@components/input/Input.svelte';
+  import { onDestroy } from 'svelte';
 
   interface Props {
     discordLink: string;
@@ -15,7 +16,7 @@
 
   let modal: HTMLDialogElement;
 
-  registeredPopupState.subscribe(async (value) => {
+  const cancel = registeredPopupState.subscribe(async (value) => {
     if (!value) return;
 
     modal.show();
@@ -40,6 +41,8 @@
 
     skinViewer.dispose();
   });
+
+  onDestroy(cancel);
 </script>
 
 <dialog class="modal" bind:this={modal} onclose={() => ($registeredPopupState = null)}>
diff --git a/src/app/website/signup/RulesPopup.svelte b/src/app/website/signup/RulesPopup.svelte
index 91ea8eb..5600fbc 100644
--- a/src/app/website/signup/RulesPopup.svelte
+++ b/src/app/website/signup/RulesPopup.svelte
@@ -2,6 +2,7 @@
   import { rulesPopupState, rulesPopupRead } from './RulesPopup.ts';
   import { rules } from '../../../rules.ts';
   import { popupState } from '@components/popup/Popup.ts';
+  import { onDestroy } from 'svelte';
 
   const modalTimeoutSeconds = 30;
 
@@ -10,7 +11,7 @@
   let modalTimer = $state<ReturnType<typeof setInterval> | null>(null);
   let modalSecondsOpen = $state(import.meta.env.PROD ? 0 : modalTimeoutSeconds);
 
-  rulesPopupState.listen((value) => {
+  const cancel = rulesPopupState.subscribe((value) => {
     if (value == 'open') {
       modalElem.show();
       modalTimer = setInterval(() => modalSecondsOpen++, 1000);
@@ -18,10 +19,11 @@
       clearInterval(modalTimer!);
     }
   });
+
+  onDestroy(cancel);
 </script>
 
 <dialog
-  id="rules-popup"
   class="modal"
   onclose={() => {
     if ($rulesPopupState !== 'accepted') $rulesPopupState = 'closed';
diff --git a/src/app/website/signup/TeamPopup.svelte b/src/app/website/signup/TeamPopup.svelte
index a1c9df5..aa378ba 100644
--- a/src/app/website/signup/TeamPopup.svelte
+++ b/src/app/website/signup/TeamPopup.svelte
@@ -1,14 +1,17 @@
 <script lang="ts">
   import { teamPopupOpen, teamPopupName } from '@app/website/signup/TeamPopup.ts';
   import Input from '@components/input/Input.svelte';
+  import { onDestroy } from 'svelte';
 
   let modal: HTMLDialogElement;
   let form: HTMLFormElement;
 
-  teamPopupOpen.subscribe((value) => {
+  const cancel = teamPopupOpen.subscribe((value) => {
     if (value) modal.show();
     else form?.reset();
   });
+
+  onDestroy(cancel);
 </script>
 
 <dialog class="modal" bind:this={modal} onclose={() => ($teamPopupOpen = false)}>