From abed842c23b40ff33e90f894f38c9ead08cf1003 Mon Sep 17 00:00:00 2001 From: Chi Vinh Le Date: Fri, 21 Jul 2017 02:27:59 +0700 Subject: [PATCH 1/6] Quick fix inconsistent state --- .../client/containers/Comment.js | 14 ++++++++++++++ .../client/containers/TabPane.js | 2 +- 2 files changed, 15 insertions(+), 1 deletion(-) diff --git a/plugins/talk-plugin-featured-comments/client/containers/Comment.js b/plugins/talk-plugin-featured-comments/client/containers/Comment.js index bba764a1d..a5c250d60 100644 --- a/plugins/talk-plugin-featured-comments/client/containers/Comment.js +++ b/plugins/talk-plugin-featured-comments/client/containers/Comment.js @@ -31,6 +31,20 @@ export default withFragments({ name } } + + ## + # Figure out why do we need this. + # Currently without this loading more featured comments + # brings apollo into an inconsistent state. + action_summaries { + __typename + count + current_user { + id + } + } + ## + user { id username diff --git a/plugins/talk-plugin-featured-comments/client/containers/TabPane.js b/plugins/talk-plugin-featured-comments/client/containers/TabPane.js index e9d466061..3a082e732 100644 --- a/plugins/talk-plugin-featured-comments/client/containers/TabPane.js +++ b/plugins/talk-plugin-featured-comments/client/containers/TabPane.js @@ -47,7 +47,7 @@ class TabPaneContainer extends React.Component { } const LOAD_MORE_QUERY = gql` - query CoralEmbedStream_LoadMoreComments($limit: Int = 5, $cursor: Date, $asset_id: ID, $sort: SORT_ORDER, $excludeIgnored: Boolean) { + query TalkFeaturedComments_LoadMoreComments($limit: Int = 5, $cursor: Date, $asset_id: ID, $sort: SORT_ORDER, $excludeIgnored: Boolean) { comments(query: {limit: $limit, cursor: $cursor, tags: ["FEATURED"], asset_id: $asset_id, sort: $sort, excludeIgnored: $excludeIgnored}) { nodes { ...${getDefinitionName(Comment.fragments.comment)} From 0e37f36e020c61d2da8ad67b91f97e98ef26075a Mon Sep 17 00:00:00 2001 From: Chi Vinh Le Date: Fri, 21 Jul 2017 02:36:04 +0700 Subject: [PATCH 2/6] Show featured tag on replies too --- plugins/talk-plugin-featured-comments/client/components/Tag.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/plugins/talk-plugin-featured-comments/client/components/Tag.js b/plugins/talk-plugin-featured-comments/client/components/Tag.js index 4afa9629a..8e1cb428d 100644 --- a/plugins/talk-plugin-featured-comments/client/components/Tag.js +++ b/plugins/talk-plugin-featured-comments/client/components/Tag.js @@ -6,7 +6,7 @@ import {isTagged} from 'plugin-api/beta/client/utils'; export default (props) => ( { - isTagged(props.comment.tags, 'FEATURED') && props.depth === 0 ? ( + isTagged(props.comment.tags, 'FEATURED') ? ( {t('talk-plugin-featured-comments.featured')} From 65500eda64919bfdfbb7994953520e5167fccca3 Mon Sep 17 00:00:00 2001 From: Chi Vinh Le Date: Fri, 21 Jul 2017 03:57:32 +0700 Subject: [PATCH 3/6] Remove remaining username alias in post comment mutation --- client/coral-embed-stream/src/graphql/index.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/client/coral-embed-stream/src/graphql/index.js b/client/coral-embed-stream/src/graphql/index.js index 7ca22a5f4..79d13ecac 100644 --- a/client/coral-embed-stream/src/graphql/index.js +++ b/client/coral-embed-stream/src/graphql/index.js @@ -84,7 +84,7 @@ const extension = { } user { id - name: username + username } action_summaries { count @@ -143,7 +143,7 @@ const extension = { user: { __typename: 'User', id: auth.toJS().user.id, - name: auth.toJS().user.username + username: auth.toJS().user.username }, created_at: new Date().toISOString(), body, From 7ca7166c7a18e16013a819b2515a82e980f9caf7 Mon Sep 17 00:00:00 2001 From: Chi Vinh Le Date: Fri, 21 Jul 2017 04:08:43 +0700 Subject: [PATCH 4/6] Add clarification --- .../talk-plugin-featured-comments/client/containers/Comment.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/plugins/talk-plugin-featured-comments/client/containers/Comment.js b/plugins/talk-plugin-featured-comments/client/containers/Comment.js index a5c250d60..2b3de19b5 100644 --- a/plugins/talk-plugin-featured-comments/client/containers/Comment.js +++ b/plugins/talk-plugin-featured-comments/client/containers/Comment.js @@ -33,7 +33,7 @@ export default withFragments({ } ## - # Figure out why do we need this. + # TODO: Remove this when we have the IntrospectionFragmentMatcher. # Currently without this loading more featured comments # brings apollo into an inconsistent state. action_summaries { From 6343a0d621736cd1ec23986ef9fa185017ec3251 Mon Sep 17 00:00:00 2001 From: Belen Curcio Date: Fri, 21 Jul 2017 16:01:43 -0300 Subject: [PATCH 5/6] Adding tooltip to badges too --- .../src/components/Comment.css | 1 + .../client/components/Tag.css | 22 ++++++++ .../client/components/Tag.js | 51 +++++++++++++++---- .../client/components/Tooltip.js | 5 +- 4 files changed, 66 insertions(+), 13 deletions(-) diff --git a/client/coral-embed-stream/src/components/Comment.css b/client/coral-embed-stream/src/components/Comment.css index 7eb2ece71..713655914 100644 --- a/client/coral-embed-stream/src/components/Comment.css +++ b/client/coral-embed-stream/src/components/Comment.css @@ -16,6 +16,7 @@ } .comment { + position: relative; padding-left: 15px; } diff --git a/plugins/talk-plugin-featured-comments/client/components/Tag.css b/plugins/talk-plugin-featured-comments/client/components/Tag.css index 8874bfa0c..88a019b5d 100644 --- a/plugins/talk-plugin-featured-comments/client/components/Tag.css +++ b/plugins/talk-plugin-featured-comments/client/components/Tag.css @@ -17,4 +17,26 @@ margin: 0px 5px; padding: 5px 5px; border-radius: 2px; +} + +.tag.on { + background-color: #1862a7; + cursor: pointer; +} + +.tooltip { + top: 36px; + left: auto; + right: 10px; +} + +.tooltip::before{ + left: auto; + right: 16px; +} + +.tooltip::after{ + left: auto; + right: 16px; + top: -20px; } \ No newline at end of file diff --git a/plugins/talk-plugin-featured-comments/client/components/Tag.js b/plugins/talk-plugin-featured-comments/client/components/Tag.js index 8e1cb428d..b7ee8cd6b 100644 --- a/plugins/talk-plugin-featured-comments/client/components/Tag.js +++ b/plugins/talk-plugin-featured-comments/client/components/Tag.js @@ -1,16 +1,45 @@ import React from 'react'; +import cn from 'classnames'; import styles from './Tag.css'; +import Tooltip from './Tooltip'; import {t} from 'plugin-api/beta/client/services'; import {isTagged} from 'plugin-api/beta/client/utils'; -export default (props) => ( - - { - isTagged(props.comment.tags, 'FEATURED') ? ( - - {t('talk-plugin-featured-comments.featured')} - - ) : null - } - -); +export default class Tag extends React.Component { + constructor() { + super(); + + this.state = { + tooltip: false + }; + + } + + showTooltip = () => { + this.setState({ + tooltip: true + }); + } + + hideTooltip = () => { + this.setState({ + tooltip: false + }); + } + + render() { + const {tooltip} = this.state; + return( +
+ { + isTagged(this.props.comment.tags, 'FEATURED') ? ( + + {t('talk-plugin-featured-comments.featured')} + + ) : null + } + {tooltip && } +
+ ); + } +} diff --git a/plugins/talk-plugin-featured-comments/client/components/Tooltip.js b/plugins/talk-plugin-featured-comments/client/components/Tooltip.js index c57336d05..f98d4c0d5 100644 --- a/plugins/talk-plugin-featured-comments/client/components/Tooltip.js +++ b/plugins/talk-plugin-featured-comments/client/components/Tooltip.js @@ -1,10 +1,11 @@ import React from 'react'; +import cn from 'classnames'; import styles from './Tooltip.css'; import {t} from 'plugin-api/beta/client/services'; import {Icon} from 'plugin-api/beta/client/components/ui'; -export default () => ( -
+export default ({className = ''}) => ( +

{t('talk-plugin-featured-comments.featured_comments')}: From 25bccde40f194268bf8aa193303360874ebee2af Mon Sep 17 00:00:00 2001 From: Belen Curcio Date: Fri, 21 Jul 2017 16:08:18 -0300 Subject: [PATCH 6/6] fix --- .../src/routes/Moderation/components/StorySearch.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/client/coral-admin/src/routes/Moderation/components/StorySearch.css b/client/coral-admin/src/routes/Moderation/components/StorySearch.css index 2df130ec4..973d97c24 100644 --- a/client/coral-admin/src/routes/Moderation/components/StorySearch.css +++ b/client/coral-admin/src/routes/Moderation/components/StorySearch.css @@ -74,7 +74,7 @@ cursor: pointer; display: block; text-decoration: none; - height: 50px; + min-height: 50px; box-sizing: border-box; transition: background-color 400ms;