From 2ebe003b93d21aea1b4adff9d04d0773fb764791 Mon Sep 17 00:00:00 2001
From: kakkokari-gtyih <67428053+kakkokari-gtyih@users.noreply.github.com>
Date: Sun, 10 Nov 2024 16:27:36 +0900
Subject: [PATCH 1/8] =?UTF-8?q?enhance(frontend):=20bluesky=E3=81=AE?=
 =?UTF-8?q?=E6=8A=95=E7=A8=BF=E5=9F=8B=E3=82=81=E8=BE=BC=E3=81=BF=E8=A1=A8?=
 =?UTF-8?q?=E7=A4=BA=E3=81=AB=E5=AF=BE=E5=BF=9C?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 locales/index.d.ts                            |  2 +-
 locales/ja-JP.yml                             |  2 +-
 .../frontend/src/components/MkUrlPreview.vue  | 93 ++++++++++++++++---
 packages/frontend/src/index.html              |  2 +-
 4 files changed, 83 insertions(+), 16 deletions(-)

diff --git a/locales/index.d.ts b/locales/index.d.ts
index 440f24ac84..c984f2a8c8 100644
--- a/locales/index.d.ts
+++ b/locales/index.d.ts
@@ -2585,7 +2585,7 @@ export interface Locale extends ILocale {
     /**
      * ポストを展開する
      */
-    "expandTweet": string;
+    "expandPost": string;
     /**
      * テーマエディター
      */
diff --git a/locales/ja-JP.yml b/locales/ja-JP.yml
index 5d8e1a5e72..5aa72f602e 100644
--- a/locales/ja-JP.yml
+++ b/locales/ja-JP.yml
@@ -641,7 +641,7 @@ poll: "アンケート"
 useCw: "内容を隠す"
 enablePlayer: "プレイヤーを開く"
 disablePlayer: "プレイヤーを閉じる"
-expandTweet: "ポストを展開する"
+expandPost: "ポストを展開する"
 themeEditor: "テーマエディター"
 description: "説明"
 describeFile: "キャプションを付ける"
diff --git a/packages/frontend/src/components/MkUrlPreview.vue b/packages/frontend/src/components/MkUrlPreview.vue
index f0da8fd3f2..437cb0e57f 100644
--- a/packages/frontend/src/components/MkUrlPreview.vue
+++ b/packages/frontend/src/components/MkUrlPreview.vue
@@ -27,9 +27,8 @@ SPDX-License-Identifier: AGPL-3.0-only
 	</div>
 </template>
 <template v-else-if="tweetId && tweetExpanded">
-	<div ref="twitter">
+	<div>
 		<iframe
-			ref="tweet"
 			allow="fullscreen;web-share"
 			sandbox="allow-popups allow-popups-to-escape-sandbox allow-scripts allow-same-origin"
 			scrolling="no"
@@ -43,6 +42,22 @@ SPDX-License-Identifier: AGPL-3.0-only
 		</MkButton>
 	</div>
 </template>
+<template v-else-if="bskyDid && bskyPostRecordKey && bskyPostExpanded">
+	<div>
+		<iframe
+			allow="fullscreen;web-share"
+			sandbox="allow-popups allow-popups-to-escape-sandbox allow-scripts allow-same-origin"
+			scrolling="no"
+			:style="{ position: 'relative', width: '100%', height: `${bskyPostHeight}px`, border: 0 }"
+			:src="`https://embed.bsky.app/embed/${bskyDid}/app.bsky.feed.post/${bskyPostRecordKey}?id=${embedId}`"
+		></iframe>
+	</div>
+	<div :class="$style.action">
+		<MkButton :small="true" inline @click="bskyPostExpanded = false">
+			<i class="ti ti-x"></i> {{ i18n.ts.close }}
+		</MkButton>
+	</div>
+</template>
 <div v-else>
 	<component :is="self ? 'MkA' : 'a'" :class="[$style.link, { [$style.compact]: compact }]" :[attr]="self ? url.substring(local.length) : url" rel="nofollow noopener" :target="target" :title="url">
 		<div v-if="thumbnail && !sensitive" :class="$style.thumbnail" :style="defaultStore.state.dataSaver.urlPreview ? '' : `background-image: url('${thumbnail}')`">
@@ -67,7 +82,12 @@ SPDX-License-Identifier: AGPL-3.0-only
 	<template v-if="showActions">
 		<div v-if="tweetId" :class="$style.action">
 			<MkButton :small="true" inline @click="tweetExpanded = true">
-				<i class="ti ti-brand-x"></i> {{ i18n.ts.expandTweet }}
+				<i class="ti ti-brand-x"></i> {{ i18n.ts.expandPost }}
+			</MkButton>
+		</div>
+		<div v-if="bskyPostRecordKey" :class="$style.action">
+			<MkButton :small="true" inline @click="openBskyEmbed">
+				<i class="ti ti-brand-bluesky"></i> {{ i18n.ts.expandPost }}
 			</MkButton>
 		</div>
 		<div v-if="!playerEnabled && player.url" :class="$style.action">
@@ -126,10 +146,19 @@ const player = ref({
 	height: null,
 } as SummalyResult['player']);
 const playerEnabled = ref(false);
+
+const embedId = `embed${Math.random().toString().replace(/\D/, '')}`;
+
 const tweetId = ref<string | null>(null);
 const tweetExpanded = ref(props.detail);
-const embedId = `embed${Math.random().toString().replace(/\D/, '')}`;
 const tweetHeight = ref(150);
+
+const bskyHandleOrDid = ref<string | null>(null);
+const bskyDid = ref<string | null>(null);
+const bskyPostRecordKey = ref<string | null>(null);
+const bskyPostExpanded = ref(props.detail);
+const bskyPostHeight = ref(150);
+
 const unknownUrl = ref(false);
 
 onDeactivated(() => {
@@ -144,6 +173,19 @@ if (requestUrl.hostname === 'twitter.com' || requestUrl.hostname === 'mobile.twi
 	if (m) tweetId.value = m[1];
 }
 
+if (requestUrl.hostname === 'bsky.app') {
+	const bskyPostPageUrl = requestUrl.pathname.slice(1).split('/');
+
+	if (bskyPostPageUrl[0] === 'profile' && bskyPostPageUrl[1] && bskyPostPageUrl[2] === 'post' && bskyPostPageUrl[3]) {
+		bskyHandleOrDid.value = bskyPostPageUrl[1];
+		bskyPostRecordKey.value = bskyPostPageUrl[3];
+
+		if (bskyPostExpanded.value) {
+			openBskyEmbed();
+		}
+	}
+}
+
 if (requestUrl.hostname === 'music.youtube.com' && requestUrl.pathname.match('^/(?:watch|channel)')) {
 	requestUrl.hostname = 'www.youtube.com';
 }
@@ -180,13 +222,23 @@ window.fetch(`/url?url=${encodeURIComponent(requestUrl.href)}&lang=${versatileLa
 		sensitive.value = info.sensitive ?? false;
 	});
 
-function adjustTweetHeight(message: MessageEvent) {
-	if (message.origin !== 'https://platform.twitter.com') return;
-	const embed = message.data?.['twttr.embed'];
-	if (embed?.method !== 'twttr.private.resize') return;
-	if (embed?.id !== embedId) return;
-	const height = embed?.params[0]?.height;
-	if (height) tweetHeight.value = height;
+async function openBskyEmbed() {
+	if (bskyHandleOrDid.value == null || bskyPostRecordKey.value == null) return;
+
+	if (bskyDid.value == null) {
+		if (bskyHandleOrDid.value.startsWith('did:')) {
+			bskyDid.value = bskyHandleOrDid.value;
+		} else {
+			// handleで来ている場合はdidに変換
+			const bskyApiRes = await window.fetch(`https://public.api.bsky.app/xrpc/com.atproto.identity.resolveHandle?handle=${bskyHandleOrDid.value}`);
+			if (bskyApiRes.ok) {
+				const bskyApiData = await bskyApiRes.json() as { did: string };
+				bskyDid.value = bskyApiData.did;
+			}
+		}
+	}
+
+	bskyPostExpanded.value = true;
 }
 
 function openPlayer(): void {
@@ -199,10 +251,25 @@ function openPlayer(): void {
 	});
 }
 
