diff --git a/package.json b/package.json index 0f3bfd920..074778f31 100644 --- a/package.json +++ b/package.json @@ -161,6 +161,7 @@ "redux-persist-transform-filter": "0.0.16", "redux-thunk": "^2.2.0", "remark": "^9.0.0", + "remark-attr": "^0.8.3", "remark-emoji": "^2.0.1", "remark-react": "^4.0.3", "remark-squeeze-paragraphs": "^3.0.3", diff --git a/src/ui/component/claimLink/view.jsx b/src/ui/component/claimLink/view.jsx index 42041392d..535b57b1d 100644 --- a/src/ui/component/claimLink/view.jsx +++ b/src/ui/component/claimLink/view.jsx @@ -62,7 +62,7 @@ class ClaimLink extends React.Component { const { uri, claim, title, description, autoEmbed, thumbnail, children, isResolvingUri } = this.props; const { claimName } = parseURI(uri); const blackListed = this.isClaimBlackListed(); - const showPreview = autoEmbed && !blackListed && !isResolvingUri && claim !== null; + const showPreview = autoEmbed === true && !blackListed && !isResolvingUri && claim !== null; return ( diff --git a/src/ui/component/common/markdown-preview-internal.jsx b/src/ui/component/common/markdown-preview-internal.jsx index f5d4e551c..581dec418 100644 --- a/src/ui/component/common/markdown-preview-internal.jsx +++ b/src/ui/component/common/markdown-preview-internal.jsx @@ -1,6 +1,7 @@ // @flow import * as React from 'react'; import remark from 'remark'; +import remarkAttr from 'remark-attr'; import remarkStrip from 'strip-markdown'; import remarkEmoji from 'remark-emoji'; import reactRenderer from 'remark-react'; @@ -57,6 +58,12 @@ const MarkdownPreview = (props: MarkdownProps) => { }, }; + const remarkAttrOpts = { + scope: 'extended', + elements: ['link'], + extend: { link: ['data-preview'] }, + }; + // Strip all content and just render text if (strip) { // Remove new lines and extra space @@ -77,6 +84,7 @@ const MarkdownPreview = (props: MarkdownProps) => {
{ remark() + .use(remarkAttr, remarkAttrOpts) // Remark plugins for lbry urls // Note: The order is important .use(formatedLinks) diff --git a/src/ui/util/remark-lbry.js b/src/ui/util/remark-lbry.js index a4e7a9835..2dc2de596 100644 --- a/src/ui/util/remark-lbry.js +++ b/src/ui/util/remark-lbry.js @@ -58,13 +58,13 @@ tokenizeMention.notInLink = true; tokenizeMention.notInBlock = true; const visitor = (node, index, parent) => { - if (node.type === 'link') { + if (node.type === 'link' && parent && parent.type === 'paragraph') { try { const url = parseURI(node.url); // Handle lbry link if (!url.isChannel || (url.isChannel && url.path)) { // Auto-embed lbry url - if (parent && parent.type === 'paragraph' && !node.data) { + if (!node.data) { node.data = { hProperties: { 'data-preview': true }, }; diff --git a/yarn.lock b/yarn.lock index a41eebb45..82ecae600 100644 --- a/yarn.lock +++ b/yarn.lock @@ -5434,6 +5434,11 @@ html-comment-regex@^1.1.0: resolved "https://registry.yarnpkg.com/html-comment-regex/-/html-comment-regex-1.1.2.tgz#97d4688aeb5c81886a364faa0cad1dda14d433a7" integrity sha512-P+M65QY2JQ5Y0G9KKdlDpo0zK+/OHptU5AaBwUfAIDJZk1MYf32Frm84EcOytfJE0t5JvkAnKlmjsXDnWzCJmQ== +html-element-attributes@^2.0.0: + version "2.1.0" + resolved "https://registry.yarnpkg.com/html-element-attributes/-/html-element-attributes-2.1.0.tgz#ff674b8716526b8a9ee1d8e454466eda56d6d0cc" + integrity sha512-uWNlZuzM3MfRvZLAHWUzwwU6He2NvX9szpXwjG7+hoVqZzY3e0vc6mlujiSnJ/i9zVFZDhBDN33Pm9HNEzcyPg== + html-entities@^1.2.0, html-entities@^1.2.1: version "1.2.1" resolved "https://registry.yarnpkg.com/html-entities/-/html-entities-1.2.1.tgz#0df29351f0721163515dfb9e5543e5f6eed5162f" @@ -7050,6 +7055,11 @@ math-expression-evaluator@^1.2.14: resolved "https://registry.yarnpkg.com/math-expression-evaluator/-/math-expression-evaluator-1.2.17.tgz#de819fdbcd84dccd8fae59c6aeb79615b9d266ac" integrity sha1-3oGf282E3M2PrlnGrreWFbnSZqw= +md-attr-parser@^1.2.1: + version "1.2.1" + resolved "https://registry.yarnpkg.com/md-attr-parser/-/md-attr-parser-1.2.1.tgz#1043f6451c33ed3e392b40504df08010f4d03e3d" + integrity sha512-dZqt2L4Q7FUcx6ZcuownAxa74Y7d5jcsHRB2MIgQ0vT10Pa+/0Som6hhJ+jgAjP3vnFtrd4aO+ZMc5K7QVfbiQ== + md5.js@^1.3.4: version "1.3.5" resolved "https://registry.yarnpkg.com/md5.js/-/md5.js-1.3.5.tgz#b5d07b8e3216e3e27cd728d72f70d1e6a342005f" @@ -9781,6 +9791,14 @@ relateurl@0.2.x: resolved "https://registry.yarnpkg.com/relateurl/-/relateurl-0.2.7.tgz#54dbf377e51440aca90a4cd274600d3ff2d888a9" integrity sha1-VNvzd+UUQKypCkzSdGANP/LYiKk= +remark-attr@^0.8.3: + version "0.8.3" + resolved "https://registry.yarnpkg.com/remark-attr/-/remark-attr-0.8.3.tgz#0263045acb958e1556b0c6955b5d66a4b36d4d92" + integrity sha512-JMP6rmLwhj5VmDRG99kGr+HNXQ6MmAs+UojeAHGMQFiIitEmJZBkmgOBsWadxu/RTACD4XnMuJXY1QWEFdw31A== + dependencies: + html-element-attributes "^2.0.0" + md-attr-parser "^1.2.1" + remark-emoji@^2.0.1: version "2.0.2" resolved "https://registry.yarnpkg.com/remark-emoji/-/remark-emoji-2.0.2.tgz#49c134021132c192ee4cceed1988ec9b8ced7eb8"