From e4e7ff27d2db4292b2af11167850025bc3a89a9f Mon Sep 17 00:00:00 2001 From: David Jay Date: Thu, 16 Feb 2017 16:54:05 -0500 Subject: [PATCH 01/22] Adding don't agree action to typedefs. --- graph/typeDefs.graphql | 66 ++++++++++++++++++++++++++++++++++++++---- 1 file changed, 61 insertions(+), 5 deletions(-) diff --git a/graph/typeDefs.graphql b/graph/typeDefs.graphql index cabb50985..72696cd86 100644 --- a/graph/typeDefs.graphql +++ b/graph/typeDefs.graphql @@ -91,6 +91,9 @@ enum ACTION_TYPE { # Represents a FlagAction. FLAG + + # Represents a don't agree action + DONTAGREE } # CommentsQuery allows the ability to query comments by a specific methods. @@ -166,7 +169,7 @@ type Comment { ## Actions ################################################################################ -# An action rendered against a parent enity item. +# An action rendered against a parent entity item. interface Action { # The ID of the action. @@ -269,6 +272,28 @@ type FlagAction implements Action { created_at: Date } +# A DONTAGREE action that contains do not agree metadata. +type DontAgreeAction implements Action { + + # The ID of the DontAgree Action. + id: ID! + + # The reason for which the DontAgree Action was created. + reason: String + + # An optional message sent with the flagging action by the user. + message: String + + # The user who created the action. + user: User + + # The time when the DontAgree Action was updated. + updated_at: Date + + # The time when the DontAgree Action was created. + created_at: Date +} + # Summary for Flag Action with a a unique reason. type FlagActionSummary implements ActionSummary { @@ -484,7 +509,7 @@ type CreateLikeResponse implements Response { # The like that was created. like: LikeAction - # An array of errors relating to the mutation that occured. + # An array of errors relating to the mutation that occurred. errors: [UserError] } @@ -508,18 +533,46 @@ input CreateFlagInput { # was created. type CreateFlagResponse implements Response { - # The like that was created. + # The flag that was created. flag: FlagAction - # An array of errors relating to the mutation that occured. + # An array of errors relating to the mutation that occurred. errors: [UserError] } + +# CreateDontAgreeResponse is the response returned with possibly some errors +# relating to the creating the don't agree action attempt and possibly the don't agree that +# was created. +type CreateDontAgreeResponse implements Response { + + # The don't agree that was created. + dontagree: DontAgreeAction + + # An array of errors relating to the mutation that occurred. + errors: [UserError] +} + +input CreateDontAgreeInput { + + # The item's id for which we are to create a don't agree. + item_id: ID! + + # The type of the item for which we are to create the don't agree. + item_type: ACTION_ITEM_TYPE! + + # The reason for not agreeing with the item. + reason: String! + + # An optional message sent with the don't agree action by the user. + message: String +} + # DeleteActionResponse is the response returned with possibly some errors # relating to the delete action attempt. type DeleteActionResponse implements Response { - # An array of errors relating to the mutation that occured. + # An array of errors relating to the mutation that occurred. errors: [UserError] } @@ -551,6 +604,9 @@ type RootMutation { # Creates a flag on an entity. createFlag(flag: CreateFlagInput!): CreateFlagResponse + # Creates a don't agree action on an entity. + createDontAgree(dontagree: CreateDontAgreeInput!): CreateDontAgreeResponse + # Delete an action based on the action id. deleteAction(id: ID!): DeleteActionResponse From d10936749d324c670760b44f6f63424a7337bd51 Mon Sep 17 00:00:00 2001 From: David Jay Date: Fri, 17 Feb 2017 11:14:42 -0500 Subject: [PATCH 02/22] Adding DontAgreeActionSummaries --- graph/typeDefs.graphql | 13 +++++++++++++ 1 file changed, 13 insertions(+) diff --git a/graph/typeDefs.graphql b/graph/typeDefs.graphql index 72696cd86..04fc5ed70 100644 --- a/graph/typeDefs.graphql +++ b/graph/typeDefs.graphql @@ -307,6 +307,19 @@ type FlagActionSummary implements ActionSummary { current_user: FlagAction } +# Summary for Don't Agree Action with a a unique reason. +type DontAgreeActionSummary implements ActionSummary { + + # The total count of flags with this reason. + count: Int! + + # The reason for which the Flag Action was created. + reason: String + + # The don't agree action by the current user against the parent entity with this reason. + current_user: DontAgreeAction +} + ################################################################################ ## Settings ################################################################################ From 1d8ce1ae340680c7d46a6b1add71b592281456a7 Mon Sep 17 00:00:00 2001 From: David Jay Date: Tue, 21 Feb 2017 14:41:33 -0500 Subject: [PATCH 03/22] Posting DontAgree actions. --- client/coral-embed-stream/src/Comment.js | 2 ++ client/coral-embed-stream/src/Embed.js | 4 ++- client/coral-embed-stream/src/Stream.js | 2 ++ .../graphql/mutations/index.js | 12 +++++++ .../graphql/mutations/postDontAgree.graphql | 10 ++++++ client/coral-plugin-flags/FlagBio.js | 35 ------------------- client/coral-plugin-flags/FlagButton.js | 29 ++++++++++----- client/coral-plugin-flags/FlagComment.js | 2 +- graph/resolvers/action.js | 2 ++ graph/resolvers/action_summary.js | 2 ++ graph/resolvers/dont_agree_action.js | 9 +++++ graph/resolvers/dont_agree_action_summary.js | 7 ++++ graph/resolvers/index.js | 4 +++ graph/resolvers/root_mutation.js | 3 ++ graph/typeDefs.graphql | 10 +++--- 15 files changed, 82 insertions(+), 51 deletions(-) create mode 100644 client/coral-framework/graphql/mutations/postDontAgree.graphql delete mode 100644 client/coral-plugin-flags/FlagBio.js create mode 100644 graph/resolvers/dont_agree_action.js create mode 100644 graph/resolvers/dont_agree_action_summary.js diff --git a/client/coral-embed-stream/src/Comment.js b/client/coral-embed-stream/src/Comment.js index 034c44f6a..c2737b275 100644 --- a/client/coral-embed-stream/src/Comment.js +++ b/client/coral-embed-stream/src/Comment.js @@ -90,6 +90,7 @@ class Comment extends React.Component { showSignInDialog, postLike, postFlag, + postDontAgree, loadMore, setActiveReplyBox, activeReplyBox, @@ -133,6 +134,7 @@ class Comment extends React.Component { id={comment.id} author_id={comment.user.id} postFlag={postFlag} + postDontAgree={postDontAgree} deleteAction={deleteAction} showSignInDialog={showSignInDialog} currentUser={currentUser} /> diff --git a/client/coral-embed-stream/src/Embed.js b/client/coral-embed-stream/src/Embed.js index f15def5d3..d3747fbe0 100644 --- a/client/coral-embed-stream/src/Embed.js +++ b/client/coral-embed-stream/src/Embed.js @@ -10,7 +10,7 @@ const {addNotification, clearNotification} = notificationActions; const {fetchAssetSuccess} = assetActions; import {queryStream} from 'coral-framework/graphql/queries'; -import {postComment, postFlag, postLike, deleteAction} from 'coral-framework/graphql/mutations'; +import {postComment, postFlag, postLike, postDontAgree, deleteAction} from 'coral-framework/graphql/mutations'; import {editName} from 'coral-framework/actions/user'; import {Notification, notificationActions, authActions, assetActions, pym} from 'coral-framework'; @@ -156,6 +156,7 @@ class Embed extends Component { currentUser={user} postLike={this.props.postLike} postFlag={this.props.postFlag} + postDontAgree={this.props.postDontAgree} loadMore={this.props.loadMore} deleteAction={this.props.deleteAction} showSignInDialog={this.props.showSignInDialog} @@ -226,6 +227,7 @@ export default compose( postComment, postFlag, postLike, + postDontAgree, deleteAction, queryStream )(Embed); diff --git a/client/coral-embed-stream/src/Stream.js b/client/coral-embed-stream/src/Stream.js index 2f0f4b01b..59f1e4179 100644 --- a/client/coral-embed-stream/src/Stream.js +++ b/client/coral-embed-stream/src/Stream.js @@ -39,6 +39,7 @@ class Stream extends React.Component { addNotification, postFlag, postLike, + postDontAgree, loadMore, deleteAction, showSignInDialog, @@ -60,6 +61,7 @@ class Stream extends React.Component { currentUser={currentUser} postLike={postLike} postFlag={postFlag} + postDontAgree={postDontAgree} loadMore={loadMore} deleteAction={deleteAction} showSignInDialog={showSignInDialog} diff --git a/client/coral-framework/graphql/mutations/index.js b/client/coral-framework/graphql/mutations/index.js index 40ca0a7a3..d757923ee 100644 --- a/client/coral-framework/graphql/mutations/index.js +++ b/client/coral-framework/graphql/mutations/index.js @@ -2,6 +2,7 @@ import {graphql} from 'react-apollo'; import POST_COMMENT from './postComment.graphql'; import POST_FLAG from './postFlag.graphql'; import POST_LIKE from './postLike.graphql'; +import POST_DONT_AGREE from './postDontAgree.graphql'; import DELETE_ACTION from './deleteAction.graphql'; import commentView from '../fragments/commentView.graphql'; @@ -44,6 +45,17 @@ export const postFlag = graphql(POST_FLAG, { }}), }); +export const postDontAgree = graphql(POST_DONT_AGREE, { + props: ({mutate}) => ({ + postDontAgree: (dontagree) => { + return mutate({ + variables: { + dontagree + } + }); + }}), +}); + export const deleteAction = graphql(DELETE_ACTION, { props: ({mutate}) => ({ deleteAction: (id) => { diff --git a/client/coral-framework/graphql/mutations/postDontAgree.graphql b/client/coral-framework/graphql/mutations/postDontAgree.graphql new file mode 100644 index 000000000..6e36d48b8 --- /dev/null +++ b/client/coral-framework/graphql/mutations/postDontAgree.graphql @@ -0,0 +1,10 @@ +mutation CreateDontAgree($dontagree: CreateDontAgreeInput!) { + createDontAgree(dontagree:$dontagree) { + dontagree { + id + } + errors { + translation_key + } + } +} diff --git a/client/coral-plugin-flags/FlagBio.js b/client/coral-plugin-flags/FlagBio.js deleted file mode 100644 index 2639ab8cf..000000000 --- a/client/coral-plugin-flags/FlagBio.js +++ /dev/null @@ -1,35 +0,0 @@ -import React from 'react'; -import FlagButton from './FlagButton'; -import {I18n} from '../coral-framework'; -import translations from './translations.json'; - -const FlagBio = (props) => ; - -const getPopupMenu = [ - () => { - return { - header: lang.t('step-2-header'), - itemType: 'USERS', - field: 'bio', - options: [ - {val: 'This bio is offensive', text: lang.t('bio-offensive')}, - {val: 'I don\'t like this bio', text: lang.t('no-like-bio')}, - {val: 'This looks like an ad/marketing', text: lang.t('marketing')}, - {val: 'other', text: lang.t('other')} - ], - button: lang.t('continue'), - sets: 'reason' - }; - }, - () => { - return { - header: lang.t('step-3-header'), - text: lang.t('thank-you'), - button: lang.t('done'), - }; - } -]; - -export default FlagBio; - -const lang = new I18n(translations); diff --git a/client/coral-plugin-flags/FlagButton.js b/client/coral-plugin-flags/FlagButton.js index e94dfc5fc..53ca3cebe 100644 --- a/client/coral-plugin-flags/FlagButton.js +++ b/client/coral-plugin-flags/FlagButton.js @@ -38,7 +38,7 @@ class FlagButton extends Component { } onPopupContinue = () => { - const {postFlag, id, author_id} = this.props; + const {postFlag, postDontAgree, id, author_id} = this.props; const {itemType, reason, step, posted, message} = this.state; // Proceed to the next step or close the menu if we've reached the end @@ -52,7 +52,6 @@ class FlagButton extends Component { if (itemType && reason && !posted) { this.setState({posted: true}); - // Set the text from the "other" field if it exists. let item_id; switch(itemType) { case 'COMMENTS': @@ -63,20 +62,32 @@ class FlagButton extends Component { break; } - // Note: Action metadata has been temporarily removed. if (itemType === 'COMMENTS') { this.setState({localPost: 'temp'}); } - postFlag({ + + let action = { item_id, item_type: itemType, reason, message - }).then(({data}) => { - if (itemType === 'COMMENTS') { - this.setState({localPost: data.createFlag.flag.id}); - } - }); + }; + if (reason === 'I don\'t agree with this comment') { + postDontAgree(action) + .then(({data}) => { + if (itemType === 'COMMENTS') { + console.log('data', data); + this.setState({localPost: data.createDontAgree.dontagree.id}); + } + }); + } else { + postFlag(action) + .then(({data}) => { + if (itemType === 'COMMENTS') { + this.setState({localPost: data.createFlag.flag.id}); + } + }); + } } } diff --git a/client/coral-plugin-flags/FlagComment.js b/client/coral-plugin-flags/FlagComment.js index bf3fca286..24fde6b0f 100644 --- a/client/coral-plugin-flags/FlagComment.js +++ b/client/coral-plugin-flags/FlagComment.js @@ -20,9 +20,9 @@ const getPopupMenu = [ (itemType) => { const options = itemType === 'COMMENTS' ? [ - {val: 'I don\'t agree with this comment', text: lang.t('no-agree-comment')}, {val: 'This comment is offensive', text: lang.t('comment-offensive')}, {val: 'This looks like an ad/marketing', text: lang.t('marketing')}, + {val: 'I don\'t agree with this comment', text: lang.t('no-agree-comment')}, {val: 'other', text: lang.t('other')} ] : [ diff --git a/graph/resolvers/action.js b/graph/resolvers/action.js index 0962f59af..1bb8d077e 100644 --- a/graph/resolvers/action.js +++ b/graph/resolvers/action.js @@ -1,6 +1,8 @@ const Action = { __resolveType({action_type}) { switch (action_type) { + case 'DONTAGREE': + return 'DontAgreeAction'; case 'FLAG': return 'FlagAction'; case 'LIKE': diff --git a/graph/resolvers/action_summary.js b/graph/resolvers/action_summary.js index 93848d285..1986a0648 100644 --- a/graph/resolvers/action_summary.js +++ b/graph/resolvers/action_summary.js @@ -5,6 +5,8 @@ const ActionSummary = { return 'FlagActionSummary'; case 'LIKE': return 'LikeActionSummary'; + case 'DONTAGREE': + return 'DontAgreeActionSummary'; } }, }; diff --git a/graph/resolvers/dont_agree_action.js b/graph/resolvers/dont_agree_action.js new file mode 100644 index 000000000..25dc02503 --- /dev/null +++ b/graph/resolvers/dont_agree_action.js @@ -0,0 +1,9 @@ +const DontAgreeAction = { + + // Stored in the metadata, extract and return. + reason({metadata: {reason}}) { + return reason; + } +}; + +module.exports = DontAgreeAction; diff --git a/graph/resolvers/dont_agree_action_summary.js b/graph/resolvers/dont_agree_action_summary.js new file mode 100644 index 000000000..520fdce3b --- /dev/null +++ b/graph/resolvers/dont_agree_action_summary.js @@ -0,0 +1,7 @@ +const DontAgreeActionSummary = { + reason({group_id}) { + return group_id; + } +}; + +module.exports = DontAgreeActionSummary; diff --git a/graph/resolvers/index.js b/graph/resolvers/index.js index 65461dc76..3bd8c571d 100644 --- a/graph/resolvers/index.js +++ b/graph/resolvers/index.js @@ -6,6 +6,8 @@ const Comment = require('./comment'); const Date = require('./date'); const FlagActionSummary = require('./flag_action_summary'); const FlagAction = require('./flag_action'); +const DontAgreeAction = require('./dont_agree_action'); +const DontAgreeActionSummary = require('./dont_agree_action_summary'); const GenericUserError = require('./generic_user_error'); const LikeAction = require('./like_action'); const RootMutation = require('./root_mutation'); @@ -24,6 +26,8 @@ module.exports = { Date, FlagActionSummary, FlagAction, + DontAgreeAction, + DontAgreeActionSummary, GenericUserError, LikeAction, RootMutation, diff --git a/graph/resolvers/root_mutation.js b/graph/resolvers/root_mutation.js index 4285f900d..51b200a2d 100644 --- a/graph/resolvers/root_mutation.js +++ b/graph/resolvers/root_mutation.js @@ -24,6 +24,9 @@ const RootMutation = { createFlag(_, {flag: {item_id, item_type, reason, message}}, {mutators: {Action}}) { return wrapResponse('flag')(Action.create({item_id, item_type, action_type: 'FLAG', group_id: reason, metadata: {message}})); }, + createDontAgree(_, {dontagree: {item_id, item_type, reason, message}}, {mutators: {Action}}) { + return wrapResponse('dontagee')(Action.create({item_id, item_type, action_type: 'DONTAGREE', group_id: reason, metadata: {message}})); + }, deleteAction(_, {id}, {mutators: {Action}}) { return wrapResponse(null)(Action.delete({id})); }, diff --git a/graph/typeDefs.graphql b/graph/typeDefs.graphql index 04fc5ed70..30bb79262 100644 --- a/graph/typeDefs.graphql +++ b/graph/typeDefs.graphql @@ -480,18 +480,18 @@ type RootQuery { # Response defines what can be expected from any response to a mutation action. interface Response { - # An array of errors relating to the mutation that occured. + # An array of errors relating to the mutation that occurred. errors: [UserError] } # CreateCommentResponse is returned with the comment that was created and any -# errors that may have occured in the attempt to create it. +# errors that may have occurred in the attempt to create it. type CreateCommentResponse implements Response { # The comment that was created. comment: Comment - # An array of errors relating to the mutation that occured. + # An array of errors relating to the mutation that occurred. errors: [UserError] } @@ -593,7 +593,7 @@ type DeleteActionResponse implements Response { # relating to the delete action attempt. type SetUserStatusResponse implements Response { - # An array of errors relating to the mutation that occured. + # An array of errors relating to the mutation that occurred. errors: [UserError] } @@ -601,7 +601,7 @@ type SetUserStatusResponse implements Response { # relating to the delete action attempt. type SetCommentStatusResponse implements Response { - # An array of errors relating to the mutation that occured. + # An array of errors relating to the mutation that occurred. errors: [UserError] } From 3377aa3da2ecbb86986cccfe4189935fbfb36d30 Mon Sep 17 00:00:00 2001 From: David Jay Date: Tue, 21 Feb 2017 14:55:00 -0500 Subject: [PATCH 04/22] Displaying DontAgree actions as flags. --- client/coral-embed-stream/src/Comment.js | 3 ++- client/coral-plugin-flags/FlagButton.js | 1 - 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/client/coral-embed-stream/src/Comment.js b/client/coral-embed-stream/src/Comment.js index c2737b275..7d1956bc4 100644 --- a/client/coral-embed-stream/src/Comment.js +++ b/client/coral-embed-stream/src/Comment.js @@ -99,6 +99,7 @@ class Comment extends React.Component { const like = getActionSummary('LikeActionSummary', comment); const flag = getActionSummary('FlagActionSummary', comment); + const dontagree = getActionSummary('DontAgreeActionSummary', comment); return (
{ if (itemType === 'COMMENTS') { - console.log('data', data); this.setState({localPost: data.createDontAgree.dontagree.id}); } }); From 02c05e8ae157f985a12f12a31ddf29dff0fbfb24 Mon Sep 17 00:00:00 2001 From: gaba Date: Tue, 21 Feb 2017 12:43:02 -0800 Subject: [PATCH 05/22] CSS, translations and code for new create username dialog. --- .../components/CreateUsernameDialog.js | 25 ++++++------ client/coral-sign-in/components/styles.css | 39 ++++++++++++++++++- client/coral-sign-in/translations.js | 14 ++++--- 3 files changed, 60 insertions(+), 18 deletions(-) diff --git a/client/coral-sign-in/components/CreateUsernameDialog.js b/client/coral-sign-in/components/CreateUsernameDialog.js index d245b38ac..457641089 100644 --- a/client/coral-sign-in/components/CreateUsernameDialog.js +++ b/client/coral-sign-in/components/CreateUsernameDialog.js @@ -10,7 +10,7 @@ const lang = new I18n(translations); const CreateUsernameDialog = ({open, handleClose, offset, formData, handleSubmitUsername, handleChange, ...props}) => (
- +

{lang.t('createdisplay.yourusername')}

+
Example
+

{lang.t('createdisplay.ifyoudontchangeyourname')}

{ props.auth.error && {props.auth.error} }
- - { props.errors.username && {lang.t('createdisplay.specialCharacters')} } -
+ { props.errors.username && {lang.t('createdisplay.specialCharacters')} } +
+
+
diff --git a/client/coral-sign-in/components/styles.css b/client/coral-sign-in/components/styles.css index 60a252a20..77282d388 100644 --- a/client/coral-sign-in/components/styles.css +++ b/client/coral-sign-in/components/styles.css @@ -117,7 +117,7 @@ input.error{ } .action { - margin-top: 15px; + margin-top: 0px; } .passwordRequestSuccess { @@ -140,6 +140,41 @@ input.error{ display: block; } -.confirmSubmit { +/* Change username Dialog*/ +.dialogusername { + border: none; + box-shadow: 0 9px 46px 8px rgba(0, 0, 0, 0.14), 0 11px 15px -7px rgba(0, 0, 0, 0.12), 0 24px 38px 3px rgba(0, 0, 0, 0.2); + width: 400px; + top: 10px; +} + +.yourusername { + display: block; +} + +.example { + display: block; +} + +.ifyoudont { + display: block; +} + +.saveusername { + display: block; + width: 100%; +} + +.savebutton { + display: inline; + background-color: rgb(105,105,105); + color: white; +} + +.continuebutton { + background-color: black; + font-weight: bold; + color: white; + min-width: 200px; } diff --git a/client/coral-sign-in/translations.js b/client/coral-sign-in/translations.js index a2bb60819..4826f2f2c 100644 --- a/client/coral-sign-in/translations.js +++ b/client/coral-sign-in/translations.js @@ -30,9 +30,11 @@ export default { checkTheForm: 'Invalid Form. Please, check the fields' }, 'createdisplay': { - writeyourusername: 'Write your username', - yourusername: 'Your username is publicly visible on all comments you post. A username is needed before you can post your first comment.', + 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', requiredField: 'Required field', errorCreate: 'Error when changing username', @@ -71,9 +73,11 @@ export default { checkTheForm: 'Formulario Inválido. Por favor, completa los campos' }, 'createdisplay': { - writeyourusername: 'Escribe tu nombre', - yourusername: 'Tu nombre es visible publicamente en todos los comentarios que publiques. Es necesario tener un nombre de usuario antes de poder publicar tu primer comentario.', - username: 'Nombre a mostrar', + 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', requiredField: 'Campo necesario', errorCreate: 'Hubo un error al cambiar el nombre de usuario', From 5d0730b4d5f8d5078d65cf824e67c1afd86c2521 Mon Sep 17 00:00:00 2001 From: gaba Date: Tue, 21 Feb 2017 14:52:19 -0800 Subject: [PATCH 06/22] Adds fake comment component. --- .../components/CreateUsernameDialog.js | 14 +++-- .../coral-sign-in/components/FakeComment.js | 54 +++++++++++++++++++ client/coral-sign-in/components/styles.css | 6 +++ client/coral-sign-in/translations.js | 4 ++ 4 files changed, 75 insertions(+), 3 deletions(-) create mode 100644 client/coral-sign-in/components/FakeComment.js diff --git a/client/coral-sign-in/components/CreateUsernameDialog.js b/client/coral-sign-in/components/CreateUsernameDialog.js index 457641089..a01137733 100644 --- a/client/coral-sign-in/components/CreateUsernameDialog.js +++ b/client/coral-sign-in/components/CreateUsernameDialog.js @@ -3,7 +3,10 @@ import TextField from 'coral-ui/components/TextField'; import Alert from './Alert'; import Button from 'coral-ui/components/Button'; import {Dialog} from 'coral-ui'; +import FakeComment from './FakeComment'; + import styles from './styles.css'; + import I18n from 'coral-framework/modules/i18n/i18n'; import translations from '../translations'; const lang = new I18n(translations); @@ -25,9 +28,14 @@ const CreateUsernameDialog = ({open, handleClose, offset, formData, handleSubmit
-

{lang.t('createdisplay.yourusername')}

-
Example
-

{lang.t('createdisplay.ifyoudontchangeyourname')}

+

{lang.t('createdisplay.yourusername')}

+ +

{lang.t('createdisplay.ifyoudontchangeyourname')}

{ props.auth.error && {props.auth.error} }
{ props.errors.username && {lang.t('createdisplay.specialCharacters')} } diff --git a/client/coral-sign-in/components/FakeComment.js b/client/coral-sign-in/components/FakeComment.js new file mode 100644 index 000000000..97afa59fa --- /dev/null +++ b/client/coral-sign-in/components/FakeComment.js @@ -0,0 +1,54 @@ +import React from 'react'; +import styles from 'coral-embed-stream/src/Comment.css'; + +import PermalinkButton from 'coral-plugin-permalinks/PermalinkButton'; +import AuthorName from 'coral-plugin-author-name/AuthorName'; +import Content from 'coral-plugin-commentcontent/CommentContent'; +import PubDate from 'coral-plugin-pubdate/PubDate'; +import {ReplyButton} from 'coral-plugin-replies'; +import FlagComment from 'coral-plugin-flags/FlagComment'; +import LikeButton from 'coral-plugin-likes/LikeButton'; + +class FakeComment extends React.Component { + constructor (props) { + super(props); + } + + render () { + const {username, created_at, body} = this.props; + + return ( +
+
+ + + +
+ {return;}} + deleteAction={()=>{return;}} + showSignInDialog={()=>{return;}} + currentUser={{}} + /> + {}} + parentCommentId={'commentID'} + currentUserId={{}} + banned={false} + /> +
+
+ + +
+
+ ); + } +} + +export default FakeComment; diff --git a/client/coral-sign-in/components/styles.css b/client/coral-sign-in/components/styles.css index 77282d388..81afe75e5 100644 --- a/client/coral-sign-in/components/styles.css +++ b/client/coral-sign-in/components/styles.css @@ -159,6 +159,7 @@ input.error{ .ifyoudont { display: block; + margin-top: 15px; } .saveusername { @@ -178,3 +179,8 @@ input.error{ color: white; min-width: 200px; } + +.fakeComment { + display: block; + margin-bottom: 5px; +} diff --git a/client/coral-sign-in/translations.js b/client/coral-sign-in/translations.js index 4826f2f2c..5693939af 100644 --- a/client/coral-sign-in/translations.js +++ b/client/coral-sign-in/translations.js @@ -36,6 +36,8 @@ export default { 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', @@ -79,6 +81,8 @@ export default { 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 Invalido. Por favor, verifica los campos', From 1b79a105802ab456b16ecf6af3dc7f396e5dd398 Mon Sep 17 00:00:00 2001 From: gaba Date: Tue, 21 Feb 2017 16:36:50 -0800 Subject: [PATCH 07/22] Change username when it changes. --- client/coral-sign-in/components/CreateUsernameDialog.js | 8 +++++--- client/coral-sign-in/components/FakeComment.js | 1 - .../coral-sign-in/containers/ChangeUsernameContainer.js | 1 + 3 files changed, 6 insertions(+), 4 deletions(-) diff --git a/client/coral-sign-in/components/CreateUsernameDialog.js b/client/coral-sign-in/components/CreateUsernameDialog.js index a01137733..f0edc7398 100644 --- a/client/coral-sign-in/components/CreateUsernameDialog.js +++ b/client/coral-sign-in/components/CreateUsernameDialog.js @@ -11,7 +11,8 @@ 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, offset, formData, handleSubmitUsername, handleChange, ...props}) => { + return ( {lang.t('createdisplay.yourusername')}

@@ -54,6 +55,7 @@ const CreateUsernameDialog = ({open, handleClose, offset, formData, handleSubmit
-); + ); +}; export default CreateUsernameDialog; diff --git a/client/coral-sign-in/components/FakeComment.js b/client/coral-sign-in/components/FakeComment.js index 97afa59fa..c496e69d9 100644 --- a/client/coral-sign-in/components/FakeComment.js +++ b/client/coral-sign-in/components/FakeComment.js @@ -39,7 +39,6 @@ class FakeComment extends React.Component { onClick={() => {}} parentCommentId={'commentID'} currentUserId={{}} - banned={false} />
diff --git a/client/coral-sign-in/containers/ChangeUsernameContainer.js b/client/coral-sign-in/containers/ChangeUsernameContainer.js index 33ae63614..ca065169f 100644 --- a/client/coral-sign-in/containers/ChangeUsernameContainer.js +++ b/client/coral-sign-in/containers/ChangeUsernameContainer.js @@ -29,6 +29,7 @@ class ChangeUsernameContainer extends Component { constructor(props) { super(props); + this.initialState.formData.username = props.user.username; this.state = this.initialState; this.handleChange = this.handleChange.bind(this); this.handleSubmitUsername = this.handleSubmitUsername.bind(this); From 2c60285981581b4d3777f95fe6eacc95f43ff18a Mon Sep 17 00:00:00 2001 From: gaba Date: Wed, 22 Feb 2017 07:00:15 -0800 Subject: [PATCH 08/22] The component needs the banned value. --- client/coral-sign-in/components/FakeComment.js | 1 + 1 file changed, 1 insertion(+) diff --git a/client/coral-sign-in/components/FakeComment.js b/client/coral-sign-in/components/FakeComment.js index c496e69d9..97afa59fa 100644 --- a/client/coral-sign-in/components/FakeComment.js +++ b/client/coral-sign-in/components/FakeComment.js @@ -39,6 +39,7 @@ class FakeComment extends React.Component { onClick={() => {}} parentCommentId={'commentID'} currentUserId={{}} + banned={false} />
From 32bc754bf7435e3caa92c466f79a912c208052a4 Mon Sep 17 00:00:00 2001 From: gaba Date: Wed, 22 Feb 2017 11:22:51 -0800 Subject: [PATCH 09/22] It needs to send the translation key --- client/coral-framework/helpers/response.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/client/coral-framework/helpers/response.js b/client/coral-framework/helpers/response.js index 64803faef..0fce878cd 100644 --- a/client/coral-framework/helpers/response.js +++ b/client/coral-framework/helpers/response.js @@ -45,7 +45,7 @@ const handleResp = res => { } if (err.error && err.error.translation_key) { - message = err.error.translation_key; + error.translation_key = err.error.translation_key; } error.message = message; From 3f5d751a8080bea15007ba085488a05fc37f3584 Mon Sep 17 00:00:00 2001 From: David Jay Date: Thu, 23 Feb 2017 12:24:32 -0500 Subject: [PATCH 10/22] Setting reason to null for dontAgree. --- client/coral-plugin-flags/FlagButton.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/client/coral-plugin-flags/FlagButton.js b/client/coral-plugin-flags/FlagButton.js index 1069ffca1..537d899cd 100644 --- a/client/coral-plugin-flags/FlagButton.js +++ b/client/coral-plugin-flags/FlagButton.js @@ -69,7 +69,7 @@ class FlagButton extends Component { let action = { item_id, item_type: itemType, - reason, + reason: null, message }; if (reason === 'I don\'t agree with this comment') { @@ -80,7 +80,7 @@ class FlagButton extends Component { } }); } else { - postFlag(action) + postFlag({...action, reason}) .then(({data}) => { if (itemType === 'COMMENTS') { this.setState({localPost: data.createFlag.flag.id}); From 5d0ea6a880c20e0655e2df080adbd3caefd24a22 Mon Sep 17 00:00:00 2001 From: gaba Date: Thu, 23 Feb 2017 09:48:59 -0800 Subject: [PATCH 11/22] Rmove continue button, fix bug with facebook signup. --- .../components/CreateUsernameDialog.js | 1 - client/coral-sign-in/components/styles.css | 7 ------ .../containers/ChangeUsernameContainer.js | 2 +- routes/api/auth/index.js | 23 ++++++++----------- services/users.js | 5 +++- 5 files changed, 14 insertions(+), 24 deletions(-) diff --git a/client/coral-sign-in/components/CreateUsernameDialog.js b/client/coral-sign-in/components/CreateUsernameDialog.js index f0edc7398..d0e348046 100644 --- a/client/coral-sign-in/components/CreateUsernameDialog.js +++ b/client/coral-sign-in/components/CreateUsernameDialog.js @@ -50,7 +50,6 @@ const CreateUsernameDialog = ({open, handleClose, offset, formData, handleSubmit />
- diff --git a/client/coral-sign-in/components/styles.css b/client/coral-sign-in/components/styles.css index 81afe75e5..617c8d1cb 100644 --- a/client/coral-sign-in/components/styles.css +++ b/client/coral-sign-in/components/styles.css @@ -173,13 +173,6 @@ input.error{ color: white; } -.continuebutton { - background-color: black; - font-weight: bold; - color: white; - min-width: 200px; -} - .fakeComment { display: block; margin-bottom: 5px; diff --git a/client/coral-sign-in/containers/ChangeUsernameContainer.js b/client/coral-sign-in/containers/ChangeUsernameContainer.js index ca065169f..c4450aa56 100644 --- a/client/coral-sign-in/containers/ChangeUsernameContainer.js +++ b/client/coral-sign-in/containers/ChangeUsernameContainer.js @@ -104,7 +104,7 @@ class ChangeUsernameContainer extends Component { return (
(err, user) => { /** * Returns the response to the login attempt via a popup callback with some JS. */ + const HandleAuthPopupCallback = (req, res, next) => (err, user) => { if (err) { return res.render('auth-callback', {err: JSON.stringify(err), data: null}); @@ -70,20 +70,15 @@ const HandleAuthPopupCallback = (req, res, next) => (err, user) => { return res.render('auth-callback', {err: JSON.stringify(errors.ErrNotAuthorized), data: null}); } - // Authorize the user to edit their username. - UsersService.toggleNameEdit(user.id, true) - .then(() => { - - // Perform the login of the user! - req.logIn(user, (err) => { - if (err) { - return res.render('auth-callback', {err: JSON.stringify(err), data: null}); - } + // Perform the login of the user! + req.logIn(user, (err) => { + if (err) { + return res.render('auth-callback', {err: JSON.stringify(err), data: null}); + } - // We logged in the user! Let's send back the user data. - res.render('auth-callback', {err: null, data: JSON.stringify(user)}); - }); - }); + // We logged in the user! Let's send back the user data. + res.render('auth-callback', {err: null, data: JSON.stringify(user), changeusername: true}); + }); }; /** diff --git a/services/users.js b/services/users.js index cf3a0063d..b58776a75 100644 --- a/services/users.js +++ b/services/users.js @@ -124,6 +124,8 @@ module.exports = class UsersService { return user; } + // User does not exist and need to be created. + let username = UsersService.castUsername(displayName); // The user was not found, lets create them! @@ -131,7 +133,8 @@ module.exports = class UsersService { username, lowercaseUsername: username.toLowerCase(), roles: [], - profiles: [{id, provider}] + profiles: [{id, provider}], + canEditName: true }); return user.save(); From f795a96f463a239548ba8ae4bfbb020dd0afc8f3 Mon Sep 17 00:00:00 2001 From: David Jay Date: Thu, 23 Feb 2017 13:19:09 -0500 Subject: [PATCH 12/22] Returning dontagree id on post. --- graph/resolvers/root_mutation.js | 3 +-- graph/typeDefs.graphql | 2 +- 2 files changed, 2 insertions(+), 3 deletions(-) diff --git a/graph/resolvers/root_mutation.js b/graph/resolvers/root_mutation.js index e2dba5821..2462962c6 100644 --- a/graph/resolvers/root_mutation.js +++ b/graph/resolvers/root_mutation.js @@ -13,7 +13,6 @@ const wrapResponse = (key) => (promise) => { } return res; }).catch((err) => { - if (err instanceof errors.APIError) { return { errors: [err] @@ -39,7 +38,7 @@ const RootMutation = { return wrapResponse('flag')(Action.create({item_id, item_type, action_type: 'FLAG', group_id: reason, metadata: {message}})); }, createDontAgree(_, {dontagree: {item_id, item_type, reason, message}}, {mutators: {Action}}) { - return wrapResponse('dontagee')(Action.create({item_id, item_type, action_type: 'DONTAGREE', group_id: reason, metadata: {message}})); + return wrapResponse('dontagree')(Action.create({item_id, item_type, action_type: 'DONTAGREE', group_id: reason, metadata: {message}})); }, deleteAction(_, {id}, {mutators: {Action}}) { return wrapResponse(null)(Action.delete({id})); diff --git a/graph/typeDefs.graphql b/graph/typeDefs.graphql index e005b88ea..aad6026eb 100644 --- a/graph/typeDefs.graphql +++ b/graph/typeDefs.graphql @@ -601,7 +601,7 @@ input CreateDontAgreeInput { item_type: ACTION_ITEM_TYPE! # The reason for not agreeing with the item. - reason: String! + reason: String # An optional message sent with the don't agree action by the user. message: String From 022667c9aed1f778f2a07a1171116ba2e7fd2dd5 Mon Sep 17 00:00:00 2001 From: gaba Date: Thu, 23 Feb 2017 13:55:51 -0800 Subject: [PATCH 13/22] Brings some of the components into FakeComment --- .../coral-sign-in/components/FakeComment.js | 38 ++++++++++++------- client/coral-sign-in/translations.js | 12 +++++- 2 files changed, 36 insertions(+), 14 deletions(-) diff --git a/client/coral-sign-in/components/FakeComment.js b/client/coral-sign-in/components/FakeComment.js index 97afa59fa..75d4e51f1 100644 --- a/client/coral-sign-in/components/FakeComment.js +++ b/client/coral-sign-in/components/FakeComment.js @@ -1,13 +1,15 @@ import React from 'react'; import styles from 'coral-embed-stream/src/Comment.css'; -import PermalinkButton from 'coral-plugin-permalinks/PermalinkButton'; import AuthorName from 'coral-plugin-author-name/AuthorName'; import Content from 'coral-plugin-commentcontent/CommentContent'; import PubDate from 'coral-plugin-pubdate/PubDate'; import {ReplyButton} from 'coral-plugin-replies'; -import FlagComment from 'coral-plugin-flags/FlagComment'; -import LikeButton from 'coral-plugin-likes/LikeButton'; + +import I18n from 'coral-framework/modules/i18n/i18n'; +import translations from '../translations'; + +const lang = new I18n(translations); class FakeComment extends React.Component { constructor (props) { @@ -27,14 +29,13 @@ class FakeComment extends React.Component {
- {return;}} - deleteAction={()=>{return;}} - showSignInDialog={()=>{return;}} - currentUser={{}} - /> +
+ +
; {}} parentCommentId={'commentID'} @@ -43,8 +44,19 @@ class FakeComment extends React.Component { />
- - +
+ +
+
+ +
); diff --git a/client/coral-sign-in/translations.js b/client/coral-sign-in/translations.js index 5693939af..7a946c0bb 100644 --- a/client/coral-sign-in/translations.js +++ b/client/coral-sign-in/translations.js @@ -42,7 +42,12 @@ export default { 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: { 'signIn': { @@ -88,5 +93,10 @@ export default { checkTheForm: 'Formulario Invalido. Por favor, verifica los campos', specialCharacters: 'Sólo pueden contener letras, números y _' }, + 'permalink': { + permalink: 'Enlace' + }, + 'report': 'Informe', + 'like': 'Me gusta', } }; From 886240a7bc4240b7e44763deb6ee3ef1e04082d8 Mon Sep 17 00:00:00 2001 From: Riley Davis Date: Fri, 24 Feb 2017 11:11:18 -0700 Subject: [PATCH 14/22] translations. remove console.log on frontend. remove notification on POST moderation --- .../containers/Configure/CommentSettings.js | 1 - .../ModerationQueue/ModerationContainer.js | 1 - client/coral-embed-stream/src/Embed.js | 9 +- client/coral-framework/actions/auth.js | 3 +- client/coral-framework/translations.json | 2 + client/coral-plugin-commentbox/CommentBox.js | 3 - .../RileysAwesomeCommentBox.js | 58 ---------- client/coral-plugin-stream/Stream.js | 100 ------------------ .../coral-settings/components/NotLoggedIn.js | 1 - .../{SettingsHeader.css => ProfileHeader.css} | 0 .../components/ProfileHeader.js | 12 +++ .../components/SettingsHeader.js | 14 --- ...ttingsContainer.js => ProfileContainer.js} | 8 +- client/coral-settings/translations.json | 8 +- client/coral-sign-in/translations.js | 4 +- 15 files changed, 32 insertions(+), 192 deletions(-) delete mode 100644 client/coral-plugin-stream/RileysAwesomeCommentBox.js delete mode 100644 client/coral-plugin-stream/Stream.js rename client/coral-settings/components/{SettingsHeader.css => ProfileHeader.css} (100%) create mode 100644 client/coral-settings/components/ProfileHeader.js delete mode 100644 client/coral-settings/components/SettingsHeader.js rename client/coral-settings/containers/{SettingsContainer.js => ProfileContainer.js} (92%) diff --git a/client/coral-admin/src/containers/Configure/CommentSettings.js b/client/coral-admin/src/containers/Configure/CommentSettings.js index 5a14cf565..90057c5fe 100644 --- a/client/coral-admin/src/containers/Configure/CommentSettings.js +++ b/client/coral-admin/src/containers/Configure/CommentSettings.js @@ -52,7 +52,6 @@ const updateClosedMessage = (updateSettings) => (event) => { }; const updateCustomCssUrl = (updateSettings) => (event) => { - console.log('updateCustomCssUrl', event.target.value); const customCssUrl = event.target.value; updateSettings({customCssUrl}); }; diff --git a/client/coral-admin/src/containers/ModerationQueue/ModerationContainer.js b/client/coral-admin/src/containers/ModerationQueue/ModerationContainer.js index f685ac094..b1a44533e 100644 --- a/client/coral-admin/src/containers/ModerationQueue/ModerationContainer.js +++ b/client/coral-admin/src/containers/ModerationQueue/ModerationContainer.js @@ -54,7 +54,6 @@ class ModerationContainer extends Component { } if (data.error) { - console.log(data); return
Error
; } diff --git a/client/coral-embed-stream/src/Embed.js b/client/coral-embed-stream/src/Embed.js index 5e979d243..5c72e65d6 100644 --- a/client/coral-embed-stream/src/Embed.js +++ b/client/coral-embed-stream/src/Embed.js @@ -2,6 +2,9 @@ import React, {Component} from 'react'; import {compose} from 'react-apollo'; import {connect} from 'react-redux'; import isEqual from 'lodash/isEqual'; +import I18n from 'coral-framework/modules/i18n/i18n'; +import translations from 'coral-framework/translations'; +const lang = new I18n(translations); import {TabBar, Tab, TabContent, Spinner} from 'coral-ui'; @@ -25,7 +28,7 @@ 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 SettingsContainer from 'coral-settings/containers/SettingsContainer'; +import ProfileContainer from 'coral-settings/containers/ProfileContainer'; import RestrictedContent from 'coral-framework/components/RestrictedContent'; import ConfigureStreamContainer from 'coral-configure/containers/ConfigureStreamContainer'; import LoadMore from './LoadMore'; @@ -110,7 +113,7 @@ class Embed extends Component {
- Settings + {lang.t('profile')} Configure Stream {loggedIn && } @@ -190,7 +193,7 @@ class Embed extends Component { loadMore={this.props.loadMore}/> - dispatch => { dispatch(verifyEmailSuccess()); }) .catch(err => { - console.log('failed to send email verification', err); // email might have already been verifyed - dispatch(verifyEmailFailure()); + dispatch(verifyEmailFailure(err)); }); }; diff --git a/client/coral-framework/translations.json b/client/coral-framework/translations.json index c817925eb..d115aedca 100644 --- a/client/coral-framework/translations.json +++ b/client/coral-framework/translations.json @@ -1,5 +1,6 @@ { "en": { + "profile": "Profile", "successUpdateSettings": "The changes you have made have been applied to the comment stream on this article", "successNameUpdate": "Your username has been updated", "contentNotAvailable": "This content is not available", @@ -36,6 +37,7 @@ } }, "es": { + "profile": "Perfil", "successUpdateSettings": "La configuración de este articulo fue actualizada", "successBioUpdate": "Tu bio fue actualizada", "contentNotAvailable": "El contenido no se encuentra disponible", diff --git a/client/coral-plugin-commentbox/CommentBox.js b/client/coral-plugin-commentbox/CommentBox.js index 3d895df07..e1b04582c 100644 --- a/client/coral-plugin-commentbox/CommentBox.js +++ b/client/coral-plugin-commentbox/CommentBox.js @@ -57,8 +57,6 @@ class CommentBox extends Component { } else if (postedComment.status === 'PREMOD') { addNotification('success', lang.t('comment-post-notif-premod')); updateCountCache(assetId, countCache); - } else { - addNotification('success', 'Your comment has been posted.'); } if (commentPostedHandler) { @@ -110,7 +108,6 @@ class CommentBox extends Component { cStyle='darkGrey' className={`${name}-cancel-button`} onClick={() => { - console.log('cancel button in comment box'); cancelButtonClicked(''); }}> {lang.t('cancel')} diff --git a/client/coral-plugin-stream/RileysAwesomeCommentBox.js b/client/coral-plugin-stream/RileysAwesomeCommentBox.js deleted file mode 100644 index 73fa6407d..000000000 --- a/client/coral-plugin-stream/RileysAwesomeCommentBox.js +++ /dev/null @@ -1,58 +0,0 @@ -import React, {Component} from 'react'; -import {graphql} from 'react-apollo'; -import gql from 'graphql-tag'; - -export class RileysAwesomeCommentBox extends Component { - - postComment() { - console.log(this.props); - console.log('postComment', this.props.asset_id); - this.props.mutate({ - variables: { - asset_id: this.props.asset_id, - body: this.textarea.value, - parent_id: null - } - }).then(({data}) => { - console.log('it workt'); - console.log(data); - }); - } - - render() { - return
- - -
; - } -} - -const postComment = gql` - fragment commentView on Comment { - id - body - user { - name: username - } - actions { - type: action_type - count - current: current_user { - id - created_at - } - } - } - - mutation CreateComment ($asset_id: ID!, $parent_id: ID, $body: String!) { - createComment(asset_id:$asset_id, parent_id:$parent_id, body:$body) { - ...commentView - } - } -`; - -const RileysAwesomeCommentBoxWithData = graphql( - postComment -)(RileysAwesomeCommentBox); - -export default RileysAwesomeCommentBoxWithData; diff --git a/client/coral-plugin-stream/Stream.js b/client/coral-plugin-stream/Stream.js deleted file mode 100644 index 72e03d4ae..000000000 --- a/client/coral-plugin-stream/Stream.js +++ /dev/null @@ -1,100 +0,0 @@ -import React, {Component} from 'react'; -import {graphql} from 'react-apollo'; -import gql from 'graphql-tag'; -import {fetchSignIn} from 'coral-framework/actions/auth'; -import RileysAwesomeCommentBox from 'coral-plugin-stream/RileysAwesomeCommentBox'; - -const assetID = '6187a94b-0b6d-4a96-ac6b-62b529cd8410'; - -// MyComponent is a "presentational" or apollo-unaware component, -// It could be a simple React class: -class Stream extends Component { - - constructor(props) { - super(props); - } - - logMeIn() { - fetchSignIn({email: 'your@example.com', password: 'dfasidfaisdufoiausdfoiuaspdoifas'})(() => {}); - } - - render() { - const {data} = this.props; - return
- - { - data.loading - ? 'loading!' - :
- -

Asset ID: {data.asset.id}

-
    - { - data.asset.comments.map(comment => { - return
  • - {comment.body} [{comment.id}] -
      - { - comment.replies.map(reply => { - return
    • {reply.body}
      • ; - }) - } -
    -
    • ; - }) - } -
-
- } -
; - } -} - -// Initialize GraphQL queries or mutations with the gql tag -const StreamQuery = gql`fragment commentView on Comment { - id - body - user { - name: username - } - tags { - name - } - actions { - type: action_type - count - current: current_user { - id - created_at - } - } -} - -query AssetQuery($asset_id: ID!) { - asset(id: $asset_id) { - id - title - url - commentCount - comments { - ...commentView - replies { - ...commentView - } - } - } -}`; - -// We then can use `graphql` to pass the query results returned by MyQuery -// to MyComponent as a prop (and update them as the results change) -const StreamWithData = graphql( - StreamQuery, { - options: { - variables: { - asset_id: assetID - } - } - } -)(Stream); - -export default StreamWithData; diff --git a/client/coral-settings/components/NotLoggedIn.js b/client/coral-settings/components/NotLoggedIn.js index 2e2b64181..acd3ae7e6 100644 --- a/client/coral-settings/components/NotLoggedIn.js +++ b/client/coral-settings/components/NotLoggedIn.js @@ -10,7 +10,6 @@ export default ({showSignInDialog}) => ( diff --git a/client/coral-settings/components/SettingsHeader.css b/client/coral-settings/components/ProfileHeader.css similarity index 100% rename from client/coral-settings/components/SettingsHeader.css rename to client/coral-settings/components/ProfileHeader.css diff --git a/client/coral-settings/components/ProfileHeader.js b/client/coral-settings/components/ProfileHeader.js new file mode 100644 index 000000000..24b2222bd --- /dev/null +++ b/client/coral-settings/components/ProfileHeader.js @@ -0,0 +1,12 @@ +import React, {PropTypes} from 'react'; +import styles from './ProfileHeader.css'; + +const ProfileHeader = ({username}) => ( +
+

{username}

+
+); + +ProfileHeader.propTypes = {username: PropTypes.string.isRequired}; + +export default ProfileHeader; diff --git a/client/coral-settings/components/SettingsHeader.js b/client/coral-settings/components/SettingsHeader.js deleted file mode 100644 index 34d347314..000000000 --- a/client/coral-settings/components/SettingsHeader.js +++ /dev/null @@ -1,14 +0,0 @@ -import React from 'react'; -import styles from './SettingsHeader.css'; - -export default ({userData}) => ( -
-

{userData.username}

- - { - - // Hiding display of users ID unless there's a use case for it. - //

{userData.profiles.map(profile => profile.id)}

- } -
-); diff --git a/client/coral-settings/containers/SettingsContainer.js b/client/coral-settings/containers/ProfileContainer.js similarity index 92% rename from client/coral-settings/containers/SettingsContainer.js rename to client/coral-settings/containers/ProfileContainer.js index 9e72cdadc..4a98ed8ff 100644 --- a/client/coral-settings/containers/SettingsContainer.js +++ b/client/coral-settings/containers/ProfileContainer.js @@ -8,13 +8,13 @@ import {myCommentHistory} from 'coral-framework/graphql/queries'; import {link} from 'coral-framework/services/PymConnection'; import NotLoggedIn from '../components/NotLoggedIn'; import {Spinner} from 'coral-ui'; -import SettingsHeader from '../components/SettingsHeader'; +import ProfileHeader from '../components/ProfileHeader'; import CommentHistory from 'coral-plugin-history/CommentHistory'; import translations from '../translations'; const lang = new I18n(translations); -class SettingsContainer extends Component { +class ProfileContainer extends Component { constructor (props) { super(props); this.state = { @@ -44,7 +44,7 @@ class SettingsContainer extends Component { return (
- + { // Hiding bio until moderation can get figured out @@ -88,4 +88,4 @@ const mapDispatchToProps = () => ({ export default compose( connect(mapStateToProps, mapDispatchToProps), myCommentHistory -)(SettingsContainer); +)(ProfileContainer); diff --git a/client/coral-settings/translations.json b/client/coral-settings/translations.json index c8398bd7b..945d71b87 100644 --- a/client/coral-settings/translations.json +++ b/client/coral-settings/translations.json @@ -1,20 +1,22 @@ { "en":{ + "profile": "Profile", "userNoComment": "You've never left a comment. Join the conversation!", "allComments": "All Comments", "profileSettings": "Profile Settings", "myCommentHistory": "My comment History", "signIn": "Sign in", - "toAccess": " to access Settings", - "fromSettingsPage": "From the Settings Page you can see your comment history." + "toAccess": " to access Profile", + "fromSettingsPage": "From the Profile Page you can see your comment history." }, "es":{ + "profile": "Perfil", "userNoComment": "No has dejado áun ningún comentario. ¡Unete a la conversación!", "allComments": "Todos los comentarios", "profileSettings": "Configuración del perfil", "myCommentHistory": "Mi historial de comentarios", "signIn": "Entrar", - "toAccess": "para acceder a la configuración", + "toAccess": "para acceder a al perfil", "fromSettingsPage": "Desde la peagina de configuración puede ver su historia de comentarios." } } diff --git a/client/coral-sign-in/translations.js b/client/coral-sign-in/translations.js index a2bb60819..08c8bbd3f 100644 --- a/client/coral-sign-in/translations.js +++ b/client/coral-sign-in/translations.js @@ -10,7 +10,7 @@ export default { facebookSignIn: 'Sign in with Facebook', facebookSignUp: 'Sign up with Facebook', logout: 'Logout', - signIn: 'Sign In', + signIn: 'Sign in to join the conversation', or: 'Or', email: 'E-mail Address', password: 'Password', @@ -51,7 +51,7 @@ export default { facebookSignIn: 'Entrar con Facebook', facebookSignUp: 'Regístrate con Facebook', logout: 'Salir', - signIn: 'Entrar', + signIn: 'Entrar para Unirte a la Conversación', or: 'o', email: 'E-mail', password: 'Contraseña', From dcc16dc5989700b4d44f13360c13fb38305f93f0 Mon Sep 17 00:00:00 2001 From: David Jay Date: Fri, 24 Feb 2017 14:45:47 -0500 Subject: [PATCH 15/22] Removing extra semicolon. --- client/coral-sign-in/components/FakeComment.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/client/coral-sign-in/components/FakeComment.js b/client/coral-sign-in/components/FakeComment.js index 75d4e51f1..b5af6bf1c 100644 --- a/client/coral-sign-in/components/FakeComment.js +++ b/client/coral-sign-in/components/FakeComment.js @@ -35,7 +35,7 @@ class FakeComment extends React.Component { thumb_up -
; +
{}} parentCommentId={'commentID'} From 6a9d8c0436097599cf4a9ae8f0c1ca2e277cc9d8 Mon Sep 17 00:00:00 2001 From: David Jay Date: Fri, 24 Feb 2017 15:51:43 -0500 Subject: [PATCH 16/22] Removing refetch and prevent 0 from displaying on empty comment streams. --- client/coral-embed-stream/src/Comment.js | 3 --- client/coral-embed-stream/src/NewCount.js | 3 ++- 2 files changed, 2 insertions(+), 4 deletions(-) diff --git a/client/coral-embed-stream/src/Comment.js b/client/coral-embed-stream/src/Comment.js index 8371cec45..f42b22e44 100644 --- a/client/coral-embed-stream/src/Comment.js +++ b/client/coral-embed-stream/src/Comment.js @@ -38,7 +38,6 @@ class Comment extends React.Component { // id of currently opened ReplyBox. tracked in Stream.js activeReplyBox: PropTypes.string.isRequired, setActiveReplyBox: PropTypes.func.isRequired, - refetch: PropTypes.func.isRequired, showSignInDialog: PropTypes.func.isRequired, postFlag: PropTypes.func.isRequired, postLike: PropTypes.func.isRequired, @@ -85,7 +84,6 @@ class Comment extends React.Component { asset, depth, postItem, - refetch, addNotification, showSignInDialog, postLike, @@ -155,7 +153,6 @@ class Comment extends React.Component { comment.replies && comment.replies.map(reply => { return { return
{ - props.countCache && newComments > 0 && + props.countCache && newComments > 0 ? + : null }
; }; From 66a890458c7548883303bd5daf974e126163798d Mon Sep 17 00:00:00 2001 From: David Jay Date: Fri, 24 Feb 2017 17:42:29 -0500 Subject: [PATCH 17/22] Adding sort to moderation queue. --- .../ModerationQueue/ModerationContainer.js | 3 +- .../components/ModerationMenu.js | 82 ++++++++++++------- .../ModerationQueue/components/styles.css | 44 ++++++++++ .../coral-admin/src/graphql/queries/index.js | 20 ++++- .../src/graphql/queries/modQueueQuery.graphql | 11 ++- 5 files changed, 123 insertions(+), 37 deletions(-) diff --git a/client/coral-admin/src/containers/ModerationQueue/ModerationContainer.js b/client/coral-admin/src/containers/ModerationQueue/ModerationContainer.js index b1a44533e..d3e2f9194 100644 --- a/client/coral-admin/src/containers/ModerationQueue/ModerationContainer.js +++ b/client/coral-admin/src/containers/ModerationQueue/ModerationContainer.js @@ -43,7 +43,7 @@ class ModerationContainer extends Component { } render () { - const {data, moderation, settings, assets, ...props} = this.props; + const {data, moderation, settings, assets, modQueueResort, ...props} = this.props; const providedAssetId = this.props.params.id; const activeTab = this.props.route.path === ':id' ? 'premod' : this.props.route.path; @@ -73,6 +73,7 @@ class ModerationContainer extends Component { premodCount={data.premodCount} rejectedCount={data.rejectedCount} flaggedCount={data.flaggedCount} + modQueueResort={modQueueResort} /> { - const premodPath = asset ? `/admin/moderate/premod/${asset.id}` : '/admin/moderate/premod'; - const rejectPath = asset ? `/admin/moderate/rejected/${asset.id}` : '/admin/moderate/rejected'; - const flagPath = asset ? `/admin/moderate/flagged/${asset.id}` : '/admin/moderate/flagged'; - return ( -
-
-
- - {lang.t('modqueue.premod')} - - - {lang.t('modqueue.rejected')} - - - {lang.t('modqueue.flagged')} - +class ModerationMenu extends Component { + state = { + sort: '', + } + + static propTypes = { + premodCount: PropTypes.number.isRequired, + rejectedCount: PropTypes.number.isRequired, + flaggedCount: PropTypes.number.isRequired, + asset: PropTypes.shape({ + id: PropTypes.string + }) + } + + selectSort = (sort) => { + this.setState({sort}); + this.props.modQueueResort(sort); + } + + render() { + const {asset, premodCount, rejectedCount, flaggedCount} = this.props; + const premodPath = asset ? `/admin/moderate/premod/${asset.id}` : '/admin/moderate/premod'; + const rejectPath = asset ? `/admin/moderate/rejected/${asset.id}` : '/admin/moderate/rejected'; + const flagPath = asset ? `/admin/moderate/flagged/${asset.id}` : '/admin/moderate/flagged'; + return ( +
+
+
+
+ + {lang.t('modqueue.premod')} + + + {lang.t('modqueue.rejected')} + + + {lang.t('modqueue.flagged')} + +
+ this.selectSort(sort)}> + + +
-
- ); -}; - -ModerationMenu.propTypes = { - premodCount: PropTypes.number.isRequired, - rejectedCount: PropTypes.number.isRequired, - flaggedCount: PropTypes.number.isRequired, - asset: PropTypes.shape({ - id: PropTypes.string - }) -}; + ); + } +} export default ModerationMenu; diff --git a/client/coral-admin/src/containers/ModerationQueue/components/styles.css b/client/coral-admin/src/containers/ModerationQueue/components/styles.css index e2fd31911..27d5c2533 100644 --- a/client/coral-admin/src/containers/ModerationQueue/components/styles.css +++ b/client/coral-admin/src/containers/ModerationQueue/components/styles.css @@ -8,6 +8,12 @@ .tabBar { background-color: rgba(44, 44, 44, 0.89); z-index: 5; + display: flex; + justify-content: space-between; +} + +.tabBarPadding { + width: 150px; } .tab { @@ -334,3 +340,41 @@ span { font-weight: 500; } } + +.selectField { + position: relative; + width: 140px; + height: 36px; + top: 5px; + margin-right: 10px; + background: #FFF; + padding: 10px 15px; + box-sizing: border-box; + border-radius: 2px; + box-shadow: 0 2px 2px 0 rgba(0,0,0,.14), 0 3px 1px -2px rgba(0,0,0,.2), 0 1px 5px 0 rgba(0,0,0,.12); + + > div { + padding: 0; + } + + i { + position: absolute; + top: 7px; + right: 7px; + } + + input { + padding: 0; + font-size: 13px; + letter-spacing: 0.7px; + font-weight: 400; + } + + label { + top: -4px; + } + + &:hover { + cursor: pointer; + } +} diff --git a/client/coral-admin/src/graphql/queries/index.js b/client/coral-admin/src/graphql/queries/index.js index 3325249e1..809769a13 100644 --- a/client/coral-admin/src/graphql/queries/index.js +++ b/client/coral-admin/src/graphql/queries/index.js @@ -23,8 +23,24 @@ export const modQueueQuery = graphql(MOD_QUEUE_QUERY, { options: ({params: {id = null}}) => { return { variables: { - asset_id: id + asset_id: id, + sort: 'REVERSE_CHRONOLOGICAL' } }; - } + }, + props: ({ownProps: {params: {id = null}}, data}) => ({ + data, + modQueueResort: modQueueResort(id, data.fetchMore) + }) }); + +export const modQueueResort = (id, fetchMore) => (sort) => { + return fetchMore({ + query: MOD_QUEUE_QUERY, + variables: { + asset_id: id, + sort + }, + updateQuery: (oldData, {fetchMoreResult:{data}}) => data + }); +}; diff --git a/client/coral-admin/src/graphql/queries/modQueueQuery.graphql b/client/coral-admin/src/graphql/queries/modQueueQuery.graphql index 86cd26bbd..b4f2a20a0 100644 --- a/client/coral-admin/src/graphql/queries/modQueueQuery.graphql +++ b/client/coral-admin/src/graphql/queries/modQueueQuery.graphql @@ -1,16 +1,18 @@ #import "../fragments/commentView.graphql" -query ModQueue ($asset_id: ID) { +query ModQueue ($asset_id: ID, $sort: SORT_ORDER) { premod: comments(query: { statuses: [PREMOD], - asset_id: $asset_id + asset_id: $asset_id, + sort: $sort }) { ...commentView } flagged: comments(query: { action_type: FLAG, asset_id: $asset_id, - statuses: [NONE, PREMOD] + statuses: [NONE, PREMOD], + sort: $sort }) { ...commentView action_summaries { @@ -22,7 +24,8 @@ query ModQueue ($asset_id: ID) { } rejected: comments(query: { statuses: [REJECTED], - asset_id: $asset_id + asset_id: $asset_id, + sort: $sort }) { ...commentView } From d650779c1a3b83ea035ff9b0705874f15cf96996 Mon Sep 17 00:00:00 2001 From: gaba Date: Fri, 24 Feb 2017 16:08:25 -0800 Subject: [PATCH 18/22] Removes ; --- client/coral-sign-in/components/FakeComment.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/client/coral-sign-in/components/FakeComment.js b/client/coral-sign-in/components/FakeComment.js index 75d4e51f1..b5af6bf1c 100644 --- a/client/coral-sign-in/components/FakeComment.js +++ b/client/coral-sign-in/components/FakeComment.js @@ -35,7 +35,7 @@ class FakeComment extends React.Component { thumb_up -
; +
{}} parentCommentId={'commentID'} From a429af3c0e9da6b9c7ab981ca8dabeab8fa969d2 Mon Sep 17 00:00:00 2001 From: gaba Date: Fri, 24 Feb 2017 16:09:22 -0800 Subject: [PATCH 19/22] Removes varialbe not used. --- routes/api/auth/index.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/routes/api/auth/index.js b/routes/api/auth/index.js index 8bd7a1263..fc3b87e51 100644 --- a/routes/api/auth/index.js +++ b/routes/api/auth/index.js @@ -77,7 +77,7 @@ const HandleAuthPopupCallback = (req, res, next) => (err, user) => { } // We logged in the user! Let's send back the user data. - res.render('auth-callback', {err: null, data: JSON.stringify(user), changeusername: true}); + res.render('auth-callback', {err: null, data: JSON.stringify(user)}); }); }; From f85a6d4da172f9cb2d192b3e6cac72773b536862 Mon Sep 17 00:00:00 2001 From: Belen Curcio Date: Mon, 27 Feb 2017 11:49:53 -0300 Subject: [PATCH 20/22] Drawer --- .../coral-admin/src/components/ui/Drawer.css | 0 .../coral-admin/src/components/ui/Drawer.js | 49 +++++++++++++++---- .../coral-admin/src/components/ui/Header.css | 18 +++++++ .../coral-admin/src/components/ui/Header.js | 2 +- client/coral-admin/src/components/ui/Logo.js | 4 +- client/coral-admin/src/index.js | 3 ++ 6 files changed, 64 insertions(+), 12 deletions(-) create mode 100644 client/coral-admin/src/components/ui/Drawer.css diff --git a/client/coral-admin/src/components/ui/Drawer.css b/client/coral-admin/src/components/ui/Drawer.css new file mode 100644 index 000000000..e69de29bb diff --git a/client/coral-admin/src/components/ui/Drawer.js b/client/coral-admin/src/components/ui/Drawer.js index 2003ed34d..8fdf4f19d 100644 --- a/client/coral-admin/src/components/ui/Drawer.js +++ b/client/coral-admin/src/components/ui/Drawer.js @@ -1,18 +1,49 @@ import React from 'react'; import {Navigation, Drawer} from 'react-mdl'; -import {Link} from 'react-router'; -import styles from './Header.css'; +import {IndexLink, Link} from 'react-router'; +import styles from './Drawer.css'; import I18n from 'coral-framework/modules/i18n/i18n'; import translations from '../../translations.json'; -export default () => ( - - - {lang.t('configure.moderate')} - {lang.t('configure.community')} - {lang.t('configure.configure')} - +export default ({handleLogout, restricted = false}) => ( + + { !restricted ? +
+ + + {lang.t('configure.dashboard')} + + + {lang.t('configure.moderate')} + + + {lang.t('configure.streams')} + + + {lang.t('configure.community')} + + + {lang.t('configure.configure')} + + Sign Out + {`v${process.env.VERSION}`} + +
: null } ); const lang = new I18n(translations); + diff --git a/client/coral-admin/src/components/ui/Header.css b/client/coral-admin/src/components/ui/Header.css index e6cf85d23..e30cb46d7 100644 --- a/client/coral-admin/src/components/ui/Header.css +++ b/client/coral-admin/src/components/ui/Header.css @@ -1,7 +1,25 @@ +@custom-media --table-viewport (max-width: 1024px); + +@media (--table-viewport) { + .logo { + margin-left: 58px; + h1 { + background: #696969; + } + span { + color: #fcfcfc; + } + } + .nav { + display: none; + } +} + .header { background-color: transparent; box-shadow: none; min-height: 58px; + display: block; } .header > div { diff --git a/client/coral-admin/src/components/ui/Header.js b/client/coral-admin/src/components/ui/Header.js index 141d7fecf..556b33b6c 100644 --- a/client/coral-admin/src/components/ui/Header.js +++ b/client/coral-admin/src/components/ui/Header.js @@ -8,7 +8,7 @@ import {Logo} from './Logo'; export default ({handleLogout, restricted = false}) => (
- + { !restricted ?
diff --git a/client/coral-admin/src/components/ui/Logo.js b/client/coral-admin/src/components/ui/Logo.js index 05a7707d7..8c57cde11 100644 --- a/client/coral-admin/src/components/ui/Logo.js +++ b/client/coral-admin/src/components/ui/Logo.js @@ -2,8 +2,8 @@ import React from 'react'; import styles from './Logo.css'; import {CoralLogo} from 'coral-ui'; -export const Logo = () => ( -
+export const Logo = ({className = ''}) => ( +

Talk diff --git a/client/coral-admin/src/index.js b/client/coral-admin/src/index.js index 306461dd0..00190847a 100644 --- a/client/coral-admin/src/index.js +++ b/client/coral-admin/src/index.js @@ -7,6 +7,9 @@ import store from './services/store'; import App from './components/App'; +import 'react-mdl/extra/material.css'; +import 'react-mdl/extra/material.js'; + render( From e8a92b768c4851d1efd79b8cd9828dcb99a14551 Mon Sep 17 00:00:00 2001 From: Belen Curcio Date: Mon, 27 Feb 2017 11:52:21 -0300 Subject: [PATCH 21/22] logout and version in drawer --- client/coral-admin/src/components/ui/Layout.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/client/coral-admin/src/components/ui/Layout.js b/client/coral-admin/src/components/ui/Layout.js index 46c7aa7fa..f28e8dd80 100644 --- a/client/coral-admin/src/components/ui/Layout.js +++ b/client/coral-admin/src/components/ui/Layout.js @@ -6,8 +6,8 @@ import styles from './Layout.css'; export const Layout = ({children, ...props}) => ( -
- +
+
{children}
From 37b08fd4e400ea26947a340654d46605a5b45300 Mon Sep 17 00:00:00 2001 From: David Jay Date: Mon, 27 Feb 2017 12:28:13 -0500 Subject: [PATCH 22/22] Displaying oldest first by default. --- .../src/containers/ModerationQueue/components/ModerationMenu.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/client/coral-admin/src/containers/ModerationQueue/components/ModerationMenu.js b/client/coral-admin/src/containers/ModerationQueue/components/ModerationMenu.js index a0f6b970b..d2520f784 100644 --- a/client/coral-admin/src/containers/ModerationQueue/components/ModerationMenu.js +++ b/client/coral-admin/src/containers/ModerationQueue/components/ModerationMenu.js @@ -10,7 +10,7 @@ const lang = new I18n(translations); class ModerationMenu extends Component { state = { - sort: '', + sort: 'REVERSE_CHRONOLOGICAL', } static propTypes = {