Component Wont display in Blazor.wasm app

I am trying to create a Blazor Web Assembly UI to manage data feeds. I am trying to load a custom edit form that will display modally over a Telerik Data-Grid.

The Telerik Grid displays everything just fine and if I revert it back to the default pop-up editor that works just fine, but it just doesn't work for my purposes.

I have tried various things and I just can't get this pop-up editor to work.

Any and all help is greatly appriciated!

<strong> Home.razor </strong> <br/>

// Here is the button where I call the Edit Handler to assign the _selectedFeed
            <GridCommandColumn Width="120px">
                <GridCommandButton OnClick="@((args) => EditHandler(_selectedFeed = args.Item as MarketDataFeedsAndSources_UI))" ThemeColor="@ThemeConstants.Button.ThemeColor.Primary" Icon="edit">Edit</GridCommandButton>
                <GridCommandButton Command="Delete" ThemeColor="@ThemeConstants.Button.ThemeColor.Error">Delete</GridCommandButton>
            </GridCommandColumn>

@if(_selectedFeed != null)
{
    <FeedCustomEditor @bind-SelectedFeed="@_selectedFeed">
    </FeedCustomEditor>
}

<strong> Home.razor EditHandler </strong>

    public MarketDataFeedsAndSources_UI _selectedFeed { get; set; }

    async void EditHandler(MarketDataFeedsAndSources_UI selectedFeed)
    {

        if(selectedFeed != null)
        {
            _originalFeed = selectedFeed;
            _selectedFeed = selectedFeed;
            MarketDataFeed_Details feedDetails = selectedFeed.dataFeed_Details;


            StateHasChanged();
        }
    }

<strong> FeedCustomEditor.razor </strong>

<TelerikWindow Visible="@(SelectedFeed != null)" Modal="true">

    <WindowTitle>
        @{
            if (SelectedFeed.FeedID < 0)
            {
                <strong>Add Feed</strong>
            }
            else
            {
                <strong>Edit Feed</strong>
            }
        }
    </WindowTitle>
    <WindowContent>
        @*<EditForm Model="@SelectedFeed" OnValidSubmit="@Save">*@
        <EditForm Model="@SelectedFeed">
            <DataAnnotationsValidator/>
            <div class="form-row">
                <div class="col">
                    <label>
                        @*How to load the Data Sources into this *@
                        Data Source:
                        <TelerikTextBox Enabled="false" @bind-Value="@SelectedFeed.dataFeed_Details.marketDataSource.name"></TelerikTextBox>
                    </label>
                </div>
            </div>
        </EditForm>
    </WindowContent>

</TelerikWindow>

@code {
    [Parameter]
    public MarketDataFeedsAndSources_UI SelectedFeed { get; set; }

}

Resources I accessed: <br/>
https://github.com/telerik/blazor-ui/blob/master/grid/custom-popup-form/Pages/SeparateComponent.razor <br />

https://www.telerik.com/forums/can%27t-show-window-form-different-component <br />

https://www.telerik.com/forums/custom-popup-editor-for-grid-similar-to-form-editor <br />

https://demos.telerik.com/blazor-ui/window/modal?_ga=2.69109841.1346078225.1685036867-1842103071.1681736109&amp;_gac=1.14172869.1684789516.CjwKCAjwvJyjBhApEiwAWz2nLTCT-XDW5AnIb6ltqXBzIcguteiEHupKWPH_3IUs6QaF6--2XzzuiBoCErIQAvD_BwE&amp;_gl=11523t83_gaMTg0MjEwMzA3MS4xNjgxNzM2MTA5_ga_9JSNBCSF54*MTY4NTEzMDQwMC4xOS4xLjE2ODUxMzA0ODcuNDAuMC4w <br />

https://demos.telerik.com/blazor-ui/grid/editing-popup <br />

I'm not sure what the problem is here, but you have a few coding issues that may cause it. I don't have access to the Telerik library as my demo version has expired!

Simplify the OnClick by moving all the code to the UI event handler. It's much easier to debug with break points and clearer code.

<GridCommandButton OnClick=EditHandler ThemeColor="@ThemeConstants.Button.ThemeColor.Primary" Icon="edit">Edit</GridCommandButton>

  // I don't see any async calls so don't call it
    private Task EditHandler(ChangeEventArgs e)
    {
        var selectedFeed = args.Item as MarketDataFeedsAndSources_UI;

        if(selectedFeed is null)
          return Task.CompletedTask;

        _originalFeed = selectedFeed;
        _selectedFeed = selectedFeed;
        MarketDataFeed_Details feedDetails = selectedFeed.dataFeed_Details;

        // Not needed
        // StateHasChanged();

       return Task.CompletedTask;
    }

In the component declaration change from using bind: I don't see the ValueChanged or ValueExpression defined so it gives the wrong impression of what is implemented in the component. You're passing in an object reference so all edits in the dialog will be reflected in the original (whether you save or abort!).

<FeedCustomEditor SelectedFeed=_selectedFeed />

In the editor, you don't need to test the state of SelectedFeed, you already did it in the parent.

<TelerikWindow Visible=true Modal=true>