fix: Align with server by removing drawing broadcast feature

boostcampwm-2024 · Nov 28, 2024 · d398629 · d398629
1 parent 31dea0a
commit d398629
Show file tree

Hide file tree

Showing 3 changed files with 5 additions and 22 deletions.
diff --git a/client/src/components/canvas/GameCanvas.tsx b/client/src/components/canvas/GameCanvas.tsx
@@ -91,12 +91,6 @@ const GameCanvas = ({ role, maxPixels = 100000, currentRound, roomStatus }: Game
 
       void gameSocketHandlers.submittedDrawing(allDrawingData);
     },
-    onDrawingTimeEnded: (response) => {
-      if (!response.drawing) return;
-
-      resetCanvas();
-      applyDrawing(response.drawing);
-    },
   });
 
   const COLORS = COLORS_INFO.map((color) => ({

diff --git a/client/src/hooks/socket/useDrawingSocket.ts b/client/src/hooks/socket/useDrawingSocket.ts
@@ -2,14 +2,13 @@
 // 특정 기능(드로잉)에 집중된 이벤트 핸들링
 import { useCallback, useEffect } from 'react';
 import { useParams } from 'react-router-dom';
-import type { DrawSubmitResponse, DrawUpdateResponse } from '@troublepainter/core';
+import type { DrawUpdateResponse } from '@troublepainter/core';
 import { useGameSocketStore } from '@/stores/socket/gameSocket.store';
 import { SocketNamespace } from '@/stores/socket/socket.config';
 import { useSocketStore } from '@/stores/socket/socket.store';
 
 interface UseDrawingSocketProps {
   onDrawUpdate: (response: DrawUpdateResponse) => void;
-  onDrawingTimeEnded: (response: DrawSubmitResponse) => void;
   onSubmitRequest: () => void;
 }
 
@@ -56,7 +55,7 @@ interface UseDrawingSocketProps {
  *
  * @category Hooks
  */
-export const useDrawingSocket = ({ onDrawUpdate, onDrawingTimeEnded, onSubmitRequest }: UseDrawingSocketProps) => {
+export const useDrawingSocket = ({ onDrawUpdate, onSubmitRequest }: UseDrawingSocketProps) => {
   const { roomId } = useParams<{ roomId: string }>();
   const { sockets, connected, actions: socketActions } = useSocketStore();
   const { currentPlayerId } = useGameSocketStore();
@@ -76,13 +75,6 @@ export const useDrawingSocket = ({ onDrawUpdate, onDrawingTimeEnded, onSubmitReq
     onSubmitRequest();
   }, [onSubmitRequest]);
 
-  const handleDrawingTimeEnded = useCallback(
-    (response: DrawSubmitResponse) => {
-      onDrawingTimeEnded(response);
-    },
-    [onDrawingTimeEnded],
-  );
-
   useEffect(() => {
     if (!roomId || !currentPlayerId) return;
 
@@ -108,14 +100,12 @@ export const useDrawingSocket = ({ onDrawUpdate, onDrawingTimeEnded, onSubmitReq
 
     // game 네임스페이스 이벤트
     gameSocket.on('submitDrawing', handleSubmitDrawing);
-    gameSocket.on('drawingTimeEnded', handleDrawingTimeEnded);
 
     return () => {
       drawingSocket.off('drawUpdated', handleDrawUpdate);
       gameSocket.off('submitDrawing', handleSubmitDrawing);
-      gameSocket.off('drawingTimeEnded', handleDrawingTimeEnded);
     };
-  }, [sockets.drawing, sockets.game, handleDrawUpdate, handleSubmitDrawing, handleDrawingTimeEnded]);
+  }, [sockets.drawing, sockets.game, handleDrawUpdate, handleSubmitDrawing]);
 
   return {
     isConnected: connected.drawing,

diff --git a/core/types/socket.types.ts b/core/types/socket.types.ts
@@ -159,9 +159,8 @@ export interface DrawUpdateResponse {
   drawingData: CRDTMessage;
 }
 
-export interface DrawSubmitResponse {
+export interface DrawTimeEndedResponse {
   roomStatus: any;
-  drawing: CRDTMessage;
 }
 
 // Socket.IO 이벤트 타입 정의
@@ -201,7 +200,7 @@ export type DrawingServerEvents = {
   drawTimeUpdated: (response: RoundTimeUpdateResponse) => void;
   drawUpdated: (response: DrawUpdateResponse) => void;
   submitDrawing: () => void;
-  drawingTimeEnded: (response: DrawSubmitResponse) => void;
+  drawingTimeEnded: (response: DrawTimeEndedResponse) => void;
   error: (error: SocketError) => void;
 };
 // 드로잉 클라이언트 이벤트 타입 정의