update Chat Container

@@ -2,31 +2,41 @@ import React from "react";
 import { useMutation, useQuery } from "@apollo/react-hooks";
 import ChatPresenter from "./ChatPresenter";
 import { withRouter } from "react-router-dom";
-import { CREATE_MESSAGE, GET_ROOM_BY_NAME } from "./ChatQueries";
+import {
+  CREATE_MESSAGE,
+  GET_ROOM_BY_NAME,
+  SEE_ALL_MESSAGE,
+} from "./ChatQueries";
 import useInput from "../../Hooks/useInput";
 import { toast } from "react-toastify";
 
 export default withRouter(({ location }) => {
   const { pathname } = location;
   const roomName = pathname.slice(1, pathname.length);
-
-  let messageObj, roomNum, messageText, messageTime, newMsgObj;
-
-  if (roomName !== undefined) {
-    const { data } = useQuery(GET_ROOM_BY_NAME, { variables: { roomName } });
-    if (data !== undefined) {
-      const {
-        getRoomByName: { id: roomId },
-      } = data;
-      roomNum = Number(roomId);
-    }
-  }
-
   const [createMsg] = useMutation(CREATE_MESSAGE);
   //const { data } = useSubscription(SUBSCRIPTION_MSG);
 
   const message = useInput("");
 
+  let messageObj, roomNum, messageText, messageTime, newMsgObj, messageArray;
+
+  const { data: getRoom } = useQuery(GET_ROOM_BY_NAME, {
+    variables: { roomName },
+  });
+  if (getRoom !== undefined) {
+    const {
+      getRoomByName: { id: roomId },
+    } = getRoom;
+    roomNum = Number(roomId);
+  }
+
+  const { data: messageList } = useQuery(SEE_ALL_MESSAGE, {
+    variables: { roomId: roomNum },
+  });
+  if (messageList !== undefined) {
+    messageArray = messageList;
+  }
+
   const onSubmit = async (e) => {
     e.preventDefault();
     if (message.value !== undefined || message.value !== "") {
@@ -61,7 +71,8 @@ export default withRouter(({ location }) => {
       onSubmit={onSubmit}
       messageText={messageText}
       messageTime={messageTime}
-      newMsgObj={sendingMsgObj}
+      newMsgObj={newMsgObj}
+      messageArray={messageArray}
     />
   );
 });