Question: Blazor

[Pinox]

Hi Guys,

I'm interested in using my existing c# viewmodels within Blazor. Does anyone know if DynamicData works within Blazor. I know you get ReactiveUI.Blazor that is supported but what about DD ?

Blazor is obviously single threaded. Can DD work on a single thread and was "StateHasChanged" used in the implementation ?

[RolandPheasant]

@Pinox sorry for the delayed response.

@glennawatson I know some people have been looking at blazor with specifically with rx ui. Any idea how much progress has been made, or whether there are any considerations or know issues?

[butzei]

Hi @Pinox,
I tested DD with Blazor in a small test project. It worked like a charm. You only need to figure out when to update the view and call StateHasChanged() in the blazor component.

Example for a simple INotifyPropertyChanged:

@code {
    [Parameter]
    public INotifyPropertyChanged ViewModel { get; set; }

    protected override void OnInitialized()
    {
        base.OnInitialized();
        ViewModel.PropertyChanged += (o, e) => StateHasChanged();
    }
}

[Pinox]

Thanks @binaryevents. Sorry for late reply, i missed this reply. Glad to hear i can reuse my existing code , super excited now ;))

[BobBoba]

dear @binaryevents could you please share your test project? I am stuck with DD + Blazor, I have subscribed to SourceCache and map it into ReadOnlyObservableCollection, but UI (which points to ReadOnlyObservableCollection) do not refresh after SourceCache changed.
If I manually call from somewhere StateHasChanged - it refresh.
My ViewModel class inherited from ReactiveObject.
ViewModel.PropertyChanged += (o, e) => StateHasChanged(); did not help me.

[glennawatson]

Property doesn't change but the collection does and has a collection changed event

[BobBoba]

So silly, cannot propagate property change to Blazor (Server) UI component.
My ReactiveObject's PropertyChanged handler never called.
I cannot get, how my subscription to SourceCache of objects transformed to class inherited from AbstractNotifyPropertyChanged and then its property update could make UI to InvokeAsync(StateHasChanged). I do call SetAndRaise within each setter, its PropertyChanged event called.
How to notify UI about property change? may be you give me a hint?

workaround:
instead of using SourceCache.xxx.Subscribe() I do cache = SourceCache.xxx.AsObservableCache() and then in component:

cache.Connect().Subscribe(set =>
{
    InvokeAsync(StateHasChanged);
});

dirty but working. I'm sure I misunderstood the concept somewhere so I used that way by no other reason.

[glennawatson]

The point is that when a collection changes it's not changing the value of a property. This is normal. The collection contents are changing. You can use the source cache line you done or use the ReadOnlyObservableCollection CollectionChanged event

[AmirMahdiNassiri]

@BobBoba What I implemented is an extension method that propagates CollectionChanged events as a PropertyChanged event on the ViewModel's surface itself. First I define this simple interface extending IReactiveObject:

public interface IPropagateCollectionChanges : IReactiveObject { }

and then, the extension method for this interface:

public static class IPropagateCollectionChangesExtensions
{
    public static void PropagateCollectionChanged<TObj>(this TObj reactiveObject, 
        INotifyCollectionChanged observableCollection,
        string collectionPropertyName)
        where TObj : IPropagateCollectionChanges
    {
        observableCollection.CollectionChanged += (obj, changeArgs) =>
        {
            reactiveObject.RaisePropertyChanged($"{collectionPropertyName}_ItemsChanged");
        };
    }
}

then, in the ViewModel class, and after generating the Collection you simply call the extension method:

this.PropagateCollectionChanged(MyCollection, nameof(MyCollection));