방 목록 갱신 수정

 import React, { useContext, useEffect, useState } from 'react';
 import React, { useContext, useEffect, useState } from 'react';
 import { RouteComponentProps } from 'react-router';
 import { RouteComponentProps } from 'react-router';
+import { MessageResponse, MessageType } from './Message';
 import SocketContext from './SocketContext';
 import SocketContext from './SocketContext';
 
 
-interface room {
+interface Room {
   uuid: string;
   uuid: string;
   name: string;
   name: string;
   currentUsers: number;
   currentUsers: number;
@@ -11,19 +12,20 @@ interface room {
 
 
 export const Rooms: React.FC<RouteComponentProps> = ({ history }) => {
 export const Rooms: React.FC<RouteComponentProps> = ({ history }) => {
   const socket = useContext(SocketContext);
   const socket = useContext(SocketContext);
-  const [ rooms, setRooms ] = useState<room[]>([]);
+  const [ rooms, setRooms ] = useState<Room[]>([]);
 
 
-  useEffect(() => {
-    socket.emit('room_list', ({ ok } : { ok: boolean }) => {
-      if (ok) {
-        history.push('/rooms');
+  const refreshRooms = () => {
+    socket.emit(MessageType.ROOM_LIST_REQUEST, (response: MessageResponse<Room[]>) => {
+      if (response.ok) {
+        setRooms(response.result!);
       } else {
       } else {
-        console.error('login error!'); // TODO: 팝업 에러?
+        // TODO: 에러 핸들링
+        console.log("방 목록을 수신하지 못함");
       }
       }
-    }); // TODO: interval마다 emit하거나 새로고침 버튼을 만들자
+    });
+  }
 
 
-    // socket.on('')
-  }, []);
+  useEffect(refreshRooms, []);
 
 
   return (
   return (
     <div>
     <div>
@@ -34,4 +36,4 @@ export const Rooms: React.FC<RouteComponentProps> = ({ history }) => {
       <footer>footer footer</footer>
       <footer>footer footer</footer>
     </div>
     </div>
   )
   )
-}
\ No newline at end of file
+}