last day (15 days later) » 

5:06 PM
0
Q: Using combineReducer with a immutable reducer & regular reducers

Henry HI'm trying to integrate redux-auth into my project, which uses immutables inside its reducers. My reducers currently don't use immutables, as I'm new to the environment. (I'll change them at some point I believe) I wanted to first try to make the integration work. My app runs and I can see the a...

 
DDS
I believe that your transducer is probably out of whack. You could adjust the flux capacitor but that really depends on the code you have, of which you have expertly included as much as you possibly could without giving any actual helpful information. You may want to check in the file combineReducers.js on line 107 or somewhere else (depending on your source mapping setup)
 
When pointing out 'transducer' do you mean combineReducers? I'm using combineReducers from redux library.
 
DDS
No, I'm just sayin'. It is unknowable since you don't give enough information to know anything about it. It might be a flux transducer. Can't know. You may want to edit the question and include a large amount of code, such as combineReducers.js.
 
I came across an issue report (little different then mine) but adding const auth = (state = {}, action) => { return authStateReducer(Immutable.fromJS(state), action); } const appReducer = combineReducers({ auth, ... }); seems to get rid of the error message. I'm not exactly sure with its implications
 
DDS
You have to call combineReducers with an immutable map or otherwise it will just break. Immutable.fromJS({ routing: routerReducer, auth: authStateReducer, .... }), probably
 
5:06 PM
Wouldn't this affect all of my reducers? All of my other reducers don't use immutable at the moment.
 
DDS
So. how do you think this will work?
What does the state look like?
Redux is storing something as the state... what kind of a thing should it be storing?
 
5:31 PM
auth: Map { "server": Map { "user": null, "headers": null, "firstTimeLogin": false, "mustResetPassword": false }, "updatePassword": Map {}, "requestPasswordReset": Map {}, "configure": Map { "loading": true, "errors": null, "config": null, "endpointKeys": undefined, "defaultEndpointKey": undefined, "currentEndpointKey": null }, "updatePasswordModal": Map {}, "user": Map { "attributes": undefined, "isSignedIn": false, "firstTimeLogin": undefined, "mustResetPassword": undefined, "endpointKey": null }, "signOut": Map {}, "destroyAccount": Map {}, "ui": Map { "emailSignUpAddress": null, "firstTimeLoginErrorModalVisible": false, "requestPasswordResetSuccessModalVisible": false, "updatePasswordSuccessModalVisible": false, "requestPasswordResetErrorModalVisible": false, "updatePasswordErrorModalVisible": false, "requestPasswordResetSuccessMessage": null, "emailSignInSuccessModalVisible": false, "emailSignInErrorModalVisible": false, "oAuthSignInSuccessModalVisible": false, "emailSignUpSuccessModalVisible": false, "passwordResetSuccessModalVisible": undefined, "oAuthSignInLoadingProvider": null, "oAuthSignInErrorModalVisible": false, "destroyAccountMessage": null, "destroyAccountSuccessModalVisible": false, "signOutSuccessModalVisible": false, "passwordResetErrorModalVisible": false, "destroyAccountErrorModalVisible": false, "firstTimeLoginSuccessModalVisible": undefined, "signOutErrorModalVisible": false }, "emailSignUp": Map {}, "authentication": Map { "loading": false, "valid": false, "errors": "Invalid token" }, "oAuthSignIn": Map {}, "emailSignIn": Map {} },
it only shows initial state.
and after successful sign in: the message shows up and reads "Welcome Back
You are now signed in as ."
    <p>You are now signed in as {this.props.auth.getIn(["user", "attributes", "email"])}.</p>
so this.props.auth.getIn seems to get nothing.
thanks for your help btw
 
DDS
6:18 PM
Well, understand that Immutable doesn't just accept "parts" that are plain JS
And so the state can't have an Immutable root that then has POJO children
You CAN have a POJO root with immutable children however
But you'd use a plain combineReducers for that
 
