Showing
1 changed file
with
7 additions
and
21 deletions
... | @@ -7,8 +7,7 @@ import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; | ... | @@ -7,8 +7,7 @@ import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; |
7 | import { faAddressBook } from "@fortawesome/free-solid-svg-icons"; | 7 | import { faAddressBook } from "@fortawesome/free-solid-svg-icons"; |
8 | import { Link } from "react-router-dom"; | 8 | import { Link } from "react-router-dom"; |
9 | import Category from "../Category/CategoryContainer"; | 9 | import Category from "../Category/CategoryContainer"; |
10 | -import IncomingMsg from "../../Components/IncomingMsg"; | 10 | +import SendingMsg from "../../Components/SendingMsg"; |
11 | -import OutcomingMsg from "../../Components/OutcomingMsg"; | ||
12 | 11 | ||
13 | const Wrapper = styled.div` | 12 | const Wrapper = styled.div` |
14 | display: grid; | 13 | display: grid; |
... | @@ -93,19 +92,10 @@ const ChatScreenBox = styled.div` | ... | @@ -93,19 +92,10 @@ const ChatScreenBox = styled.div` |
93 | height: 100%; | 92 | height: 100%; |
94 | `; | 93 | `; |
95 | 94 | ||
96 | -const InputWrapper = styled.div` | ||
97 | - display: flex; | ||
98 | - flex-direction: row; | ||
99 | - justify-content: center; | ||
100 | - align-items: center; | ||
101 | - padding: 10px; | ||
102 | - margin-bottom: 10px; | ||
103 | - width: 100%; | ||
104 | -`; | ||
105 | - | ||
106 | const InputContainer = styled.div` | 95 | const InputContainer = styled.div` |
107 | position: fixed; | 96 | position: fixed; |
108 | bottom: 0; | 97 | bottom: 0; |
98 | + justify-self: center; | ||
109 | padding: 10px; | 99 | padding: 10px; |
110 | margin-bottom: 20px; | 100 | margin-bottom: 20px; |
111 | display: flex; | 101 | display: flex; |
... | @@ -146,12 +136,13 @@ export default ({ | ... | @@ -146,12 +136,13 @@ export default ({ |
146 | location, | 136 | location, |
147 | message, | 137 | message, |
148 | onSubmit, | 138 | onSubmit, |
149 | - outcomingMsg, | 139 | + sendingText, |
150 | - outcomingTime, | 140 | + sendingTime, |
151 | - incomingMsg, | 141 | + sendingMsgObj, |
152 | }) => { | 142 | }) => { |
153 | const { pathname } = location; | 143 | const { pathname } = location; |
154 | const roomName = pathname.slice(1, pathname.length); | 144 | const roomName = pathname.slice(1, pathname.length); |
145 | + | ||
155 | return ( | 146 | return ( |
156 | <Wrapper> | 147 | <Wrapper> |
157 | <Header text={"KhuChat"} /> | 148 | <Header text={"KhuChat"} /> |
... | @@ -173,11 +164,7 @@ export default ({ | ... | @@ -173,11 +164,7 @@ export default ({ |
173 | <Title>Selected Menu Title</Title> | 164 | <Title>Selected Menu Title</Title> |
174 | </ChatScreenHeader> | 165 | </ChatScreenHeader> |
175 | <ChatScreenBox> | 166 | <ChatScreenBox> |
176 | - {incomingMsg && <IncomingMsg text={incomingMsg} />} | 167 | + <SendingMsg text={sendingText} time={sendingTime} /> |
177 | - {outcomingMsg && ( | ||
178 | - <OutcomingMsg text={outcomingMsg} time={outcomingTime} /> | ||
179 | - )} | ||
180 | - <InputWrapper> | ||
181 | <InputContainer> | 168 | <InputContainer> |
182 | <form onSubmit={onSubmit}> | 169 | <form onSubmit={onSubmit}> |
183 | <Input | 170 | <Input |
... | @@ -188,7 +175,6 @@ export default ({ | ... | @@ -188,7 +175,6 @@ export default ({ |
188 | <Button text={"Submit"} /> | 175 | <Button text={"Submit"} /> |
189 | </form> | 176 | </form> |
190 | </InputContainer> | 177 | </InputContainer> |
191 | - </InputWrapper> | ||
192 | </ChatScreenBox> | 178 | </ChatScreenBox> |
193 | </ChatScreenContainer> | 179 | </ChatScreenContainer> |
194 | </ChatWrapper> | 180 | </ChatWrapper> | ... | ... |
-
Please register or login to post a comment