From 1b9121e5b87625edbbc13d2dc0e42624173553ca Mon Sep 17 00:00:00 2001
From: oobabooga <112222186+oobabooga@users.noreply.github.com>
Date: Sat, 11 Jan 2025 12:41:41 -0800
Subject: [PATCH] Add a "refresh" button below the last message, add a missing
 file

---
 css/main.css              | 29 +++++++++++++++++++----------
 js/global_scope_js.js     | 23 +++++++++++++++++++++++
 modules/html_generator.py |  7 ++++++-
 3 files changed, 48 insertions(+), 11 deletions(-)
 create mode 100644 js/global_scope_js.js

diff --git a/css/main.css b/css/main.css
index 48c6727a..63681979 100644
--- a/css/main.css
+++ b/css/main.css
@@ -1236,11 +1236,10 @@ div.svelte-362y77>*, div.svelte-362y77>.form>* {
     position: relative;
 }
 
-.copy-button {
+.footer-button {
     position: absolute;
-    bottom: -23px;
-    left: 0;
     padding: 0;
+    margin: 0;
     border: none;
     border-radius: 3px;
     cursor: pointer;
@@ -1250,25 +1249,35 @@ div.svelte-362y77>*, div.svelte-362y77>.form>* {
     transition: opacity 0.2s;
 }
 
-.message:hover .copy-button,
-.user-message:hover .copy-button,
-.assistant-message:hover .copy-button {
+.footer-button#copy-button {
+    bottom: -23px;
+    left: 0;
+}
+
+.footer-button#refresh-button {
+    bottom: -23px;
+    left: 25px;
+}
+
+.message:hover .footer-button,
+.user-message:hover .footer-button,
+.assistant-message:hover .footer-button {
     opacity: 1;
 }
 
-.copy-button svg {
+.footer-button svg {
     stroke: rgb(156 163 175);
     transition: stroke 0.2s;
 }
 
-.copy-button:hover svg {
+.footer-button:hover svg {
     stroke: rgb(107 114 128);
 }
 
-.dark .copy-button svg {
+.dark .footer-button svg {
     stroke: rgb(156 163 175);
 }
 
-.dark .copy-button:hover svg {
+.dark .footer-button:hover svg {
     stroke: rgb(209 213 219);
 }
diff --git a/js/global_scope_js.js b/js/global_scope_js.js
new file mode 100644
index 00000000..79b673d7
--- /dev/null
+++ b/js/global_scope_js.js
@@ -0,0 +1,23 @@
+function copyToClipboard(element) {
+  if (!element) return;
+
+  const messageElement = element.closest(".message, .user-message, .assistant-message");
+  if (!messageElement) return;
+
+  const rawText = messageElement.getAttribute("data-raw");
+  if (!rawText) return;
+
+  navigator.clipboard.writeText(rawText).then(function() {
+    const originalSvg = element.innerHTML;
+    element.innerHTML = "<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"text-green-500 dark:text-green-400\"><path d=\"M5 12l5 5l10 -10\"></path></svg>";
+    setTimeout(() => {
+      element.innerHTML = originalSvg;
+    }, 1000);
+  }).catch(function(err) {
+    console.error("Failed to copy text: ", err);
+  });
+}
+
+function regenerateClick() {
+    document.getElementById("Regenerate").click();
+}
diff --git a/modules/html_generator.py b/modules/html_generator.py
index b565c63a..79a8dc64 100644
--- a/modules/html_generator.py
+++ b/modules/html_generator.py
@@ -293,7 +293,9 @@ def get_image_cache(path):
 
 
 copy_svg = '''<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-copy"><path d="M8 8m0 2a2 2 0 0 1 2 -2h8a2 2 0 0 1 2 2v8a2 2 0 0 1 -2 2h-8a2 2 0 0 1 -2 -2z"></path><path d="M16 8v-2a2 2 0 0 0 -2 -2h-8a2 2 0 0 0 -2 2v8a2 2 0 0 0 2 2h2"></path></svg>'''
-copy_button = f'<button class="copy-button" onclick="copyToClipboard(this)">{copy_svg}</button>'
+refresh_svg = '''<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-repeat"><path d="M4 12v-3a3 3 0 0 1 3 -3h13m-3 -3l3 3l-3 3"></path><path d="M20 12v3a3 3 0 0 1 -3 3h-13m3 3l-3 -3l3 -3"></path></svg>'''
+copy_button = f'<button class="footer-button" id="copy-button" onclick="copyToClipboard(this)">{copy_svg}</button>'
+refresh_button = f'<button class="footer-button" id="refresh-button" onclick="regenerateClick()">{refresh_svg}</button>'
 
 def generate_instruct_html(history):
     output = f'<style>{instruct_css}</style><div class="chat" id="chat"><div class="messages">'
@@ -320,6 +322,7 @@ def generate_instruct_html(history):
             f'<div class="text">'
             f'<div class="message-body">{converted_visible[1]}</div>'
             f'{copy_button}'
+            f'{refresh_button if i == len(history["visible"]) - 1 else ""}'
             f'</div>'
             f'</div>'
         )
@@ -368,6 +371,7 @@ def generate_cai_chat_html(history, name1, name2, style, character, reset_cache=
             f'<div class="username">{name2}</div>'
             f'<div class="message-body">{converted_visible[1]}</div>'
             f'{copy_button}'
+            f'{refresh_button if i == len(history["visible"]) - 1 else ""}'
             f'</div>'
             f'</div>'
         )
@@ -401,6 +405,7 @@ def generate_chat_html(history, name1, name2, reset_cache=False):
             f'<div class="text-bot">'
             f'<div class="message-body">{converted_visible[1]}</div>'
             f'{copy_button}'
+            f'{refresh_button if i == len(history["visible"]) - 1 else ""}'
             f'</div>'
             f'</div>'
         )