From b309206ed0e53c52a0d707fc323db5282d33a30b Mon Sep 17 00:00:00 2001 From: veryspry Date: Fri, 1 Oct 2021 13:20:41 -0500 Subject: [PATCH 01/14] feat: manually save content before firing preview webhook --- apps/gatsby/src/Sidebar.js | 35 ++++++++++++++++++++++++++++++++++- 1 file changed, 34 insertions(+), 1 deletion(-) diff --git a/apps/gatsby/src/Sidebar.js b/apps/gatsby/src/Sidebar.js index 6bfc625439..03fabf09aa 100644 --- a/apps/gatsby/src/Sidebar.js +++ b/apps/gatsby/src/Sidebar.js @@ -164,13 +164,44 @@ export default class Sidebar extends React.Component { this.setState({ slug: finalSlug }) } - refreshPreview = () => { + manuallySaveContentEntry = async () => { + const { entry, space, ids } = this.props.sdk; + const fields = Object.entries(entry.fields); + + const updatedEntry = await space.getEntry(ids.entry); + + fields.forEach(([fieldName, field]) => { + const { locales } = field; + + locales.forEach((locale) => { + const fieldLocale = field._getFieldLocale(locale); + const fieldValue = fieldLocale.getValue(); + + // if a field was previously empty, it will not be on the updateEntry object + let updateField = updatedEntry.fields[fieldName]; + if (!updateField) { + updateField = {}; + updatedEntry.fields[fieldName] = updateField; + } + + updateField[locale] = fieldValue; + }); + }); + + await space.updateEntry(updatedEntry); + + return; + } + + refreshPreview = async () => { const { webhookUrl, previewWebhookUrl, authToken } = this.sdk.parameters.installation; + await this.manuallySaveContentEntry(); + if (previewWebhookUrl) { callWebhook(previewWebhookUrl, authToken); } else if (webhookUrl) { @@ -195,6 +226,8 @@ export default class Sidebar extends React.Component { previewUrl = `${contentSyncUrl}/gatsby-source-contentful/${manifestId}`; } + console.log({ sdk: this.props.sdk }); + return (
From b3f91fb2c6b58bd5e06bd1e80b842714daa6cc7d Mon Sep 17 00:00:00 2001 From: veryspry Date: Fri, 1 Oct 2021 13:34:47 -0500 Subject: [PATCH 02/14] feat: refresh the window/tab that the preview is in after the content has been manually saved --- apps/gatsby/src/Sidebar.js | 35 +++++++++++++++++++++++++---------- 1 file changed, 25 insertions(+), 10 deletions(-) diff --git a/apps/gatsby/src/Sidebar.js b/apps/gatsby/src/Sidebar.js index 03fabf09aa..c8002e17ea 100644 --- a/apps/gatsby/src/Sidebar.js +++ b/apps/gatsby/src/Sidebar.js @@ -188,9 +188,7 @@ export default class Sidebar extends React.Component { }); }); - await space.updateEntry(updatedEntry); - - return; + return space.updateEntry(updatedEntry); } refreshPreview = async () => { @@ -212,6 +210,20 @@ export default class Sidebar extends React.Component { } }; + getPreviewUrl = () => { + let { + previewUrl, + contentSyncUrl, + } = this.props.sdk.parameters.installation; + const { manifestId } = this.state + + if (contentSyncUrl && manifestId) { + previewUrl = `${contentSyncUrl}/gatsby-source-contentful/${manifestId}`; + } + + return previewUrl; + } + render = () => { let { contentSyncUrl, @@ -220,13 +232,9 @@ export default class Sidebar extends React.Component { webhookUrl, previewWebhookUrl, } = this.sdk.parameters.installation; - const { slug, manifestId } = this.state - - if (contentSyncUrl && manifestId) { - previewUrl = `${contentSyncUrl}/gatsby-source-contentful/${manifestId}`; - } + const { slug } = this.state - console.log({ sdk: this.props.sdk }); + previewUrl = this.getPreviewUrl(); return (
@@ -236,7 +244,14 @@ export default class Sidebar extends React.Component { contentSlug={!contentSyncUrl && !!slug && slug} previewUrl={previewUrl} authToken={authToken} - onOpenPreviewButtonClick={this.refreshPreview} + onOpenPreviewButtonClick={async ({ previewWindow }) => { + await this.refreshPreview(); + /** + * ensure that the preview tab has the correct manifest id + * just in case the timing was slight off and it was opened with the wrong manifest id + */ + previewWindow.location = this.getPreviewUrl(); + }} /> : From e55f0f95c3d30611238f25c6b8eb84251ec3241d Mon Sep 17 00:00:00 2001 From: veryspry Date: Fri, 1 Oct 2021 18:33:20 -0500 Subject: [PATCH 03/14] feat: use window.location.href --- apps/gatsby/src/Sidebar.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/apps/gatsby/src/Sidebar.js b/apps/gatsby/src/Sidebar.js index c8002e17ea..0666b7ab31 100644 --- a/apps/gatsby/src/Sidebar.js +++ b/apps/gatsby/src/Sidebar.js @@ -250,7 +250,7 @@ export default class Sidebar extends React.Component { * ensure that the preview tab has the correct manifest id * just in case the timing was slight off and it was opened with the wrong manifest id */ - previewWindow.location = this.getPreviewUrl(); + previewWindow.location.href = this.getPreviewUrl(); }} /> : From d9b198fa78ad71c4ca64258c061fd56fb909adf8 Mon Sep 17 00:00:00 2001 From: veryspry Date: Fri, 1 Oct 2021 18:38:19 -0500 Subject: [PATCH 04/14] feat: update comments for clarity --- apps/gatsby/src/Sidebar.js | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/apps/gatsby/src/Sidebar.js b/apps/gatsby/src/Sidebar.js index 0666b7ab31..9fe749288b 100644 --- a/apps/gatsby/src/Sidebar.js +++ b/apps/gatsby/src/Sidebar.js @@ -247,8 +247,10 @@ export default class Sidebar extends React.Component { onOpenPreviewButtonClick={async ({ previewWindow }) => { await this.refreshPreview(); /** - * ensure that the preview tab has the correct manifest id - * just in case the timing was slight off and it was opened with the wrong manifest id + * ExtensionUI returns a reference to the opened tab (previewWindow) after eagerly + * opening it with the given previewUrl. Because there is a small chance that this will + * have a stale manifestId, we update the url in the opened preview tab just in case + * to ensure that the user is redirected to the correct preview build */ previewWindow.location.href = this.getPreviewUrl(); }} From 095973dfc28c6b0e455e83bbd37f51c166bb9f35 Mon Sep 17 00:00:00 2001 From: Tyler Barnes Date: Tue, 5 Oct 2021 11:06:43 -0700 Subject: [PATCH 05/14] bump ui v --- apps/gatsby/package-lock.json | 6 +++--- apps/gatsby/package.json | 2 +- 2 files changed, 4 insertions(+), 4 deletions(-) diff --git a/apps/gatsby/package-lock.json b/apps/gatsby/package-lock.json index d30f39aa19..408f55658f 100644 --- a/apps/gatsby/package-lock.json +++ b/apps/gatsby/package-lock.json @@ -2241,9 +2241,9 @@ } }, "@gatsby-cloud-pkg/gatsby-cms-extension-base": { - "version": "0.0.47", - "resolved": "https://registry.npmjs.org/@gatsby-cloud-pkg/gatsby-cms-extension-base/-/gatsby-cms-extension-base-0.0.47.tgz", - "integrity": "sha512-oS4wXQgYwc5GSC0CrUkJsnHK2QffBJmFBm7qG/4zMc4B55by+RWtUH86ZL8cOYh3LSXwXKZgXSaWjVwmIEO5fQ==", + "version": "0.0.48", + "resolved": "https://registry.npmjs.org/@gatsby-cloud-pkg/gatsby-cms-extension-base/-/gatsby-cms-extension-base-0.0.48.tgz", + "integrity": "sha512-BBk3bGvSfMIrbZmQ6jHRUxdrWjSlNPcwOKpjD9FCYDQCV+T+5xTx10FUWCp8ToobqkC/NYmPQLVunxE06KgQ5A==", "requires": { "@emotion/core": "^10.0.10", "@emotion/styled": "^10.0.12" diff --git a/apps/gatsby/package.json b/apps/gatsby/package.json index d98abe1e4b..3bc430881e 100644 --- a/apps/gatsby/package.json +++ b/apps/gatsby/package.json @@ -14,7 +14,7 @@ "@contentful/forma-36-fcss": "0.3.3", "@contentful/forma-36-react-components": "3.93.2", "@contentful/forma-36-tokens": "0.11.0", - "@gatsby-cloud-pkg/gatsby-cms-extension-base": "0.0.47", + "@gatsby-cloud-pkg/gatsby-cms-extension-base": "0.0.48", "emotion": "10.0.14", "prop-types": "15.7.2", "react": "16.8.6", From 55b8c8cdb8b03065ddd8a537938549dafa5d5cc0 Mon Sep 17 00:00:00 2001 From: Tyler Barnes Date: Tue, 5 Oct 2021 16:21:17 -0700 Subject: [PATCH 06/14] wait for onSysChange to fire again in the first 10 seconds after Open Preview is clicked --- apps/gatsby/src/Sidebar.js | 139 +++++++++++++++++++++++++++++++------ 1 file changed, 116 insertions(+), 23 deletions(-) diff --git a/apps/gatsby/src/Sidebar.js b/apps/gatsby/src/Sidebar.js index 9fe749288b..b365c1cc91 100644 --- a/apps/gatsby/src/Sidebar.js +++ b/apps/gatsby/src/Sidebar.js @@ -2,11 +2,31 @@ import React from 'react'; import PropTypes from 'prop-types'; import { ExtensionUI } from '@gatsby-cloud-pkg/gatsby-cms-extension-base'; -import { - Spinner, - HelpText, - Icon, -} from '@contentful/forma-36-react-components'; +import { Spinner, HelpText, Icon } from '@contentful/forma-36-react-components'; + +import styled from "@emotion/styled" + +export const Button = styled(`button`)` + border: 0; + border-radius: 4px; + font-family: inherit; + font-size: inherit; + font-weight: inherit; + transition: all 0.3s cubic-bezier(0.55, 0, 0.1, 1); + width: 100%; + color: white; + background-color: #663399; + height: 2.5rem; + + ${props => props.disabled ? ` + background-color: grey; + ` : ``} + + &:hover { + background-color: #542c85; + cursor: pointer; + } +` const STATUS_STYLE = { textAlign: 'center', color: '#7f7c82' }; const ICON_STYLE = { marginBottom: '-4px' }; @@ -33,6 +53,7 @@ export default class Sidebar extends React.Component { slug: null, manifestId: null, lastPublishedDateTime: null, + buttonDisabled: false }; this.sdk = props.sdk; @@ -43,6 +64,7 @@ export default class Sidebar extends React.Component { this.sdk.window.startAutoResizer(); const content = this.props.sdk.entry.getSys(); + console.log({content}) this.setManifestId(content); this.setLastPublishedDateTime(content); } @@ -54,6 +76,7 @@ export default class Sidebar extends React.Component { setManifestId = (content) => { const { id, space, updatedAt } = content; const manifestId = `${space.sys.id}-${id}-${updatedAt}`; + console.info(`setting manifest id to state ${manifestId}`) this.setState({ manifestId }); } @@ -91,6 +114,7 @@ export default class Sidebar extends React.Component { } onSysChanged = (content) => { + console.log(`onSysChanged`) this.setManifestId(content); this.maybeStartProductionBuild(content); this.buildSlug(); @@ -170,6 +194,8 @@ export default class Sidebar extends React.Component { const updatedEntry = await space.getEntry(ids.entry); + console.log({updatedEntry}) + fields.forEach(([fieldName, field]) => { const { locales } = field; @@ -188,18 +214,18 @@ export default class Sidebar extends React.Component { }); }); + this.setManifestId(updatedEntry.sys); + return space.updateEntry(updatedEntry); } - refreshPreview = async () => { + refreshPreview = () => { const { webhookUrl, previewWebhookUrl, authToken } = this.sdk.parameters.installation; - await this.manuallySaveContentEntry(); - if (previewWebhookUrl) { callWebhook(previewWebhookUrl, authToken); } else if (webhookUrl) { @@ -240,21 +266,88 @@ export default class Sidebar extends React.Component {
{(previewWebhookUrl || webhookUrl) ? - { - await this.refreshPreview(); - /** - * ExtensionUI returns a reference to the opened tab (previewWindow) after eagerly - * opening it with the given previewUrl. Because there is a small chance that this will - * have a stale manifestId, we update the url in the opened preview tab just in case - * to ensure that the user is redirected to the correct preview build - */ - previewWindow.location.href = this.getPreviewUrl(); - }} - /> : + + contentSyncUrl ? ( + <> + + {!!this.state.buttonDisabled && } + + ) : ( + { + // wait a bit for contentful to save. + await new Promise(resolve => setTimeout(resolve, 3000)) + console.log({ previewUrl: this.getPreviewUrl() }) + this.refreshPreview(); + /** + * ExtensionUI returns a reference to the opened tab (previewWindow) after eagerly + * opening it with the given previewUrl. Because there is a small chance that this will + * have a stale manifestId, we update the url in the opened preview tab just in case + * to ensure that the user is redirected to the correct preview build + */ + let previewUrl = this.getPreviewUrl() + console.log(`opening preview url ${previewUrl}`) + window.open(previewUrl, `GATSBY`) + const interval = setInterval(() => { + const newPreviewUrl = this.getPreviewUrl() + console.log({previewUrl, newPreviewUrl}) + + if (previewUrl !== newPreviewUrl) { + previewUrl = newPreviewUrl + window.open(previewUrl, `GATSBY`) + console.log(`new preview url ${newPreviewUrl}`) + this.refreshPreview(); + clearInterval(interval) + } + }, 1000) + + setTimeout(() => clearInterval(interval), 10000) + }} + /> + ) + : {' '}Please add a Preview Webhook URL to your Gatsby App settings. From cbf84012b1a9da608e46539237a847b6e3dfa111 Mon Sep 17 00:00:00 2001 From: Tyler Barnes Date: Tue, 5 Oct 2021 16:26:23 -0700 Subject: [PATCH 07/14] cleanup --- apps/gatsby/src/Sidebar.js | 32 -------------------------------- 1 file changed, 32 deletions(-) diff --git a/apps/gatsby/src/Sidebar.js b/apps/gatsby/src/Sidebar.js index b365c1cc91..c8cca2a126 100644 --- a/apps/gatsby/src/Sidebar.js +++ b/apps/gatsby/src/Sidebar.js @@ -188,37 +188,6 @@ export default class Sidebar extends React.Component { this.setState({ slug: finalSlug }) } - manuallySaveContentEntry = async () => { - const { entry, space, ids } = this.props.sdk; - const fields = Object.entries(entry.fields); - - const updatedEntry = await space.getEntry(ids.entry); - - console.log({updatedEntry}) - - fields.forEach(([fieldName, field]) => { - const { locales } = field; - - locales.forEach((locale) => { - const fieldLocale = field._getFieldLocale(locale); - const fieldValue = fieldLocale.getValue(); - - // if a field was previously empty, it will not be on the updateEntry object - let updateField = updatedEntry.fields[fieldName]; - if (!updateField) { - updateField = {}; - updatedEntry.fields[fieldName] = updateField; - } - - updateField[locale] = fieldValue; - }); - }); - - this.setManifestId(updatedEntry.sys); - - return space.updateEntry(updatedEntry); - } - refreshPreview = () => { const { webhookUrl, @@ -231,7 +200,6 @@ export default class Sidebar extends React.Component { } else if (webhookUrl) { callWebhook(webhookUrl, authToken); } else { - // @todo show this in the UI console.warn(`Please add a Preview Webhook URL to your Gatsby Cloud App settings.`) } }; From 24b2ebb0c33c09bfd346c03ea0974712fb130114 Mon Sep 17 00:00:00 2001 From: Tyler Barnes Date: Wed, 6 Oct 2021 09:21:10 -0700 Subject: [PATCH 08/14] small tweaks --- apps/gatsby/src/Sidebar.js | 18 +++++++++++------- 1 file changed, 11 insertions(+), 7 deletions(-) diff --git a/apps/gatsby/src/Sidebar.js b/apps/gatsby/src/Sidebar.js index c8cca2a126..48fc46ec8b 100644 --- a/apps/gatsby/src/Sidebar.js +++ b/apps/gatsby/src/Sidebar.js @@ -20,12 +20,12 @@ export const Button = styled(`button`)` ${props => props.disabled ? ` background-color: grey; - ` : ``} - - &:hover { - background-color: #542c85; - cursor: pointer; - } + ` : ` + &:hover { + background-color: #542c85; + cursor: pointer; + } + `} ` const STATUS_STYLE = { textAlign: 'center', color: '#7f7c82' }; @@ -53,7 +53,7 @@ export default class Sidebar extends React.Component { slug: null, manifestId: null, lastPublishedDateTime: null, - buttonDisabled: false + buttonDisabled: false, }; this.sdk = props.sdk; @@ -243,8 +243,10 @@ export default class Sidebar extends React.Component { } this.setState({ buttonDisabled: true }) + // wait a bit for contentful to save. await new Promise(resolve => setTimeout(resolve, 3000)) + this.refreshPreview(); console.log({ previewUrl: this.getPreviewUrl() }) @@ -253,6 +255,7 @@ export default class Sidebar extends React.Component { console.log(`opening preview url ${previewUrl}`) window.open(previewUrl, `GATSBY`) + // Wait to see if Contentful saves new data async const interval = setInterval(() => { const newPreviewUrl = this.getPreviewUrl() console.log({previewUrl, newPreviewUrl}) @@ -270,6 +273,7 @@ export default class Sidebar extends React.Component { } }, 1000) + // after 10 seconds stop waiting for Contentful to save data setTimeout(() => { clearInterval(interval) this.setState({ buttonDisabled: false }) From bfbbff6d1fe637a48d4280d2ad3f0c254d7c9e98 Mon Sep 17 00:00:00 2001 From: Tyler Barnes Date: Wed, 6 Oct 2021 10:58:11 -0700 Subject: [PATCH 09/14] clean up code --- apps/gatsby/src/Sidebar.js | 133 ++++++++++++++----------------------- 1 file changed, 51 insertions(+), 82 deletions(-) diff --git a/apps/gatsby/src/Sidebar.js b/apps/gatsby/src/Sidebar.js index 48fc46ec8b..ae1689841b 100644 --- a/apps/gatsby/src/Sidebar.js +++ b/apps/gatsby/src/Sidebar.js @@ -30,6 +30,7 @@ export const Button = styled(`button`)` const STATUS_STYLE = { textAlign: 'center', color: '#7f7c82' }; const ICON_STYLE = { marginBottom: '-4px' }; +const GATSBY_PREVIEW_TAB_ID = `GATSBY_TAB` const callWebhook = (webhookUrl, authToken) => fetch(webhookUrl, { method: 'POST', @@ -218,6 +219,48 @@ export default class Sidebar extends React.Component { return previewUrl; } + handleContentSync = async () => { + if (this.state.buttonDisabled) { + return + } + + this.setState({ buttonDisabled: true }) + + // wait a bit for contentful to save. + await new Promise(resolve => setTimeout(resolve, 3000)) + + this.refreshPreview(); + + let previewUrl = this.getPreviewUrl() + console.info(`opening preview url ${previewUrl}`) + window.open(previewUrl, GATSBY_PREVIEW_TAB_ID) + + // Wait to see if Contentful saves new data async + const interval = setInterval(() => { + const newPreviewUrl = this.getPreviewUrl() + + if (previewUrl !== newPreviewUrl) { + clearInterval(interval) + + previewUrl = newPreviewUrl + + console.info(`new preview url ${newPreviewUrl}`) + window.open(previewUrl, GATSBY_PREVIEW_TAB_ID) + + this.refreshPreview(); + this.setState({ buttonDisabled: false }) + } + }, 1000) + + // after 10 seconds stop waiting for Contentful to save data + setTimeout(() => { + clearInterval(interval) + this.setState({ buttonDisabled: false }) + }, 10000) +} + + + render = () => { let { contentSyncUrl, @@ -234,91 +277,17 @@ export default class Sidebar extends React.Component {
{(previewWebhookUrl || webhookUrl) ? - - contentSyncUrl ? ( <> - + {!!this.state.buttonDisabled && } - ) : ( - { - // wait a bit for contentful to save. - await new Promise(resolve => setTimeout(resolve, 3000)) - console.log({ previewUrl: this.getPreviewUrl() }) - this.refreshPreview(); - /** - * ExtensionUI returns a reference to the opened tab (previewWindow) after eagerly - * opening it with the given previewUrl. Because there is a small chance that this will - * have a stale manifestId, we update the url in the opened preview tab just in case - * to ensure that the user is redirected to the correct preview build - */ - let previewUrl = this.getPreviewUrl() - console.log(`opening preview url ${previewUrl}`) - window.open(previewUrl, `GATSBY`) - const interval = setInterval(() => { - const newPreviewUrl = this.getPreviewUrl() - console.log({previewUrl, newPreviewUrl}) - - if (previewUrl !== newPreviewUrl) { - previewUrl = newPreviewUrl - window.open(previewUrl, `GATSBY`) - console.log(`new preview url ${newPreviewUrl}`) - this.refreshPreview(); - clearInterval(interval) - } - }, 1000) - - setTimeout(() => clearInterval(interval), 10000) - }} - /> - ) : From 9c4379cb349384b1d0b842fff0e37db7595bfdcc Mon Sep 17 00:00:00 2001 From: Tyler Barnes Date: Wed, 6 Oct 2021 11:01:35 -0700 Subject: [PATCH 10/14] remove console logs --- apps/gatsby/src/Sidebar.js | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/apps/gatsby/src/Sidebar.js b/apps/gatsby/src/Sidebar.js index ae1689841b..e6c491d0b5 100644 --- a/apps/gatsby/src/Sidebar.js +++ b/apps/gatsby/src/Sidebar.js @@ -65,7 +65,7 @@ export default class Sidebar extends React.Component { this.sdk.window.startAutoResizer(); const content = this.props.sdk.entry.getSys(); - console.log({content}) + this.setManifestId(content); this.setLastPublishedDateTime(content); } @@ -115,7 +115,6 @@ export default class Sidebar extends React.Component { } onSysChanged = (content) => { - console.log(`onSysChanged`) this.setManifestId(content); this.maybeStartProductionBuild(content); this.buildSlug(); From 7f1578cdf04936578509590480409aef779a5d22 Mon Sep 17 00:00:00 2001 From: Tyler Barnes Date: Wed, 6 Oct 2021 11:01:41 -0700 Subject: [PATCH 11/14] remove unused styled component --- apps/gatsby/src/Sidebar.js | 24 ------------------------ 1 file changed, 24 deletions(-) diff --git a/apps/gatsby/src/Sidebar.js b/apps/gatsby/src/Sidebar.js index e6c491d0b5..d13f88ab9f 100644 --- a/apps/gatsby/src/Sidebar.js +++ b/apps/gatsby/src/Sidebar.js @@ -4,30 +4,6 @@ import { ExtensionUI } from '@gatsby-cloud-pkg/gatsby-cms-extension-base'; import { Spinner, HelpText, Icon } from '@contentful/forma-36-react-components'; -import styled from "@emotion/styled" - -export const Button = styled(`button`)` - border: 0; - border-radius: 4px; - font-family: inherit; - font-size: inherit; - font-weight: inherit; - transition: all 0.3s cubic-bezier(0.55, 0, 0.1, 1); - width: 100%; - color: white; - background-color: #663399; - height: 2.5rem; - - ${props => props.disabled ? ` - background-color: grey; - ` : ` - &:hover { - background-color: #542c85; - cursor: pointer; - } - `} -` - const STATUS_STYLE = { textAlign: 'center', color: '#7f7c82' }; const ICON_STYLE = { marginBottom: '-4px' }; const GATSBY_PREVIEW_TAB_ID = `GATSBY_TAB` From 578b9fb2d74e5187d276061d3e43de59cf66541a Mon Sep 17 00:00:00 2001 From: Tyler Barnes Date: Wed, 6 Oct 2021 11:03:00 -0700 Subject: [PATCH 12/14] only fire onclick if we're using content sync --- apps/gatsby/src/Sidebar.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/apps/gatsby/src/Sidebar.js b/apps/gatsby/src/Sidebar.js index d13f88ab9f..a6e83a1b3a 100644 --- a/apps/gatsby/src/Sidebar.js +++ b/apps/gatsby/src/Sidebar.js @@ -259,7 +259,7 @@ export default class Sidebar extends React.Component { contentSlug={!!slug && slug} previewUrl={previewUrl} authToken={authToken} - onOpenPreviewButtonClick={this.handleContentSync} + onOpenPreviewButtonClick={!!contentSyncUrl && this.handleContentSync} /> {!!this.state.buttonDisabled && } From b946e976297ca0d6bb790448cd1c9aab85add5a0 Mon Sep 17 00:00:00 2001 From: Tyler Barnes Date: Wed, 6 Oct 2021 11:07:04 -0700 Subject: [PATCH 13/14] remove another log --- apps/gatsby/src/Sidebar.js | 1 - 1 file changed, 1 deletion(-) diff --git a/apps/gatsby/src/Sidebar.js b/apps/gatsby/src/Sidebar.js index a6e83a1b3a..c91e85dad5 100644 --- a/apps/gatsby/src/Sidebar.js +++ b/apps/gatsby/src/Sidebar.js @@ -53,7 +53,6 @@ export default class Sidebar extends React.Component { setManifestId = (content) => { const { id, space, updatedAt } = content; const manifestId = `${space.sys.id}-${id}-${updatedAt}`; - console.info(`setting manifest id to state ${manifestId}`) this.setState({ manifestId }); } From 230c4642f62733862a3290af176346efe7184401 Mon Sep 17 00:00:00 2001 From: Tyler Barnes Date: Wed, 6 Oct 2021 11:07:30 -0700 Subject: [PATCH 14/14] Update apps/gatsby/src/Sidebar.js Co-authored-by: Matt Ehlinger --- apps/gatsby/src/Sidebar.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/apps/gatsby/src/Sidebar.js b/apps/gatsby/src/Sidebar.js index c91e85dad5..7db04d0623 100644 --- a/apps/gatsby/src/Sidebar.js +++ b/apps/gatsby/src/Sidebar.js @@ -200,7 +200,7 @@ export default class Sidebar extends React.Component { this.setState({ buttonDisabled: true }) - // wait a bit for contentful to save. + // Contentful takes a few seconds to save. If we do not wait a bit for this, then the Gatsby preview may be started and finish before any content is even saved on the Contentful side await new Promise(resolve => setTimeout(resolve, 3000)) this.refreshPreview();