Integration with WooCommerce Single Products

[craigwilcox]

At the moment, WP Gatsby does not support updates from WooCommerce. As products are updated, the incremental build feature should detect the content changes, invalidate the cache for the updated product, and build the page and any other uses of the product throughout the site.

At least the following updates should be possible for both wpSimpleProduct, and wpVariableProduct, bonus if wpBundleProduct can be supported:

1. name (similar to title for blog posts and pages), id, databaseId, slug.
2. Content sections of a WooCommerce product, including the main content and shortDescription queries.
3. SEO changes.
4. ACF fields attached the the product.
5. Images, including the featured image and galleryImages.
6. price, onSale, regularPrice, dateOnSaleTo, dateOnSaleFrom.
7. Inventory status, including stockQuantity, stockStatus, backorders (allowed or not)
8. Type (simpleProduct, variableProduct, etc.)
9. Shippng information, such as weight, length, width, height.

Many of these are added and updated through the admin section of WooCommerce, but it's also important to support changes made when products are purchased, orders are canceled or refunded, and other action hooks in WooCommerce that effect the items above.

At the moment, we query for the following via WooGraphQL:

{
    id
    databaseId
    name
    slug
    shortDescription
    sku
    dateOnSaleTo
    dateOnSaleFrom
    date
    description
    type: __typename
    seo {
      canonical
      cornerstone
      focuskw
      metaDesc
      metaKeywords
      metaRobotsNofollow
      metaRobotsNoindex
      opengraphAuthor
      opengraphDescription
      opengraphImage {
        sourceUrl
      }
      opengraphModifiedTime
      opengraphPublishedTime
      opengraphPublisher
      opengraphSiteName
      opengraphTitle
      opengraphType
      opengraphUrl
      title
      twitterDescription
      twitterTitle
      breadcrumbs {
        text
        url
      }
    }
    attributes {
      nodes {
        name
        label
      }
    }
    productOptions {
      discontinued
      newProductLink {
        target
        title
        url
      }
    }
    ACFProductAccessories {
      productAccessories {
        accessorySlug {
          ...SimpleProductFragment
          ... on WpVariableProduct {
            id
            name
            price
            onSale
            regularPrice
            salePrice
            stockQuantity
            stockStatus
            backorders
            databaseId
            slug
            type: __typename
            image {
              altText
              sourceUrl
              localFile {
                extension
                publicURL
                childImageSharp {
                  gatsbyImageData
                }
              }
            }
            ACFEcommerce {
              ecommerceAndShipping
              freeGiftWithSignup
            }
          }
          ... on WpBundleProduct {
            id
            name
            price
            onSale
            regularPrice
            salePrice
            stockQuantity
            stockStatus
            backorders
            databaseId
            slug
            type: __typename
            image {
              altText
              sourceUrl
              localFile {
                extension
                publicURL
                childImageSharp {
                  gatsbyImageData
                }
              }
            }
            ACFEcommerce {
              ecommerceAndShipping
              freeGiftWithSignup
            }
          }
        }
      }
      mustHaves {
        mustHaveProduct {
          ...SimpleProductFragment
        }
      }
    }
    ...SimpleProductFragment
    ...VariableProductFragment
    ...BundleProductFragment
    image {
      altText
      uri
      sourceUrl
      srcSet
      localFile {
        extension
        publicURL
        childImageSharp {
          gatsbyImageData
        }
      }
    }
    galleryImages {
      nodes {
        sourceUrl
        altText
        id
        srcSet
        localFile {
          extension
          publicURL
          childImageSharp {
            gatsbyImageData
          }
        }
      }
    }
    productCategories {
      nodes {
        databaseId
        termTaxonomyId
        name
        slug
        uri
      }
    }
  }

Our fragment queries for SimpleProducts are as follows:

    price
    stockStatus
    taxClass
    stockQuantity
    backorders
    onSale
    regularPrice
    salePrice
    weight
    length
    width
    height
  }

For variableProducts, we use the following fragement:

salePrice
    price
    onSale
    variations {
      nodes {
        databaseId
        slug
        name
        price
        onSale
        salePrice
        regularPrice
        taxClass
        stockStatus
        stockQuantity
        backorders
        description
        weight
        length
        width
        height
        image {
          altText
          uri
          sourceUrl
          srcSet
          localFile {
            extension
            publicURL
            childImageSharp {
              gatsbyImageData
            }
          }
        }
        attributes {
          nodes {
            name
            value
            label
          }
        }
      }
    }
  }

WooGraphQL is currently making globalAttributes available as a query, fixing a bug that previously prevented them from being used. When these are available, changes to them and the way they effect individual products.

As I understand it, most of these fields should be available by adding a Monitor to the WooCommerce save_post hook, such as the ones used in this file: https://github.com/gatsbyjs/wp-gatsby/blob/master/src/ActionMonitor/Monitors/Monitor.php

Thanks,
Craig