Merge pull request #3242 from SillyTavern/role-icons-for-PM add prompt role icons to prompt manager

f47c98f85d77fffc61e38988b6d55e58eb31ff1f

Cohee <18619528+Cohee1207@users.noreply.github.com>

Signed

Parents: 6d0f58c8628bcfab7e9aa51f38f42251273ababb 48e5c11f9b096211e4776b553f7221c52e1552bb

public/css/promptmanager.css+6 -1 Viewed

@@ -28,6 +28,11 @@
28	color: var(--white50a);	28	color: var(--white50a);
29	}	29	}
30		30
		31	#completion_prompt_manager #completion_prompt_manager_list .completion_prompt_manager_prompt .completion_prompt_manager_prompt_name .fa-solid[data-role] {
		32	vertical-align: unset;
		33	margin-left: 3px;
		34	}
		35
31	#completion_prompt_manager #completion_prompt_manager_list .completion_prompt_manager_prompt_invisible {	36	#completion_prompt_manager #completion_prompt_manager_list .completion_prompt_manager_prompt_invisible {
32	display: none;	37	display: none;
33	}	38	}

+}
 #completion_prompt_manager #completion_prompt_manager_list .completion_prompt_manager_prompt .completion_prompt_manager_prompt_name .fa-solid.prompt-manager-overridden {
-    margin-left: 5px;
+    margin-left: 3px;
     color: var(--SmartThemeQuoteColor);
     cursor: pointer;
     opacity: 0.8;

public/index.html+5 -1 Viewed

                                 <label for="completion_prompt_manager_popup_entry_form_role">
                                     <span data-i18n="Role">Role</span>
                                 </label>
-                                <div class="text_muted" data-i18n="To whom this message will be attributed.">To whom this message will be attributed.</div>
+                                <div class="text_muted">
+                                    <span data-i18n="To whom this message will be attributed.">To whom this message will be attributed.</span>
+                                    <span data-i18n="Unspecified = Prompt Manager decides.">Unspecified = Prompt Manager decides.</span>
+                                </div>
                                 <select id="completion_prompt_manager_popup_entry_form_role" class="text_pole" name="role">
+                                    <option data-i18n="Unspecified" value="">Unspecified</option>
                                     <option data-i18n="System" value="system">System</option>
                                     <option data-i18n="User" value="user">User</option>
                                     <option data-i18n="AI Assistant" value="assistant">AI Assistant</option>

public/scripts/PromptManager.js+19 -7 Viewed

+            }
             document.getElementById(this.configuration.prefix + 'prompt_manager_popup_entry_form_name').value = prompt.name;
-            document.getElementById(this.configuration.prefix + 'prompt_manager_popup_entry_form_role').value = 'system';
+            document.getElementById(this.configuration.prefix + 'prompt_manager_popup_entry_form_role').value = '';
             document.getElementById(this.configuration.prefix + 'prompt_manager_popup_entry_form_prompt').value = prompt.content ?? '';
             document.getElementById(this.configuration.prefix + 'prompt_manager_popup_entry_form_injection_position').value = prompt.injection_position ?? 0;
             document.getElementById(this.configuration.prefix + 'prompt_manager_popup_entry_form_injection_depth').value = prompt.injection_depth ?? DEFAULT_DEPTH;

         const forbidOverridesBlock = document.getElementById(this.configuration.prefix + 'prompt_manager_forbid_overrides_block');
         nameField.value = prompt.name ?? '';
