diff --git a/client/components/ImageViewer.vue b/client/components/ImageViewer.vue
index 620b634a..31b8d750 100644
--- a/client/components/ImageViewer.vue
+++ b/client/components/ImageViewer.vue
@@ -98,16 +98,6 @@ export default defineComponent({
 			link.value = null;
 		};
 
-		onBeforeRouteLeave((to, from, next) => {
-			next();
-
-			// cancel the navigation if the user is trying to close the image viewer
-			if (link.value) {
-				closeViewer();
-				return false;
-			}
-		});
-
 		const setPrevNextImages = () => {
 			if (!channel.value || !link.value) {
 				return null;
diff --git a/client/components/LinkPreview.vue b/client/components/LinkPreview.vue
index ff642c29..3ea25c46 100644
--- a/client/components/LinkPreview.vue
+++ b/client/components/LinkPreview.vue
@@ -142,6 +142,7 @@ import {
 	ref,
 	watch,
 } from "vue";
+import {onBeforeRouteUpdate} from "vue-router";
 import eventbus from "../js/eventbus";
 import friendlysize from "../js/helpers/friendlysize";
 import {useStore} from "../js/store";
@@ -168,6 +169,16 @@ export default defineComponent({
 		const isContentShown = ref(false);
 		const imageViewer = inject(imageViewerKey);
 
+		onBeforeRouteUpdate((to, from, next) => {
+			// cancel the navigation if the user is trying to close the image viewer
+			if (imageViewer?.value?.link) {
+				imageViewer.value.closeViewer();
+				return next(false);
+			}
+
+			next();
+		});
+
 		const content = ref<HTMLDivElement | null>(null);
 		const container = ref<HTMLDivElement | null>(null);
 
diff --git a/client/components/MessageTypes/join.vue b/client/components/MessageTypes/join.vue
index baeab726..94134f87 100644
--- a/client/components/MessageTypes/join.vue
+++ b/client/components/MessageTypes/join.vue
@@ -1,12 +1,12 @@
 <template>
 	<span class="content">
 		<Username :user="message.from" />
-		<i class="hostmask"> (<ParsedMessage :network="network" :text="message.hostmask" />)</i>
+		<i class="hostmask"> (<ParsedMessage :network="network" :text="message.hostmask" />) </i>
 		<template v-if="message.account">
-			<i class="account"> [{{ message.account }}]</i>
+			<i class="account">[{{ message.account }}]</i>
 		</template>
 		<template v-if="message.gecos">
-			<i class="realname"> {{ message.gecos }}</i>
+			<i class="realname">{{ message.gecos }}</i>
 		</template>
 		has joined the channel
 	</span>