- Cleanup

app/components/AppHeader/AppHeader.js

@@ -3,20 +3,22 @@ import PropTypes from 'prop-types';
 
 import { Header } from 'react-native-elements';
 
-import HeaderTitle from './HeaderTitle.container.js';
+import HeaderTitle from './HeaderTitle/HeaderTitle.container.js';
 import HeaderContentLeft from './HeaderContentLeft.container.js';
 import HeaderContentRight from './HeaderContentRight.container.js';
 
 import styles from './AppHeader.styles.js';
 
-export default function AppHeader({ navigation }) (
-  <Header
-    placement="left"
-    leftComponent={<HeaderContentRight navigation={navigation} />}
-    centerComponent={<HeaderTitle navigation={navigation} />}
-    rightComponent={<HeaderContentLeft navigation={navigation} />}
-  />
-)
+export default function AppHeader({ navigation }) {
+  return (
+    <Header
+      placement="left"
+      leftComponent={<HeaderContentRight navigation={navigation} />}
+      centerComponent={<HeaderTitle navigation={navigation} />}
+      rightComponent={<HeaderContentLeft navigation={navigation} />}
+    />
+  );
+}
 
 AppHeader.propTypes = {
   navigation: PropTypes.func.isRequired,

app/components/AppHeader/HeaderContentLeft.container.js

@@ -1,6 +1,6 @@
 import { connect } from 'react-redux';
 
-import { hasMultipleEvents } from '../selectors/events.js';
+import { hasMultipleEvents } from '../../selectors/events.js';
 
 import HeaderContentLeft from './HeaderContentLeft.js';
 

app/components/AppHeader/HeaderContentRight.container.js

@@ -1,6 +1,6 @@
 import { connect } from 'react-redux';
 
-import { getProfileAvatarUrl } from '../selectors/profile.js';
+import { getProfileAvatarUrl } from '../../selectors/profile.js';
 
 import HeaderContentRight from './HeaderContentRight.js';
 

app/components/AppHeader/HeaderTitle/EventTitle/EventTitle.container.js

@@ -1,6 +1,6 @@
 import { connect } from 'react-redux';
 
-import { getActiveEvent, getDefaultEvent } from '../selectors/events.js';
+import { getActiveEvent, getDefaultEvent } from '../../../../selectors/events.js';
 
 import EventTitle from './EventTitle.js';
 

app/components/AppHeader/HeaderTitle/EventTitle/EventTitle.styles.js

@@ -1,6 +1,6 @@
 import { StyleSheet } from 'react-native';
 
-export default const styles = StyleSheet.create({
+export const styles = StyleSheet.create({
   eventInfo: {
     flexDirection: 'row',
   },
@@ -12,4 +12,3 @@ export default const styles = StyleSheet.create({
     flex: 1,
   },
 });
-

app/components/AppHeader/HeaderTitle/HeaderTitle.container.js

@@ -1,7 +1,7 @@
 import { connect } from 'react-redux';
 
-import { hasActiveEvent } from '../selectors/activeEvent.js';
-import { hasMultipleEvents } from '../selectors/events.js';
+import { hasActiveEvent } from '../../../selectors/activeEvent.js';
+import { hasMultipleEvents } from '../../../selectors/events.js';
 
 import HeaderTitle from './HeaderTitle.js';
 

app/components/AppHeader/HeaderTitle/HeaderTitle.js

@@ -9,7 +9,7 @@ import {
 
 import EventTitle from './EventTitle/EventTitle.container.js';
 
-import styles from './TitleBar.styles.js';
+import styles from './HeaderTitle.styles.js';
 
 export default function HeaderTitle({
   activeRoute,

app/components/AppHeader/HeaderTitle/HeaderTitle.styles.js

@@ -1,6 +1,6 @@
 import { StyleSheet } from 'react-native';
 
-export default const styles = StyleSheet.create({
+export const styles = StyleSheet.create({
   filterBar: {
     backgroundColor: '#0F0',
     flexDirection: 'row',

app/components/AppHeader/IconButtons/BackIcon.js

@@ -4,11 +4,13 @@ import PropTypes from 'prop-types';
 import { TouchableOpacity } from 'react-native';
 import { Icon } from 'react-native-elements';
 
-export default function BackIcon({ action }) (
-  <TouchableOpacity onPress={action}>
-    <Icon name="ei-chevron-left" type="evilicons" size={28} />;
-  </TouchableOpacity>
-)
+export default function BackIcon({ action }) {
+  return (
+    <TouchableOpacity onPress={action}>
+      <Icon name="ei-chevron-left" type="evilicons" size={28} />;
+    </TouchableOpacity>
+  );
+}
 
 BackIcon.propTypes = {
   action: PropTypes.func.isRequired,

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

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

app/components/AppHeader/UserProfileButton/UserProfileButton.js

@@ -20,16 +20,16 @@ export default function UserProfileButton({ avatarUrl, navigation }) {
           <Image source={{ uri: avatarUrl }} />
         </View>
       ) : (
-        <Icon name="ei-user" type="evilicons" size={28} />;
+        <Icon name="ei-user" type="evilicons" size={28} />
       )}
     </TouchableOpacity>
   );
 }
 
-HeaderContentRight.propTypes = {
+UserProfileButton.propTypes = {
   avatarUrl: PropTypes.string,
 };
 
-HeaderContentRight.propTypes = {
+UserProfileButton.propTypes = {
   avatarUrl: null,
 };

app/components/Login/FacebookLogin.container.js

@@ -5,7 +5,7 @@ import {
   logout,
   registrationServiceError,
   userCanceledRegistration,
-} from '../actions/profile.js';
+} from '../../actions/profile.js';
 
 import FacebookLogin from './FacebookLogin.js';
 

app/components/Login/LocalLogin.container.js

@@ -0,0 +1,11 @@
+import { connect } from 'react-redux';
+
+import { login } from '../../actions/profile.js';
+
+import LocalLogin from './LocalLogin.js';
+
+const mapDispatchToProps = (dispatch) => ({
+  doLoginAction: (username, password) => dispatch(login(username, password)),
+});
+
+export default connect(null, mapDispatchToProps)(LocalLogin);

app/components/Login/LocalLogin.js

@@ -0,0 +1,55 @@
+import React, { useState } from 'react';
+import PropTypes from 'prop-types';
+
+import { Button, TextInput, View } from 'react-native';
+
+export default function LocalLogin({ doLoginAction }) {
+
+  const [ enabled, setEnableSubmit ] = useState(false);
+  const [ password, setPassword ] = useState(null);
+  const [ username, setUsername ] = useState(null);
+
+  const _handleLoginSubmit = () => {
+    doLoginAction(username, password);
+  };
+
+  const _updateState = (field, value) => {
+    if (field === 'username') {
+      setUsername(value);
+    }
+
+    if (field === 'password') {
+      setPassword(value);
+    }
+
+    if (!!username && !!password) {
+      setEnableSubmit(true);
+    }
+  };
+
+  return (
+    <View style={styles.loginWrap}>
+      <TextInput
+        style={{height: 40}}
+        placeholder="email"
+        onChangeText={(text) => _updateState('username', text)}
+        value={username}
+      />
+      <TextInput
+        style={{height: 40}}
+        placeholder="password"
+        onChangeText={(text) => _updateState('password', text)}
+        value={password}
+      />
+      <Button
+        disabled={!enabled}
+        onPress={_handleLoginSubmit}
+        title="Login"
+      />
+    </View>
+  );
+}
+
+LocalLogin.propTypes = {
+  doLoginAction: PropTypes.func.isRequired,
+};