From ceef2c162fb09a7b70c00234222c9132e4518755 Mon Sep 17 00:00:00 2001
From: Claudio Schaad <c.schaad@pog.ch>
Date: Mon, 6 Jul 2026 17:01:30 +0200
Subject: [PATCH] PR U-11: FluentCombobox for booking-text autocomplete

Replace the native <input list="texts"> + <datalist> pattern in
PendingBookings and TransactionSplitDialog with FluentCombobox +
Autocomplete=Both so the booking-text autocomplete matches the rest
of the Fluent-driven forms. Sort the suggestions once via a
sortedBookingTexts computed getter per codebehind rather than
sorting inside each row's foreach.

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
---
 .../Pages/Dialogs/TransactionSplitDialog.razor    | 14 +++++++-------
 .../Pages/Dialogs/TransactionSplitDialog.razor.cs |  2 ++
 .../Components/Pages/PendingBookings.razor        | 15 ++++++++-------
 .../Components/Pages/PendingBookings.razor.cs     |  2 ++
 4 files changed, 19 insertions(+), 14 deletions(-)

diff --git a/Schaad.Accounting.UI/Components/Pages/Dialogs/TransactionSplitDialog.razor b/Schaad.Accounting.UI/Components/Pages/Dialogs/TransactionSplitDialog.razor
index 1d85583..332896f 100644
--- a/Schaad.Accounting.UI/Components/Pages/Dialogs/TransactionSplitDialog.razor
+++ b/Schaad.Accounting.UI/Components/Pages/Dialogs/TransactionSplitDialog.razor
@@ -49,13 +49,13 @@
                     </td>
                     <td>
                         <div class="text-column">
-                            <input list="texts" @bind="@transaction.Text" placeholder="Type or select..."/>
-                            <datalist id="texts">
-                                @foreach (var text in bookingTexts.OrderBy(t => t))
-                                {
-                                    <option value="@text"></option>
-                                }
-                            </datalist>
+                            <FluentCombobox TOption="string"
+                                            Items="@sortedBookingTexts"
+                                            OptionText="@(t => t)"
+                                            OptionValue="@(t => t)"
+                                            @bind-Value="@transaction.Text"
+                                            Autocomplete="ComboboxAutocomplete.Both"
+                                            Placeholder="Text…"/>
                         </div>
                     </td>
                     <td>
diff --git a/Schaad.Accounting.UI/Components/Pages/Dialogs/TransactionSplitDialog.razor.cs b/Schaad.Accounting.UI/Components/Pages/Dialogs/TransactionSplitDialog.razor.cs
index 87ddb8b..01d15f1 100644
--- a/Schaad.Accounting.UI/Components/Pages/Dialogs/TransactionSplitDialog.razor.cs
+++ b/Schaad.Accounting.UI/Components/Pages/Dialogs/TransactionSplitDialog.razor.cs
@@ -38,6 +38,8 @@ public partial class TransactionSplitDialog : ComponentBase
     private decimal openAmount = 0;
     private List<string> validationErrors = new();
 
+    private IEnumerable<string> sortedBookingTexts => bookingTexts.OrderBy(t => t);
+
 
     protected override async Task OnInitializedAsync()
     {
diff --git a/Schaad.Accounting.UI/Components/Pages/PendingBookings.razor b/Schaad.Accounting.UI/Components/Pages/PendingBookings.razor
index 04137a3..4786760 100644
--- a/Schaad.Accounting.UI/Components/Pages/PendingBookings.razor
+++ b/Schaad.Accounting.UI/Components/Pages/PendingBookings.razor
@@ -35,13 +35,14 @@ else
                 </td>
                 <td>
                     <div class="text-column">
-                        <input list="texts" @bind="@transaction.Text" placeholder="Type or select..." readonly="@transaction.ReadOnly"/>
-                        <datalist id="texts">
-                            @foreach (var text in bookingTexts.OrderBy(t => t))
-                            {
-                                <option value="@text"></option>
-                            }
-                        </datalist>
+                        <FluentCombobox TOption="string"
+                                        Items="@sortedBookingTexts"
+                                        OptionText="@(t => t)"
+                                        OptionValue="@(t => t)"
+                                        @bind-Value="@transaction.Text"
+                                        Autocomplete="ComboboxAutocomplete.Both"
+                                        Placeholder="Text…"
+                                        Disabled="@transaction.ReadOnly"/>
                     </div>
                 </td>
                 <td>
diff --git a/Schaad.Accounting.UI/Components/Pages/PendingBookings.razor.cs b/Schaad.Accounting.UI/Components/Pages/PendingBookings.razor.cs
index 3114b57..de66ca8 100644
--- a/Schaad.Accounting.UI/Components/Pages/PendingBookings.razor.cs
+++ b/Schaad.Accounting.UI/Components/Pages/PendingBookings.razor.cs
@@ -27,6 +27,8 @@ public partial class PendingBookings : ComponentBase
     private IReadOnlyList<Account> accounts = [];
     private IReadOnlyList<string> bookingTexts = [];
 
+    private IEnumerable<string> sortedBookingTexts => bookingTexts.OrderBy(t => t);
+
     protected override async Task OnInitializedAsync()
     {
         await LoadDataAsync();