-        roleField.value = prompt.role ?? 'system';
+        roleField.value = prompt.role ?? '';
         promptField.value = prompt.content ?? '';
         promptField.disabled = prompt.marker ?? false;
         injectionPositionField.value = prompt.injection_position ?? INJECTION_POSITION.RELATIVE;

             let detachSpanHtml = '';
             if (this.isPromptDeletionAllowed(prompt)) {
                 detachSpanHtml = `
-                    <span title="Remove" class="prompt-manager-detach-action caution fa-solid fa-chain-broken"></span>
+                    <span title="Remove" class="prompt-manager-detach-action caution fa-solid fa-chain-broken fa-xs"></span>
                 `;
             } else {
                 detachSpanHtml = '<span class="fa-solid"></span>';

             let editSpanHtml = '';
             if (this.isPromptEditAllowed(prompt)) {
                 editSpanHtml = `
-                    <span title="edit" class="prompt-manager-edit-action fa-solid fa-pencil"></span>
+                    <span title="edit" class="prompt-manager-edit-action fa-solid fa-pencil fa-xs"></span>
                 `;
             } else {
                 editSpanHtml = '<span class="fa-solid"></span>';

+            }
             const encodedName = escapeHtml(prompt.name);
+            const isRolePrompt = !!prompt.role;
             const isMarkerPrompt = prompt.marker && prompt.injection_position !== INJECTION_POSITION.ABSOLUTE;
             const isSystemPrompt = !prompt.marker && prompt.system_prompt && prompt.injection_position !== INJECTION_POSITION.ABSOLUTE && !prompt.forbid_overrides;
             const isImportantPrompt = !prompt.marker && prompt.system_prompt && prompt.injection_position !== INJECTION_POSITION.ABSOLUTE && prompt.forbid_overrides;

             const isInjectionPrompt = prompt.injection_position === INJECTION_POSITION.ABSOLUTE;
             const isOverriddenPrompt = Array.isArray(this.overriddenPrompts) && this.overriddenPrompts.includes(prompt.identifier);
             const importantClass = isImportantPrompt ? `${prefix}prompt_manager_important` : '';
+            //add role icons to the right of prompt name
+            const promptRoles = {
+                system: { roleIcon: 'fa-cog', roleTitle: 'Prompt will be sent as System' },
+                assistant: { roleIcon: 'fa-robot', roleTitle: 'Prompt will be sent as Assistant' },
+                user: { roleIcon: 'fa-user', roleTitle: 'Prompt will be sent as User' },
+            };
+            const roleIcon = isRolePrompt ? promptRoles[prompt.role]?.roleIcon : '';
+            const roleTitle = isRolePrompt ? promptRoles[prompt.role]?.roleTitle : '';
             listItemHtml += `
-                <li class="${prefix}prompt_manager_prompt ${draggableClass} ${enabledClass} ${markerClass} ${importantClass}" data-pm-identifier="${prompt.identifier}">
+                <li class="${prefix}prompt_manager_prompt ${draggableClass} ${enabledClass} ${markerClass} ${importantClass}" data-pm-identifier="${escapeHtml(prompt.identifier)}">
                     <span class="${prefix}prompt_manager_prompt_name" data-pm-name="${encodedName}">
                         ${isMarkerPrompt ? '<span class="fa-fw fa-solid fa-thumb-tack" title="Marker"></span>' : ''}
                         ${isSystemPrompt ? '<span class="fa-fw fa-solid fa-square-poll-horizontal" title="Global Prompt"></span>' : ''}
                         ${isImportantPrompt ? '<span class="fa-fw fa-solid fa-star" title="Important Prompt"></span>' : ''}
-                        ${isUserPrompt ? '<span class="fa-fw fa-solid fa-user" title="User Prompt"></span>' : ''}
+                        ${isUserPrompt ? '<span class="fa-fw fa-solid fa-asterisk" title="Preset Prompt"></span>' : ''}
                         ${isInjectionPrompt ? '<span class="fa-fw fa-solid fa-syringe" title="In-Chat Injection"></span>' : ''}
                         ${this.isPromptInspectionAllowed(prompt) ? `<a title="${encodedName}" class="prompt-manager-inspect-action">${encodedName}</a>` : `<span title="${encodedName}">${encodedName}</span>`}
-                        ${isInjectionPrompt ? `<small class="prompt-manager-injection-depth">@ ${prompt.injection_depth}</small>` : ''}
+                        ${isRolePrompt ? `<span data-role="${escapeHtml(prompt.role)}" class="fa-xs fa-solid ${roleIcon}" title="${roleTitle}"></span>` : ''}
+                        ${isInjectionPrompt ? `<small class="prompt-manager-injection-depth">@ ${escapeHtml(prompt.injection_depth)}</small>` : ''}
                         ${isOverriddenPrompt ? '<small class="fa-solid fa-address-card prompt-manager-overridden" title="Pulled from a character card"></small>' : ''}
                     </span>
                     <span>