Merge branch 'main' of https://github.com/MOVIEJOJO7/cat-talk into fe…

…ature/#63
MOVIEJOJO7 · Nov 15, 2023 · 4cc76a8 · 4cc76a8
2 parents cb6546d + 6a3e04f
commit 4cc76a8
Show file tree

Hide file tree

Showing 3 changed files with 8 additions and 17 deletions.
diff --git a/Components/Chat/ChatHeader.tsx b/Components/Chat/ChatHeader.tsx
@@ -1,15 +1,11 @@
 import { getCookie } from '@/Components/Login/Cookie';
 import { useRouter } from 'next/navigation';
-import { Socket } from 'socket.io-client';
-import { DefaultEventsMap } from 'socket.io/dist/typed-events';
 
 const ChatHeader = ({
-	socket,
 	chatId,
 	chatName,
 	chatUsers,
 }: {
-	socket: Socket<DefaultEventsMap, DefaultEventsMap>;
 	chatId: string;
 	chatName: string;
 	chatUsers: number;
@@ -19,7 +15,6 @@ const ChatHeader = ({
 	const accessToken = getCookie('accessToken');
 
 	const handleBackChat = () => {
-		socket.disconnect();
 		router.back();
 	};
 
@@ -34,7 +29,6 @@ const ChatHeader = ({
 			body: JSON.stringify({ chatId }),
 		});
 
-		socket.disconnect();
 		router.back();
 	};
 

diff --git a/Components/Chat/ChatRoom.tsx b/Components/Chat/ChatRoom.tsx
@@ -57,11 +57,6 @@ const ChatRoom = ({
 			});
 
 			socket.on('join', (responseData) => {
-				// console.log('join 이벤트 리슨');
-				// console.log('responseData: ', responseData);
-				// console.log('responseData.users: ', responseData.users);
-				// console.log('responseData.joiner: ', responseData.joiners);
-
 				setChatUsers([...chatUsers, ...responseData.users]);
 				socket.emit(
 					'message-to-server',
@@ -70,11 +65,6 @@ const ChatRoom = ({
 			});
 
 			socket.on('leave', (responseData) => {
-				// console.log('leave 이벤트 리슨');
-				// console.log('responseData: ', responseData);
-				// console.log('responseData.users: ', responseData.users);
-				// console.log('responseData.leaver: ', responseData.leaver);
-
 				setChatUsers([...chatUsers, ...responseData.users]);
 				socket.emit(
 					'message-to-server',
@@ -115,7 +105,6 @@ const ChatRoom = ({
 	return (
 		<>
 			<ChatHeader
-				socket={socket}
 				chatId={chatId}
 				chatName={chatName}
 				chatUsers={chatUsers.length}

diff --git a/app/chat/[id]/page.tsx b/app/chat/[id]/page.tsx
@@ -4,6 +4,7 @@ import { useSearchParams } from 'next/navigation';
 import { getCookie } from '@/Components/Login/Cookie';
 import { io } from 'socket.io-client';
 import ChatRoom from '@/Components/Chat/ChatRoom';
+import { useEffect } from 'react';
 
 const Chat = ({ params }: { params: { id: string } }) => {
 	const chatId = params.id;
@@ -18,6 +19,13 @@ const Chat = ({ params }: { params: { id: string } }) => {
 		},
 	});
 
+	useEffect(() => {
+		return () => {
+			socket.disconnect();
+		};
+		// eslint-disable-next-line react-hooks/exhaustive-deps
+	}, []);
+
 	return (
 		<ChatRoom
 			socket={socket}