Gato GraphQL + Bricks Builder Demo
Eine Bricks-Seite von Staging nach Produktion synchronisieren (Bilder inklusive!)
Lade eine Bricks-Seite oder ein Bricks-Template von einer WordPress-Staging-Website und repliziere sie auf einer WordPress-Produktionswebsite – inklusive Bildsynchronisierung
Leonardo Losoviz -
Wir können Gato GraphQL mit der Bricks-Erweiterung nutzen, um eine Bricks-Seite oder ein Template von einer WordPress-Staging-Website zu exportieren und auf einer WordPress-Produktionswebsite zu replizieren – inklusive Bildsynchronisierung.
Das Gato GraphQL-Plugin + Power Extensions + Bricks-Erweiterung muss auf beiden Websites installiert sein – auf der Staging- und der Produktionswebsite.
Der gemeinsame Bezeichner zwischen Staging- und Produktionswebsite ist der Slug. Wird der Slug auf der Produktionswebsite nicht gefunden, erstellt die Query eine neue Bricks-Seite. Wird der Slug gefunden, aktualisiert die Query die vorhandene Bricks-Seite.
Die Query importiert alle fehlenden Medienelemente, die auf der Bricks-Seite der Staging-Website enthalten sind:
- Das Beitragsbild der Seite
- Hintergrundbilder aller Bricks-Elemente
- Bilder aller Bricks-Elemente der folgenden Typen:
imageimage-gallerylogosvg
Für jedes Bild prüft die Query, ob auf der Produktionswebsite ein Bild mit demselben Slug vorhanden ist (der Slug ist der gemeinsame Bezeichner für Medienelemente zwischen Websites). Ist das der Fall, wird die ID des Bildes von der Produktionswebsite verwendet. Andernfalls wird das Bild auf die Produktionswebsite importiert und dem Bricks-Element diese ID zugewiesen.
Die Staging-Website muss von der Produktionswebsite aus erreichbar sein, damit deren Bilder über ihre URLs abgerufen werden können. Wenn die Staging-Domain als unsicher gilt (z. B. eine .local-Domain), muss die Produktionswebsite unsichere URLs erlauben.
Beide Websites müssen den Zugriff auf den entsprechenden Custom Post Type erlauben (bricks_template, page oder einen anderen).
Wir müssen die folgenden Variablen angeben:
postSlug: Der Slug der Bricks-Seite oder des Templates (oder eines anderen Custom Post Types), der übertragen werden sollprodSiteGraphQLEndpointURL: Die GraphQL-Endpunkt-URL der WordPress-ProduktionswebsiteupdateMediaItems: Ob bereits vorhandene Medienelemente auf der Produktionswebsite aktualisiert werden sollen. Standardmäßigtrue.username: Der Benutzername für die Authentifizierung auf der ProduktionswebsiteappPassword: Das Anwendungspasswort für die Authentifizierung auf der Produktionswebsite
Hier ist die GraphQL-Query:
query InitializeVariables
@configureWarningsOnExportingDuplicateVariable(enabled: false)
{
emptyArray: _echo(value: [])
@export(as: "imageSlugs")
@export(as: "bricksAnyElementBackgroundImageIDs")
@export(as: "bricksImageElementImageIDs")
@export(as: "bricksSvgElementFileIDs")
@export(as: "bricksLogoElementLogoIDs")
@export(as: "bricksLogoElementLogoInverseIDs")
@export(as: "bricksImageGalleryElementListIDItems")
@remove
emptyID: _echo(value: null)
@export(as: "featuredImageID")
@remove
emptyBool: _echo(value: false)
@export(as: "bricksIsEnabledForCustomPostType")
@remove
}
query GetPostData(
$postTypes: [String!]! = ["bricks_template", "page"]
$postSlug: String!
)
@depends(on: "InitializeVariables")
{
customPost(by: { slug: $postSlug }, customPostTypes: $postTypes, status: any)
@fail(
message: "There is no Bricks page in the staging site with the provided slug"
data: {
slug: $postSlug
}
)
{
rawTitle
@export(as: "postTitle")
rawContent
@export(as: "postContent")
rawExcerpt
@export(as: "postExcerpt")
rawStatus
@export(as: "postStatus")
date
@export(as: "postDate")
gmtDate: date(gmt: true)
@export(as: "postGmtDate")
customPostType
@export(as: "postType")
featuredImage {
id @export(as: "featuredImageID")
}
metaKeys(filter: { exclude: ["_edit_last", "_edit_lock", "_pingme", "_encloseme", "_trackbackme", "enclosure", "_thumbnail_id", "_wp_trash_meta_status", "_wp_trash_meta_time", "_wp_desired_post_slug", "_wp_old_slug", "_wp_old_date"] })
meta(keys: $__metaKeys)
@export(as: "postMeta")
bricksIsEnabledForCustomPostType
@export(as: "bricksIsEnabledForCustomPostType")
bricksAnyElementBackgroundImageElementsData: bricksData
@underEachArrayItem
@underJSONObjectProperty(
by: { path: "settings._background.image.id" }
failIfNonExistingKeyOrPath: false
)
@export(as: "bricksAnyElementBackgroundImageIDs")
bricksImageElementsData: bricksData( filterBy:{ include: ["image"] } )
@underEachArrayItem
@underJSONObjectProperty(
by: { path: "settings.image.id" }
# External images have no ID
failIfNonExistingKeyOrPath: false
)
@export(as: "bricksImageElementImageIDs")
bricksSvgElementsData: bricksData( filterBy:{ include: ["svg"] } )
@underEachArrayItem
@underJSONObjectProperty(
by: { path: "settings.file.id" }
failIfNonExistingKeyOrPath: false
)
@export(as: "bricksSvgElementFileIDs")
bricksLogoElementsData: bricksData( filterBy:{ include: ["logo"] } )
@underEachArrayItem(
affectDirectivesUnderPos: [1, 3]
)
@underJSONObjectProperty(
by: { path: "settings.logo.id" }
failIfNonExistingKeyOrPath: false
)
@export(as: "bricksLogoElementLogoIDs")
@underJSONObjectProperty(
by: { path: "settings.logoInverse.id" }
failIfNonExistingKeyOrPath: false
)
@export(as: "bricksLogoElementLogoInverseIDs")
bricksImageGalleryElementsData: bricksData( filterBy:{ include: ["image-gallery"] } )
@underEachArrayItem
@underJSONObjectProperty(
by: { path: "settings.items.images" }
failIfNonExistingKeyOrPath: false
)
@underEachArrayItem
@underJSONObjectProperty(
by: { key: "id" }
failIfNonExistingKeyOrPath: false
)
@export(as: "bricksImageGalleryElementListIDItems")
}
isMissingPostInStaging: _isNull(value: $__customPost)
@export(as: "isMissingPostInStaging")
}
query MaybeFailIfPostIsNotEnabledForBricks
@depends(on: "GetPostData")
@skip(if: $isMissingPostInStaging)
@skip(if: $bricksIsEnabledForCustomPostType)
{
_fail(message: "Bricks is not enabled for the custom post type")
}
query FetchAndExportImageData
@depends(on: "MaybeFailIfPostIsNotEnabledForBricks")
@include(if: $bricksIsEnabledForCustomPostType)
{
# External images have no ID, and the featured image may be `null`
mediaItemsIDsToExport: _arrayMerge(
arrays: [
[$featuredImageID],
$bricksAnyElementBackgroundImageIDs,
$bricksImageElementImageIDs,
$bricksSvgElementFileIDs,
$bricksLogoElementLogoIDs,
$bricksLogoElementLogoInverseIDs,
$bricksImageGalleryElementListIDItems,
]
)
filteredMediaItemsIDsToExport: _arrayFilter(array: $__mediaItemsIDsToExport)
mediaItems(filter: { ids: $__filteredMediaItemsIDsToExport, mimeTypes: "*" }, pagination: { limit: -1 }) {
id
src(size: "full")
slug
title
caption
altText
description
date
gmtDate: date(gmt: true)
mimeType
@export(
as: "imageData"
type: LIST
affectAdditionalFieldsUnderPos: [1, 2, 3, 4, 5, 6, 7, 8, 9]
)
}
}
query ExportBricksPostToProductionSite(
$postSlug: String!
$prodSiteGraphQLEndpointURL: String!
$username: String!
$appPassword: String!
$updateMediaItems: Boolean! = true
)
@depends(on: "FetchAndExportImageData")
@include(if: $bricksIsEnabledForCustomPostType)
{
loginCredentials: _sprintf(
string: "%s:%s",
values: [$username, $appPassword]
)
@remove
base64EncodedLoginCredentials: _strBase64Encode(
string: $__loginCredentials
)
@remove
loginCredentialsHeaderValue: _sprintf(
string: "Basic %s",
values: [$__base64EncodedLoginCredentials]
)
@remove
requestAgainstProductionSite: _sendGraphQLHTTPRequest(
input: {
endpoint: $prodSiteGraphQLEndpointURL,
query: """
query InitializeVariables
@configureWarningsOnExportingDuplicateVariable(enabled: false)
{
emptyArray: _echo(value: [])
@export(as: "existingLocalImagesWithSlugs")
@export(as: "localMediaItemData")
@export(as: "mergeBricksAnyElementBackgroundImageEntries")
@export(as: "mergeBricksImageElementImageEntries")
@export(as: "mergeBricksSvgElementFileEntries")
@export(as: "mergeBricksLogoElementLogoEntries")
@export(as: "mergeBricksLogoElementLogoInverseEntries")
@export(as: "mergeBricksImageGalleryElementImageEntries")
@export(as: "computeBricksImageGalleryElementListIDs")
@export(as: "computeBricksImageGalleryElementListElementProps")
@export(as: "computeBricksImageGalleryElementListImageEntries")
@remove
emptyID: _echo(value: null)
@export(as: "postId")
@export(as: "localFeaturedImageID")
@remove
}
query ExportData(
$featuredImageID: ID!
)
@depends(on: "InitializeVariables")
{
originalImageSizeNames: imageSizeNames
@remove
imageSizeNames: _arrayAddItem(array: $__originalImageSizeNames, value: "full")
@export(as: "imageSizeNames")
hasFeaturedImageID: _notNull(value: $featuredImageID)
@export(as: "hasFeaturedImageID")
}
############################################################################
# Calculate what images are already in the production site
############################################################################
query ProcessImageDataBySlugs(
$imageData: [JSONObject!]!
)
@depends(on: "ExportData")
{
imageDataByID: _arrayOfJSONObjectsExtractPropertyAndConvertToObject(
array: $imageData,
key: "id",
)
@export(as: "imageDataByID")
imageDataBySlug: _arrayOfJSONObjectsExtractPropertyAndConvertToObject(
array: $imageData,
key: "slug",
)
@export(as: "imageDataBySlug")
imageSlugs: _objectProperties(object: $__imageDataBySlug)
@export(as: "imageSlugs")
}
query RetrieveExistingLocalImageData
@depends(on: "ProcessImageDataBySlugs")
{
existingLocalImagesWithSlugs: mediaItems(filter: { slugs: $imageSlugs, mimeTypes: "*" }, pagination: { limit: -1 }) {
id
slug
@export(
as: "existingLocalImagesWithSlugs"
type: LIST
affectAdditionalFieldsUnderPos: [1]
)
}
}
query ComputeLocalImagesData
@depends(on: "RetrieveExistingLocalImageData")
{
existingLocalImagesBySlug: _arrayOfJSONObjectsExtractPropertyAndConvertToObject(
array: $existingLocalImagesWithSlugs,
key: "slug",
)
existingLocalImageSlugs: _objectProperties(object: $__existingLocalImagesBySlug)
existingLocalImageDataBySlug: _objectIntersectKeyWithArrays(object: $imageDataBySlug, arrays: [$__existingLocalImageSlugs])
@remove
existingLocalImageData: _objectValues(object: $__existingLocalImageDataBySlug)
@export(as: "existingLocalImageData")
nonExistingLocalImageSlugs: _arrayDiff(arrays: [$imageSlugs, $__existingLocalImageSlugs])
nonExistingLocalImageDataBySlug: _objectIntersectKeyWithArrays(object: $imageDataBySlug, arrays: [$__nonExistingLocalImageSlugs])
@remove
nonExistingLocalImageData: _objectValues(object: $__nonExistingLocalImageDataBySlug)
@export(as: "nonExistingLocalImageData")
}
############################################################################
# Prepare variables to convert external images to local images
############################################################################
query RetrieveImageData
@depends(on: "ComputeLocalImagesData")
{
localMediaItemData: mediaItems(filter: { slugs: $imageSlugs, mimeTypes: "*" }, pagination: { limit: -1 }) {
id
slug
src(size: "full")
srcs(sizes: $imageSizeNames)
full: src(size: "full")
@export(
as: "localMediaItemData"
type: LIST
affectAdditionalFieldsUnderPos: [1, 2, 3, 4]
)
}
}
query ComputeImages
@depends(on: "RetrieveImageData")
{
localMediaItemDataBySlug: _arrayOfJSONObjectsExtractPropertyAndConvertToObject(
array: $localMediaItemData,
key: "slug",
)
@export(as: "localMediaItemDataBySlug")
}
############################################################################
# Import images from the staging site
############################################################################
query GenerateCreateImageMutationInputs
@depends(on: "ComputeImages")
{
createMediaItemsInputs: _echo(value: $nonExistingLocalImageData)
@underEachArrayItem(
passValueOnwardsAs: "mediaItemData"
affectDirectivesUnderPos: [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]
)
@applyField(
name: "_objectProperty"
arguments: {
object: $mediaItemData,
by: { key: "src" }
}
passOnwardsAs: "src"
)
@applyField(
name: "_objectProperty"
arguments: {
object: $mediaItemData,
by: { key: "slug" }
}
passOnwardsAs: "slug"
)
@applyField(
name: "_objectProperty"
arguments: {
object: $mediaItemData,
by: { key: "title" }
}
passOnwardsAs: "title"
)
@applyField(
name: "_objectProperty"
arguments: {
object: $mediaItemData,
by: { key: "caption" }
}
passOnwardsAs: "caption"
)
@applyField(
name: "_objectProperty"
arguments: {
object: $mediaItemData,
by: { key: "altText" }
}
passOnwardsAs: "altText"
)
@applyField(
name: "_objectProperty"
arguments: {
object: $mediaItemData,
by: { key: "description" }
}
passOnwardsAs: "description"
)
@applyField(
name: "_objectProperty"
arguments: {
object: $mediaItemData,
by: { key: "gmtDate" }
}
passOnwardsAs: "gmtDate"
)
@applyField(
name: "_objectProperty"
arguments: {
object: $mediaItemData,
by: { key: "date" }
}
passOnwardsAs: "date"
)
@applyField(
name: "_objectProperty"
arguments: {
object: $mediaItemData,
by: { key: "mimeType" }
}
passOnwardsAs: "mimeType"
)
@applyField(
name: "_echo"
arguments: {
value: {
from: {
url: {
source: $src
}
},
slug: $slug,
title: $title,
caption: $caption,
altText: $altText,
description: $description,
date: $date,
gmtDate: $gmtDate,
mimeType: $mimeType,
}
}
setResultInResponse: true
)
@export(as: "createMediaItemsInputs")
}
mutation ImportImages
@depends(on: "GenerateCreateImageMutationInputs")
{
createMediaItems(inputs: $createMediaItemsInputs) {
mediaItemID
status
errors {
__typename
...on ErrorPayload {
message
}
}
mediaItem {
...MediaItemData
}
}
}
############################################################################
# Update the already-existing media items in the production site
############################################################################
query GenerateUpdateImageMutationInputs(
$updateMediaItems: Boolean! = true
)
@depends(on: "ImportImages")
@include(if: $updateMediaItems)
{
updateMediaItemsInputs: _echo(value: $existingLocalImageData)
@underEachArrayItem(
passValueOnwardsAs: "mediaItemData"
affectDirectivesUnderPos: [1, 2, 3, 4, 5, 6, 7, 8]
)
@applyField(
name: "_objectProperty"
arguments: {
object: $mediaItemData,
by: { key: "slug" }
}
passOnwardsAs: "commonSlug"
)
@applyField(
name: "_objectProperty"
arguments: {
object: $localMediaItemDataBySlug,
by: { key: $commonSlug }
}
passOnwardsAs: "localImageData"
)
@applyField(
name: "_objectProperty"
arguments: {
object: $localImageData,
by: { key: "id" }
}
passOnwardsAs: "id"
)
@applyField(
name: "_objectProperty"
arguments: {
object: $mediaItemData,
by: { key: "title" }
}
passOnwardsAs: "title"
)
@applyField(
name: "_objectProperty"
arguments: {
object: $mediaItemData,
by: { key: "caption" }
}
passOnwardsAs: "caption"
)
@applyField(
name: "_objectProperty"
arguments: {
object: $mediaItemData,
by: { key: "altText" }
}
passOnwardsAs: "altText"
)
@applyField(
name: "_objectProperty"
arguments: {
object: $mediaItemData,
by: { key: "description" }
}
passOnwardsAs: "description"
)
@applyField(
name: "_echo"
arguments: {
value: {
id: $id,
title: $title,
caption: $caption,
altText: $altText,
description: $description,
}
}
setResultInResponse: true
)
@export(as: "updateMediaItemsInputs")
}
mutation UpdateImages(
$updateMediaItems: Boolean! = true
)
@depends(on: "GenerateUpdateImageMutationInputs")
@include(if: $updateMediaItems)
{
updateMediaItems(inputs: $updateMediaItemsInputs) {
mediaItemID
status
errors {
__typename
...on ErrorPayload {
message
}
}
mediaItem {
...MediaItemData
}
}
}
fragment MediaItemData on Media {
altText
caption
mimeType
slug
src
title
}
############################################################################
# Adapt the featured image to use the local image
############################################################################
query AdaptFeaturedImageToLocalImage(
$featuredImageID: ID!
)
@depends(on: "UpdateImages")
@include(if: $hasFeaturedImageID)
{
featuredImageID: _echo(value: $featuredImageID)
@passOnwards(as: "externalFeaturedImageID")
@applyField(
name: "_objectProperty"
arguments: {
object: $imageDataByID,
by: { key: $externalFeaturedImageID }
}
passOnwardsAs: "externalImageData"
)
@applyField(
name: "_objectProperty"
arguments: {
object: $externalImageData,
by: { key: "slug" }
}
passOnwardsAs: "commonSlug"
)
@applyField(
name: "_objectProperty"
arguments: {
object: $localMediaItemDataBySlug,
by: { key: $commonSlug }
}
passOnwardsAs: "localImageData"
)
@applyField(
name: "_objectProperty"
arguments: {
object: $localImageData,
by: { key: "id" }
}
setResultInResponse: true
)
@export(as: "localFeaturedImageID")
}
############################################################################
# Create/update the Bricks post with the external data
############################################################################
query CheckIfCustomPostExists(
$postSlug: String!
$postType: String!
)
@depends(on: "AdaptFeaturedImageToLocalImage")
{
maybeCustomPost: customPost(by: { slug: $postSlug }, customPostTypes: [$postType], status: any)
{
id
}
customPostExists: _notNull(value: $__maybeCustomPost)
@export(as: "customPostExists")
}
mutation CreateOrUpdateCustomPost(
$postSlug: String!
$postTitle: String!
$postContent: String!
$postExcerpt: String!
$postStatus: CustomPostStatusEnum!
$postDate: DateTime!
$postGmtDate: DateTime!
$postType: String!
$postMeta: JSONObject!
)
@depends(on: "CheckIfCustomPostExists")
{
customPost(by: { slug: $postSlug }, customPostTypes: [$postType], status: any)
@include(if: $customPostExists)
{
id
@export(as: "postId")
update(input: {
title: $postTitle,
contentAs: { html: $postContent },
excerpt: $postExcerpt,
status: $postStatus,
date: $postDate,
gmtDate: $postGmtDate,
featuredImageBy: {
id: $localFeaturedImageID
},
meta: $postMeta
}) {
status
errors {
__typename
...on ErrorPayload {
message
}
}
...on GenericCustomPostUpdateMutationPayload {
customPost {
...CustomPostData
}
}
...on PostUpdateMutationPayload {
post {
...CustomPostData
}
}
...on PageUpdateMutationPayload {
page {
...CustomPostData
}
}
}
}
createCustomPost(input: {
title: $postTitle,
slug: $postSlug,
contentAs: { html: $postContent },
excerpt: $postExcerpt,
status: $postStatus,
date: $postDate,
gmtDate: $postGmtDate,
featuredImageBy: {
id: $localFeaturedImageID
},
customPostType: $postType,
meta: $postMeta
})
@skip(if: $customPostExists)
{
status
errors {
__typename
...on ErrorPayload {
message
}
}
customPostID
@export(as: "postId")
customPost {
...CustomPostData
}
}
}
fragment CustomPostData on CustomPost {
id
title
slug
content
excerpt
status
date
gmtDate: date(gmt: true)
metaKeys
meta(keys: $__metaKeys)
}
############################################################################
# Update the Bricks Image elements to use the local images
############################################################################
query ExportBricksImageData(
$postSlug: String!
$postType: String!
)
@depends(on: "CreateOrUpdateCustomPost")
{
updateBricksImageDataCustomPost: customPost(by: { slug: $postSlug }, customPostTypes: [$postType], status: any) {
id
bricksAnyElementBackgroundImageElementsData: bricksData
@underEachArrayItem(
affectDirectivesUnderPos: [1, 2, 3]
passValueOnwardsAs: "bricksElement"
)
@applyField(
name: "_objectProperty"
arguments: {
object: $bricksElement,
by: { path: "settings._background.image.id" }
failIfNonExistingKeyOrPath: false
}
passOnwardsAs: "bricksElementBackgroundImageID"
)
# External images have no ID
@applyField(
name: "_notNull"
arguments: {
value: $bricksElementBackgroundImageID
}
passOnwardsAs: "hasBricksAnyElementBackgroundImageID"
)
@if(
condition: $hasBricksAnyElementBackgroundImageID
affectDirectivesUnderPos: [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12]
)
@applyField(
name: "_objectProperty"
arguments: {
object: $bricksElement,
by: { key: "id" }
}
passOnwardsAs: "elementID"
)
@applyField(
name: "_objectProperty"
arguments: {
object: $bricksElement,
by: { path: "settings._background.image.size" }
}
passOnwardsAs: "imageSize"
)
@applyField(
name: "_arraySearch",
arguments: {
array: $imageSizeNames
element: $imageSize
}
passOnwardsAs: "imageSizePosition"
)
# `$bricksElementBackgroundImageID` it contains the ID of the image from staging, find the ID for production and create a new merge mutation entry
@applyField(
name: "_objectProperty"
arguments: {
object: $imageDataByID,
by: { key: $bricksElementBackgroundImageID }
}
passOnwardsAs: "externalImageData"
)
@applyField(
name: "_objectProperty"
arguments: {
object: $externalImageData,
by: { key: "slug" }
}
passOnwardsAs: "commonSlug"
)
@applyField(
name: "_objectProperty"
arguments: {
object: $localMediaItemDataBySlug,
by: { key: $commonSlug }
}
passOnwardsAs: "localImageData"
)
@applyField(
name: "_objectProperty"
arguments: {
object: $localImageData,
by: { key: "id" }
}
passOnwardsAs: "localImageID"
)
@applyField(
name: "_objectProperty"
arguments: {
object: $localImageData,
by: { key: "srcs" }
}
passOnwardsAs: "localImageSrcs"
)
@applyField(
name: "_arrayItem"
arguments: {
array: $localImageSrcs,
position: $imageSizePosition
}
passOnwardsAs: "localImageSrc"
)
@applyField(
name: "_objectProperty"
arguments: {
object: $localImageData,
by: { key: "full" }
}
passOnwardsAs: "localImageFull"
)
@applyField(
name: "_echo"
arguments: {
value: {
id: $elementID,
settings: {
_background: {
image: {
id: $localImageID,
full: $localImageFull,
url: $localImageSrc
}
}
}
}
}
passOnwardsAs: "mergeBricksEntry"
)
@exportFrom(
scopedDynamicVariable: $mergeBricksEntry,
as: "mergeBricksAnyElementBackgroundImageEntries"
)
bricksImageElementsData: bricksData( filterBy: { include: ["image"] } )
@underEachArrayItem(
affectDirectivesUnderPos: [1, 2, 3]
passValueOnwardsAs: "bricksImageElement"
)
@applyField(
name: "_objectProperty"
arguments: {
object: $bricksImageElement,
by: { path: "settings.image.id" }
failIfNonExistingKeyOrPath: false
}
passOnwardsAs: "bricksImageElementImageID"
)
# External images have no ID
@applyField(
name: "_notNull"
arguments: {
value: $bricksImageElementImageID
}
passOnwardsAs: "hasBricksImageElementImageID"
)
@if(
condition: $hasBricksImageElementImageID
affectDirectivesUnderPos: [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12]
)
@applyField(
name: "_objectProperty"
arguments: {
object: $bricksImageElement,
by: { key: "id" }
}
passOnwardsAs: "elementID"
)
@applyField(
name: "_objectProperty"
arguments: {
object: $bricksImageElement,
by: { path: "settings.image.size" }
}
passOnwardsAs: "imageSize"
)
@applyField(
name: "_arraySearch",
arguments: {
array: $imageSizeNames
element: $imageSize
}
passOnwardsAs: "imageSizePosition"
)
# `$bricksImageElementImageID` it contains the ID of the image from staging, find the ID for production and create a new merge mutation entry
@applyField(
name: "_objectProperty"
arguments: {
object: $imageDataByID,
by: { key: $bricksImageElementImageID }
}
passOnwardsAs: "externalImageData"
)
@applyField(
name: "_objectProperty"
arguments: {
object: $externalImageData,
by: { key: "slug" }
}
passOnwardsAs: "commonSlug"
)
@applyField(
name: "_objectProperty"
arguments: {
object: $localMediaItemDataBySlug,
by: { key: $commonSlug }
}
passOnwardsAs: "localImageData"
)
@applyField(
name: "_objectProperty"
arguments: {
object: $localImageData,
by: { key: "id" }
}
passOnwardsAs: "localImageID"
)
@applyField(
name: "_objectProperty"
arguments: {
object: $localImageData,
by: { key: "srcs" }
}
passOnwardsAs: "localImageSrcs"
)
@applyField(
name: "_arrayItem"
arguments: {
array: $localImageSrcs,
position: $imageSizePosition
}
passOnwardsAs: "localImageSrc"
)
@applyField(
name: "_objectProperty"
arguments: {
object: $localImageData,
by: { key: "full" }
}
passOnwardsAs: "localImageFull"
)
@applyField(
name: "_echo"
arguments: {
value: {
id: $elementID,
settings: {
image: {
id: $localImageID,
full: $localImageFull,
url: $localImageSrc
}
}
}
}
passOnwardsAs: "mergeBricksEntry"
)
@exportFrom(
scopedDynamicVariable: $mergeBricksEntry,
as: "mergeBricksImageElementImageEntries"
)
bricksSvgElementsData: bricksData( filterBy: { include: ["svg"] } )
@underEachArrayItem(
affectDirectivesUnderPos: [1, 2, 3]
passValueOnwardsAs: "bricksSvgElement"
)
@applyField(
name: "_objectProperty"
arguments: {
object: $bricksSvgElement,
by: { path: "settings.file.id" }
failIfNonExistingKeyOrPath: false
}
passOnwardsAs: "bricksSvgElementFileID"
)
# Dynamic data SVG elements have no ID
@applyField(
name: "_notNull"
arguments: {
value: $bricksSvgElementFileID
}
passOnwardsAs: "hasBricksSvgElementImageID"
)
@if(
condition: $hasBricksSvgElementImageID
affectDirectivesUnderPos: [1, 2, 3, 4, 5, 6, 7, 8]
)
@applyField(
name: "_objectProperty"
arguments: {
object: $bricksSvgElement,
by: { key: "id" }
}
passOnwardsAs: "elementID"
)
# `$bricksSvgElementFileID` it contains the ID of the image from staging, find the ID for production and create a new merge mutation entry
@applyField(
name: "_objectProperty"
arguments: {
object: $imageDataByID,
by: { key: $bricksSvgElementFileID }
}
passOnwardsAs: "externalImageData"
)
@applyField(
name: "_objectProperty"
arguments: {
object: $externalImageData,
by: { key: "slug" }
}
passOnwardsAs: "commonSlug"
)
@applyField(
name: "_objectProperty"
arguments: {
object: $localMediaItemDataBySlug,
by: { key: $commonSlug }
}
passOnwardsAs: "localImageData"
)
@applyField(
name: "_objectProperty"
arguments: {
object: $localImageData,
by: { key: "id" }
}
passOnwardsAs: "localImageID"
)
@applyField(
name: "_objectProperty"
arguments: {
object: $localImageData,
by: { key: "src" }
}
passOnwardsAs: "localImageSrc"
)
@applyField(
name: "_echo"
arguments: {
value: {
id: $elementID,
settings: {
file: {
id: $localImageID,
url: $localImageSrc
}
}
}
}
passOnwardsAs: "mergeBricksEntry"
)
@exportFrom(
scopedDynamicVariable: $mergeBricksEntry,
as: "mergeBricksSvgElementFileEntries"
)
bricksLogoElementsData: bricksData( filterBy: { include: ["logo"] } )
@underEachArrayItem(
affectDirectivesUnderPos: [1, 2, 3]
passValueOnwardsAs: "bricksLogoElement"
)
@applyField(
name: "_objectProperty"
arguments: {
object: $bricksLogoElement,
by: { path: "settings.logo.id" }
failIfNonExistingKeyOrPath: false
}
passOnwardsAs: "bricksLogoElementLogoID"
)
# External images have no ID
@applyField(
name: "_notNull"
arguments: {
value: $bricksLogoElementLogoID
}
passOnwardsAs: "hasBricksLogoElementLogoID"
)
@if(
condition: $hasBricksLogoElementLogoID
affectDirectivesUnderPos: [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12]
)
@applyField(
name: "_objectProperty"
arguments: {
object: $bricksLogoElement,
by: { key: "id" }
}
passOnwardsAs: "elementID"
)
@applyField(
name: "_objectProperty"
arguments: {
object: $bricksLogoElement,
by: { path: "settings.logo.size" }
}
passOnwardsAs: "imageSize"
)
@applyField(
name: "_arraySearch",
arguments: {
array: $imageSizeNames
element: $imageSize
}
passOnwardsAs: "imageSizePosition"
)
# `$bricksLogoElementLogoID` it contains the ID of the image from staging, find the ID for production and create a new merge mutation entry
@applyField(
name: "_objectProperty"
arguments: {
object: $imageDataByID,
by: { key: $bricksLogoElementLogoID }
}
passOnwardsAs: "externalImageData"
)
@applyField(
name: "_objectProperty"
arguments: {
object: $externalImageData,
by: { key: "slug" }
}
passOnwardsAs: "commonSlug"
)
@applyField(
name: "_objectProperty"
arguments: {
object: $localMediaItemDataBySlug,
by: { key: $commonSlug }
}
passOnwardsAs: "localImageData"
)
@applyField(
name: "_objectProperty"
arguments: {
object: $localImageData,
by: { key: "id" }
}
passOnwardsAs: "localImageID"
)
@applyField(
name: "_objectProperty"
arguments: {
object: $localImageData,
by: { key: "srcs" }
}
passOnwardsAs: "localImageSrcs"
)
@applyField(
name: "_arrayItem"
arguments: {
array: $localImageSrcs,
position: $imageSizePosition
}
passOnwardsAs: "localImageSrc"
)
@applyField(
name: "_objectProperty"
arguments: {
object: $localImageData,
by: { key: "full" }
}
passOnwardsAs: "localImageFull"
)
@applyField(
name: "_echo"
arguments: {
value: {
id: $elementID,
settings: {
logo: {
id: $localImageID,
full: $localImageFull,
url: $localImageSrc
}
}
}
}
passOnwardsAs: "mergeBricksEntry"
)
@exportFrom(
scopedDynamicVariable: $mergeBricksEntry,
as: "mergeBricksLogoElementLogoEntries"
)
@underEachArrayItem(
affectDirectivesUnderPos: [1, 2, 3]
passValueOnwardsAs: "bricksLogoElement"
)
@applyField(
name: "_objectProperty"
arguments: {
object: $bricksLogoElement,
by: { path: "settings.logoInverse.id" }
failIfNonExistingKeyOrPath: false
}
passOnwardsAs: "bricksLogoElementLogoInverseID"
)
# External images have no ID
@applyField(
name: "_notNull"
arguments: {
value: $bricksLogoElementLogoInverseID
}
passOnwardsAs: "hasBricksLogoElementLogoInverseID"
)
@if(
condition: $hasBricksLogoElementLogoInverseID
affectDirectivesUnderPos: [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12]
)
@applyField(
name: "_objectProperty"
arguments: {
object: $bricksLogoElement,
by: { key: "id" }
}
passOnwardsAs: "elementID"
)
@applyField(
name: "_objectProperty"
arguments: {
object: $bricksLogoElement,
by: { path: "settings.logoInverse.size" }
}
passOnwardsAs: "imageSize"
)
@applyField(
name: "_arraySearch",
arguments: {
array: $imageSizeNames
element: $imageSize
}
passOnwardsAs: "imageSizePosition"
)
# `$bricksLogoElementLogoInverseID` it contains the ID of the image from staging, find the ID for production and create a new merge mutation entry
@applyField(
name: "_objectProperty"
arguments: {
object: $imageDataByID,
by: { key: $bricksLogoElementLogoInverseID }
}
passOnwardsAs: "externalImageData"
)
@applyField(
name: "_objectProperty"
arguments: {
object: $externalImageData,
by: { key: "slug" }
}
passOnwardsAs: "commonSlug"
)
@applyField(
name: "_objectProperty"
arguments: {
object: $localMediaItemDataBySlug,
by: { key: $commonSlug }
}
passOnwardsAs: "localImageData"
)
@applyField(
name: "_objectProperty"
arguments: {
object: $localImageData,
by: { key: "id" }
}
passOnwardsAs: "localImageID"
)
@applyField(
name: "_objectProperty"
arguments: {
object: $localImageData,
by: { key: "srcs" }
}
passOnwardsAs: "localImageSrcs"
)
@applyField(
name: "_arrayItem"
arguments: {
array: $localImageSrcs,
position: $imageSizePosition
}
passOnwardsAs: "localImageSrc"
)
@applyField(
name: "_objectProperty"
arguments: {
object: $localImageData,
by: { key: "full" }
}
passOnwardsAs: "localImageFull"
)
@applyField(
name: "_echo"
arguments: {
value: {
id: $elementID,
settings: {
logoInverse: {
id: $localImageID,
full: $localImageFull,
url: $localImageSrc
}
}
}
}
passOnwardsAs: "mergeBricksEntry"
)
@exportFrom(
scopedDynamicVariable: $mergeBricksEntry,
as: "mergeBricksLogoElementLogoInverseEntries"
)
bricksImageGalleryElementsData: bricksData( filterBy: { include: ["image-gallery"] } )
@underEachArrayItem(
affectDirectivesUnderPos: [1, 2, 3, 4, 5, 6, 7, 8]
passValueOnwardsAs: "bricksImageGalleryElement"
)
@applyField(
name: "_objectProperty"
arguments: {
object: $bricksImageGalleryElement,
by: { key: "id" }
}
passOnwardsAs: "elementID"
)
@applyField(
name: "_objectProperty"
arguments: {
object: $bricksImageGalleryElement,
by: { path: "settings.items.size" }
}
passOnwardsAs: "imageSize"
)
@applyField(
name: "_arraySearch",
arguments: {
array: $imageSizeNames
element: $imageSize
}
passOnwardsAs: "imageSizePosition"
)
@applyField(
name: "_objectProperty"
arguments: {
object: $bricksImageGalleryElement,
by: { path: "settings.items.images" }
failIfNonExistingKeyOrPath: false
valueWhenNonExistingKeyOrPath: []
}
passOnwardsAs: "list"
)
@applyField(
name: "_arrayLength",
arguments: {
array: $list,
}
passOnwardsAs: "arrayLength"
)
@applyField(
name: "_echo",
arguments: {
value: {
id: $elementID,
length: $arrayLength,
}
}
passOnwardsAs: "elementProps"
)
@exportFrom(
scopedDynamicVariable: $elementProps
as: "computeBricksImageGalleryElementListElementProps"
)
@underJSONObjectProperty(
by: { path: "settings.items.images" }
failIfNonExistingKeyOrPath: false
)
@underEachArrayItem(
affectDirectivesUnderPos: [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11]
passValueOnwardsAs: "bricksImageGalleryElementListImage"
)
@exportFrom(
scopedDynamicVariable: $elementID,
as: "computeBricksImageGalleryElementListIDs"
)
@applyField(
name: "_objectProperty"
arguments: {
object: $bricksImageGalleryElementListImage,
by: { key: "id" }
failIfNonExistingKeyOrPath: false
}
passOnwardsAs: "bricksImageGalleryElementListImageID"
)
# `$bricksImageGalleryElementListImageID` it contains the ID of the image from staging, find the ID for production and create a new merge mutation entry
@applyField(
name: "_objectProperty"
arguments: {
object: $imageDataByID,
by: { key: $bricksImageGalleryElementListImageID }
}
passOnwardsAs: "externalImageData"
)
@applyField(
name: "_objectProperty"
arguments: {
object: $externalImageData,
by: { key: "slug" }
}
passOnwardsAs: "commonSlug"
)
@applyField(
name: "_objectProperty"
arguments: {
object: $localMediaItemDataBySlug,
by: { key: $commonSlug }
}
passOnwardsAs: "localImageData"
)
@applyField(
name: "_objectProperty"
arguments: {
object: $localImageData,
by: { key: "id" }
}
passOnwardsAs: "localImageID"
)
@applyField(
name: "_objectProperty"
arguments: {
object: $localImageData,
by: { key: "srcs" }
}
passOnwardsAs: "localImageSrcs"
)
@applyField(
name: "_arrayItem"
arguments: {
array: $localImageSrcs,
position: $imageSizePosition
}
passOnwardsAs: "localImageSrc"
)
@applyField(
name: "_objectProperty"
arguments: {
object: $localImageData,
by: { key: "full" }
}
passOnwardsAs: "localImageFull"
)
@applyField(
name: "_echo"
arguments: {
value: {
id: $localImageID,
full: $localImageFull,
url: $localImageSrc
}
}
passOnwardsAs: "entry"
)
@exportFrom(
scopedDynamicVariable: $entry,
as: "computeBricksImageGalleryElementListImageEntries"
)
}
}
query PrepareBricksImageData
@depends(on: "ExportBricksImageData")
{
mergeBricksImageGalleryElementImageEntries: _echo(value: $computeBricksImageGalleryElementListElementProps)
@underEachArrayItem(
passValueOnwardsAs: "elementProps"
affectDirectivesUnderPos: [1, 2, 3, 4, 6]
)
@applyField(
name: "_objectProperty",
arguments: {
object: $elementProps
by: { key: "id" }
}
passOnwardsAs: "elementID"
)
@applyField(
name: "_arraySearch",
arguments: {
array: $computeBricksImageGalleryElementListIDs
element: $elementID
}
passOnwardsAs: "offset"
)
@applyField(
name: "_notNull",
arguments: {
value: $offset
}
passOnwardsAs: "hasItems"
)
@unless(condition: $hasItems)
@setNull
@if(
condition: $hasItems
affectDirectivesUnderPos: [1, 2, 3]
)
@applyField(
name: "_objectProperty",
arguments: {
object: $elementProps
by: { key: "length" }
}
passOnwardsAs: "length"
)
@applyField(
name: "_arraySlice",
arguments: {
array: $computeBricksImageGalleryElementListImageEntries
length: $length,
offset: $offset
}
passOnwardsAs: "items"
)
@applyField(
name: "_echo",
arguments: {
value: {
id: $elementID,
settings: {
items: {
images: $items
}
}
}
},
setResultInResponse: true
)
@arrayFilter
@export(as: "mergeBricksImageGalleryElementImageEntries")
}
query CreateBricksImageDataMergeInputs
@depends(on: "PrepareBricksImageData")
{
mergeBricksEntries: _arrayMerge(
arrays: [
$mergeBricksAnyElementBackgroundImageEntries,
$mergeBricksImageElementImageEntries,
$mergeBricksSvgElementFileEntries,
$mergeBricksLogoElementLogoEntries,
$mergeBricksLogoElementLogoInverseEntries,
$mergeBricksImageGalleryElementImageEntries
]
)
bricksMergeCustomPostElementDataItemInputs: _echo(value: {
customPostID: $postId,
elements: $__mergeBricksEntries
})
@export(
as: "bricksMergeCustomPostElementDataItemInputs",
type: LIST
)
}
mutation MergeBricksImageData
@depends(on: "CreateBricksImageDataMergeInputs")
{
bricksMergeCustomPostElementDataItems(inputs: $bricksMergeCustomPostElementDataItemInputs) {
status
errors {
__typename
...on ErrorPayload {
message
@passOnwards(as: "message")
@fail(
message: $message
condition: ALWAYS
)
}
}
customPost {
__typename
...on CustomPost {
id
bricksData
}
}
}
}
""",
variables: [
{
name: "updateMediaItems",
value: $updateMediaItems
},
{
name: "postType",
value: $postType
},
{
name: "postSlug",
value: $postSlug
},
{
name: "postTitle",
value: $postTitle
},
{
name: "postContent",
value: $postContent
},
{
name: "postExcerpt",
value: $postExcerpt
},
{
name: "postStatus",
value: $postStatus
},
{
name: "featuredImageID",
value: $featuredImageID
},
{
name: "postDate",
value: $postDate
},
{
name: "postGmtDate",
value: $postGmtDate
},
{
name: "postMeta",
value: $postMeta
},
{
name: "imageData",
value: $imageData
},
],
options: {
headers: [
{
name: "Authorization",
value: $__loginCredentialsHeaderValue
}
]
}
}
)
}Die Variablen würden so aussehen:
{
"postSlug": "my-bricks-page",
"prodSiteGraphQLEndpointURL": "https://production-site.com/graphql",
"username": "admin",
"appPassword": "your-app-password"
}