start implementation

LM-Kit · Jan 23, 2025 · 23a0489 · 23a0489
1 parent 6d29338
commit 23a0489
Show file tree

Hide file tree

Showing 3 changed files with 48 additions and 22 deletions.
diff --git a/LM-Kit-Maestro/UI/Razor/Components/Chat.razor b/LM-Kit-Maestro/UI/Razor/Components/Chat.razor
@@ -11,11 +11,10 @@
 
 <SectionContent SectionName="top-bar">
     <div id="chat-top-bar">
-        <div
-            class="top-bar-side @(ViewModel.ChatsSidebarIsToggled ? "top-bar-sidebar-toggled" : "top-bar-sidebar-collapsed")">
+        <div class="top-bar-side @(ViewModel.ChatsSidebarIsToggled ? "top-bar-sidebar-toggled" : "top-bar-sidebar-collapsed")">
             <IconButton Style="IconButton.ButtonStyle.SidebarToggle"
                         Icon="fas fa-message"
-                        OnClick="ViewModel.ToggleChatsSidebar"/>
+                        OnClick="ViewModel.ToggleChatsSidebar" />
 
             @if (ViewModel.ChatsSidebarIsToggled)
             {
@@ -26,21 +25,20 @@
 
             <IconButton Style="IconButton.ButtonStyle.SecondaryAction"
                         Icon="fas fa-add"
-                        OnClick="ViewModel.ConversationListViewModel.AddNewConversation"/>
+                        OnClick="ViewModel.ConversationListViewModel.AddNewConversation" />
         </div>
 
         <div id="top-bar-center">
-            <ModelSelectionButton ModelListViewModel="ViewModel.ModelListViewModel"/>
+            <ModelSelectionButton ModelListViewModel="ViewModel.ModelListViewModel" />
         </div>
 
-        <div
-            class="top-bar-side @(ViewModel.SettingsSidebarIsToggled ? "top-bar-sidebar-toggled" : "top-bar-sidebar-collapsed")">
+        <div class="top-bar-side @(ViewModel.SettingsSidebarIsToggled ? "top-bar-sidebar-toggled" : "top-bar-sidebar-collapsed")">
 
             @if (ViewModel.SettingsSidebarIsToggled)
             {
                 <IconButton Style="IconButton.ButtonStyle.SecondaryAction"
                             Icon="fas fa-arrow-rotate-left"
-                            OnClick="ViewModel.SettingsViewModel.ResetDefaultValues"/>
+                            OnClick="ViewModel.SettingsViewModel.ResetDefaultValues" />
 
                 <MudText Typo="Typo.body2">
                     Settings
@@ -49,7 +47,7 @@
 
             <IconButton Style="IconButton.ButtonStyle.SidebarToggle"
                         Icon="fas fa-gears"
-                        OnClick="ViewModel.ToggleSettingsSidebar"/>
+                        OnClick="ViewModel.ToggleSettingsSidebar" />
         </div>
     </div>
 </SectionContent>
@@ -65,7 +63,7 @@
                 <ConversationListItem OnSelect="OnConversationItemSelected"
                                       OnDelete="OnConversationItemDeleteClicked"
                                       IsSelected="@(conversation == ViewModel.ConversationListViewModel.CurrentConversation)"
-                                      ViewModel="conversation"/>
+                                      ViewModel="conversation" />
             }
         </div>
     </div>
@@ -110,7 +108,7 @@
                     <div id="chat-messages" class="chat-element">
                         @foreach (var message in ViewModel.ConversationListViewModel.CurrentConversation.Messages)
                         {
-                            <ChatMessage MessageViewModel="message"/>
+                            <ChatMessage MessageViewModel="message" />
                         }
 
                         <div id="chat-messages-bottom-space">
@@ -132,7 +130,7 @@
         </div>
 
         <div id="user-input" class="chat-element">
-            <UserInput ViewModel="ViewModel!.ConversationListViewModel.CurrentConversation"/>
+            <UserInput ViewModel="ViewModel!.ConversationListViewModel.CurrentConversation" />
         </div>
 
         <div id="bottom-space">
@@ -142,14 +140,14 @@
                     Tokens: @ViewModel.ConversationListViewModel.CurrentConversation.LMKitConversation.ContextUsedSpace /
                     @ViewModel.ConversationListViewModel.CurrentConversation.LMKitConversation.ContextSize
                     (@CalculateUsagePercentage(ViewModel.ConversationListViewModel.CurrentConversation.LMKitConversation.ContextUsedSpace,
-                             ViewModel.ConversationListViewModel.CurrentConversation.LMKitConversation.ContextSize)%)
+                            ViewModel.ConversationListViewModel.CurrentConversation.LMKitConversation.ContextSize)%)
                 </MudText>
             }
         </div>
     </div>
 
-    @*     <div id="settings-sidebar"
+    <div id="settings-sidebar"
          class="@(ViewModel.SettingsSidebarIsToggled ? "sidebar" : "sidebar-hide")">
-        <ChatSettings/>
-    </div> *@
+        <ChatSettings ViewModel="ViewModel.SettingsViewModel" />
+    </div>
 </div>
diff --git a/LM-Kit-Maestro/UI/Razor/Components/ChatSettings.razor b/LM-Kit-Maestro/UI/Razor/Components/ChatSettings.razor
@@ -1,7 +1,32 @@
-<p>
-    Setting 1
-</p>
+@inherits ComponentBase
 
-<p>
-    Setting 2
-</p>
+<MudExpansionPanels>
+    <MudExpansionPanel Text="General settings">
+        <MudStack>
+
+            <div>
+                <MudText>
+                    Chatbot purpose
+                </MudText>
+
+                <MudTextField Lines="5" Value="ViewModel.SystemPrompt"/>
+            </div>
+
+            <div>
+                <MudText>
+                    Chatbot purpose
+                </MudText>
+
+                <MudTextField Value="ViewModel.SystemPrompt"/>
+            </div>
+        </MudStack>
+    </MudExpansionPanel>
+
+    <MudExpansionPanel Text="Samping configuration">
+    </MudExpansionPanel>
+</MudExpansionPanels>
+
+@code
+{
+    [Parameter] public SettingsViewModel ViewModel { get; set; }
+}
diff --git a/LM-Kit-Maestro/UI/Razor/Components/ChatSettings.razor.css b/LM-Kit-Maestro/UI/Razor/Components/ChatSettings.razor.css
@@ -0,0 +1,3 @@
+.setting{
+
+}