-window.addEventListener('message', adjustTweetHeight);
+function adjustSocialsEmbedHeight(message: MessageEvent) {
+	if (message.origin === 'https://platform.twitter.com') {
+		const embed = message.data?.['twttr.embed'];
+		if (embed?.method === 'twttr.private.resize' && embed?.id === embedId) {
+			const height = embed?.params[0]?.height;
+			if (height) tweetHeight.value = height;
+		}
+	} else if (message.origin === 'https://embed.bsky.app') {
+		if (message.data?.id === embedId) {
+			const height = message.data?.height;
+			if (height) bskyPostHeight.value = height;
+		}
+	}
+}
+
+window.addEventListener('message', adjustSocialsEmbedHeight);
 
 onUnmounted(() => {
-	window.removeEventListener('message', adjustTweetHeight);
+	window.removeEventListener('message', adjustSocialsEmbedHeight);
 });
 </script>
 
diff --git a/packages/frontend/src/index.html b/packages/frontend/src/index.html
index 08ff0c58dd..14dfe62dba 100644
--- a/packages/frontend/src/index.html
+++ b/packages/frontend/src/index.html
@@ -22,7 +22,7 @@
 			style-src 'self' 'unsafe-inline';
 			img-src 'self' data: blob: www.google.com xn--931a.moe localhost:3000 localhost:5173 127.0.0.1:5173 127.0.0.1:3000;
 			media-src 'self' localhost:3000 localhost:5173 127.0.0.1:5173 127.0.0.1:3000;
