From 00f22aee28f2502694c866f1059211f37995d656 Mon Sep 17 00:00:00 2001
From: MiguelMLorente <miguel.munoz.lorente.14@gmail.com>
Date: Mon, 10 Feb 2025 22:14:13 +0100
Subject: [PATCH] Add error messages in landing page for duplicate user names
 and missing game code

---
 interface/server-events/ServerError.ts |  2 ++
 web/src/pages/landing/LandingPage.tsx  | 16 +++++++++++-----
 2 files changed, 13 insertions(+), 5 deletions(-)

diff --git a/interface/server-events/ServerError.ts b/interface/server-events/ServerError.ts
index c1789c1..9dc1de4 100644
--- a/interface/server-events/ServerError.ts
+++ b/interface/server-events/ServerError.ts
@@ -8,4 +8,6 @@ export enum ErrorCode {
   GAME_NOT_FOUND = "game-not-found",
   MISSING_USER_NAME = "missing-player-name",
   INVALID_USER_NAME = "invalid-player-name",
+  DUPLICATE_USER_NAME = "duplicate-player-name",
+  MISSING_GAME_CODE = "missing-game-code",
 }
diff --git a/web/src/pages/landing/LandingPage.tsx b/web/src/pages/landing/LandingPage.tsx
index c8c2a22..3605375 100644
--- a/web/src/pages/landing/LandingPage.tsx
+++ b/web/src/pages/landing/LandingPage.tsx
@@ -7,7 +7,7 @@ import {
   handleJoinLobby,
   JoinLobbyEvent,
 } from "interface";
-import { ChangeEvent, useState } from "react";
+import { ChangeEvent, useEffect, useState } from "react";
 import { Socket } from "socket.io-client";
 import "./LandingPage.scss";
 
@@ -34,20 +34,26 @@ const LandingPage = (props: LandingPageProps) => {
       ErrorCode.INVALID_USER_NAME,
       "Player name must be letters or spaces only and up to 25 characters",
     ],
+    [ErrorCode.DUPLICATE_USER_NAME, "Player name is already under use"],
   ]);
   const userNameErrorMessage =
     userNameErrorCodesToMessageMap.get(receivedError);
   const gameCodeErrorCodesToMessageMap = new Map([
     [ErrorCode.GAME_NOT_FOUND, "No game found with such lobby ID"],
+    [ErrorCode.MISSING_GAME_CODE, "Introduce a game code"],
   ]);
   const gameCodeErrorMessage =
     gameCodeErrorCodesToMessageMap.get(receivedError);
 
-  attachHandlerToCreateLobbyError(socket, (event) =>
-    setReceivedError(event.error),
+  useEffect(() =>
+    attachHandlerToCreateLobbyError(socket, (event) =>
+      setReceivedError(event.error),
+    ),
   );
-  attachHandlerToJoinLobbyError(socket, (event) =>
-    setReceivedError(event.error),
+  useEffect(() =>
+    attachHandlerToJoinLobbyError(socket, (event) =>
+      setReceivedError(event.error),
+    ),
   );
 
   return (