From 13965e11113a073c25315f16fa47af66dfe4d1b7 Mon Sep 17 00:00:00 2001 From: Belen Curcio Date: Wed, 19 Apr 2017 17:04:49 -0300 Subject: [PATCH 01/12] Adding actions, routes and login popup --- client/coral-admin/src/AppRouter.js | 3 +++ client/coral-embed-stream/src/AppRouter.js | 16 +++++++++++++++ client/coral-embed-stream/src/Embed.js | 20 ++++++++++++++----- client/coral-embed-stream/src/index.js | 4 ++-- client/coral-framework/actions/auth.js | 10 ++++++++++ .../containers/SignInContainer.js | 11 +++++----- 6 files changed, 51 insertions(+), 13 deletions(-) create mode 100644 client/coral-embed-stream/src/AppRouter.js diff --git a/client/coral-admin/src/AppRouter.js b/client/coral-admin/src/AppRouter.js index 2bd59b79d..2c0a3b9c5 100644 --- a/client/coral-admin/src/AppRouter.js +++ b/client/coral-admin/src/AppRouter.js @@ -14,6 +14,8 @@ import ModerationContainer from 'containers/ModerationQueue/ModerationContainer' import Dashboard from 'containers/Dashboard/Dashboard'; +import SignInContainer from 'coral-sign-in/containers/SignInContainer'; + const routes = (
@@ -24,6 +26,7 @@ const routes = ( + {/* Community Routes */} diff --git a/client/coral-embed-stream/src/AppRouter.js b/client/coral-embed-stream/src/AppRouter.js new file mode 100644 index 000000000..133a3790d --- /dev/null +++ b/client/coral-embed-stream/src/AppRouter.js @@ -0,0 +1,16 @@ +import React from 'react'; +import {Router, Route, browserHistory} from 'react-router'; + +import Embed from './Embed'; +import SignInContainer from 'coral-sign-in/containers/SignInContainer'; + +const routes = ( +
+ + +
+); + +const AppRouter = () => ; + +export default AppRouter; diff --git a/client/coral-embed-stream/src/Embed.js b/client/coral-embed-stream/src/Embed.js index b67e9e1c4..d864025e5 100644 --- a/client/coral-embed-stream/src/Embed.js +++ b/client/coral-embed-stream/src/Embed.js @@ -8,7 +8,7 @@ const lang = new I18n(translations); import {TabBar, Tab, TabContent, Spinner, Button} from 'coral-ui'; -const {logout, showSignInDialog, requestConfirmEmail} = authActions; +const {logout, showSignInDialog, requestConfirmEmail, signInPopUp} = authActions; const {addNotification, clearNotification} = notificationActions; const {fetchAssetSuccess} = assetActions; import {NEW_COMMENT_COUNT_POLL_INTERVAL} from 'coral-framework/constants/comments'; @@ -126,6 +126,16 @@ class Embed extends React.Component { } } + runPopUpLogin = () => { + // const newwindow = window.open( + // 'http://localhost:3000/embed/stream/login','Login','height=420,width=310,top=200,left=500'); + // if (window.focus) { + // newwindow.focus(); + // } + // return false; + this.props.signInPopUp(); + } + render () { const {activeTab} = this.state; const {closedAt, countCache = {}} = this.props.asset; @@ -218,10 +228,9 @@ class Embed extends React.Component {
:

{asset.settings.closedMessage}

} - {!loggedIn && } + + + {loggedIn && user && } {loggedIn && } @@ -324,6 +333,7 @@ const mapDispatchToProps = dispatch => ({ updateCountCache: (id, count) => dispatch(updateCountCache(id, count)), viewAllComments: () => dispatch(viewAllComments()), logout: () => dispatch(logout()), + signInPopUp: () => dispatch(signInPopUp()), dispatch: d => dispatch(d), }); diff --git a/client/coral-embed-stream/src/index.js b/client/coral-embed-stream/src/index.js index 3dc69400c..15bb959fc 100644 --- a/client/coral-embed-stream/src/index.js +++ b/client/coral-embed-stream/src/index.js @@ -5,11 +5,11 @@ import {ApolloProvider} from 'react-apollo'; import {client} from 'coral-framework/services/client'; import store from 'coral-framework/services/store'; -import Embed from './Embed'; +import AppRouter from './AppRouter'; render( - + , document.querySelector('#coralStream') ); diff --git a/client/coral-framework/actions/auth.js b/client/coral-framework/actions/auth.js index 11e7bd996..dd90f6422 100644 --- a/client/coral-framework/actions/auth.js +++ b/client/coral-framework/actions/auth.js @@ -83,6 +83,16 @@ export const fetchSignIn = (formData) => (dispatch) => { }); }; +// Sign In - Standalone PopUp + +export const signInPopUp = () => () => { + window.open( + '/embed/stream/login', + 'Login', + 'menubar=0,resizable=0,width=500,height=500,top=200,left=500' + ); +}; + // Sign In - Facebook const signInFacebookRequest = () => ({type: actions.FETCH_SIGNIN_FACEBOOK_REQUEST}); diff --git a/client/coral-sign-in/containers/SignInContainer.js b/client/coral-sign-in/containers/SignInContainer.js index 0ef2b42b4..01a03e49c 100644 --- a/client/coral-sign-in/containers/SignInContainer.js +++ b/client/coral-sign-in/containers/SignInContainer.js @@ -147,8 +147,7 @@ class SignInContainer extends Component { handleSignIn(e) { e.preventDefault(); - this.props.fetchSignIn(this.state.formData) - .then(this.props.refetch); + this.props.fetchSignIn(this.state.formData); } render() { @@ -157,11 +156,11 @@ class SignInContainer extends Component { return (
- {!noButton && } + {/*{!noButton && }*/} Date: Wed, 19 Apr 2017 18:10:09 -0300 Subject: [PATCH 02/12] Sign up popup --- client/coral-embed-stream/src/Embed.js | 28 ++++++++-------- client/coral-framework/actions/auth.js | 17 +++++----- .../coral-settings/components/NotLoggedIn.js | 7 ++-- .../containers/ProfileContainer.js | 32 ++++++++++++------- .../containers/SignInContainer.js | 3 -- 5 files changed, 46 insertions(+), 41 deletions(-) diff --git a/client/coral-embed-stream/src/Embed.js b/client/coral-embed-stream/src/Embed.js index d864025e5..62a33982d 100644 --- a/client/coral-embed-stream/src/Embed.js +++ b/client/coral-embed-stream/src/Embed.js @@ -8,7 +8,7 @@ const lang = new I18n(translations); import {TabBar, Tab, TabContent, Spinner, Button} from 'coral-ui'; -const {logout, showSignInDialog, requestConfirmEmail, signInPopUp} = authActions; +const {logout, showSignInDialog, requestConfirmEmail, openSignInPopUp, checkLogin} = authActions; const {addNotification, clearNotification} = notificationActions; const {fetchAssetSuccess} = assetActions; import {NEW_COMMENT_COUNT_POLL_INTERVAL} from 'coral-framework/constants/comments'; @@ -26,7 +26,6 @@ import {ModerationLink} from 'coral-plugin-moderation'; import Count from 'coral-plugin-comment-count/CommentCount'; import CommentBox from 'coral-plugin-commentbox/CommentBox'; import UserBox from 'coral-sign-in/components/UserBox'; -import SignInContainer from 'coral-sign-in/containers/SignInContainer'; import SuspendedAccount from 'coral-framework/components/SuspendedAccount'; import ChangeUsernameContainer from '../../coral-sign-in/containers/ChangeUsernameContainer'; import ProfileContainer from 'coral-settings/containers/ProfileContainer'; @@ -78,6 +77,7 @@ class Embed extends React.Component { componentDidMount () { pym.sendMessage('childReady'); + this.props.checkLogin(); } componentWillUnmount () { @@ -126,14 +126,14 @@ class Embed extends React.Component { } } - runPopUpLogin = () => { - // const newwindow = window.open( - // 'http://localhost:3000/embed/stream/login','Login','height=420,width=310,top=200,left=500'); - // if (window.focus) { - // newwindow.focus(); - // } - // return false; - this.props.signInPopUp(); + signIn = () => { + const {refetch} = this.props.data; + const {openSignInPopUp, checkLogin} = this.props; + + openSignInPopUp(() => { + checkLogin(); + refetch(); + }); } render () { @@ -229,9 +229,9 @@ class Embed extends React.Component { :

{asset.settings.closedMessage}

} - + {!loggedIn && } - {loggedIn && user && } + {loggedIn && user && } {loggedIn && } {/* the highlightedComment is isolated after the user followed a permalink */} @@ -299,7 +299,6 @@ class Embed extends React.Component { @@ -333,7 +332,8 @@ const mapDispatchToProps = dispatch => ({ updateCountCache: (id, count) => dispatch(updateCountCache(id, count)), viewAllComments: () => dispatch(viewAllComments()), logout: () => dispatch(logout()), - signInPopUp: () => dispatch(signInPopUp()), + openSignInPopUp: cb => dispatch(openSignInPopUp(cb)), + checkLogin: () => dispatch(checkLogin()), dispatch: d => dispatch(d), }); diff --git a/client/coral-framework/actions/auth.js b/client/coral-framework/actions/auth.js index dd90f6422..7fcbefd36 100644 --- a/client/coral-framework/actions/auth.js +++ b/client/coral-framework/actions/auth.js @@ -64,12 +64,7 @@ const signInFailure = error => ({type: actions.FETCH_SIGNIN_FAILURE, error}); export const fetchSignIn = (formData) => (dispatch) => { dispatch(signInRequest()); return coralApi('/auth/local', {method: 'POST', body: formData}) - .then(({user}) => { - const isAdmin = !!user && !!user.roles.filter(i => i === 'ADMIN').length; - dispatch(signInSuccess(user, isAdmin)); - dispatch(hideSignInDialog()); - fetchMe(); - }) + .then(() => dispatch(closeSignInPopUp())) .catch(error => { if (error.metadata) { @@ -85,12 +80,18 @@ export const fetchSignIn = (formData) => (dispatch) => { // Sign In - Standalone PopUp -export const signInPopUp = () => () => { - window.open( +export const openSignInPopUp = cb => () => { + const signInPopUp = window.open( '/embed/stream/login', 'Login', 'menubar=0,resizable=0,width=500,height=500,top=200,left=500' ); + + signInPopUp.onbeforeunload = cb; +}; + +export const closeSignInPopUp = () => () => { + window.close(); }; // Sign In - Facebook diff --git a/client/coral-settings/components/NotLoggedIn.js b/client/coral-settings/components/NotLoggedIn.js index c76553c50..4dfd49555 100644 --- a/client/coral-settings/components/NotLoggedIn.js +++ b/client/coral-settings/components/NotLoggedIn.js @@ -5,13 +5,10 @@ import translations from '../translations'; import I18n from 'coral-framework/modules/i18n/i18n'; const lang = new I18n(translations); -export default ({showSignInDialog, requireEmailConfirmation}) => ( +export default ({signIn}) => (
-
- { - showSignInDialog(); - }}>{lang.t('signIn')} {lang.t('toAccess')} + {lang.t('signIn')} {lang.t('toAccess')}
{lang.t('fromSettingsPage')} diff --git a/client/coral-settings/containers/ProfileContainer.js b/client/coral-settings/containers/ProfileContainer.js index 2d756077d..7a26ed13e 100644 --- a/client/coral-settings/containers/ProfileContainer.js +++ b/client/coral-settings/containers/ProfileContainer.js @@ -2,6 +2,7 @@ import {connect} from 'react-redux'; import {compose} from 'react-apollo'; import React, {Component} from 'react'; import I18n from 'coral-framework/modules/i18n/i18n'; +import {bindActionCreators} from 'redux'; import {myCommentHistory, myIgnoredUsers} from 'coral-framework/graphql/queries'; import {stopIgnoringUser} from 'coral-framework/graphql/mutations'; @@ -12,6 +13,8 @@ import IgnoredUsers from '../components/IgnoredUsers'; import {Spinner} from 'coral-ui'; import CommentHistory from 'coral-plugin-history/CommentHistory'; +import {openSignInPopUp, checkLogin} from 'coral-framework/actions/auth'; + import translations from '../translations'; const lang = new I18n(translations); @@ -31,18 +34,28 @@ class ProfileContainer extends Component { }); } - render() { - const {loggedIn, asset, showSignInDialog, data, myIgnoredUsersData, stopIgnoringUser} = this.props; - const {me} = this.props.data; + signIn = () => { + const {refetch} = this.props.data; + const {openSignInPopUp, checkLogin} = this.props; - if (!loggedIn || !me) { - return ; - } + openSignInPopUp(() => { + checkLogin(); + refetch(); + }); + } + + render() { + const {loggedIn, asset, data, myIgnoredUsersData, stopIgnoringUser} = this.props; + const {me} = this.props.data; if (data.loading) { return ; } + if (!loggedIn || !me) { + return ; + } + const localProfile = this.props.user.profiles.find(p => p.provider === 'local'); const emailAddress = localProfile && localProfile.id; @@ -81,7 +94,6 @@ class ProfileContainer extends Component { :

{lang.t('userNoComment')}

} -
); } @@ -93,10 +105,8 @@ const mapStateToProps = state => ({ auth: state.auth.toJS() }); -const mapDispatchToProps = () => ({ - - // saveBio: (user_id, formData) => dispatch(saveBio(user_id, formData)) -}); +const mapDispatchToProps = dispatch => + bindActionCreators({openSignInPopUp, checkLogin}, dispatch); export default compose( connect(mapStateToProps, mapDispatchToProps), diff --git a/client/coral-sign-in/containers/SignInContainer.js b/client/coral-sign-in/containers/SignInContainer.js index 01a03e49c..5d8c828ae 100644 --- a/client/coral-sign-in/containers/SignInContainer.js +++ b/client/coral-sign-in/containers/SignInContainer.js @@ -156,9 +156,6 @@ class SignInContainer extends Component { return (
- {/*{!noButton && }*/} Date: Thu, 20 Apr 2017 18:45:55 +0700 Subject: [PATCH 03/12] Fix crashing admin when using framework --- client/coral-embed-stream/src/Comment.js | 2 +- client/coral-framework/index.js | 4 ---- client/coral-plugin-commentbox/CommentBox.js | 2 +- 3 files changed, 2 insertions(+), 6 deletions(-) diff --git a/client/coral-embed-stream/src/Comment.js b/client/coral-embed-stream/src/Comment.js index 4a75a19cb..824008b2d 100644 --- a/client/coral-embed-stream/src/Comment.js +++ b/client/coral-embed-stream/src/Comment.js @@ -19,7 +19,7 @@ import FlagComment from 'coral-plugin-flags/FlagComment'; import LikeButton from 'coral-plugin-likes/LikeButton'; import {BestButton, IfUserCanModifyBest, BEST_TAG, commentIsBest, BestIndicator} from 'coral-plugin-best/BestButton'; import LoadMore from 'coral-embed-stream/src/LoadMore'; -import {Slot} from 'coral-framework'; +import Slot from 'coral-framework/components/Slot'; import IgnoredCommentTombstone from './IgnoredCommentTombstone'; import {TopRightMenu} from './TopRightMenu'; diff --git a/client/coral-framework/index.js b/client/coral-framework/index.js index 96750bffd..b85b69bcd 100644 --- a/client/coral-framework/index.js +++ b/client/coral-framework/index.js @@ -1,16 +1,12 @@ -import store from './services/store'; import pym from './services/PymConnection'; import I18n from './modules/i18n/i18n'; import actions from './actions'; -import Slot from './components/Slot'; // TODO (bc): Deprecate old actions. Spreading actions is now needed. export default { pym, - Slot, I18n, - store, actions, ...actions }; diff --git a/client/coral-plugin-commentbox/CommentBox.js b/client/coral-plugin-commentbox/CommentBox.js index f395b56c9..2a988711d 100644 --- a/client/coral-plugin-commentbox/CommentBox.js +++ b/client/coral-plugin-commentbox/CommentBox.js @@ -2,7 +2,7 @@ import React, {Component, PropTypes} from 'react'; import {I18n} from '../coral-framework'; import translations from './translations.json'; import {Button} from 'coral-ui'; -import {Slot} from 'coral-framework'; +import Slot from 'coral-framework/components/Slot'; import {connect} from 'react-redux'; const name = 'coral-plugin-commentbox'; From 1b95fbd8525b3722a8e2eb3aa96a635973c7b3f3 Mon Sep 17 00:00:00 2001 From: Chi Vinh Le Date: Thu, 20 Apr 2017 20:34:36 +0700 Subject: [PATCH 04/12] Remove SignInContainer from admin --- client/coral-admin/src/AppRouter.js | 3 --- 1 file changed, 3 deletions(-) diff --git a/client/coral-admin/src/AppRouter.js b/client/coral-admin/src/AppRouter.js index 2c0a3b9c5..2bd59b79d 100644 --- a/client/coral-admin/src/AppRouter.js +++ b/client/coral-admin/src/AppRouter.js @@ -14,8 +14,6 @@ import ModerationContainer from 'containers/ModerationQueue/ModerationContainer' import Dashboard from 'containers/Dashboard/Dashboard'; -import SignInContainer from 'coral-sign-in/containers/SignInContainer'; - const routes = (
@@ -26,7 +24,6 @@ const routes = ( - {/* Community Routes */} From 348c01ae80dc1c4ce1c33843de1fe530f10b8096 Mon Sep 17 00:00:00 2001 From: Chi Vinh Le Date: Thu, 20 Apr 2017 20:58:45 +0700 Subject: [PATCH 05/12] Fix linting errors --- client/coral-framework/actions/auth.js | 5 ++++- client/coral-settings/components/NotLoggedIn.js | 1 - client/coral-sign-in/containers/SignInContainer.js | 5 +---- 3 files changed, 5 insertions(+), 6 deletions(-) diff --git a/client/coral-framework/actions/auth.js b/client/coral-framework/actions/auth.js index 7fcbefd36..0ec40d903 100644 --- a/client/coral-framework/actions/auth.js +++ b/client/coral-framework/actions/auth.js @@ -58,7 +58,10 @@ export const cleanState = () => ({type: actions.CLEAN_STATE}); // Sign In Actions const signInRequest = () => ({type: actions.FETCH_SIGNIN_REQUEST}); -const signInSuccess = (user, isAdmin) => ({type: actions.FETCH_SIGNIN_SUCCESS, user, isAdmin}); + +// TODO: revisit login redux flow. +// const signInSuccess = (user, isAdmin) => ({type: actions.FETCH_SIGNIN_SUCCESS, user, isAdmin}); +// const signInFailure = error => ({type: actions.FETCH_SIGNIN_FAILURE, error}); export const fetchSignIn = (formData) => (dispatch) => { diff --git a/client/coral-settings/components/NotLoggedIn.js b/client/coral-settings/components/NotLoggedIn.js index 4dfd49555..9fc43758e 100644 --- a/client/coral-settings/components/NotLoggedIn.js +++ b/client/coral-settings/components/NotLoggedIn.js @@ -1,6 +1,5 @@ import React from 'react'; import styles from './NotLoggedIn.css'; -import SignInContainer from '../../coral-sign-in/containers/SignInContainer'; import translations from '../translations'; import I18n from 'coral-framework/modules/i18n/i18n'; const lang = new I18n(translations); diff --git a/client/coral-sign-in/containers/SignInContainer.js b/client/coral-sign-in/containers/SignInContainer.js index 5d8c828ae..52a5e7d01 100644 --- a/client/coral-sign-in/containers/SignInContainer.js +++ b/client/coral-sign-in/containers/SignInContainer.js @@ -1,7 +1,6 @@ import React, {Component, PropTypes} from 'react'; import {connect} from 'react-redux'; import SignDialog from '../components/SignDialog'; -import Button from 'coral-ui/components/Button'; import validate from 'coral-framework/helpers/validate'; import errorMsj from 'coral-framework/helpers/error'; import I18n from 'coral-framework/modules/i18n/i18n'; @@ -13,7 +12,6 @@ import { changeView, fetchSignUp, fetchSignIn, - showSignInDialog, hideSignInDialog, fetchSignInFacebook, fetchSignUpFacebook, @@ -151,7 +149,7 @@ class SignInContainer extends Component { } render() { - const {auth, showSignInDialog, noButton, offset, requireEmailConfirmation} = this.props; + const {auth, offset, requireEmailConfirmation} = this.props; const {emailVerificationLoading, emailVerificationSuccess} = auth; return ( @@ -185,7 +183,6 @@ const mapDispatchToProps = dispatch => ({ fetchSignUpFacebook: () => dispatch(fetchSignUpFacebook()), fetchForgotPassword: formData => dispatch(fetchForgotPassword(formData)), requestConfirmEmail: (email, url) => dispatch(requestConfirmEmail(email, url)), - showSignInDialog: () => dispatch(showSignInDialog()), changeView: view => dispatch(changeView(view)), handleClose: () => dispatch(hideSignInDialog()), invalidForm: error => dispatch(invalidForm(error)), From b12d4ef4a21af033ff28de1c7105dabd2694e905 Mon Sep 17 00:00:00 2001 From: Chi Vinh Le Date: Thu, 20 Apr 2017 21:30:24 +0700 Subject: [PATCH 06/12] WIP --- client/coral-embed-stream/src/Embed.js | 12 +----------- client/coral-framework/actions/auth.js | 26 +++++++++++++++++++++++--- 2 files changed, 24 insertions(+), 14 deletions(-) diff --git a/client/coral-embed-stream/src/Embed.js b/client/coral-embed-stream/src/Embed.js index 62a33982d..8335d38d2 100644 --- a/client/coral-embed-stream/src/Embed.js +++ b/client/coral-embed-stream/src/Embed.js @@ -126,16 +126,6 @@ class Embed extends React.Component { } } - signIn = () => { - const {refetch} = this.props.data; - const {openSignInPopUp, checkLogin} = this.props; - - openSignInPopUp(() => { - checkLogin(); - refetch(); - }); - } - render () { const {activeTab} = this.state; const {closedAt, countCache = {}} = this.props.asset; @@ -229,7 +219,7 @@ class Embed extends React.Component { :

{asset.settings.closedMessage}

} - {!loggedIn && } + {!loggedIn && } {loggedIn && user && } {loggedIn && } diff --git a/client/coral-framework/actions/auth.js b/client/coral-framework/actions/auth.js index 0ec40d903..199c98534 100644 --- a/client/coral-framework/actions/auth.js +++ b/client/coral-framework/actions/auth.js @@ -22,8 +22,20 @@ function fetchMe() { } // Dialog Actions -export const showSignInDialog = (offset = 0) => ({type: actions.SHOW_SIGNIN_DIALOG, offset}); -export const hideSignInDialog = () => ({type: actions.HIDE_SIGNIN_DIALOG}); +export const showSignInDialog = () => dispatch => { + const signInPopUp = window.open( + '/embed/stream/login', + 'Login', + 'menubar=0,resizable=0,width=500,height=500,top=200,left=500' + ); + + signInPopUp.onbeforeunload = fetchMe; + // ({type: actions.SHOW_SIGNIN_DIALOG, offset}) +}; +export const hideSignInDialog = () => dispatch => { + window.close(); + // ({type: actions.HIDE_SIGNIN_DIALOG}); +} export const createUsernameRequest = () => ({type: actions.CREATE_USERNAME_REQUEST}); export const showCreateUsernameDialog = () => ({type: actions.SHOW_CREATEUSERNAME_DIALOG}); @@ -47,11 +59,19 @@ export const createUsername = (userId, formData) => dispatch => { }); }; -export const changeView = view => dispatch => +export const changeView = view => dispatch => { + switch(view) { + case 'SIGNUP': + window.resizeTo(500, 700); + break; + default: + window.resizeTo(500, 500); + } dispatch({ type: actions.CHANGE_VIEW, view }); +}; export const cleanState = () => ({type: actions.CLEAN_STATE}); From 5b7750f7a5c645ba4d562e4c37d0ca8b0e3dbd5c Mon Sep 17 00:00:00 2001 From: Chi Vinh Le Date: Thu, 20 Apr 2017 23:48:30 +0700 Subject: [PATCH 07/12] Reuse same store and action flows --- client/coral-embed-stream/src/Embed.js | 2 +- client/coral-embed-stream/src/index.js | 4 ++- client/coral-framework/actions/auth.js | 40 +++++++++--------------- client/coral-framework/reducers/auth.js | 3 +- client/coral-framework/services/store.js | 5 ++- 5 files changed, 24 insertions(+), 30 deletions(-) diff --git a/client/coral-embed-stream/src/Embed.js b/client/coral-embed-stream/src/Embed.js index 8335d38d2..a2bd50980 100644 --- a/client/coral-embed-stream/src/Embed.js +++ b/client/coral-embed-stream/src/Embed.js @@ -219,7 +219,7 @@ class Embed extends React.Component { :

{asset.settings.closedMessage}

} - {!loggedIn && } + {!loggedIn && } {loggedIn && user && } {loggedIn && } diff --git a/client/coral-embed-stream/src/index.js b/client/coral-embed-stream/src/index.js index 15bb959fc..d7ee99e73 100644 --- a/client/coral-embed-stream/src/index.js +++ b/client/coral-embed-stream/src/index.js @@ -3,10 +3,12 @@ import {render} from 'react-dom'; import {ApolloProvider} from 'react-apollo'; import {client} from 'coral-framework/services/client'; -import store from 'coral-framework/services/store'; +import localStore from 'coral-framework/services/store'; import AppRouter from './AppRouter'; +const store = (window.opener && window.opener.coralStore) ? window.opener.coralStore : localStore; + render( diff --git a/client/coral-framework/actions/auth.js b/client/coral-framework/actions/auth.js index 199c98534..916f93540 100644 --- a/client/coral-framework/actions/auth.js +++ b/client/coral-framework/actions/auth.js @@ -26,16 +26,19 @@ export const showSignInDialog = () => dispatch => { const signInPopUp = window.open( '/embed/stream/login', 'Login', - 'menubar=0,resizable=0,width=500,height=500,top=200,left=500' + 'menubar=0,resizable=0,width=500,height=550,top=200,left=500' ); - signInPopUp.onbeforeunload = fetchMe; - // ({type: actions.SHOW_SIGNIN_DIALOG, offset}) + signInPopUp.onbeforeunload = () => { + dispatch(checkLogin()); + fetchMe(); + }; + dispatch({type: actions.SHOW_SIGNIN_DIALOG}); }; export const hideSignInDialog = () => dispatch => { + dispatch({type: actions.HIDE_SIGNIN_DIALOG}); window.close(); - // ({type: actions.HIDE_SIGNIN_DIALOG}); -} +}; export const createUsernameRequest = () => ({type: actions.CREATE_USERNAME_REQUEST}); export const showCreateUsernameDialog = () => ({type: actions.SHOW_CREATEUSERNAME_DIALOG}); @@ -62,10 +65,13 @@ export const createUsername = (userId, formData) => dispatch => { export const changeView = view => dispatch => { switch(view) { case 'SIGNUP': - window.resizeTo(500, 700); + window.resizeTo(500, 800); + break; + case 'FORGOT': + window.resizeTo(500, 400); break; default: - window.resizeTo(500, 500); + window.resizeTo(500, 550); } dispatch({ type: actions.CHANGE_VIEW, @@ -87,7 +93,7 @@ const signInFailure = error => ({type: actions.FETCH_SIGNIN_FAILURE, error}); export const fetchSignIn = (formData) => (dispatch) => { dispatch(signInRequest()); return coralApi('/auth/local', {method: 'POST', body: formData}) - .then(() => dispatch(closeSignInPopUp())) + .then(() => dispatch(hideSignInDialog())) .catch(error => { if (error.metadata) { @@ -101,22 +107,6 @@ export const fetchSignIn = (formData) => (dispatch) => { }); }; -// Sign In - Standalone PopUp - -export const openSignInPopUp = cb => () => { - const signInPopUp = window.open( - '/embed/stream/login', - 'Login', - 'menubar=0,resizable=0,width=500,height=500,top=200,left=500' - ); - - signInPopUp.onbeforeunload = cb; -}; - -export const closeSignInPopUp = () => () => { - window.close(); -}; - // Sign In - Facebook const signInFacebookRequest = () => ({type: actions.FETCH_SIGNIN_FACEBOOK_REQUEST}); @@ -155,7 +145,7 @@ export const facebookCallback = (err, data) => dispatch => { dispatch(signInFacebookSuccess(user)); dispatch(hideSignInDialog()); dispatch(showCreateUsernameDialog()); - fetchMe(); + dispatch(hideSignInDialog()); } catch (err) { dispatch(signInFacebookFailure(err)); return; diff --git a/client/coral-framework/reducers/auth.js b/client/coral-framework/reducers/auth.js index f9712c937..6e678cab9 100644 --- a/client/coral-framework/reducers/auth.js +++ b/client/coral-framework/reducers/auth.js @@ -28,8 +28,7 @@ export default function auth (state = initialState, action) { switch (action.type) { case actions.SHOW_SIGNIN_DIALOG : return state - .set('showSignInDialog', true) - .set('signInOffset', action.offset); + .set('showSignInDialog', true); case actions.HIDE_SIGNIN_DIALOG : return state.merge(Map({ isLoading: false, diff --git a/client/coral-framework/services/store.js b/client/coral-framework/services/store.js index fbc444eec..d7090f4b5 100644 --- a/client/coral-framework/services/store.js +++ b/client/coral-framework/services/store.js @@ -24,7 +24,7 @@ if (window.devToolsExtension) { middlewares.push(window.devToolsExtension()); } -export default createStore( +const store = createStore( combineReducers({ ...mainReducer, apollo: client.reducer() @@ -32,3 +32,6 @@ export default createStore( {}, compose(...middlewares) ); + +export default store; +window.coralStore = store; From c47047c3ff9a7bbb602733bdc3a9f3b626030ff6 Mon Sep 17 00:00:00 2001 From: Belen Curcio Date: Thu, 20 Apr 2017 14:23:44 -0300 Subject: [PATCH 08/12] Classes --- client/coral-sign-in/components/SignInContent.js | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/client/coral-sign-in/components/SignInContent.js b/client/coral-sign-in/components/SignInContent.js index a0ed5b5b4..b057e57bd 100644 --- a/client/coral-sign-in/components/SignInContent.js +++ b/client/coral-sign-in/components/SignInContent.js @@ -20,8 +20,8 @@ const SignInContent = ({ }) => { return ( -
-
+
+

{auth.emailVerificationFailure ? lang.t('signIn.emailVerifyCTA') : lang.t('signIn.signIn')}

@@ -42,7 +42,7 @@ const SignInContent = ({ {emailVerificationSuccess && } :
-
+
@@ -80,7 +80,7 @@ const SignInContent = ({
} -
+
changeView('FORGOT')}>{lang.t('signIn.forgotYourPass')} {lang.t('signIn.needAnAccount')} From f3f1cc53fe7cf54374836a61bce3add19574d9e2 Mon Sep 17 00:00:00 2001 From: Chi Vinh Le Date: Fri, 21 Apr 2017 00:27:26 +0700 Subject: [PATCH 09/12] Fix safari popup resizing --- client/coral-framework/actions/auth.js | 9 +++++---- 1 file changed, 5 insertions(+), 4 deletions(-) diff --git a/client/coral-framework/actions/auth.js b/client/coral-framework/actions/auth.js index 916f93540..b2080b3b4 100644 --- a/client/coral-framework/actions/auth.js +++ b/client/coral-framework/actions/auth.js @@ -63,6 +63,11 @@ export const createUsername = (userId, formData) => dispatch => { }; export const changeView = view => dispatch => { + dispatch({ + type: actions.CHANGE_VIEW, + view + }); + switch(view) { case 'SIGNUP': window.resizeTo(500, 800); @@ -73,10 +78,6 @@ export const changeView = view => dispatch => { default: window.resizeTo(500, 550); } - dispatch({ - type: actions.CHANGE_VIEW, - view - }); }; export const cleanState = () => ({type: actions.CLEAN_STATE}); From 6df2103da3711bb596a36b72c834f1eaa50e9d26 Mon Sep 17 00:00:00 2001 From: Chi Vinh Le Date: Fri, 21 Apr 2017 00:45:00 +0700 Subject: [PATCH 10/12] Remove obsolete offset and styling --- client/coral-embed-stream/src/Embed.js | 9 ++++----- client/coral-plugin-flags/FlagButton.js | 3 +-- client/coral-plugin-likes/LikeButton.js | 3 +-- client/coral-sign-in/components/CreateUsernameDialog.js | 8 ++------ client/coral-sign-in/components/SignDialog.js | 8 ++------ .../coral-sign-in/containers/ChangeUsernameContainer.js | 3 +-- client/coral-sign-in/containers/SignInContainer.js | 3 +-- .../client/components/RespectButton.js | 3 +-- 8 files changed, 13 insertions(+), 27 deletions(-) diff --git a/client/coral-embed-stream/src/Embed.js b/client/coral-embed-stream/src/Embed.js index a2bd50980..c7c204288 100644 --- a/client/coral-embed-stream/src/Embed.js +++ b/client/coral-embed-stream/src/Embed.js @@ -119,8 +119,7 @@ class Embed extends React.Component { setActiveReplyBox = (reactKey) => { if (!this.props.auth.user) { - const offset = document.getElementById(`c_${reactKey}`).getBoundingClientRect().top - 75; - this.props.showSignInDialog(offset); + this.props.showSignInDialog(); } else { this.setState({activeReplyBox: reactKey}); } @@ -130,7 +129,7 @@ class Embed extends React.Component { const {activeTab} = this.state; const {closedAt, countCache = {}} = this.props.asset; const {asset, refetch, comment} = this.props.data; - const {loggedIn, isAdmin, user, showSignInDialog, signInOffset} = this.props.auth; + const {loggedIn, isAdmin, user, showSignInDialog} = this.props.auth; // even though the permalinked comment is the highlighted one, we're displaying its parent + replies const highlightedComment = comment && comment.parent ? comment.parent : comment; @@ -221,7 +220,7 @@ class Embed extends React.Component { {!loggedIn && } - {loggedIn && user && } + {loggedIn && user && } {loggedIn && } {/* the highlightedComment is isolated after the user followed a permalink */} @@ -318,7 +317,7 @@ const mapDispatchToProps = dispatch => ({ addNotification: (type, text) => addNotification(type, text), clearNotification: () => dispatch(clearNotification()), editName: (username) => dispatch(editName(username)), - showSignInDialog: (offset) => dispatch(showSignInDialog(offset)), + showSignInDialog: () => dispatch(showSignInDialog()), updateCountCache: (id, count) => dispatch(updateCountCache(id, count)), viewAllComments: () => dispatch(viewAllComments()), logout: () => dispatch(logout()), diff --git a/client/coral-plugin-flags/FlagButton.js b/client/coral-plugin-flags/FlagButton.js index 45110f407..859b2b1ca 100644 --- a/client/coral-plugin-flags/FlagButton.js +++ b/client/coral-plugin-flags/FlagButton.js @@ -25,8 +25,7 @@ class FlagButton extends Component { const {localPost, localDelete} = this.state; const flagged = (flag && flag.current_user && !localDelete) || localPost; if (!currentUser) { - const offset = document.getElementById(`c_${this.props.id}`).getBoundingClientRect().top - 75; - this.props.showSignInDialog(offset); + this.props.showSignInDialog(); return; } if (flagged) { diff --git a/client/coral-plugin-likes/LikeButton.js b/client/coral-plugin-likes/LikeButton.js index 51854c57f..c95a683a4 100644 --- a/client/coral-plugin-likes/LikeButton.js +++ b/client/coral-plugin-likes/LikeButton.js @@ -35,8 +35,7 @@ class LikeButton extends Component { const onLikeClick = () => { if (!currentUser) { - const offset = document.getElementById(`c_${id}`).getBoundingClientRect().top - 75; - showSignInDialog(offset); + showSignInDialog(); return; } if (currentUser.banned) { diff --git a/client/coral-sign-in/components/CreateUsernameDialog.js b/client/coral-sign-in/components/CreateUsernameDialog.js index 4a7a99b81..38fe9dd83 100644 --- a/client/coral-sign-in/components/CreateUsernameDialog.js +++ b/client/coral-sign-in/components/CreateUsernameDialog.js @@ -10,16 +10,12 @@ import I18n from 'coral-framework/modules/i18n/i18n'; import translations from '../translations'; const lang = new I18n(translations); -const CreateUsernameDialog = ({open, handleClose, offset, formData, handleSubmitUsername, handleChange, ...props}) => { +const CreateUsernameDialog = ({open, handleClose, formData, handleSubmitUsername, handleChange, ...props}) => { return ( + open={open}> ×
diff --git a/client/coral-sign-in/components/SignDialog.js b/client/coral-sign-in/components/SignDialog.js index 6243472b4..ff2464f7c 100644 --- a/client/coral-sign-in/components/SignDialog.js +++ b/client/coral-sign-in/components/SignDialog.js @@ -6,15 +6,11 @@ import SignInContent from './SignInContent'; import SignUpContent from './SignUpContent'; import ForgotContent from './ForgotContent'; -const SignDialog = ({open, view, handleClose, offset, ...props}) => ( +const SignDialog = ({open, view, handleClose, ...props}) => ( + open={open}> × {view === 'SIGNIN' && } {view === 'SIGNUP' && } diff --git a/client/coral-sign-in/containers/ChangeUsernameContainer.js b/client/coral-sign-in/containers/ChangeUsernameContainer.js index c4450aa56..a3b4b969d 100644 --- a/client/coral-sign-in/containers/ChangeUsernameContainer.js +++ b/client/coral-sign-in/containers/ChangeUsernameContainer.js @@ -100,12 +100,11 @@ class ChangeUsernameContainer extends Component { } render() { - const {loggedIn, auth, offset} = this.props; + const {loggedIn, auth} = this.props; return (
Date: Fri, 21 Apr 2017 00:52:45 +0700 Subject: [PATCH 11/12] Restore login flow in ProfileContainer --- .../coral-settings/components/NotLoggedIn.js | 4 ++-- .../containers/ProfileContainer.js | 18 ++++-------------- 2 files changed, 6 insertions(+), 16 deletions(-) diff --git a/client/coral-settings/components/NotLoggedIn.js b/client/coral-settings/components/NotLoggedIn.js index 9fc43758e..a5d8b0693 100644 --- a/client/coral-settings/components/NotLoggedIn.js +++ b/client/coral-settings/components/NotLoggedIn.js @@ -4,10 +4,10 @@ import translations from '../translations'; import I18n from 'coral-framework/modules/i18n/i18n'; const lang = new I18n(translations); -export default ({signIn}) => ( +export default ({showSignInDialog}) => (
- {lang.t('signIn')} {lang.t('toAccess')} + {lang.t('signIn')} {lang.t('toAccess')}
{lang.t('fromSettingsPage')} diff --git a/client/coral-settings/containers/ProfileContainer.js b/client/coral-settings/containers/ProfileContainer.js index 7a26ed13e..553504462 100644 --- a/client/coral-settings/containers/ProfileContainer.js +++ b/client/coral-settings/containers/ProfileContainer.js @@ -13,7 +13,7 @@ import IgnoredUsers from '../components/IgnoredUsers'; import {Spinner} from 'coral-ui'; import CommentHistory from 'coral-plugin-history/CommentHistory'; -import {openSignInPopUp, checkLogin} from 'coral-framework/actions/auth'; +import {showSignInDialog, checkLogin} from 'coral-framework/actions/auth'; import translations from '../translations'; const lang = new I18n(translations); @@ -34,18 +34,8 @@ class ProfileContainer extends Component { }); } - signIn = () => { - const {refetch} = this.props.data; - const {openSignInPopUp, checkLogin} = this.props; - - openSignInPopUp(() => { - checkLogin(); - refetch(); - }); - } - render() { - const {loggedIn, asset, data, myIgnoredUsersData, stopIgnoringUser} = this.props; + const {loggedIn, asset, data, showSignInDialog, myIgnoredUsersData, stopIgnoringUser} = this.props; const {me} = this.props.data; if (data.loading) { @@ -53,7 +43,7 @@ class ProfileContainer extends Component { } if (!loggedIn || !me) { - return ; + return ; } const localProfile = this.props.user.profiles.find(p => p.provider === 'local'); @@ -106,7 +96,7 @@ const mapStateToProps = state => ({ }); const mapDispatchToProps = dispatch => - bindActionCreators({openSignInPopUp, checkLogin}, dispatch); + bindActionCreators({showSignInDialog, checkLogin}, dispatch); export default compose( connect(mapStateToProps, mapDispatchToProps), From 4519a550a20fd5e03e1326a014dbbe3b8d655d09 Mon Sep 17 00:00:00 2001 From: Chi Vinh Le Date: Fri, 21 Apr 2017 02:27:26 +0700 Subject: [PATCH 12/12] Fix fresh login on profile --- client/coral-framework/actions/auth.js | 10 ++++++++++ 1 file changed, 10 insertions(+) diff --git a/client/coral-framework/actions/auth.js b/client/coral-framework/actions/auth.js index b2080b3b4..e112b2b6c 100644 --- a/client/coral-framework/actions/auth.js +++ b/client/coral-framework/actions/auth.js @@ -11,6 +11,16 @@ const ME_QUERY = gql` query Me { me { status + comments { + id + body + asset { + id + title + url + } + created_at + } } } `;