From 5f9240f201d2ff298cfb7fa44466df2cdb68d393 Mon Sep 17 00:00:00 2001
From: Riley Davis <riley.davis@gmail.com>
Date: Thu, 4 May 2017 16:32:07 -0600
Subject: [PATCH] open the comment in context when clicked

---
 .../src/containers/ModerationQueue/components/Comment.js  | 5 +++--
 .../src/containers/ModerationQueue/components/styles.css  | 8 ++++++++
 .../coral-admin/src/graphql/fragments/commentView.graphql | 1 +
 3 files changed, 12 insertions(+), 2 deletions(-)

diff --git a/client/coral-admin/src/containers/ModerationQueue/components/Comment.js b/client/coral-admin/src/containers/ModerationQueue/components/Comment.js
index e5afd9726..ac16082d2 100644
--- a/client/coral-admin/src/containers/ModerationQueue/components/Comment.js
+++ b/client/coral-admin/src/containers/ModerationQueue/components/Comment.js
@@ -57,7 +57,7 @@ const Comment = ({actions = [], comment, ...props}) => {
             <Link to={`/admin/moderate/${comment.asset.id}`}>Moderate →</Link>
           )}
         </div>
-        <div className={styles.itemBody}>
+        <a className={styles.itemBody} href={`${comment.asset.url}#${comment.id}`} target="_blank">
           <p className={styles.body}>
             <Highlighter
               searchWords={[...props.suspectWords, ...props.bannedWords, ...linkText]}
@@ -79,7 +79,7 @@ const Comment = ({actions = [], comment, ...props}) => {
               })}
             </div>
           </div>
-        </div>
+        </a>
       </div>
       {
         flagActions && flagActions.length
@@ -106,6 +106,7 @@ Comment.propTypes = {
     }),
     asset: PropTypes.shape({
       title: PropTypes.string,
+      url: PropTypes.string,
       id: PropTypes.string
     })
   })
diff --git a/client/coral-admin/src/containers/ModerationQueue/components/styles.css b/client/coral-admin/src/containers/ModerationQueue/components/styles.css
index a22fbbc64..074bc34f1 100644
--- a/client/coral-admin/src/containers/ModerationQueue/components/styles.css
+++ b/client/coral-admin/src/containers/ModerationQueue/components/styles.css
@@ -231,6 +231,14 @@ span {
     font-size: 14px;
     line-height: 1.5;
     font-weight: 300;
+    cursor: pointer;
+    text-decoration: none;
+    background-color: white;
+    transition: background-color .3s;
+
+    &:hover {
+      background-color: #eee;
+    }
   }
 
   .avatar {
diff --git a/client/coral-admin/src/graphql/fragments/commentView.graphql b/client/coral-admin/src/graphql/fragments/commentView.graphql
index 51b0a3f44..1f3b8b1d3 100644
--- a/client/coral-admin/src/graphql/fragments/commentView.graphql
+++ b/client/coral-admin/src/graphql/fragments/commentView.graphql
@@ -11,6 +11,7 @@ fragment commentView on Comment {
     asset {
       id
       title
+      url
     }
     action_summaries {
       count