Merge branch 'master' of honey.fitz.guru:eventment-app

# Conflicts:
#	app/actions/profile.js
#	app/router.js

app/actions/items.js

@@ -1,38 +1,39 @@
 import { List } from 'immutable';
 
-import { getEndpointUrl } from '../api/index.js';
-
+import { fetchItems } from '../api/items.js';
 import {
   GET_ITEMS,
   ITEMS_LOADED,
 } from '../constants/actionTypes.js';
+import { getActiveEventId } from '../selectors/activeEvent.js';
+import { getLoginToken } from '../selectors/profile.js';
 
 import { blockUI, unblockUI } from './index.js';
-import { API_ENDPOINTS } from '../constants/constants.js';
 
 import Item from '../domain/Item.js';
 
+const itemsLoaded = (payload) => ({ type: ITEMS_LOADED, payload });
 
-const itemsLoadSuccess = (items, dispatch) => {
+const itemsLoadError = (payload) => ({ type: ITEMS_LOAD_FAILED, payload });
+
+const itemsFetchSuccess = (items) => (dispatch) => {
   const payload = List(items).map((i) => Item.fromJS(i));
-  dispatch({ type: ITEMS_LOADED, payload });
+
+  dispatch(itemsLoaded(payload));
+  dispatch(unblockUI);
+};
+
+const itemsFetchFailure = (error) => (dispatch) => {
+  console.error('[actions::getItems]', error));
+  dispatch(itemsLoadFailure(error));
   dispatch(unblockUI);
 };
 
 export const fetchItems = () => (dispatch, getState) => {
-  const state = getState();
-  const activeEvent = state.get('activeEvent');
+  const eventId = getActiveEventId(getState());
+  const authToken = getLoginToken(getState());
 
-  let apiUrl = getEndpointUrl(API_ENDPOINTS.GET_ITEMS);
-  apiUrl = apiUrl.replace(/:event_id$/, '');
-  if (activeEvent) {
-    apiUrl = `${apiUrl}${activeEvent}`;
-  }
-
-  dispatch(blockUI());
-
-  fetch(apiUrl)
-    .then(response => response.json())
-    .then(payload => itemsLoadSuccess(payload, dispatch))
-    .catch(err => console.error('[actions::getItems]', err));
+  fetchItems(activeEvent, authToken)
+    .then(payload => dispatch(itemsFetchSuccess(payload)))
+    .catch(err => dispatch(itemsFetchFailure(err));
 };

app/actions/profile.js

@@ -1,33 +1,89 @@
-import { List } from 'immutable';
-
-import { getEndpointUrl } from '../api/index.js';
+import { blockUI, unblockUI } from './index.js';
 
 import {
-  EVENTS_LOADED,
-  GET_EVENTS,
+  getEmailAvailability,
+  getNomAvailaibility,
+  registerNewUser,
+} from '../api/profile.js';
+
+import {
+  DO_LOGOUT,
+  PROFILE_EMAIL_AVAILABLE,
+  PROFILE_NOM_AVAILABLE,
+  UPDATE_PROFILE,
 } from '../constants/actionTypes.js';
 
-import { blockUI, unblockUI } from './index.js';
-import { API_ENDPOINTS } from '../constants/constants.js';
-
-import Event from '../domain/Event.js';
-
-
-const eventsLoadSuccess = (events, dispatch) => {
-  const payload = List(events).map((i) => Event.fromJS(i));
-  dispatch({ type: EVENTS_LOADED, payload });
-  dispatch(unblockUI);
-};
-
-export const setActiveEvent = (eventId) => ({
-  type: SET_ACTIVE_EVENT,
-  payload: eventId,
+const isValidEmail = (payload) => ({
+  type: PROFILE_EMAIL_AVAILABLE,
+  payload,
 });
 
-export const fetchEvents = () => (dispatch) => {
-  dispatch(blockUI());
-  fetch(getEndpointUr(API_ENDPOINTS.GET_EVENTS))
-    .then(response => response.json())
-    .then(payload => eventsLoadSuccess(payload, dispatch))
-    .catch(err => console.error('[actions::getEvents]', err));
+const isValidNom = (payload) => ({
+  type: PROFILE_NOM_AVAILABLE,
+  payload,
+});
+
+const logoutUser = () => ({
+  type: DO_LOGOUT,
+});
+
+const registrationFailure = (payload) => ({
+  type: REGISTRATION_FAILURE,
+  payload,
+});
+
+const registrationSuccess = (payload) => ({
+  type: REGISTRATION_SUCCESS,
+  payload,
+});
+
+const updateProfile = (profile) => ({
+  type: UPDATE_PROFILE,
+  payload: profile,
+});
+
+export const checkEmailAvailability = (email) => (dispatch) => {
+
+};
+
+export const checkNomAvailability = (nomDeBid) => (dispatch) => {
+
+};
+
+
+export const logout = () => (dispatch) => dispatch(logoutUser());
+
+// USER REGISTRATION
+const handleRegistrationSuccess = (user) => (dispatch) => {
+  dispatch(unblockUI());
+  dispatch(registrationSuccess());
+  dispatch(loginSuccess(user));
+};
+
+const handleRegistrationFailure = (error) => (dispatch) => {
+  dispatch(unblockUI());
+  dispatch(registrationFailure(error));
+};
+
+export const registerUser = (user) => (dispatch) => {
+  dispatch(blockUI());
+  registerNewUser(user)
+    .then(user => dispatch(handleRegistrationSuccess(user)))
+    .catch(err => dispatch(handleRegistrationFailure(err)));
+};
+
+// FACEBOOK
+export const facebookLoginSuccess = (result) => (dispatch) => {
+  console.log('facebookLoginSuccess', result);
+  dispatch(facebookLoginSuccess(result));
+};
+
+
+// LOGIN SERVICES COMMON ACTIONS
+export const serviceRegistrationError = (error) => (dispatch) => {
+
+};
+
+export const serviceRegistrationCanceled = () => (dispatch) => {
+
 };

app/api/helpers.js

@@ -0,0 +1,86 @@
+import { API_URL } from '../constants/constants.js';
+
+export const constructUrl = (path, params, host = API_URL) => {
+  if (!(/^\//g).test(path)) {
+    throw new Error(`Invalid path! Expecting a valid relative path (path needs to start with /)(${path})`);
+  }
+
+  let url = path;
+
+  if (host) {
+    url = `${host}${url}`;
+  }
+
+  if (params) {
+    url = `${url}?${params}`;
+  }
+
+  return url;
+};
+
+/**
+ * Formats data for a POST request.
+ *
+ * @param {Object} body - data to be passed to the POST endpoint
+ * @param {Boolean} isTraditional - similar to jQuery's option `traditional` for $.ajax(),
+ *                  this serializes data in a way that helps support legacy endpoints
+ */
+export const formatPostData = (body) => {
+  const postData = new FormData();
+  Object.keys(body).forEach(key => postData.append(key, body[key]));
+  return postData;
+};
+
+const parseQueryParamsString = (queryParams) => {
+  if (typeof queryParams !== 'string') {
+    return null;
+  }
+
+  return queryParams;
+};
+
+const parseQueryParamsObject = (queryParams) => {
+  if (typeof queryParams !== 'object' && Array.isArray(queryParams)) {
+    return null;
+  }
+
+  return Object
+    .keys(queryParams)
+    .map((key) => {
+      const value = queryParams[key];
+      return `${encodeURIComponent(key)}=${encodeURIComponent(value)}`;
+    })
+    .join('&');
+};
+
+const parseQueryParamsArray = (queryParams) => {
+  if (!Array.isArray(queryParams)) {
+    return null;
+  }
+
+  return queryParams
+    .map((param) => {
+      const [key, value] = param.split('=');
+      return `${encodeURIComponent(key)}=${encodeURIComponent(value)}`;
+    })
+    .join('&');
+};
+
+export const parseQueryParams = queryParams => (
+  parseQueryParamsString(queryParams) ||
+  parseQueryParamsObject(queryParams) ||
+  parseQueryParamsArray(queryParams) ||
+  ''
+);
+
+export const request = (url, options) => {
+  try {
+    return fetch(url, options).catch((err) => console.error(err));
+  } catch (error) {
+    return Promise.reject(error);
+  }
+};
+
+export const unwrapJson = (response) => response.json();
+
+export const validateResponse = (response) => response;

app/api/index.js

@@ -1,4 +1,15 @@
-const apiUrl = 'http://localhost:3001';
+import {
+  constructUrl,
+  formatPostData,
+  parseQueryParams,
+  request,
+  unwrapJson,
+  validateResponse,
+} from './helpers.js';
+
+import { API_URL } from '../constants/constants.js';
+
+const DefaultRequestOptions = {};
 
 const endpoints = {
   // Events and Items
@@ -35,5 +46,47 @@ export const getEndpointUrl = (endpoint) => {
     throw new Error('Invalid API endpoint specified');
   }
 
-  return `${apiUrl}${endpoints[endpoint]}`; //`${cacheBuster()}`;
+  return `${API_URL}${endpoints[endpoint]}`; //`${cacheBuster()}`;
+};
+
+export const requestGet = (path, queryParams = [], requestOptions = {}) => {
+  const params = parseQueryParams(queryParams);
+
+  if (params === null) {
+    throw new Error('Invalid queryParams');
+  }
+
+  return request(constructUrl(path, params), {
+      ...DefaultRequestOptions,
+      ...requestOptions
+    })
+    .then(validateResponse)
+    .then(unwrapJson);
+};
+
+export const requestPost = (options) => {
+  const {
+    path,
+    body = {},
+    queryParams = [],
+    requestOptions = {},
+    isFormattedPostData = false
+  } = options;
+
+  const params = parseQueryParams(queryParams || []);
+
+  if (params === null) {
+    throw new Error('invalid queryParams');
+  }
+
+  // Additional formatting happens in `formatPostData()`
+  // like handling what jQuery calls `traditional` form data
+  return request(constructUrl(path, params), {
+      ...DefaultRequestOptions,
+      ...requestOptions,
+      method: 'POST',
+      body: isFormattedPostData ? body : formatPostData(body)
+    })
+    .then(validateResponse)
+    .then(unwrapJson);
 };

app/api/items.js

@@ -0,0 +1,7 @@
+import { getEndpointUrl, requestGet } from './index.js';
+
+export const fetchItems = (eventId, auth) => {
+  const path = String(API_ENDPOINTS.GET_ITEMS).replace(/:event_id$/, eventId);
+  const opts = { Authorization: auth ? `Bearer ${auth}` : null };
+  return requestGet(path, null, opts);
+};

app/components/FacebookLogin/FacebookLogin.container.js

@@ -0,0 +1,19 @@
+import { connect } from 'react-redux';
+
+import {
+  facebookLoginSuccess,
+  logout,
+  registrationServiceError,
+  userCanceledRegistration,
+} from '../actions/profile.js';
+
+import FacebookLogin from './FacebookLogin.js';
+
+const mapDispatchToProps = (dispatch) => ({
+  doCancelAction: () => dispatch(userCanceledRegistration()),
+  doErrorAction: (error) => dispatch(registrationServiceError(error)),
+  doLogoutAction: () => dispatch(logout()),
+  doSuccessAction: (result) => dispatch(facebookLoginSuccess(result)),
+});
+
+export default connect(null, mapDispatchToProps)(FacebookLogin);

app/components/FacebookLogin/FacebookLogin.js

@@ -0,0 +1,41 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import { View } from 'react-native';
+import { LoginButton } from 'react-native-fbsdk';
+
+import { PERMISSIONS } from '../../constants/constants.js';
+
+export default function FacebookLogin({
+  doCancelAction,
+  doErrorAction,
+  doLogoutAction,
+  doSuccessAction,
+}) {
+
+  return (
+    <View>
+      <LoginButton
+        publishPermissions={PERMISSIONS.FACEBOOK}
+        onLoginFinished={
+          (error, result) => {
+            if (error) {
+              doErrorAction(error);
+            } else if (result.isCancelled) {
+              doCancelAction();
+            } else {
+              doSuccessAction(result);
+            }
+          }
+        }
+        onLogoutFinished={doLogoutAction}
+      />
+    </View>
+  );
+}
+
+FacebookLogin.propTypes = {
+  doCancelAction: PropTypes.func.isRequired,
+  doErrorAction: PropTypes.func.isRequired,
+  doLogoutAction: PropTypes.func.isRequired,
+  doSuccessAction: PropTypes.func.isRequired,
+};

app/constants/actionTypes.js

@@ -19,6 +19,8 @@ export const DO_LOGIN = 'DO_LOGIN';
 export const DO_LOGOUT = 'DO_LOOUT';
 
 export const DO_SIGNUP = 'DO_SIGNUP';
+export const PROFILE_EMAIL_AVAILABLE = 'PROFILE_EMAIL_AVAILABLE';
+export const PROFILE_NOM_AVAILABLE = 'PROFILE_NOM_AVAILABLE';
 
 export const DO_SIGNUP_APPLE = 'DO_SIGNUP_APPLE';
 export const DO_SIGNUP_FACEBOOK = 'DO_SIGNUP_FACEBOOK';

app/constants/constants.js

@@ -30,6 +30,8 @@ export const AUCTION_VIEW_MODES = {
   WINNING: 'WINNING',
 };
 
+export const API_URL = 'http://localhost:3001';
+
 export const API_ENDPOINTS = {
   GET_EVENTS: 'GET_EVENTS',
   GET_ITEMS: 'GET_ITEMS',
@@ -45,3 +47,7 @@ export const API_ENDPOINTS = {
   GOOGLE_SIGNUP: 'GOOGLE_SIGNUP',
   GOOGLE_LINK: 'GOOGLE_LINK',
 };
+
+export const PERMISSIONS = {
+  FACEBOOK: [ 'email', 'public_profile' ],
+};

app/router.js

@@ -13,8 +13,8 @@ import ImageDetail from './screens/ImageDetail.js';
 import Item from './screens/Item.js';
 import Marketplace from './screens/Marketplace.js';
 import Profile from './screens/Profile.container.js';
-
-//let screen = Dimensions.get('window');
+import Register from './screens/Register.js';
+import SignInOrRegister from './screens/SignInOrRegister.js';
 
 export const Tabs = createBottomTabNavigator({
   'Event': {
@@ -47,6 +47,25 @@ export const Tabs = createBottomTabNavigator({
   },
 });
 
+export const SignInOrRegisterStack = createStackNavigator({
+  SignInOrRegister: {
+    screen: SignInOrRegister,
+    navigationOptions: ({ navigation }) => {
+      header: null,
+      tabBarVisible: false,
+      gesturesEnabled: false
+    },
+  },
+  Register: {
+    screen: Register,
+    navigationOptions: ({ navigation }) => {
+      header: null,
+      tabBarVisible: false,
+      gesturesEnabled: false
+    },
+  },
+});
+
 export const AuctionStack = createStackNavigator({
   Auction: {
     screen: Auction,

app/screens/Register.container.js

@@ -0,0 +1,17 @@
+import { connect } from 'react-redux';
+
+import {
+  checkEmailAvailability,
+  checkNomAvailability,
+  registerUser,
+} from '../actions/profile.js';
+
+import Register from './Register.js';
+
+const mapDispatchToProps = (dispatch) => ({
+  checkEmail: (email) => dispatch(checkEmailAvailability(email)),
+  checkNomDeBid: (nomDeBid) => dispatch(checkNomAvailability(nomDeBid)),
+  doRegistration: (user) => dispatch(registerUser(user)),
+});
+
+export default connect(null, mapDispatchToProps)(Register);

app/screens/Register.js

@@ -0,0 +1,90 @@
+import React, { Component } from 'react';
+import { Text, View } from 'react-native';
+
+import styles from './Register.styles.js';
+
+export default class Register extends Component {
+
+  static get propTypes() {
+    return {
+      checkEmail: PropTypes.func.isRequired,
+      checkNomDeBid: PropTypes.func.isRequired,
+      doRegistration: PropTypes.func.isRequired,
+//       invalidEmail: PropTypes.bool.isRequired,
+//       invalidNomDeBid: PropTypes.bool.isRequired,
+    };
+  }
+
+  constructor() {
+    super(props);
+
+    this.state = {
+      addresses: [],
+      avatar: null,
+      email: null,
+      firstName: null,
+      lastName: null,
+      nomDeBid: null,
+      invalidEmail: false,
+      invalidNomDeBid: false,
+      password: null,
+      phones: [],
+    };
+
+    this._doRegistration = this._doRegistration.bind(this);
+  }
+
+  _doRegistration() {
+    if (!this.isFormComplete()) {
+      console.error('Incomplete form... how did the button become enabled?');
+      alert('Please complete all of the required fields. They have bold labels.');
+      return;
+    }
+
+    this.props.doRegistration(this.getUserRegistration());
+  }
+
+  _validateEmail() {
+    this.props.checkEmail(this.state.email, (valid) => this.setState('invalidEmail', valid));
+  }
+
+  _validateNomDeBid() {
+    this.props.checkNomDeBid(this.state.nomDeBid, (valid) => this.setState('invalidNomDeBid', valid));
+  }
+
+  getUserRegistration() {
+    return {
+      addresses: this.state.addresses,
+      avatar: this.state.avatar,
+      email: this.state.email,
+      firstName: this.state.firstName,
+      lastName: this.state.lastName,
+      nomDeBid: this.state.nomDeBid,
+      password: this.state.password,
+      phones: this.state.phones,
+    };
+  }
+
+  isFormComplete() {
+    return !this.state.invalidEmail && !this.state.invalidNomDeBid &&
+      !!this.state.firstName && !!this.state.lastName && !!this.state.email &&
+      !!this.state.nomDeBid && !!this.state.phones.length && !!this.state.password;
+  }
+
+  render() {
+    return (
+      <View style={styles.container}>
+        <Text style={styles.title}>Sign In or Register</Text>
+        <View style={styles.localLogin}>
+          <LocalLogin />
+        </View>
+        <View style={styles.services}>
+          <FacebookLogin />
+        </View>
+        <View style={styles.register}>
+          <Button onPress={this._doRegistration} />
+        </View>
+      </View>
+    );
+  }
+}

app/screens/SignInOrRegister.js

@@ -0,0 +1,36 @@
+import React, { Component } from 'react';
+import { Text, View } from 'react-native';
+
+import FacebookLogin from '../components/FacebookLogin/FacebookLogin.container.js';
+
+import styles from './SignInOrRegister.styles.js';
+
+export default class SignInOrRegister extends Component {
+
+  constructor() {
+    super(props);
+
+    this._doRegistration = this._doRegistration.bind(this);
+  }
+
+  _doRegistration() {
+    this.props.navigation.navigate('Register');
+  }
+
+  render() {
+    return (
+      <View style={styles.container}>
+        <Text style={styles.title}>Sign In or Register</Text>
+        <View style={styles.localLogin}>
+          <LocalLogin />
+        </View>
+        <View style={styles.services}>
+          <FacebookLogin />
+        </View>
+        <View style={styles.register}>
+          <Button onPress={this._doRegistration} />
+        </View>
+      </View>
+    );
+  }
+}

app/screens/SignInOrRegister.styles.js

@@ -0,0 +1,15 @@
+import { StyleSheet } from 'react-native';
+
+export default const styles = StyleSheet.create({
+  container: {
+    flex: 1,
+    justifyContent: 'center',
+    alignItems: 'center',
+    backgroundColor: '#F5FCFF',
+  },
+  title: {
+    fontSize: 20,
+    textAlign: 'center',
+    margin: 10,
+  }
+});