Global classNames, and more

.eslintignore

@@ -10,4 +10,5 @@ plugins/*
 !plugins/coral-plugin-like
 !plugins/coral-plugin-mod
 !plugins/coral-plugin-love
+!plugins/coral-plugin-viewing-options
 node_modules

client/coral-embed-stream/src/components/Comment.css

@@ -97,3 +97,7 @@
 .Wizard .textAlignRight {
   text-align: right;
 }
+
+.commentInfoBar {
+ float: right;
+}

client/coral-embed-stream/src/components/Comment.js

@@ -282,6 +282,7 @@ export default class Comment extends React.Component {
           </span>
 
           <Slot
+            className={styles.commentInfoBar}
             fill="commentInfoBar"
             depth={depth}
             comment={comment}
@@ -289,7 +290,6 @@ export default class Comment extends React.Component {
             data={this.props.data}
             root={this.props.root}
             inline
-            right
           />
 
           { (currentUser &&

client/coral-embed-stream/src/graphql/index.js

@@ -141,7 +141,7 @@ const extension = {
             parent_id,
             asset_id,
             action_summaries: [],
-            tags,
+            tags: tags.map((t) => ({name: t, __typename: 'Tag'})),
             status: null,
             replyCount: 0,
             replies: {

client/coral-embed-stream/style/default.css

@@ -493,8 +493,4 @@ button.comment__action-button[disabled],
   .commentActionsLeft.comment__action-container .coral-plugin-replies-reply-button .coral-plugin-replies-icon {
     visibility: visible;
   }
-}
-
-.offTopicComment {
-  display: none;
-}
+}

client/coral-framework/components/Slot.css

@@ -2,10 +2,6 @@
   display: inline-block;
 }
 
-.right {
-  float: right;
-}
-
 .debug {
   background-color: coral;
 }

client/coral-framework/components/Slot.js

@@ -4,9 +4,9 @@ import styles from './Slot.css';
 import {connect} from 'react-redux';
 import {getSlotElements} from 'coral-framework/helpers/plugins';
 
-function Slot ({fill, inline = false, right = false, plugin_config: config, ...rest}) {
+function Slot ({fill, inline = false, className, plugin_config: config, ...rest}) {
   return (
-    <div className={cn({[styles.inline]: inline, [styles.right]: right, [styles.debug]: config.debug})}>
+    <div className={cn({[styles.inline]: inline, [styles.debug]: config.debug}, className)}>
       {getSlotElements(fill, {...rest, config})}
     </div>
   );

plugins/coral-plugin-offtopic/client/components/styles.css

@@ -22,4 +22,6 @@
   padding: 5px 0;
 }
 
-
+:global(.offTopicComment) {
+  display: none;
+}

plugins/coral-plugin-viewing-options/client/components/ViewingOptions.js

@@ -39,4 +39,4 @@ const ViewingOptions = (props) => {
   );
 };
 
-export default ViewingOptions;
+export default ViewingOptions;

plugins/coral-plugin-viewing-options/client/constants.js

@@ -1,2 +1,2 @@
 export const OPEN_VIEWING_OPTIONS = 'OPEN_VIEWING_OPTIONS';
-export const CLOSE_VIEWING_OPTIONS = 'CLOSE_VIEWING_OPTIONS';
+export const CLOSE_VIEWING_OPTIONS = 'CLOSE_VIEWING_OPTIONS';

plugins/coral-plugin-viewing-options/client/reducer.js

@@ -6,15 +6,15 @@ const initialState = {
 
 export default function offTopic (state = initialState, action) {
   switch (action.type) {
-    case OPEN_VIEWING_OPTIONS:
-      return {
-        ...state,
-        open: true
-      };
-    case CLOSE_VIEWING_OPTIONS:
-      return {
-        ...state,
-        open: false
+  case OPEN_VIEWING_OPTIONS:
+    return {
+      ...state,
+      open: true
+    };
+  case CLOSE_VIEWING_OPTIONS:
+    return {
+      ...state,
+      open: false
     };
   default :
     return state;

plugins/coral-plugin-viewing-options/index.js

@@ -1 +1 @@
-module.exports = {};
+module.exports = {};