Nested keyPath in `setValue`

Changes

Support nested keyPath in setValue #283

const CONFIG = {
  setValue: {
    content: ({ id }) => [BOOK_STORE, 'books', id, 'content'],
    email: [USER_STORE, 'account', 'customData', 'email'],
  },
};

Generate setValue keyPath based on ownProps

const CONFIG = {
  ...,
  setValue: {
    book: ({ store, key }) => [store, key],
  },
};

Implemented in #270

v0.0.14: subscribe values done right!

New changes: https://resaga.quandh.com/hoc-configuration/value.html

Subscribe to values in Store from anywhere

Other components' values

Define in CONFIG

const CONFIG = {
  value: {
    title: {
      keyPath: ['BookPage', 'books'],
      getter: (books, props) => books[props.id].title,
    },
  },
};

Will be available in your component props

export class Book extends PureComponent {
  ...
  render = () => {
    const { title } = this.props;
    ...
  };
}

All you need to do is pass in id. Usage:

<Book id={1} />

Own values

You can subscribe to your own values, but you don't have to. Every variables set by resaga.setValue() will be automatically injected into your props.
For example:

export class BookPage extends PureComponent {
  handleSelectBook = (selectedBookId) =>
    this.props.resaga.setValue({ selectedBookId });

  render = () => {
    // everytime `selectedBookId` changed, resaga will also trigger re-render in this component.
    const { selectedBookId } = this.props;
    ...
  };
}

const CONFIG = {
  ...
  value: {
    // DON'T: this is redundant and unnecessary
    selectedBookId: ['BookPage', 'selectedBookId'],
  },
};

Read more

• See normalise example
• Ticket #54
• Ticket #57
• Pull Request #58

v0.0.10 Release

New features

1. Add isLoading api

Examples:

this.props.resaga.isLoading('fetchBook');

2. Global dispatch

Examples

setOtherReddit = (redditChannel) =>
  this.props.resaga.dispatch(redditChannel, 'fetchReddit', 'OtherPage');

Feature changes

1. Add payload to ON_SUCCESS and ON_ERROR hook

Examples:

export const CONFIG = {
  ...
  [config.ON_SUCCESS]: {
    [SHARE_TEMPLATE]: [(result, payload) => 
      templateSharedAction(payload);
    ],
  },
};

2. Add payload to onSuccess and onError on resaga.analyse

Examples:

componentWillReceiveProps = (nextProps) =>
  this.props.resaga.analyse(nextProps, {
    [FETCH_TAB]: { onError: this.fetchError, onSuccess: this.fetchSuccess },
  });
fetchSuccess = (result, payload) => {
  // ...
};
fetchError = (error, payload) => {
  // ...
};

3. Add before hook to resaga.analyse

Examples:

componentWillReceiveProps = (nextProps) =>
  this.props.resaga.analyse(nextProps, {
    [FETCH_TAB]: { before: this.beforeFetch, onSuccess: this.fetchSuccess },
  });
beforeFetch = (payload) => {
  // do something before the dispatch action.
};
fetchError = (error, payload) => {
  // ...
};