@digitalwing.co/redux-query-immutable
redux-query-immutable is a fork of the redux-query library, with the only difference that it supports a redux store based on ImmutableJS.
This package is a fork of redux-query-immutable, modified by Digital Wing team.
Please refer to the documentation of redux-query for details of the API.
Getting Started
Install redux-query-immutable via npm:
$ npm install --save @digitalwing.co/redux-query-immutable
Add the entitiesReducer and queriesReducer to your combined reducer.
Include the queryMiddleware in your store's applyMiddleware call. queryMiddleware requires two arguments: a selector (or function) that returns entities state, and a function for the queries state.
For example:
import { applyMiddleware, createStore } from 'redux';
import { combineReducers } from 'redux-immutable'
import { entitiesReducer, queriesReducer, queryMiddleware } from 'redux-query-immutable';
import createLogger from 'redux-logger';
export const getQueries = (state) => state.get('queries');
export const getEntities = (state) => state.get('entities');
const reducer = combineReducers({
entities: entitiesReducer,
queries: queriesReducer,
});
const logger = createLogger();
const store = createStore(
reducer,
applyMiddleware(queryMiddleware(getQueries, getEntities), logger)
);
connectRequest
This is an updated version of the connectRequest higher-order component example from the original redux-query library.
The biggest change to the original example is that you now have immutable data in the update functions.
import { connectRequest } from 'redux-query-immutable';
import { connect } from 'react-redux-immutable';
class Dashboard extends Component {
...
}
const mapStateToProps = (state, props) => ({
dashboard: getDashboard(state, props),
});
const mapPropsToConfigs = props => [
{
url: `/api/dashboard/${props.dashboardId}`,
update: {
chartsById: (prevCharts, dashboardCharts) => (
prevCharts.mergeDeep(dashboardCharts)
),
dashboardsById: (prevDashboards, dashboards) => (
prevDashboards.mergeDeep(dashboards)
),
},
}
];
export default compose(
connect(mapStateToProps),
connectRequest(mapPropsToConfigs)
)(Dashboard);