a bit more plumbing bluesky through types and resolvers

it's a bit worrying just how many places you need to update to add one media type 😅
coralproject · Nov 29, 2024 · 5710379 · 5710379
1 parent dfa37fc
commit 5710379
Show file tree

Hide file tree

Showing 7 changed files with 27 additions and 0 deletions.
diff --git a/client/src/core/client/admin/test/fixtures.ts b/client/src/core/client/admin/test/fixtures.ts
@@ -209,6 +209,7 @@ export const settings = createFixture<GQLSettings>({
   premoderateSuspectWords: false,
   media: {
     twitter: { enabled: false },
+    bluesky: { enabled: false },
     gifs: { enabled: false },
     youtube: { enabled: false },
     external: { enabled: false },

diff --git a/client/src/core/client/stream/tabs/Comments/Comment/EditCommentForm/EditCommentMutation.ts b/client/src/core/client/stream/tabs/Comments/Comment/EditCommentForm/EditCommentMutation.ts
@@ -43,6 +43,10 @@ const mutation = graphql`
               url
               width
             }
+            ... on BlueskyMedia {
+              url
+              width
+            }
             ... on YouTubeMedia {
               url
               width

diff --git a/.../src/core/client/stream/tabs/Comments/Comment/MediaConfirmation/MediaConfirmationIcon.tsx b/.../src/core/client/stream/tabs/Comments/Comment/MediaConfirmation/MediaConfirmationIcon.tsx
@@ -2,6 +2,7 @@ import React, { FunctionComponent } from "react";
 
 import { MediaLink } from "coral-common/common/lib/helpers/findMediaLinks";
 import {
+  BlueskyLogoIcon,
   ImageFileLandscapeIcon,
   SvgIcon,
   VideoPlayerIcon,
@@ -20,6 +21,9 @@ const MediaConfirmationIcon: FunctionComponent<Props> = ({ media }) => {
       {media.type === "twitter" && (
         <SvgIcon size="xs" filled="currentColor" Icon={XLogoTwitterIcon} />
       )}
+      {media.type === "bsky" && (
+        <SvgIcon size="xs" filled="currentColor" Icon={BlueskyLogoIcon} />
+      )}
     </>
   );
 };

diff --git a/client/src/core/client/ui/components/icons/BlueskyLogoIcon.tsx b/client/src/core/client/ui/components/icons/BlueskyLogoIcon.tsx
@@ -0,0 +1,15 @@
+import React, { FunctionComponent } from "react";
+
+const BlueskyLogoIcon: FunctionComponent = () => {
+  // https://www.streamlinehq.com/icons/streamline-regular/logos/social-medias/x-logo-twitter
+  return (
+    <svg version="1.1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
+      <path
+        d="m135.72 44.03c66.496 49.921 138.02 151.14 164.28 205.46 26.262-54.316 97.782-155.54 164.28-205.46 47.98-36.021 125.72-63.892 125.72 24.795 0 17.712-10.155 148.79-16.111 170.07-20.703 73.984-96.144 92.854-163.25 81.433 117.3 19.964 147.14 86.092 82.697 152.22-122.39 125.59-175.91-31.511-189.63-71.766-2.514-7.3797-3.6904-10.832-3.7077-7.8964-0.0174-2.9357-1.1937 0.51669-3.7077 7.8964-13.714 40.255-67.233 197.36-189.63 71.766-64.444-66.128-34.605-132.26 82.697-152.22-67.108 11.421-142.55-7.4491-163.25-81.433-5.9562-21.282-16.111-152.36-16.111-170.07 0-88.687 77.742-60.816 125.72-24.795z"
+        fill="currentColor"
+      />
+    </svg>
+  );
+};
+
+export default BlueskyLogoIcon;
diff --git a/client/src/core/client/ui/components/icons/index.ts b/client/src/core/client/ui/components/icons/index.ts
@@ -92,3 +92,4 @@ export { default as VideoPlayerIcon } from "./VideoPlayerIcon";
 export { default as ViewIcon } from "./ViewIcon";
 export { default as ViewOffIcon } from "./ViewOffIcon";
 export { default as XLogoTwitterIcon } from "./XLogoTwitterIcon";
+export { default as BlueskyLogoIcon } from "./BlueskyLogoIcon";
diff --git a/locales/en-US/admin.ftl b/locales/en-US/admin.ftl
@@ -435,6 +435,7 @@ configure-general-embedLinks-desc =
 configure-general-embedLinks-description = 
   Allow commenters to add a YouTube video, X post or GIF's to the end of their comment
 configure-general-embedLinks-enableTwitterEmbeds = Allow X post embeds
+configure-general-embedLinks-enableBlueskeyEmbeds = Allow Bluesky post embeds
 configure-general-embedLinks-enableYouTubeEmbeds = Allow YouTube embeds
 configure-general-embedLinks-enableGifs = Allow GIFs
 configure-general-embedLinks-enableExternalEmbeds = Enable external media

diff --git a/server/src/core/server/graph/resolvers/MediaConfiguration.ts b/server/src/core/server/graph/resolvers/MediaConfiguration.ts
@@ -7,6 +7,7 @@ export const MediaConfiguration: GQLMediaConfigurationTypeResolver<
   Partial<GQLMediaConfiguration>
 > = {
   twitter: ({ twitter = {} }) => twitter,
+  bluesky: ({ bluesky = {} }) => bluesky,
   youtube: ({ youtube = {} }) => youtube,
   gifs: ({ gifs = {} }) => gifs,
   external: () => ({}),
-Original file line number
+Diff line change
@@ Expand Up / @@ -43,6 +43,10 @@ const mutation = graphql` @@
                   url
                   width
                 }
+                ... on BlueskyMedia {
+                  url
+                  width
+                }
                 ... on YouTubeMedia {
                   url
                   width
@@ Expand Down @@