diff --git a/src/components/admin/RegisteredUserForm.js b/src/components/admin/RegisteredUserForm.js new file mode 100644 index 0000000..94206ae --- /dev/null +++ b/src/components/admin/RegisteredUserForm.js @@ -0,0 +1,46 @@ +import React, { Component } from 'react' +import {reduxForm, Field} from 'redux-form' +import emailValidator from 'email-validator' +import ErrorField from '../common/ErrorField' + +class RegisteredUserForm extends Component { + render() { + const {handleSubmit} = this.props + return ( +
+

Add user form

+
+ + + + +
+ +
+ +
+ ) + } +} + +const validate = ({firstName,lastName, email}) => { + //debugger + let errors = {} + const validateName = (param,label)=>{ + + if (!param) errors[label] = `${label} is required` + else if (/^[a-zA-Zа-яА-ЯёЁ]$/.test(param)) errors[label] = `invalid ${label}` + } + if (!email) errors.email = 'email is required' + else if (!emailValidator.validate(email)) errors.email = 'invalid email' + + validateName(lastName,'lastName') + validateName(firstName,'firstName') + return errors +} + + +export default reduxForm({ + form: 'registeredUserForm', + validate +})(RegisteredUserForm) \ No newline at end of file diff --git a/src/components/admin/UserList.js b/src/components/admin/UserList.js new file mode 100644 index 0000000..c665d45 --- /dev/null +++ b/src/components/admin/UserList.js @@ -0,0 +1,20 @@ +import React from 'react' +import {connect} from 'react-redux' +import {moduleName} from '../../ducks/registeredUser' + + +const UserList = (props)=>{ + console.log(props) + const _list = props.users.map( + user=>
  • {user.firstName} /{user.lastName}/ {user.email}
  • ) + return ( +
    +

    User list

    + {_list} +
    + ) +} + +export default connect(store=>({ + users:store[moduleName].users +}))(UserList) \ No newline at end of file diff --git a/src/components/common/ErrorField.js b/src/components/common/ErrorField.js index a4879c1..925999d 100644 --- a/src/components/common/ErrorField.js +++ b/src/components/common/ErrorField.js @@ -12,7 +12,4 @@ function ErrorField(props) { ) } -ErrorField.propTypes = { -} - export default ErrorField \ No newline at end of file diff --git a/src/components/routes/AdminPage.js b/src/components/routes/AdminPage.js index 1c4cb84..9e66f79 100644 --- a/src/components/routes/AdminPage.js +++ b/src/components/routes/AdminPage.js @@ -1,17 +1,24 @@ import React, { Component } from 'react' +import {Route, NavLink} from 'react-router-dom' +import {connect} from 'react-redux' +import {addUser} from '../../ducks/registeredUser' +import RegisteredUserForm from '../admin/RegisteredUserForm' +import UserList from '../admin/UserList' class AdminPage extends Component { - static propTypes = { - - }; render() { return (

    Admin Page

    + Registered user + User list + }/> + }/>
    ) } + handleAddUser=({email, lastName,firstName}) => this.props.addUser(email, lastName,firstName) } -export default AdminPage \ No newline at end of file +export default connect(null, {addUser})(AdminPage) \ No newline at end of file diff --git a/src/config.js b/src/config.js index e8d8d78..6a042e8 100644 --- a/src/config.js +++ b/src/config.js @@ -1,13 +1,15 @@ import firebase from 'firebase' -export const appName = "advreact-21-08" +export const appName = 'advreact-277e8'//"advreact-21-08" export const firebaseConfig = { - apiKey: "AIzaSyDjA6CeIHuni5lNm4ML1b-TSxJltsYUO8g", + //apiKey: "AIzaSyDjA6CeIHuni5lNm4ML1b-TSxJltsYUO8g", + apiKey: "AIzaSyCw2LF9saF-AiDhbN464gWERWR35m5qm0Q", authDomain: `${appName}.firebaseapp.com`, databaseURL: `https://${appName}.firebaseio.com`, projectId: appName, storageBucket: `${appName}.appspot.com`, - messagingSenderId: "789814589283" + //messagingSenderId: "789814589283" + messagingSenderId: "313050002315" } firebase.initializeApp(firebaseConfig) \ No newline at end of file diff --git a/src/ducks/registeredUser.js b/src/ducks/registeredUser.js new file mode 100644 index 0000000..7cfbd7e --- /dev/null +++ b/src/ducks/registeredUser.js @@ -0,0 +1,35 @@ +import {appName} from '../config' +import {Record} from 'immutable' + +const ReducerRecord = Record({ + users: [], + loading: false +}) + +export const moduleName = 'registeredUser' +export const CHANGE_USERS_LIST = `${appName}/${moduleName}/CHANGE_USERS_LIST` + +//console.log('---', ReducerRecord) +export default function reducer(state = new ReducerRecord(), action) { + const {type, payload} = action + + switch (type) { + case CHANGE_USERS_LIST: + return state + .set('users', payload) + default: + return state + } +} + +export function addUser(email, lastName,firstName) { + + return (dispatch,getState) => { + let _users=[...getState()[moduleName].users] + _users.push({email,lastName,firstName}) + dispatch({ + type: CHANGE_USERS_LIST, + payload:_users + }) + } +} diff --git a/src/redux/reducer.js b/src/redux/reducer.js index 34143fe..adfb338 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 registeredUser, {moduleName as registeredUserModule} from '../ducks/registeredUser' export default combineReducers({ router, form, - [authModule]: authReducer + [authModule]: authReducer, + [registeredUserModule]:registeredUser }) \ No newline at end of file