Demo Gato GraphQL + Bricks Builder

Sincronizzare una pagina Bricks da staging a produzione (immagini incluse!)

Recupera una pagina o un template Bricks da un sito WordPress di staging e replicalo in un sito WordPress di produzione, sincronizzando anche le immagini

Leonardo Losoviz
Leonardo Losoviz -
Logo
Image
Target Image

Possiamo usare Gato GraphQL con l’estensione Bricks per esportare una pagina o un template Bricks da un sito WordPress di staging e replicarlo in un sito WordPress di produzione, sincronizzando anche le immagini.

Il plugin Gato GraphQL + Power Extensions + estensione Bricks deve essere installato su entrambi i siti, di staging e di produzione.

L’identificatore comune tra i siti di staging e di produzione è lo slug. Se lo slug non viene trovato nel sito di produzione, la query creerà una nuova pagina Bricks. Se lo slug viene trovato, la query aggiornerà la pagina Bricks esistente.

La query importa tutti gli elementi multimediali mancanti inclusi nella pagina Bricks del sito di staging:

  • L’immagine in evidenza della pagina
  • Le immagini di sfondo di tutti gli elementi Bricks
  • Le immagini di tutti gli elementi Bricks dei seguenti tipi:
    • image
    • image-gallery
    • logo
    • svg

Per ogni immagine, la query verifica se esiste un’immagine con lo stesso slug nel sito di produzione (lo slug è l’identificatore comune per gli elementi multimediali tra i siti). Se esiste, usa l’ID dell’immagine del sito di produzione. Altrimenti importa l’immagine nel sito di produzione e assegna quell’ID all’elemento Bricks.

Il sito di staging deve essere accessibile dal sito di produzione, per recuperarne le immagini tramite i loro URL. Se il dominio di staging è considerato non sicuro (ad esempio, un dominio .local), il sito di produzione deve consentire gli URL non sicuri.

Entrambi i siti devono consentire l’accesso al custom post type corrispondente (bricks_template, page, o qualsiasi altro).

Dobbiamo fornire le seguenti variabili:

  • postSlug: Lo slug della pagina o del template Bricks (o di qualsiasi altro custom post type) da trasferire
  • prodSiteGraphQLEndpointURL: L’URL dell’endpoint GraphQL del sito WordPress di produzione
  • updateMediaItems: Se aggiornare gli elementi multimediali già esistenti nel sito di produzione. Il valore predefinito è true.
  • username: Il nome utente per l’autenticazione sul sito di produzione
  • appPassword: La password applicazione per l’autenticazione sul sito di produzione

Ecco la 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
          }
        ]
      }
    }
  )
}

Le variabili avrebbero questo aspetto:

{
  "postSlug": "my-bricks-page",
  "prodSiteGraphQLEndpointURL": "https://production-site.com/graphql",
  "username": "admin",
  "appPassword": "your-app-password"
}

Iscriviti alla nostra newsletter

Resta aggiornato su tutte le novità di Gato GraphQL.