From 3d93f0d9077712497e922e0390a8291a813fc3fa Mon Sep 17 00:00:00 2001 From: nick-funk Date: Thu, 28 Nov 2024 14:51:51 -0700 Subject: [PATCH] update a few more things to get bluesky embeds working the preview is still trying to use GifPreview for some reason? --- .../MediaConfirmation/MediaPreview.tsx | 13 +++++---- .../MediaSection/MediaSectionContainer.tsx | 28 ++++++++++++++++++- locales/en-US/stream.ftl | 3 ++ .../core/server/app/handlers/api/oembed.ts | 2 +- .../src/core/server/services/oembed/oembed.ts | 1 - 5 files changed, 39 insertions(+), 8 deletions(-) diff --git a/client/src/core/client/stream/tabs/Comments/Comment/MediaConfirmation/MediaPreview.tsx b/client/src/core/client/stream/tabs/Comments/Comment/MediaConfirmation/MediaPreview.tsx index 9e812f417e..1c598d9e7b 100644 --- a/client/src/core/client/stream/tabs/Comments/Comment/MediaConfirmation/MediaPreview.tsx +++ b/client/src/core/client/stream/tabs/Comments/Comment/MediaConfirmation/MediaPreview.tsx @@ -63,15 +63,18 @@ const MediaPreview: FunctionComponent = ({ {/* Show the actual media. */} - {media.type === "external" ? ( + {media.type === "external" && ( - ) : media.type === "twitter" ? ( + )} + {media.type === "twitter" && ( - ) : media.type === "bsky" ? ( + )} + {media.type === "bsky" && ( - ) : media.type === "youtube" ? ( + )} + {media.type === "youtube" && ( - ) : null} + )} {/* On extra small screens, move the remove button to the bottom! */} diff --git a/client/src/core/client/stream/tabs/Comments/Comment/MediaSection/MediaSectionContainer.tsx b/client/src/core/client/stream/tabs/Comments/Comment/MediaSection/MediaSectionContainer.tsx index 3d82675c24..28adbb7bf3 100644 --- a/client/src/core/client/stream/tabs/Comments/Comment/MediaSection/MediaSectionContainer.tsx +++ b/client/src/core/client/stream/tabs/Comments/Comment/MediaSection/MediaSectionContainer.tsx @@ -26,6 +26,7 @@ import { MediaSectionContainer_comment } from "coral-stream/__generated__/MediaS import { MediaSectionContainer_settings } from "coral-stream/__generated__/MediaSectionContainer_settings.graphql"; import { MediaSectionContainerLocal } from "coral-stream/__generated__/MediaSectionContainerLocal.graphql"; +import BlueskyMedia from "coral-stream/common/Media/BlueskyMedia"; import styles from "./MediaSectionContainer.css"; interface Props { @@ -84,7 +85,9 @@ const MediaSectionContainer: FunctionComponent = ({ (media.__typename === "TwitterMedia" && !settings.media.twitter.enabled) || (media.__typename === "YouTubeMedia" && !settings.media.youtube.enabled) || (media.__typename === "GiphyMedia" && !settings.media.gifs.enabled) || - (media.__typename === "ExternalMedia" && !settings.media.external.enabled) + (media.__typename === "ExternalMedia" && + !settings.media.external.enabled) || + (media.__typename === "BlueskyMedia" && !settings.media.bluesky.enabled) ) { return null; } @@ -103,6 +106,9 @@ const MediaSectionContainer: FunctionComponent = ({ {media.__typename === "TwitterMedia" && ( Show post )} + {media.__typename === "BlueskyMedia" && ( + Show post + )} {media.__typename === "YouTubeMedia" && ( Show video @@ -144,6 +150,11 @@ const MediaSectionContainer: FunctionComponent = ({ Hide post )} + {media.__typename === "BlueskyMedia" && ( + + Hide post + + )} {media.__typename === "GiphyMedia" && ( Hide GIF )} @@ -178,6 +189,14 @@ const MediaSectionContainer: FunctionComponent = ({ isToggled={isToggled} /> )} + {media.__typename === "BlueskyMedia" && ( + + )} {media.__typename === "YouTubeMedia" && ( ({ url width } + ... on BlueskyMedia { + url + width + } ... on YouTubeMedia { url width @@ -242,6 +265,9 @@ const enhanced = withFragmentContainer({ twitter { enabled } + bluesky { + enabled + } youtube { enabled } diff --git a/locales/en-US/stream.ftl b/locales/en-US/stream.ftl index 2da430d3a8..cab99f1544 100644 --- a/locales/en-US/stream.ftl +++ b/locales/en-US/stream.ftl @@ -480,6 +480,9 @@ comments-embedLinks-hide-youtube = Hide video comments-embedLinks-show-twitter = Show post comments-embedLinks-hide-twitter = Hide post +comments-embedLinks-show-bluesky = Show post +comments-embedLinks-hide-bluesky = Hide post + comments-embedLinks-show-external = Show image comments-embedLinks-hide-external = Hide image diff --git a/server/src/core/server/app/handlers/api/oembed.ts b/server/src/core/server/app/handlers/api/oembed.ts index 181bf9e337..54c59a08d2 100644 --- a/server/src/core/server/app/handlers/api/oembed.ts +++ b/server/src/core/server/app/handlers/api/oembed.ts @@ -14,7 +14,7 @@ import { RequestHandler, TenantCoralRequest } from "coral-server/types/express"; const OEmbedQuerySchema = Joi.object().keys({ url: Joi.string().uri().required(), - type: Joi.string().allow("twitter", "youtube").only(), + type: Joi.string().allow("twitter", "youtube", "bsky").only(), maxWidth: Joi.number().optional(), commentID: Joi.string().optional(), }); diff --git a/server/src/core/server/services/oembed/oembed.ts b/server/src/core/server/services/oembed/oembed.ts index a53929143b..55c6dd119f 100644 --- a/server/src/core/server/services/oembed/oembed.ts +++ b/server/src/core/server/services/oembed/oembed.ts @@ -48,7 +48,6 @@ export async function fetchOEmbedResponse( break; } case "bsky": { - console.log(url); uri = `https://embed.bsky.app/oembed?url=${encodeURIComponent(url)}`; break; }