From 50a206891452692acfec12ca2396bb2248a62e08 Mon Sep 17 00:00:00 2001
From: nick-funk <code@nickfunk.com>
Date: Mon, 27 Nov 2023 09:27:02 -0700
Subject: [PATCH 1/3] show rejected "unavailabe in stream" on DSA reports

when a comment is rejected and unavailable stream side, indicate
this to the moderators so they don't waste time trying to click
on the stream link.
---
 .../admin/routes/Reports/ReportedComment.css  | 31 +++++++++++
 .../admin/routes/Reports/ReportedComment.tsx  | 51 +++++++++++++------
 locales/en-US/admin.ftl                       |  2 +
 3 files changed, 68 insertions(+), 16 deletions(-)

diff --git a/client/src/core/client/admin/routes/Reports/ReportedComment.css b/client/src/core/client/admin/routes/Reports/ReportedComment.css
index f15a0a420b..905e4c9edf 100644
--- a/client/src/core/client/admin/routes/Reports/ReportedComment.css
+++ b/client/src/core/client/admin/routes/Reports/ReportedComment.css
@@ -47,3 +47,34 @@
   font-weight: var(--font-weight-primary-regular);
   white-space: pre-wrap;
 }
+
+.commentReported {
+  padding-top: calc(var(--spacing-1) / 2);
+  padding-bottom: calc(var(--spacing-1) / 2);
+  padding-right: calc(var(--spacing-1));
+  padding-left: calc(var(--spacing-1));
+
+  background-color: var(--palette-error-500);
+
+  border-color: var(--palette-error-500);
+  border-style: solid;
+  border-radius: 3px;
+
+  color: var(--palette-text-000);
+
+  text-transform: uppercase;
+
+  font-size: var(--font-size-1);
+  font-weight: var(--font-weight-primary-regular);
+  font-family: var(--font-family-primary);
+
+  margin-right: var(--spacing-1);
+}
+
+.commentNotAvailableInStream {
+  font-size: var(--font-size-1);
+  font-weight: var(--font-weight-primary-regular);
+  font-family: var(--font-family-primary);
+
+  color: var(--palette-grey-400);
+}
diff --git a/client/src/core/client/admin/routes/Reports/ReportedComment.tsx b/client/src/core/client/admin/routes/Reports/ReportedComment.tsx
index 921e67aec8..9d6b01ceee 100644
--- a/client/src/core/client/admin/routes/Reports/ReportedComment.tsx
+++ b/client/src/core/client/admin/routes/Reports/ReportedComment.tsx
@@ -15,6 +15,7 @@ import {
   getURLWithCommentID,
 } from "coral-framework/helpers";
 import { withFragmentContainer } from "coral-framework/lib/relay";
