From 0f9337757ccf6bf3d1685ffe28f9b561cef5011a Mon Sep 17 00:00:00 2001
From: yejinleee <yejin9487@gmail.com>
Date: Thu, 18 Apr 2024 11:51:50 +0900
Subject: [PATCH] =?UTF-8?q?[=F0=9F=90=9Bfix]:=20ingameSubscription=20?=
 =?UTF-8?q?=EC=9D=B8=EA=B2=8C=EC=9E=84=EC=9B=B9=EC=86=8C=EC=BC=93=ED=9B=85?=
 =?UTF-8?q?=EC=9C=BC=EB=A1=9C=20=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/pages/GamePage/GamePage.tsx                |  4 +---
 src/pages/GamePage/IngameWebsocketLayer.tsx    |  6 ++----
 src/pages/GamePage/hooks/useIngameWebsocket.ts | 11 ++++-------
 src/pages/GamePage/hooks/useWebsocket.ts       |  4 +---
 4 files changed, 8 insertions(+), 17 deletions(-)

diff --git a/src/pages/GamePage/GamePage.tsx b/src/pages/GamePage/GamePage.tsx
index 0088d45a..f02f9393 100644
--- a/src/pages/GamePage/GamePage.tsx
+++ b/src/pages/GamePage/GamePage.tsx
@@ -14,8 +14,7 @@ const GamePage = () => {
   const navigate = useNavigate();
 
   const { roomId, setRoomInfo, roomInfo } = useRoomInfoStore();
-  const { publishGameRoom, stompClient, ingameSubscription } =
-    useWebsocket(roomId);
+  const { publishGameRoom, stompClient } = useWebsocket(roomId);
 
   const { gameRoomRes, isRoomWsError, didAdminStart, allMembers } =
     useGameWaitingRoomStore();
@@ -109,7 +108,6 @@ const GamePage = () => {
     <IngameWebsocketLayer
       userId={userId}
       stompClient={stompClient}
-      ingameSubscription={ingameSubscription}
     />
   );
 };
diff --git a/src/pages/GamePage/IngameWebsocketLayer.tsx b/src/pages/GamePage/IngameWebsocketLayer.tsx
index 59c3e438..47d57eb7 100644
--- a/src/pages/GamePage/IngameWebsocketLayer.tsx
+++ b/src/pages/GamePage/IngameWebsocketLayer.tsx
@@ -1,4 +1,4 @@
-import { Client, StompSubscription } from '@stomp/stompjs';
+import { Client } from '@stomp/stompjs';
 import React, { MutableRefObject, Suspense, useEffect } from 'react';
 import Spinner from '@/common/Spinner/Spinner';
 import useIngameStore from '@/store/useIngameStore';
@@ -11,7 +11,6 @@ import useIngameWebsocket from './hooks/useIngameWebsocket';
 interface IngameWebsocketLayerProps {
   userId: number;
   stompClient: MutableRefObject<Client | undefined>;
-  ingameSubscription: MutableRefObject<StompSubscription | undefined>;
 }
 
 const GameCode = React.lazy(() => import('./GameCode/GameCode'));
@@ -22,14 +21,13 @@ const GameSentence = React.lazy(() => import('./GameSentence/GameSentence'));
 const IngameWebsocketLayer = ({
   userId,
   stompClient,
-  ingameSubscription,
 }: IngameWebsocketLayerProps) => {
   const { roomId, roomInfo } = useRoomInfoStore();
   const { ingameRoomRes, isIngameWsError, isRoundWaiting, setIsRoundWaiting } =
     useIngameStore();
 
   const { onIngameConnected, handleConnectIngame, publishIngame } =
-    useIngameWebsocket({ roomId, stompClient, ingameSubscription });
+    useIngameWebsocket({ roomId, stompClient });
   useEffect(() => {
     onIngameConnected(); // 인게임 엔드포인트 구독
     handleConnectIngame(roomId); // 해당 인게임 연결 발행
diff --git a/src/pages/GamePage/hooks/useIngameWebsocket.ts b/src/pages/GamePage/hooks/useIngameWebsocket.ts
index a96c8689..8ccb5063 100644
--- a/src/pages/GamePage/hooks/useIngameWebsocket.ts
+++ b/src/pages/GamePage/hooks/useIngameWebsocket.ts
@@ -1,5 +1,5 @@
 import { Client, StompSubscription } from '@stomp/stompjs';
-import { MutableRefObject } from 'react';
+import { MutableRefObject, useRef } from 'react';
 import useGameWaitingRoomStore from '@/store/useGameWaitingRoomStore';
 import useIngameStore from '@/store/useIngameStore';
 import { checkIsEmptyObj } from '@/utils/checkIsEmptyObj';
@@ -9,13 +9,10 @@ import { PayloadType } from '../types/websocketType';
 interface I_useIngame {
   roomId: number;
   stompClient: MutableRefObject<Client | undefined>;
-  ingameSubscription: MutableRefObject<StompSubscription | undefined>;
 }
-const useIngameWebsocket = ({
-  roomId,
-  stompClient,
-  ingameSubscription,
-}: I_useIngame) => {
+const useIngameWebsocket = ({ roomId, stompClient }: I_useIngame) => {
+  const ingameSubscription = useRef<StompSubscription>();
+
   const connectHeaders = getToken();
   const { setIsIngameWsError, setIngameRoomRes } = useIngameStore();
   const { setAllMembers } = useGameWaitingRoomStore();
diff --git a/src/pages/GamePage/hooks/useWebsocket.ts b/src/pages/GamePage/hooks/useWebsocket.ts
index 11ab9840..2e65f7ce 100644
--- a/src/pages/GamePage/hooks/useWebsocket.ts
+++ b/src/pages/GamePage/hooks/useWebsocket.ts
@@ -1,5 +1,5 @@
 import './init.ts';
-import { Client, StompSubscription } from '@stomp/stompjs';
+import { Client } from '@stomp/stompjs';
 import { useEffect, useRef } from 'react';
 import SockJS from 'sockjs-client';
 import { BASE_PATH } from '@/generated/base';
@@ -10,7 +10,6 @@ import { getToken } from '@/utils/getToken';
 
 const useWebsocket = (roomId: number | null) => {
   const stompClient = useRef<Client>();
-  const ingameSubscription = useRef<StompSubscription>();
 
   const connectHeaders = getToken();
 
@@ -101,7 +100,6 @@ const useWebsocket = (roomId: number | null) => {
   return {
     publishGameRoom,
     stompClient,
-    ingameSubscription,
   };
 };