fix: Show chat HTML only after WebSocket ready - Prevents handleMentionInput undefined error - Chat content hidden until WebSocket opens - Fixes SD issues between JS and HTML loading
All checks were successful
BotServer CI / build (push) Successful in 8m57s

This commit is contained in:
Rodrigo Rodriguez 2026-04-30 21:26:16 -03:00
parent 8c046118a9
commit 86d4bb4f26
3 changed files with 25 additions and 14 deletions

View file

@ -122,5 +122,15 @@ function initChat() {
proceedWithChatInit();
}
function showChatApp() {
var chatApp = document.getElementById("chat-app");
if (chatApp) {
chatApp.style.opacity = "1";
chatApp.style.visibility = "visible";
}
}
window.showChatApp = showChatApp;
setupEventHandlers();
initChat();

View file

@ -43,14 +43,15 @@ function connectWebSocket() {
ChatState.ws = new WebSocket(url);
ChatState.ws.onopen = function () {
ChatState.disconnectNotified = false;
updateConnectionStatus("connected");
var loadingOverlay = document.getElementById("chatLoadingOverlay");
var contentWrapper = document.getElementById("chatContentWrapper");
if (loadingOverlay) loadingOverlay.style.display = "none";
if (contentWrapper) contentWrapper.style.display = "flex";
};
ChatState.ws.onopen = function () {
ChatState.disconnectNotified = false;
updateConnectionStatus("connected");
var loadingOverlay = document.getElementById("chatLoadingOverlay");
if (loadingOverlay) loadingOverlay.style.display = "none";
if (typeof window.showChatApp === "function") {
window.showChatApp();
}
};
ChatState.ws.onmessage = function (event) {
try {

View file

@ -2,13 +2,13 @@
<link rel="stylesheet" href="/suite/css/markdown-message.css" />
<link rel="stylesheet" href="/suite/css/chat-agent-mode.css" />
<div class="chat-layout" id="chat-app">
<div class="chat-loading-overlay" id="chatLoadingOverlay">
<div class="chat-loading-spinner"></div>
<div class="chat-loading-text">Carregando...</div>
</div>
<div class="chat-layout" id="chat-app" style="opacity: 0; visibility: hidden;">
<div class="chat-loading-overlay" id="chatLoadingOverlay">
<div class="chat-loading-spinner"></div>
<div class="chat-loading-text">Carregando...</div>
</div>
<div class="chat-content-wrapper" id="chatContentWrapper" style="display: none;">
<div class="chat-content-wrapper" id="chatContentWrapper">
<div class="connection-status connecting" id="connectionStatus" style="display: none">
<span class="connection-status-dot"></span>
<span class="connection-text">Connecting...</span>