QOL update

views/chat.html

@@ -4,12 +4,20 @@
     <div class="chat-input-container mb-5">
         <div class="textarea-wrapper">
             <textarea {% if not IsLogin or not HaveKey %}disabled{% endif %} class="textarea"
-                placeholder="Type your message here..." name="message" oninput="toggleSendButton(this)"></textarea>
+                placeholder="Type your message here..." name="message" oninput="toggleSendButton(this)"
+                id="chat-input-textarea"></textarea>
             <div class="button-group">
                 <hx hx-get="/loadSettings" hx-trigger="load" hx-swap="outerHTML" hx-target="this"></hx>
                 <hx hx-get="/loadKeys" hx-trigger="load" hx-swap="outerHTML" hx-target="this"></hx>
                 <hx hx-get="/loadUsageKPI" hx-trigger="load" hx-swap="outerHTML" hx-target="this"></hx>
                 <hx hx-get="/loadModelSelection" hx-trigger="load" hx-swap="outerHTML" hx-target="this"></hx>
+                <button {% if not IsLogin or not HaveKey %}style="display: none;" {%endif%} class="button is-small"
+                    onclick="clearTextArea()" id="clear-button" hx-post="/clearChat" hx-swap="outerHTML"
+                    hx-target="#chat-container">
+                    <span class="icon">
+                        <i class="fa-solid fa-broom"></i>
+                    </span>
+                </button>
                 <button disabled type="submit" class="send-button button is-primary is-small"
                     hx-post="/requestMultipleMessages" hx-swap="beforeend settle:200ms" hx-target="#chat-messages"
                     id="chat-input-send-btn" class="chat-input" hx-include="[name='message'], [name^='model-check-']"
@@ -24,6 +32,9 @@
 </div>
 
 <script>
+    const textarea = document.querySelector('.textarea');
+    textarea.addEventListener('keydown', handleTextareaKeydown);
+
     function toggleSendButton(textarea) {
         var sendButton = document.getElementById('chat-input-send-btn');
         sendButton.disabled = textarea.value.trim() === '';
@@ -31,8 +42,18 @@
 
     function clearTextArea() {
         setTimeout(function () {
-            document.querySelector('.textarea').value = '';
-            toggleSendButton(document.querySelector('.textarea'));
+            textarea.value = '';
+            toggleSendButton(textarea);
         }, 200);
     }
+
+    function handleTextareaKeydown(event) {
+        if (event.metaKey && event.key === 'Enter') {
+            // Check if the cursor is in the textarea
+            if (event.target === textarea) {
+                // Trigger the same action as the send button
+                document.getElementById('chat-input-send-btn').click();
+            }
+        }
+    }
 </script>