ht 5

src/components/routes/PersonPage.js

@@ -1,6 +1,6 @@
 import React, { Component } from 'react'
 import {connect} from 'react-redux'
-import {addPerson} from '../../ducks/people'
+import {addPerson, cancelPeopleSync} from '../../ducks/people'
 import NewPersonForm from '../people/NewPersonForm'
 import PeopleList from '../people/PeopleList'
 
@@ -9,6 +9,10 @@ class PersonPage extends Component {
 
     };
 
+    componentWillUnmount() {
+      this.props.cancelPeopleSync();
+    }
+
     render() {
         return (
             <div>
@@ -20,4 +24,4 @@ class PersonPage extends Component {
     }
 }
 
-export default connect(null, {addPerson})(PersonPage)
+export default connect(null, {addPerson, cancelPeopleSync})(PersonPage)

src/config.js

@@ -3,10 +3,10 @@ import firebase from 'firebase'
 export const appName = 'advreact-1610'
 
 firebase.initializeApp({
-    apiKey: "AIzaSyB31xpTtp4Jln_hb2kAbE4PGf6Mi8EgLyA",
-    authDomain: `${appName}.firebaseapp.com`,
-    databaseURL: `https://${appName}.firebaseio.com`,
-    projectId: appName,
-    storageBucket: "",
-    messagingSenderId: "397157634637"
+    apiKey: "AIzaSyAVvjbBMLMWUEmCRHUv2eNEkgfS-pEqcMY",
+    authDomain: "adv-react-ad9a1.firebaseapp.com",
+    databaseURL: "https://adv-react-ad9a1.firebaseio.com",
+    projectId: "adv-react-ad9a1",
+    storageBucket: "adv-react-ad9a1.appspot.com",
+    messagingSenderId: "598425030570"
 })

src/ducks/auth.js

@@ -2,7 +2,8 @@ import {appName} from '../config'
 import {Record} from 'immutable'
 import firebase from 'firebase'
 import {createSelector} from 'reselect'
-import {call, put, all, take} from 'redux-saga/effects'
+import {eventChannel} from 'redux-saga'
+import {call, put, all, take, spawn} from 'redux-saga/effects'
 import {replace} from 'react-router-redux'
 
 /**
@@ -69,6 +70,7 @@ export function signIn(email, password) {
     }
 }
 
+/*
 firebase.auth().onAuthStateChanged(user => {
     if (!user) return
 
@@ -77,11 +79,22 @@ firebase.auth().onAuthStateChanged(user => {
         payload: { user }
     })
 })
+*/
 
 /**
  * Sagas
  **/
 
+ export const createAuthSocket = () => eventChannel(emit => {
+    firebase.auth().onAuthStateChanged(user => {
+        if (!user) {
+            return
+        }
+        emit({ user })
+    })
+    return () => {}
+ })
+
 export function * signUpSaga() {
     const auth = firebase.auth()
 
@@ -126,15 +139,30 @@ export const signInSaga = function * () {
     }
 }
 
+export function * authSyncSaga() {
+    const chan = yield call(createAuthSocket)
+
+    while (true) {
+        const { user } = yield take(chan)
+
+        yield put({
+            type: SIGN_IN_SUCCESS,
+            payload: { user }
+        })
+    }
+}
+
 export function * watchStatusChangeSaga() {
     while (true) {
         yield take(SIGN_IN_SUCCESS)
 
-        yield (put(replace('/admin')))
+        yield (put(replace('/people')))
     }
 }
 
 export function * saga() {
+    yield spawn(authSyncSaga)
+
     yield all([
         signUpSaga(),
         signInSaga(),

src/ducks/people.js

@@ -21,6 +21,7 @@ export const FETCH_ALL_SUCCESS = `${prefix}/FETCH_ALL_SUCCESS`
 
 export const ADD_EVENT_REQUEST = `${prefix}/ADD_EVENT_REQUEST`
 export const ADD_EVENT_SUCCESS = `${prefix}/ADD_EVENT_SUCCESS`
+export const CANCEL_PEOPLE_SYNC = `${prefix}/CANCEL_PEOPLE_SYNC`
 
 /**
  * Reducer
@@ -92,6 +93,12 @@ export function addEventToPerson(eventId, personId) {
     }
 }
 
+export function cancelPeopleSync() {
+    return {
+        type: CANCEL_PEOPLE_SYNC,
+    }
+}
+
 /**
  *Sagas
  * */
@@ -183,18 +190,32 @@ const createPeopleSocket = () => eventChannel(emit => {
 export const realtimePeopleSyncSaga = function * () {
     const chan = yield call(createPeopleSocket)
 
-    while (true) {
-        const { data } = yield take(chan)
+    try {
+        while (true) {
+            const { data } = yield take(chan)
 
-        yield put({
-            type: FETCH_ALL_SUCCESS,
-            payload: data.val()
-        })
+            yield put({
+                type: FETCH_ALL_SUCCESS,
+                payload: data.val()
+            })
+        }
+    } finally {
+        if (yield cancelled()) {
+            chan.close()
+        }
+    }
+}
+
+export function * cancelPeopleSyncSaga(peopleSyncTask) {
+    while (true) {
+        yield take(CANCEL_PEOPLE_SYNC)
+        yield cancel(peopleSyncTask)
     }
 }
 
 export function * saga() {
-    yield spawn(realtimePeopleSyncSaga)
+    const realtimeTask = yield spawn(realtimePeopleSyncSaga)
+    yield spawn(cancelPeopleSyncSaga, realtimeTask)
 
     yield all([
         takeEvery(ADD_PERSON_REQUEST, addPersonSaga),