AddNewExpenseModal.razor

<MatDialog @bind-IsOpen="@IsDialogOpen">
    <MatDialogTitle>Create expense for <b>@SelectedPot.PotName</b></MatDialogTitle>
    <MatDialogContent>
        <MatDatePicker Label="Expense Date"
                       Required="true"
                       @bind-Value="@Expense.Date"
                       Format="dd/MM/yyyy"></MatDatePicker>

        <MatTextField Label="Description"
                      Required="true"
                      @bind-Value="@Expense.Description"></MatTextField>

        <MatTextField Label="Spend"
                      Required="true"
                      @bind-Value="@Expense.Spend"></MatTextField>        
    </MatDialogContent>
    <MatDialogActions>
        <MatButton OnClick="@(async e => 
                              {
                                  await OnDialogClosing.InvokeAsync();
                                  CloseDialog(); 
                              })">Cancel</MatButton>

        <MatButton OnClick="@(async e => 
                              {
                                  Expense.PotId = SelectedPot.PotId;
                                  await OnAddNewExpense.InvokeAsync(
                                    new NewExpenseEventArgs(Expense));
                              })">Save</MatButton>
    </MatDialogActions>
</MatDialog>

@code {
    [Parameter]
    public bool IsDialogOpen { get; set; }

    [Parameter]
    public SelectedPot SelectedPot { get; set; }

    [Parameter]
    public EventCallback<NewExpenseEventArgs> OnAddNewExpense { get; set; }

    [Parameter]
    public EventCallback OnDialogClosing { get; set; }

    private NewExpense Expense { get; set; }
    = new NewExpense();

    private void CloseDialog() => IsDialogOpen = false;
}