From e7332225ff0198745bc49290c6dae2e7e647b513 Mon Sep 17 00:00:00 2001
From: mic <m@micz.it>
Date: Sun, 21 Jul 2024 22:43:28 +0200
Subject: [PATCH] adding action button after response and collecting the full
 html response in a var

---
 api_webchat/messagesArea.js | 20 ++++++++++++++++++--
 1 file changed, 18 insertions(+), 2 deletions(-)

diff --git a/api_webchat/messagesArea.js b/api_webchat/messagesArea.js
index 6a2cc350..2aff3bb9 100644
--- a/api_webchat/messagesArea.js
+++ b/api_webchat/messagesArea.js
@@ -64,6 +64,9 @@ messagesDiv.id = 'messages';
 messagesAreaTemplate.content.appendChild(messagesDiv);
 
 class MessagesArea extends HTMLElement {
+
+    fullTextHTML = "";
+
     constructor() {
         super();
         this.accumulatingMessageEl = null;
@@ -95,9 +98,11 @@ class MessagesArea extends HTMLElement {
 
     handleTokensDone() {
         this.flushAccumulatingMessage();
+        this.addActionButtons();
     }
 
     appendUserMessage(messageText, source="You") {
+        this.fullTextHTML = "";
         console.log("appendUserMessage: " + messageText);
         const header = document.createElement('h2');
         header.textContent = source;
@@ -134,7 +139,14 @@ class MessagesArea extends HTMLElement {
     addActionButtons() {
         const actionButtons = document.createElement('div');
         actionButtons.classList.add('action-buttons');
+        const actionButton = document.createElement('button');
+        actionButton.textContent = 'Send';
+        actionButton.addEventListener('click', () => {
+            alert(this.fullText);
+        });
+        actionButtons.appendChild(actionButton);
         this.messages.appendChild(actionButtons);
+        this.scrollToBottom();
     }
 
     flushAccumulatingMessage() {
@@ -148,6 +160,8 @@ class MessagesArea extends HTMLElement {
             // Convert Markdown to DOM nodes using the markdown-it library
             const md = window.markdownit();
             const html = md.render(fullText);
+
+            this.fullTextHTML += html;
     
             // Create a new DOM parser
             const parser = new DOMParser();
@@ -162,15 +176,17 @@ class MessagesArea extends HTMLElement {
             Array.from(doc.body.childNodes).forEach(node => {
                 this.accumulatingMessageEl.appendChild(node);
             });
-    
+  
             this.accumulatingMessageEl = null;
         }
     }
-    
+
 
     appendBotMessage(messageText) {
         console.log("appendBotMessage: " + messageText);
 
+        this.fullTextHTML = messageText;
+
         const lastMessage = this.messages.lastElementChild;
         const isLastMessageFromUser = lastMessage && lastMessage.classList.contains('user');