diff --git a/client/coral-embed-stream/src/components/Embed.js b/client/coral-embed-stream/src/components/Embed.js index 3a898295f..e6ae3f367 100644 --- a/client/coral-embed-stream/src/components/Embed.js +++ b/client/coral-embed-stream/src/components/Embed.js @@ -1,8 +1,8 @@ import React from 'react'; const lang = new I18n(translations); import Stream from '../containers/Stream'; +import Slot from 'coral-framework/components/Slot'; import I18n from 'coral-framework/modules/i18n/i18n'; -import UserBox from 'coral-sign-in/components/UserBox'; import translations from 'coral-framework/translations'; import {TabBar, Tab, TabContent, Button} from 'coral-ui'; import Count from 'coral-plugin-comment-count/CommentCount'; @@ -34,12 +34,10 @@ export default class Embed extends React.Component { handleShowProfile = () => this.props.setActiveTab('profile'); render () { - const {activeTab, logout, viewAllComments, commentId} = this.props; + const {activeTab, viewAllComments, commentId} = this.props; const {asset: {totalCommentCount}} = this.props.root; const {loggedIn, isAdmin, user} = this.props.auth; - const userBox = ; - return (
@@ -48,6 +46,7 @@ export default class Embed extends React.Component { {lang.t('myProfile')} Configure Stream + { commentId &&
:

{asset.settings.closedMessage}

} - {loggedIn && - user && - } {loggedIn && } {highlightedComment diff --git a/client/coral-sign-in/components/UserBox.js b/client/coral-sign-in/components/UserBox.js deleted file mode 100644 index a44c3d4fb..000000000 --- a/client/coral-sign-in/components/UserBox.js +++ /dev/null @@ -1,15 +0,0 @@ -import React from 'react'; -import styles from './styles.css'; -import I18n from 'coral-framework/modules/i18n/i18n'; -import translations from '../translations'; -const lang = new I18n(translations); - -const UserBox = ({className, user, onLogout, onShowProfile}) => ( -
- {lang.t('signIn.loggedInAs')} - {user.username}. {lang.t('signIn.notYou')} - {lang.t('signIn.logout')} -
-); - -export default UserBox; diff --git a/client/coral-sign-in/containers/SignInContainer.js b/client/coral-sign-in/containers/SignInContainer.js deleted file mode 100644 index 4e883c765..000000000 --- a/client/coral-sign-in/containers/SignInContainer.js +++ /dev/null @@ -1,5 +0,0 @@ -import React from 'react'; - -export const SignInContainer = () => ( - -); diff --git a/client/coral-sign-in/containers/ChangeUsernameContainer.js b/plugins/coral-plugin-auth/client/components/ChangeUsernameContainer.js similarity index 73% rename from client/coral-sign-in/containers/ChangeUsernameContainer.js rename to plugins/coral-plugin-auth/client/components/ChangeUsernameContainer.js index 12a9a75b8..4f0ad9895 100644 --- a/client/coral-sign-in/containers/ChangeUsernameContainer.js +++ b/plugins/coral-plugin-auth/client/components/ChangeUsernameContainer.js @@ -4,7 +4,7 @@ import {connect} from 'react-redux'; import validate from 'coral-framework/helpers/validate'; import errorMsj from 'coral-framework/helpers/error'; -import CreateUsernameDialog from '../components/CreateUsernameDialog'; +import CreateUsernameDialog from './CreateUsernameDialog'; import I18n from 'coral-framework/modules/i18n/i18n'; import translations from '../translations'; @@ -16,12 +16,12 @@ import { invalidForm, validForm, createUsername -} from '../../coral-framework/actions/auth'; +} from 'coral-framework/actions/auth'; class ChangeUsernameContainer extends Component { initialState = { formData: { - username: '', + username: '' }, errors: {}, showErrors: false @@ -39,19 +39,22 @@ class ChangeUsernameContainer extends Component { handleChange(e) { const {name, value} = e.target; - this.setState((state) => ({ - ...state, - formData: { - ...state.formData, - [name]: value + this.setState( + state => ({ + ...state, + formData: { + ...state.formData, + [name]: value + } + }), + () => { + this.validation(name, value); } - }), () => { - this.validation(name, value); - }); + ); } addError(name, error) { - return this.setState((state) => ({ + return this.setState(state => ({ errors: { ...state.errors, [name]: error @@ -67,15 +70,15 @@ class ChangeUsernameContainer extends Component { } else if (!validate[name](value)) { addError(name, errorMsj[name]); } else { - const { [name]: prop, ...errors } = this.state.errors; // eslint-disable-line + const {[name]: prop, ...errors} = this.state.errors; // eslint-disable-line // Removes Error - this.setState((state) => ({...state, errors})); + this.setState(state => ({...state, errors})); } } isCompleted() { const {formData} = this.state; - return !Object.keys(formData).filter((prop) => !formData[prop].length).length; + return !Object.keys(formData).filter(prop => !formData[prop].length).length; } displayErrors(show = true) { @@ -117,19 +120,17 @@ class ChangeUsernameContainer extends Component { } } -const mapStateToProps = (state) => ({ - auth: state.auth.toJS() -}); +const mapStateToProps = ({auth, user}) => ({auth, user}); -const mapDispatchToProps = (dispatch) => ({ - createUsername: (userid, formData) => dispatch(createUsername(userid, formData)), +const mapDispatchToProps = dispatch => ({ + createUsername: (userid, formData) => + dispatch(createUsername(userid, formData)), showCreateUsernameDialog: () => dispatch(showCreateUsernameDialog()), hideCreateUsernameDialog: () => dispatch(hideCreateUsernameDialog()), - invalidForm: (error) => dispatch(invalidForm(error)), + invalidForm: error => dispatch(invalidForm(error)), validForm: () => dispatch(validForm()) }); -export default connect( - mapStateToProps, - mapDispatchToProps -)(ChangeUsernameContainer); +export default connect(mapStateToProps, mapDispatchToProps)( + ChangeUsernameContainer +); diff --git a/client/coral-sign-in/components/CreateUsernameDialog.js b/plugins/coral-plugin-auth/client/components/CreateUsernameDialog.js similarity index 100% rename from client/coral-sign-in/components/CreateUsernameDialog.js rename to plugins/coral-plugin-auth/client/components/CreateUsernameDialog.js diff --git a/client/coral-sign-in/components/FakeComment.js b/plugins/coral-plugin-auth/client/components/FakeComment.js similarity index 100% rename from client/coral-sign-in/components/FakeComment.js rename to plugins/coral-plugin-auth/client/components/FakeComment.js diff --git a/client/coral-sign-in/components/ForgotContent.js b/plugins/coral-plugin-auth/client/components/ForgotContent.js similarity index 100% rename from client/coral-sign-in/components/ForgotContent.js rename to plugins/coral-plugin-auth/client/components/ForgotContent.js diff --git a/client/coral-sign-in/components/SignDialog.js b/plugins/coral-plugin-auth/client/components/SignDialog.js similarity index 100% rename from client/coral-sign-in/components/SignDialog.js rename to plugins/coral-plugin-auth/client/components/SignDialog.js diff --git a/plugins/coral-plugin-auth/client/components/SignInButton.js b/plugins/coral-plugin-auth/client/components/SignInButton.js index b5a88431f..b4497bc92 100644 --- a/plugins/coral-plugin-auth/client/components/SignInButton.js +++ b/plugins/coral-plugin-auth/client/components/SignInButton.js @@ -16,7 +16,9 @@ const SignInButton = ({loggedIn, showSignInDialog}) => (
); -const mapStateToProps = ({auth}) => ({loggedIn: auth.loggedIn}); +const mapStateToProps = ({auth}) => ({ + loggedIn: auth.toJS().loggedIn +}); const mapDispatchToProps = dispatch => bindActionCreators({showSignInDialog}, dispatch); diff --git a/plugins/coral-plugin-auth/client/components/SignInContainer.js b/plugins/coral-plugin-auth/client/components/SignInContainer.js index 06a747556..73094920e 100644 --- a/plugins/coral-plugin-auth/client/components/SignInContainer.js +++ b/plugins/coral-plugin-auth/client/components/SignInContainer.js @@ -1,5 +1,6 @@ import React, {Component, PropTypes} from 'react'; import {connect} from 'react-redux'; +import SignDialog from './SignDialog'; import validate from 'coral-framework/helpers/validate'; import errorMsj from 'coral-framework/helpers/error'; import I18n from 'coral-framework/modules/i18n/i18n'; @@ -181,7 +182,16 @@ class SignInContainer extends Component { return (
- This is my login +
); } diff --git a/client/coral-sign-in/components/SignInContent.js b/plugins/coral-plugin-auth/client/components/SignInContent.js similarity index 100% rename from client/coral-sign-in/components/SignInContent.js rename to plugins/coral-plugin-auth/client/components/SignInContent.js diff --git a/client/coral-sign-in/components/SignUpContent.js b/plugins/coral-plugin-auth/client/components/SignUpContent.js similarity index 100% rename from client/coral-sign-in/components/SignUpContent.js rename to plugins/coral-plugin-auth/client/components/SignUpContent.js diff --git a/plugins/coral-plugin-auth/client/components/UserBox.js b/plugins/coral-plugin-auth/client/components/UserBox.js new file mode 100644 index 000000000..a4a0e1c99 --- /dev/null +++ b/plugins/coral-plugin-auth/client/components/UserBox.js @@ -0,0 +1,34 @@ +import React from 'react'; +import styles from './styles.css'; +import {connect} from 'react-redux'; +import {bindActionCreators} from 'redux'; +import translations from '../translations'; +import I18n from 'coral-framework/modules/i18n/i18n'; +import {showSignInDialog, logout} from 'coral-framework/actions/auth'; +const lang = new I18n(translations); + +const UserBox = ({loggedIn, user, logout, onShowProfile}) => ( +
+ { + loggedIn ? ( +
+ {lang.t('signIn.loggedInAs')} + {user.username}. {lang.t('signIn.notYou')} + logout()}> + {lang.t('signIn.logout')} + +
+ ) : null + } +
+); + +const mapStateToProps = ({auth, user}) => ({ + loggedIn: auth.toJS().loggedIn, + user: user.toJS() +}); + +const mapDispatchToProps = dispatch => + bindActionCreators({logout}, dispatch); + +export default connect(mapStateToProps, mapDispatchToProps)(UserBox); diff --git a/client/coral-sign-in/components/styles.css b/plugins/coral-plugin-auth/client/components/styles.css similarity index 100% rename from client/coral-sign-in/components/styles.css rename to plugins/coral-plugin-auth/client/components/styles.css diff --git a/plugins/coral-plugin-auth/client/index.js b/plugins/coral-plugin-auth/client/index.js index 8d2eecc3c..3bf9e58f0 100644 --- a/plugins/coral-plugin-auth/client/index.js +++ b/plugins/coral-plugin-auth/client/index.js @@ -1,9 +1,11 @@ import SignInButton from './components/SignInButton'; import SignInContainer from './components/SignInContainer'; +import UserBox from './components/UserBox'; +import ChangeUserNameContainer from './components/ChangeUserNameContainer'; export default { slots: { - stream: [SignInButton], + stream: [UserBox, SignInButton, ChangeUserNameContainer], login: [SignInContainer] } }; \ No newline at end of file diff --git a/plugins/coral-plugin-auth/client/translations.json b/plugins/coral-plugin-auth/client/translations.json index 93d73d3a2..7ae84b2ff 100644 --- a/plugins/coral-plugin-auth/client/translations.json +++ b/plugins/coral-plugin-auth/client/translations.json @@ -1,10 +1,102 @@ { "en": { - "like": "Like", - "liked": "Liked" + "signIn": { + "emailVerifyCTA": "Please verify your email address.", + "requestNewVerifyEmail": "Request another email:", + "verifyEmail": "Thank you for creating an account! We sent an email to the address you provided to verify your account.", + "verifyEmail2": "You must verify your account before engaging with the community.", + "notYou": "Not you?", + "loggedInAs": "Logged in as", + "facebookSignIn": "Sign in with Facebook", + "facebookSignUp": "Sign up with Facebook", + "logout": "Logout", + "signIn": "Sign in to join the conversation", + "or": "Or", + "email": "E-mail Address", + "password": "Password", + "forgotYourPass": "Forgot your password?", + "needAnAccount": "Need an account?", + "register": "Register", + "signUp": "Sign Up", + "confirmPassword": "Confirm Password", + "username": "Username", + "alreadyHaveAnAccount": "Already have an account?", + "recoverPassword": "Recover password", + "emailInUse": "Email address already in use", + "emailORusernameInUse": "Email address or Username already in use", + "requiredField": "This field is required", + "passwordsDontMatch": "Passwords don't match.", + "specialCharacters": "Usernames can contain letters, numbers and _ only", + "checkTheForm": "Invalid Form. Please, check the fields" + }, + "createdisplay": { + "writeyourusername": "Edit your username", + "yourusername": "Your username appears on every comment you post.", + "ifyoudontchangeyourname": "If you don't change your username at this step, your Facebook display name will appear alongside of all your comments.", + "username": "Username", + "continue": "Continue with the same Facebook username", + "save": "Save", + "fakecommentdate": "1 minute ago", + "fakecommentbody": "This is an example comment. Readers can share their thoughts and opinions with newsrooms in the comments section.", + "requiredField": "Required field", + "errorCreate": "Error when changing username", + "checkTheForm": "Invalid Form. Please, check the fields", + "specialCharacters": "Usernames can contain letters, numbers and _ only" + }, + "permalink": { + "permalink": "Link" + }, + "report": "Report", + "like": "Like" }, "es": { - "like": "Me Gusta", - "liked": "Me Gustó" + "signIn": { + "emailVerifyCTA": "Por favor verifique su e-mail.", + "requestNewVerifyEmail": "Enviar otro correo:", + "verifyEmail": "¡Gracias por crear una cuenta! Le enviamos un correo a la dirección que dio para verificar su cuenta.", + "verifyEmail2": "Debe verificarla antes de poder involucrarse en la comunidad.", + "notYou": "¿No eres tu?", + "loggedInAs": "Entraste como", + "facebookSignIn": "Entrar con Facebook", + "facebookSignUp": "Regístrate con Facebook", + "logout": "Salir", + "signIn": "Entrar para Unirte a la Conversación", + "or": "o", + "email": "E-mail", + "password": "Contraseña", + "forgotYourPass": "¿Has olvidado tu contraseña?", + "needAnAccount": "¿Necesitas una cuenta?", + "register": "Regístrate", + "signUp": "Registro", + "confirmPassword": "Confirmar Contraseña", + "username": "Nombre", + "alreadyHaveAnAccount": "¿Ya tienes una cuenta?", + "recoverPassword": "Recuperar contraseña", + "emailInUse": "Este e-mail se encuentra en uso", + "emailORusernameInUse": "Este e-mail ó nombre de usuario se encuentran en uso", + "requiredField": "Este campo es requerido", + "passwordsDontMatch": "Las contraseñas no coinciden", + "specialCharacters": "Los nombres pueden contener letras, números y _", + "checkTheForm": "Formulario Inválido. Por favor, completa los campos" + }, + "createdisplay": { + "writeyourusername": "Edita tu nombre", + "yourusername": "Tu nombre aparece en cada comentario que publiques.", + "ifyoudontchangeyourname": "Si no modificas tu nombre de usuario en este paso, tu nombre de Facebook aparecera al lado de cada comentario que publiques.", + "username": "Nombre", + "continue": "Continuar con nombre de Facebook", + "save": "Guardar", + "fakecommentdate": "hace un minuto", + "fakecommentbody": "Este es un comentario de ejemplo. Las lectoras pueden compartir sus ideas y opiniones con los periodistas en la sección de comentarios.", + "requiredField": "Campo necesario", + "errorCreate": "Hubo un error al cambiar el nombre de usuario", + "checkTheForm": "Formulario Inválido. Por favor, verifica los campos", + "specialCharacters": "Sólo pueden contener letras, números y _" + }, + "permalink": { + "permalink": "Enlace" + }, + "report": "Marcar", + "like": "Me gusta" } }