From 8e9651cec49d08e28baf0dd5ed6f9fae0b2da792 Mon Sep 17 00:00:00 2001
From: Lexie <me@rapougnac.moe>
Date: Mon, 22 Jul 2024 21:46:42 +0000
Subject: [PATCH] fix: seems to work (#1)

---
 README.md                                     | 15 ++--
 package.json                                  |  4 +-
 src/components/Post.tsx                       | 70 ++++++++++++-------
 src/components/Profile.tsx                    |  2 +
 ...parseEmbedImage.ts => parseEmbedImages.ts} | 15 ++--
 src/routes/getOEmbed.ts                       | 10 ++-
 src/routes/getPost.tsx                        |  2 +-
 wrangler.toml                                 |  4 +-
 8 files changed, 77 insertions(+), 45 deletions(-)
 rename src/lib/{parseEmbedImage.ts => parseEmbedImages.ts} (76%)

diff --git a/README.md b/README.md
index 8636459..9f2a811 100644
--- a/README.md
+++ b/README.md
@@ -1,17 +1,18 @@
-# FixBluesky 🛠️ (Inspired by [FixTweet](https://github.com/FixTweet/FixTweet))
+# VixBluesky 🛠️ (Inspired by [FixTweet](https://github.com/FixTweet/FixTweet))
 
