feat: support summary_large_image (#10862)

* feat: use summary_large_image

* chore: add video

* chore: ignore sensitive image on note

8 files changed, 22 insertions, 2 deletions

diff --git a/packages/backend/src/server/web/views/base.pug b/packages/backend/src/server/web/views/base.pug
index cb5d05a403..25513cc4cc 100644
--- a/packages/backend/src/server/web/views/base.pug
+++ b/packages/backend/src/server/web/views/base.pug
@@ -25,7 +25,6 @@ html
 		meta(name='referrer' content='origin')
 		meta(name='theme-color' content= themeColor || '#86b300')
 		meta(name='theme-color-orig' content= themeColor || '#86b300')
-		meta(property='twitter:card' content='summary')
 		meta(property='og:site_name' content= instanceName || 'Misskey')
 		meta(name='viewport' content='width=device-width, initial-scale=1')
 		link(rel='icon' href= icon || '/favicon.ico')
@@ -59,6 +58,7 @@ html
 			meta(property='og:title'       content= title || 'Misskey') 
 			meta(property='og:description' content= desc || '✨🌎✨ A interplanetary communication platform ✨🚀✨') 
 			meta(property='og:image'       content= img)
+			meta(property='twitter:card'   content='summary')
 
 		style
 			include ../style.css
diff --git a/packages/backend/src/server/web/views/channel.pug b/packages/backend/src/server/web/views/channel.pug
index 486f0ecc47..c514025e0b 100644
--- a/packages/backend/src/server/web/views/channel.pug
+++ b/packages/backend/src/server/web/views/channel.pug
@@ -16,3 +16,4 @@ block og
 	meta(property='og:description' content= channel.description)
 	meta(property='og:url'         content= url)
 	meta(property='og:image'       content= channel.bannerUrl)
+	meta(property='twitter:card'   content='summary')
diff --git a/packages/backend/src/server/web/views/clip.pug b/packages/backend/src/server/web/views/clip.pug
index 74dc62f1e7..5a0018803a 100644
--- a/packages/backend/src/server/web/views/clip.pug
+++ b/packages/backend/src/server/web/views/clip.pug
@@ -17,6 +17,7 @@ block og
 	meta(property='og:description' content= clip.description)
 	meta(property='og:url'         content= url)
 	meta(property='og:image'       content= avatarUrl)
+	meta(property='twitter:card'   content='summary')
 
 block meta
 	if profile.noCrawle
diff --git a/packages/backend/src/server/web/views/flash.pug b/packages/backend/src/server/web/views/flash.pug
index 5594fcdfbf..1549aa7906 100644
--- a/packages/backend/src/server/web/views/flash.pug
+++ b/packages/backend/src/server/web/views/flash.pug
@@ -17,6 +17,7 @@ block og
 	meta(property='og:description' content= flash.summary)
 	meta(property='og:url'         content= url)
 	meta(property='og:image'       content= avatarUrl)
+	meta(property='twitter:card'   content='summary')
 
 block meta
 	if profile.noCrawle
diff --git a/packages/backend/src/server/web/views/gallery-post.pug b/packages/backend/src/server/web/views/gallery-post.pug
index 10f2d269bc..a458d7f8c7 100644
--- a/packages/backend/src/server/web/views/gallery-post.pug
+++ b/packages/backend/src/server/web/views/gallery-post.pug
@@ -17,6 +17,7 @@ block og
 	meta(property='og:description' content= post.description)
 	meta(property='og:url'         content= url)
 	meta(property='og:image'       content= post.files[0].thumbnailUrl)
+	meta(property='twitter:card'   content='summary_large_image')
 
 block meta
 	if user.host || profile.noCrawle
diff --git a/packages/backend/src/server/web/views/note.pug b/packages/backend/src/server/web/views/note.pug
index badfcccd61..874c48c602 100644
--- a/packages/backend/src/server/web/views/note.pug
+++ b/packages/backend/src/server/web/views/note.pug
@@ -5,6 +5,8 @@ block vars
 	- const title = user.name ? `${user.name} (@${user.username})` : `@${user.username}`;
 	- const url = `${config.url}/notes/${note.id}`;
 	- const isRenote = note.renote && note.text == null && note.fileIds.length == 0 && note.poll == null;
+	- const image = (note.files || []).find(file => file.type.startsWith('image/') && !file.type.isSensitive)
+	- const video = (note.files || []).find(file => file.type.startsWith('video/') && !file.type.isSensitive)
 
 block title
 	= `${title} | ${instanceName}`
@@ -17,7 +19,19 @@ block og
 	meta(property='og:title'       content= title)
 	meta(property='og:description' content= summary)
 	meta(property='og:url'         content= url)
-	meta(property='og:image'       content= avatarUrl)
+	if video
+		meta(property='og:video:url'        content= video.url)
+		meta(property='og:video:secure_url' content= video.url)
+		meta(property='og:video:type'       content= video.type)
+		// FIXME: add width and height
+		// FIXME: add embed player for Twitter
+	if image
+		meta(property='twitter:card' content='summary_large_image')
+		meta(property='og:image'     content= image.url)
+	else
+		meta(property='twitter:card' content='summary')
+		meta(property='og:image'     content= avatarUrl)
+
 
 block meta
 	if user.host || isRenote || profile.noCrawle
diff --git a/packages/backend/src/server/web/views/page.pug b/packages/backend/src/server/web/views/page.pug
index ddffc361c8..08bb08ffe7 100644
--- a/packages/backend/src/server/web/views/page.pug
+++ b/packages/backend/src/server/web/views/page.pug
@@ -17,6 +17,7 @@ block og
 	meta(property='og:description' content= page.summary)
 	meta(property='og:url'         content= url)
 	meta(property='og:image'       content= page.eyeCatchingImage ? page.eyeCatchingImage.thumbnailUrl : avatarUrl)
+	meta(property='twitter:card'   content= page.eyeCatchingImage ? 'summary_large_image' : 'summary')
 
 block meta
 	if profile.noCrawle
diff --git a/packages/backend/src/server/web/views/user.pug b/packages/backend/src/server/web/views/user.pug
index f4c83aa89d..83d57349a6 100644
--- a/packages/backend/src/server/web/views/user.pug
+++ b/packages/backend/src/server/web/views/user.pug
@@ -16,6 +16,7 @@ block og
 	meta(property='og:description' content= profile.description)
 	meta(property='og:url'         content= url)
 	meta(property='og:image'       content= avatarUrl)
+	meta(property='twitter:card'   content='summary')
 
 block meta
 	if user.host || profile.noCrawle