add title to TenorMedia schema type

coralproject · Jun 24, 2024 · 86d68ac · 86d68ac
1 parent 336c611
commit 86d68ac
Show file tree

Hide file tree

Showing 5 changed files with 22 additions and 3 deletions.
diff --git a/client/src/core/client/admin/components/MediaContainer/MediaContainer.tsx b/client/src/core/client/admin/components/MediaContainer/MediaContainer.tsx
@@ -59,7 +59,7 @@ const MediaContainer: FunctionComponent<Props> = ({ comment }) => {
         />
       );
     case "TenorMedia":
-      return <TenorMedia url={media.url} />;
+      return <TenorMedia url={media.url} title={media.title} />;
     case "%other":
       return null;
   }
@@ -85,6 +85,7 @@ const enhanced = withFragmentContainer<Props>({
           }
           ... on TenorMedia {
             url
+            title
           }
           ... on TwitterMedia {
             url

diff --git a/client/src/core/client/admin/components/MediaContainer/TenorMedia.tsx b/client/src/core/client/admin/components/MediaContainer/TenorMedia.tsx
@@ -6,9 +6,10 @@ import styles from "./Media.css";
 
 interface Props {
   url: string | null;
+  title: string | null;
 }
 
-const TenorMedia: FunctionComponent<Props> = ({ url }) => {
+const TenorMedia: FunctionComponent<Props> = ({ url, title }) => {
   const [showAnimated, setShowAnimated] = useState(false);
   const toggleImage = useCallback(() => {
     setShowAnimated(!showAnimated);
@@ -21,7 +22,7 @@ const TenorMedia: FunctionComponent<Props> = ({ url }) => {
           className={styles.image}
           loading="lazy"
           referrerPolicy="no-referrer"
-          alt=""
+          alt={title ?? ""}
         />
       </BaseButton>
     </div>

diff --git a/client/src/core/client/admin/components/ModerateCard/CommentRevisionContainer.tsx b/client/src/core/client/admin/components/ModerateCard/CommentRevisionContainer.tsx
@@ -11,6 +11,7 @@ import YouTubeMedia from "../MediaContainer/YouTubeMedia";
 import { CommentRevisionContainer_comment as CommentData } from "coral-admin/__generated__/CommentRevisionContainer_comment.graphql";
 
 import { CommentContent } from "../Comment";
+import TenorMedia from "../MediaContainer/TenorMedia";
 
 interface Props {
   comment: CommentData;
@@ -63,6 +64,9 @@ const CommentRevisionContainer: FunctionComponent<Props> = ({ comment }) => {
                 title={c.media.title}
               />
             )}
+            {c.media && c.media.__typename === "TenorMedia" && (
+              <TenorMedia url={c.media.url} title={c.media.title} />
+            )}
           </div>
         ))}
     </HorizontalGutter>
@@ -93,6 +97,10 @@ const enhanced = withFragmentContainer<Props>({
             still
             video
           }
+          ... on TenorMedia {
+            url
+            title
+          }
           ... on TwitterMedia {
             url
           }

diff --git a/server/src/core/server/app/handlers/api/tenor/index.ts b/server/src/core/server/app/handlers/api/tenor/index.ts
@@ -111,6 +111,7 @@ export const tenorSearchHandler =
       json.results.map((r) => {
         return {
           id: r.id,
+          title: r.title,
           url: r.media_formats.gif.url,
           preview: r.media_formats.tinygif.url,
         };

diff --git a/server/src/core/server/graph/schema/schema.graphql b/server/src/core/server/graph/schema/schema.graphql
@@ -3999,7 +3999,15 @@ type CommentRevisionMetadata {
 TenorMedia is a particular GIF that is provided by the Tenor platform.
 """
 type TenorMedia {
+  """
+  url is the URL to a image of the GIF.
+  """
   url: String!
+
+  """
+  title is the title of the GIF.
+  """
+  title: String
 }
 
 """