replaced eslint:recommended with prettier

plugins/talk-plugin-featured-comments/client/actions.js

@@ -1,4 +1,4 @@
-import {OPEN_FEATURED_DIALOG, CLOSE_FEATURED_DIALOG} from './constants';
+import { OPEN_FEATURED_DIALOG, CLOSE_FEATURED_DIALOG } from './constants';
 
 export const openFeaturedDialog = (comment, asset) => ({
   type: OPEN_FEATURED_DIALOG,

plugins/talk-plugin-featured-comments/client/components/Comment.js

@@ -1,24 +1,27 @@
 import React from 'react';
 import cn from 'classnames';
 import styles from './Comment.css';
-import {t} from 'plugin-api/beta/client/services';
-import {Slot, CommentAuthorName, CommentTimestamp, CommentContent} from 'plugin-api/beta/client/components';
-import {Icon} from 'plugin-api/beta/client/components/ui';
-import {pluginName} from '../../package.json';
+import { t } from 'plugin-api/beta/client/services';
+import {
+  Slot,
+  CommentAuthorName,
+  CommentTimestamp,
+  CommentContent,
+} from 'plugin-api/beta/client/components';
+import { Icon } from 'plugin-api/beta/client/components/ui';
+import { pluginName } from '../../package.json';
 import FeaturedButton from '../containers/FeaturedButton';
 
 class Comment extends React.Component {
-
   viewComment = () => {
     this.props.viewComment(this.props.comment.id);
-  }
+  };
 
   render() {
-    const {comment, asset, root, data} = this.props;
-    const queryData = {comment, asset, root};
+    const { comment, asset, root, data } = this.props;
+    const queryData = { comment, asset, root };
     return (
       <div className={cn(styles.root, `${pluginName}-comment`)}>
-
         <Slot
           component={'blockquote'}
           className={cn(styles.quote, `${pluginName}-comment-body`)}
@@ -29,7 +32,6 @@ class Comment extends React.Component {
         />
 
         <div className={cn(`${pluginName}-comment-username-box`)}>
-
           <Slot
             className={cn(styles.username, `${pluginName}-comment-username`)}
             fill="commentAuthorName"
@@ -51,8 +53,13 @@ class Comment extends React.Component {
         </div>
 
         <footer className={cn(styles.footer, `${pluginName}-comment-footer`)}>
-          <div className={cn('talk-embed-stream-comment-actions-container-left', styles.reactionsContainer, `${pluginName}-comment-reactions`)}>
-
+          <div
+            className={cn(
+              'talk-embed-stream-comment-actions-container-left',
+              styles.reactionsContainer,
+              `${pluginName}-comment-reactions`
+            )}
+          >
             <Slot
               fill="commentReactions"
               root={root}
@@ -69,9 +76,21 @@ class Comment extends React.Component {
               asset={asset}
             />
           </div>
-          <div className={cn('talk-embed-stream-comment-actions-container-right', styles.actionsContainer, `${pluginName}-comment-actions`)}>
-            <button className={cn(styles.goTo, `${pluginName}-comment-go-to`)} onClick={this.viewComment}>
-              <Icon name="forum" className={styles.repliesIcon} /> {comment.replyCount} | {t('talk-plugin-featured-comments.go_to_conversation')} <Icon name="keyboard_arrow_right" className={styles.goToIcon} />
+          <div
+            className={cn(
+              'talk-embed-stream-comment-actions-container-right',
+              styles.actionsContainer,
+              `${pluginName}-comment-actions`
+            )}
+          >
+            <button
+              className={cn(styles.goTo, `${pluginName}-comment-go-to`)}
+              onClick={this.viewComment}
+            >
+              <Icon name="forum" className={styles.repliesIcon} />{' '}
+              {comment.replyCount} |{' '}
+              {t('talk-plugin-featured-comments.go_to_conversation')}{' '}
+              <Icon name="keyboard_arrow_right" className={styles.goToIcon} />
             </button>
           </div>
         </footer>

plugins/talk-plugin-featured-comments/client/components/FeaturedButton.js

@@ -1,25 +1,29 @@
 import React from 'react';
 import cn from 'classnames';
 import styles from './FeaturedButton.css';
-import {pluginName} from '../../package.json';
-import {can} from 'plugin-api/beta/client/services';
-import {Icon} from 'plugin-api/beta/client/components/ui';
+import { pluginName } from '../../package.json';
+import { can } from 'plugin-api/beta/client/services';
+import { Icon } from 'plugin-api/beta/client/components/ui';
 
-const FeaturedButton = (props) => {
-  const {alreadyTagged, deleteTag, postTag, user} = props;
+const FeaturedButton = props => {
+  const { alreadyTagged, deleteTag, postTag, user } = props;
 
   return can(user, 'MODERATE_COMMENTS') ? (
     <button
-      className={cn([`${pluginName}-tag-button`, styles.button, {[styles.featured] : alreadyTagged}])}
-      onClick={alreadyTagged ? deleteTag : postTag} >
-
-      {alreadyTagged ?
-        <Icon name="star" className={styles.icon} /> :
+      className={cn([
+        `${pluginName}-tag-button`,
+        styles.button,
+        { [styles.featured]: alreadyTagged },
+      ])}
+      onClick={alreadyTagged ? deleteTag : postTag}
+    >
+      {alreadyTagged ? (
+        <Icon name="star" className={styles.icon} />
+      ) : (
         <Icon name="star_border" className={styles.icon} />
-      }
-
+      )}
     </button>
-  ) : null ;
+  ) : null;
 };
 
 export default FeaturedButton;

plugins/talk-plugin-featured-comments/client/components/FeaturedDialog.js

@@ -1,13 +1,16 @@
 import React from 'react';
 import cn from 'classnames';
 import PropTypes from 'prop-types';
-import {Dialog} from 'coral-ui';
+import { Dialog } from 'coral-ui';
 import styles from './FeaturedDialog.css';
-import {t} from 'plugin-api/beta/client/services';
+import { t } from 'plugin-api/beta/client/services';
 import Button from 'coral-ui/components/Button';
 
-const FeaturedDialog = ({showFeaturedDialog, closeFeaturedDialog, postTag}) => {
-
+const FeaturedDialog = ({
+  showFeaturedDialog,
+  closeFeaturedDialog,
+  postTag,
+}) => {
   const onPerform = async () => {
     await postTag();
     await closeFeaturedDialog();
@@ -18,9 +21,14 @@ const FeaturedDialog = ({showFeaturedDialog, closeFeaturedDialog, postTag}) => {
       className={cn(styles.dialog, 'talk-featured-dialog')}
       id="talkFeaturedDialog"
       open={showFeaturedDialog}
-      onCancel={closeFeaturedDialog} >
-      <span className={styles.close} onClick={closeFeaturedDialog}>×</span>
-      <h2 className={styles.header}>{t('talk-plugin-featured-comments.feature_comment')}</h2>
+      onCancel={closeFeaturedDialog}
+    >
+      <span className={styles.close} onClick={closeFeaturedDialog}>
+        ×
+      </span>
+      <h2 className={styles.header}>
+        {t('talk-plugin-featured-comments.feature_comment')}
+      </h2>
       <div className={styles.content}>
         {t('talk-plugin-featured-comments.are_you_sure')}
       </div>
@@ -29,14 +37,16 @@ const FeaturedDialog = ({showFeaturedDialog, closeFeaturedDialog, postTag}) => {
           className={cn(styles.cancel, 'talk-featured-dialog-button-cancel')}
           cStyle="cancel"
           onClick={closeFeaturedDialog}
-          raised >
+          raised
+        >
           {t('talk-plugin-featured-comments.cancel')}
         </Button>
-        <Button 
+        <Button
           className={cn(styles.perform, 'talk-featured-dialog-button-confirm')}
           cStyle="black"
           onClick={onPerform}
-          raised >
+          raised
+        >
           {t('talk-plugin-featured-comments.yes_feature_comment')}
         </Button>
       </div>

plugins/talk-plugin-featured-comments/client/components/InfoIcon.js

@@ -1,11 +1,11 @@
 import React from 'react';
 import styles from './InfoIcon.css';
 import cn from 'classnames';
-import {Icon} from 'plugin-api/beta/client/components/ui';
+import { Icon } from 'plugin-api/beta/client/components/ui';
 
-export default ({hover}) => (
+export default ({ hover }) => (
   <Icon
     name="info_outline"
-    className={cn(styles.infoIcon, {[styles.on]: hover})}
+    className={cn(styles.infoIcon, { [styles.on]: hover })}
   />
 );

plugins/talk-plugin-featured-comments/client/components/LoadMore.js

@@ -1,18 +1,20 @@
 import React from 'react';
 import PropTypes from 'prop-types';
-import {Button} from 'coral-ui';
+import { Button } from 'coral-ui';
 import t from 'coral-framework/services/i18n';
 import cn from 'classnames';
 
 class LoadMore extends React.Component {
-  render () {
-    const {loadingState, loadMore} = this.props;
+  render() {
+    const { loadingState, loadMore } = this.props;
     const disabled = loadingState === 'loading';
     return (
-      <div className='talk-load-more'>
+      <div className="talk-load-more">
         <Button
           onClick={loadMore}
-          className={cn('talk-load-more-button', {[`talk-load-more-button-${loadingState}`]: loadingState})}
+          className={cn('talk-load-more-button', {
+            [`talk-load-more-button-${loadingState}`]: loadingState,
+          })}
           disabled={disabled}
         >
           {t('framework.view_more_comments')}

plugins/talk-plugin-featured-comments/client/components/ModActionButton.js

@@ -1,58 +1,62 @@
 import React from 'react';
 import cn from 'classnames';
 import styles from './ModActionButton.css';
-import {pluginName} from '../../package.json';
-import {t} from 'plugin-api/beta/client/services';
-import {Icon} from 'plugin-api/beta/client/components/ui';
+import { pluginName } from '../../package.json';
+import { t } from 'plugin-api/beta/client/services';
+import { Icon } from 'plugin-api/beta/client/components/ui';
 
 export class ModActionButton extends React.Component {
   constructor() {
     super();
 
     this.state = {
-      on: false
+      on: false,
     };
-
   }
 
-  handleMouseEnter = (e) => {
+  handleMouseEnter = e => {
     e.preventDefault();
     this.setState({
-      on: true
+      on: true,
     });
-  }
+  };
 
-  handleMouseLeave = (e) => {
+  handleMouseLeave = e => {
     e.preventDefault();
     this.setState({
-      on: false
+      on: false,
     });
-  }
+  };
 
   handleDeleteTag = () => {
     this.props.deleteTag();
     this.props.closeMenu();
-  }
+  };
 
   handlePostTag = () => {
     this.props.postTag();
     this.props.closeMenu();
-  }
+  };
 
   render() {
-    const {alreadyTagged} = this.props;
-    const {handleDeleteTag, handlePostTag} = this;
+    const { alreadyTagged } = this.props;
+    const { handleDeleteTag, handlePostTag } = this;
 
     return (
-      <button className={cn(`${pluginName}-tag-button`, styles.button, {[styles.featured] : alreadyTagged})}
+      <button
+        className={cn(`${pluginName}-tag-button`, styles.button, {
+          [styles.featured]: alreadyTagged,
+        })}
         onClick={alreadyTagged ? handleDeleteTag : handlePostTag}
         onMouseEnter={this.handleMouseEnter}
-        onMouseLeave={this.handleMouseLeave} >
-
+        onMouseLeave={this.handleMouseLeave}
+      >
         {alreadyTagged ? (
           <span className={styles.approved}>
             <Icon name="star" className={styles.icon} />
-            {!this.state.on ? t('talk-plugin-featured-comments.featured') : t('talk-plugin-featured-comments.un_feature')}
+            {!this.state.on
+              ? t('talk-plugin-featured-comments.featured')
+              : t('talk-plugin-featured-comments.un_feature')}
           </span>
         ) : (
           <span>
@@ -60,11 +64,9 @@ export class ModActionButton extends React.Component {
             {t('talk-plugin-featured-comments.feature')}
           </span>
         )}
-
       </button>
     );
   }
 }
 
 export default ModActionButton;
-

plugins/talk-plugin-featured-comments/client/components/ModTag.js

@@ -2,53 +2,60 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import cn from 'classnames';
 import styles from './ModTag.css';
-import {t} from 'plugin-api/beta/client/services';
-import {Icon} from 'plugin-api/beta/client/components/ui';
+import { t } from 'plugin-api/beta/client/services';
+import { Icon } from 'plugin-api/beta/client/components/ui';
 
 export default class ModTag extends React.Component {
   constructor() {
     super();
 
     this.state = {
-      on: false
+      on: false,
     };
-
   }
 
-  handleMouseEnter = (e) => {
+  handleMouseEnter = e => {
     e.preventDefault();
     this.setState({
-      on: true
+      on: true,
     });
-  }
+  };
 
-  handleMouseLeave = (e) => {
+  handleMouseLeave = e => {
     e.preventDefault();
     this.setState({
-      on: false
+      on: false,
     });
-  }
+  };
 
   openFeaturedDialog = (comment, asset) => {
     this.props.openFeaturedDialog(comment, asset);
-  }
+  };
 
   render() {
-    const {alreadyTagged, deleteTag, comment, asset} = this.props;
+    const { alreadyTagged, deleteTag, comment, asset } = this.props;
 
     return alreadyTagged ? (
-      <span className={cn(styles.tag, styles.featured)}
+      <span
+        className={cn(styles.tag, styles.featured)}
         onClick={deleteTag}
         onMouseEnter={this.handleMouseEnter}
-        onMouseLeave={this.handleMouseLeave} >
+        onMouseLeave={this.handleMouseLeave}
+      >
         <Icon name="star_outline" className={cn(styles.tagIcon)} />
-        {!this.state.on ? t('talk-plugin-featured-comments.featured') : t('talk-plugin-featured-comments.un_feature')}
+        {!this.state.on
+          ? t('talk-plugin-featured-comments.featured')
+          : t('talk-plugin-featured-comments.un_feature')}
       </span>
     ) : (
-      <span className={cn(styles.tag, {[styles.featured]: alreadyTagged})}
-        onClick={() => this.openFeaturedDialog(comment, asset)} >
+      <span
+        className={cn(styles.tag, { [styles.featured]: alreadyTagged })}
+        onClick={() => this.openFeaturedDialog(comment, asset)}
+      >
         <Icon name="star_outline" className={cn(styles.tagIcon)} />
-        {alreadyTagged ? t('talk-plugin-featured-comments.featured') : t('talk-plugin-featured-comments.feature')}
+        {alreadyTagged
+          ? t('talk-plugin-featured-comments.featured')
+          : t('talk-plugin-featured-comments.feature')}
       </span>
     );
   }

plugins/talk-plugin-featured-comments/client/components/Tab.js

@@ -1,15 +1,17 @@
 import React from 'react';
-import {TabCount} from 'plugin-api/beta/client/components/ui';
+import { TabCount } from 'plugin-api/beta/client/components/ui';
 import InfoIcon from './InfoIcon';
-import {t} from 'plugin-api/beta/client/services';
+import { t } from 'plugin-api/beta/client/services';
 import Tooltip from './Tooltip';
 import PropTypes from 'prop-types';
 
-const Tab = ({active, hover, featuredCommentsCount}) => {
+const Tab = ({ active, hover, featuredCommentsCount }) => {
   return (
     <span>
       {t('talk-plugin-featured-comments.featured')}
-      <TabCount active={active} sub>{featuredCommentsCount}</TabCount>
+      <TabCount active={active} sub>
+        {featuredCommentsCount}
+      </TabCount>
       <InfoIcon hover={hover} />
       {hover && <Tooltip />}
     </span>

plugins/talk-plugin-featured-comments/client/components/TabPane.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import Comment from '../containers/Comment';
 import LoadMore from './LoadMore';
-import {getErrorMessages} from 'plugin-api/beta/client/utils';
+import { getErrorMessages } from 'plugin-api/beta/client/utils';
 
 class TabPane extends React.Component {
   state = {
@@ -9,36 +9,43 @@ class TabPane extends React.Component {
   };
 
   loadMore = () => {
-    this.setState({loadingState: 'loading'});
-    this.props.loadMore()
+    this.setState({ loadingState: 'loading' });
+    this.props
+      .loadMore()
       .then(() => {
-        this.setState({loadingState: 'success'});
+        this.setState({ loadingState: 'success' });
       })
-      .catch((error) => {
-        this.setState({loadingState: 'error'});
+      .catch(error => {
+        this.setState({ loadingState: 'error' });
         this.props.notify('error', getErrorMessages(error));
       });
-  }
+  };
 
   render() {
-    const {root, data, asset: {featuredComments, ...asset}, viewComment} = this.props;
+    const {
+      root,
+      data,
+      asset: { featuredComments, ...asset },
+      viewComment,
+    } = this.props;
     return (
       <div>
-        {featuredComments.nodes.map((comment) =>
+        {featuredComments.nodes.map(comment => (
           <Comment
             key={comment.id}
             root={root}
             data={data}
             comment={comment}
             asset={asset}
-            viewComment={viewComment} />
-        )}
-        {featuredComments.hasNextPage &&
+            viewComment={viewComment}
+          />
+        ))}
+        {featuredComments.hasNextPage && (
           <LoadMore
             loadMore={this.loadMore}
             loadingState={this.state.loadingState}
           />
-        }
+        )}
       </div>
     );
   }

plugins/talk-plugin-featured-comments/client/components/Tag.js

@@ -2,39 +2,49 @@ 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 { t } from 'plugin-api/beta/client/services';
 
 export default class Tag extends React.Component {
   constructor() {
     super();
 
     this.state = {
-      tooltip: false
+      tooltip: false,
     };
-
   }
 
-  showTooltip = (e) => {
+  showTooltip = e => {
     e.preventDefault();
     this.setState({
-      tooltip: true
+      tooltip: true,
     });
-  }
+  };
 
-  hideTooltip = (e) => {
+  hideTooltip = e => {
     e.preventDefault();
     this.setState({
-      tooltip: false
+      tooltip: false,
     });
-  }
+  };
 
   render() {
-    const {tooltip} = this.state;
-    return(
-      <span className={cn(styles.tagContainer, styles.noSelect)} onMouseEnter={this.showTooltip}
-        onMouseLeave={this.hideTooltip} onTouchStart={this.showTooltip}
-        onTouchEnd={this.hideTooltip} >
-        <span className={cn(styles.tag, styles.noSelect, {[styles.on]: tooltip}, 'talk-stream-comment-featured-tag-label')}>
+    const { tooltip } = this.state;
+    return (
+      <span
+        className={cn(styles.tagContainer, styles.noSelect)}
+        onMouseEnter={this.showTooltip}
+        onMouseLeave={this.hideTooltip}
+        onTouchStart={this.showTooltip}
+        onTouchEnd={this.hideTooltip}
+      >
+        <span
+          className={cn(
+            styles.tag,
+            styles.noSelect,
+            { [styles.on]: tooltip },
+            'talk-stream-comment-featured-tag-label'
+          )}
+        >
           {t('talk-plugin-featured-comments.featured')}
         </span>
         {tooltip && <Tooltip className={styles.tooltip} />}

plugins/talk-plugin-featured-comments/client/components/Tooltip.js

@@ -1,10 +1,10 @@
 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';
+import { t } from 'plugin-api/beta/client/services';
+import { Icon } from 'plugin-api/beta/client/components/ui';
 
-export default ({className = ''}) => (
+export default ({ className = '' }) => (
   <div className={cn(styles.tooltip, className)}>
     <Icon name="info_outline" className={styles.icon} />
     <h3 className={styles.headline}>

plugins/talk-plugin-featured-comments/client/containers/Comment.js

@@ -1,13 +1,9 @@
-import {gql} from 'react-apollo';
+import { gql } from 'react-apollo';
 import Comment from '../components/Comment';
-import {withFragments} from 'plugin-api/beta/client/hocs';
-import {getSlotFragmentSpreads} from 'plugin-api/beta/client/utils';
+import { withFragments } from 'plugin-api/beta/client/hocs';
+import { getSlotFragmentSpreads } from 'plugin-api/beta/client/utils';
 
-const slots = [
-  'commentReactions',
-  'commentAuthorName',
-  'commentTimestamp',
-];
+const slots = ['commentReactions', 'commentAuthorName', 'commentTimestamp'];
 
 export default withFragments({
   root: gql`
@@ -39,5 +35,5 @@ export default withFragments({
       }
       ${getSlotFragmentSpreads(slots, 'comment')}
     }
-  `
+  `,
 })(Comment);

plugins/talk-plugin-featured-comments/client/containers/FeaturedButton.js

@@ -1,4 +1,4 @@
 import FeaturedButton from '../components/FeaturedButton';
-import {withTags} from 'plugin-api/beta/client/hocs';
+import { withTags } from 'plugin-api/beta/client/hocs';
 
 export default withTags('featured')(FeaturedButton);

plugins/talk-plugin-featured-comments/client/containers/FeaturedDialog.js

@@ -1,23 +1,26 @@
-import {compose} from 'react-apollo';
-import {bindActionCreators} from 'redux';
+import { compose } from 'react-apollo';
+import { bindActionCreators } from 'redux';
 import FeaturedDialog from '../components/FeaturedDialog';
-import {withTags, connect} from 'plugin-api/beta/client/hocs';
-import {closeFeaturedDialog} from '../actions';
+import { withTags, connect } from 'plugin-api/beta/client/hocs';
+import { closeFeaturedDialog } from '../actions';
 
-const mapStateToProps = ({talkPluginFeaturedComments: state}) => ({
+const mapStateToProps = ({ talkPluginFeaturedComments: state }) => ({
   showFeaturedDialog: state.showFeaturedDialog,
   comment: state.comment,
   asset: state.asset,
 });
 
-const mapDispatchToProps = (dispatch) =>
-  bindActionCreators({
-    closeFeaturedDialog,
-  }, dispatch);
+const mapDispatchToProps = dispatch =>
+  bindActionCreators(
+    {
+      closeFeaturedDialog,
+    },
+    dispatch
+  );
 
 const enhance = compose(
   connect(mapStateToProps, mapDispatchToProps),
-  withTags('featured'),
+  withTags('featured')
 );
 
 export default enhance(FeaturedDialog);

plugins/talk-plugin-featured-comments/client/containers/ModActionButton.js

@@ -1,17 +1,20 @@
-import {compose} from 'react-apollo';
-import {bindActionCreators} from 'redux';
+import { compose } from 'react-apollo';
+import { bindActionCreators } from 'redux';
 import ModActionButton from '../components/ModActionButton';
-import {withTags, connect} from 'plugin-api/beta/client/hocs';
-import {closeMenu} from 'plugins/talk-plugin-moderation-actions/client/actions';
+import { withTags, connect } from 'plugin-api/beta/client/hocs';
+import { closeMenu } from 'plugins/talk-plugin-moderation-actions/client/actions';
 
-const mapDispatchToProps = (dispatch) =>
-  bindActionCreators({
-    closeMenu,
-  }, dispatch);
+const mapDispatchToProps = dispatch =>
+  bindActionCreators(
+    {
+      closeMenu,
+    },
+    dispatch
+  );
 
 const enhance = compose(
   withTags('featured'),
-  connect(null, mapDispatchToProps),
+  connect(null, mapDispatchToProps)
 );
 
 export default enhance(ModActionButton);

plugins/talk-plugin-featured-comments/client/containers/ModSubscription.js

@@ -1,13 +1,13 @@
 import React from 'react';
-import {gql} from 'react-apollo';
-import {connect} from 'react-redux';
+import { gql } from 'react-apollo';
+import { connect } from 'react-redux';
 import Comment from 'coral-admin/src/routes/Moderation/containers/Comment';
-import {getDefinitionName} from 'coral-framework/utils';
+import { getDefinitionName } from 'coral-framework/utils';
 import truncate from 'lodash/truncate';
 import t from 'coral-framework/services/i18n';
 
 function prepareNotificationText(text) {
-  return truncate(text, {length: 50}).replace('\n', ' ');
+  return truncate(text, { length: 50 }).replace('\n', ' ');
 }
 
 class ModSubscription extends React.Component {
@@ -20,14 +20,18 @@ class ModSubscription extends React.Component {
         variables: {
           assetId: this.props.data.variables.asset_id,
         },
-        updateQuery: (prev, {subscriptionData: {data: {commentFeatured: {user, comment}}}}) => {
-          const notifyText = this.props.user.id === user.id
-            ? ''
-            : t(
-              'talk-plugin-featured-comments.notify_featured',
-              user.username,
-              prepareNotificationText(comment.body),
-            );
+        updateQuery: (
+          prev,
+          { subscriptionData: { data: { commentFeatured: { user, comment } } } }
+        ) => {
+          const notifyText =
+            this.props.user.id === user.id
+              ? ''
+              : t(
+                  'talk-plugin-featured-comments.notify_featured',
+                  user.username,
+                  prepareNotificationText(comment.body)
+                );
           return this.props.handleCommentChange(prev, comment, notifyText);
         },
       },
@@ -36,23 +40,33 @@ class ModSubscription extends React.Component {
         variables: {
           assetId: this.props.data.variables.asset_id,
         },
-        updateQuery: (prev, {subscriptionData: {data: {commentUnfeatured: {user, comment}}}}) => {
-          const notify = this.props.user.id === user.id
-            ? ''
-            : t(
-              'talk-plugin-featured-comments.notify_unfeatured',
-              user.username,
-              prepareNotificationText(comment.body),
-            );
+        updateQuery: (
+          prev,
+          {
+            subscriptionData: {
+              data: { commentUnfeatured: { user, comment } },
+            },
+          }
+        ) => {
+          const notify =
+            this.props.user.id === user.id
+              ? ''
+              : t(
+                  'talk-plugin-featured-comments.notify_unfeatured',
+                  user.username,
+                  prepareNotificationText(comment.body)
+                );
           return this.props.handleCommentChange(prev, comment, notify);
-        }
+        },
       },
     ];
-    this.subscriptions = configs.map((config) => this.props.data.subscribeToMore(config));
+    this.subscriptions = configs.map(config =>
+      this.props.data.subscribeToMore(config)
+    );
   }
 
   componentWillUnmount() {
-    this.subscriptions.forEach((unsubscribe) => unsubscribe());
+    this.subscriptions.forEach(unsubscribe => unsubscribe());
   }
 
   render() {
@@ -98,7 +112,7 @@ const COMMENT_UNFEATURED_SUBSCRIPTION = gql`
   ${Comment.fragments.comment}
 `;
 
-const mapStateToProps = (state) => ({
+const mapStateToProps = state => ({
   user: state.auth.user,
 });
 

plugins/talk-plugin-featured-comments/client/containers/ModTag.js

@@ -1,15 +1,18 @@
 import ModTag from '../components/ModTag';
-import {withTags, connect} from 'plugin-api/beta/client/hocs';
-import {gql, compose} from 'react-apollo';
-import {bindActionCreators} from 'redux';
-import {openFeaturedDialog} from '../actions';
-import {notify} from 'plugin-api/beta/client/actions/notification';
+import { withTags, connect } from 'plugin-api/beta/client/hocs';
+import { gql, compose } from 'react-apollo';
+import { bindActionCreators } from 'redux';
+import { openFeaturedDialog } from '../actions';
+import { notify } from 'plugin-api/beta/client/actions/notification';
 
-const mapDispatchToProps = (dispatch) =>
-  bindActionCreators({
-    notify,
-    openFeaturedDialog,
-  }, dispatch);
+const mapDispatchToProps = dispatch =>
+  bindActionCreators(
+    {
+      notify,
+      openFeaturedDialog,
+    },
+    dispatch
+  );
 
 const fragments = {
   comment: gql`
@@ -18,11 +21,11 @@ const fragments = {
         username
       }
     }
-  `
+  `,
 };
 const enhance = compose(
-  withTags('featured', {fragments}),
-  connect(null, mapDispatchToProps),
+  withTags('featured', { fragments }),
+  connect(null, mapDispatchToProps)
 );
 
 export default enhance(ModTag);

plugins/talk-plugin-featured-comments/client/containers/Tab.js

@@ -1,17 +1,21 @@
 import Tab from '../components/Tab';
-import {withFragments, excludeIf} from 'plugin-api/beta/client/hocs';
-import {compose, gql} from 'react-apollo';
-import {withProps} from 'recompose';
+import { withFragments, excludeIf } from 'plugin-api/beta/client/hocs';
+import { compose, gql } from 'react-apollo';
+import { withProps } from 'recompose';
 
 const enhance = compose(
   withFragments({
     asset: gql`
       fragment TalkFeaturedComments_Tab_asset on Asset {
-          featuredCommentsCount: totalCommentCount(tags: ["FEATURED"]) @skip(if: $hasComment)
-      }`,
+        featuredCommentsCount: totalCommentCount(tags: ["FEATURED"])
+          @skip(if: $hasComment)
+      }
+    `,
   }),
-  excludeIf((props) => props.asset.featuredCommentsCount === 0),
-  withProps((props) => ({featuredCommentsCount: props.asset.featuredCommentsCount})),
+  excludeIf(props => props.asset.featuredCommentsCount === 0),
+  withProps(props => ({
+    featuredCommentsCount: props.asset.featuredCommentsCount,
+  }))
 );
 
 export default enhance(Tab);

plugins/talk-plugin-featured-comments/client/containers/TabPane.js

@@ -1,16 +1,18 @@
 import React from 'react';
-import {bindActionCreators} from 'redux';
-import {compose, gql} from 'react-apollo';
+import { bindActionCreators } from 'redux';
+import { compose, gql } from 'react-apollo';
 import TabPane from '../components/TabPane';
-import {withFragments, connect} from 'plugin-api/beta/client/hocs';
+import { withFragments, connect } from 'plugin-api/beta/client/hocs';
 import Comment from '../containers/Comment';
-import {notify} from 'plugin-api/beta/client/actions/notification';
-import {viewComment} from 'coral-embed-stream/src/actions/stream';
-import {appendNewNodes, getDefinitionName} from 'plugin-api/beta/client/utils';
+import { notify } from 'plugin-api/beta/client/actions/notification';
+import { viewComment } from 'coral-embed-stream/src/actions/stream';
+import {
+  appendNewNodes,
+  getDefinitionName,
+} from 'plugin-api/beta/client/utils';
 import update from 'immutability-helper';
 
 class TabPaneContainer extends React.Component {
-
   loadMore = () => {
     return this.props.data.fetchMore({
       query: LOAD_MORE_QUERY,
@@ -22,17 +24,17 @@ class TabPaneContainer extends React.Component {
         sortBy: this.props.data.variables.sortBy,
         excludeIgnored: this.props.data.variables.excludeIgnored,
       },
-      updateQuery: (previous, {fetchMoreResult:{comments}}) => {
+      updateQuery: (previous, { fetchMoreResult: { comments } }) => {
         const updated = update(previous, {
           asset: {
             featuredComments: {
               nodes: {
-                $apply: (nodes) => appendNewNodes(nodes, comments.nodes),
+                $apply: nodes => appendNewNodes(nodes, comments.nodes),
               },
-              hasNextPage: {$set: comments.hasNextPage},
-              endCursor: {$set: comments.endCursor},
+              hasNextPage: { $set: comments.hasNextPage },
+              endCursor: { $set: comments.endCursor },
             },
-          }
+          },
         });
         return updated;
       },
@@ -40,10 +42,7 @@ class TabPaneContainer extends React.Component {
   };
 
   render() {
-    return <TabPane
-      {...this.props}
-      loadMore={this.loadMore}
-    />;
+    return <TabPane {...this.props} loadMore={this.loadMore} />;
   }
 }
 
@@ -78,11 +77,14 @@ const LOAD_MORE_QUERY = gql`
   ${Comment.fragments.comment}
 `;
 
-const mapDispatchToProps = (dispatch) =>
-  bindActionCreators({
-    viewComment,
-    notify,
-  }, dispatch);
+const mapDispatchToProps = dispatch =>
+  bindActionCreators(
+    {
+      viewComment,
+      notify,
+    },
+    dispatch
+  );
 
 const enhance = compose(
   connect(null, mapDispatchToProps),
@@ -118,7 +120,7 @@ const enhance = compose(
       ${Comment.fragments.comment}
       ${Comment.fragments.asset}
     `,
-  }),
+  })
 );
 
 export default enhance(TabPaneContainer);

plugins/talk-plugin-featured-comments/client/containers/Tag.js

@@ -1,7 +1,7 @@
-import {compose, gql} from 'react-apollo';
+import { compose, gql } from 'react-apollo';
 import Tag from '../components/Tag';
-import {isTagged} from 'plugin-api/beta/client/utils';
-import {withFragments, excludeIf} from 'plugin-api/beta/client/hocs';
+import { isTagged } from 'plugin-api/beta/client/utils';
+import { withFragments, excludeIf } from 'plugin-api/beta/client/hocs';
 
 export default compose(
   withFragments({
@@ -13,6 +13,7 @@ export default compose(
           }
         }
       }
-  `}),
-  excludeIf((props) => !isTagged(props.comment.tags, 'FEATURED'))
+    `,
+  }),
+  excludeIf(props => !isTagged(props.comment.tags, 'FEATURED'))
 )(Tag);

plugins/talk-plugin-featured-comments/client/index.js

@@ -7,11 +7,11 @@ import ModTag from './containers/ModTag';
 import ModActionButton from './containers/ModActionButton';
 import ModSubscription from './containers/ModSubscription';
 import FeaturedDialog from './containers/FeaturedDialog';
-import {gql} from 'react-apollo';
+import { gql } from 'react-apollo';
 import reducer from './reducer';
 
-import {findCommentInEmbedQuery} from 'coral-embed-stream/src/graphql/utils';
-import {prependNewNodes} from 'plugin-api/beta/client/utils';
+import { findCommentInEmbedQuery } from 'coral-embed-stream/src/graphql/utils';
+import { prependNewNodes } from 'plugin-api/beta/client/utils';
 
 export default {
   translations,
@@ -25,32 +25,35 @@ export default {
     adminCommentInfoBar: [ModTag],
   },
   mutations: {
-    IgnoreUser: ({variables}) => ({
+    IgnoreUser: ({ variables }) => ({
       updateQueries: {
-        CoralEmbedStream_Embed: (previous) => {
+        CoralEmbedStream_Embed: previous => {
           if (!previous.asset.featuredComments) {
             return previous;
           }
           const ignoredUserId = variables.id;
-          const newNodes = previous.asset.featuredComments.nodes.filter((n) => n.user.id !== ignoredUserId);
-          const removedCount =  previous.asset.featuredComments.nodes.length - newNodes.length;
+          const newNodes = previous.asset.featuredComments.nodes.filter(
+            n => n.user.id !== ignoredUserId
+          );
+          const removedCount =
+            previous.asset.featuredComments.nodes.length - newNodes.length;
           const updated = update(previous, {
             asset: {
               featuredComments: {
-                nodes: {$set: newNodes}
+                nodes: { $set: newNodes },
               },
               featuredCommentsCount: {
-                $apply: (value) => value - removedCount,
-              }
-            }
+                $apply: value => value - removedCount,
+              },
+            },
           });
           return updated;
-        }
-      }
+        },
+      },
     }),
-    AddTag: ({variables}) => ({
+    AddTag: ({ variables }) => ({
       updateQueries: {
-        CoralEmbedStream_Embed: (previous) => {
+        CoralEmbedStream_Embed: previous => {
           let updated = previous;
 
           if (variables.name !== 'FEATURED') {
@@ -64,21 +67,20 @@ export default {
               asset: {
                 featuredComments: {
                   nodes: {
-                    $apply: (nodes) => prependNewNodes(nodes, [comment]),
-                  }
+                    $apply: nodes => prependNewNodes(nodes, [comment]),
+                  },
                 },
                 featuredCommentsCount: {
-                  $apply: (value) => value + 1
+                  $apply: value => value + 1,
                 },
-              }
+              },
             });
           }
 
           return updated;
-        }
+        },
       },
-      update: (proxy) => {
-
+      update: proxy => {
         if (variables.name !== 'FEATURED') {
           return;
         }
@@ -91,16 +93,16 @@ export default {
           }
         `;
 
-        const data = proxy.readFragment({fragment, id: fragmentId});
+        const data = proxy.readFragment({ fragment, id: fragmentId });
 
         data.status = 'ACCEPTED';
 
-        proxy.writeFragment({fragment, id: fragmentId, data});
+        proxy.writeFragment({ fragment, id: fragmentId, data });
       },
     }),
-    RemoveTag: ({variables}) => ({
+    RemoveTag: ({ variables }) => ({
       updateQueries: {
-        CoralEmbedStream_Embed: (previous) => {
+        CoralEmbedStream_Embed: previous => {
           let updated = previous;
 
           if (variables.name !== 'FEATURED') {
@@ -112,20 +114,19 @@ export default {
               asset: {
                 featuredComments: {
                   nodes: {
-                    $apply: (nodes) =>
-                      nodes.filter((n) => n.id !== variables.id)
-                  }
+                    $apply: nodes => nodes.filter(n => n.id !== variables.id),
+                  },
                 },
                 featuredCommentsCount: {
-                  $apply: (value) => value - 1
-                }
-              }
+                  $apply: value => value - 1,
+                },
+              },
             });
           }
 
           return updated;
         },
-      }
-    })
+      },
+    }),
   },
 };

plugins/talk-plugin-featured-comments/client/reducer.js

@@ -1,10 +1,10 @@
-import {OPEN_FEATURED_DIALOG, CLOSE_FEATURED_DIALOG} from './constants';
+import { OPEN_FEATURED_DIALOG, CLOSE_FEATURED_DIALOG } from './constants';
 
 const initialState = {
   showFeaturedDialog: false,
   comment: {
     id: null,
-    tags: []
+    tags: [],
   },
   asset: {
     id: null,
@@ -13,20 +13,20 @@ const initialState = {
 
 export default function reducer(state = initialState, action) {
   switch (action.type) {
-  case OPEN_FEATURED_DIALOG:
-    return {
-      ...state,
-      comment: action.comment,
-      asset: action.asset,
-      showFeaturedDialog: true,
-    };
-  case CLOSE_FEATURED_DIALOG:
-    return {
-      ...state,
-      featuredCommentId: null,
-      showFeaturedDialog: false,
-    };
-  default :
-    return state;
+    case OPEN_FEATURED_DIALOG:
+      return {
+        ...state,
+        comment: action.comment,
+        asset: action.asset,
+        showFeaturedDialog: true,
+      };
+    case CLOSE_FEATURED_DIALOG:
+      return {
+        ...state,
+        featuredCommentId: null,
+        showFeaturedDialog: false,
+      };
+    default:
+      return state;
   }
 }