-			connect-src 'self' localhost:3000 localhost:5173 127.0.0.1:5173 127.0.0.1:3000 https://newassets.hcaptcha.com;
+			connect-src 'self' localhost:3000 localhost:5173 127.0.0.1:5173 127.0.0.1:3000 https://newassets.hcaptcha.com https://public.api.bsky.app;
 			frame-src *;"
 	/>
 	<meta property="og:site_name" content="[DEV BUILD] Misskey" />

From 9bd7af57e37db0b9eb700a0cf6ac6eca7712bf7c Mon Sep 17 00:00:00 2001
From: kakkokari-gtyih <67428053+kakkokari-gtyih@users.noreply.github.com>
Date: Sun, 10 Nov 2024 16:28:00 +0900
Subject: [PATCH 2/8] Update Changelog

---
 CHANGELOG.md | 1 +
 1 file changed, 1 insertion(+)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 8f428c1c15..c109fcd25b 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -17,6 +17,7 @@
 - Enhance: Self-XSS防止用の警告を追加
 - Enhance: カタルーニャ語 (ca-ES) に対応
 - Enhance: 個別お知らせページではMetaタグを出力するように
+- Enhance: Blueskyの投稿埋め込みプレビューに対応
 - Fix: 通知の範囲指定の設定項目が必要ない通知設定でも範囲指定の設定がでている問題を修正
 - Fix: Turnstileが失敗・期限切れした際にも成功扱いとなってしまう問題を修正  
   (Cherry-picked from https://github.com/MisskeyIO/misskey/pull/768)

From 438cb633036d785f4637a17a5c2362b6d13e2a17 Mon Sep 17 00:00:00 2001
From: kakkokari-gtyih <67428053+kakkokari-gtyih@users.noreply.github.com>
Date: Sun, 17 Nov 2024 10:44:59 +0900
Subject: [PATCH 3/8] unify *postExpanded

---
 packages/frontend/src/components/MkUrlPreview.vue | 11 +++++------
 1 file changed, 5 insertions(+), 6 deletions(-)

diff --git a/packages/frontend/src/components/MkUrlPreview.vue b/packages/frontend/src/components/MkUrlPreview.vue
index 437cb0e57f..794ca6963c 100644
--- a/packages/frontend/src/components/MkUrlPreview.vue
+++ b/packages/frontend/src/components/MkUrlPreview.vue
@@ -26,7 +26,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 		</MkButton>
 	</div>
 </template>
-<template v-else-if="tweetId && tweetExpanded">
+<template v-else-if="tweetId && postExpanded">
 	<div>
 		<iframe
 			allow="fullscreen;web-share"
@@ -42,7 +42,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 		</MkButton>
 	</div>
 </template>
-<template v-else-if="bskyDid && bskyPostRecordKey && bskyPostExpanded">
+<template v-else-if="bskyDid && bskyPostRecordKey && postExpanded">
 	<div>
 		<iframe
 			allow="fullscreen;web-share"
@@ -81,7 +81,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 	</component>
 	<template v-if="showActions">
 		<div v-if="tweetId" :class="$style.action">
-			<MkButton :small="true" inline @click="tweetExpanded = true">
+			<MkButton :small="true" inline @click="postExpanded = true">
 				<i class="ti ti-brand-x"></i> {{ i18n.ts.expandPost }}
 			</MkButton>
 		</div>
@@ -148,15 +148,14 @@ const player = ref({
 const playerEnabled = ref(false);
 
 const embedId = `embed${Math.random().toString().replace(/\D/, '')}`;
+const postExpanded = ref(props.detail);
 
 const tweetId = ref<string | null>(null);
-const tweetExpanded = ref(props.detail);
 const tweetHeight = ref(150);
 
 const bskyHandleOrDid = ref<string | null>(null);
 const bskyDid = ref<string | null>(null);
 const bskyPostRecordKey = ref<string | null>(null);
-const bskyPostExpanded = ref(props.detail);
 const bskyPostHeight = ref(150);
 
 const unknownUrl = ref(false);
@@ -238,7 +237,7 @@ async function openBskyEmbed() {
 		}
 	}
 
-	bskyPostExpanded.value = true;
+	postExpanded.value = true;
 }
 
 function openPlayer(): void {

From 6df2a747472ea90e321d8b302d580c149d6daa68 Mon Sep 17 00:00:00 2001
From: kakkokari-gtyih <67428053+kakkokari-gtyih@users.noreply.github.com>
Date: Sun, 17 Nov 2024 11:54:27 +0900
Subject: [PATCH 4/8] fix

---
 packages/frontend/src/components/MkUrlPreview.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/frontend/src/components/MkUrlPreview.vue b/packages/frontend/src/components/MkUrlPreview.vue
index 794ca6963c..e2f94b351a 100644
--- a/packages/frontend/src/components/MkUrlPreview.vue
+++ b/packages/frontend/src/components/MkUrlPreview.vue
@@ -53,7 +53,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 		></iframe>
 	</div>
 	<div :class="$style.action">
-		<MkButton :small="true" inline @click="bskyPostExpanded = false">
+		<MkButton :small="true" inline @click="postExpanded = false">
 			<i class="ti ti-x"></i> {{ i18n.ts.close }}
 		</MkButton>
 	</div>

From eaaeeb1018c2514e8fce4f36cdfd0f4063d402c1 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E3=81=8B=E3=81=A3=E3=81=93=E3=81=8B=E3=82=8A?=
 <67428053+kakkokari-gtyih@users.noreply.github.com>
Date: Mon, 18 Nov 2024 20:31:48 +0900
Subject: [PATCH 5/8] Update MkUrlPreview.vue

---
 packages/frontend/src/components/MkUrlPreview.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/frontend/src/components/MkUrlPreview.vue b/packages/frontend/src/components/MkUrlPreview.vue
index e2f94b351a..c6fed474f6 100644
--- a/packages/frontend/src/components/MkUrlPreview.vue
+++ b/packages/frontend/src/components/MkUrlPreview.vue
@@ -179,7 +179,7 @@ if (requestUrl.hostname === 'bsky.app') {
 		bskyHandleOrDid.value = bskyPostPageUrl[1];
 		bskyPostRecordKey.value = bskyPostPageUrl[3];
 
-		if (bskyPostExpanded.value) {
+		if (postExpanded.value) {
 			openBskyEmbed();
 		}
 	}

From 23610e8c323acf83d1b4c82fd21c8411f31769c2 Mon Sep 17 00:00:00 2001
From: kakkokari-gtyih <67428053+kakkokari-gtyih@users.noreply.github.com>
Date: Tue, 19 Nov 2024 09:09:15 +0900
Subject: [PATCH 6/8] unify postHeight

---
 packages/frontend/src/components/MkUrlPreview.vue | 11 +++++------
 1 file changed, 5 insertions(+), 6 deletions(-)

diff --git a/packages/frontend/src/components/MkUrlPreview.vue b/packages/frontend/src/components/MkUrlPreview.vue
index e2f94b351a..e91297cc8c 100644
--- a/packages/frontend/src/components/MkUrlPreview.vue
+++ b/packages/frontend/src/components/MkUrlPreview.vue
@@ -32,7 +32,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 			allow="fullscreen;web-share"
 			sandbox="allow-popups allow-popups-to-escape-sandbox allow-scripts allow-same-origin"
 			scrolling="no"
-			:style="{ position: 'relative', width: '100%', height: `${tweetHeight}px`, border: 0 }"
+			:style="{ position: 'relative', width: '100%', height: `${postHeight}px`, border: 0 }"
 			:src="`https://platform.twitter.com/embed/index.html?embedId=${embedId}&amp;hideCard=false&amp;hideThread=false&amp;lang=en&amp;theme=${defaultStore.state.darkMode ? 'dark' : 'light'}&amp;id=${tweetId}`"
 		></iframe>
 	</div>
@@ -48,7 +48,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 			allow="fullscreen;web-share"
 			sandbox="allow-popups allow-popups-to-escape-sandbox allow-scripts allow-same-origin"
 			scrolling="no"
-			:style="{ position: 'relative', width: '100%', height: `${bskyPostHeight}px`, border: 0 }"
+			:style="{ position: 'relative', width: '100%', height: `${postHeight}px`, border: 0 }"
 			:src="`https://embed.bsky.app/embed/${bskyDid}/app.bsky.feed.post/${bskyPostRecordKey}?id=${embedId}`"
 		></iframe>
 	</div>
@@ -149,14 +149,13 @@ const playerEnabled = ref(false);
 
 const embedId = `embed${Math.random().toString().replace(/\D/, '')}`;
 const postExpanded = ref(props.detail);
+const postHeight = ref(150);
 
 const tweetId = ref<string | null>(null);
-const tweetHeight = ref(150);
 
 const bskyHandleOrDid = ref<string | null>(null);
 const bskyDid = ref<string | null>(null);
 const bskyPostRecordKey = ref<string | null>(null);
-const bskyPostHeight = ref(150);
 
 const unknownUrl = ref(false);
 
@@ -255,12 +254,12 @@ function adjustSocialsEmbedHeight(message: MessageEvent) {
 		const embed = message.data?.['twttr.embed'];
 		if (embed?.method === 'twttr.private.resize' && embed?.id === embedId) {
 			const height = embed?.params[0]?.height;
-			if (height) tweetHeight.value = height;
+			if (height) postHeight.value = height;
 		}
 	} else if (message.origin === 'https://embed.bsky.app') {
 		if (message.data?.id === embedId) {
 			const height = message.data?.height;
-			if (height) bskyPostHeight.value = height;
+			if (height) postHeight.value = height;
 		}
 	}
 }

From 3bc46908d609b5d609fb7a92966c496db56b00ba Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E3=81=8B=E3=81=A3=E3=81=93=E3=81=8B=E3=82=8A?=
 <67428053+kakkokari-gtyih@users.noreply.github.com>
Date: Sat, 23 Nov 2024 15:27:22 +0900
Subject: [PATCH 7/8] Update CHANGELOG.md

---
 CHANGELOG.md | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index dc218fdda1..bde010c105 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -4,7 +4,7 @@
 -
 
 ### Client
--
+- Enhance: Blueskyの投稿埋め込みプレビューに対応
 
 ### Server
 -
@@ -43,7 +43,6 @@
 - Enhance: サイドバーを簡単に展開・折りたたみできるように ( #14981 )
 - Enhance: リノートメニューに「リノートの詳細」を追加
 - Enhance: 非ログイン状態でMisskeyを開いた際のパフォーマンスを向上
-- Enhance: Blueskyの投稿埋め込みプレビューに対応
 - Fix: 通知の範囲指定の設定項目が必要ない通知設定でも範囲指定の設定がでている問題を修正
 - Fix: Turnstileが失敗・期限切れした際にも成功扱いとなってしまう問題を修正  
   (Cherry-picked from https://github.com/MisskeyIO/misskey/pull/768)

From 577237c6ff6810fa28063698f6fae855582c16f1 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E3=81=8B=E3=81=A3=E3=81=93=E3=81=8B=E3=82=8A?=
 <67428053+kakkokari-gtyih@users.noreply.github.com>
Date: Fri, 29 Nov 2024 10:44:38 +0900
Subject: [PATCH 8/8] =?UTF-8?q?fix(frontend):=20=E3=83=84=E3=82=A4?=
 =?UTF-8?q?=E3=83=BC=E3=83=88=E5=9F=8B=E3=82=81=E8=BE=BC=E3=81=BF=E8=A1=A8?=
 =?UTF-8?q?=E7=A4=BA=E3=81=8C=E9=96=89=E3=81=98=E3=82=8C=E3=81=AA=E3=81=84?=
 =?UTF-8?q?=E5=95=8F=E9=A1=8C=E3=82=92=E4=BF=AE=E6=AD=A3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/frontend/src/components/MkUrlPreview.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/frontend/src/components/MkUrlPreview.vue b/packages/frontend/src/components/MkUrlPreview.vue
index be940c8c55..1dcfb7bbdf 100644
--- a/packages/frontend/src/components/MkUrlPreview.vue
+++ b/packages/frontend/src/components/MkUrlPreview.vue
@@ -37,7 +37,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 		></iframe>
 	</div>
 	<div :class="$style.action">
-		<MkButton :small="true" inline @click="tweetExpanded = false">
+		<MkButton :small="true" inline @click="postExpanded = false">
 			<i class="ti ti-x"></i> {{ i18n.ts.close }}
 		</MkButton>
 	</div>