Initializing <StreamApp> with Data - getstream-io

Question

I am using react native with native code. Using the 'react-native-activity-feed' library, I am trying to get Stream Feeds up and running on my app.
I have set up my stream account with an api key, app Id and app secret. Using firebase functions, I am creating a token server side for the user upon account creation and then saving that to the database.
const client = stream.connect(
functions.config().stream.key_id,
functions.config().stream.secret,
);
const userToken = client.createUserToken(user.uid);
admin.database().ref('users/' + user.uid ).set({
token: userToken
})
Client side, I retrieve that token for the current user and then I pass it (along with app Id and app key) into the object. I am expecting to get an empty feed with no errors but instead I get 'data undefined' error from Stream.
What else do I need to create client side or server side in order to start using the StreamApp Object?
import {StreamApp} from 'react-native-activity-feed
render() {
const { currentUser } = this.state
const {streamToken} = this.state
let apiKey = Config.STREAM_API_KEY;
let appId = Config.STREAM_APP_ID;
userId = firebase.auth().currentUser.uid;
let token;
tokenRef = firebase.database().ref(`users/${userId}`);
tokenRef.on('value', (snapshot) => {
token = snapshot.val().token;
})
return (
<StreamApp
apiKey={apiKey}
appId={appId}
token={token}
>
</StreamApp>
)
}
}
Error:
TypeError: undefined is not an object (evaluating 'client.currentUser.data')
This error is located at:
in StreamApp(...)
...

Answer 1

It ended up being a problem with the render function being called before the server had returned the stream token.
To fix, I gave the page time to load the stream token from the server:
render() {
if(this.state.loading) {
return (<View style={[styles.container, styles.horizontal]}><ActivityIndicator size="large" color="#0000ff" /></View>);
}
return (
<StreamApp
apiKey={this.state.apiKey}
appId={this.state.apiId}
token={this.state.streamToken}
>
</StreamApp>
)
}
}