Demo Gato GraphQL + Bricks Builder
Sinkronkan halaman Bricks dari staging ke produksi (termasuk gambar!)
Ambil halaman atau template Bricks dari situs WordPress staging, dan replikasikan ke situs WordPress produksi, termasuk sinkronisasi gambar
Leonardo Losoviz -
Kita dapat menggunakan Gato GraphQL dengan ekstensi Bricks untuk mengekspor halaman atau template Bricks dari situs WordPress staging dan mereplikasinya ke situs WordPress produksi, termasuk menyinkronkan gambar.
Plugin Gato GraphQL + Power Extensions + ekstensi Bricks harus dipasang di kedua situs, yaitu situs staging dan situs produksi.
Pengenal umum antara situs staging dan produksi adalah slug. Jika slug tidak ditemukan di situs produksi, query akan membuat halaman Bricks baru. Jika slug ditemukan, query akan memperbarui halaman Bricks yang sudah ada.
Query mengimpor semua media item yang belum ada yang disertakan dalam halaman Bricks di situs staging:
- Gambar unggulan halaman
- Gambar latar belakang dari semua elemen Bricks
- Gambar dari semua elemen Bricks dengan tipe berikut:
imageimage-gallerylogosvg
Untuk setiap gambar, query memeriksa apakah ada gambar dengan slug yang sama di situs produksi (slug adalah pengenal umum untuk media item antar situs). Jika ada, query menggunakan ID gambar dari situs produksi. Jika tidak, query mengimpor gambar ke situs produksi dan menetapkan ID tersebut ke elemen Bricks.
Situs staging harus dapat diakses oleh situs produksi, untuk mengambil gambarnya melalui URL. Jika domain staging dianggap tidak aman (contoh: domain .local), situs produksi perlu mengizinkan URL tidak aman.
Kedua situs harus mengizinkan akses ke custom post type yang sesuai (bricks_template, page, atau lainnya).
Kita harus menyediakan variabel berikut:
postSlug: Slug dari halaman atau template Bricks (atau custom post type lainnya) yang akan ditransferprodSiteGraphQLEndpointURL: URL endpoint GraphQL dari situs WordPress produksiupdateMediaItems: Apakah akan memperbarui media item yang sudah ada di situs produksi. Nilainyatruesecara default.username: Nama pengguna untuk autentikasi di situs produksiappPassword: Kata sandi aplikasi untuk autentikasi di situs produksi
Berikut adalah query GraphQL:
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
}
]
}
}
)
}Variabel-variabelnya akan terlihat seperti ini:
{
"postSlug": "my-bricks-page",
"prodSiteGraphQLEndpointURL": "https://production-site.com/graphql",
"username": "admin",
"appPassword": "your-app-password"
}