6:59 PM
I'm currently using plain combine reducers
do you think I should make everythin into immutables? I see that action actually passes the user object from my console view = > Object {type: "EMAIL_SIGN_IN_COMPLETE", user: Object, endpoint: "default"} endpoint: "default" type: "EMAIL_SIGN_IN_COMPLETE" user:Object email : "hhwang.h@gmail.com" first_name : "" id : 1 last_name : ""
uid : "henry"
export default createReducer(initialState, {
[authActions.AUTHENTICATE_COMPLETE]: (state, { user }) => state.merge({
attributes: user,
isSignedIn: true,
endpointKey: getCurrentEndpointKey()
}),

[ssActions.SS_TOKEN_VALIDATION_COMPLETE]: (state, { user, mustResetPassword, firstTimeLogin }) => {
return state.merge({
attributes: user,
isSignedIn: true,
firstTimeLogin,
mustResetPassword
});
},

[STORE_CURRENT_ENDPOINT_KEY]: (state, {currentEndpointKey}) => state.set("endpointKey", currentEndpointKey),
[EMAIL_SIGN_IN_COMPLETE]: so is not working correctly.
 
DDS
7:22 PM
You can use the regular combineReducers. You can have any reducer use Immutable, then. Just make a reducer function myReducer(state = Immutable.Map, action) { ... } and use this in combineReducers({ myReducer }) <- plain Redux cr
Sub-reducers of POJO reducers can be immutable, but not vv
 
OK so currently I have
import { authStateReducer } from 'redux-auth';
import Immutable from 'immutable';


const auth = (state = {}, action) => {
return authStateReducer(Immutable.fromJS(state), action);
}
export default combineReducers({
auth});
but change that to
return authStateReducer(Immutable.Map, action); ??
sorry I mean authStateReducer(state = Immutable.Map, action);
authStateReducer is a reducer function from "redux-auth" so I'll have to fork it to make those changes unless I wrap it here like this
 
DDS
Why can't you just use it directly?
 
I'm sorry? do you mean authStateReducer?
sorry about being so slow.... but do you mean to put every other reducers like myReducer you've shown above or just the authStateReducer?
 
DDS
8:06 PM
authStateReducer already manages its own state in such a way that it is an immutable. What a reducer does with its own slice of the state is its own business. It'll make an immutable if it feels like it (it does feel like it)
I was typing that but I got called away. Didn't mean to leave you hanging.
 
no worries I appreciate your help. so where do you think I should make the function myReducer(state = Immutable.Map, action) { ... }
?
Maybe I just need to change my reducers to immutables...
 
 
1 hour later…
9:25 PM
SO I think you are saying that changing other reducers is not my problem?? where do you think the problem is?
 
DDS
9:41 PM
You're using redux-immutable or somesuch. Just use the plain old vanilla Redux combineReducers and let the Immutable stuff be an implementation detail inside redux-auth that you don't have to think or worry about.
This thing: myReducer(state = Immutable.Map, action) { ... } is what you'll find in redux-auth. You don't have to worry about it.
That line defines an Immutable state, as used here github.com/lynndylanhurley/redux-auth/blob/…
 
import { combineReducers } from 'redux';
import { routerReducer } from 'react-router-redux';
import {reducer as reduxAsyncConnect} from 'redux-async-connect';
import {reducer as form} from 'redux-form';
import postlist from './postlist';
import post from './post';
import childcategorylist from './categorylist';
import childcategorypostlist from './childcategorypostlist';
import category from './category';
import recommended from './recommended';
import featured from './featured';
import investorlist from './investorlist';
I believe I'm using t he plain combineReducers.... and when I don't do use the

const auth = (state, action) => {
return authStateReducer(Immutable.fromJS(state), action);
}

I'll get e.get is not a function error.
so I printed auth which doesn't throw the error and it reads: (){var e=arguments.length<=0||void 0===arguments[0]?{}:arguments[0],t=arguments[1];return(0,k.authStateReducer)(L["‌​default"].Map(e),t)}
when I print authStateReducer it throws the error and reads: (e,r){if(void 0===e&&(e=i),n)throw n;var a=!1,s=t.map(function(t,n){var o=e.get(n),i=t(o,r);if(a=a||o!==i,"undefined"==typeof i)throw new Error(getErrorMessage(n,r));return i}),u=o(e,s,r);ret…
reducer.js:85(){var e=arguments.length<=0||void 0===arguments[0]?{}:arguments[0],t=arguments[1];return(0,k.authStateReducer)(L["default"].Map(e),t)}
 
 
1 hour later…
DDS
11:19 PM
Do you have some kind of initial state? At first, the authStateReducer should receive undefined and when it does it should default to whatever it defaults to, probably one of those Immutable structures, presumably a Map, but it should really be none of our beeswax what it defaults to as long as it's internally consistent and doesn't explode.
 

last day (15 days later) »