berserkerdotnet / blazorstate Goto Github PK

How would I initialize props from OpenId Connected Events?

From start up we need to show Tenant Id / Tenant Name which comes from the Identity Token, but can't seem to find a way to initialize that prop / state from when the token is successfully validated.

Thanks

possible?

I have a component that I have set up but I am getting a null reference exception and I am trying to see what I am doing wrong.
Here is what I am using

    public partial class ProjectPicker
    {
        public static RenderFragment Get()
        {
            var c = new ProjectPicker();
            return ComponentConnector.Connect<ProjectPicker, BreakpointManagementState, ProjectProps>(c.MapStateToProps, c.MapDispatchToProps);
        }

        private void MapStateToProps(BreakpointManagementState state, ProjectProps props)
        {
            props.Project = state?.Project ?? new BreakpointProjectSummary();
        }

        private void MapDispatchToProps(IStore<BreakpointManagementState> store, ProjectProps props)
        {
            props.UpdateProject = EventCallback.Factory.Create(this, () =>
            {
                store.Dispatch(new UpdateProjectAction());
            });
        }

The first thing I see that is wrong is that the example shown in the README shows a class not partial as I have shown. My class is the code behind for ProjectPicker.razor component.
Second, the first type parameter for Connect is wrong because it cannot be converted to ComponentBase. What are the types to be used for the Connect<T,U,V> method?

In the README.md there is the statements:

In Redux, state is immutable, meaning that if it needs to be mutated a new state object is created. For that purpose, WeatherState does not expose setter of its properties, and doesn't not have a default constructor.

RootState itself is handled by a out of the box reducer and don't must have a default constructor.

First looking at both states it seems that even though an explicit default constructor is not defined there is an implicit default constructor. In other words with C# you can still do new RootState() or new WeatherState()? So is it desirable to explicily mark the default constructor with something like private RootState()?

Second it seems like there is a grammar error. I don't know what is meant by

and don't must have

Or the double negative

and doesn't not have

Hi,

I'm really enjoing your work but i would implement something like 'DeleteIdentity IAsyncAction' but there are no sample code for this.

May you give me some info, source code, link or anithing that can let me understand better this concept please?

Thanks

Best regards

I have a significant amount of code on the page (I will call it Grouping.razor). I would like to connect it to the state. Reading the documentation I see that is done by a call to the static 'Get' that returns a RenderFragment. But the samples show the RenderFragment on the page. This seems like a Catch-22. Say my page looks like:

<p> This is a test </p>

and I have code behind that includes the Props like

        [Parameter]
        public GroupingProps Props { get; set; }

From the documentation I see lines like

@page "/counter"

@CounterCmp

@code {
    RenderFragment CounterCmp = CounterConnected.Get();
}

So if I was to extend this to my page I would do something like

<p> This is a test </p>
@GroupingCmp 
@code {
    RenderFragment GroupingCmp = GroupingConnect.Get();
}

I have tried calling 'Get' in OnInitializedAsync and just ignoring the return RenderFragment but the Props parameter is always null. How do I connect the page to the state?

Hi
Excuse me for stupid question
I have a blazor page that contains 3 Blazor-components: one display all items, another one is a form to insert new items and the latest show the counter (number of items)
I want use BlazorState.Redux for all the stuff and to share the state (item list)
Can you help me to structure the code correctly?
Possible Solutions

1. Create a single connected container component that use 3 method Get()
   RenderFragment GetComponent01
   RenderFragment GetComponent02
   RenderFragment GetComponent03

2. Create 3 separate connected component and in the master page
   @page "/counter"

@CounterCmp
@CounterCmp1
@CounterCmp2

@code {
RenderFragment CounterCmp = CounterConnected.Get();
RenderFragment CounterCmp1 = Counter1Connected.Get();
RenderFragment CounterCmp2 = Counter2Connected.Get();

}

3. ????

Really tnx and excuse me for my question that which I imagine is stupid

I have a client-side Blazor applicaiton. Through the process of elimination I have determined which of my components is failing. But I cannot get much past there. I look at the Chrome Debugger and see a lot of errors but I am not able to make sense of these messages to help be determine where the code is failing. Are there any hints to how I can see were in the application it is failing. If it helps here is the razor code

using BlazorTable

@if (!string.IsNullOrWhiteSpace(Props.BreakpointProject.ProjectName) ||
      !string.IsNullOrWhiteSpace(Props.BreakpointGroup.GroupName))
{
    <h3>Breakpoint by project (project/group not selected)</h3>
    <Table TableItem="BreakpointSummary" DataLoader="_loader" Items="data" PageSize="5" SelectionType="selectionType" RowClickAction="RowClick" SelectedItems="selectedItems" ShowSearchBar="false">
        <Column TableItem="BreakpointSummary" Title="Id" Field="@(x => x.ProjectId)" Sortable="true" Width="10%" DefaultSortColumn="true" />
        <Column TableItem="BreakpointSummary" Title="Group Id" Field="@(x => x.GroupId)" Sortable="true" Width="10%" />
        <Column TableItem="BreakpointSummary" Title="Group Name" Field="@(x => x.GroupName)" Sortable="true" Width="5%" />
        <Column TableItem="BreakpointSummary" Title="Method" Field="@(x => x.Method)" Sortable="true" Width="20%" />
        <Column TableItem="BreakpointSummary" Title="Drug Name" Field="@(x => x.DrugName)" Sortable="true" Width="5%" />
        <Column TableItem="BreakpointSummary" Title="Suseptiple" Field="@(x => x.Susceptible)" Width="5%" />
        <Column TableItem="BreakpointSummary" Title="Low Intermediate" Field="@(x => x.LowIntermediate)" Width="5%" />
        <Column TableItem="BreakpointSummary" Title="Intermediate" Field="@(x => x.Intermediate)" Width="5%" />
        <Column TableItem="BreakpointSummary" Title="Resistant" Field="@(x => x.Resistant)" Width="5%" />
        <Column TableItem="BreakpointSummary" Title="Organism Name" Field="@(x => x.OrganismName)" Sortable="true" Width="5%" />
        <Column TableItem="BreakpointSummary" Title="Standard" Field="@(x => x.Standard)" Sortable="true" Width="5%" />
        <Pager ShowPageNumber="true" ShowTotalCount="true" />
    </Table>

    @if (string.IsNullOrWhiteSpace(Props.BreakpointOrganism.OrganismName))
    {
        <p><em>Click on a row to select an organism</em></p>
    }
    else
    {
        <p>Current organism: @Props.BreakpointOrganism.OrganismName</p>
    }
}
else
{
    <h3>Breakpoint by project and group @Props.BreakpointProject.ProjectId/Props.BreakpointGroup.GroupId</h3>
}

For example I get

The line 22 in the stack trace is the imbedded 'if' statement
Thank you.

Kevin

I was reading about setting BlazorState.Redux up and I saw

public class CounterConnected
{
    public static RenderFragment Get()
    {
        var c = new CounterConnected();
        return ComponentConnector.Connect<Counter, RootState, CounterProps>(c.MapStateToProps, c.MapDispatchToProps);
    }

    private void MapStateToProps(RootState state, CounterProps props)
    {
        props.Count = state?.Count ?? 0;
    }

    private void MapDispatchToProps(IStore<RootState> store, CounterProps props)
    {
        props.IncrementByOne = EventCallback.Factory.Create(this, () =>
        {
            store.Dispatch(new IncrementByOneAction());
        });

        props.IncrementBy = EventCallback.Factory.Create<int>(this, amount =>
        {
            store.Dispatch(new IncrementByAction { Amount = amount });
        });

        props.DecrementByOne = EventCallback.Factory.Create(this, () =>
        {
            store.Dispatch(new DecrementByOneAction());
        });

        props.DecrementBy = EventCallback.Factory.Create<int>(this, amount =>
        {
            store.Dispatch(new DecrementByAction { Amount = amount });
        });

        props.Reset = EventCallback.Factory.Create(this, () =>
        {
            store.Dispatch(new ResetCountAction());
        });
    }
}

The problem that I saw was that there is a mapping for one set of 'Props'. What it there are several pieces of state that interact in the component? How is that handled?

Thank you.

Hi,
I'm trying to add the persistent state capability of this package in my project, but unfortunately by adding "cfg.UseLocalStorage();" option, I face with the following exception

'ServiceType: BlazorStorage.Interfaces.ILocalStorage Lifetime: Singleton ImplementationType: BlazorStorage.Services.LocalStorage': Cannot consume scoped service 'Microsoft.JSInterop.IJSRuntime' from singleton 'BlazorStorage.Interfaces.ILocalStorage'.) (Error while validating the service descriptor 'ServiceType: BlazorStorage.Interfaces.ISessionStorage Lifetime: Singleton ImplementationType: BlazorStorage.Services.SessionStorage': Cannot consume scoped service 'Microsoft.JSInterop.IJSRuntime' from singleton 'BlazorStorage.Interfaces.ISessionStorage'.)'

here are more information:
net5.0

any help will be appreciated

I look on the Chrome debugger console and I see the message:

I have the dev tools installed

Here is some more detail