Hi, I have 3 trees of data that I get from 3 api endpoints and a paged list of data based on criteria selected in the trees. The trees also need to load their branches on demand. When you make a selection criteria in one tree it needs to update the other 2 and reload the paged list.

When I page all 4 components reload, to try to resolve this I split the store to test

services.AddRealmStore(new State1(), Reducers.1RootReducer);
services.AddRealmStore(new State2(), Reducers.2RootReducer);
services.AddRealmStore(new State3(), Reducers.3RootReducer);

1RealmStoreBuilder.UseRealmAsync();
2RealmStoreBuilder.UseRealmAsync();
2RealmStoreBuilder.UseRealmAsync();

This resolved the refresh problem and all panels updated independently however I need to be able to use more than one store in the components.

Do you have any suggestions as to the best way to proceed.

Thanks,

Ian

You can upgrade to version 3.1.0-preview1.19508.20?

Layout is inherited from LayoutComponentBase, so it can't be inherited from RealmComponent. What if I want to put some logic in layout's code behind that depends on the state?

This is how I can create conditional HTML using State.

@inherits LayoutComponentBase

<RealmStateContainer TState="WebState" Context="store">
  <ComponentTemplate>
    @{
      WebState State = store.GetState();
      Action<IRealmAction> Dispatch = store.Dispatch;
    }
    @if (State.User == null)
    {
      <LayoutView Layout="@typeof(PublicTemplate)">@Body</LayoutView>
    }
    else
    {
      <LayoutView Layout="@typeof(PrivateTemplate)">@Body</LayoutView>
    }
  </ComponentTemplate>
</RealmStateContainer>

How can I access State in the @code section?

@code 
{
  protected override async Task OnAfterRenderAsync(bool setup)
  {
    if (setup)
    {
      if (State.User == null)   // ???
      {
          navigationManager.NavigateTo("sign-in");
      }
    }
  }
}