How do I set a focus on a new input field inside a datagrid row?

Question

I'm working with DevExpress' DataGrids and I'm struggling on trying to focus a new input inside a dinamically generated row. Pratically I have a grid that has, initially, a single row composed by an html input field and other columns. I'm using ObservableCollections as the datagrid datasource because it's easier to update the grid everytime I modify the collection.
Whenever I insert a new value inside the input and press Enter to trigger the Blazor's onchange event, I'd like to add a new row and focus the new input inside the last row added.

This it's my Datagrid's declaration on a testing project:

<DxDataGrid ColumnResizeMode="DataGridColumnResizeMode.NextColumn"
            CssClass="table table-striped"
            Data=@itemsOnTheRight
            DataNavigationMode="DataGridNavigationMode.ShowAllDataRows"
            VerticalScrollBarMode="ScrollBarMode.Auto">
    <DxDataGridColumn Field=@(nameof(ItemOnTheRight.Value)) Width="40%">
        <DisplayTemplate>
            <input @ref=@((context as ItemOnTheRight).ValueFieldReference)
                   type="text"
                   class="w-100"
                   value=@((context as ItemOnTheRight).Value)
                   onchange="(args) => SetValue(args, context as ItemOnTheRight)" />
        </DisplayTemplate>
    </DxDataGridColumn>
    remaining n columns ...
</DxDataGrid>

I've already tried two things (without solving my problem):

• "force" the render:

itemsOnTheRight.Add(newItem);
StateHasChanged();
await Task.Delay(1);
await itemsOnTheRight.LastOrDefault().ValueFieldReference.FocusAsync();

• use a flag to focus the input on the AfterRender:

protected override async Task OnAfterRenderAsync(bool firstRender)
{
    if (focus)
    {
        focus = false;
        await itemsOnTheRight.LastOrDefault().ValueFieldReference.FocusAsync();
    }
}