Merge 58dd7837a6 into 6bd3ed2074

CHANGELOG.md

@@ -63,6 +63,7 @@
 - Enhance: アーカイブした個人宛のお知らせを表示・編集できるように
 - Enhance: l10nの更新
 - Fix: メールアドレス不要でCaptchaが有効な場合にアカウント登録完了後自動でのログインに失敗する問題を修正
+- Enhance: 新しいMFM「URL引用」を追加。`> https://hogehoge.com`のように、`> `に続けてURLを置くことで文中にURLプレビューを展開することができます
 
 ### Server
 - Feat: モデレータ権限を持つユーザが全員7日間活動しなかった場合は自動的に招待制へと切り替えるように ( #13437 )

packages/frontend/src/components/global/MkMfm.ts

@@ -17,6 +17,7 @@ import MkCode from '@/components/MkCode.vue';
 import MkCodeInline from '@/components/MkCodeInline.vue';
 import MkGoogle from '@/components/MkGoogle.vue';
 import MkSparkle from '@/components/MkSparkle.vue';
+import MkUrlPreview from '@/components/MkUrlPreview.vue';
 import MkA, { MkABehavior } from '@/components/global/MkA.vue';
 import { defaultStore } from '@/store.js';
 
@@ -398,12 +399,19 @@ export default function (props: MfmProps, { emit }: { emit: SetupContext<MfmEven
 			}
 
 			case 'quote': {
-				if (!props.nowrap) {
+				if (props.nowrap) {
-					return [h('div', {
+					return [h('span', {
 						style: QUOTE_STYLE,
 					}, genEl(token.children, scale, true))];
+				} else if (token.children.length === 1 && token.children[0].type === 'url') {
+					return [h('div', { style: 'padding-block: 8px' }, [
+						h(MkUrlPreview, {
+							url: token.children[0].props.url,
+							compact: true,
+						}),
+					])];
 				} else {
-					return [h('span', {
+					return [h('div', {
 						style: QUOTE_STYLE,
 					}, genEl(token.children, scale, true))];
 				}

packages/frontend/src/scripts/extract-url-from-mfm.ts

@@ -11,8 +11,11 @@ import { unique } from '@/scripts/array.js';
 const removeHash = (x: string) => x.replace(/#[^#]*$/, '');
 
 export function extractUrlFromMfm(nodes: mfm.MfmNode[], respectSilentFlag = true): string[] {
+	const quotedUrlNodes = mfm.extract(nodes, (node) => {
+		return (node.type === 'quote') && (node.children.length === 1) && (node.children[0].type === 'url');
+	}).map(quote => quote.children[0]);
 	const urlNodes = mfm.extract(nodes, (node) => {
-		return (node.type === 'url') || (node.type === 'link' && (!respectSilentFlag || !node.props.silent));
+		return (node.type === 'url' && !quotedUrlNodes.includes(node)) || (node.type === 'link' && (!respectSilentFlag || !node.props.silent));
 	});
 	const urls: string[] = unique(urlNodes.map(x => x.props.url));