Hide/unhide messages

public/index.html

@@ -90,6 +90,7 @@
     <script type="module" src="scripts/setting-search.js"></script>
     <script type="module" src="scripts/bulk-edit.js"></script>
     <script type="module" src="scripts/cfg-scale.js"></script>
+    <script type="module" src="scripts/chats.js"></script>
 
     <title>SillyTavern</title>
 </head>
@@ -4348,6 +4349,7 @@
                     <div class="flex-container flex1 alignitemscenter">
                         <div class="flex-container alignItemsBaseline">
                             <span class="name_text">${characterName}</span>
+                            <i class="mes_ghost fa-solid fa-ghost" title="This message is invisible for the AI" data-i18n="[title]This message is invisible for the AI"></i>
                             <small class="timestamp"></small>
                         </div>
                     </div>
@@ -4359,6 +4361,8 @@
                             <div title="Generate Image" class="sd_message_gen fa-solid fa-paintbrush" data-i18n="[title]Generate Image"></div>
                             <div title="Narrate" class="mes_narrate fa-solid fa-bullhorn" data-i18n="[title]Narrate"></div>
                             <div title="Prompt" class="mes_prompt fa-solid fa-square-poll-horizontal " data-i18n="[title]Prompt"></div>
+                            <div title="Exclude message from prompts" class="mes_hide fa-solid fa-eye" data-i18n="[title]Exclude message from prompts"></div>
+                            <div title="Include message in prompts" class="mes_unhide fa-solid fa-eye-slash" data-i18n="[title]Include message in prompts"></div>
                             <div title="Create bookmark" class="mes_create_bookmark fa-regular fa-solid fa-book-bookmark" data-i18n="[title]Create Bookmark"></div>
                             <div title="Create branch" class="mes_create_branch fa-regular fa-code-branch" data-i18n="[title]Create Branch"></div>
                             <div title="Copy" class="mes_copy fa-solid fa-copy " data-i18n="[title]Copy"></div>

public/scripts/chats.js

@@ -0,0 +1,73 @@
+// Move chat functions here from script.js (eventually)
+
+import {
+    chat,
+    getCurrentChatId,
+    hideSwipeButtons,
+    saveChatConditional,
+    showSwipeButtons,
+} from "../script.js";
+
+/**
+ * Mark message as hidden (system message).
+ * @param {number} messageId Message ID
+ * @param {JQuery<Element>} messageBlock Message UI element
+ * @returns
+ */
+export async function hideChatMessage(messageId, messageBlock) {
+    const chatId = getCurrentChatId();
+
+    if (!chatId || isNaN(messageId)) return;
+
+    const message = chat[messageId];
+
+    if (!message) return;
+
+    message.is_system = true;
+    messageBlock.attr('is_system', String(true));
+
+    // Reload swipes. Useful when a last message is hidden.
+    hideSwipeButtons();
+    showSwipeButtons();
+
+    await saveChatConditional();
+}
+
+/**
+ * Mark message as visible (non-system message).
+ * @param {number} messageId Message ID
+ * @param {JQuery<Element>} messageBlock Message UI element
+ * @returns
+ */
+export async function unhideChatMessage(messageId, messageBlock) {
+    const chatId = getCurrentChatId();
+
+    if (!chatId || isNaN(messageId)) return;
+
+    const message = chat[messageId];
+
+    if (!message) return;
+
+    message.is_system = false;
+    messageBlock.attr('is_system', String(false));
+
+    // Reload swipes. Useful when a last message is hidden.
+    hideSwipeButtons();
+    showSwipeButtons();
+
+    await saveChatConditional();
+}
+
+jQuery(function() {
+    $(document).on('click', '.mes_hide', async function() {
+        const messageBlock = $(this).closest('.mes');
+        const messageId = Number(messageBlock.attr('mesid'));
+        await hideChatMessage(messageId, messageBlock);
+    });
+
+    $(document).on('click', '.mes_unhide', async function() {
+        const messageBlock = $(this).closest('.mes');
+        const messageId = Number(messageBlock.attr('mesid'));
+        await unhideChatMessage(messageId, messageBlock);
+    });
+})

