feat: 시작 버튼 수정

boostcampwm2023 · Dec 11, 2023 · 276eda8 · 276eda8
1 parent 3bfb08c
commit 276eda8
Show file tree

Hide file tree

Showing 2 changed files with 20 additions and 16 deletions.
diff --git a/client/src/components/buttons/StartButton.tsx b/client/src/components/buttons/StartButton.tsx
@@ -9,7 +9,6 @@ export type StartButtonProps = {
 export default function StartButton() {
   const { socketRef, isHost, roomInfo, problems, duration } = useRoom();
 
-  // TODO: 이거 내일 얘기해보고 Provider로 옮길 수 있음, 내 생각에 이 로직은 setRoomInfo쪽으로 들어가는게 맞는 것 같음
   const start = () => {
     console.log('start');
 
@@ -36,25 +35,30 @@ export default function StartButton() {
     const socket = socketRef.current;
     socket?.emit('game-start', roomInfo);
   };
+
   return (
     <div className="flex w-full justify-end">
-      <button
-        onClick={start}
-        className="flex h-[33px] w-full items-center justify-center rounded-lg bg-accent font-medium text-default_white hover:opacity-80">
-        {!roomInfo.isStarted ? (
-          isHost ? (
-            <>
+      {!roomInfo.isStarted ? (
+        isHost ? (
+          <>
+            <button
+              onClick={start}
+              className="flex h-[33px] w-full items-center justify-center rounded-lg bg-accent font-medium text-default_white hover:opacity-80">
               <span> Start </span>
-            </>
-          ) : (
-            <>
-              <span> Waiting...</span>
-            </>
-          )
+            </button>
+          </>
         ) : (
+          <>
+            <div className="flex h-[33px] w-full items-center justify-center rounded-lg bg-accent font-medium text-default_white">
+              <span> Waiting </span>
+            </div>
+          </>
+        )
+      ) : (
+        <div className="flex h-[33px] w-full items-center justify-center rounded-lg bg-accent font-medium text-default_white">
           <Timer endTime={roomInfo.endTime!} />
-        )}
-      </button>
+        </div>
+      )}
     </div>
   );
 }
diff --git a/client/src/contexts/RoomProvider.tsx b/client/src/contexts/RoomProvider.tsx
@@ -62,7 +62,7 @@ export const RoomProvider: React.FC<RoomProviderProps> = ({ children }) => {
 
     socketRef.current = socket;
 
-    socket.on('room-info', (newRoomInfo) => {
+    socket.on('room-info', (newRoomInfo: RoomInfoType) => {
       setRoomInfo(newRoomInfo);
 
       if (newRoomInfo.problems && newRoomInfo.problems.length > 0) {