diff --git a/src/headless/shared/parsers.js b/src/headless/shared/parsers.js index 91bc12eb7..eb19f10f9 100644 --- a/src/headless/shared/parsers.js +++ b/src/headless/shared/parsers.js @@ -127,7 +127,7 @@ export function getOpenGraphMetadata (stanza) { const applies_to_id = fastening.getAttribute('id'); const meta = sizzle(`> meta[xmlns="${Strophe.NS.XHTML}"]`, fastening); if (meta.length) { - return meta.reduce((acc, el) => { + const data = meta.reduce((acc, el) => { const property = el.getAttribute('property'); if (property) { acc[property] = decodeHTMLEntities(el.getAttribute('content') || ''); @@ -136,6 +136,10 @@ export function getOpenGraphMetadata (stanza) { }, { 'ogp_for_id': applies_to_id, }); + + if ("og:description" in data || "og:title" in data || "og:image" in data) { + return data; + } } } return {}; diff --git a/src/shared/chat/templates/message.js b/src/shared/chat/templates/message.js index 3ea52c53f..764d178b9 100644 --- a/src/shared/chat/templates/message.js +++ b/src/shared/chat/templates/message.js @@ -44,10 +44,10 @@ export default (o) => { ${ o.model.get('ogp_metadata')?.map(m => html``) } + description="${m['og:description'] || ''}" + title="${m['og:title'] || ''}" + image="${m['og:image'] || ''}" + url="${m['og:url'] || ''}">`) } `; } diff --git a/src/shared/chat/templates/unfurl.js b/src/shared/chat/templates/unfurl.js index a11f36c6b..440d0dd5e 100644 --- a/src/shared/chat/templates/unfurl.js +++ b/src/shared/chat/templates/unfurl.js @@ -4,9 +4,7 @@ const u = converse.env.utils; export default (o) => { return html`
- - - + ${ o.image ? html`` : '' }
${o.title}

${u.addHyperlinks(o.description)}

diff --git a/src/shared/chat/unfurl.js b/src/shared/chat/unfurl.js index a211c7595..7dbaacbe4 100644 --- a/src/shared/chat/unfurl.js +++ b/src/shared/chat/unfurl.js @@ -19,10 +19,10 @@ export default class MessageUnfurl extends CustomElement { return tpl_unfurl(Object.assign({ 'onload': () => this.onImageLoad() }, { - description: this.description, - image: this.image, - title: this.title, - url: this.url + description: this.description || '', + image: this.image || '', + title: this.title || '', + url: this.url || '' })); }