@inject IJSRuntime JsInterop

<TelerikGrid Data="@salesTeamMembers" OnRowClick="@OnRowClickHandler" @ref="@GridRef">
    <DetailTemplate>
        @{
            var employee = context as MainModel;
            <TelerikGrid Data="employee.Orders" Pageable="true" PageSize="5">
                <GridColumns>
                    <GridColumn Field="OrderId"></GridColumn>
                    <GridColumn Field="DealSize"></GridColumn>
                </GridColumns>
            </TelerikGrid>
        }
    </DetailTemplate>
    <GridColumns>
        <GridColumn Field="Id"></GridColumn>
        <GridColumn Field="Name"></GridColumn>
    </GridColumns>
</TelerikGrid>

@code {
    List<MainModel> salesTeamMembers { get; set; }
    TelerikGrid<MainModel> GridRef { get; set; }

    async Task OnRowClickHandler(GridRowClickEventArgs args) {
        // After adding this line, it now requires a double click when the InvokeAsync call uses "await"
         var width = JsInterop.InvokeAsync<int>("getWidth");


        var model = args.Item as MainModel;
        int index = salesTeamMembers.IndexOf(model);
        //todo: you may want to take paging into account for example, or use js interop to get the index of the row based on contents from it like id
        if (index > -1) {
            var state = GridRef.GetState();
            state.ExpandedRows = new List<int> { index };

            await GridRef.SetState(state);
        }

    }


    protected override void OnInitialized() {
        salesTeamMembers = GenerateData();
    }

    private List<MainModel> GenerateData() {
        List<MainModel> data = new List<MainModel>();
        for (int i = 0; i < 5; i++) {
            MainModel mdl = new MainModel { Id = i, Name = $"Name {i}" };
            mdl.Orders = Enumerable.Range(1, 15).Select(x => new DetailsModel { OrderId = x, DealSize = x ^ i }).ToList();
            data.Add(mdl);
        }
        return data;
    }

    public class MainModel {
        public int Id { get; set; }
        public string Name { get; set; }
        public List<DetailsModel> Orders { get; set; }
    }

    public class DetailsModel {
        public int OrderId { get; set; }
        public double DealSize { get; set; }
    }
}