diff --git a/addon/components/prismic/children.hbs b/addon/components/prismic/children.hbs index 2c94223a..9c893a3b 100644 --- a/addon/components/prismic/children.hbs +++ b/addon/components/prismic/children.hbs @@ -1,5 +1,9 @@ {{~#each @node.children as |child|~}} - + {{~else~}} {{~@node.element.text~}} {{~/each~}} \ No newline at end of file diff --git a/addon/components/prismic/dom.hbs b/addon/components/prismic/dom.hbs index 968dd4c7..e61420e1 100644 --- a/addon/components/prismic/dom.hbs +++ b/addon/components/prismic/dom.hbs @@ -3,7 +3,11 @@ {{@nodes}} {{~else~}} {{~#each this.tree.children as |child|~}} - + {{~/each~}} {{~/if~}} \ No newline at end of file diff --git a/addon/components/prismic/element.hbs b/addon/components/prismic/element.hbs index bb597045..4a5aa27d 100644 --- a/addon/components/prismic/element.hbs +++ b/addon/components/prismic/element.hbs @@ -1,15 +1,27 @@ -{{~#if (eq @node.type "image")~}} +{{~#if (eq @node.type 'image')~}} -{{~else if (eq @node.type "span")~}} - -{{~else if (eq @node.type "hyperlink")~}} +{{~else if (eq @node.type 'span')~}} + +{{~else if (eq @node.type 'hyperlink')~}} + > {{~else~}} {{~#let (element this.tagName) as |Tag|~}} - + {{~/let~}} {{~/if~}} \ No newline at end of file diff --git a/addon/components/prismic/element.js b/addon/components/prismic/element.js index 28bcd48e..3aeeb433 100644 --- a/addon/components/prismic/element.js +++ b/addon/components/prismic/element.js @@ -32,4 +32,29 @@ export default class PrismicElementComponent extends Component { get target() { return this.args.node.element.data.value?.target || '_blank'; } + + get linkHref() { + // https://prismic.io/docs/technologies/link-resolver-javascript + let { + id, + slug: uid, + type, + tags, + lang, + isBroken, + link_type, + } = this.args.node.element.data; + if (link_type === 'Document') { + return this.args.linkResolver?.({ + id, + uid, + type, + tags, + lang, + isBroken, + }); + } else { + return this.args.node.element.data.url; + } + } } diff --git a/tests/integration/components/prismic/dom-test.js b/tests/integration/components/prismic/dom-test.js index 5860f38e..e31116c2 100644 --- a/tests/integration/components/prismic/dom-test.js +++ b/tests/integration/components/prismic/dom-test.js @@ -17,6 +17,40 @@ module('Integration | Component | prismic/dom', function (hooks) { }); module('complex combinations', function () { + test('doc hyperlink with linkResolver', async function (assert) { + this.nodes = [ + { + type: 'paragraph', + text: 'A link to another doc', + spans: [ + { + start: 18, + end: 21, + type: 'hyperlink', + data: { + id: 'YAlUbREAACIAEKtG', + type: 'faq_article', + tags: ['transaction_helper_cards'], + slug: 'processing-card-transaction', + lang: 'en-us', + link_type: 'Document', + isBroken: false, + }, + }, + ], + }, + ]; + this.linkResolver = ({ uid }) => `https://qonto.com/${uid}`; + + await render( + hbs`` + ); + + assert + .dom('a') + .hasProperty('href', 'https://qonto.com/processing-card-transaction'); + }); + test('list', async function (assert) { this.nodes = [ { type: 'o-list-item', text: 'one', spans: [] }, diff --git a/tests/integration/components/prismic/element-test.js b/tests/integration/components/prismic/element-test.js index 3cc04332..164efa1d 100644 --- a/tests/integration/components/prismic/element-test.js +++ b/tests/integration/components/prismic/element-test.js @@ -9,6 +9,57 @@ import cleanHtml from '../../../helpers/clean-html'; module('Integration | Component | prismic/element', function (hooks) { setupRenderingTest(hooks); + module('linkResolver', function () { + test('called with doc object', async function (assert) { + assert.expect(1); + this.node = { + key: 'f37fa1aa-5d40-41fd-951a-cebb2b2f1839', + type: 'hyperlink', + element: { + start: 18, + end: 21, + type: 'hyperlink', + data: { + id: 'YAlUbREAACIAEKtG', + type: 'faq_article', + tags: ['transaction_helper_cards'], + slug: 'processing-card-transaction', + lang: 'en-us', + link_type: 'Document', + isBroken: false, + }, + }, + children: [ + { + key: '728406cc-c73c-4ffb-ba4c-fff0cef3d8fa', + type: 'span', + element: { type: 'span', start: 18, end: 21, text: 'doc' }, + children: [], + start: 18, + end: 21, + text: 'doc', + }, + ], + start: 18, + end: 21, + text: 'doc', + }; + this.linkResolver = (doc) => { + assert.deepEqual(doc, { + id: 'YAlUbREAACIAEKtG', + uid: 'processing-card-transaction', + type: 'faq_article', + tags: ['transaction_helper_cards'], + lang: 'en-us', + isBroken: false, + }); + }; + await render( + hbs`` + ); + }); + }); + module('single elements', function () { test('figure - unknown type call onUnknownTag with node', async function (assert) { assert.expect(2);