[mastodon-client] Use improved mention parsing in mfm-to-html

This commit is contained in:
Laura Hausmann 2023-10-14 16:39:16 +02:00
parent 349f770166
commit ce29c1dce2
No known key found for this signature in database
GPG key ID: D044E84C5BE01605
8 changed files with 38 additions and 53 deletions

View file

@ -178,7 +178,7 @@ export async function resolveMentionWithFallback(username: string, host: string
const fallback = `${config.url}/${acct}`; const fallback = `${config.url}/${acct}`;
const cached = cache.find(r => r.username.toLowerCase() === username.toLowerCase() && r.host === host); const cached = cache.find(r => r.username.toLowerCase() === username.toLowerCase() && r.host === host);
if (cached) return cached.url ?? cached.uri; if (cached) return cached.url ?? cached.uri;
if (host === null) return fallback; if (host === null || host === config.domain) return fallback;
try { try {
const user = await resolveUser(username, host); const user = await resolveUser(username, host);
const profile = await UserProfiles.findOneBy({ userId: user.id }); const profile = await UserProfiles.findOneBy({ userId: user.id });

View file

@ -3,10 +3,10 @@ import { MfmHelpers } from "@/server/api/mastodon/helpers/mfm.js";
import mfm from "mfm-js"; import mfm from "mfm-js";
export class AnnouncementConverter { export class AnnouncementConverter {
public static encode(announcement: Announcement, isRead: boolean): MastodonEntity.Announcement { public static async encode(announcement: Announcement, isRead: boolean): Promise<MastodonEntity.Announcement> {
return { return {
id: announcement.id, id: announcement.id,
content: `<h1>${MfmHelpers.toHtml(mfm.parse(announcement.title), [], null) ?? 'Announcement'}</h1>${MfmHelpers.toHtml(mfm.parse(announcement.text), [], null) ?? ''}`, content: `<h1>${await MfmHelpers.toHtml(mfm.parse(announcement.title), []) ?? 'Announcement'}</h1>${await MfmHelpers.toHtml(mfm.parse(announcement.text), []) ?? ''}`,
starts_at: null, starts_at: null,
ends_at: null, ends_at: null,
published: true, published: true,

View file

@ -117,7 +117,7 @@ export class NoteConverter {
in_reply_to_id: note.replyId, in_reply_to_id: note.replyId,
in_reply_to_account_id: note.replyUserId, in_reply_to_account_id: note.replyUserId,
reblog: reblog.then(reblog => note.text === null ? reblog : null), reblog: reblog.then(reblog => note.text === null ? reblog : null),
content: text.then(async text => text !== null ? await host.then(host => MfmHelpers.toHtml(mfm.parse(text), JSON.parse(note.mentionedRemoteUsers), host)) ?? escapeMFM(text) : ""), content: text.then(async text => text !== null ? MfmHelpers.toHtml(mfm.parse(text), JSON.parse(note.mentionedRemoteUsers)).then(p => p ?? escapeMFM(text)) : ""),
text: text, text: text,
created_at: note.createdAt.toISOString(), created_at: note.createdAt.toISOString(),
emojis: noteEmoji, emojis: noteEmoji,

View file

@ -31,7 +31,7 @@ export class UserConverter {
acctUrl = `https://${u.host}/@${u.username}`; acctUrl = `https://${u.host}/@${u.username}`;
} }
const profile = UserProfiles.findOneBy({ userId: u.id }); const profile = UserProfiles.findOneBy({ userId: u.id });
const bio = profile.then(profile => MfmHelpers.toHtml(mfm.parse(profile?.description ?? ""), [], u.host) ?? escapeMFM(profile?.description ?? "")); const bio = profile.then(profile => MfmHelpers.toHtml(mfm.parse(profile?.description ?? ""), []).then(p => p ?? escapeMFM(profile?.description ?? "")));
const avatar = u.avatarId const avatar = u.avatarId
? (DriveFiles.findOneBy({ id: u.avatarId })) ? (DriveFiles.findOneBy({ id: u.avatarId }))
.then(p => p?.url ?? Users.getIdenticonUrl(u.id)) .then(p => p?.url ?? Users.getIdenticonUrl(u.id))
@ -92,7 +92,7 @@ export class UserConverter {
header_static: banner, header_static: banner,
emojis: populateEmojis(u.emojis, u.host).then(emoji => emoji.map((e) => EmojiConverter.encode(e))), emojis: populateEmojis(u.emojis, u.host).then(emoji => emoji.map((e) => EmojiConverter.encode(e))),
moved: null, //FIXME moved: null, //FIXME
fields: profile.then(profile => profile?.fields.map(p => this.encodeField(p, u.host)) ?? []), fields: profile.then(profile => Promise.all(profile?.fields.map(async p => this.encodeField(p, u.host)) ?? [])),
bot: u.isBot, bot: u.isBot,
discoverable: u.isExplorable discoverable: u.isExplorable
}).then(p => { }).then(p => {
@ -107,10 +107,10 @@ export class UserConverter {
return Promise.all(encoded); return Promise.all(encoded);
} }
private static encodeField(f: Field, host: string | null): MastodonEntity.Field { private static async encodeField(f: Field, host: string | null): Promise<MastodonEntity.Field> {
return { return {
name: f.name, name: f.name,
value: MfmHelpers.toHtml(mfm.parse(f.value), [], host, true) ?? escapeMFM(f.value), value: await MfmHelpers.toHtml(mfm.parse(f.value), [], true) ?? escapeMFM(f.value),
verified_at: f.verified ? (new Date()).toISOString() : null, verified_at: f.verified ? (new Date()).toISOString() : null,
} }
} }

View file

@ -3,12 +3,12 @@ import { JSDOM } from "jsdom";
import config from "@/config/index.js"; import config from "@/config/index.js";
import { intersperse } from "@/prelude/array.js"; import { intersperse } from "@/prelude/array.js";
import mfm from "mfm-js"; import mfm from "mfm-js";
import { resolveMentionWithFallback } from "@/remote/resolve-user.js";
export class MfmHelpers { export class MfmHelpers {
public static toHtml( public static async toHtml(
nodes: mfm.MfmNode[] | null, nodes: mfm.MfmNode[] | null,
mentionedRemoteUsers: IMentionedRemoteUsers = [], mentionedRemoteUsers: IMentionedRemoteUsers = [],
objectHost: string | null,
inline: boolean = false inline: boolean = false
) { ) {
if (nodes == null) { if (nodes == null) {
@ -19,9 +19,9 @@ export class MfmHelpers {
const doc = window.document; const doc = window.document;
function appendChildren(children: mfm.MfmNode[], targetElement: any): void { async function appendChildren(children: mfm.MfmNode[], targetElement: any): Promise<void> {
if (children) { if (children) {
for (const child of children.map((x) => (handlers as any)[x.type](x))) for (const child of await Promise.all(children.map(async (x) => await (handlers as any)[x.type](x))))
targetElement.appendChild(child); targetElement.appendChild(child);
} }
} }
@ -29,40 +29,40 @@ export class MfmHelpers {
const handlers: { const handlers: {
[K in mfm.MfmNode["type"]]: (node: mfm.NodeType<K>) => any; [K in mfm.MfmNode["type"]]: (node: mfm.NodeType<K>) => any;
} = { } = {
bold(node) { async bold(node) {
const el = doc.createElement("span"); const el = doc.createElement("span");
el.textContent = '**'; el.textContent = '**';
appendChildren(node.children, el); await appendChildren(node.children, el);
el.textContent += '**'; el.textContent += '**';
return el; return el;
}, },
small(node) { async small(node) {
const el = doc.createElement("small"); const el = doc.createElement("small");
appendChildren(node.children, el); await appendChildren(node.children, el);
return el; return el;
}, },
strike(node) { async strike(node) {
const el = doc.createElement("span"); const el = doc.createElement("span");
el.textContent = '~~'; el.textContent = '~~';
appendChildren(node.children, el); await appendChildren(node.children, el);
el.textContent += '~~'; el.textContent += '~~';
return el; return el;
}, },
italic(node) { async italic(node) {
const el = doc.createElement("span"); const el = doc.createElement("span");
el.textContent = '*'; el.textContent = '*';
appendChildren(node.children, el); await appendChildren(node.children, el);
el.textContent += '*'; el.textContent += '*';
return el; return el;
}, },
fn(node) { async fn(node) {
const el = doc.createElement("span"); const el = doc.createElement("span");
el.textContent = '*'; el.textContent = '*';
appendChildren(node.children, el); await appendChildren(node.children, el);
el.textContent += '*'; el.textContent += '*';
return el; return el;
}, },
@ -83,9 +83,9 @@ export class MfmHelpers {
return pre; return pre;
}, },
center(node) { async center(node) {
const el = doc.createElement("div"); const el = doc.createElement("div");
appendChildren(node.children, el); await appendChildren(node.children, el);
return el; return el;
}, },
@ -123,37 +123,22 @@ export class MfmHelpers {
return el; return el;
}, },
link(node) { async link(node) {
const a = doc.createElement("a"); const a = doc.createElement("a");
a.setAttribute("rel", "nofollow noopener noreferrer"); a.setAttribute("rel", "nofollow noopener noreferrer");
a.setAttribute("target", "_blank"); a.setAttribute("target", "_blank");
a.href = node.props.url; a.href = node.props.url;
appendChildren(node.children, a); await appendChildren(node.children, a);
return a; return a;
}, },
mention(node) { async mention(node) {
const el = doc.createElement("span"); const el = doc.createElement("span");
el.setAttribute("class", "h-card"); el.setAttribute("class", "h-card");
el.setAttribute("translate", "no"); el.setAttribute("translate", "no");
const a = doc.createElement("a"); const a = doc.createElement("a");
const { username, host } = node.props; const { username, host, acct } = node.props;
const remoteUserInfo = mentionedRemoteUsers.find( a.href = await resolveMentionWithFallback(username, host, acct, mentionedRemoteUsers);
(remoteUser) =>
remoteUser.username.toLowerCase() === username.toLowerCase() && remoteUser.host === host,
);
const localpart = `@${username}`;
const isLocal = host === config.domain || (host == null && objectHost == null);
const acct = isLocal ? localpart : node.props.acct;
a.href = remoteUserInfo
? remoteUserInfo.url
? remoteUserInfo.url
: remoteUserInfo.uri
: isLocal
? `${config.url}/${acct}`
: host == null
? `https://${objectHost}/${localpart}`
: `https://${host}/${localpart}`;
a.className = "u-url mention"; a.className = "u-url mention";
const span = doc.createElement("span"); const span = doc.createElement("span");
span.textContent = username; span.textContent = username;
@ -163,9 +148,9 @@ export class MfmHelpers {
return el; return el;
}, },
quote(node) { async quote(node) {
const el = doc.createElement("blockquote"); const el = doc.createElement("blockquote");
appendChildren(node.children, el); await appendChildren(node.children, el);
return el; return el;
}, },
@ -198,14 +183,14 @@ export class MfmHelpers {
return a; return a;
}, },
plain(node) { async plain(node) {
const el = doc.createElement("span"); const el = doc.createElement("span");
appendChildren(node.children, el); await appendChildren(node.children, el);
return el; return el;
}, },
}; };
appendChildren(nodes, doc.body); await appendChildren(nodes, doc.body);
return inline ? doc.body.innerHTML : `<p>${doc.body.innerHTML}</p>`; return inline ? doc.body.innerHTML : `<p>${doc.body.innerHTML}</p>`;
} }

View file

@ -107,7 +107,7 @@ export class MiscHelpers {
.then(p => p.map(x => x.announcementId)) .then(p => p.map(x => x.announcementId))
]); ]);
return announcements.map(p => AnnouncementConverter.encode(p, reads.includes(p.id))); return Promise.all(announcements.map(async p => AnnouncementConverter.encode(p, reads.includes(p.id))));
} }
const sq = AnnouncementReads.createQueryBuilder("reads") const sq = AnnouncementReads.createQueryBuilder("reads")
@ -120,7 +120,7 @@ export class MiscHelpers {
.setParameter("userId", user.id); .setParameter("userId", user.id);
return query.getMany() return query.getMany()
.then(p => p.map(x => AnnouncementConverter.encode(x, false))); .then(p => Promise.all(p.map(async x => AnnouncementConverter.encode(x, false))));
} }
public static async dismissAnnouncement(announcement: Announcement, ctx: MastoContext): Promise<void> { public static async dismissAnnouncement(announcement: Announcement, ctx: MastoContext): Promise<void> {

View file

@ -201,7 +201,7 @@ export class NoteHelpers {
const files = DriveFiles.packMany(edit.fileIds); const files = DriveFiles.packMany(edit.fileIds);
const item = { const item = {
account: account, account: account,
content: user.then(user => MfmHelpers.toHtml(mfm.parse(edit.text ?? ''), JSON.parse(note.mentionedRemoteUsers), user.host) ?? ''), content: MfmHelpers.toHtml(mfm.parse(edit.text ?? ''), JSON.parse(note.mentionedRemoteUsers)).then(p => p ?? ''),
created_at: lastDate.toISOString(), created_at: lastDate.toISOString(),
emojis: [], emojis: [],
sensitive: files.then(files => files.length > 0 ? files.some((f) => f.isSensitive) : false), sensitive: files.then(files => files.length > 0 ? files.some((f) => f.isSensitive) : false),

View file

@ -76,7 +76,7 @@ export class MastodonStreamUser extends MastodonStream {
case "announcementAdded": case "announcementAdded":
// This shouldn't be necessary but is for some reason // This shouldn't be necessary but is for some reason
data.body.createdAt = new Date(data.body.createdAt); data.body.createdAt = new Date(data.body.createdAt);
this.connection.send(this.chName, "announcement", AnnouncementConverter.encode(data.body, false)); this.connection.send(this.chName, "announcement", await AnnouncementConverter.encode(data.body, false));
break; break;
case "announcementDeleted": case "announcementDeleted":
this.connection.send(this.chName, "announcement.delete", data.body); this.connection.send(this.chName, "announcement.delete", data.body);