Feat: NGRX generator

[JonnyBGod]

What type of issue are you creating?

• [ ] Bug
• [x] Enhancement
• [ ] Question

Please add a description for your issue:

Enhance sdk-builder to generate ngrx actions, effects and reducers.

The idea is to keep all services as is and use effects to trigger services and trigger "success/fail" actions to be consumed in reducers for state change.

[JonnyBGod]

@yk2081 @kattsushi @beeman lets take NGRX discussion here.

I have been working on this lately and I am getting comfortable with general approach now. (working on architecture for actions, effects and reducers)

ATM I have actions, effects and reducers for auth, base and user and it seams to work seamlessly with API services.

My main question now is how to deal with relation models.

My current approach for Model store state is to have something like:

export interface State {
  ids: string[];
  entities: { [id: string]: User };
  selectedIds: string | string[];
};

Now, i see to options:

1. store related data within each entity. I mean if you user.getApps() the reducers would receive an array of apps and user id and store it in state.entities[userId].apps = payload;
2. Extend State with something like:

   export interface State {
   ids: string[];
   entities: { [id: string]: User };
   selectedIds: string | string[];
   entitiesApps: { [id: string]: App[] };
   };

Also not sure if App reduces should grab and store results as well in these cases.

Let me know your thoughts on this and if you have a better approach.

[beeman]

Hey @JonnyBGod, good question. To be honest I don't know yet what makes sense for this.

I would love to look at some working examples to see if that makes it easier to make a suggestion here.

In my pet project I have just implemented ngrx for auth, feel free to look at it: https://github.com/beeman/loopback-angular-admin/tree/colmena-cms

If you like I'm available to hop on a hangout or I can invite you in a slack so we can talk it through some more. Just let me know :)

[JonnyBGod]

@beeman Really cool project will keep track of it.

Unfortunately I am working on this within a private project that I cannot share but will try to make a public example for us to work with.

Might be very helpful to discuss over hangouts. I just invited you to fireloop-community slack channel where I have a dedicated room for this. And invited you on hangouts.

[jonathan-casarrubias]

@JonnyBGod I would recommend you to either create a new test app or use the current ng2web test application to add examples for the functionality you are working on.

That way you can extend the playground to demonstrate these new features and is easier for others involved to have a working example within the repo code.

Cheers! Jon

[jonathan-casarrubias]

By the way, this won't be included within the 2.1.0 release plan, now that we are on RC we are going to fix related issues with this version, though I have just created a new release plan that will include this and other new features.

Adding labels right now.....

[JonnyBGod]

@jonathan-casarrubias Yes for sure, this will take some time to accomplish. I just talked with @beeman and we decided to start with fireloop-todo-example and create a dev/test environment for this.

We will just start working on generator once we are fully happy with architecture for ngrx parts.

Just created this issue to track discussion on the matter.

[jonathan-casarrubias]

@JonnyBGod cool, are you planning to implement ngrx for both, loopback services and fireloop services?

[JonnyBGod]

@jonathan-casarrubias Probably yes, but atm will be focused on loopback services.

Later on I will need to bootstrap a proper use case for fireloop as until now I have just been using loopback with the sdkbuilder. And then understand better how to integrate it. It will probably be simple then, probably a few actions to create the streams and save every change to the store. But for v2.0 of this work only.

[jmls]

did this get any further ? I was just about to embark on a similar adventure ;)

[jonathan-casarrubias]

I know @JonnyBGod is still working on this, I'm a little confused because there are 3 pull requests related to this... I think only 1 is the correct, you might be able to help on that one.. Lets just see if @JonnyBGod can provide some info in which terms you @jmls would be able to help.

[JonnyBGod]

I am still working on this in my fork at https://github.com/JonnyBGod/loopback-sdk-builder

There are currently two branches orm and ngrx-orm. The first is ngrx4 the second is still on ngrx3.

I have been using it on 3 different project for the past 4 months while fixing bugs. I feel it is pretty stable by now but would be awesome to have more testing.

At the moment you can use -n flag with enabled to generate ngrx parts without reducers or orm to fully generate ngrx including reducer and a ORM that makes it super simple to integrate with your app.

Some features of the ORM are:

• single import to access all actions
• full representation of your data structure with reducers
• client side loopback filtering
• optional sync with server pushed updates

[jmls]

@JonnyBGod more than happy to take this for a spin. Do you have any docs or sample project I could use as a starting point ?

Very interested in the (optional) sync - how do you make that work / enable it ?

We have lots of "linked" data (modifiedBy, createdBy, loggedBy, reportedBy for example) where we've found using scopes and includes really slows the system down, so we've currently got a "store" of our own where we "populate" data from a preloaded cache of users.

Being able to combine various actions would be very beneficial ;) So very keen to move the app towards ngrx.

Is there any reason for the repo to be 44 commits behind master ?

[jonathan-casarrubias]

@JonnyBGod do you think is in a good shape to merge your PR? maybe that would be best and more people could start using it and help with it, but definitely we would need some help on the documentation part, I will definitely add a new section within the wiki.

The SDK builder is almost stable, and there is a very good idea on other issue (https://github.com/mean-expert-official/loopback-sdk-builder/issues/472) I think adding ngrx and ability to export a node_module from the sdk might be the icing on the cake

thoughts?

[JonnyBGod]

Before merging I will need to clean up commits and update with latest master.

Atm the best way to understand how to use it would be to go to the test app on the repo and go through the code. Definitely need documentation.

I will try to fix everything and create a new PR this week.

After that I will try to create a simple guide on how to use.

[beeman]

@JonnyBGod I would be more than happy to help writing that guide, let me know if you want me to look at that!

[jmls]

@JonnyBGod : any luck on moving forward with this ? I am more than willing to test the crap out of it ;)

[JonnyBGod]

@jmls Sorry trying to find some time to finish this. I already updated with latest sdk changes. Meanwhile found two bugs, one is fixed the other is tricky. Basically ORM is not working with "through" relations atm.

Before merging I still need to create a lot of tests, because the ORM functionality is quite complex and rich I would not like to merge without having it fully tested and have unit tests for all cases. I would gladly accept help with this task.

@beeman Would really appreciate your help on documentation.

[JonnyBGod]

Ok so my plan now is to:

1. Try to support "through" relations (this might take some time)
2. Update testing app
3. Create unit tests
4. Create super basic how to use docs
5. Merge
6. Create proper docs

If you would like to test and play with it before merge, use:

"@mean-expert/loopback-sdk-builder": "https://github.com/JonnyBGod/loopback-sdk-builder.git#orm",

[jmls]

ok, so I use "through" a lot - I can try and help with making it work with a realworld app .. having said that I am not an ngrx expert ;)

[jmls]

@JonnyBGod .. been looking at the branches in your fork - orm seems to be the same as when we first started discussing - did you mean to say we should be trying to use new-ngrx ?

How's things going ? :)

[JonnyBGod]

Your right now latest version in on new-ngrx branch. It is also the proposed branch to be merged.