From 183244e07b2f4f5fa79b6a1b886fed8211af18d5 Mon Sep 17 00:00:00 2001
From: Adrien <adrien.bouvais.pro@gmail.com>
Date: Fri, 31 May 2024 12:15:28 +0200
Subject: [PATCH] fix

---
 Chat.go                                  | 19 ++++++++++++++++++-
 views/chat.html                          | 21 +++++++++++++++++----
 views/partials/popover-conversation.html | 15 +++++----------
 views/partials/popover-models.html       | 13 ++++++++++---
 4 files changed, 50 insertions(+), 18 deletions(-)

diff --git a/Chat.go b/Chat.go
index 111b316..00ec0a3 100644
--- a/Chat.go
+++ b/Chat.go
@@ -808,7 +808,24 @@ func DeleteConversationHandler(c *fiber.Ctx) error {
 		panic(err)
 	}
 
-	return c.SendString(GenerateConversationPopoverHTML(true))
+	// Select the default conversation
+	err = edgeClient.Execute(edgeCtx, `
+	UPDATE Conversation
+	FILTER .user = global currentUser AND .name = 'Default'
+	SET {
+		selected := true
+	};
+	`)
+	if err != nil {
+		fmt.Println("Error selecting default conversation")
+		panic(err)
+	}
+
+	reloadChatTriggerHTML := `
+	<hx hx-get="/loadChat" hx-trigger="load once" hx-swap="outerHTML" hx-target="#chat-container" style="display: none;"></hx>
+	`
+
+	return c.SendString(GenerateConversationPopoverHTML(true) + reloadChatTriggerHTML)
 }
 
 func SelectConversationHandler(c *fiber.Ctx) error {
diff --git a/views/chat.html b/views/chat.html
index 42f351b..1e80078 100644
--- a/views/chat.html
+++ b/views/chat.html
@@ -1,12 +1,14 @@
-<div class="chat-container mt-5" style="padding-bottom: 155px;">
+<div class="chat-container mt-5" style="padding-bottom: 155px;" hx-indicator="#textarea-control">
     <hx hx-get="/loadChat" hx-trigger="load once" hx-swap="outerHTML"></hx>
 
     {% if IsSubscribed or not IsLimiteReached %}
     <div class="chat-input-container mb-5">
         <div class="textarea-wrapper">
-            <textarea {% if not IsLogin or not HaveKey %}disabled{% endif %} class="textarea has-fixed-size"
-                placeholder="Type your message here..." name="message" oninput="toggleSendButton()"
-                id="chat-input-textarea"></textarea>
+            <div class="control" id="textarea-control">
+                <textarea {% if not IsLogin or not HaveKey %}disabled{% endif %} class="textarea has-fixed-size"
+                    placeholder="Type your message here..." name="message" oninput="toggleSendButton()"
+                    id="chat-input-textarea"></textarea>
+            </div>
             <div class="button-group">
                 <hx hx-get="/loadSettings" hx-trigger="load" hx-swap="outerHTML" hx-target="this"></hx>
                 <hx hx-get="/loadUsageKPI" hx-trigger="load" hx-swap="outerHTML" hx-target="this"></hx>
@@ -39,6 +41,17 @@
 </div>
 
 <script>
+    var textareaControl = document.getElementById('textarea-control');
+
+    // Every 0.1s check if the text area have htmx-request class, if yes, add the class is-loading
+    setInterval(function () {
+        if (textareaControl.classList.contains('htmx-request')) {
+            textareaControl.classList.add('is-loading');
+        } else {
+            textareaControl.classList.remove('is-loading');
+        }
+    }, 10);
+
     document.getElementById('chat-input-textarea').addEventListener('focus', function () {
         var buttons = document.getElementsByClassName('to-reduce-opacity');
         for (var i = 0; i < buttons.length; i++) {
diff --git a/views/partials/popover-conversation.html b/views/partials/popover-conversation.html
index 6615913..6460955 100644
--- a/views/partials/popover-conversation.html
+++ b/views/partials/popover-conversation.html
@@ -14,7 +14,7 @@
                     {% for Conversation in Conversations %}
                     <div class="icon-text has-text unselected icon-conv {% if Conversation.Selected %} selected {% endif %}"
                         data-id="{{ Conversation.ID.String() }}" style="cursor: pointer;"
-                        onclick="toggleConversationSelection(this)"
+                        onclick="toggleConversationSelection(this, '{{ Conversation.Name }}')"
                         hx-get="/selectConversation?conversation-id={{ Conversation.ID.String() }}" hx-swap="outerHTML"
                         hx-target="#chat-container">
                         <span>{{ Conversation.Name }}</span>
@@ -61,22 +61,18 @@
             return document.getElementsByClassName('icon-conv selected')[0].getAttribute('data-id');
         }
 
-        function toggleConversationSelection(element) {
+        function toggleConversationSelection(element, name) {
             const elements = Array.from(document.getElementsByClassName('icon-conv'));
 
             // If the conversation is already selected, keep it
-            if (element.classList.contains('selected')) {
-                // Do nothing
-                return;
-            } else if (element.classList.contains('unselected')) {
+            if (element.classList.contains('unselected')) {
                 for (let i = 0; i < elements.length; i++) {
                     elements[i].classList.remove('selected');
                     elements[i].classList.add('unselected');
                 }
                 element.classList.remove('unselected');
                 element.classList.add('selected');
-                return;
-            } else {
+            } else if (!element.classList.contains('selected')) {
                 // Otherwise, select it
                 for (let i = 0; i < elements.length; i++) {
                     elements[i].classList.remove('selected');
@@ -86,8 +82,7 @@
                 element.classList.add('selected');
             }
 
-            // If the text inside the selected button is Default
-            if (element.textContent === 'Default') {
+            if (name === 'Default') {
                 document.getElementById('delete-conversation-button').disabled = true;
             } else {
                 document.getElementById('delete-conversation-button').disabled = false;
diff --git a/views/partials/popover-models.html b/views/partials/popover-models.html
index 7e3a2f0..f37213f 100644
--- a/views/partials/popover-models.html
+++ b/views/partials/popover-models.html
@@ -50,9 +50,12 @@
                             {% for modelInfo in ModelInfos %}
                             <option value="{{ modelInfo.ModelID }}">{{ modelInfo.ModelID }}</option>
                             {% endfor %}
-                            {% if IsSub %}<option value="custom">Inference Endpoints</option> {% endif %}
+                            <option value="{% if IsSub %}custom{% else %}none{% endif %}">Inference Endpoints</option>
                         </select>
                     </div>
+                    <p class="is-hidden" style="color: red;" id="endpoint-error"></p>
+                    <small>You can only use custom endpoint if you are a subscriber</small>
+                    </p>
                     <input class="input is-small mb-3 is-hidden" type="text" id="model-cid-input" name="model-cid-input"
                         placeholder="Model id" autocomplete="off">
                     <input class="input is-small mb-3 is-hidden" type="text" id="model-url-input" name="model-url-input"
@@ -103,8 +106,6 @@
             }
         });
 
-
-
         document.getElementById('model-name-input').addEventListener('input', function () {
             document.getElementById('confirm-create-model-button').disabled = this.value === '';
         })
@@ -120,6 +121,12 @@
             document.getElementById('model-url-input').classList.toggle('is-hidden', !customEndpoint);
             document.getElementById('model-key-input').classList.toggle('is-hidden', !customEndpoint);
             document.getElementById('model-cid-input').classList.toggle('is-hidden', !customEndpoint);
+
+            if (this.value === 'none') {
+                document.getElementById('endpoint-error').classList.remove('is-hidden');
+            } else {
+                document.getElementById('endpoint-error').classList.add('is-hidden');
+            }
         });
 
         document.getElementById('temperature-slider').addEventListener('input', function () {