ui/index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>SSE Chat Application</title>
</head>
<body>
    <h1>SSE Chat Application</h1>
    <div id="messages"></div>
    <input id="messageInput" type="text" placeholder="Type a message...">
    <button onclick="sendMessage()">Send</button>

    <script>
        const eventSource = new EventSource('http://localhost:9095/chat/stream');

        eventSource.onmessage = function(event) {
            const messagesDiv = document.getElementById('messages');
            const messageElement = document.createElement('div');
            messageElement.innerText = event.data;
            messagesDiv.appendChild(messageElement);
        };

        function sendMessage() {
            const messageInput = document.getElementById('messageInput');
            const message = messageInput.value;

            fetch('http://localhost:9095/chat/send', {
                method: 'POST',
                headers: {
                    'Content-Type': 'application/x-www-form-urlencoded'
                },
                body: 'message=' + encodeURIComponent(message)
            });

            messageInput.value = '';
        }
    </script>
</body>
</html>