diff --git a/src/components/App.js b/src/components/App.js
index f70a4ed..d43dd4f 100644
--- a/src/components/App.js
+++ b/src/components/App.js
@@ -3,6 +3,7 @@ import {Route} from 'react-router-dom'
import ProtectedRoute from './common/ProtectedRoute'
import AdminPage from './routes/Admin'
import AuthPage from './routes/Auth'
+import PeoplePage from './routes/People';
class App extends Component {
static propTypes = {
@@ -15,6 +16,7 @@ class App extends Component {
Hello world
+
)
}
diff --git a/src/components/people/Add.js b/src/components/people/Add.js
new file mode 100644
index 0000000..31d0ced
--- /dev/null
+++ b/src/components/people/Add.js
@@ -0,0 +1,39 @@
+import React, {Component} from 'react'
+import {reduxForm, Field} from 'redux-form'
+import emailValidator from 'email-validator'
+import ErrorField from '../common/ErrorField'
+
+class PeopleAdd extends Component {
+ render() {
+ return (
+
+ )
+ }
+}
+
+const validate = ({firstName, lastName, email}) => {
+ const errors = {}
+
+ if (!email) errors.email = 'email is a required field'
+ if (!firstName) errors.firstName = 'First name is a required field'
+ if (!lastName) errors.lastName = 'Last name is a required field'
+
+ if (email && !emailValidator.validate(email)) errors.email = 'invalid email'
+
+ return errors
+}
+
+export default reduxForm({
+ form: 'peopleAdd',
+ validate
+})(PeopleAdd)
\ No newline at end of file
diff --git a/src/components/routes/People.js b/src/components/routes/People.js
new file mode 100644
index 0000000..6dac0e5
--- /dev/null
+++ b/src/components/routes/People.js
@@ -0,0 +1,31 @@
+import React, {Component} from 'react'
+import {Route, NavLink} from 'react-router-dom'
+import {connect} from 'react-redux'
+import {addPeopleEntry} from '../../ducks/people'
+import AddPeople from '../people/Add';
+
+class PeoplePage extends Component {
+ render() {
+ const peopleList = this.props.people.toArray();
+ return (
+
+
People
+
+ {peopleList.map((person, index) => {
+ return -
+ {person.firstName} {person.lastName}
+
+ })}
+
+
add
+
}/>
+
+ )
+ }
+
+ handleAdd = (entry) => this.props.addPeopleEntry(entry)
+}
+
+export default connect(state => ({
+ people: state.people.list
+}), {addPeopleEntry})(PeoplePage)
\ No newline at end of file
diff --git a/src/config.js b/src/config.js
index 2782a0b..0df932e 100644
--- a/src/config.js
+++ b/src/config.js
@@ -1,12 +1,12 @@
import firebase from 'firebase'
-export const appName = 'advreact-1610'
+export const appName = 'react-course-f262b'
firebase.initializeApp({
- apiKey: "AIzaSyB31xpTtp4Jln_hb2kAbE4PGf6Mi8EgLyA",
- authDomain: `${appName}.firebaseapp.com`,
- databaseURL: `https://${appName}.firebaseio.com`,
- projectId: appName,
- storageBucket: "",
- messagingSenderId: "397157634637"
+ authDomain: `${appName}.firebaseapp.com`,
+ databaseURL: `https://${appName}.firebaseio.com`,
+ projectId: appName,
+ apiKey: "AIzaSyAt-smU_1tqNdkj9pmSpVLxqaOjhDwf4dk",
+ storageBucket: "react-course-f262b.appspot.com",
+ messagingSenderId: "447165438476"
})
\ No newline at end of file
diff --git a/src/ducks/people.js b/src/ducks/people.js
new file mode 100644
index 0000000..17038a8
--- /dev/null
+++ b/src/ducks/people.js
@@ -0,0 +1,43 @@
+import {appName} from '../config'
+import {Record, Map} from 'immutable'
+import {reset} from 'redux-form';
+
+/**
+ * Constants
+ * */
+export const moduleName = 'people'
+const prefix = `${appName}/${moduleName}`
+
+export const ADD_PEOPLE_ENTRY = `${prefix}/ADD_PEOPLE`
+
+/**
+ * Reducer
+ * */
+export const ReducerRecord = Record({
+ list: Map()
+})
+
+export default function reducer(state = new ReducerRecord(), action) {
+ const {type, payload} = action
+
+ switch (type) {
+ case ADD_PEOPLE_ENTRY:
+ return state.update('list', list => list.set([payload.entry.firstName], payload.entry))
+
+ default:
+ return state
+ }
+}
+
+/**
+ * Action Creators
+ * */
+export function addPeopleEntry(entry) {
+ return (dispatch) => {
+ dispatch({
+ type: ADD_PEOPLE_ENTRY,
+ payload: {entry}
+ })
+ dispatch(reset('peopleAdd'));
+ }
+}
\ 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