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..b64d63582f 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,28 +131,45 @@ const ReportedComment: FunctionComponent = ({ - - - - - + {comment.status === GQLCOMMENT_STATUS.REJECTED ? ( + + + +
+ Rejected +
+
+ +
+ Unavailable in stream +
+
+
+
+ ) : ( + + + + + + )}