From 0e39b03fd31cdc54f1a3647188775dc64a90bdcd Mon Sep 17 00:00:00 2001
From: Yoonkie96 <zoobon63@gmail.com>
Date: Thu, 16 Jan 2025 16:15:15 +0900
Subject: [PATCH] =?UTF-8?q?Feat(fe).=20Redis=20Pub/Sub=20=EC=B1=84?=
 =?UTF-8?q?=ED=8C=85=20=EA=B8=B0=EB=8A=A5=20=EC=B4=88=EC=95=88?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../presentation/dto/response/ChatMessageDto.java   |  4 +++-
 fe/src/pages/ChatPage.jsx                           | 13 +++++++------
 2 files changed, 10 insertions(+), 7 deletions(-)

diff --git a/be/src/main/java/movlit/be/pub_sub/message/presentation/dto/response/ChatMessageDto.java b/be/src/main/java/movlit/be/pub_sub/message/presentation/dto/response/ChatMessageDto.java
index c16e53ba..0e9509a4 100644
--- a/be/src/main/java/movlit/be/pub_sub/message/presentation/dto/response/ChatMessageDto.java
+++ b/be/src/main/java/movlit/be/pub_sub/message/presentation/dto/response/ChatMessageDto.java
@@ -2,9 +2,11 @@
 
 import java.time.LocalDateTime;
 import lombok.Getter;
+import lombok.ToString;
 import movlit.be.common.util.ids.MemberId;
 
 @Getter
+@ToString
 public class ChatMessageDto {
 
     private Long roomId;
@@ -12,7 +14,7 @@ public class ChatMessageDto {
     private String message;
     private LocalDateTime regDt;
 
-    public ChatMessageDto(Long roomId, MemberId senderId, MemberId recipientId, String message) {
+    public ChatMessageDto(Long roomId, MemberId senderId, String message) {
         this.roomId = roomId;
         this.senderId = senderId;
         this.message = message;
diff --git a/fe/src/pages/ChatPage.jsx b/fe/src/pages/ChatPage.jsx
index 35a7182c..242d8382 100644
--- a/fe/src/pages/ChatPage.jsx
+++ b/fe/src/pages/ChatPage.jsx
@@ -1,5 +1,5 @@
-import React, { useState, useEffect, useRef } from 'react';
-import { Client } from '@stomp/stompjs';
+import React, {useState, useEffect, useRef} from 'react';
+import {Client} from '@stomp/stompjs';
 import SockJS from 'sockjs-client';
 import axiosInstance from '../axiosInstance'; // axios 인스턴스 import
 import './ChatPage.css'; // CSS 파일 import
@@ -18,7 +18,7 @@ function ChatPage() {
             setRoomId(roomIdFromParams);
         } else {
             // roomId가 없을 경우 기본값 또는 생성 로직 추가
-            const generatedRoomId = 'test'; // 임시로 test로 설정.
+            const generatedRoomId = 1; // 임시로 test로 설정.
             setRoomId(generatedRoomId);
         }
     }, []);
@@ -74,7 +74,7 @@ function ChatPage() {
             const chatMessage = {
                 roomId: roomId, // roomId 사용
                 senderId: 'currentUserId', // 현재 사용자 ID (실제로는 인증 정보에서 가져와야 함)
-                content: newMessage,
+                message: newMessage,
             };
 
             stompClient.publish({
@@ -97,7 +97,7 @@ function ChatPage() {
 
     // 새 메시지가 추가될 때마다 스크롤을 맨 아래로 이동
     useEffect(() => {
-        messagesEndRef.current?.scrollIntoView({ behavior: 'smooth' });
+        messagesEndRef.current?.scrollIntoView({behavior: 'smooth'});
     }, [messages]);
 
     return (
@@ -117,7 +117,8 @@ function ChatPage() {
                         <div className="message-content">{message.content}</div>
                     </div>
                 ))}
-                <div ref={messagesEndRef} /> {/* 스크롤을 위한 빈 div */}
+                <div ref={messagesEndRef}/>
+                {/* 스크롤을 위한 빈 div */}
             </div>
             <div className="chat-input">
                 <input