From 0dcd92e9cd8a6ce582971ffb9183765f475cdc33 Mon Sep 17 00:00:00 2001
From: Gabe Kangas <gabek@real-ity.com>
Date: Sat, 12 Sep 2020 18:46:08 -0700
Subject: [PATCH] Fix chat not coming back after server comes back. Closes #136

---
 webroot/js/app.js                  | 10 +++---
 webroot/js/components/chat/chat.js | 52 ++++++++++++------------------
 2 files changed, 26 insertions(+), 36 deletions(-)

diff --git a/webroot/js/app.js b/webroot/js/app.js
index 165ba752f..61f99ec6d 100644
--- a/webroot/js/app.js
+++ b/webroot/js/app.js
@@ -44,7 +44,7 @@ export default class App extends Component {
     this.state = {
       websocket: new Websocket(),
       displayChat: getLocalStorage(KEY_CHAT_DISPLAYED) || true, // chat panel state
-      chatEnabled: false, // chat input box state
+      chatInputEnabled: false, // chat input box state
       username: getLocalStorage(KEY_USERNAME) || generateUsername(),
       userAvatarImage:
         getLocalStorage(KEY_AVATAR) ||
@@ -283,7 +283,7 @@ export default class App extends Component {
     this.setState({
       playerActive: true,
       streamOnline: true,
-      chatEnabled: true,
+      chatInputEnabled: true,
       streamStatusMessage: MESSAGE_ONLINE,
     });
   }
@@ -323,7 +323,7 @@ export default class App extends Component {
 
   disableChatInput() {
     this.setState({
-      chatEnabled: false,
+      chatInputEnabled: false,
     });
   }
 
@@ -340,7 +340,7 @@ export default class App extends Component {
 
   render(props, state) {
     const {
-      chatEnabled,
+      chatInputEnabled,
       configData,
       displayChat,
       extraUserContent,
@@ -538,7 +538,7 @@ export default class App extends Component {
           websocket=${websocket}
           username=${username}
           userAvatarImage=${userAvatarImage}
-          chatEnabled=${chatEnabled}
+          chatInputEnabled=${chatInputEnabled}
         />
       </div>
     `;
diff --git a/webroot/js/components/chat/chat.js b/webroot/js/components/chat/chat.js
index dfba992b2..f24113ea1 100644
--- a/webroot/js/components/chat/chat.js
+++ b/webroot/js/components/chat/chat.js
@@ -144,18 +144,6 @@ export default class Chat extends Component {
 		this.websocket.send(message);
   }
 
-  disableChat() {
-    this.setState({
-      inputEnabled: false,
-    });
-	}
-
-	enableChat() {
-    this.setState({
-      inputEnabled: true,
-    });
-	}
-
   updateAuthorList(message) {
     const { type } = message;
     const nameList = this.state.chatUserNames;
@@ -175,7 +163,7 @@ export default class Chat extends Component {
 
 
   render(props, state) {
-    const { username, messagesOnly, chatEnabled } = props;
+    const { username, messagesOnly, chatInputEnabled } = props;
     const { messages, inputEnabled, chatUserNames } = state;
 
     const messageList = messages.map((message) => (html`<${Message} message=${message} username=${username} key=${message.id} />`));
@@ -193,25 +181,27 @@ export default class Chat extends Component {
       `);
     }
 
-    return (
-      html`
-        <section id="chat-container-wrap" class="flex flex-col">
-          <div id="chat-container" class="bg-gray-800 flex flex-col justify-end overflow-auto">
-            <div
-              id="messages-container"
-              ref=${this.scrollableMessagesContainer}
-              class="py-1 overflow-auto z-10"
-            >
-              ${messageList}
-            </div>
-            <${ChatInput}
-              chatUserNames=${chatUserNames}
-              inputEnabled=${chatEnabled && inputEnabled}
-              handleSendMessage=${this.submitChat}
-            />
+    return html`
+      <section id="chat-container-wrap" class="flex flex-col">
+        <div
+          id="chat-container"
+          class="bg-gray-800 flex flex-col justify-end overflow-auto"
+        >
+          <div
+            id="messages-container"
+            ref=${this.scrollableMessagesContainer}
+            class="py-1 overflow-auto z-10"
+          >
+            ${messageList}
           </div>
-        </section>
-    `);
+          <${ChatInput}
+            chatUserNames=${chatUserNames}
+            inputEnabled=${chatInputEnabled}
+            handleSendMessage=${this.submitChat}
+          />
+        </div>
+      </section>
+    `;
   }
 
 }