Merge branch 'master' into reply-on-hidden-comment

Dockerfile.onbuild

@@ -5,6 +5,7 @@ ONBUILD ARG TALK_THREADING_LEVEL=3
 ONBUILD ARG TALK_DEFAULT_STREAM_TAB=all
 ONBUILD ARG TALK_DEFAULT_LANG=en
 ONBUILD ARG TALK_PLUGINS_JSON
+ONBUILD ARG TALK_WEBPACK_SOURCE_MAP
 
 # Bundle app source
 ONBUILD COPY . /usr/src/app

client/coral-admin/src/components/CommentAnimatedEdit.js

@@ -4,7 +4,7 @@ import { CSSTransitionGroup } from 'react-transition-group';
 import styles from './CommentAnimatedEdit.css';
 import PropTypes from 'prop-types';
 
-const CommentBodyHighlighter = ({ children, body }) => {
+const CommentAnimatedEdit = ({ children, body }) => {
   return (
     <CSSTransitionGroup
       component={'div'}
@@ -27,9 +27,9 @@ const CommentBodyHighlighter = ({ children, body }) => {
   );
 };
 
-CommentBodyHighlighter.propTypes = {
+CommentAnimatedEdit.propTypes = {
   children: PropTypes.node,
   body: PropTypes.string,
 };
 
-export default CommentBodyHighlighter;
+export default CommentAnimatedEdit;

client/coral-admin/src/components/CommentFormatter.js

@@ -1,4 +1,5 @@
 import React from 'react';
+import PropTypes from 'prop-types';
 import { matchLinks } from '../utils';
 import memoize from 'lodash/memoize';
 
@@ -62,16 +63,47 @@ function markLinks(body) {
   return content;
 }
 
-export default ({ suspectWords, bannedWords, body, ...rest }) => {
-  // First highlight links.
-  const content = markLinks(body).map((element, index) => {
-    // Keep highlighted links.
-    if (typeof element !== 'string') {
-      return element;
-    }
+const CommentFormatter = ({
+  body,
+  suspectWords,
+  bannedWords,
+  className = 'comment',
+  ...rest
+}) => {
+  // Breaking the body by line break
+  const textbreaks = body.split('\n');
 
-    // Highlight suspect and banned phrase inside this part of text.
-    return markPhrases(element, suspectWords, bannedWords, index);
-  });
-  return <div {...rest}>{content}</div>;
+  return (
+    <span className={`${className}-text`} {...rest}>
+      {textbreaks.map((line, i) => {
+        const content = markLinks(line).map((element, index) => {
+          // Keep highlighted links.
+          if (typeof element !== 'string') {
+            return element;
+          }
+
+          // Highlight suspect and banned phrase inside this part of text.
+          return markPhrases(element, suspectWords, bannedWords, index);
+        });
+
+        return (
+          <span key={i} className={`${className}-line`}>
+            {content}
+            {i !== textbreaks.length - 1 && (
+              <br className={`${className}-linebreak`} />
+            )}
+          </span>
+        );
+      })}
+    </span>
+  );
 };
+
+CommentFormatter.propTypes = {
+  className: PropTypes.string,
+  bannedWords: PropTypes.array,
+  suspectWords: PropTypes.array,
+  body: PropTypes.string,
+};
+
+export default CommentFormatter;

client/coral-admin/src/components/UserDetailComment.js

@@ -5,7 +5,7 @@ import { Link } from 'react-router';
 import { Icon } from 'coral-ui';
 import CommentDetails from './CommentDetails';
 import styles from './UserDetailComment.css';
-import CommentBodyHighlighter from 'coral-admin/src/components/CommentBodyHighlighter';
+import CommentFormatter from 'coral-admin/src/components/CommentFormatter';
 import IfHasLink from 'coral-admin/src/components/IfHasLink';
 import cn from 'classnames';
 import CommentAnimatedEdit from './CommentAnimatedEdit';
@@ -78,11 +78,12 @@ class UserDetailComment extends React.Component {
           <CommentAnimatedEdit body={comment.body}>
             <div className={styles.bodyContainer}>
               <div className={styles.body}>
-                <CommentBodyHighlighter
+                <CommentFormatter
                   suspectWords={suspect}
                   bannedWords={banned}
                   body={comment.body}
-                />{' '}
+                  className="talk-admin-user-detail-comment"
+                />
                 <a
                   className={styles.external}
                   href={`${comment.asset.url}?commentId=${comment.id}`}

client/coral-admin/src/routes/Moderation/components/Comment.js

@@ -8,7 +8,7 @@ import styles from './Comment.css';
 import CommentLabels from 'coral-admin/src/components/CommentLabels';
 import CommentAnimatedEdit from 'coral-admin/src/components/CommentAnimatedEdit';
 import Slot from 'coral-framework/components/Slot';
-import CommentBodyHighlighter from 'coral-admin/src/components/CommentBodyHighlighter';
+import CommentFormatter from 'coral-admin/src/components/CommentFormatter';
 import IfHasLink from 'coral-admin/src/components/IfHasLink';
 import cn from 'classnames';
 import ApproveButton from 'coral-admin/src/components/ApproveButton';
@@ -126,11 +126,12 @@ class Comment extends React.Component {
           <CommentAnimatedEdit body={comment.body}>
             <div className={styles.itemBody}>
               <div className={styles.body}>
-                <CommentBodyHighlighter
+                <CommentFormatter
                   suspectWords={settings.wordlist.suspect}
                   bannedWords={settings.wordlist.banned}
+                  className="talk-admin-comment"
                   body={comment.body}
-                />{' '}
+                />
                 <a
                   className={styles.external}
                   href={`${comment.asset.url}?commentId=${comment.id}`}

scripts/docker.sh

@@ -68,17 +68,16 @@ then
     docker login -e $DOCKER_EMAIL -u $DOCKER_USER -p $DOCKER_PASS
   fi
 
-  if [ "$CIRCLE_BRANCH" = "master" ]
+  # deploy based on the env
+  if [ -n "$CIRCLE_TAG" ]
   then
-
-    # deploy based on the env
-    if [ -n "$CIRCLE_TAG" ]
-    then
-      deploy_tag
-    else
-      deploy_latest
-    fi
+    deploy_tag
   else
-    deploy_branch
+    if [ "$CIRCLE_BRANCH" = "master" ]
+    then
+      deploy_latest
+    else
+      deploy_branch
+    fi
   fi
 fi

webpack.config.js

@@ -22,12 +22,30 @@ const buildTargets = ['coral-admin', 'coral-docs'];
 
 const buildEmbeds = ['stream'];
 
+// In production, default turn off source maps. In development, default use
+// 'cheap-module-source-map'.
+const DEFAULT_WEBPACK_SOURCE_MAP =
+  process.env.NODE_ENV === 'production' ? 'none' : 'cheap-module-source-map';
+
+// TALK_WEBPACK_SOURCE_MAP is sourced from the environment, defaulting based on
+// the environment.
+const TALK_WEBPACK_SOURCE_MAP = _.get(
+  process.env,
+  'TALK_WEBPACK_SOURCE_MAP',
+  DEFAULT_WEBPACK_SOURCE_MAP
+);
+
+// Set the devtool based on the source map selection, 'none' just means turn off
+// source maps.
+const devtool =
+  TALK_WEBPACK_SOURCE_MAP === 'none' ? false : TALK_WEBPACK_SOURCE_MAP;
+
 //==============================================================================
 // Base Webpack Config
 //==============================================================================
 
 const config = {
-  devtool: 'cheap-module-source-map',
+  devtool,
   target: 'web',
   output: {
     path: path.join(__dirname, 'dist'),