Merge branch 'master' into ban-user

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

@@ -5,32 +5,48 @@ import timeago from 'timeago.js';
 import styles from './CommentList.css';
 import I18n from 'coral-framework/modules/i18n/i18n';
 import translations from '../translations.json';
+import Linkify from 'react-linkify';
+
+const linkify = new Linkify();
 
 // Render a single comment for the list
-export default props => (
-  <li tabIndex={props.index} className={`${styles.listItem} ${props.isActive && !props.hideActive ? styles.activeItem : ''}`}>
-    <div className={styles.itemHeader}>
-      <div className={styles.author}>
-        <i className={`material-icons ${styles.avatar}`}>person</i>
-        <span>{props.comment.get('name') || lang.t('comment.anon')}</span>
-        <span className={styles.created}>{timeago().format(props.comment.get('createdAt') || (Date.now() - props.index * 60 * 1000), lang.getLocale().replace('-', '_'))}</span>
-        {props.comment.get('flagged') ? <p className={styles.flagged}>{lang.t('comment.flagged')}</p> : null}
+export default props => {
+  const links = linkify.getMatches(props.comment.get('body'));
+
+  return (
+    <li tabindex={props.index} className={`${styles.listItem} ${props.isActive && !props.hideActive ? styles.activeItem : ''}`}>
+      <div className={styles.itemHeader}>
+        <div className={styles.author}>
+          <i className={`material-icons ${styles.avatar}`}>person</i>
+          <span>{props.comment.get('name') || lang.t('comment.anon')}</span>
+          <span className={styles.created}>{timeago().format(props.comment.get('createdAt') || (Date.now() - props.index * 60 * 1000), lang.getLocale().replace('-', '_'))}</span>
+          {props.comment.get('flagged') ? <p className={styles.flagged}>{lang.t('comment.flagged')}</p> : null}
+        </div>
+        <div>
+          {links ?
+          <span className={styles.hasLinks}><Icon name='error_outline'/> Contains Link</span> : null}
+          <div className={styles.actions}>
+            {props.actions.map(action => canShowAction(action, props.comment) ? (
+              <Button className={styles.actionButton}
+                onClick={() => props.onClickAction(props.actionsMap[action].status, props.comment.get('id'))}
+                fab colored>
+                <Icon name={props.actionsMap[action].icon} />
+                {props.actionsMap[action].text}
+              </Button>
+            ) : null)}
+          </div>
+        </div>
       </div>
-      <div className={styles.actions}>
-        {props.actions.map(action => canShowAction(action, props.comment) ? (
-          <Button className={styles.actionButton}
-            onClick={() => props.onClickAction(props.actionsMap[action].status, props.comment.get('id'))} colored>
-            <Icon name={props.actionsMap[action].icon}/>
-            {props.actionsMap[action].text}
-          </Button>
-        ) : null)}
+      <div className={styles.itemBody}>
+        <span className={styles.body}>
+          <Linkify  component='span' properties={{style: linkStyles}}>
+            {props.comment.get('body')}
+          </Linkify>
+        </span>
       </div>
-    </div>
-    <div className={styles.itemBody}>
-      <span className={styles.body}>{props.comment.get('body')}</span>
-    </div>
-  </li>
-);
+    </li>
+  );
+};
 
 // Check if an action can be performed over a comment
 const canShowAction = (action, comment) => {
@@ -43,4 +59,9 @@ const canShowAction = (action, comment) => {
   return true;
 };
 
+const linkStyles = {
+  backgroundColor: 'rgb(255, 219, 135)',
+  padding: '1px 2px'
+};
+
 const lang = new I18n(translations);

client/coral-admin/src/components/CommentList.css

@@ -121,3 +121,15 @@
   }
 
 }
+
+
+.hasLinks {
+  color: #f00;
+  text-align: right;
+  display: flex;
+  align-items: center;
+
+  i {
+    margin-right: 5px;
+  }
+}

package.json

@@ -16,8 +16,13 @@
   "config": {
     "pre-git": {
       "commit-msg": [],
-      "pre-commit": ["npm run lint", "npm test"],
-      "pre-push": ["npm test"],
+      "pre-commit": [
+        "npm run lint",
+        "npm test"
+      ],
+      "pre-push": [
+        "npm test"
+      ],
       "post-commit": [],
       "post-merge": []
     }
@@ -26,7 +31,12 @@
     "type": "git",
     "url": "git+https://github.com/coralproject/talk.git"
   },
-  "keywords": ["talk", "coral", "coralproject", "ask"],
+  "keywords": [
+    "talk",
+    "coral",
+    "coralproject",
+    "ask"
+  ],
   "author": "",
   "license": "Apache-2.0",
   "bugs": {
@@ -44,18 +54,17 @@
     "express": "^4.14.0",
     "express-session": "^1.14.2",
     "helmet": "^3.1.0",
+    "jsonwebtoken": "^7.1.9",
+    "lodash": "^4.16.6",
     "lodash.debounce": "^4.0.8",
     "mongoose": "^4.6.5",
     "morgan": "^1.7.0",
+    "nodemailer": "^2.6.4",
     "passport": "^0.3.2",
     "passport-facebook": "^2.1.1",
     "passport-local": "^1.0.0",
-    "jsonwebtoken": "^7.1.9",
-    "lodash": "^4.16.6",
-    "mongoose": "^4.6.5",
-    "morgan": "^1.7.0",
-    "nodemailer": "^2.6.4",
     "prompt": "^1.0.0",
+    "react-linkify": "^0.1.3",
     "redis": "^2.6.3",
     "uuid": "^2.0.3"
   },