From 3f50f270b31544d8e9c19208640ef27d61753101 Mon Sep 17 00:00:00 2001 From: JitHoon Date: Thu, 16 Nov 2023 00:17:34 +0900 Subject: [PATCH 1/3] =?UTF-8?q?Feat:=20=EC=B1=84=ED=8C=85=EB=B0=A9?= =?UTF-8?q?=EC=97=90=20=ED=95=84=EC=9A=94=ED=95=9C=20=EC=9D=B4=EB=AF=B8?= =?UTF-8?q?=EC=A7=80=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- public/icon_back 2.svg | 1 + public/icon_back.svg | 2 +- public/icon_exit.svg | 1 + public/icon_send.svg | 4 ++++ public/icon_user.svg | 1 + 5 files changed, 8 insertions(+), 1 deletion(-) create mode 100644 public/icon_back 2.svg create mode 100644 public/icon_exit.svg create mode 100644 public/icon_send.svg create mode 100644 public/icon_user.svg diff --git a/public/icon_back 2.svg b/public/icon_back 2.svg new file mode 100644 index 0000000..52ee605 --- /dev/null +++ b/public/icon_back 2.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/public/icon_back.svg b/public/icon_back.svg index 52ee605..cf83ceb 100644 --- a/public/icon_back.svg +++ b/public/icon_back.svg @@ -1 +1 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/public/icon_exit.svg b/public/icon_exit.svg new file mode 100644 index 0000000..0cd7bb0 --- /dev/null +++ b/public/icon_exit.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/public/icon_send.svg b/public/icon_send.svg new file mode 100644 index 0000000..8d39513 --- /dev/null +++ b/public/icon_send.svg @@ -0,0 +1,4 @@ + + + + diff --git a/public/icon_user.svg b/public/icon_user.svg new file mode 100644 index 0000000..6d68623 --- /dev/null +++ b/public/icon_user.svg @@ -0,0 +1 @@ + \ No newline at end of file From ee67062c6e461540b205601bbd7a42276392154f Mon Sep 17 00:00:00 2001 From: JitHoon Date: Thu, 16 Nov 2023 00:17:56 +0900 Subject: [PATCH 2/3] =?UTF-8?q?Feat:=20=EC=A0=84=EC=B2=B4=20=EB=B0=B0?= =?UTF-8?q?=EA=B2=BD=EC=83=89=20=ED=99=94=EC=9D=B4=ED=8A=B8=EB=A1=9C=20?= =?UTF-8?q?=ED=86=B5=EC=9D=BC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- Components/Wrapper.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/Components/Wrapper.tsx b/Components/Wrapper.tsx index 8a979de..96d8b5a 100644 --- a/Components/Wrapper.tsx +++ b/Components/Wrapper.tsx @@ -2,7 +2,7 @@ import React from 'react'; const Wrapper = ({ children }: { children: React.ReactNode }) => { return ( -
+
{children}
); From ef7e4df0a3fc7772956e58891632678905a92e48 Mon Sep 17 00:00:00 2001 From: JitHoon Date: Thu, 16 Nov 2023 00:18:22 +0900 Subject: [PATCH 3/3] =?UTF-8?q?Feat:=20=EC=B1=84=ED=8C=85=EB=B0=A9=20?= =?UTF-8?q?=EC=8A=A4=ED=83=80=EC=9D=BC=EB=A7=81?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- Components/Chat/ChatHeader.tsx | 39 +++++++++++++++++++++++----- Components/Chat/ChatRoom.tsx | 34 ++++++++++++++++--------- Components/Chat/Chats.tsx | 45 ++++++++++++++++++--------------- Components/Chat/RenderChats.tsx | 24 ++++++++---------- 4 files changed, 90 insertions(+), 52 deletions(-) diff --git a/Components/Chat/ChatHeader.tsx b/Components/Chat/ChatHeader.tsx index 28be3ea..e8b8253 100644 --- a/Components/Chat/ChatHeader.tsx +++ b/Components/Chat/ChatHeader.tsx @@ -1,5 +1,6 @@ import { getCookie } from '@/Components/Login/Cookie'; import { useRouter } from 'next/navigation'; +import Image from 'next/image'; const ChatHeader = ({ chatId, @@ -33,12 +34,38 @@ const ChatHeader = ({ }; return ( - <> - - {chatName} - {chatUsers} - - +
+ 뒤로 가기 +
+ {chatName} +
+ 참여자 수 + {chatUsers} +
+
+ 나가기 +
); }; diff --git a/Components/Chat/ChatRoom.tsx b/Components/Chat/ChatRoom.tsx index 4fa733c..d591b27 100644 --- a/Components/Chat/ChatRoom.tsx +++ b/Components/Chat/ChatRoom.tsx @@ -6,6 +6,7 @@ import { Chat, Message, chatUsersObject, User } from '@/types'; import { DefaultEventsMap } from 'socket.io/dist/typed-events'; import ChatHeader from '@/Components/Chat/ChatHeader'; import RenderChats from '@/Components/Chat/RenderChats'; +import Image from 'next/image'; const ChatRoom = ({ socket, @@ -103,7 +104,7 @@ const ChatRoom = ({ }; return ( - <> +
{chatUsers.length === 2 || chatUsers.length === 1 ? ( <> -

1대1 채팅방 입니다.

) : ( <> -

true 그룹 채팅방 입니다.

) : ( <> -

false 오픈 채팅방 입니다.

)} - setNewMessage(e.target.value)} - onKeyPress={handleKeyPress} - /> - - +
+ setNewMessage(e.target.value)} + onKeyPress={handleKeyPress} + className="w-4/5 px-4 py-3 rounded-2xl" + /> +
+ 전송 +
+
+
); }; diff --git a/Components/Chat/Chats.tsx b/Components/Chat/Chats.tsx index d9ec1ca..b3e00db 100644 --- a/Components/Chat/Chats.tsx +++ b/Components/Chat/Chats.tsx @@ -21,28 +21,31 @@ const Chats = ({ return ( <> - {user.id === myId ? null : ( - <> - {useModal ? ( - User Picture - ) : ( - User Picture - )} - + {user.id === myId ? ( +
  • +
    +

    + {message.text} +

    +
    +
    • + ) : ( +
  • + User Picture +
    +

    {user.username}

    +

    + {message.text} +

    +
    +
    • )} -

    {user.username}

    -

    {message.text}

    ); }; diff --git a/Components/Chat/RenderChats.tsx b/Components/Chat/RenderChats.tsx index 2b6c896..86c7e88 100644 --- a/Components/Chat/RenderChats.tsx +++ b/Components/Chat/RenderChats.tsx @@ -30,26 +30,25 @@ const RenderChats = ({ return ( <> -
      +
        {messages.map((message, index) => { const myUser = chatUsers.find((user) => user.id === message.userId); if (myUser) { return ( -
      • + {index === 0 || new Date(message.createdAt).toDateString() !== new Date(messages[index - 1].createdAt).toDateString() ? ( -
        - {new Date(message.createdAt).toDateString()} -
        +
      • + + {new Date(message.createdAt).toDateString()} + +
        • ) : null} - - + ); } })} @@ -66,5 +65,4 @@ const RenderChats = ({ ); }; - export default RenderChats;