last day (14 days later) » 

7:19 AM
0
Q: React native & redux : facebook login error

Antonin MrchdI try to create a facebook login using react native sdk and redux, I work a lot on the code but I still have this error when I refresh my app : Cannot read property 'error' of undefined I don't understand why, because I all my files are correctly imported in each files .. the reducer : imp...

 
Can you please post the code for the file which shows your root reducer/combineReducers for your redux store?
 
@YoWakita hey ! I've just edited my question :)
 
Can you also post the full error log that you see when the error occurs? It may help in debugging the error. My hunch is that it is coming from this.props.auth not being defined for some reason. Can you console log this.props.auth in the line right after your render() { and post what it returns?
 
@YoWakita I have this : Object {loading: false, loggedIn: false, error: null} and I post in my question the screen of the error
@YoWakita actually, I have Object {loading: false, loggedIn: false, error: null} AND undefined under this ...
 
Lets move this conversation to chat, it may be easier to debug your problem this way.
It seems as though your state.auth in your mapStateToProps becomes undefined at some point, and because of this, your this.props.auth becomes undefined.
 
7:45 AM
Ok I understand, how could I check where the this.props.auth is undefined ?
 
so just to be clear, when you console.log this.props.auth, first it shows the object correctly, then it becomes undefined?
 
Yes that is exact !
 
8:03 AM
I see, can you post the code you have for your profile reducer?
I noticed that you did not pass your profile reducer into your combineReducers, by the way
it is definitely odd that your auth object becomes undefined
im sorry but i have to go to sleep now
it is 1:08am for me
if you put that information in the chat i will take a look in the morning when i wake up
 
8:35 AM
No problem I come from france, it's morning for me haha ! have a good night I post the code right now thank you mate !
import { ADD_USER } from '../actions/types';

function profileReducer(state = { id: null, name: null, profileURL: null, profileWidth: null, profileHeight: null }, action) {
switch (action.type) {
case ADD_USER:
return Object.assign({}, state, {
id: action.id,
name: action.name,
profileURL: action.profileURL,
profileWidth: action.profileWidth,
profileHeight: action.profileHeight
});
default:
return state;
}
}

export default profileReducer;
 
 
8 hours later…
4:33 PM
Hmm.. looking at your code i don't really see anything obvious that might be wrong
 
It is really weird ..
 
can you try to commend out your `addUser` function here:
dispatch(loggedin());
dispatch(addUser(result.id, result.name, result.picture.data.url, result.picture.data.width, result.data.height));
comment out**
actually nevermind
it does not get to that point before it fails
from what i can tell, it hits your initial state correctly
and then it fails when the redux state is being updated
can you put a console.log inside of case LOADING:
return Object.assign({}, state, {
loading: true
});
something like console.log('Inside the LOADING case')
and check if when you load the page, you see the this.props.auth with the initial state, then the console log inside the reducer, then the undefined
case LOADING:
console.log('Inside loading case');
return Object.assign({}, state, {
loading: true
});
also check inside your action that the actions are being dispatched
export function login() {
return dispatch => {
console.log('Before attempt')
dispatch(attempt());
facebookLogin().then((result) => {
console.log('Facebook login success')
dispatch(loggedin());
dispatch(addUser(result.id, result.name, result.picture.data.url, result.picture.data.width, result.data.height));
}).catch((err) => {
dispatch(error(err));
});
};
}
 
I'm going to try all that in 1 hour, I'm still at work right now haha thank you mate for your help ! I come back here in 1 hour to tell you if it's work :)
 
sounds good!
 
 
2 hours later…
6:36 PM
hi ! when I put the console.log('im in loading case') nothing is displayed on the console
 
interesting
can you please show me your action/types file ?
 
I still gave the Object {loading: false, loggedIn: false, error: null}
index.js:13undefined
// LOGIN CONST
export const LOADING = 'LOADING';
export const ERROR = 'ERROR';
export const LOGIN = 'LOGIN';
export const LOGOUT = 'LOGOUT';
export const ADD_USER = 'ADD_USER';
 
hmm.. very odd
ok
try this
before your switch case
n your reducer
console.log(action);
and then when you load the page tell me what you see
in the console
 
I have this result :
Object {type: "persist/REHYDRATE", payload: Object, error: null}
 
are you using a rehydrating/redux persisting library?
 
6:42 PM
I just use redux-persist but I not call it anywhere
 
like redux-persist or something?
ooo.. are you sure youre not calling it in your middleware?
 
I use it here :
import React, { Component } from 'react';
import { Provider } from 'react-redux';
import { AsyncStorage } from 'react-native';
import { persistStore } from 'redux-persist';
import thunkMiddleware from 'redux-thunk';
import createLogger from 'redux-logger';
import { createStore, compose, applyMiddleware } from 'redux';
import AppContainer from './containers/AppContainer';
import reducers from './reducers';

const loggerMiddleware = createLogger();

const store = compose(
applyMiddleware(thunkMiddleware)
in my App.js
 
okay
i have a strong feeling that your persist store is causing the error
i think the implementation may be incorrect
can you try commenting out persist store and see if it works?
just as a test?
 
yes
It don't change anything but this as disappear : Object {type: "persist/REHYDRATE", payload: Object, error: null}
do you want that I put all my code in a github repository to see the entire code ?
 
that might help, but im not sure i can spend much more time helping on this issue
sorry i usually can track down problems pretty fast, but i'm kind of baffled on what is wrong here
 
6:55 PM
I understand ! if you want to check all the code it may help you, if can't help me don't worry it very cool that you had take your time for me :)
 
if i have some time i will try to pull it down and take a look, but im generally pretty busy with coding projects
but good luck either way!
 
thank you ! you yoo for your projects !
 
 
1 hour later…
8:02 PM
Ok we fix this issue with my friend, <Login> was not defined, it was <LoginButton> ... stupid error I'm sorry
 

last day (14 days later) »