eddyystop/feathers-reduxify-services

How to override Promise result

jasonvillalon opened this issue · 5 comments

Hi,

Is there a way to override the methods result?

for example:

when dispatching find()

feathersServices.posts.find({
        query: {
          $sort: { createdAt: -1 },
          $skip: page,
          $limit: 10,
        },
      })

i want the result state for state.posts.queryResult.data to be merged to be used in infinite scrolls

thanks.

Best regards,
Jason Villalon

You could monkey patch the find reducers before using them in combineReducers. The reducer prop names would by default be FIND_PENDING, FIND_FULFILLED, FIND_REJECTED .

The existing reducers are created with reducerForServiceMethod('FIND', true, true) at https://github.com/eddyystop/feathers-reduxify-services/blob/master/src/index.js#L95

I would be interested in seeing what you implement.

As an aside, this repo is being moved into Feathersjs as feathers-redux, so it'll soon be deprecated. The new repo is backwards compatible with this one, so no coding changes will be needed. The new repo supports realtime, read-only replications.

I believe the monkey patching proposed above will work with the new repo.

From the proposed announcement:
(1)
Feathers introduces offline-first capabilities with near realtime, read-only replication of remote service data to sorted client data stores. Snapshots may be performed on reconnection. "Publications" support replication of only those records satisfying dynamic criteria provided by the client. With publications, clients may also receive the minimal number of service events which should improve performance on mobile apps. See feathers-offline-snapshot, feathers-offline-realtime and feathers-offline-publication.
(2)
feathers-redux integrates Feathers services with Redux in just a few lines of code. Virtually all Redux boilerplate is eliminated while providing reducers, dispatching --- store.dispatch(feathersServices.messages.patch(id, data, params)); --- state for status --- store.messages.isloading --- and sorted state for near realtime, read-only replication of selected remote data.

thanks!

by the way this is how i implemented it. not sure if ok:

feathersServices.posts.find = createAction('SERVICES_POSTS_FIND', (p, posts = []) => {
  const promise = new Promise(async (resolve, reject) => {
    try {
      const data = await app.service('posts').find(p);
      data.data = _.union(posts, data.data);
      resolve(data);
    } catch (err) {
      reject(err);
    }
  });
  return { promise, data: undefined };
});

then on my method in my component

loadMore = (page) => {
    console.log(page);
    if (page > this.props.skip && !this.props.isLoading) {
      this.props.load(page, this.props.posts);
    }
  }

finally:

export default connect(state => ({
  isLoading: state.isLoading,
  posts: state.posts.queryResult ? state.posts.queryResult.data : [],
  total: state.posts.queryResult ? state.posts.queryResult.total : 0,
  skip: state.posts.queryResult ? state.posts.queryResult.skip : 0,
  limit: state.posts.queryResult ? state.posts.queryResult.limit : 0,
}),
dispatch => ({
  load: (page = 0, posts = []) => {
    dispatch(feathersServices.posts.find({
      query: {
        $sort: { createdAt: -1 },
        $skip: page,
        $limit: 10,
      },
    }, posts));
  },
}))(MyComponent);

Thanks! I'll this in mind.