diff --git a/common/app/routes/Settings/Settings.jsx b/common/app/routes/Settings/Settings.jsx
index 8efa28d7e8..bdb1ceb54c 100644
--- a/common/app/routes/Settings/Settings.jsx
+++ b/common/app/routes/Settings/Settings.jsx
@@ -12,8 +12,9 @@ import SocialSettings from './Social-Settings.jsx';
import EmailSettings from './Email-Setting.jsx';
import LanguageSettings from './Language-Settings.jsx';
import SettingsSkeleton from './Settings-Skeleton.jsx';
+import UpdateEmail from './routes/update-email';
-import { toggleUserFlag } from './redux';
+import { toggleUserFlag, showUpdateEmailViewSelector } from './redux';
import {
toggleNightMode,
updateTitle,
@@ -23,20 +24,10 @@ import {
} from '../../redux';
import ChildContainer from '../../Child-Container.jsx';
-
-const mapDispatchToProps = {
- updateTitle,
- toggleNightMode,
- toggleIsAvailableForHire: () => toggleUserFlag('isAvailableForHire'),
- toggleIsLocked: () => toggleUserFlag('isLocked'),
- toggleQuincyEmail: () => toggleUserFlag('sendQuincyEmail'),
- toggleNotificationEmail: () => toggleUserFlag('sendNotificationEmail'),
- toggleMonthlyEmail: () => toggleUserFlag('sendMonthlyEmail')
-};
-
const mapStateToProps = createSelector(
userSelector,
signInLoadingSelector,
+ showUpdateEmailViewSelector,
(
{
username,
@@ -51,21 +42,33 @@ const mapStateToProps = createSelector(
sendQuincyEmail
},
showLoading,
+ showUpdateEmailView
) => ({
- showLoading,
- username,
email,
isAvailableForHire,
- isLocked,
isGithubCool,
- isTwitter,
isLinkedIn,
+ isLocked,
+ isTwitter,
sendMonthlyEmail,
sendNotificationEmail,
- sendQuincyEmail
+ sendQuincyEmail,
+ showLoading,
+ showUpdateEmailView,
+ username
})
);
+const mapDispatchToProps = {
+ toggleIsAvailableForHire: () => toggleUserFlag('isAvailableForHire'),
+ toggleIsLocked: () => toggleUserFlag('isLocked'),
+ toggleMonthlyEmail: () => toggleUserFlag('sendMonthlyEmail'),
+ toggleNightMode,
+ toggleNotificationEmail: () => toggleUserFlag('sendNotificationEmail'),
+ toggleQuincyEmail: () => toggleUserFlag('sendQuincyEmail'),
+ updateTitle
+};
+
const propTypes = {
children: PropTypes.element,
email: PropTypes.string,
@@ -80,6 +83,7 @@ const propTypes = {
sendNotificationEmail: PropTypes.bool,
sendQuincyEmail: PropTypes.bool,
showLoading: PropTypes.bool,
+ showUpdateEmailView: PropTypes.bool,
toggleIsAvailableForHire: PropTypes.func.isRequired,
toggleIsLocked: PropTypes.func.isRequired,
toggleMonthlyEmail: PropTypes.func.isRequired,
@@ -109,34 +113,30 @@ export class Settings extends React.Component {
render() {
const {
- children,
- username,
- isAvailableForHire,
- isLocked,
- isGithubCool,
- isTwitter,
- isLinkedIn,
- showLoading,
email,
+ isAvailableForHire,
+ isGithubCool,
+ isLinkedIn,
+ isLocked,
+ isTwitter,
sendMonthlyEmail,
sendNotificationEmail,
sendQuincyEmail,
+ showLoading,
+ showUpdateEmailView,
toggleIsAvailableForHire,
- toggleNightMode,
toggleIsLocked,
- toggleQuincyEmail,
toggleMonthlyEmail,
- toggleNotificationEmail
+ toggleNightMode,
+ toggleNotificationEmail,
+ toggleQuincyEmail,
+ username
} = this.props;
if (!username && !showLoading) {
return ;
}
- if (children) {
- return (
-
- { children }
-
- );
+ if (showUpdateEmailView) {
+ return ;
}
return (
diff --git a/common/app/routes/Settings/redux/index.js b/common/app/routes/Settings/redux/index.js
index b2e1bb3d44..fec849ee60 100644
--- a/common/app/routes/Settings/redux/index.js
+++ b/common/app/routes/Settings/redux/index.js
@@ -1,7 +1,8 @@
+import { isLocationAction } from 'redux-first-router';
import {
+ addNS,
createAction,
- createTypes,
- handleActions
+ createTypes
} from 'berkeleys-redux-utils';
import userUpdateEpic from './update-user-epic.js';
@@ -19,6 +20,7 @@ export const types = createTypes([
'onRouteUpdateEmail'
], 'settings');
+
export const onRouteSettings = createAction(types.onRouteSettings);
export const onRouteUpdateEmail = createAction(types.onRouteUpdateEmail);
export const toggleUserFlag = createAction(types.toggleUserFlag);
@@ -33,10 +35,28 @@ const defaultState = {
showUpdateEmailView: false
};
-export default handleActions(
- () => ({
- [types.onRouteSettings]: state => ({ ...state, showUpdateEmailView: true })
- }),
- defaultState,
- ns
+const getNS = state => state[ns];
+export const showUpdateEmailViewSelector =
+ state => getNS(state).showUpdateEmailView;
+
+export default addNS(
+ ns,
+ function settingsRouteReducer(state = defaultState, action) {
+ if (isLocationAction(action)) {
+ const { type } = action;
+ if (type === types.onRouteUpdateEmail) {
+ return {
+ ...state,
+ showUpdateEmailView: true
+ };
+ }
+ if (state.showUpdateEmailView) {
+ return {
+ ...state,
+ showUpdateEmailView: false
+ };
+ }
+ }
+ return state;
+ }
);
diff --git a/common/app/routes/Settings/routes/update-email/index.js b/common/app/routes/Settings/routes/update-email/index.js
index b56a6288c1..7d32d33ebe 100644
--- a/common/app/routes/Settings/routes/update-email/index.js
+++ b/common/app/routes/Settings/routes/update-email/index.js
@@ -1,8 +1 @@
-import UpdateEmail from './Update-Email.jsx';
-
-export default function updateEmailRoute() {
- return [{
- path: 'update-email',
- component: UpdateEmail
- }];
-}
+export { default } from './Update-Email.jsx';