HOTFIX!: Pull Request 반영안된 부분 수정

On-derDog · Feb 16, 2024 · a28bc86 · a28bc86
1 parent 0bcd49d
commit a28bc86
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 9 deletions.
diff --git a/frontend/src/components/chat/ChatMessage.tsx b/frontend/src/components/chat/ChatMessage.tsx
@@ -8,6 +8,7 @@ interface ChatMessageListProps {
 
 const ChatMessage = ({ messages, username }: ChatMessageListProps) => {
 	let currentFormattedDate = '';
+	console.log('메시지', username);
 
 	return (
 		<>
@@ -42,13 +43,6 @@ const ChatMessage = ({ messages, username }: ChatMessageListProps) => {
 						<MessageWrapper>
 							{/* 추후 코드 본인일 경우 상태관리 추가해야됨 */}
 							{item.sender === username ? (
-								<ChatReverseWrapper>
-									<ChatOwnBox>{item.content}</ChatOwnBox>
-									<ChatDateWrapper>
-										<FormattedTime>{isLastMessageForWriter && formattedTime}</FormattedTime>
-									</ChatDateWrapper>
-								</ChatReverseWrapper>
-							) : (
 								<>
 									<ChatSenderWrapper>
 										<ChatSender>{item.sender}</ChatSender>
@@ -60,6 +54,13 @@ const ChatMessage = ({ messages, username }: ChatMessageListProps) => {
 										</ChatDateWrapper>
 									</ChatWrapper>
 								</>
+							) : (
+								<ChatReverseWrapper>
+									<ChatOwnBox>{item.content}</ChatOwnBox>
+									<ChatDateWrapper>
+										<FormattedTime>{isLastMessageForWriter && formattedTime}</FormattedTime>
+									</ChatDateWrapper>
+								</ChatReverseWrapper>
 							)}
 						</MessageWrapper>
 					</MessageContainer>

diff --git a/frontend/src/styles/Layout.ts b/frontend/src/styles/Layout.ts
@@ -11,6 +11,7 @@ export const Wrapper = styled.section`
 	min-width: 768px;
 	display: flex;
 	flex-direction: row;
+	background-color: var(--color-shark);
 `;
 
 export const MainWrapper = styled.div`
@@ -27,13 +28,13 @@ export const SideWrapper = styled.div`
 	margin: 0.5rem 0rem 0.5rem 0rem;
 `;
 
-export const FlexCenterWrapper =`
+export const FlexCenterWrapper = `
 	display: flex;
 	justify-content: center;
 	align-items: center;
 `;
 
-export const ChattingRoomHeader =`
+export const ChattingRoomHeader = `
 	background-color: var(--color-pumpkin);
 	color: var(--color-white);
 	border-radius: 5px 5px 0px 0px;