From 87c50fb974779f07a90889b5956d46ebf36c88fc Mon Sep 17 00:00:00 2001 From: Jan Lenoch Date: Fri, 26 Oct 2018 15:03:50 +0200 Subject: [PATCH] Fine tune and update docs --- README.md | 30 ++++++++++-- .../__snapshots__/normalize.spec.js.snap | 47 ++----------------- src/normalize.js | 28 ++++++----- 3 files changed, 44 insertions(+), 61 deletions(-) diff --git a/README.md b/README.md index bcc9b44a..81e7f1d5 100644 --- a/README.md +++ b/README.md @@ -40,9 +40,9 @@ You can use the GraphiQL interface to experiment with the data structures produc } contentType { elements { - name___teaser_image__name { - name - } + name + codename + type } } } @@ -87,10 +87,26 @@ Each Linked items property is accompanied by a sibling property suffixed with `_ node { elements { related_project_references { - value + system { + codename + } } related_project_references_nodes { - ... + __typename + ... on KenticoCloudItemBlogpostReference { + elements { + name___teaser_image__name { + value + } + } + } + ... on KenticoCloudItemProjectReference { + elements { + name___teaser_image__name { + value + } + } + } } } } @@ -98,6 +114,10 @@ Each Linked items property is accompanied by a sibling property suffixed with `_ } } +Under the `related_project_references` you'd find just the original data served by our [JS SDK](https://github.com/Enngage/kentico-cloud-js). Conversely, the `related_project_refereces_nodes` will give you the full-fledged Gatsby GraphQL nodes with all additional properties and links. + +Should a *Linked items* element in KC contain items of only *one* type, you'll be able to specify elements and other properties of that type directly (directly under the `related_project_references_nodes` in the above example). However, once you add linked items of multiple types, you'll have to specify their properties using the `... on [type name]` syntax (so called "inline fragments" in the GraphQL terminology). + #### Content items in Rich text elements relationships As with the previous example, all rich text properties with inline content items also have an accompanying `_nodes` property. diff --git a/src/__tests__/__snapshots__/normalize.spec.js.snap b/src/__tests__/__snapshots__/normalize.spec.js.snap index 09f0b801..458e83a3 100644 --- a/src/__tests__/__snapshots__/normalize.spec.js.snap +++ b/src/__tests__/__snapshots__/normalize.spec.js.snap @@ -4,52 +4,11 @@ exports[`createContentItemNode with correct arguments creates a content item nod Object { "children": Array [], "contentType___NODE": "aea6da0c-4130-593c-8b6e-006e6bace1de", - "elements": Object { - "elements": Object { - "finished_at": Object { - "name": "Finished at", - "type": "date_time", - "value": null, - }, - "name___teaser_image__name": Object { - "name": "Name", - "type": "text", - "value": "Project reference 1", - }, - "name___teaser_image__teaser_image": Object { - "name": "Teaser image", - "type": "asset", - "value": Array [ - Object { - "description": null, - "name": "freeimage-6729104-web.jpg", - "size": 360791, - "type": "image/jpeg", - "url": "https://assets.kenticocloud.com:443/5ac93d1e-567d-01e6-e3b7-ac435f77b907/3c08c558-53fd-4b45-a9e5-a6822c4ebf00/freeimage-6729104-web.jpg", - }, - ], - }, - "started_at": Object { - "name": "Started at", - "type": "date_time", - "value": null, - }, - "url": Object { - "name": "URL", - "type": "text", - "value": "https://example.com", - }, - "url_slug": Object { - "name": "URL slug", - "type": "url_slug", - "value": "project-reference-1", - }, - }, - }, + "elements": Object {}, "id": "362bd0da-5b1a-533b-9575-107c2e3c6931", "internal": Object { - "content": "{\\"system\\":{\\"id\\":\\"7e70cb89-9281-4db9-8130-36076ee1e698\\",\\"name\\":\\"Project reference 1\\",\\"codename\\":\\"project_reference_1\\",\\"language\\":\\"default\\",\\"type\\":\\"project_reference\\",\\"sitemap_locations\\":[],\\"last_modified\\":\\"2018-05-29T13:40:17.3224207Z\\"},\\"elements\\":{\\"elements\\":{\\"name___teaser_image__name\\":{\\"type\\":\\"text\\",\\"name\\":\\"Name\\",\\"value\\":\\"Project reference 1\\"},\\"name___teaser_image__teaser_image\\":{\\"type\\":\\"asset\\",\\"name\\":\\"Teaser image\\",\\"value\\":[{\\"name\\":\\"freeimage-6729104-web.jpg\\",\\"type\\":\\"image/jpeg\\",\\"size\\":360791,\\"description\\":null,\\"url\\":\\"https://assets.kenticocloud.com:443/5ac93d1e-567d-01e6-e3b7-ac435f77b907/3c08c558-53fd-4b45-a9e5-a6822c4ebf00/freeimage-6729104-web.jpg\\"}]},\\"url\\":{\\"type\\":\\"text\\",\\"name\\":\\"URL\\",\\"value\\":\\"https://example.com\\"},\\"started_at\\":{\\"type\\":\\"date_time\\",\\"name\\":\\"Started at\\",\\"value\\":null},\\"finished_at\\":{\\"type\\":\\"date_time\\",\\"name\\":\\"Finished at\\",\\"value\\":null},\\"url_slug\\":{\\"type\\":\\"url_slug\\",\\"name\\":\\"URL slug\\",\\"value\\":\\"project-reference-1\\"}}}}", - "contentDigest": "c45a0db24311cf73267250ec09453273", + "content": "{\\"system\\":{\\"id\\":\\"7e70cb89-9281-4db9-8130-36076ee1e698\\",\\"name\\":\\"Project reference 1\\",\\"codename\\":\\"project_reference_1\\",\\"language\\":\\"default\\",\\"type\\":\\"project_reference\\",\\"sitemap_locations\\":[],\\"last_modified\\":\\"2018-05-29T13:40:17.3224207Z\\"},\\"elements\\":{}}", + "contentDigest": "bf808dfcd7f72d75b3f2dc427d0587dd", "type": "KenticoCloudItemProjectReference", }, "otherLanguages___NODE": Array [], diff --git a/src/normalize.js b/src/normalize.js index 2cb59ad1..e341f1f4 100644 --- a/src/normalize.js +++ b/src/normalize.js @@ -64,7 +64,7 @@ const createContentItemNode = Object .keys(contentItem) - .filter((key) => key !== `system`) + .filter((key) => key !== `system` && key !== `elements`) .forEach((key) => { elements[key] = contentItem[key]; }); @@ -156,7 +156,7 @@ of valid objects.`); }; /** - * Adds links to content items (stored in 'linked items' elements) + * Adds links to content items (stored in Linked items elements) * via a sibling '_nodes' property. * @param {object} itemNode - Gatsby content item node. * @param {array} allNodesOfSameLanguage - The whole set of nodes @@ -178,27 +178,31 @@ of valid objects.`); .forEach((propertyName) => { const property = itemNode.elements[propertyName]; - if (_.isArray(property) && _.has(property, `[0].system.codename`)) { + if (_.isArray(property)) { const linkPropertyName = `${propertyName}_nodes___NODE`; itemNode.elements[linkPropertyName] = []; - const linkedNodes = allNodesOfSameLanguage - .filter((node) => { - const match = property.find((propertyValue) => - propertyValue.system.codename === node.system.codename - ); + if (_.has(property, `[0].system.codename`)) { + const linkedNodes = allNodesOfSameLanguage + .filter((node) => { + const match = property.find((propertyValue) => { + return propertyValue.system.codename === + node.system.codename + && propertyValue.system.type === node.system.type; + }); - return match !== undefined && match !== null; - }); + return match !== undefined && match !== null; + }); - addLinkedItemsLinks(itemNode, linkedNodes, linkPropertyName); + addLinkedItemsLinks(itemNode, linkedNodes, linkPropertyName); + } } }); } }; /** - * Adds links to content items (stored in 'rich text' elements) + * Adds links to content items (stored in Rich text elements) * via a sibling '_nodes' property. * @param {object} itemNode - Gatsby content item node. * @param {array} allNodesOfSameLanguage - The whole set of nodes