From 19eaedd749d29d5de3d7005d3622f3a13b72f5bb Mon Sep 17 00:00:00 2001
From: yuwen <kfk07027@gmail.com>
Date: Tue, 12 Sep 2023 19:13:01 +0800
Subject: [PATCH] refactor: add socket event of join room and leave room

---
 components/rooms/RoomChatroom/RoomChatroom.tsx |  2 +-
 containers/provider/ChatroomProvider.tsx       | 12 ++++++------
 contexts/SocketContext.tsx                     |  4 ++--
 3 files changed, 9 insertions(+), 9 deletions(-)

diff --git a/components/rooms/RoomChatroom/RoomChatroom.tsx b/components/rooms/RoomChatroom/RoomChatroom.tsx
index 8ed65f22..c04e3b1f 100644
--- a/components/rooms/RoomChatroom/RoomChatroom.tsx
+++ b/components/rooms/RoomChatroom/RoomChatroom.tsx
@@ -23,7 +23,7 @@ export default function RoomChatroom({ roomId }: RoomChatroom) {
     if (!socket || !socket.connected) return;
     joinChatroom(roomId);
     return () => leaveChatroom(roomId);
-  }, [joinChatroom, leaveChatroom, roomId, socket]);
+  }, [joinChatroom, leaveChatroom, roomId, socket, socket.connected]);
 
   // update message list while received new message from websocket
   useEffect(() => {
diff --git a/containers/provider/ChatroomProvider.tsx b/containers/provider/ChatroomProvider.tsx
index ea4ad8ca..8f678204 100644
--- a/containers/provider/ChatroomProvider.tsx
+++ b/containers/provider/ChatroomProvider.tsx
@@ -52,7 +52,7 @@ function useChatroomCore() {
   );
 
   const joinChatroom = useCallback(
-    (chatroomId: string) => {
+    (roomId: string) => {
       if (!currentUser) return;
       if (socket) {
         const payload = {
@@ -60,16 +60,16 @@ function useChatroomCore() {
             id: currentUser.id,
             nickname: currentUser.nickname,
           },
-          chatroomId,
+          target: `ROOM_${roomId}`,
         };
-        socket?.emit(SOCKET_EVENT.CHATROOM_JOIN, payload);
+        socket?.emit(SOCKET_EVENT.JOIN_ROOM, payload);
       }
     },
     [currentUser, socket]
   );
 
   const leaveChatroom = useCallback(
-    (chatroomId: string) => {
+    (roomId: string) => {
       if (!currentUser) return;
       if (socket) {
         const payload = {
@@ -77,9 +77,9 @@ function useChatroomCore() {
             id: currentUser.id,
             nickname: currentUser.nickname,
           },
-          chatroomId,
+          target: `ROOM_${roomId}`,
         };
-        socket?.emit(SOCKET_EVENT.CHATROOM_LEAVE, payload);
+        socket?.emit(SOCKET_EVENT.LEAVE_ROOM, payload);
       }
     },
     [currentUser, socket]
diff --git a/contexts/SocketContext.tsx b/contexts/SocketContext.tsx
index 96dc5ee3..884cd3e7 100644
--- a/contexts/SocketContext.tsx
+++ b/contexts/SocketContext.tsx
@@ -32,8 +32,8 @@ const config =
 export enum SOCKET_EVENT {
   CONNECT = "connect",
   DISCONNECT = "disconnect",
-  CHATROOM_JOIN = "CHATROOM_JOIN",
-  CHATROOM_LEAVE = "CHATROOM_LEAVE",
+  JOIN_ROOM = "JOIN_ROOM",
+  LEAVE_ROOM = "LEAVE_ROOM",
   CHAT_MESSAGE = "CHAT_MESSAGE",
   USER_JOINED = "USER_JOINED",
   USER_LEFT = "USER_LEFT",