-More!

app/components/AppHeader/UserProfileButton/UserProfileButton.container.js

@@ -0,0 +1,11 @@
+import { connect } from 'react-redux';
+
+import { getProfileAvatarUrl } from '../selectors/profile.js';
+
+import HeaderContentRight from './HeaderContentRight.js';
+
+const matchStateToProps = (state) => ({
+  avatarUrl: getProfileAvatarUrl(state),
+});
+
+export default connect(matchStateToProps, null)(HeaderContentRight);

app/components/AppHeader/UserProfileButton/UserProfileButton.js

@@ -0,0 +1,35 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+
+import { Image, TouchableOpacity, View } from 'react-native';
+import { Icon } from 'react-native-elements';
+
+import styles from './UserProfileButton.styles.js';
+
+export default function UserProfileButton({ avatarUrl, navigation }) {
+
+  const _goToProfile = () => {
+    navigation.navigate('Profile');
+    return false;
+  };
+
+  return (
+    <TouchableOpacity onPress={_goToProfile}>
+      {avatarUrl !== null ? (
+        <View style={styles.avatarWrap}>
+          <Image source={{ uri: avatarUrl }} />
+        </View>
+      ) : (
+        <Icon name="ei-user" type="evilicons" size={28} />;
+      )}
+    </TouchableOpacity>
+  );
+}
+
+HeaderContentRight.propTypes = {
+  avatarUrl: PropTypes.string,
+};
+
+HeaderContentRight.propTypes = {
+  avatarUrl: null,
+};