From 365f7f36e9ad4942c6b9bc9940dd52fdf694e155 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Peer=20Sch=C3=BCtt?=
 <20603780+peerschuett@users.noreply.github.com>
Date: Wed, 21 May 2025 16:58:24 +0200
Subject: [PATCH] Added a "use default system prompt" button and adapted the
 texts a bit

---
 .../Components/ChatComponent.razor            |  7 +++-
 .../Settings/SettingsPanelChatTemplates.razor |  8 ++--
 .../Dialogs/ChatTemplateDialog.razor          | 41 +++++++++----------
 .../Dialogs/ChatTemplateDialog.razor.cs       |  5 +++
 4 files changed, 34 insertions(+), 27 deletions(-)

diff --git a/app/MindWork AI Studio/Components/ChatComponent.razor b/app/MindWork AI Studio/Components/ChatComponent.razor
index 4f17ad83..4886c8f1 100644
--- a/app/MindWork AI Studio/Components/ChatComponent.razor	
+++ b/app/MindWork AI Studio/Components/ChatComponent.razor	
@@ -109,8 +109,11 @@
             
             <ProfileSelection CurrentProfile="@this.currentProfile" CurrentProfileChanged="@this.ProfileWasChanged"/>
             
-            <ChatTemplateSelection CurrentChatTemplate="@this.currentChatTemplate" CurrentChatTemplateChanged="@this.ChatTemplateWasChanged"/>
-            
+            @if (this.SettingsManager.ConfigurationData.ChatTemplates.Count > 0)
+            {
+                <ChatTemplateSelection CurrentChatTemplate="@this.currentChatTemplate" CurrentChatTemplateChanged="@this.ChatTemplateWasChanged"/>
+            }
+
             @if (PreviewFeatures.PRE_RAG_2024.IsEnabled(this.SettingsManager))
             {
                 <DataSourceSelection @ref="@this.dataSourceSelectionComponent" PopoverTriggerMode="PopoverTriggerMode.BUTTON" PopoverButtonClasses="ma-3" LLMProvider="@this.Provider" DataSourceOptions="@this.GetCurrentDataSourceOptions()" DataSourceOptionsChanged="@(async options => await this.SetCurrentDataSourceOptions(options))" DataSourcesAISelected="@this.GetAgentSelectedDataSources()"/>
diff --git a/app/MindWork AI Studio/Components/Settings/SettingsPanelChatTemplates.razor b/app/MindWork AI Studio/Components/Settings/SettingsPanelChatTemplates.razor
index 1be0158b..2851f659 100644
--- a/app/MindWork AI Studio/Components/Settings/SettingsPanelChatTemplates.razor	
+++ b/app/MindWork AI Studio/Components/Settings/SettingsPanelChatTemplates.razor	
@@ -10,14 +10,14 @@
     </MudJustifiedText>
 
     <MudJustifiedText Typo="Typo.body1" Class="mb-3">
-        @T("Note: This advanced feature is designed for users familiar with prompt engineering concepts.")
+        @T("Note: This advanced feature is designed for users familiar with prompt engineering concepts. Furthermore, you have to make sure yourself that your chosen provider supports the use of assistant prompts.")
     </MudJustifiedText>
     
     <MudTable Items="@this.SettingsManager.ConfigurationData.ChatTemplates" Hover="@true" Class="border-dashed border rounded-lg">
         <ColGroup>
             <col style="width: 3em;"/>
             <col/>
-            <col style="width: 20em;"/>
+            <col style="width: 16em;"/>
         </ColGroup>
         <HeaderContent>
             <MudTh>#</MudTh>
@@ -30,10 +30,10 @@
             <MudTd>
                 <MudStack Row="true" Class="mb-2 mt-2" Wrap="Wrap.Wrap">
                     <MudTooltip Text="@T("Edit")">
-                        <MudIconButton Variant="Variant.Filled" Color="Color.Info" Icon="@Icons.Material.Filled.Edit" OnClick="() => this.EditChatTemplate(context)"/>
+                        <MudIconButton Color="Color.Info" Icon="@Icons.Material.Filled.Edit" OnClick="() => this.EditChatTemplate(context)"/>
                     </MudTooltip> 
                     <MudTooltip Text="@T("Delete")">
-                        <MudIconButton Variant="Variant.Filled" Color="Color.Error" Icon="@Icons.Material.Filled.Delete" OnClick="() => this.DeleteChatTemplate(context)"/>
+                        <MudIconButton Color="Color.Error" Icon="@Icons.Material.Filled.Delete" OnClick="() => this.DeleteChatTemplate(context)"/>
                     </MudTooltip> 
                 </MudStack>
             </MudTd>
diff --git a/app/MindWork AI Studio/Dialogs/ChatTemplateDialog.razor b/app/MindWork AI Studio/Dialogs/ChatTemplateDialog.razor
index 0954edef..c49ab2e5 100644
--- a/app/MindWork AI Studio/Dialogs/ChatTemplateDialog.razor	
+++ b/app/MindWork AI Studio/Dialogs/ChatTemplateDialog.razor	
@@ -7,7 +7,7 @@
     <DialogContent>
 
         <MudJustifiedText Typo="Typo.body1" Class="mb-3">
-            @T("Create your custom chat template to tailor the LLM's behavior for specific tasks or domains. Define a custom system prompt and provide example exchanges to design an AI experience perfectly suited to your requirements.")
+            @T("Create your custom chat template to tailor the LLM's behavior for specific tasks or domains. Define a custom system prompt and provide an example conversation to design an AI experience perfectly suited to your requirements.")
         </MudJustifiedText>
 
         <MudJustifiedText Typo="Typo.body1" Class="mb-3">
@@ -45,25 +45,32 @@
                 AutoGrow="@true"
                 MaxLines="12"
                 Class="mb-3"
+                MaxLength="444"
                 UserAttributes="@SPELLCHECK_ATTRIBUTES"
                 HelperText="@T("Tell the AI your system prompt.")"
             />
             
-            <MudSwitch @bind-Value="allowProfileUsage" Color="Color.Primary" Class="mb-3" Label="@T("Allow the use of profiles together with this chat template?")" ThumbIcon="@Icons.Material.Filled.Person4" ThumbIconColor="Color.Default"/>
+            <MudTooltip Text="@T("Are you unsure which system prompt to use? You can simply start with the default system prompt that AI Studio uses for all chats.")">
+                <MudButton Class="mb-3" Color="Color.Primary" OnClick="@this.UseDefaultSystemPrompt" Size="Size.Small" StartIcon="@Icons.Material.Filled.Add" Variant="Variant.Filled">@T("Use the default system prompt")</MudButton>
+            </MudTooltip>
+            
+            <MudTooltip Text="@T("Using some chat templates in tandem with profiles might cause issues. Therefore, you can preliminarily block the usage of profiles here.")">
+                <MudSwitch @bind-Value="allowProfileUsage" Class="mb-3" Color="Color.Primary" Label="@T("Allow the use of profiles together with this chat template?")" ThumbIcon="@Icons.Material.Filled.Person4" ThumbIconColor="Color.Default" />
+            </MudTooltip>
             
             <MudText Typo="Typo.h6" Class="mb-3">
-                @T("Example Exchanges")
+                @T("Example Conversation")
             </MudText>
             
             <MudJustifiedText Typo="Typo.body1" Class="mb-3">
-                @T("Add example exchanges (user prompt followed by assistant response) to demonstrate the desired interaction pattern. These examples help the AI understand your expectations by showing it the correct format, style, and content of responses before it receives actual user inputs.")
+                @T("Add messages of an example conversation (user prompt followed by assistant prompt) to demonstrate the desired interaction pattern. These examples help the AI understand your expectations by showing it the correct format, style, and content of responses before it receives actual user inputs.")
             </MudJustifiedText>
             
-            <MudTable FixedHeader="true" Items="@AdditionalMessages" RowEditPreview="BackupItem" RowEditCancel="ResetItemToOriginalValues" RowEditCommit="ItemHasBeenCommitted" CanCancelEdit="true" CommitEditTooltip="@T("Commit Changes")" Elevation="10" Outlined="true" Class="mt-3 mb-6">
+            <MudTable CanCancelEdit="true" Class="mt-3 mb-6" CommitEditTooltip="@T("Commit Changes")" Elevation="10" FixedHeader="true" Items="@AdditionalMessages" Outlined="true" RowEditCancel="@this.ResetItemToOriginalValues" RowEditCommit="@this.ItemHasBeenCommitted" RowEditPreview="@this.BackupItem">
                 <ColGroup>
-                    <col style="width: 20%;" />
-                    <col style="width: 65%;" />
-                    <col style="width: 15%;" />
+                    <col style="width: 16em;" />
+                    <col/>
+                    <col style="width: 16em;" />
                 </ColGroup>
                 <HeaderContent>
                     <MudTh>Role</MudTh>
@@ -76,16 +83,8 @@
                         @(context.Content is ContentText textContent ? textContent.Text : context.Content?.ToString())
                     </MudTd>
                     <MudTd style="text-align: center">
-                        <MudIconButton Icon="@Icons.Material.Filled.Add"
-                                       Color="Color.Primary"
-                                       Size="Size.Small"
-                                       OnClick="@(() => AddNewMessageBelow(context))"
-                                       Variant="Variant.Filled"/>
-                        <MudIconButton Icon="@Icons.Material.Filled.Delete"
-                                       Color="Color.Error"
-                                       Size="Size.Small"
-                                       OnClick="@(() => RemoveMessage(context))"
-                                       Variant="Variant.Filled"/>
+                        <MudIconButton Color="Color.Primary" Icon="@Icons.Material.Filled.Add" OnClick="@(() => AddNewMessageBelow(context))" />
+                        <MudIconButton Color="Color.Error" Icon="@Icons.Material.Filled.Delete" OnClick="@(() => RemoveMessage(context))" />
                     </MudTd>
                 </RowTemplate>
                 <RowEditingTemplate>
@@ -98,16 +97,16 @@
                         </MudSelect>
                     </MudTd>
                     <MudTd DataLabel="Message">
-                        <MudTextField Label="Your message" AutoGrow="true" @bind-Value="context.Content.As<ContentText>()!.Text" Required />
+                        <MudTextField AutoGrow="true" @bind-Value="context.Content.As<ContentText>()!.Text" Label="Your message" Required />
                     </MudTd>
                 </RowEditingTemplate>
                 <PagerContent>
-                    <MudTablePager RowsPerPageString="Messages per page"  PageSizeOptions="[10,20,50,100]"/>
+                    <MudTablePager PageSizeOptions="[10,20,50,100]" RowsPerPageString="Messages per page" />
                 </PagerContent>
             </MudTable>
         </MudForm>
         
-        <MudButton Color="Color.Primary" Variant="Variant.Filled" OnClick="AddNewMessageToEnd" StartIcon="@Icons.Material.Filled.Add" Class="mb-3">@T("Add additional message")</MudButton>
+        <MudButton Class="mb-3" Color="Color.Primary" OnClick="@this.AddNewMessageToEnd" StartIcon="@Icons.Material.Filled.Add" Variant="Variant.Filled">@T("Add additional message")</MudButton>
         
         <Issues IssuesData="@this.dataIssues"/>
     </DialogContent>
diff --git a/app/MindWork AI Studio/Dialogs/ChatTemplateDialog.razor.cs b/app/MindWork AI Studio/Dialogs/ChatTemplateDialog.razor.cs
index c098632c..56069cd5 100644
--- a/app/MindWork AI Studio/Dialogs/ChatTemplateDialog.razor.cs	
+++ b/app/MindWork AI Studio/Dialogs/ChatTemplateDialog.razor.cs	
@@ -225,5 +225,10 @@ public partial class ChatTemplateDialog : MSGComponentBase
         return null;
     }
 
+    private void UseDefaultSystemPrompt()
+    {
+        this.DataSystemPrompt = SystemPrompts.DEFAULT;
+    }
+
     private void Cancel() => this.MudDialog.Cancel();
 }
\ No newline at end of file