public/scripts/slash-commands.js

@@ -31,6 +31,7 @@ import { getRegexedString, regex_placement } from "./extensions/regex/engine.js"
 import { chat_styles, power_user } from "./power-user.js";
 import { autoSelectPersona } from "./personas.js";
 import { getContext } from "./extensions.js";
+import { hideChatMessage, unhideChatMessage } from "./chats.js";
 export {
     executeSlashCommands,
     registerSlashCommand,
@@ -138,6 +139,8 @@ parser.addCommand('ask', askCharacter, [], '<span class="monospace">(prompt)</sp
 parser.addCommand('delname', deleteMessagesByNameCallback, ['cancel'], '<span class="monospace">(name)</span> – deletes all messages attributed to a specified name', true, true);
 parser.addCommand('send', sendUserMessageCallback, ['add'], '<span class="monospace">(text)</span> – adds a user message to the chat log without triggering a generation', true, true);
 parser.addCommand('trigger', triggerGroupMessageCallback, [], '<span class="monospace">(member index or name)</span> – triggers a message generation for the specified group member', true, true);
+parser.addCommand('hide', hideMessageCallback, [], '<span class="monospace">(message index)</span> – hides a chat message from the prompt', true, true);
+parser.addCommand('unhide', unhideMessageCallback, [], '<span class="monospace">(message index)</span> – unhides a message from the prompt', true, true);
 
 const NARRATOR_NAME_KEY = 'narrator_name';
 const NARRATOR_NAME_DEFAULT = 'System';
@@ -225,6 +228,40 @@ async function askCharacter(_, text) {
     eventSource.on(event_types.CHARACTER_MESSAGE_RENDERED, restoreCharacter);
 }
 
+async function hideMessageCallback(_, arg) {
+    if (!arg) {
+        console.warn('WARN: No argument provided for /hide command');
+        return;
+    }
+
+    const messageId = Number(arg);
+    const messageBlock = $(`.mes[mesid="${messageId}"]`);
+
+    if (!messageBlock.length) {
+        console.warn(`WARN: No message found with ID ${messageId}`);
+        return;
+    }
+
+    await hideChatMessage(messageId, messageBlock);
+}
+
+async function unhideMessageCallback(_, arg) {
+    if (!arg) {
+        console.warn('WARN: No argument provided for /unhide command');
+        return;
+    }
+
+    const messageId = Number(arg);
+    const messageBlock = $(`.mes[mesid="${messageId}"]`);
+
+    if (!messageBlock.length) {
+        console.warn(`WARN: No message found with ID ${messageId}`);
+        return;
+    }
+
+    await unhideChatMessage(messageId, messageBlock);
+}
+
 async function triggerGroupMessageCallback(_, arg) {
     if (!selected_group) {
         toastr.warning("Cannot run this command outside of a group chat.");

public/style.css

@@ -218,6 +218,11 @@ table.responsiveTable {
     display: none;
 }
 
+.mes[is_system="true"] .avatar {
+    opacity: 0.9;
+    filter: grayscale(25%);
+}
+
 .mes_text table {
     border-spacing: 0;
     border-collapse: collapse;
@@ -304,10 +309,23 @@ table.responsiveTable {
 
 .mes_translate,
 .sd_message_gen,
+.mes_ghost,
 .mes_narrate {
     display: none;
 }
 
+.mes[is_system="true"] .mes_hide {
+    display: none;
+}
+
+.mes[is_system="false"] .mes_unhide {
+    display: none;
+}
+
+.mes[is_system="true"] .mes_ghost {
+    display: flex;
+}
+
 small {
     color: var(--grey70);
 }