+import { GQLCOMMENT_STATUS } from "coral-framework/schema";
 import {
   Button,
   Flex,
@@ -130,22 +131,39 @@ const ReportedComment: FunctionComponent<Props> = ({
                     </div>
                   </Flex>
                   <Flex>
-                    <Flex marginTop={2} marginRight={3}>
-                      <Localized id="reports-singleReport-comment-viewCommentStream">
-                        <Button
-                          variant="text"
-                          uppercase={false}
-                          color="mono"
-                          to={getURLWithCommentID(
-                            comment.story.url,
-                            comment.id
-                          )}
-                          target="_blank"
-                        >
-                          View comment in stream
-                        </Button>
-                      </Localized>
-                    </Flex>
+                    {comment.status === GQLCOMMENT_STATUS.REJECTED ? (
+                      <Flex marginTop={2} marginRight={3}>
+                        <Flex alignItems="center" justifyContent="flex-start">
+                          <Localized id="reports-singleReport-comment-rejected">
+                            <div className={styles.commentReported}>
+                              Rejected
+                            </div>
+                          </Localized>
+                          <Localized id="reports-singleReport-comment-unavailableInStream">
+                            <div className={styles.commentNotAvailableInStream}>
+                              Unavailable in stream
+                            </div>
+                          </Localized>
+                        </Flex>
+                      </Flex>
+                    ) : (
+                      <Flex marginTop={2} marginRight={3}>
+                        <Localized id="reports-singleReport-comment-viewCommentStream">
+                          <Button
+                            variant="text"
+                            uppercase={false}
+                            color="mono"
+                            to={getURLWithCommentID(
+                              comment.story.url,
+                              comment.id
+                            )}
+                            target="_blank"
+                          >
+                            View comment in stream
+                          </Button>
+                        </Localized>
+                      </Flex>
+                    )}
                     <Flex marginTop={2}>
                       <Localized id="reports-singleReport-comment-viewCommentModeration">
                         <Button
@@ -201,6 +219,7 @@ const enhanced = withFragmentContainer<Props>({
             title
           }
         }
+        status
         ...CommentAuthorContainer_comment
         ...MediaContainer_comment
       }
diff --git a/locales/en-US/admin.ftl b/locales/en-US/admin.ftl
index d30171666f..01f6065f6d 100644
--- a/locales/en-US/admin.ftl
+++ b/locales/en-US/admin.ftl
@@ -1861,6 +1861,8 @@ reports-singleReport-comment-deleted = This comment is no longer available. The
 reports-singleReport-comment-edited = (edited)
 reports-singleReport-comment-viewCommentStream = View comment in stream
 reports-singleReport-comment-viewCommentModeration = View comment in moderation
+reports-singleReport-comment-rejected = Rejected
+reports-singleReport-comment-unavailableInStream = Unavailable in stream
 reports-singleReport-commentOn = Comment on
 reports-singleReport-history = History
 reports-singleReport-history-reportSubmitted = Illegal content report submitted

From 4531f5f2dabe6d404ad92c9e258f97b264eecc95 Mon Sep 17 00:00:00 2001
From: nick-funk <code@nickfunk.com>
Date: Mon, 27 Nov 2023 09:35:52 -0700
Subject: [PATCH 2/3] add test for rejected comment stream link state on dsa
 reports

---
 .../test/dsaReports/dsaReportsSingle.spec.tsx | 33 +++++++++++++++++--
 1 file changed, 31 insertions(+), 2 deletions(-)

diff --git a/client/src/core/client/admin/test/dsaReports/dsaReportsSingle.spec.tsx b/client/src/core/client/admin/test/dsaReports/dsaReportsSingle.spec.tsx
index 5e1698a35f..2f005b822b 100644
--- a/client/src/core/client/admin/test/dsaReports/dsaReportsSingle.spec.tsx
+++ b/client/src/core/client/admin/test/dsaReports/dsaReportsSingle.spec.tsx
@@ -3,6 +3,7 @@ import userEvent from "@testing-library/user-event";
 
 import { pureMerge } from "coral-common/common/lib/utils";
 import {
+  GQLCOMMENT_STATUS,
   GQLDSAReportDecisionLegality,
   GQLDSAReportHistoryType,
   GQLDSAReportStatus,
@@ -25,7 +26,8 @@ beforeEach(async () => {
 });
 
 const createTestRenderer = async (
-  params: CreateTestRendererParams<GQLResolver> = {}
+  params: CreateTestRendererParams<GQLResolver> = {},
+  commentStatus?: GQLCOMMENT_STATUS
 ) => {
   const { context } = createContext({
     ...params,
@@ -34,7 +36,17 @@ const createTestRenderer = async (
         Query: {
           settings: () => settings,
           viewer: () => adminViewer,
-          dsaReport: () => dsaReports[0],
+          dsaReport: () => {
+            return {
+              ...dsaReports[0],
+              comment: commentStatus
+                ? {
+                    ...dsaReports[0].comment,
+                    status: commentStatus,
+                  }
+                : dsaReports[0].comment,
+            };
+          },
         },
         Mutation: {
           addDSAReportNote: ({ variables }) => {
@@ -251,3 +263,20 @@ it("can make a legality decision on a report", async () => {
     )
   );
 });
+
+it("stream link is unavailable when comment is already rejected", async () => {
+  const { container } = await createTestRenderer(
+    undefined,
+    GQLCOMMENT_STATUS.REJECTED
+  );
+
+  expect(await within(container).findByText("Rejected"));
+  expect(await within(container).findByText("Unavailable in stream"));
+
+  expect(
+    within(container).getByRole("link", { name: "View comment in moderation" })
+  ).toHaveProperty(
+    "href",
+    "http://localhost/admin/moderate/comment/comment-regular-0"
+  );
+});

From 9ebe6c81a7cc1170bca25a88549da94903f91ad5 Mon Sep 17 00:00:00 2001
From: nick-funk <code@nickfunk.com>
Date: Mon, 27 Nov 2023 10:25:12 -0700
Subject: [PATCH 3/3] make DSA comment links dark-teal-green to match admin
 link styles

---
 .../src/core/client/admin/routes/Reports/ReportedComment.tsx  | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/client/src/core/client/admin/routes/Reports/ReportedComment.tsx b/client/src/core/client/admin/routes/Reports/ReportedComment.tsx
index 9d6b01ceee..b64d63582f 100644
--- a/client/src/core/client/admin/routes/Reports/ReportedComment.tsx
+++ b/client/src/core/client/admin/routes/Reports/ReportedComment.tsx
@@ -152,7 +152,7 @@ const ReportedComment: FunctionComponent<Props> = ({
                           <Button
                             variant="text"
                             uppercase={false}
-                            color="mono"
+                            color="regular"
                             to={getURLWithCommentID(
                               comment.story.url,
                               comment.id
@@ -169,7 +169,7 @@ const ReportedComment: FunctionComponent<Props> = ({
                         <Button
                           variant="text"
                           uppercase={false}
-                          color="mono"
+                          color="regular"
                           target="_blank"
                           to={getModerationLink({
                             commentID: comment.id,