From 7ad73fedfbc8800b38c7ab94d442aaccd550f4b1 Mon Sep 17 00:00:00 2001
From: Werner Kroneman <werner@wernerkroneman.nl>
Date: Sat, 7 Dec 2024 15:33:43 +0100
Subject: [PATCH] Added code to dismiss the reload dialogue on reconnect.

---
 packages/frontend/src/boot/main-boot.ts | 33 ++++++++++++++++++++-----
 1 file changed, 27 insertions(+), 6 deletions(-)

diff --git a/packages/frontend/src/boot/main-boot.ts b/packages/frontend/src/boot/main-boot.ts
index 0c39f1112b..3dd1ca1e8b 100644
--- a/packages/frontend/src/boot/main-boot.ts
+++ b/packages/frontend/src/boot/main-boot.ts
@@ -8,7 +8,7 @@ import {common} from './common.js';
 import type * as Misskey from 'misskey-js';
 import {ui} from '@@/js/config.js';
 import {i18n} from '@/i18n.js';
-import {alert, popup, post} from '@/os.js';
+import {alert, popup, post, toast} from '@/os.js';
 import {useStream} from '@/stream.js';
 import * as sound from '@/scripts/sound.js';
 import {$i, signout, updateAccount} from '@/account.js';
@@ -27,6 +27,7 @@ import {addCustomEmoji, removeCustomEmojis, updateCustomEmojis} from '@/custom-e
 import MkDialog from "@/components/MkDialog.vue";
 
 export async function mainBoot() {
+
 	const { isClientUpdated } = await common(() => createApp(
 		new URLSearchParams(window.location.search).has('zen') || (ui === 'deck' && deckStore.state.useSimpleUiForNonRootPages && location.pathname !== '/') ? defineAsyncComponent(() => import('@/ui/zen.vue')) :
 		!$i ? defineAsyncComponent(() => import('@/ui/visitor.vue')) :
@@ -46,25 +47,45 @@ export async function mainBoot() {
 
 	const stream = useStream();
 
-	let reloadDialogShowing = false;
+	// A reference to the function to close the "reconnecting" dialog; null if the dialog is not open.
+	let reloadDialogDisposeFn : Function | null = null;
+
+	// When the stream is disconnected, show a dialog to reload the page.
 	stream.on('_disconnected_', async () => {
+		// TODO: Where's that setting?
 		if (defaultStore.state.serverDisconnectedBehavior === 'dialog') {
-			if (reloadDialogShowing) return;
-			reloadDialogShowing = true;
+
+			// If the dialog is already open, do nothing.
+			if (reloadDialogDisposeFn) return;
+
+			// Show a popup dialog with a warning message and a "reload" button.
 			const {dispose} = popup(MkDialog, {
 				...({
 					type: 'warning',
 					title: i18n.ts.disconnectedFromServer,
 					text: i18n.ts.reloadConfirm,
 				}),
-				showCancelButton: true,
+				showCancelButton: true, // Show a "cancel" button; this dismisses the dialog without reloading the page.
 			}, {
+				// If the user clicks one of the buttons, and it's the "positive" button (in this case, the "reload" button),
 				done: result => {
 					if (!result) location.reload();
 				},
+				// If the dialog is closed, dispose of the dialog.
 				closed: () => dispose(),
 			});
-			reloadDialogShowing = false;
+
+			// Save the function to close the dialog so that it can be called later.
+			reloadDialogDisposeFn = dispose;
+		}
+	});
+
+	// When the stream is (re)connected, close the "reconnecting" dialog if it's open.
+	stream.on('_connected_', () => {
+		if (reloadDialogDisposeFn) {
+			reloadDialogDisposeFn();
+			reloadDialogDisposeFn = null;
+			toast("Reconnected to server.");
 		}
 	});