From 1134e3bc095f3e0d374862ec31245f9692a75b33 Mon Sep 17 00:00:00 2001
From: Dan Zajdband <dan.zajdband@gmail.com>
Date: Fri, 18 Nov 2016 10:46:09 -0500
Subject: [PATCH 1/3] add(coral-admin): Syntax highlighting on links

---
 client/coral-admin/src/components/Comment.js | 12 +++++++++-
 package.json                                 | 25 +++++++++++++-------
 2 files changed, 28 insertions(+), 9 deletions(-)

diff --git a/client/coral-admin/src/components/Comment.js b/client/coral-admin/src/components/Comment.js
index fa94f74a4..4cc18aa0a 100644
--- a/client/coral-admin/src/components/Comment.js
+++ b/client/coral-admin/src/components/Comment.js
@@ -5,6 +5,7 @@ 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';
 
 // Render a single comment for the list
 export default props => (
@@ -27,7 +28,11 @@ export default props => (
       </div>
     </div>
     <div className={styles.itemBody}>
-      <span className={styles.body}>{props.comment.get('body')}</span>
+      <span className={styles.body}>
+        <Linkify component='span' properties={{style: linkStyles}}>
+          {props.comment.get('body')}
+        </Linkify>
+      </span>
     </div>
   </li>
 );
@@ -43,4 +48,9 @@ const canShowAction = (action, comment) => {
   return true;
 };
 
+const linkStyles = {
+  backgroundColor: 'rgb(255, 219, 135)',
+  padding: '1px 2px'
+};
+
 const lang = new I18n(translations);
diff --git a/package.json b/package.json
index dd9f8db8a..fb83055b6 100644
--- a/package.json
+++ b/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"
   },

From ee9dc7260fe9e82ce3fe6f34ad12162170aff43b Mon Sep 17 00:00:00 2001
From: Dan Zajdband <dan.zajdband@gmail.com>
Date: Fri, 18 Nov 2016 12:15:53 -0500
Subject: [PATCH 2/3] add(coral-admin): Added cointains link warning

---
 client/coral-admin/src/components/Comment.js  | 66 +++++++++++--------
 .../src/components/CommentList.css            | 12 ++++
 2 files changed, 50 insertions(+), 28 deletions(-)

diff --git a/client/coral-admin/src/components/Comment.js b/client/coral-admin/src/components/Comment.js
index 4cc18aa0a..0c63445c8 100644
--- a/client/coral-admin/src/components/Comment.js
+++ b/client/coral-admin/src/components/Comment.js
@@ -7,35 +7,45 @@ 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}
-      </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'))}
-            fab colored>
-            <Icon name={props.actionsMap[action].icon} />
-          </Button>
-        ) : null)}
-      </div>
-    </div>
-    <div className={styles.itemBody}>
-      <span className={styles.body}>
-        <Linkify component='span' properties={{style: linkStyles}}>
-          {props.comment.get('body')}
-        </Linkify>
-      </span>
-    </div>
-  </li>
-);
+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} />
+                </Button>
+              ) : null)}
+            </div>
+          </div>
+        </div>
+        <div className={styles.itemBody}>
+          <span className={styles.body}>
+            <Linkify  component='span' properties={{style: linkStyles}}>
+              {props.comment.get('body')}
+            </Linkify>
+          </span>
+        </div>
+      </li>
+    )
+};
 
 // Check if an action can be performed over a comment
 const canShowAction = (action, comment) => {
diff --git a/client/coral-admin/src/components/CommentList.css b/client/coral-admin/src/components/CommentList.css
index f683ca36b..2c58c81cf 100644
--- a/client/coral-admin/src/components/CommentList.css
+++ b/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;
+  }
+}

From 0f7d7583365f78687fc8538599196c08190acae1 Mon Sep 17 00:00:00 2001
From: Dan Zajdband <dan.zajdband@gmail.com>
Date: Fri, 18 Nov 2016 15:12:59 -0500
Subject: [PATCH 3/3] fix(coral-admin): Linted code

---
 client/coral-admin/src/components/Comment.js | 64 ++++++++++----------
 1 file changed, 32 insertions(+), 32 deletions(-)

diff --git a/client/coral-admin/src/components/Comment.js b/client/coral-admin/src/components/Comment.js
index 0c63445c8..154d68134 100644
--- a/client/coral-admin/src/components/Comment.js
+++ b/client/coral-admin/src/components/Comment.js
@@ -7,44 +7,44 @@ import I18n from 'coral-framework/modules/i18n/i18n';
 import translations from '../translations.json';
 import Linkify from 'react-linkify';
 
-const linkify = new Linkify()
+const linkify = new Linkify();
 
 // Render a single comment for the list
 export default props => {
-  const links = linkify.getMatches(props.comment.get('body'))
+  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} />
-                </Button>
-              ) : null)}
-            </div>
+  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} />
+              </Button>
+            ) : null)}
           </div>
         </div>
-        <div className={styles.itemBody}>
-          <span className={styles.body}>
-            <Linkify  component='span' properties={{style: linkStyles}}>
-              {props.comment.get('body')}
-            </Linkify>
-          </span>
-        </div>
-      </li>
-    )
+      </div>
+      <div className={styles.itemBody}>
+        <span className={styles.body}>
+          <Linkify  component='span' properties={{style: linkStyles}}>
+            {props.comment.get('body')}
+          </Linkify>
+        </span>
+      </div>
+    </li>
+  );
 };
 
 // Check if an action can be performed over a comment