Website logo
Navigate through spaces
⌘K
OVERVIEW
ORDER MANAGEMENT (OMS)
CONTENT MANAGEMENT (CMS)
DATA
CUSTOMER LIFETIME REVENUE
Customer Lifetime Revenue Explanation
Customer Lifetime Revenue and Purchase Likelihood
Recency Frequency and Monetary
CLR and RFM Data Table Glossary
RFM and CLR in the Hub
LOOKER
Modifying a Dashboard
Timestamp differences between Looker, OMS and Shopify
How to create custom calculations in Looker
Looker and Shopify data models
Custom fields
How to 'Save and Schedule' reports
Creating Custom Reports or Look
Looks vs Dashboards
Login Looker FAQ
Looker Glossary
SEGMENT EVENT TRACKING
What are event tracking
Adding Tracking
What is the Tracking Plan?
The Chord Tracking Plan
The Shopify Tracking Plan
Event Tracking FAQ
EVENT UPDATES PAGE
Email Subscription Payment Event Update
Product Feed Setup
Getting Segment to Production
Consent Management
Installing in Next.js
Installing in Gatsby
Integrations
👩‍💻Developer Tools
Using Chord with Shopify
Docs powered by Archbee
Using Chord with Shopify
...
Gatsby
Guides

v3.x to v4.x Migration Guide

8min

This major release upgrades the Shopify Storefront API version to 2022-07. Prior to this release, this theme used the oldest available version of the Storefront API.

Upgrading to this release is strongly advised because two breaking changes will impact users around January 1, 2023, when Shopify starts serving the version 2022-04 to users.

Major Changes

This release upgrades the Shopify Storefront API version to 2022-07. This Storefront API version includes two breaking changes:

  • Shopify IDs are no longer Base64 encoded.
  • presentmentPrices has been removed from the API and will cause an error if included in the GraphQL query. Shopify now supports multi-currency in a different way.

These are the only changes in this release.

Upgrade Guide

1. Update dependencies

  1. Update @chordcommerce/gatsby-theme-performance to ^4.0.0
  2. If you have @chordcommerce/product-rss-feed as a dependency, update to ^3.0.0

2. Remove Shopify ID encoding/decoding logic

As of the 2022-04 Shopify Storefront API release, Shopify IDs are no longer Base64 encoded. You may have code in your website that is encoding and/or decoding IDs. This code can be removed.

Previous versions of gatsby-starter-performance included a utility file at src/utils/shopify/index.js with two functions, encodeShopifyVariantID and decodeShopifyID. If you're using these functions in your website code, update the code as described below.

Replace this code:

JS
export const encodeShopifyVariantID = (id) =>
  Buffer.from(`gid://shopify/ProductVariant/${id}`).toString('base64')

export const decodeShopifyID = (base64Id) => {
  const shopifyId = Buffer.from(base64Id, 'base64').toString('utf-8')
  const [id] = shopifyId.split('/').reverse()
  return id
}


With this code:

JS
export const encodeShopifyVariantID = (id) =>
  `gid://shopify/ProductVariant/${id}`

export const decodeShopifyID = (shopifyId) => {
  const [id] = shopifyId.split('/').reverse()
  return id
}


3. Remove any use of the field presentmentPrices

Shopify no longer supports the deprecated field presentmentPrices.

4. Update any references to the Shopify Storefront API version

You may have references to the Shopify Storefront API version in your website code. You must update your code to use at least Storefront API version 2022-04, because that will be the oldest version that Shopify supports as of January 1, 2023.

\We suggest updating all Storefront API versions to 2022-07 for consistency. Searching your code for the Shopify Storefront API, myshopify.com/api, might be helpful. To update the version, just change the version in the Storefront API path. For example, this:

JS
const path = `https://${SHOPIFY_SUBDOMAIN}.myshopify.com/api/2021-01/graphql.json`


Should be replaced with this:

JS
const path = `https://${SHOPIFY_SUBDOMAIN}.myshopify.com/api/2022-07/graphql.json`


If you are querying the Storefront API without using

@chordcommerce/gatsby-theme-performance

, be sure to check for breaking changes in

before upgrading the Storefront API version.

Example Migration

See an example of migrating a Gatsby site by checking out how Chord migrated the Gatsby starter kit.

Updated 18 Apr 2023
Did this page help you?
PREVIOUS
v2.x to v3.x Migration Guide
NEXT
v4.x to v5.x Migration Guide
Docs powered by Archbee
TABLE OF CONTENTS
Major Changes
Upgrade Guide
1. Update dependencies
2. Remove Shopify ID encoding/decoding logic
3. Remove any use of the field presentmentPrices
4. Update any references to the Shopify Storefront API version
Example Migration
Docs powered by Archbee