serviceName.on does not work

[harrisrobin]

Steps to reproduce

(First please check that this issue is not already solved as described
here)

• Tell us what broke. The more detailed the better.

The 'on' events don't seem to work using reduxified services.

Expected behavior

Tell us what should happen

When doing

const reduxServices = reduxifyServices(app, ["challenges"])

reduxServices.challenges.on("created", challenge => {
   console.log("created challenge", challenge) // nothing happens.
})

I am expecting the callback function to be triggered.

Actual behavior

However, nothing happens.

However, if I do
However, if I do:

app.service("challenges").on("created", challenge => {
  console.log("created challenge", challenge) // this works
})

It works.

System configuration

Tell us about the applicable parts of your setup.

Module versions (especially the part that's not working):
"feathers-client": "^2.3.0",
"feathers-redux-immutable": "^0.1.0",
"redux": "^3.7.2",

NodeJS version:
v8.1.4

Operating System:
Mac OS

Browser Version:
Chrome 60.0.3112.101

@eddyystop any ideas to what I could be doing wrong? I did not see an example of this unfortunately so I expected it to work similarly to regular service calls.

[eddyystop]

feathersRedux.services[...].on() is not documented in the README. I don't remember why it was deprecated.

It does not use the same signature as app.service(...).on. Its documented in the source with

 * An action creator for listening on service events is returned as { on } and could be used like:
import feathersApp, { services } from './feathers';
feathersApp.service('messages').on('created', data => {
  store.dispatch(
    services.messages.on('created', data, (event, data, dispatch, getState) => {
      // handle data change
    })
  );
});

I'd appreciated knowing how you used it if you succeed.

[bsubedi26]

Hey there, thanks for providing this module. It is definitely an awesome abstraction when using both feathers and redux together.

I also came across this issue when attempting to listen for real time service updates and updating the redux store accordingly. The way I was achieving this initially this was something similar to:

const messageService = feathers.service('message');
const { dispatch } = this.props;
messageService.on('created', (data) => {
      console.log('message::on::created ', data);
      dispatch(app.message.find());
})

The code above is essentially dispatching the find action for the respective service whenever the .on() event is executed. This was fine initially but when there is more data for the services then I believe it isn't efficient because you are only running the find() action to retrieve the newly updated data but you're retrieving ALL of the data along with the updated one.

Afterwards, I created a new action/reducer to update the service state accordingly. Something along the lines of this:

const messageService = feathers.service('message');
const { dispatch } = this.props;
messageService.on('created', (data) => {
      console.log('message::on::created ', data);
      dispatch(app.message.onCreated(data)); <<<=== new action
})

Action type:

  const ON_CREATED = `${SERVICE_NAME}ON_CREATED`;

Action creator:

    onCreated: createAction(ON_CREATED, (payload) => ({ data: payload })),

Reducer:

{ [ON_CREATED]: (state, action) => {
          const { data} = action.payload;
          return {
            ...state,
            [opts.queryResult]: Object.assign({}, state[opts.queryResult], {
              data: state[opts.queryResult].data.concat(data)
            }),
          };
        } },

The code seems to work fine although I have only tested/used it for a day. The components that are listening for the respective service state changes update accordingly when new data is added. If there is a better way to achieve this, please comment below.

[eddyystop]

Some of the still outstanding issues make it clear that many use cases are not best handled by the 3 stores (find, non-find, replication) within the feathers-redux store. I won't have time to take a deep dive into these issues before sometime Jan 2018.

In the meantime, perhaps you can consider making a PR to address what you pointed out above.

[bsubedi26]

Sounds good. I will try to make the PR as soon as possible. I should get around to it within next couple days. Thanks @eddyystop.

[bsubedi26]

@eddyystop, Created the PR here (#37). Please let me know if I am missing something.

[bsubedi26]

@eddyystop, Any updates on this? I can add to the docs if this is merged also. Are there any issues?

[eddyystop]

Oops, sorry. I got lost doing the Buzzard common hooks docs. I'll check it out Sunday.

BTW, https://feathers-plus.github.io/v1/feathers-hooks-common/index.html

[bsubedi26]

@eddyystop, The docs look awesome. Looks similar to VueJS docs. Keep up the great work.

[eddyystop]

I cloned from VueJS. :)

…

On Sun, Nov 19, 2017 at 9:58 PM, bsubedi26 ***@***.***> wrote: @eddyystop <https://github.com/eddyystop>, The docs look awesome. Looks similar to VueJS docs. Keep up the great work. — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub <#30 (comment)>, or mute the thread <https://github.com/notifications/unsubscribe-auth/ABezn4u7Yzh0ZUAei9XDATSEB79-0bnqks5s4OrcgaJpZM4PEFBH> .

[frinzekt]

Whats the problem with this? this seems to be working well with #37 and #45

An example is written in the readme

[Tomgorg]

When I trying use

products.on('created', (data) => { dispatch(services.products.onCreated(data)); })

I getting error "TypeError: Cannot read property 'concat' of undefined"

in
`260 |
261 | debug("redux:" + ON_CREATED, action);
262 | var updatedResult = Object.assign({}, state[opts.queryResult], {

263 | data: state[opts.queryResult].data.concat(action.payload.data),
| ^ 264 | total: state[opts.queryResult].total + 1
265 | });
266 | return (0, _extends11.default)({}, state, (_extends5 = {}, _extends5[opts.queryResult] = updatedResult, _extends5));`

Does this functionality work?

[ppulwey]

Hi everyone.
We're currently figuring out feathers which seem to be a grate solution for node APIs and came across this repo.
Now what we would expect is, that the store is updated with the received data (from create, find, delete...) automatically, even if socket connection is not used. This doesn't seem to be the case.
Now the question is, is this intended only to work with realtime updates (socket.io)?
Or are we missing an extra config option / function call?