Select the amount field when opening the create/edit expense dialog

hexagram-solutions · Mar 21, 2024 · e088096 · e088096
1 parent b1eacf0
commit e088096
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 2 deletions.
diff --git a/src/Clients/App/Components/Expenses/ExpenseForm.razor b/src/Clients/App/Components/Expenses/ExpenseForm.razor
@@ -7,14 +7,16 @@
 
 <MudGrid>
     <MudItem xs="6">
-        <MudNumericField @bind-Value="Expense.Amount"
+        <MudNumericField @ref="AmountFieldRef"
+                         @bind-Value="Expense.Amount"
                          T="decimal"
                          Label="Amount"
                          HelperText="The expense amount"
                          Step="1m"
                          Min="0.00m"
                          Max="999999.99m"
                          Required
+                         AutoFocus
                          For="@(() => Expense.Amount)"
                          Adornment="Adornment.Start"
                          AdornmentIcon="@Icons.Material.Rounded.AttachMoney"/>

diff --git a/src/Clients/App/Components/Expenses/ExpenseForm.razor.cs b/src/Clients/App/Components/Expenses/ExpenseForm.razor.cs
@@ -1,6 +1,7 @@
 using System.Runtime.InteropServices.JavaScript;
 using Fluxor;
 using Microsoft.AspNetCore.Components;
+using MudBlazor;
 using Spenses.App.Store.ExpenseCategories;
 using Spenses.App.Store.Expenses;
 using Spenses.App.Store.Homes;
@@ -34,6 +35,8 @@ public partial class ExpenseForm
 
     private IEnumerable<string> AvailableTags => ExpensesState.Value.ExpenseFilters.Tags;
 
+    private MudNumericField<decimal> AmountFieldRef { get; set; } = new();
+
     private DateTime? DateValue
     {
         // Return null if the date isn't set yet. Workaround for making the start month of the date picker work
@@ -58,11 +61,16 @@ private void OnTagValueChanged(string tag)
 
     protected override void OnInitialized()
     {
-        base.OnInitialized();
+        base.OnInitializedAsync();
 
         Dispatcher.Dispatch(new ExpenseCategoriesRequestedAction(Home.Id));
     }
 
+    protected override async Task OnAfterRenderAsync(bool firstRender)
+    {
+        await AmountFieldRef.SelectAsync();
+    }
+
     private Task<IEnumerable<string>> SearchTags(string value)
     {
         if (string.IsNullOrEmpty(value))