...docker test

Chrono/Web/Pages/Cards.razor

@@ -1,4 +1,5 @@
 @page "/cards"
+@inject HttpClient Http
 
 <PageTitle>Card Gallery</PageTitle>
 
@@ -211,6 +212,19 @@
                         <span class="field-value">@selectedCard.ImmortalizeFrom</span>
                     </div>
                 }
+
+                @if (selectedCard.IsAgent)
+                {
+                    <div class="detail-field note">
+                        <span class="field-label"><i class="bi bi-pencil-fill"></i> Personal Note</span>
+                        <textarea class="form-control note-input" @bind="currentNote" @onblur="SaveNote"
+                                  placeholder="Add a private note about this agent..."></textarea>
+                        @if (isSaving)
+                        {
+                            <span class="saving-indicator">Saving...</span>
+                        }
+                    </div>
+                }
             </div>
         </div>
     </div>
@@ -225,6 +239,8 @@
     private string costFilter = "";
     private CardData? selectedCard;
     private List<string> factions = [];
+    private string currentNote = "";
+    private bool isSaving = false;
 
     private bool HasActiveFilters => categoryFilter != "" || factionFilter != "" || costFilter != "";
 
@@ -276,9 +292,41 @@
         search = "";
     }
 
-    private void SelectCard(CardData card)
+    private async Task SelectCard(CardData card)
     {
         selectedCard = card;
+        if (card.IsAgent)
+        {
+            currentNote = "";
+            try
+            {
+                var note = await Http.GetFromJsonAsync<CardNote>($"api/notes/{Uri.EscapeDataString(card.Name)}");
+                currentNote = note?.Note ?? "";
+            }
+            catch
+            {
+                currentNote = "";
+            }
+        }
+    }
+
+    private async Task SaveNote()
+    {
+        if (selectedCard == null || !selectedCard.IsAgent) return;
+
+        isSaving = true;
+        try
+        {
+            await Http.PostAsJsonAsync("api/notes", new CardNote { CardName = selectedCard.Name, Note = currentNote });
+        }
+        catch
+        {
+            // Error handling
+        }
+        finally
+        {
+            isSaving = false;
+        }
     }
 
     private void CloseDetail()

Chrono/Web/Web.csproj

@@ -4,13 +4,13 @@
         <TargetFramework>net10.0</TargetFramework>
         <Nullable>enable</Nullable>
         <ImplicitUsings>enable</ImplicitUsings>
-        <OverrideHtmlAssetPlaceholders>true</OverrideHtmlAssetPlaceholders>
+        <OverrideHtmlAssetPlaceholders>false</OverrideHtmlAssetPlaceholders>
     </PropertyGroup>
 
     <ItemGroup>
         <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.9"/>
         <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.DevServer" Version="10.0.9" PrivateAssets="all"/>
-        <PackageReference Include="Telerik.UI.for.Blazor" Version="14.0.0"/>
+        <PackageReference Include="Telerik.UI.for.Blazor" Version="14.0.0" PrivateAssets="none"/>
     </ItemGroup>
 
     <ItemGroup>

Chrono/Web/wwwroot/css/app.css

@@ -225,3 +225,26 @@ a, .btn-link {
 .loading-status::after {
     content: var(--blazor-load-percentage-text, "Loading...");
 }
+
+.card-detail .detail-field.note {
+    margin-top: 1.5rem;
+    padding-top: 1.5rem;
+    border-top: 1px solid var(--border);
+    display: flex;
+    flex-direction: column;
+    gap: 0.5rem;
+}
+
+.note-input {
+    min-height: 100px;
+    resize: vertical;
+    background: var(--bg-primary);
+    border: 1px solid var(--border);
+}
+
+.saving-indicator {
+    font-size: 0.75rem;
+    color: var(--text-muted);
+    font-style: italic;
+    align-self: flex-end;
+}

Chrono/Web/wwwroot/index.html

@@ -10,13 +10,12 @@
     <link crossorigin href="https://fonts.gstatic.com" rel="preconnect"/>
     <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap" rel="stylesheet"/>
     <link href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css" rel="stylesheet"/>
-    <link id="webassembly" rel="preload"/>
-    <link href="lib/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet"/>
-    <link href="css/app.css" rel="stylesheet"/>
-    <link href="_content/Telerik.UI.for.Blazor/css/kendo-theme-default/all.css" rel="stylesheet"/>
-    <script src="_content/Telerik.UI.for.Blazor/js/telerik-blazor.js" defer></script>
-    <link href="favicon.png" rel="icon" type="image/png"/>
-    <link href="Web.styles.css" rel="stylesheet"/>
+    <link href="/lib/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet"/>
+    <link href="/_content/Telerik.UI.for.Blazor/css/kendo-theme-default/all.css" rel="stylesheet"/>
+    <link href="/css/app.css" rel="stylesheet"/>
+    <link href="/Web.styles.css" rel="stylesheet"/>
+    <script src="/_content/Telerik.UI.for.Blazor/js/telerik-blazor.js" defer></script>
+    <link href="/favicon.png" rel="icon" type="image/png"/>
     <script type="importmap"></script>
 </head>
 
@@ -46,7 +45,7 @@
     <a class="reload" href=".">Reload</a>
     <span class="dismiss">🗙</span>
 </div>
-<script src="_framework/blazor.webassembly#[.{fingerprint}].js"></script>
+<script src="/_framework/blazor.webassembly.js"></script>
 </body>
 
 </html>