From 44cfa5126ba8c320ca4fe9c30f2bf7f6f7dc2dd3 Mon Sep 17 00:00:00 2001 From: Alexey Vakarchuk Date: Fri, 1 Sep 2017 15:56:02 +0300 Subject: [PATCH 1/2] Add HT2.1 --- src/components/routes/AuthPage.js | 6 +-- src/ducks/auth.js | 67 ++++++++++++++++++++++++------- src/redux/index.js | 8 +++- 3 files changed, 62 insertions(+), 19 deletions(-) diff --git a/src/components/routes/AuthPage.js b/src/components/routes/AuthPage.js index cc9a55f..cbc0d42 100644 --- a/src/components/routes/AuthPage.js +++ b/src/components/routes/AuthPage.js @@ -3,7 +3,7 @@ import SignInForm from '../auth/SignInForm' import SignUpForm from '../auth/SignUpForm' import {Route, NavLink} from 'react-router-dom' import {connect} from 'react-redux' -import {signUp, moduleName} from '../../ducks/auth' +import {signIn, signUp, moduleName} from '../../ducks/auth' import Loader from '../common/Loader' class AuthPage extends Component { @@ -25,10 +25,10 @@ class AuthPage extends Component { ) } - handleSignIn = (values) => console.log('---', values) + handleSignIn = ({email, password}) => this.props.signIn(email, password) handleSignUp = ({email, password}) => this.props.signUp(email, password) } export default connect(state => ({ loading: state[moduleName].loading -}), {signUp})(AuthPage) \ No newline at end of file +}), {signUp, signIn})(AuthPage) \ No newline at end of file diff --git a/src/ducks/auth.js b/src/ducks/auth.js index 6bae0d9..015c3fa 100644 --- a/src/ducks/auth.js +++ b/src/ducks/auth.js @@ -1,8 +1,7 @@ import firebase from 'firebase' import {appName} from '../config' import {Record} from 'immutable' -//import store from '../redux' -import {all, cps, call, put, take, takeEvery} from 'redux-saga/effects' +import {all, call, put, take, takeEvery} from 'redux-saga/effects' import {push} from 'react-router-redux' const ReducerRecord = Record({ @@ -15,7 +14,9 @@ export const moduleName = 'auth' export const SIGN_UP_REQUEST = `${appName}/${moduleName}/SIGN_UP_REQUEST` export const SIGN_UP_SUCCESS = `${appName}/${moduleName}/SIGN_UP_SUCCESS` export const SIGN_UP_ERROR = `${appName}/${moduleName}/SIGN_UP_ERROR` +export const SIGN_IN_REQUEST = `${appName}/${moduleName}/SIGN_IN_REQUEST` export const SIGN_IN_SUCCESS = `${appName}/${moduleName}/SIGN_IN_SUCCESS` +export const SIGN_IN_ERROR = `${appName}/${moduleName}/SIGN_IN_ERROR` export const SIGN_OUT_REQUEST = `${appName}/${moduleName}/SIGN_OUT_REQUEST` export const SIGN_OUT_SUCCESS = `${appName}/${moduleName}/SIGN_OUT_SUCCESS` @@ -24,15 +25,18 @@ export default function reducer(state = new ReducerRecord(), action) { const {type, payload, error} = action switch (type) { + case SIGN_IN_REQUEST: case SIGN_UP_REQUEST: return state.set('loading', true) case SIGN_IN_SUCCESS: + case SIGN_UP_SUCCESS: return state .set('loading', false) .set('user', payload.user) .set('error', null) + case SIGN_IN_ERROR: case SIGN_UP_ERROR: return state .set('loading', false) @@ -46,6 +50,13 @@ export default function reducer(state = new ReducerRecord(), action) { } } +export function signIn(email, password) { + return { + type: SIGN_IN_REQUEST, + payload: {email, password} + } +} + export function signUp(email, password) { return { type: SIGN_UP_REQUEST, @@ -59,6 +70,30 @@ export function signOut() { } } +export const signInSaga = function * () { + const auth = firebase.auth() + + while (true) { + const action = yield take(SIGN_IN_REQUEST) + + try { + const user = yield call( + [auth, auth.signInWithEmailAndPassword], + action.payload.email, action.payload.password + ) + yield put({ + type: SIGN_IN_SUCCESS, + payload: {user} + }) + } catch (error) { + yield put({ + type: SIGN_IN_ERROR, + error + }) + } + } +} + export const signUpSaga = function * () { const auth = firebase.auth() @@ -103,17 +138,20 @@ export function signUp(email, password) { } */ -export const watchStatusChange = function * () { - const auth = firebase.auth() - try { - yield cps([auth, auth.onAuthStateChanged]) - } catch (user) { - yield put({ - type: SIGN_IN_SUCCESS, - payload: {user} - }) - } -} +// export const watchStatusChange = function * () { +// const auth = firebase.auth() +// try { +// yield cps([auth, auth.onAuthStateChanged]) +// } catch (user) { +// yield put({ +// type: SIGN_IN_SUCCESS, +// payload: {user} +// }) +// } +// } + + +// NOTE: We don't need to listen to auth changes if we already dispatching user when he is signing in/up /* firebase.auth().onAuthStateChanged(user => { @@ -142,8 +180,9 @@ export const signOutSaga = function * () { export const saga = function * () { yield all([ + signInSaga(), signUpSaga(), - watchStatusChange(), + // watchStatusChange(), takeEvery(SIGN_OUT_REQUEST, signOutSaga) ]) } \ No newline at end of file diff --git a/src/redux/index.js b/src/redux/index.js index d0ca1dc..7c49715 100644 --- a/src/redux/index.js +++ b/src/redux/index.js @@ -1,4 +1,4 @@ -import {createStore, applyMiddleware} from 'redux' +import {createStore, applyMiddleware, compose} from 'redux' import reducer from './reducer' import logger from 'redux-logger' import {routerMiddleware} from 'react-router-redux' @@ -9,7 +9,11 @@ import rootSaga from './saga' const sagaMiddleware = createSagaMiddleware() const enhancer = applyMiddleware(sagaMiddleware, routerMiddleware(history), logger) -const store = createStore(reducer, enhancer) +const store = createStore(reducer, compose( + enhancer, + window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__() + ) +) window.store = store sagaMiddleware.run(rootSaga) From 7a6c462e0629627af819a57985756b087a43ddb0 Mon Sep 17 00:00:00 2001 From: Alexey Vakarchuk Date: Fri, 1 Sep 2017 16:07:34 +0300 Subject: [PATCH 2/2] Add HT2.3 --- src/components/Root.js | 11 +++++++---- src/ducks/auth.js | 2 ++ src/ducks/people.js | 2 ++ 3 files changed, 11 insertions(+), 4 deletions(-) diff --git a/src/components/Root.js b/src/components/Root.js index b42cf78..a743463 100644 --- a/src/components/Root.js +++ b/src/components/Root.js @@ -15,12 +15,15 @@ class Root extends Component { render() { const {signOut, signedIn} = this.props - const btn = signedIn - ? - : sign in + const controls = signedIn + ? (
+ People + +
) + : Sign in return (
- {btn} + {controls} diff --git a/src/ducks/auth.js b/src/ducks/auth.js index 015c3fa..de5fdff 100644 --- a/src/ducks/auth.js +++ b/src/ducks/auth.js @@ -85,6 +85,7 @@ export const signInSaga = function * () { type: SIGN_IN_SUCCESS, payload: {user} }) + yield put(push('/people')) } catch (error) { yield put({ type: SIGN_IN_ERROR, @@ -109,6 +110,7 @@ export const signUpSaga = function * () { type: SIGN_UP_SUCCESS, payload: {user} }) + yield put(push('/people')) } catch (error) { yield put({ type: SIGN_UP_ERROR, diff --git a/src/ducks/people.js b/src/ducks/people.js index 8e80b5d..5537780 100644 --- a/src/ducks/people.js +++ b/src/ducks/people.js @@ -1,6 +1,7 @@ import {appName} from '../config' import {Record, List} from 'immutable' import {put, call, takeEvery} from 'redux-saga/effects' +import {reset} from 'redux-form' import {generateId} from './utils' const ReducerState = Record({ @@ -46,6 +47,7 @@ export const addPersonSaga = function * (action) { type: ADD_PERSON, payload: {...action.payload, id} }) + yield put(reset('person')) } /*