Merge branch 'dev' of https://github.com/SillyLossy/TavernAI into dev

public/index.html

@@ -370,15 +370,6 @@
                                         <input id="openai_reverse_proxy" type="text" class="text_pole" placeholder="https://api.openai.com/v1" maxlength="100" />
                                     </div>
                                 </div>
-                                <div class="range-block">
-                                    <label for="oai_breakdown" class="checkbox_label widthFreeExpand">
-                                        <input id="oai_breakdown" type="checkbox" />
-                                        Token Breakdown
-                                    </label>
-                                    <div class="toggle-description justifyLeft">
-                                        Display a breakdown of the tokens used in the request.
-                                    </div>
-                                </div>
                                 <div class="range-block">
                                     <div class="range-block-title">
                                         Context Size (tokens)
@@ -2557,11 +2548,6 @@
         <div id="chat">
         </div>
         <div id="form_sheld">
-            <div id="token_breakdown" style="display:none;">
-                <div>
-                    <!-- Token Breakdown Goes Here -->
-                </div>
-            </div>
             <div id="dialogue_del_mes">
                 <div id="dialogue_del_mes_ok" class="menu_button">Delete</div>
                 <div id="dialogue_del_mes_cancel" class="menu_button">Cancel</div>

public/script.js

@@ -49,6 +49,7 @@ import {
     editGroup,
     deleteGroupChat,
     renameGroupChat,
+    importGroupChat,
 } from "./scripts/group-chats.js";
 
 import {
@@ -291,11 +292,22 @@ const system_messages = {
         is_system: true,
         is_name: true,
         mes: [
-            'Hi there! The following chat formatting commands are supported:',
-            '<ol>',
-            '<li><tt>{{text}}</tt> – sets a one-time behavioral bias for the AI. Resets when you send the next message.</li>',
-            '</ol>',
-        ].join('')
+            `Hi there! The following chat formatting commands are supported:
+            <ul>
+            <li><tt>{{text}}</tt> - sets a one-time behavioral bias for the AI. Resets when you send the next message.
+            </li>
+            </ul>
+            Hotkeys/Keybinds: 
+            <ul>
+            <li><tt>Up</tt> = Edit last message in chat</li>
+            <li><tt>Ctrl+Up</tt> = Edit last USER message in chat</li>
+            <li><tt>Left</tt> = swipe left</li>
+            <li><tt>Right</tt> = swipe right (NOTE: swipe hotkeys are disabled when chatbar has something typed into it)</li>
+            <li><tt>Ctrl+Left</tt> = view locally stored variables (in the browser console window)</li>
+            <li><tt>Enter</tt> (with chat bar selected) = send your message to AI</li>
+            <li><tt>Ctrl+Enter</tt> = Regenerate the last AI response</li>
+            </ul>`
+        ]
     },
     welcome:
     {
@@ -304,42 +316,42 @@ const system_messages = {
         is_user: false,
         is_name: true,
         mes: [
-            '<h2>Welcome to <span id="version_display_welcome">SillyTavern</span>!</h2>',
-            '<div id="version_display_welcome"></div>',
-            '<h3>Want to Update to the latest version?</h3>',
-            "Read the <a href='/notes/update.html' target='_blank'>instructions here</a>. Also located in your installation's base folder",
-            '<hr class="sysHR">',
-            '<h3>In order to begin chatting:</h3>',
-            '<ol>',
-            '<li>Connect to one of the supported generation APIs (the plug icon)</li>',
-            '<li>Create or pick a character from the list (the top-right namecard icon)</li>',
-            '</ol>',
-            '<hr class="sysHR">',
-            '<h3>Where to download more characters?</h3>',
-            '<i>(Not endorsed, your discretion is advised)</i>',
-            '<ol>',
-            '<li><a target="_blank" href="https://discord.gg/pygmalionai">Pygmalion AI Discord</a></li>',
-            '<li><a target="_blank" href="https://www.characterhub.org/">CharacterHub (NSFW)</a></li>',
-            '</ol>',
-            '<hr class="sysHR">',
-            '<h3>Where can I get help?</h3>',
-            'Before going any further, check out the following resources:',
-            '<ol>',
-            '<li><a target="_blank" href="/notes/readme.md">Introduction to SillyTavern</a></li>',
-            '<li><a target="_blank" href="/notes/faq.md">SillyTavern FAQ</a></li>',
-            '<li><a target="_blank" href="/notes">SillyTavern Guidebook</a></li>',
-            '<li><a target="_blank" href="https://github.com/Cohee1207/TavernAI-extras/blob/main/README.md">Extras API Docs</a></li>',
-            '<li><a target="_blank" href="https://docs.alpindale.dev/">Pygmalion AI Docs</a></li>',
-            '</ol>',
-            'Type <tt>/?</tt> in any chat to get help on message formatting commands.',
-            '<hr class="sysHR">',
-            '<h3>Still have questions or suggestions left?</h3>',
-            '<a target="_blank" href="https://discord.gg/RZdyAEUPvj">SillyTavern Community Discord</a>',
-            '<br/>',
-            '<a target="_blank" href="https://github.com/Cohee1207/SillyTavern/issues">Post a GitHub issue.</a>',
-            '<br/>',
-            '<a target="_blank" href="https://github.com/Cohee1207/SillyTavern#questions-or-suggestions">Contact the developers.</a>',
-        ].join('')
+            `<h2>Welcome to <span id="version_display_welcome">SillyTavern</span>!</h2>
+            <div id="version_display_welcome"></div>
+            <h3>Want to Update to the latest version?</h3>
+            Read the <a href='/notes/update.html' target='_blank'>instructions here</a>. Also located in your installation's base folder
+            <hr class="sysHR">
+            <h3>In order to begin chatting:</h3>
+            <ol>
+            <li>Connect to one of the supported generation APIs (the plug icon)</li>
+            <li>Create or pick a character from the list (the top-right namecard icon)</li>
+            </ol>
+            <hr class="sysHR">
+            <h3>Where to download more characters?</h3>
+            <i>(Not endorsed, your discretion is advised)</i>
+            <ol>
+            <li><a target="_blank" href="https://discord.gg/pygmalionai">Pygmalion AI Discord</a></li>
+            <li><a target="_blank" href="https://www.characterhub.org/">CharacterHub (NSFW)</a></li>
+            </ol>
+            <hr class="sysHR">
+            <h3>Where can I get help?</h3>
+            Before going any further, check out the following resources:
+            <ol>
+            <li><a target="_blank" href="/notes/readme.md">Introduction to SillyTavern</a></li>
+            <li><a target="_blank" href="/notes/faq.md">SillyTavern FAQ</a></li>
+            <li><a target="_blank" href="/notes">SillyTavern Guidebook</a></li>
+            <li><a target="_blank" href="https://github.com/Cohee1207/TavernAI-extras/blob/main/README.md">Extras API Docs</a></li>
+            <li><a target="_blank" href="https://docs.alpindale.dev/">Pygmalion AI Docs</a></li>
+            </ol>
+            Type <tt>/?</tt> in any chat to get help on message formatting commands.
+            <hr class="sysHR">
+            <h3>Still have questions or suggestions left?</h3>
+            <a target="_blank" href="https://discord.gg/RZdyAEUPvj">SillyTavern Community Discord</a>
+            <br>
+            <a target="_blank" href="https://github.com/Cohee1207/SillyTavern/issues">Post a GitHub issue.</a>
+            <br>
+            <a target="_blank" href="https://github.com/Cohee1207/SillyTavern#questions-or-suggestions">Contact the developers.</a>
+        `].join('')
     },
     group: {
         name: systemUserName,
@@ -408,7 +420,7 @@ async function getClientVersion() {
         let displayVersion = `SillyTavern ${data.pkgVersion}`;
 
         if (data.gitRevision && data.gitBranch) {
-            displayVersion += ` '${data.gitBranch}' (${data.gitRevision})`;
+            displayVersion += ` '${data.gitBranch}'(${data.gitRevision})`;
         }
 
         $('#version_display').text(displayVersion);
@@ -447,7 +459,7 @@ function getTokenCount(str, padding = undefined) {
             jQuery.ajax({
                 async: false,
                 type: 'POST', //
-                url: `/tokenize_llama`,
+                url: `/ tokenize_llama`,
                 data: JSON.stringify({ text: str }),
                 dataType: "json",
                 contentType: "application/json",
@@ -2420,9 +2432,6 @@ function getMaxContextSize() {
 }
 
 function parseTokenCounts(counts, thisPromptBits) {
-    const breakdown_bar = $('#token_breakdown div:first-child');
-    breakdown_bar.empty();
-
     const total = Object.values(counts).filter(x => !Number.isNaN(x)).reduce((acc, val) => acc + val, 0);
 
     thisPromptBits.push({
@@ -2436,22 +2445,6 @@ function parseTokenCounts(counts, thisPromptBits) {
         oaiConversationTokens: Object.entries(counts)[7][1],
         oaiTotalTokens: total,
     });
-
-    Object.entries(counts).forEach(([type, value]) => {
-        if (value === 0) {
-            return;
-        }
-        const percent_value = (value / total) * 100;
-        const color = uniqolor(type, { saturation: 50, lightness: 75, }).color;
-        const bar = document.createElement('div');
-        bar.style.width = `${percent_value}%`;
-        bar.classList.add('token_breakdown_segment');
-        bar.style.backgroundColor = color + 'AA';
-        bar.style.borderColor = color + 'FF';
-        bar.innerText = value;
-        bar.title = `${type}: ${percent_value.toFixed(2)}%`;
-        breakdown_bar.append(bar);
-    });
 }
 
 function adjustChatsSeparator(mesSendString) {
@@ -3398,6 +3391,7 @@ async function read_avatar_load(input) {
         await delay(durationSaveEdit);
         await fetch(getThumbnailUrl('avatar', formData.get('avatar_url')), {
             method: 'GET',
+            cache: 'no-cache',
             headers: {
                 'pragma': 'no-cache',
                 'cache-control': 'no-cache',
@@ -3569,10 +3563,8 @@ function changeMainAPI() {
         // Hide common settings for OpenAI
         if (selectedVal == "openai") {
             $("#common-gen-settings-block").css("display", "none");
-            //$("#token_breakdown").css("display", "flex");
         } else {
             $("#common-gen-settings-block").css("display", "block");
-            //$("#token_breakdown").css("display", "none");
         }
         // Hide amount gen for poe
         if (selectedVal == "poe") {
@@ -3962,7 +3954,7 @@ async function getPastCharacterChats() {
     return data;
 }
 
-async function displayPastChats() {
+export async function displayPastChats() {
     $("#select_chat_div").empty();
 
     const group = selected_group ? groups.find(x => x.id === selected_group) : null;
@@ -3999,7 +3991,7 @@ async function displayPastChats() {
 
             $("#select_chat_div").append(template);
 
-            if (currentChat === fileName.replace(".jsonl", "")) {
+            if (currentChat === fileName.toString().replace(".jsonl", "")) {
                 $("#select_chat_div").find(".select_chat_block:last").attr("highlight", true);
             }
         }
@@ -4044,7 +4036,6 @@ async function getStatusNovel() {
     }
 }
 
-
 function selectRightMenuWithAnimation(selectedMenuId) {
     const displayModes = {
         'rm_info_block': 'flex',
@@ -4065,13 +4056,7 @@ function selectRightMenuWithAnimation(selectedMenuId) {
                 easing: animation_easing,
                 complete: function () { },
             });
-
-
-
-            // $(menu).find('#groupCurrentMemberListToggle').click();
-
         }
-
     })
 }
 
@@ -4113,10 +4098,8 @@ function select_rm_info(type, charId) {
         setTimeout(function () {
             $(`#rm_characters_block [title="${charId + '.png'}"]`).parent().removeClass('flash animated');
         }, 5000);
-
     }
 
-
     setRightTabSelectedClass();
 
     prev_selected_char = charId;
@@ -4446,6 +4429,27 @@ export async function saveChatConditional() {
     }
 }
 
+async function importCharacterChat(formData) {
+    await jQuery.ajax({
+        type: "POST",
+        url: "/importchat",
+        data: formData,
+        beforeSend: function () {
+        },
+        cache: false,
+        contentType: false,
+        processData: false,
+        success: async function (data) {
+            if (data.res) {
+                await displayPastChats();
+            }
+        },
+        error: function () {
+            $("#create_button").removeAttr("disabled");
+        },
+    });
+}
+
 function updateViewMessageIds() {
     $('#chat').find(".mes").each(function (index, element) {
         $(element).attr("mesid", index);
@@ -6278,12 +6282,13 @@ $(document).ready(function () {
         $("#chat_import_file").click();
     });
 
-    $("#chat_import_file").on("change", function (e) {
+    $("#chat_import_file").on("change", async function (e) {
         var file = e.target.files[0];
-        //console.log(1);
+
         if (!file) {
             return;
         }
+
         var ext = file.name.match(/\.(\w+)$/);
         if (
             !ext ||
@@ -6292,33 +6297,23 @@ $(document).ready(function () {
             return;
         }
 
+        if (selected_group && file.name.endsWith('.json')) {
+            toastr.warning("Only SillyTavern's own format is supported for group chat imports. Sorry!");
+            return;
+        }
+
         var format = ext[1].toLowerCase();
         $("#chat_import_file_type").val(format);
-        //console.log(format);
+
         var formData = new FormData($("#form_import_chat").get(0));
-        //console.log('/importchat entered with: '+formData);
-        jQuery.ajax({
-            type: "POST",
-            url: "/importchat",
-            data: formData,
-            beforeSend: function () {
-                $("#select_chat_div").html("");
-                $("#load_select_chat_div").css("display", "block");
-                //$('#create_button').attr('value','Creating...');
-            },
-            cache: false,
-            contentType: false,
-            processData: false,
-            success: function (data) {
-                //console.log(data);
-                if (data.res) {
-                    displayPastChats();
-                }
-            },
-            error: function (jqXHR, exception) {
-                $("#create_button").removeAttr("disabled");
-            },
-        });
+        $("#select_chat_div").html("");
+        $("#load_select_chat_div").css("display", "block");
+
+        if (selected_group) {
+            await importGroupChat(formData);
+        } else {
+            await importCharacterChat(formData);
+        }
     });
 
     $("#rm_button_group_chats").click(function () {

public/scripts/group-chats.js

@@ -47,6 +47,7 @@ import {
     select_selected_character,
     cancelTtsPlay,
     isMultigenEnabled,
+    displayPastChats,
 } from "../script.js";
 import { appendTagToList, createTagMapFromList, getTagsList, applyTagsOnCharacterSelect } from './tags.js';
 
@@ -292,6 +293,12 @@ async function getGroups() {
             if (group.past_metadata == undefined) {
                 group.past_metadata = {};
             }
+            if (typeof group.chat_id === 'number') {
+                group.chat_id = String(group.chat_id);
+            }
+            if (Array.isArray(group.chats) && group.chats.some(x => typeof x === 'number')) {
+                group.chats = group.chats.map(x => String(x));
+            }
         }
     }
 }
@@ -1282,6 +1289,34 @@ export async function deleteGroupChat(groupId, chatId) {
     }
 }
 
+export async function importGroupChat(formData) {
+    await jQuery.ajax({
+        type: "POST",
+        url: "/importgroupchat",
+        data: formData,
+        beforeSend: function () {
+        },
+        cache: false,
+        contentType: false,
+        processData: false,
+        success: async function (data) {
+            if (data.res) {
+                const chatId = data.res;
+                const group = groups.find(x => x.id == selected_group);
+                
+                if (group) {
+                    group.chats.push(chatId);
+                    await editGroup(selected_group, true, true);
+                    await displayPastChats();
+                }
+            }
+        },
+        error: function () {
+            $("#create_button").removeAttr("disabled");
+        },
+    });
+}
+
 export async function saveGroupBookmarkChat(groupId, name, metadata) {
     const group = groups.find(x => x.id === groupId);
 

public/scripts/openai.js

@@ -102,7 +102,6 @@ const default_settings = {
     openai_model: 'gpt-3.5-turbo',
     jailbreak_system: false,
     reverse_proxy: '',
-    oai_breakdown: false,
 };
 
 const oai_settings = {
@@ -127,7 +126,6 @@ const oai_settings = {
     openai_model: 'gpt-3.5-turbo',
     jailbreak_system: false,
     reverse_proxy: '',
-    oai_breakdown: false,
 };
 
 let openai_setting_names;
@@ -460,7 +458,7 @@ async function prepareOpenAIMessages(name2, storyString, worldInfoBefore, worldI
     handler_instance.log();
     return [
         openai_msgs_tosend,
-        oai_settings.oai_breakdown ? handler_instance.counts : false,
+        handler_instance.counts,
     ];
 }
 
@@ -562,13 +560,19 @@ async function sendOpenAIRequest(type, openai_msgs_tosend, signal) {
             const decoder = new TextDecoder();
             const reader = response.body.getReader();
             let getMessage = "";
+            let messageBuffer = "";
             while (true) {
                 const { done, value } = await reader.read();
                 let response = decoder.decode(value);
 
                 tryParseStreamingError(response);
-
-                let eventList = response.split("\n");
+                
+                // ReadableStream's buffer is not guaranteed to contain full SSE messages as they arrive in chunks
+                // We need to buffer chunks until we have one or more full messages (separated by double newlines)
+                messageBuffer += response;
+                let eventList = messageBuffer.split("\n\n");
+                // Last element will be an empty string or a leftover partial message
+                messageBuffer = eventList.pop();
 
                 for (let event of eventList) {
                     if (!event.startsWith("data"))
@@ -745,7 +749,6 @@ function loadOpenAISettings(data, settings) {
     if (settings.nsfw_first !== undefined) oai_settings.nsfw_first = !!settings.nsfw_first;
     if (settings.openai_model !== undefined) oai_settings.openai_model = settings.openai_model;
     if (settings.jailbreak_system !== undefined) oai_settings.jailbreak_system = !!settings.jailbreak_system;
-    if (settings.oai_breakdown !== undefined) oai_settings.oai_breakdown = !!settings.oai_breakdown;
 
     $('#stream_toggle').prop('checked', oai_settings.stream_openai);
 
@@ -761,7 +764,6 @@ function loadOpenAISettings(data, settings) {
     $('#wrap_in_quotes').prop('checked', oai_settings.wrap_in_quotes);
     $('#nsfw_first').prop('checked', oai_settings.nsfw_first);
     $('#jailbreak_system').prop('checked', oai_settings.jailbreak_system);
-    $('#oai_breakdown').prop('checked', oai_settings.oai_breakdown);
 
     if (settings.main_prompt !== undefined) oai_settings.main_prompt = settings.main_prompt;
     if (settings.nsfw_prompt !== undefined) oai_settings.nsfw_prompt = settings.nsfw_prompt;
@@ -881,7 +883,7 @@ async function saveOpenAIPreset(name, settings) {
         jailbreak_system: settings.jailbreak_system,
         impersonation_prompt: settings.impersonation_prompt,
         bias_preset_selected: settings.bias_preset_selected,
-        oai_breakdown: settings.oai_breakdown,
+        reverse_proxy: settings.reverse_proxy,
     };
 
     const savePresetSettings = await fetch(`/savepreset_openai?name=${name}`, {
@@ -1140,12 +1142,12 @@ function onSettingsPresetChange() {
         wrap_in_quotes: ['#wrap_in_quotes', 'wrap_in_quotes', true],
         nsfw_first: ['#nsfw_first', 'nsfw_first', true],
         jailbreak_system: ['#jailbreak_system', 'jailbreak_system', true],
-        oai_breakdown: ['#oai_breakdown', 'oai_breakdown', true],
         main_prompt: ['#main_prompt_textarea', 'main_prompt', false],
         nsfw_prompt: ['#nsfw_prompt_textarea', 'nsfw_prompt', false],
         jailbreak_prompt: ['#jailbreak_prompt_textarea', 'jailbreak_prompt', false],
         impersonation_prompt: ['#impersonation_prompt_textarea', 'impersonation_prompt', false],
         bias_preset_selected: ['#openai_logit_bias_preset', 'bias_preset_selected', false],
+        reverse_proxy: ['#openai_reverse_proxy', 'reverse_proxy', false],
     };
 
     for (const [key, [selector, setting, isCheckbox]] of Object.entries(settingsToUpdate)) {
@@ -1313,16 +1315,6 @@ $(document).ready(function () {
         saveSettingsDebounced();
     });
 
-    $("#oai_breakdown").on('change', function () {
-        oai_settings.oai_breakdown = !!$(this).prop("checked");
-        if (!oai_settings.oai_breakdown) {
-            $("#token_breakdown").css('display', 'none');
-        } else {
-            $("#token_breakdown").css('display', 'flex');
-        }
-        saveSettingsDebounced();
-    });
-
     // auto-select a preset based on character/group name
     $(document).on("click", ".character_select", function () {
         const chid = $(this).attr('chid');

public/style.css

@@ -427,19 +427,6 @@ code {
     justify-content: center;
 }
 
-#token_breakdown div {
-    display: flex;
-    width: 100%;
-    justify-content: center;
-}
-
-.token_breakdown_segment {
-    min-width: 40px !important;
-    border: solid 2px;
-    border-radius: 5px;
-}
-
-
 #loading_mes {
     display: none;
     width: 40px;