Fix some UI problems that are not in the new version

ChatRPG/Pages/CampaignPage.razor

@@ -36,7 +36,13 @@
                     <div class="scrollbar" style="max-height: 25vh; overflow-y: auto">
                         @foreach (Character character in _npcList)
                         {
-                            <div class="card card-dim mb-2 text-black text-center">
+                            <div class="card card-dim mb-2 text-black text-center position-relative">
+                                @if (character.CurrentHealth <= 0)
+                                {
+                                    <div class="skull-icon">
+                                        <i class="fas fa-skull"></i>
+                                    </div>
+                                }
                                 <div class="card-body col-12">
                                     <h5 class="card-title" id="character-list-name">@character.Name</h5>
                                     <hr/>

ChatRPG/Pages/CampaignPage.razor.cs

@@ -31,6 +31,7 @@ public partial class CampaignPage
     private Character? _mainCharacter;
     private UserPromptType _activeUserPromptType = UserPromptType.Do;
     private string _userInputPlaceholder = InputPlaceholder[UserPromptType.Do];
+    private bool _pageInitialized;
 
     private static readonly Dictionary<UserPromptType, string> InputPlaceholder = new()
     {
@@ -44,7 +45,7 @@ public partial class CampaignPage
         : "margin-top: 20px; margin-bottom: 60px;";
 
     [Inject] private IConfiguration? Configuration { get; set; }
-    [Inject] private IJSRuntime? JsRuntime { get; set; }
+    [Inject] private JsInteropService? JsService { get; set; }
     [Inject] private AuthenticationStateProvider? AuthenticationStateProvider { get; set; }
     [Inject] private IPersistenceService? PersistenceService { get; set; }
     [Inject] private ICampaignMediatorService? CampaignMediatorService { get; set; }
@@ -83,10 +84,7 @@ protected override async Task OnInitializedAsync()
         _shouldSave = Configuration!.GetValue<bool>("SaveConversationsToFile");
         GameInputHandler!.ChatCompletionReceived += OnChatCompletionReceived;
         GameInputHandler!.ChatCompletionChunkReceived += OnChatCompletionChunkReceived;
-        if (_conversation.Count == 0)
-        {
-            InitializeCampaign();
-        }
+        _pageInitialized = true;
     }
 
     /// <summary>
@@ -98,14 +96,18 @@ protected override async Task OnAfterRenderAsync(bool firstRender)
     {
         if (firstRender)
         {
-            _scrollJsScript ??= await JsRuntime!.InvokeAsync<IJSObjectReference>("import", "./js/scroll.js");
-            _detectScrollBarJsScript ??=
-                await JsRuntime!.InvokeAsync<IJSObjectReference>("import", "./js/detectScrollBar.js");
+            _scrollJsScript ??= await JsService!.GetScrollModuleAsync();
+            _detectScrollBarJsScript ??= await JsService!.GetDetectScrollBarModuleAsync();
             await ScrollToElement(BottomId); // scroll down to latest message
         }
+
+        if (_pageInitialized && _conversation.Count == 0)
+        {
+            await InitializeCampaign();
+        }
     }
 
-    private void InitializeCampaign()
+    private async Task InitializeCampaign()
     {
         string content = $"The player is {_campaign!.Player.Name}, described as \"{_campaign.Player.Description}\".";
         if (_campaign.StartScenario != null)
@@ -116,7 +118,7 @@ private void InitializeCampaign()
         _isWaitingForResponse = true;
         OpenAiGptMessage message = new(ChatMessageRole.System, content);
         _conversation.Add(message);
-        GameInputHandler?.HandleInitialPrompt(_campaign, _conversation);
+        await GameInputHandler?.HandleInitialPrompt(_campaign, _conversation)!;
         UpdateStatsUi();
     }
 

ChatRPG/Pages/Navbar.razor

@@ -16,6 +16,11 @@
             </a>
             <div class="d-sm-inline-flex flex-sm-row-reverse">
                 <div class="hstack">
+                    <button @onclick='() => NavMan.NavigateTo("/", forceLoad: true)' class="btn btn-in"
+                            id="dashboard-button"
+                            style="@(!_isHidden ? "display:block;" : "display:none;")">
+                        <span class="btn-in-span"></span>Dashboard
+                    </button>
                     <button @onclick='() => NavMan.NavigateTo("Manage", forceLoad: true)' class="btn btn-in" id="manage-button">
                         <span class="btn-in-span"></span>@Username
                     </button>
@@ -29,8 +34,31 @@
 </header>
 
 @code {
+    private bool _isHidden;
 
     [Parameter, EditorRequired]
     public string Username { get; set; } = null!;
 
+    protected override void OnInitialized()
+    {
+        NavMan.LocationChanged += HandleLocationChanged;
+        UpdateVisibility();
+    }
+
+    private void HandleLocationChanged(object? sender, LocationChangedEventArgs e)
+    {
+        UpdateVisibility();
+        InvokeAsync(StateHasChanged);
+    }
+
+    private void UpdateVisibility()
+    {
+        _isHidden = NavMan.Uri.TrimEnd('/') == NavMan.BaseUri.TrimEnd('/');
+    }
+
+    public void Dispose()
+    {
+        NavMan.LocationChanged -= HandleLocationChanged;
+    }
+
 }

ChatRPG/Pages/_Host.cshtml

@@ -11,6 +11,7 @@
     <base href="~/" />
     <link rel="stylesheet" href="css/bootstrap/bootstrap.min.css" />
     <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/font/bootstrap-icons.css">
+    <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css" rel="stylesheet">
     <link rel="stylesheet" href="_content/Radzen.Blazor/css/material-base.css">
     <link href="css/site.css" rel="stylesheet" />
     <link href="ChatRPG.styles.css" rel="stylesheet" />

ChatRPG/Program.cs

@@ -34,7 +34,8 @@
     .AddTransient<IEmailSender, EmailSender>()
     .AddTransient<GameInputHandler>()
     .AddTransient<GameStateManager>()
-    .AddSingleton<ICampaignMediatorService, CampaignMediatorService>();
+    .AddSingleton<ICampaignMediatorService, CampaignMediatorService>()
+    .AddScoped<JsInteropService>();
 
 builder.Services.Configure<IdentityOptions>(options =>
 {

ChatRPG/Services/JsInteropService.cs

@@ -0,0 +1,33 @@
+using Microsoft.JSInterop;
+
+namespace ChatRPG.Services;
+
+public class JsInteropService : IAsyncDisposable
+{
+    private readonly IJSRuntime _jsRuntime;
+    private IJSObjectReference? _scrollModule;
+    private IJSObjectReference? _detectScrollBarModule;
+
+    public JsInteropService(IJSRuntime jsRuntime)
+    {
+        _jsRuntime = jsRuntime;
+    }
+
+    public async Task<IJSObjectReference> GetScrollModuleAsync()
+    {
+        return _scrollModule ??= await _jsRuntime.InvokeAsync<IJSObjectReference>("import", "./js/scroll.js");
+    }
+
+    public async Task<IJSObjectReference> GetDetectScrollBarModuleAsync()
+    {
+        return _detectScrollBarModule ??= await _jsRuntime.InvokeAsync<IJSObjectReference>("import", "./js/detectScrollBar.js");
+    }
+
+    public async ValueTask DisposeAsync()
+    {
+        if (_scrollModule != null)
+        {
+            await _scrollModule.DisposeAsync();
+        }
+    }
+}

ChatRPG/appsettings.json

@@ -1,6 +1,6 @@
 {
   "ConnectionStrings": {
-    "DefaultConnection": "Host=localhost:5432;Database=chatrpg;Username=postgres;Password=postgres"
+    "DefaultConnection": "Host=localhost:5432;Database=chatrpg_v1;Username=postgres;Password=postgres"
   },
   "ApiKeys": {
     "OpenAI": "INSERT API KEY HERE"

ChatRPG/wwwroot/css/site.css

@@ -427,3 +427,11 @@ div.sticky {
     color: #ffffff;
     font-size: 175%;
 }
+
+.skull-icon {
+    position: absolute;
+    top: 5px;
+    right: 5px;
+    font-size: 1.2rem; /* Adjust icon size */
+    color: #333;
+}