From ed14ee9f6e3e844c684209c7d7b824aefa4344d0 Mon Sep 17 00:00:00 2001 From: Christopher Strauss Date: Thu, 8 Aug 2024 11:52:42 +0200 Subject: [PATCH] Gamechat im panel --- src/main/client/src/feature/GameChat.jsx | 82 +++++++++++++++++++ src/main/client/src/feature/GamePanel.jsx | 6 ++ src/main/client/src/feature/Message.jsx | 7 ++ src/main/java/com/bernd/ChatController.java | 19 ++--- .../java/com/bernd/model/ChatMessage.java | 5 +- 5 files changed, 107 insertions(+), 12 deletions(-) create mode 100644 src/main/client/src/feature/GameChat.jsx create mode 100644 src/main/client/src/feature/Message.jsx diff --git a/src/main/client/src/feature/GameChat.jsx b/src/main/client/src/feature/GameChat.jsx new file mode 100644 index 0000000..798d6fc --- /dev/null +++ b/src/main/client/src/feature/GameChat.jsx @@ -0,0 +1,82 @@ +import { + useState, + useEffect, + useCallback, + useContext, +} from "react" +import { + Message, +} from "./Message.jsx" +import { + useParams, +} from "react-router-dom" +import { + useAuthStore, +} from "./../store.js" +import { + StompContext, + tfetch, + doTry, +} from "./../util.js" + +export const GameChat = () => { + let [messages, setMessages] = useState([]); + + let stompClient = useContext(StompContext) + let { gameId } = useParams() + let auth = useAuthStore(state => state.auth) + + useEffect(() => { + console.log("RENDER CHAT") + + stompClient.subscribe("/topic/chat/" + gameId, (message) => { + let newMessage = JSON.parse(message.body) + setMessages(previous => [...previous, newMessage]) + }) + + doTry(async () => { + console.log(gameId) + let chat = await tfetch("/api/chat/" + gameId, { + method: "GET", + headers: { + "Authorization": "Bearer " + auth.token, + "Content-Type": "application/json", + }, + }) + setMessages(chat.messages || []) + }) + + }, [stompClient, auth, gameId]) + + let onSendMessage = useCallback((event) => doTry(async () => { + event.preventDefault() + let data = new FormData(event.target) + + stompClient.publish({ + destination: "/app/chat/send/", + body: JSON.stringify({ + message: data.get("message"), + id: gameId, + }), + + }) + }), [ stompClient, gameId ]) + + return ( + +
+
+ {messages.map(message => ( + + ))} +
+
+ + +
+
+ ); +} diff --git a/src/main/client/src/feature/GamePanel.jsx b/src/main/client/src/feature/GamePanel.jsx index 20a47b1..45cc8ad 100644 --- a/src/main/client/src/feature/GamePanel.jsx +++ b/src/main/client/src/feature/GamePanel.jsx @@ -31,6 +31,9 @@ import { useAuthStore, useGameStore, } from "../store.js" +import { + GameChat, +} from "./GameChat.jsx" export const GamePanel = ({zoom, setZoom}) => { return ( @@ -171,6 +174,9 @@ function Panel({zoom, setZoom}) { )} +
+ +
) } diff --git a/src/main/client/src/feature/Message.jsx b/src/main/client/src/feature/Message.jsx new file mode 100644 index 0000000..1286add --- /dev/null +++ b/src/main/client/src/feature/Message.jsx @@ -0,0 +1,7 @@ +export function Message({ text }) { + return ( +
+

{text}

+
+ ); +} diff --git a/src/main/java/com/bernd/ChatController.java b/src/main/java/com/bernd/ChatController.java index d1132ef..17d8557 100644 --- a/src/main/java/com/bernd/ChatController.java +++ b/src/main/java/com/bernd/ChatController.java @@ -3,17 +3,16 @@ import com.bernd.model.Chat; import com.bernd.model.ChatMessage; import com.bernd.model.ChatRequest; +import com.bernd.util.Auth; +import java.security.Principal; import java.util.ArrayList; import java.util.List; -import java.util.Objects; import org.springframework.http.ResponseEntity; import org.springframework.messaging.core.MessageSendingOperations; -import org.springframework.security.core.context.SecurityContextHolder; +import org.springframework.messaging.handler.annotation.MessageMapping; import org.springframework.stereotype.Controller; import org.springframework.web.bind.annotation.GetMapping; import org.springframework.web.bind.annotation.PathVariable; -import org.springframework.web.bind.annotation.PostMapping; -import org.springframework.web.bind.annotation.RequestBody; import org.springframework.web.bind.annotation.ResponseBody; @Controller @@ -32,14 +31,14 @@ public class ChatController { @ResponseBody @GetMapping("/api/chat/{id}") public Chat getChat(@PathVariable String id) { + System.out.println("GETCHAT " + id); return chats.get(id); } - @PostMapping("/api/send_chat") - public ResponseEntity sendChat(@RequestBody ChatRequest chatRequest) { - Object principal = SecurityContextHolder.getContext().getAuthentication().getPrincipal(); - String user = Objects.toString(principal); - ChatMessage message = new ChatMessage(chatRequest.message(), user); + @MessageMapping("/chat/send/") + public ResponseEntity sendChat(ChatRequest chatRequest, Principal principal) { + String user = Auth.getPrincipal(principal); + ChatMessage message = new ChatMessage(chats.chats().size(), chatRequest.message(), user); Chat chat = chats.get(chatRequest.id()); if (chat != null) { chat.messages().add(message); @@ -49,7 +48,7 @@ public ResponseEntity sendChat(@RequestBody ChatRequest chatRequest) { chat = new Chat(chatRequest.id(), messages); } chats.put(chat); - operations.convertAndSend("/topic/chat/" + chat.id(), chat); + operations.convertAndSend("/topic/chat/" + chat.id(), message); return ResponseEntity.ok().build(); } diff --git a/src/main/java/com/bernd/model/ChatMessage.java b/src/main/java/com/bernd/model/ChatMessage.java index b4179d7..78f7ab1 100644 --- a/src/main/java/com/bernd/model/ChatMessage.java +++ b/src/main/java/com/bernd/model/ChatMessage.java @@ -1,6 +1,7 @@ package com.bernd.model; public record ChatMessage( - String message, - String user) { + int n, + String message, + String user) { }