remove unused component

@@ -7,8 +7,7 @@ import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 import { faAddressBook } from "@fortawesome/free-solid-svg-icons";
 import { Link } from "react-router-dom";
 import Category from "../Category/CategoryContainer";
-import IncomingMsg from "../../Components/IncomingMsg";
-import OutcomingMsg from "../../Components/OutcomingMsg";
+import SendingMsg from "../../Components/SendingMsg";
 
 const Wrapper = styled.div`
   display: grid;
@@ -93,19 +92,10 @@ const ChatScreenBox = styled.div`
   height: 100%;
 `;
 
-const InputWrapper = styled.div`
-  display: flex;
-  flex-direction: row;
-  justify-content: center;
-  align-items: center;
-  padding: 10px;
-  margin-bottom: 10px;
-  width: 100%;
-`;
-
 const InputContainer = styled.div`
   position: fixed;
   bottom: 0;
+  justify-self: center;
   padding: 10px;
   margin-bottom: 20px;
   display: flex;
@@ -146,12 +136,13 @@ export default ({
   location,
   message,
   onSubmit,
-  outcomingMsg,
-  outcomingTime,
-  incomingMsg,
+  sendingText,
+  sendingTime,
+  sendingMsgObj,
 }) => {
   const { pathname } = location;
   const roomName = pathname.slice(1, pathname.length);
+
   return (
     <Wrapper>
       <Header text={"KhuChat"} />
@@ -173,11 +164,7 @@ export default ({
             <Title>Selected Menu Title</Title>
           </ChatScreenHeader>
           <ChatScreenBox>
-            {incomingMsg && <IncomingMsg text={incomingMsg} />}
-            {outcomingMsg && (
-              <OutcomingMsg text={outcomingMsg} time={outcomingTime} />
-            )}
-            <InputWrapper>
+            <SendingMsg text={sendingText} time={sendingTime} />
             <InputContainer>
               <form onSubmit={onSubmit}>
                 <Input
@@ -188,7 +175,6 @@ export default ({
                 <Button text={"Submit"} />
               </form>
             </InputContainer>
-            </InputWrapper>
           </ChatScreenBox>
         </ChatScreenContainer>
       </ChatWrapper>