From 9225abbd31832a3913e63234a03875cbb8a0a20e Mon Sep 17 00:00:00 2001 From: Andrey Shcherbinin Date: Sun, 27 Aug 2017 22:34:19 +0300 Subject: [PATCH] add people --- src/components/Root.js | 2 ++ src/components/routes/AddPeoplePage.js | 44 ++++++++++++++++++++++++++ src/config.js | 8 ++--- src/ducks/people.js | 32 +++++++++++++++++++ src/redux/reducer.js | 4 ++- 5 files changed, 85 insertions(+), 5 deletions(-) create mode 100644 src/components/routes/AddPeoplePage.js create mode 100644 src/ducks/people.js diff --git a/src/components/Root.js b/src/components/Root.js index bbf2596..6af77fc 100644 --- a/src/components/Root.js +++ b/src/components/Root.js @@ -2,6 +2,7 @@ import React, { Component } from 'react' import {Route} from 'react-router-dom' import AdminPage from './routes/AdminPage' import AuthPage from './routes/AuthPage' +import AddPeoplePage from './routes/AddPeoplePage'; import ProtectedRoute from './common/ProtectedRoute' class Root extends Component { @@ -13,6 +14,7 @@ class Root extends Component { return (
+
) diff --git a/src/components/routes/AddPeoplePage.js b/src/components/routes/AddPeoplePage.js new file mode 100644 index 0000000..25abc68 --- /dev/null +++ b/src/components/routes/AddPeoplePage.js @@ -0,0 +1,44 @@ +import React, { Component } from 'react'; +import {reduxForm, Field} from 'redux-form'; +import emailValidator from 'email-validator'; +import ErrorField from '../common/ErrorField'; +import {addPeople} from '../../ducks/people'; +import {connect} from 'react-redux'; + +class AddPeoplePage extends Component { + render() { + const {handleSubmit} = this.props + return ( +
+ + + +
+ +
+ + ); + } + + submitForm = ({firstName, lastName, email}) => { + this.props.addPeople(firstName, lastName, email); + } +} + +const validate = ({firstName, lastName, email}) => { + const errors = {} + + if (!firstName) errors.firstName = 'First name is required'; + + if (!lastName) errors.lastName = 'Last name is required'; + + if (!email) errors.email = 'email is required' + else if (!emailValidator.validate(email)) errors.email = 'invalid email' + + return errors +} + +export default connect(null, {addPeople})(reduxForm({ + form: 'addPeople', + validate +})(AddPeoplePage)); \ No newline at end of file diff --git a/src/config.js b/src/config.js index e8d8d78..6ae1469 100644 --- a/src/config.js +++ b/src/config.js @@ -1,13 +1,13 @@ import firebase from 'firebase' -export const appName = "advreact-21-08" +export const appName = 'adv-react-becce'; export const firebaseConfig = { - apiKey: "AIzaSyDjA6CeIHuni5lNm4ML1b-TSxJltsYUO8g", + apiKey: "AIzaSyACAdiXccnI3MWYqFQT6aIU0A59plv8upc", authDomain: `${appName}.firebaseapp.com`, databaseURL: `https://${appName}.firebaseio.com`, projectId: appName, storageBucket: `${appName}.appspot.com`, - messagingSenderId: "789814589283" -} + messagingSenderId: "235849394951" + }; firebase.initializeApp(firebaseConfig) \ No newline at end of file diff --git a/src/ducks/people.js b/src/ducks/people.js new file mode 100644 index 0000000..f14cb6a --- /dev/null +++ b/src/ducks/people.js @@ -0,0 +1,32 @@ +import {appName} from '../config'; +import {Record} from 'immutable'; + +const ReducerRecord = Record({ + firstName: '', + lastName: '', + email: '' +}); + +export const moduleName = 'people'; +export const ADD_PEOPLE = `${appName}/${moduleName}/ADD_PEOPLE`; + +export default function reducer (state = new ReducerRecord(), action) { + const {type, payload} = action; + + switch (type) { + case ADD_PEOPLE: + return state + .set('firstName', payload.firstName) + .set('lastName', payload.lastName) + .set('email', payload.email) + default: + return state; + } +} + +export const addPeople = (firstName, lastName, email) => ({ + type: ADD_PEOPLE, + payload: { + firstName, lastName, email + } +}) \ No newline at end of file diff --git a/src/redux/reducer.js b/src/redux/reducer.js index 34143fe..cc6e0aa 100644 --- a/src/redux/reducer.js +++ b/src/redux/reducer.js @@ -2,8 +2,10 @@ import {combineReducers} from 'redux' import {routerReducer as router} from 'react-router-redux' import {reducer as form} from 'redux-form' import authReducer, {moduleName as authModule} from '../ducks/auth' +import peopleReducer, {moduleName as peopleModule} from '../ducks/people' export default combineReducers({ router, form, - [authModule]: authReducer + [authModule]: authReducer, + [peopleModule]: peopleReducer }) \ No newline at end of file