How to use redux-rails - 10 common examples
To help you get started, we’ve selected a few redux-rails examples, based on popular ways it is used in public projects.
Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.
instacart / redux-rails / demo / index.js View on Github 
const reduxRailsConfig = combineConfigs(
defaultConfig,
apiConfig,
commentsConfig,
photosConfig
)
// redux store
const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose;
const siteApp = window.siteApp = createStore(
combineReducers({
counter: counterReducer,
models: apiReducer(apiConfig),
resources: apiReducer(resourcesConfig)
}),
{},
composeEnhancers(
applyMiddleware(middleWare(reduxRailsConfig)),
)
);
window.setTimeout(() => {
console.log('starting state', siteApp.getState())
siteApp.dispatch({
type: 'increment'
})
siteApp.dispatch({
type: 'increment'
}))
const reduxRailsConfig = combineConfigs(
defaultConfig,
apiConfig,
commentsConfig,
photosConfig
)
// redux store
const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose;
const siteApp = window.siteApp = createStore(
combineReducers({
counter: counterReducer,
models: apiReducer(apiConfig),
resources: apiReducer(resourcesConfig)
}),
{},
composeEnhancers(
applyMiddleware(middleWare(reduxRailsConfig)),
)
);
window.setTimeout(() => {
console.log('starting state', siteApp.getState())
siteApp.dispatch({
type: 'increment'
})
siteApp.dispatch({
type: 'increment'resource: 'Posts',
id: 3
}))
siteApp.dispatch(railsActions.show({
resource: 'Posts',
id: 5,
controller: 'foo_posts'
}))
siteApp.dispatch(railsActions.show({
resource: 'Comments',
id: 15
}))
siteApp.dispatch(railsActions.index({resource: 'Photos'}))
.then(resp => {
console.log('async photos: ', resp)
})
.catch(err => {
console.log('error' , err)
})
// siteApp.dispatch({
// type: 'User.SHOW'
// })
siteApp.dispatch(railsActions.show({
resource: 'User'
}))
siteApp.dispatch({window.setTimeout(() => {
console.log('starting state', siteApp.getState())
siteApp.dispatch({
type: 'increment'
})
siteApp.dispatch({
type: 'increment'
})
// siteApp.dispatch({
// type: 'Posts.SHOW',
// data: {id: 3}
// })
siteApp.dispatch(railsActions.show({
resource: 'Posts',
id: 3
}))
siteApp.dispatch(railsActions.show({
resource: 'Posts',
id: 5,
controller: 'foo_posts'
}))
siteApp.dispatch(railsActions.show({
resource: 'Comments',
id: 15
}))
siteApp.dispatch(railsActions.index({resource: 'Photos'}))commentsConfig,
photosConfig
)
// redux store
const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose;
const siteApp = window.siteApp = createStore(
combineReducers({
counter: counterReducer,
models: apiReducer(apiConfig),
resources: apiReducer(resourcesConfig)
}),
{},
composeEnhancers(
applyMiddleware(middleWare(reduxRailsConfig)),
)
);
window.setTimeout(() => {
console.log('starting state', siteApp.getState())
siteApp.dispatch({
type: 'increment'
})
siteApp.dispatch({
type: 'increment'
})
// siteApp.dispatch({
// type: 'Posts.SHOW',
// data: {id: 3}
// }){'__$id': 2, val: 122},
{'__$id': 3, val: 123}
]
}
}
}
const photosConfig = {
resources: {
Photos: {
controller: 'photos'
}
}
}
const resourcesConfig = combineConfigs(
defaultConfig,
commentsConfig,
photosConfig
)
const reduxRailsConfig = combineConfigs(
defaultConfig,
apiConfig,
commentsConfig,
photosConfig
)
// redux store
const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose;
const siteApp = window.siteApp = createStore(const photosConfig = {
resources: {
Photos: {
controller: 'photos'
}
}
}
const resourcesConfig = combineConfigs(
defaultConfig,
commentsConfig,
photosConfig
)
const reduxRailsConfig = combineConfigs(
defaultConfig,
apiConfig,
commentsConfig,
photosConfig
)
// redux store
const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose;
const siteApp = window.siteApp = createStore(
combineReducers({
counter: counterReducer,
models: apiReducer(apiConfig),
resources: apiReducer(resourcesConfig)
}),
{},describe('SHOW actions with custom idAttribute', () => {
const customIdConfig = {
domain: 'http://localhost:3000/',
resources: {
Posts: {
controller: 'posts',
idAttribute: '@@_id_'
}
}
}
const customIdReducer = apiReducer(customIdConfig)
let customIdReducerState = {}
it('should create the member and set the loading state on the member after SHOW action', () => {
customIdReducerState = customIdReducer(customIdReducerState, railsActions.show({
resource: 'Posts',
id: 4135
}))
expect(customIdReducerState).toEqual(
{
Posts: {
loading: false,
loadingError: undefined,
models: [{
'@@_id_': 4135,
loading: true,describe('CREATE actions with custom idAttribute', () => {
const customIdConfig = {
domain: 'http://localhost:3000/',
resources: {
Posts: {
controller: 'posts',
idAttribute: '@@_id_'
}
}
}
const createReducer = apiReducer(customIdConfig)
let createReducerState = {}
it('should set the attributes of the member in the collection on success of CREATE call with custom id attribute', () => {
const response = {
'@@_id_': 4135,
title: 'Three weird tricks for testing Redux Rails',
body: '1: use Jest. 2: profit. 3: maybe this should only be 2 weird tricks...'
}
const cId = getUniqueClientId()
createReducerState = createReducer({}, {
type: 'Posts.ASSIGN_CID', cId
})
createReducerState = createReducer(createReducerState, {describe('apiReducer', () => {
const standardReducer = apiReducer(standardConfig)
it('should return correct intial state', () => {
expect(
standardReducer(undefined, {})
).toEqual(
{
Posts: {
loading: false,
loadingError: undefined
},
User: {
loading: false,
loadingError: undefined
}
}
)redux-rails
Redux and your server talking without fuss.
