update chat.js

src/js/08-chat.js

@@ -10,6 +10,7 @@
 
   let INIT = false
   let isComposing = false
+  let isLoading = false
 
   const openIconPath = `
     <path stroke-linecap="round" stroke-linejoin="round"
@@ -46,20 +47,20 @@
 
       // Keydown event
       chatTextArea.addEventListener('keydown', function (e) {
-        if (e.key === 'Enter' && !e.shiftKey && !isComposing) {
+        if (e.key === 'Enter' && !e.shiftKey && !isComposing && !isLoading) {
           e.preventDefault() // Prevent the default action of Enter (which is to create a new line)
           const { value } = e.target
           if (value.trim() !== '') {
-            addMessageToChatBody(value)
-            chatTextArea.value = ''
+            handleUserMessage(value)
           }
         }
       })
 
       sendButton.addEventListener('click', () => {
+        if (!isLoading) {
           const message = chatTextArea.value
-        addMessageToChatBody(message)
-        chatTextArea.value = ''
+          handleUserMessage(message)
+        }
       })
     }
   }
@@ -84,6 +85,13 @@
     }
   })
 
+  function handleUserMessage (message) {
+    if (message.trim() !== '') {
+      addMessageToChatBody(message)
+      chatTextArea.value = ''
+    }
+  }
+
   function addMessageToChatBody (message) {
     if (message.trim() !== '') {
       const user = document.createElement('pre')
@@ -92,6 +100,7 @@
       chatBody.appendChild(user)
       chatBody.scrollTop = chatBody.scrollHeight
 
+      isLoading = true
       const chatLoader = document.createElement('div')
       chatLoader.className = 'chat-loader'
       const loader = document.createElement('div')
@@ -108,6 +117,8 @@
         ai.textContent = '지금은 답해드릴 수 없어요.'
         chatBody.appendChild(ai)
         chatBody.scrollTop = chatBody.scrollHeight
+
+        isLoading = false
       }, 3000)
     }
   }