Chat 컴포넌트 추가

+import React, { useContext, useEffect, useState } from 'react';
+import SocketContext from '../../contexts/SocketContext';
+import { MessageType, RawMessage } from '../common/types';
+import { ChatData } from './types';
+
+export const Chat: React.FC = () => {
+  const socket = useContext(SocketContext);
+  const [ input, setInput ] = useState('');
+  const [ chatLines, setChatLines ] = useState<ChatData[]>([]);
+
+  useEffect(() => {
+    socket.on(MessageType.ROOM_CHAT, (data: ChatData) => {
+      setChatLines([...chatLines, data]);
+    });
+
+    return () => {
+      socket.off(MessageType.ROOM_CHAT);
+    }
+  }, []);
+
+  return (
+    <div className='w-2/12 h-60 rounded shadow'>
+      {chatLines.map((line) => (<div/>))}
+      <input className='w-5/6 px-3 py-2 bg-white
+                    placeholder-gray-400 text-gray-700 text-sm
+                    rounded shadow outline-none focus:outline-none'
+            onChange={e => setInput(e.target.value)}></input>
+    </div>
+  );
+}
\ No newline at end of file