GetStream.io & React Native TypeError: You are publicly sharing your app secret - react-native

Question

I am creating a getstream feed app in react native, and have been trying to debug this error for the past couple hours but with no success. Other's have posted about it on stack overflow but not with using the <StreamApp></StreapApp> component from react-native-activity-feed.
Here is my code
import config from '../../config';
class Feed extends Component {
render(){
return(
<SafeAreaView
style={[{ flex: 1 }, { backgroundColor: '#FFFFFF' }]}
forceInset={{ top: 'always' }}
>
<StreamApp
apiKey={config.stream.app.key}
appId={config.stream.app.id}
token={this.state.token}>
<FlatFeed
feedGroup="timeline"
options={{
limit: 10,
}}
notify
navigation={this.props.navigation}
Activity={(props) => (
<TouchableOpacity
onPress={() => this._onPressActivity(props.activity)}
>
<Activity
{...props}
Footer={
<View style={{ flexDirection: 'row', alignItems: 'center' }}>
<LikeButton {...props} />
<ReactionIcon
icon={ReplyIcon}
labelSingle="comment"
labelPlural="comments"
counts={props.activity.reaction_counts}
kind="comment"
/>
</View>
}
/>
</TouchableOpacity>
)}
/>
</StreamApp>
</SafeAreaView>
);
}
}
I am importing the key and id from a config file located in my root directory. I have also tried storing the id and key in a .env file but both efforts result in the same error. The Token I am getting server-side, I don't include the code for retrieving it from AsyncStorage so I don't clutter the post.
Also, here is the exact error:

Answer 1

The problem is how you acquire the token. The error comes up if you store the token in the state, whereas if you import it from the same spot as you import the key and ID the app will load correctly.