From 88a77f8712e87dce5be3d8ef60eee37e75f8a62d Mon Sep 17 00:00:00 2001
From: Nick Funk <nick.funk@outlook.com>
Date: Mon, 10 Aug 2020 09:29:17 -0600
Subject: [PATCH] Show media in the moderate view conversation modal (#3088)

---
 .../ConversationModal/ConversationModalCommentContainer.tsx   | 3 +++
 .../{ModerateCard => MediaContainer}/GiphyMedia.tsx           | 0
 .../components/{ModerateCard => MediaContainer}/Media.css     | 0
 .../{ModerateCard => MediaContainer}/MediaContainer.tsx       | 0
 .../{ModerateCard => MediaContainer}/TwitterMedia.tsx         | 0
 .../{ModerateCard => MediaContainer}/YouTubeMedia.tsx         | 0
 src/core/client/admin/components/MediaContainer/index.ts      | 4 ++++
 .../client/admin/components/ModerateCard/ModerateCard.tsx     | 2 +-
 8 files changed, 8 insertions(+), 1 deletion(-)
 rename src/core/client/admin/components/{ModerateCard => MediaContainer}/GiphyMedia.tsx (100%)
 rename src/core/client/admin/components/{ModerateCard => MediaContainer}/Media.css (100%)
 rename src/core/client/admin/components/{ModerateCard => MediaContainer}/MediaContainer.tsx (100%)
 rename src/core/client/admin/components/{ModerateCard => MediaContainer}/TwitterMedia.tsx (100%)
 rename src/core/client/admin/components/{ModerateCard => MediaContainer}/YouTubeMedia.tsx (100%)
 create mode 100644 src/core/client/admin/components/MediaContainer/index.ts

diff --git a/src/core/client/admin/components/ConversationModal/ConversationModalCommentContainer.tsx b/src/core/client/admin/components/ConversationModal/ConversationModalCommentContainer.tsx
index 80201aaa1..2a301989d 100644
--- a/src/core/client/admin/components/ConversationModal/ConversationModalCommentContainer.tsx
+++ b/src/core/client/admin/components/ConversationModal/ConversationModalCommentContainer.tsx
@@ -3,6 +3,7 @@ import cn from "classnames";
 import React, { FunctionComponent, useCallback, useState } from "react";
 import { graphql } from "react-relay";
 
+import { MediaContainer } from "coral-admin/components/MediaContainer";
 import { withFragmentContainer } from "coral-framework/lib/relay";
 import {
   Button,
@@ -95,6 +96,7 @@ const ConversationModalCommentContainer: FunctionComponent<Props> = ({
                 {comment.body}
               </CommentContent>
             )}
+            <MediaContainer comment={comment} />
           </div>
         </HorizontalGutter>
       </Flex>
@@ -153,6 +155,7 @@ const enhanced = withFragmentContainer<Props>({
           id
         }
       }
+      ...MediaContainer_comment
     }
   `,
 })(ConversationModalCommentContainer);
diff --git a/src/core/client/admin/components/ModerateCard/GiphyMedia.tsx b/src/core/client/admin/components/MediaContainer/GiphyMedia.tsx
similarity index 100%
rename from src/core/client/admin/components/ModerateCard/GiphyMedia.tsx
rename to src/core/client/admin/components/MediaContainer/GiphyMedia.tsx
diff --git a/src/core/client/admin/components/ModerateCard/Media.css b/src/core/client/admin/components/MediaContainer/Media.css
similarity index 100%
rename from src/core/client/admin/components/ModerateCard/Media.css
rename to src/core/client/admin/components/MediaContainer/Media.css
diff --git a/src/core/client/admin/components/ModerateCard/MediaContainer.tsx b/src/core/client/admin/components/MediaContainer/MediaContainer.tsx
similarity index 100%
rename from src/core/client/admin/components/ModerateCard/MediaContainer.tsx
rename to src/core/client/admin/components/MediaContainer/MediaContainer.tsx
diff --git a/src/core/client/admin/components/ModerateCard/TwitterMedia.tsx b/src/core/client/admin/components/MediaContainer/TwitterMedia.tsx
similarity index 100%
rename from src/core/client/admin/components/ModerateCard/TwitterMedia.tsx
rename to src/core/client/admin/components/MediaContainer/TwitterMedia.tsx
diff --git a/src/core/client/admin/components/ModerateCard/YouTubeMedia.tsx b/src/core/client/admin/components/MediaContainer/YouTubeMedia.tsx
similarity index 100%
rename from src/core/client/admin/components/ModerateCard/YouTubeMedia.tsx
rename to src/core/client/admin/components/MediaContainer/YouTubeMedia.tsx
diff --git a/src/core/client/admin/components/MediaContainer/index.ts b/src/core/client/admin/components/MediaContainer/index.ts
new file mode 100644
index 000000000..ac8cb3387
--- /dev/null
+++ b/src/core/client/admin/components/MediaContainer/index.ts
@@ -0,0 +1,4 @@
+export { default as MediaContainer } from "./MediaContainer";
+export { default as GiphyMedia } from "./GiphyMedia";
+export { default as TwitterMedia } from "./TwitterMedia";
+export { default as YouTubeMedia } from "./YouTubeMedia";
diff --git a/src/core/client/admin/components/ModerateCard/ModerateCard.tsx b/src/core/client/admin/components/ModerateCard/ModerateCard.tsx
index cb3500241..160fab97f 100644
--- a/src/core/client/admin/components/ModerateCard/ModerateCard.tsx
+++ b/src/core/client/admin/components/ModerateCard/ModerateCard.tsx
@@ -10,6 +10,7 @@ import React, {
   useRef,
 } from "react";
 
+import { MediaContainer } from "coral-admin/components/MediaContainer";
 import { HOTKEYS } from "coral-admin/constants";
 import { GetPhrasesRegExpOptions } from "coral-admin/helpers";
 import { PropTypesOf } from "coral-framework/types";
@@ -29,7 +30,6 @@ import ApproveButton from "./ApproveButton";
 import CommentAuthorContainer from "./CommentAuthorContainer";
 import FeatureButton from "./FeatureButton";
 import MarkersContainer from "./MarkersContainer";
-import MediaContainer from "./MediaContainer";
 import RejectButton from "./RejectButton";
 
 import styles from "./ModerateCard.css";