small bug fix with sockets and auth

plugins/socket.client.ts

@@ -1,9 +1,19 @@
 import io from 'socket.io-client';
+import { useUserStore } from '~/stores/userStore';
 
 export default defineNuxtPlugin(() => {
-	const socket = io('http://localhost:3000', {
-		auth: (cb) => cb({ token: useCookie('sessionToken').value })
-	});
+	const { $listen } = useNuxtApp();
+
+	async function initializeSocket() {
+		await useUserStore().userLoggedIn;
+		return io('http://localhost:3000', {
+			auth: (cb) => cb({ token: useCookie('sessionToken').value })
+		});
+	}
+
+	const socket = initializeSocket();
+	
+	$listen('userLogout', initializeSocket);
 
 	return {
 		provide: {

server/middleware/socket.ts

@@ -12,6 +12,8 @@ export default defineEventHandler(({ node }) => {
 	global.io.on('connection', async (socket: Socket) => {
 		const token = socket.handshake.auth.token;
 
+		console.log(token);
+
 		if (!token) {
 			socket.disconnect();
 			return;

stores/userStore.ts

@@ -5,18 +5,42 @@ export const useUserStore = defineStore('userStore', {
 		user: null as SafeUser | null,
 		isLoggedIn: false,
 	}),
+	getters: {
+		// computed property that returns a promise that resolves when the user logs in
+		userLoggedIn() {
+			// eslint-disable-next-line @typescript-eslint/no-this-alias
+			const that = this;
+
+			return new Promise<boolean>(resolve => {
+				function checkFlag() {
+					if(that.isLoggedIn === true) {
+						resolve(true);
+					}
+
+					setTimeout(checkFlag, 100);
+				}
+				checkFlag();
+			});
+		},
+	},
 	actions: {
 		setUser(user: SafeUser) {
 			this.user = user;
 			this.isLoggedIn = true;
 		},
 		async logout() {
+			const { $io, $emit } = useNuxtApp();
+
+			(await $io).disconnect();
 			await $fetch('/api/user/logout');
 			useCookie('sessionToken').value = null;
 			useCookie('userId').value = null;
 
 			this.user = null;
 			this.isLoggedIn = false;
+
+			$emit('userLogout', true);
+
 			return navigateTo('/login');
 		}
 	}