ddd

client/src/Components/Chat.js

@@ -9,7 +9,6 @@ function Chat(props) {
   const [user, setUser] = useState('')
   const [error, setError] = useState('')
   const [disabled, setDisabled] = useState(true)
-  const [hidden, setHidden] = useState(false)
 
   const userId = isAuthenticated()
   async function getProfile(userId) {
@@ -60,16 +59,6 @@ function Chat(props) {
     console.log('UseEffect recievechat', chat)
   }, [props.recievedMsg])
 
-
-  // function check() {
-  //   // if (chat[chat.length-1].user ===chat[chat.length-2].user){  //마지막보낸거랑 그 전꺼랑 보낸사람이 같은지 비교
-  //   if (chat.length === 2) {
-  //     setHidden(false)
-  //   } else {
-  //     setHidden(true)
-  //   }
-  //   console.log(hidden)
-  // }
   const time = new Date().toLocaleTimeString()
   return (
 
@@ -81,11 +70,11 @@ function Chat(props) {
           <Col xs={2}>
             {user.profileimg ? <Image src={user.profileimg && `/images/${user.profileimg}`} style={{ width: "50px", height: "50px" }} roundedCircle /> : <Image src='https://www.flaticon.com/svg/vstatic/svg/149/149071.svg?token=exp=1610922596~hmac=f4b972b9db509d4e3cc2eb40543b0b0f' style={{ width: "50px", height: "50px" }} roundedCircle />}
           </Col>
-          <Col xs={8}>
-            <Row><strong>{user.nickname}의 {index}</strong></Row>
+          <Col xs={8} className='justify-content-flex-start'>
+            <Row>{user.nickname}</Row>
             <Row className='d-flex flex-wrap-nowrap'>
-              <Col className='border border-dark' style={{ width: 'max-content', maxWidth: '300px', height: 'auto', paddingLeft: '15px', paddingRight: '15px', background: 'white', borderRadius: '5px', fontSize: 'x-large' }}>{value}</Col>
-              <Col className='ml-4'>{new Date().toLocaleTimeString()}</Col>
+              <Row className='border border-dark' style={{ width: 'max-content', maxWidth: '300px', height: 'auto', paddingLeft: '15px', paddingRight: '15px', background: 'white', borderRadius: '5px', fontSize: 'x-large' }}>{value}</Row>
+              <Col xs={5} className='ml-1'>{new Date().toLocaleTimeString()}</Col>
             </Row>
           </Col>
         </Row>
@@ -93,11 +82,11 @@ function Chat(props) {
       }
       {/* 내가 보낸 메세지 띄우기 */}
       {      chat.map((value, index) => (
-        <Row key={index} className='m-1 mr-4 justify-content-end'>
-          <div className='d-flex flex-wrap-nowrap' >
-            <Row className='mr-4'>{time}</Row>
+        <Row key={index} className='m-1 mr-5 justify-content-end'>
+          <Row className='d-flex flex-wrap-nowrap' >
+            <Col className='mr-1'>{time}</Col>
             <Row style={{ width: 'max-content', maxWidth: '300px', height: 'auto', paddingLeft: '15px', paddingRight: '15px', background: 'yellow', borderRadius: '3px', fontSize: 'x-large' }}>{value}</Row>
-          </div>
+          </Row>
         </Row>
 
       ))