Add workspaces & persistent chats (#23)

app/MindWork AI Studio/Components/Pages/Chat.razor

@@ -2,7 +2,19 @@
 @using AIStudio.Chat
 @using AIStudio.Settings
 
-<MudText Typo="Typo.h3" Class="mb-2">Chats</MudText>
+@inherits AIStudio.Tools.MSGComponentBase
+
+<MudText Typo="Typo.h3" Class="mb-2 mr-3">
+    @if (this.chatThread is not null && this.chatThread.WorkspaceId != Guid.Empty)
+    {
+        @($"Chat in Workspace \"{this.currentWorkspaceName}\"")
+    }
+    else
+    {
+        @("Temporary Chat")
+    }
+</MudText>
+
 <MudSelect T="Provider" @bind-Value="@this.selectedProvider" Adornment="Adornment.Start" AdornmentIcon="@Icons.Material.Filled.Apps" Margin="Margin.Dense" Label="Provider" Class="mb-2 rounded-lg" Variant="Variant.Outlined">
     @foreach (var provider in this.SettingsManager.ConfigurationData.Providers)
     {
@@ -24,5 +36,64 @@
         <MudPaper Style="flex: 0 0 auto;">
             <MudTextField T="string" @ref="@this.inputField" @bind-Text="@this.userInput" Variant="Variant.Outlined" AutoGrow="@true" Lines="3" MaxLines="12" Label="@this.InputLabel" Placeholder="@this.ProviderPlaceholder" Adornment="Adornment.End" AdornmentIcon="@Icons.Material.Filled.Send" OnAdornmentClick="() => this.SendMessage()" ReadOnly="!this.IsProviderSelected || this.isStreaming" Immediate="@true" OnKeyUp="this.InputKeyEvent" UserAttributes="@USER_INPUT_ATTRIBUTES"/>
         </MudPaper>
+        <MudPaper Class="mt-1" Outlined="@true">
+            <MudToolBar WrapContent="true">
+                @if (this.SettingsManager.ConfigurationData.WorkspaceStorageBehavior is not WorkspaceStorageBehavior.DISABLE_WORKSPACES)
+                {
+                    <MudTooltip Text="Your workspaces" Placement="@TOOLBAR_TOOLTIP_PLACEMENT">
+                        <MudIconButton Icon="@Icons.Material.Filled.SnippetFolder" OnClick="() => this.ToggleWorkspaces()"/>
+                    </MudTooltip>
+                }
+
+                @if (this.SettingsManager.ConfigurationData.WorkspaceStorageBehavior is WorkspaceStorageBehavior.STORE_CHATS_MANUALLY)
+                {
+                    <MudTooltip Text="Save chat" Placement="@TOOLBAR_TOOLTIP_PLACEMENT">
+                        <MudIconButton Icon="@Icons.Material.Filled.Save" OnClick="() => this.SaveThread()" Disabled="@(!this.CanThreadBeSaved)"/>
+                    </MudTooltip>
+                }
+
+                <MudTooltip Text="Start temporary chat" Placement="@TOOLBAR_TOOLTIP_PLACEMENT">
+                    <MudIconButton Icon="@Icons.Material.Filled.AddComment" OnClick="() => this.StartNewChat(useSameWorkspace: false)"/>
+                </MudTooltip>
+
+                @if (!string.IsNullOrWhiteSpace(this.currentWorkspaceName))
+                {
+                    <MudTooltip Text="@this.TooltipAddChatToWorkspace" Placement="@TOOLBAR_TOOLTIP_PLACEMENT">
+                        <MudIconButton Icon="@Icons.Material.Filled.CommentBank" OnClick="() => this.StartNewChat(useSameWorkspace: true)"/>
+                    </MudTooltip>
+                }
+                
+                @if (this.SettingsManager.ConfigurationData.WorkspaceStorageBehavior is WorkspaceStorageBehavior.STORE_CHATS_AUTOMATICALLY)
+                {
+                    <MudTooltip Text="Delete this chat & start a new one" Placement="@TOOLBAR_TOOLTIP_PLACEMENT">
+                        <MudIconButton Icon="@Icons.Material.Filled.Refresh" OnClick="() => this.StartNewChat(useSameWorkspace: true, deletePreviousChat: true)" Disabled="@(!this.CanThreadBeSaved)"/>
+                    </MudTooltip>
+                }
+
+                @if (this.SettingsManager.ConfigurationData.WorkspaceStorageBehavior is not WorkspaceStorageBehavior.DISABLE_WORKSPACES)
+                {
+                    <MudTooltip Text="Move chat to (another) workspace" Placement="@TOOLBAR_TOOLTIP_PLACEMENT">
+                        <MudIconButton Icon="@Icons.Material.Filled.MoveToInbox" Disabled="@(!this.CanThreadBeSaved)" OnClick="() => this.MoveChatToWorkspace()"/>
+                    </MudTooltip>
+                }
+            </MudToolBar>
+        </MudPaper>
     </FooterContent>
-</InnerScrolling>
+</InnerScrolling>
+
+@if (this.SettingsManager.ConfigurationData.WorkspaceStorageBehavior != WorkspaceStorageBehavior.DISABLE_WORKSPACES)
+{
+    <MudDrawer @bind-Open="@this.workspacesVisible" Width="40em" Height="100%" Anchor="Anchor.Start" Variant="DrawerVariant.Temporary" Elevation="1">
+        <MudDrawerHeader>
+            <MudStack Row="@true" AlignItems="AlignItems.Center">
+                <MudText Typo="Typo.h6" Class="mr-3">
+                    Your workspaces
+                </MudText>
+                <MudIconButton Icon="@Icons.Material.Filled.Close" Variant="Variant.Filled" Color="Color.Default" Size="Size.Small" OnClick="() => this.ToggleWorkspaces()"/>
+            </MudStack>
+        </MudDrawerHeader>
+        <MudDrawerContainer Class="ml-6">
+            <Workspaces @ref="this.workspaces" @bind-CurrentChatThread="@this.chatThread" LoadedChatWasChanged="this.LoadedChatChanged"/>
+        </MudDrawerContainer>
+    </MudDrawer>
+}

app/MindWork AI Studio/Components/Pages/Chat.razor.cs

@@ -1,16 +1,21 @@
 using AIStudio.Chat;
+using AIStudio.Components.Blocks;
+using AIStudio.Components.CommonDialogs;
 using AIStudio.Provider;
 using AIStudio.Settings;
+using AIStudio.Tools;
 
 using Microsoft.AspNetCore.Components;
 using Microsoft.AspNetCore.Components.Web;
 
+using DialogOptions = AIStudio.Components.CommonDialogs.DialogOptions;
+
 namespace AIStudio.Components.Pages;
 
 /// <summary>
 /// The chat page.
 /// </summary>
-public partial class Chat : ComponentBase
+public partial class Chat : MSGComponentBase, IAsyncDisposable
 {
     [Inject]
     private SettingsManager SettingsManager { get; set; } = null!;
@@ -20,13 +25,22 @@ public partial class Chat : ComponentBase
 
     [Inject]
     public Random RNG { get; set; } = null!;
+    
+    [Inject]
+    public IDialogService DialogService { get; set; } = null!;
 
+    private const Placement TOOLBAR_TOOLTIP_PLACEMENT = Placement.Bottom;
     private static readonly Dictionary<string, object?> USER_INPUT_ATTRIBUTES = new();
     
     private AIStudio.Settings.Provider selectedProvider;
     private ChatThread? chatThread;
+    private bool hasUnsavedChanges;
     private bool isStreaming;
     private string userInput = string.Empty;
+    private string currentWorkspaceName = string.Empty;
+    private Guid currentWorkspaceId = Guid.Empty;
+    private bool workspacesVisible;
+    private Workspaces? workspaces;
     
     // Unfortunately, we need the input field reference to clear it after sending a message.
     // This is necessary because we have to handle the key events ourselves. Otherwise,
@@ -37,14 +51,11 @@ public partial class Chat : ComponentBase
 
     protected override async Task OnInitializedAsync()
     {
+        this.ApplyFilters([], [ Event.HAS_CHAT_UNSAVED_CHANGES, Event.RESET_CHAT_STATE ]);
+        
         // Configure the spellchecking for the user input:
         this.SettingsManager.InjectSpellchecking(USER_INPUT_ATTRIBUTES);
         
-        // For now, we just create a new chat thread.
-        // Later we want the chats to be persisted
-        // across page loads and organize them in
-        // a chat history & workspaces.
-        this.chatThread = new("Thread 1", this.RNG.Next(), "You are a helpful assistant!", []);
         await base.OnInitializedAsync();
     }
 
@@ -56,25 +67,60 @@ public partial class Chat : ComponentBase
 
     private string InputLabel => this.IsProviderSelected ? $"Your Prompt (use selected instance '{this.selectedProvider.InstanceName}', provider '{this.selectedProvider.UsedProvider.ToName()}')" : "Select a provider first";
     
+    private bool CanThreadBeSaved => this.chatThread is not null && this.chatThread.Blocks.Count > 0;
+
+    private string TooltipAddChatToWorkspace => $"Start new chat in workspace \"{this.currentWorkspaceName}\"";
+    
     private async Task SendMessage()
     {
         if (!this.IsProviderSelected)
             return;
         
+        // Create a new chat thread if necessary:
+        var threadName = this.ExtractThreadName(this.userInput);
+
+        if (this.chatThread is null)
+        {
+            this.chatThread = new()
+            {
+                WorkspaceId = this.currentWorkspaceId,
+                ChatId = Guid.NewGuid(),
+                Name = threadName,
+                Seed = this.RNG.Next(),
+                SystemPrompt = "You are a helpful assistant!",
+                Blocks = [],
+            };
+        }
+        else
+        {
+            // Set the thread name if it is empty:
+            if (string.IsNullOrWhiteSpace(this.chatThread.Name))
+                this.chatThread.Name = threadName;
+        }
+        
         //
         // Add the user message to the thread:
         //
         var time = DateTimeOffset.Now;
-        this.chatThread?.Blocks.Add(new ContentBlock(time, ContentType.TEXT, new ContentText
+        this.chatThread?.Blocks.Add(new ContentBlock
         {
-            // Text content properties:
-            Text = this.userInput,
-        })
-        {
-            // Content block properties:
+            Time = time,
+            ContentType = ContentType.TEXT,
             Role = ChatRole.USER,
+            Content = new ContentText
+            {
+                Text = this.userInput,
+            },
         });
 
+        // Save the chat:
+        if (this.SettingsManager.ConfigurationData.WorkspaceStorageBehavior is WorkspaceStorageBehavior.STORE_CHATS_AUTOMATICALLY)
+        {
+            await this.SaveThread();
+            this.hasUnsavedChanges = false;
+            this.StateHasChanged();
+        }
+
         //
         // Add the AI response to the thread:
         //
@@ -85,9 +131,12 @@ public partial class Chat : ComponentBase
             InitialRemoteWait = true,
         };
         
-        this.chatThread?.Blocks.Add(new ContentBlock(time, ContentType.TEXT, aiText)
+        this.chatThread?.Blocks.Add(new ContentBlock
         {
+            Time = time,
+            ContentType = ContentType.TEXT,
             Role = ChatRole.AI,
+            Content = aiText,
         });
         
         // Clear the input field:
@@ -96,6 +145,7 @@ public partial class Chat : ComponentBase
         
         // Enable the stream state for the chat component:
         this.isStreaming = true;
+        this.hasUnsavedChanges = true;
         this.StateHasChanged();
         
         // Use the selected provider to get the AI response.
@@ -103,6 +153,13 @@ public partial class Chat : ComponentBase
         // content to be streamed.
         await aiText.CreateFromProviderAsync(this.selectedProvider.UsedProvider.CreateProvider(this.selectedProvider.InstanceName, this.selectedProvider.Hostname), this.JsRuntime, this.SettingsManager, this.selectedProvider.Model, this.chatThread);
         
+        // Save the chat:
+        if (this.SettingsManager.ConfigurationData.WorkspaceStorageBehavior is WorkspaceStorageBehavior.STORE_CHATS_AUTOMATICALLY)
+        {
+            await this.SaveThread();
+            this.hasUnsavedChanges = false;
+        }
+
         // Disable the stream state:
         this.isStreaming = false;
         this.StateHasChanged();
@@ -110,6 +167,7 @@ public partial class Chat : ComponentBase
 
     private async Task InputKeyEvent(KeyboardEventArgs keyEvent)
     {
+        this.hasUnsavedChanges = true;
         var key = keyEvent.Code.ToLowerInvariant();
         
         // Was the enter key (either enter or numpad enter) pressed?
@@ -132,4 +190,216 @@ public partial class Chat : ComponentBase
                 break;
         }
     }
+    
+    private void ToggleWorkspaces()
+    {
+        this.workspacesVisible = !this.workspacesVisible;
+    }
+    
+    private async Task SaveThread()
+    {
+        if(this.workspaces is null)
+            return;
+        
+        if(this.chatThread is null)
+            return;
+        
+        if (!this.CanThreadBeSaved)
+            return;
+        
+        await this.workspaces.StoreChat(this.chatThread);
+        this.hasUnsavedChanges = false;
+    }
+    
+    private string ExtractThreadName(string firstUserInput)
+    {
+        // We select the first 10 words of the user input:
+        var words = firstUserInput.Split(' ', StringSplitOptions.RemoveEmptyEntries);
+        var threadName = string.Join(' ', words.Take(10));
+        
+        // If the thread name is empty, we use a default name:
+        if (string.IsNullOrWhiteSpace(threadName))
+            threadName = "Thread";
+        
+        return threadName;
+    }
+
+    private async Task StartNewChat(bool useSameWorkspace = false, bool deletePreviousChat = false)
+    {
+        if (this.SettingsManager.ConfigurationData.WorkspaceStorageBehavior is WorkspaceStorageBehavior.STORE_CHATS_MANUALLY && this.hasUnsavedChanges)
+        {
+            var dialogParameters = new DialogParameters
+            {
+                { "Message", "Are you sure you want to start a new chat? All unsaved changes will be lost." },
+            };
+        
+            var dialogReference = await this.DialogService.ShowAsync<ConfirmDialog>("Delete Chat", dialogParameters, DialogOptions.FULLSCREEN);
+            var dialogResult = await dialogReference.Result;
+            if (dialogResult.Canceled)
+                return;
+        }
+
+        if (this.chatThread is not null && this.workspaces is not null && deletePreviousChat)
+        {
+            string chatPath;
+            if (this.chatThread.WorkspaceId == Guid.Empty)
+            {
+                chatPath = Path.Join(SettingsManager.DataDirectory, "tempChats", this.chatThread.ChatId.ToString());
+            }
+            else
+            {
+                chatPath = Path.Join(SettingsManager.DataDirectory, "workspaces", this.chatThread.WorkspaceId.ToString(), this.chatThread.ChatId.ToString());
+            }
+            
+            await this.workspaces.DeleteChat(chatPath, askForConfirmation: false, unloadChat: true);
+        }
+
+        this.isStreaming = false;
+        this.hasUnsavedChanges = false;
+        this.userInput = string.Empty;
+
+        if (!useSameWorkspace)
+        {
+            this.chatThread = null;
+            this.currentWorkspaceId = Guid.Empty;
+            this.currentWorkspaceName = string.Empty;
+        }
+        else
+        {
+            this.chatThread = new()
+            {
+                WorkspaceId = this.currentWorkspaceId,
+                ChatId = Guid.NewGuid(),
+                Name = string.Empty,
+                Seed = this.RNG.Next(),
+                SystemPrompt = "You are a helpful assistant!",
+                Blocks = [],
+            };
+        }
+
+        await this.inputField.Clear();
+    }
+
+    private async Task MoveChatToWorkspace()
+    {
+        if(this.chatThread is null)
+            return;
+        
+        if(this.workspaces is null)
+            return;
+        
+        if (this.SettingsManager.ConfigurationData.WorkspaceStorageBehavior is WorkspaceStorageBehavior.STORE_CHATS_MANUALLY && this.hasUnsavedChanges)
+        {
+            var confirmationDialogParameters = new DialogParameters
+            {
+                { "Message", "Are you sure you want to move this chat? All unsaved changes will be lost." },
+            };
+        
+            var confirmationDialogReference = await this.DialogService.ShowAsync<ConfirmDialog>("Unsaved Changes", confirmationDialogParameters, DialogOptions.FULLSCREEN);
+            var confirmationDialogResult = await confirmationDialogReference.Result;
+            if (confirmationDialogResult.Canceled)
+                return;
+        }
+        
+        var dialogParameters = new DialogParameters
+        {
+            { "Message", "Please select the workspace where you want to move the chat to." },
+            { "SelectedWorkspace", this.chatThread?.WorkspaceId },
+            { "ConfirmText", "Move chat" },
+        };
+        
+        var dialogReference = await this.DialogService.ShowAsync<WorkspaceSelectionDialog>("Move Chat to Workspace", dialogParameters, DialogOptions.FULLSCREEN);
+        var dialogResult = await dialogReference.Result;
+        if (dialogResult.Canceled)
+            return;
+        
+        var workspaceId = dialogResult.Data is Guid id ? id : default;
+        if (workspaceId == Guid.Empty)
+            return;
+        
+        // Delete the chat from the current workspace or the temporary storage:
+        if (this.chatThread!.WorkspaceId == Guid.Empty)
+        {
+            // Case: The chat is stored in the temporary storage:
+            await this.workspaces.DeleteChat(Path.Join(SettingsManager.DataDirectory, "tempChats", this.chatThread.ChatId.ToString()), askForConfirmation: false, unloadChat: false);
+        }
+        else
+        {
+            // Case: The chat is stored in a workspace.
+            await this.workspaces.DeleteChat(Path.Join(SettingsManager.DataDirectory, "workspaces", this.chatThread.WorkspaceId.ToString(), this.chatThread.ChatId.ToString()), askForConfirmation: false, unloadChat: false);
+        }
+        
+        this.chatThread!.WorkspaceId = workspaceId;
+        await this.SaveThread();
+        
+        this.currentWorkspaceId = this.chatThread.WorkspaceId;
+        this.currentWorkspaceName = await this.workspaces.LoadWorkspaceName(this.chatThread.WorkspaceId);
+    }
+
+    private async Task LoadedChatChanged()
+    {
+        if(this.workspaces is null)
+            return;
+        
+        this.isStreaming = false;
+        this.hasUnsavedChanges = false;
+        this.userInput = string.Empty;
+        this.currentWorkspaceId = this.chatThread?.WorkspaceId ?? Guid.Empty;
+        this.currentWorkspaceName = this.chatThread is null ? string.Empty : await this.workspaces.LoadWorkspaceName(this.chatThread.WorkspaceId);
+        
+        await this.inputField.Clear();
+    }
+
+    private void ResetState()
+    {
+        this.isStreaming = false;
+        this.hasUnsavedChanges = false;
+        this.userInput = string.Empty;
+        this.currentWorkspaceId = Guid.Empty;
+        this.currentWorkspaceName = string.Empty;
+        this.chatThread = null;
+    }
+
+    #region Overrides of MSGComponentBase
+
+    public override Task ProcessMessage<T>(ComponentBase? sendingComponent, Event triggeredEvent, T? data) where T : default
+    {
+        switch (triggeredEvent)
+        {
+            case Event.RESET_CHAT_STATE:
+                this.ResetState();
+                break;
+        }
+        
+        return Task.CompletedTask;
+    }
+
+    public override Task<TResult?> ProcessMessageWithResult<TPayload, TResult>(ComponentBase? sendingComponent, Event triggeredEvent, TPayload? data) where TResult : default where TPayload : default
+    {
+        switch (triggeredEvent)
+        {
+            case Event.HAS_CHAT_UNSAVED_CHANGES:
+                if(this.SettingsManager.ConfigurationData.WorkspaceStorageBehavior is WorkspaceStorageBehavior.STORE_CHATS_AUTOMATICALLY)
+                    return Task.FromResult((TResult?) (object) false);
+                
+                return Task.FromResult((TResult?)(object)this.hasUnsavedChanges);
+        }
+        
+        return Task.FromResult(default(TResult));
+    }
+
+    #endregion
+
+    #region Implementation of IAsyncDisposable
+
+    public async ValueTask DisposeAsync()
+    {
+        if(this.SettingsManager.ConfigurationData.WorkspaceStorageBehavior is WorkspaceStorageBehavior.STORE_CHATS_AUTOMATICALLY)
+        {
+            await this.SaveThread();
+            this.hasUnsavedChanges = false;
+        }
+    }
+
+    #endregion
 }

app/MindWork AI Studio/Components/Pages/Settings.razor

@@ -62,5 +62,7 @@
         <ConfigurationOption OptionDescription="Enable spellchecking?" LabelOn="Spellchecking is enabled" LabelOff="Spellchecking is disabled" State="@(() => this.SettingsManager.ConfigurationData.EnableSpellchecking)" StateUpdate="@(updatedState => this.SettingsManager.ConfigurationData.EnableSpellchecking = updatedState)" OptionHelp="When enabled, spellchecking will be active in all input fields. Depending on your operating system, errors may not be visually highlighted, but right-clicking may still offer possible corrections." />
         <ConfigurationSelect OptionDescription="Shortcut to send input" SelectedValue="@(() => this.SettingsManager.ConfigurationData.ShortcutSendBehavior)" Data="@ConfigurationSelectDataFactory.GetSendBehaviorData()" SelectionUpdate="@(selectedValue => this.SettingsManager.ConfigurationData.ShortcutSendBehavior = selectedValue)" OptionHelp="Do you want to use any shortcut to send your input?"/>
         <ConfigurationSelect OptionDescription="Check for updates" SelectedValue="@(() => this.SettingsManager.ConfigurationData.UpdateBehavior)" Data="@ConfigurationSelectDataFactory.GetUpdateBehaviorData()" SelectionUpdate="@(selectedValue => this.SettingsManager.ConfigurationData.UpdateBehavior = selectedValue)" OptionHelp="How often should we check for app updates?"/>
+        <ConfigurationSelect OptionDescription="Workspace behavior" SelectedValue="@(() => this.SettingsManager.ConfigurationData.WorkspaceStorageBehavior)" Data="@ConfigurationSelectDataFactory.GetWorkspaceStorageBehaviorData()" SelectionUpdate="@(selectedValue => this.SettingsManager.ConfigurationData.WorkspaceStorageBehavior = selectedValue)" OptionHelp="Should we store your chats?"/>
+        <ConfigurationSelect OptionDescription="Workspace maintenance" SelectedValue="@(() => this.SettingsManager.ConfigurationData.WorkspaceStorageTemporaryMaintenancePolicy)" Data="@ConfigurationSelectDataFactory.GetWorkspaceStorageTemporaryMaintenancePolicyData()" SelectionUpdate="@(selectedValue => this.SettingsManager.ConfigurationData.WorkspaceStorageTemporaryMaintenancePolicy = selectedValue)" OptionHelp="If and when should we delete your temporary chats?"/>
     </MudPaper>
 </InnerScrolling>