Update: Basic Functions of chat.html 75% maybe

frontend/js/components/ui.js

@@ -326,6 +326,41 @@ class UIPatterns {
             });
         }
     }
+     /**
+     * Sets a button to a loading state by disabling it and showing a spinner.
+     * It stores the button's original content to be restored later.
+     * @param {HTMLButtonElement} button - The button element to modify.
+     */
+    setButtonLoading(button) {
+        if (!button) return;
+        // Store original content if it hasn't been stored already
+        if (!button.dataset.originalContent) {
+            button.dataset.originalContent = button.innerHTML;
+        }
+        button.disabled = true;
+        button.innerHTML = '<i class="fas fa-spinner fa-spin"></i>';
+    }
+    /**
+     * Restores a button from its loading state to its original content and enables it.
+     * @param {HTMLButtonElement} button - The button element to restore.
+     */
+    clearButtonLoading(button) {
+        if (!button) return;
+        if (button.dataset.originalContent) {
+            button.innerHTML = button.dataset.originalContent;
+            // Clean up the data attribute
+            delete button.dataset.originalContent;
+        }
+        button.disabled = false;
+    }
+    /**
+     * Returns the HTML for a streaming text cursor animation.
+     * This is used as a placeholder in the chat UI while waiting for an assistant's response.
+     * @returns {string} The HTML string for the loader.
+     */
+    renderStreamingLoader() {
+        return '<span class="streaming-cursor animate-pulse">▋</span>';
+    }
 }
 
 /**