-Embed Bluesky links in Discord
+> [!IMPORTANT]
+> This is a fork of [FixBluesky](https://github.com/ItsRauf/FixBluesky) by [@ItsRauf](https://www.github.com/ItsRauf).
+> All credits go to them for the original idea and implementation.
 
-## Written With
-
-[![Tech Stack](https://skillicons.dev/icons?i=ts,html,workers)](https://skillicons.dev)
+Embed Bluesky links in Discord.
 
 ## How To Use?
 
-#### Simply replace the `k` in `bsky.app` with a `y`
+#### Simply append `x` at the end of `bsky.app`.
 
 _or you can post the link in Discord and type `s/k/y`_
 
 ## Authors
 
-- [@ItsRauf](https://www.github.com/ItsRauf)
+- [@ItsRauf](https://www.github.com/ItsRauf) - Original author
+- [@Lexedia](https://www.github.com/Rapougnac)
diff --git a/package.json b/package.json
index 88a4ff0..c62a4e2 100644
--- a/package.json
+++ b/package.json
@@ -4,8 +4,8 @@
     "deploy": "wrangler deploy --minify src/index.ts"
   },
   "dependencies": {
-    "@atproto/api": "^0.4.0",
-    "hono": "^3.3.0"
+    "@atproto/api": "^0.12.24",
+    "hono": "^4.5.1"
   },
   "devDependencies": {
     "@cloudflare/workers-types": "^4.20230628.0",
diff --git a/src/components/Post.tsx b/src/components/Post.tsx
index 59d8aea..dcede5f 100644
--- a/src/components/Post.tsx
+++ b/src/components/Post.tsx
@@ -1,8 +1,8 @@
-import { AppBskyFeedDefs } from "@atproto/api";
+import { AppBskyEmbedImages, AppBskyFeedDefs } from "@atproto/api";
 
 import { Layout } from "./Layout";
 import { OEmbedTypes } from "../routes/getOEmbed";
-import { parseEmbedImage } from "../lib/parseEmbedImage";
+import { parseEmbedImages } from "../lib/parseEmbedImages";
 import { parseEmbedDescription } from "../lib/parseEmbedDescription";
 
 interface PostProps {
@@ -11,28 +11,46 @@ interface PostProps {
   appDomain: string;
 }
 
-export const Post = ({ post, url, appDomain }: PostProps) => (
-  <Layout url={url}>
-    <meta name="twitter:creator" content={`@${post.author.handle}`} />
-    <meta property="og:description" content={parseEmbedDescription(post)} />
-    <meta
-      property="og:title"
-      content={`${post.author.displayName} (@${post.author.handle})`}
-    />
-
-    {!(parseEmbedImage(post) === post.author.avatar) && (
-      <meta name="twitter:card" content="summary_large_image" />
-    )}
-
-    <meta property="og:image" content={parseEmbedImage(post)} />
-
-    <link
-      type="application/json+oembed"
-      href={`https:/${appDomain}/oembed?type=${OEmbedTypes.Post}&replies=${
-        post.replyCount
-      }&reposts=${post.repostCount}&likes=${
-        post.likeCount
-      }&avatar=${encodeURIComponent(post.author.avatar ?? "")}`}
-    />
-  </Layout>
+const Meta = (post: AppBskyFeedDefs.PostView) => (
+  <>
+    <meta name="article:published_time" content={post.indexedAt} />
+    <meta name="twitter:card" content="summary_large_image" />
+    {/* <meta name="apple-mobile-web-app-title" content={post.author.handle} />
+    <link rel="apple-touch-icon" href={post.author.avatar} /> */}
+  </>
 );
+
+export const Post = ({ post, url, appDomain }: PostProps) => {
+  const images = parseEmbedImages(post);
+  const isAuthor = images === post.author.avatar;
+
+  return (
+    <Layout url={url}>
+      <meta name="twitter:creator" content={`@${post.author.handle}`} />
+      <meta property="og:description" content={parseEmbedDescription(post)} />
+      <meta property="og:title" content={post.author.displayName} />
+      {console.log(post)}
+      <meta property="og:updated_time" content={post.indexedAt} />
+      <meta property="article:published_time" content={post.indexedAt} />
+
+      {images && typeof images === "string" ? (
+        <meta property="og:image" content={images} />
+      ) : (
+        (images as AppBskyEmbedImages.ViewImage[]).map((img) => (
+          <meta property="og:image" content={img.fullsize} />
+        ))
+      )}
+
+      {!isAuthor && <Meta {...post} />}
+
+      <link
+        type="application/json+oembed"
+        href={`https:/${appDomain}/oembed?type=${OEmbedTypes.Post}&replies=${
+          post.replyCount
+        }&reposts=${post.repostCount}&likes=${
+          post.likeCount
+        }&avatar=${encodeURIComponent(post.author.avatar ?? "")}`}
+      />
+    </Layout>
+  );
+};
diff --git a/src/components/Profile.tsx b/src/components/Profile.tsx
index b2e9008..0ba5329 100644
--- a/src/components/Profile.tsx
+++ b/src/components/Profile.tsx
@@ -11,6 +11,7 @@ interface ProfileProps {
 
 export const Profile = ({ profile, url, appDomain }: ProfileProps) => (
   <Layout url={url}>
+    <meta name="og:type" content="article" />
     <meta name="twitter:creator" content={`@${profile.handle}`} />
     <meta property="og:description" content={profile.description ?? ""} />
     <meta
@@ -18,6 +19,7 @@ export const Profile = ({ profile, url, appDomain }: ProfileProps) => (
       content={`${profile.displayName} (@${profile.handle})`}
     />
     <meta property="og:image" content={profile.avatar} />
+    <meta properpty="article:published_time" content={profile.createdAt} />
 
     <link
       type="application/json+oembed"
diff --git a/src/lib/parseEmbedImage.ts b/src/lib/parseEmbedImages.ts
similarity index 76%
rename from src/lib/parseEmbedImage.ts
rename to src/lib/parseEmbedImages.ts
index c7a2014..5b38dc8 100644
--- a/src/lib/parseEmbedImage.ts
+++ b/src/lib/parseEmbedImages.ts
@@ -5,7 +5,11 @@ import {
   AppBskyFeedDefs,
 } from "@atproto/api";
 
-export function parseEmbedImage(post: AppBskyFeedDefs.PostView) {
+export function parseEmbedImages(
+  post: AppBskyFeedDefs.PostView
+): string | AppBskyEmbedImages.ViewImage[] {
+  let images: AppBskyEmbedImages.ViewImage[] = [];
+
   if (AppBskyEmbedRecord.isView(post.embed)) {
     const { success: isView } = AppBskyEmbedRecord.validateView(post.embed);
     if (isView && AppBskyEmbedRecord.isViewRecord(post.embed.record)) {
@@ -21,7 +25,7 @@ export function parseEmbedImage(post: AppBskyFeedDefs.PostView) {
           post.embed.record.embeds[0]
         );
         if (isImageView) {
-          return post.embed.record.embeds[0].images[0].fullsize;
+          images = [...images, ...post.embed.record.embeds[0].images];
         }
       }
     }
@@ -35,7 +39,7 @@ export function parseEmbedImage(post: AppBskyFeedDefs.PostView) {
         post.embed.media
       );
       if (isImageView) {
-        return post.embed.media.images[0].fullsize;
+        images = [...images, ...post.embed.media.images];
       }
     }
   }
@@ -44,8 +48,9 @@ export function parseEmbedImage(post: AppBskyFeedDefs.PostView) {
       post.embed
     );
     if (isImageView) {
-      return post.embed.images[0].fullsize;
+      images = [...images, ...post.embed.images];
     }
   }
-  return post.author.avatar ?? "";
+
+  return images.length === 0 ? post.author.avatar ?? "" : images;
 }
diff --git a/src/routes/getOEmbed.ts b/src/routes/getOEmbed.ts
index d935f8f..9eede62 100644
--- a/src/routes/getOEmbed.ts
+++ b/src/routes/getOEmbed.ts
@@ -11,14 +11,20 @@ export const getOEmbed: Handler<Env, "/oembed"> = async (c) => {
 
   const defaults = {
     provider_name: "FixBluesky",
-    provider_url: "https://bsyy.app/",
-    thumbnail_url: avatar,
+    provider_url: "https://bskyx.app/",
     thumbnail_width: 1000,
     thumbnail_height: 1000,
+    author_url: 'https://google.com',
   };
 
+  if (avatar !== undefined) {
+    (defaults as typeof defaults & { thumbnail_url?: string }).thumbnail_url =
+      decodeURIComponent(avatar);
+  }
+
   if (type === OEmbedTypes.Post) {
     const { replies, reposts, likes } = c.req.query();
+
     return c.json({
       author_name: `🗨️ ${replies}    ♻️ ${reposts}    💙 ${likes}`,
       ...defaults,
diff --git a/src/routes/getPost.tsx b/src/routes/getPost.tsx
index 1f253d0..ead9e7a 100644
--- a/src/routes/getPost.tsx
+++ b/src/routes/getPost.tsx
@@ -15,7 +15,7 @@ export const getPost: Handler<
       message: "Failed to fetch the post!",
     });
   }
-  // return c.html(genHTML(data.posts[0], c.req.path));
+
   return c.html(
     <Post
       post={data.posts[0]}
diff --git a/wrangler.toml b/wrangler.toml
index c81b573..add2325 100644
--- a/wrangler.toml
+++ b/wrangler.toml
@@ -3,8 +3,8 @@ main = "src/index.ts"
 compatibility_date = "2023-01-01"
 
 workers_dev = false
-route = { pattern = "bsyy.app/*", zone_name = "bsyy.app" }
+route = { pattern = "bskyx.app/*", zone_name = "bskyx.app" }
 
 [vars]
 BSKY_SERVICE_URL="https://bsky.social/"
-FIXBLUESKY_APP_DOMAIN="bsyy.app"
+FIXBLUESKY_APP_DOMAIN="bskyx.app"