---
title: v4.x to v5.x Migration Guide
slug: oms/v4x-to-v5x-migration-guide
docTags: 
createdAt: 2022-12-21T20:41:26.000Z
---

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

Upgrading to this release is advised because Shopify will stop supporting version `2022-07` of the Storefront API on July 1, 2023.

## Major Changes

These releases contain changes to the price and image objects returned by Chord SDK methods, due to underlying Shopify Storefront API changes. These changes are:

### Monetary properties

Shopify Storefront API version `2022-10` includes [a significant breaking change to monetary fields](https://shopify.dev/docs/api/release-notes/2022-10#changes-to-moneyv2-related-fields), so the monetary properties returned by the Chord SDK have been renamed to match.

As of `@chordcommerce/gatsby-theme-performance@5.0.0`, the following properties are no longer a string, but an object with properties for `amount` and `currencyCode` (ex. `{"amount": "0.0", "currencyCode": "USD" }`):&#x20;

- `variant.price`
- `checkout.totalTax`
- `checkout.subtotalPrice`
- `checkout.totalPrice`

All monetary properties that have a `V2` suffix have been renamed without the `V2` suffix. For example, `variant.compareAtPriceV2` is now `variant.compareAtPrice`. These properties are:

- `variant.priceV2`: use `variant.price` instead
- `variant.compareAtPriceV2`: use `variant.compareAtPrice` instead
- `order.subtotalPriceV2`: use `order.subtotalPrice` instead
- `order.totalPriceV2`: use `order.totalPrice` instead
- `order.totalRefundedV2`: use `order.totalRefunded` instead
- `order.totalShippingPriceV2`: use `order.totalShippingPrice` instead
- `order.totalTaxV2`: use `order.totalTax` instead
- `order.appliedGiftCards.amountUsedV2`: use `order.appliedGiftCards.amountUsed` instead
- `order.appliedGiftCards.balanceV2`: use `order.appliedGiftCards.balance` instead
- `order.shippingLine.priceV2`: use `order.shippingLine.price` instead
- `checkout.paymentDueV2`: use `checkout.paymentDue` instead
- `checkout.totalTaxV2`: use `checkout.totalTax` instead
- `checkout.subtotalPriceV2`: use `checkout.subtotalPrice` instead
- `checkout.totalPriceV2`: use `checkout.totalPrice` instead
- `giftCard.amountUsedV2`: use `giftCard.amountUsed` instead

### Image source property

Shopify Storefront API version `2022-01` [deprecated](https://shopify.dev/docs/api/release-notes/2022-01#graphql-storefront-api-changes) the `originalSrc` property of images. As of `@chordcommerce/gatsby-theme-performance@5.0.0`, the `originalSrc` property of all images has been renamed to `url`.

## Upgrade Guide

### 1. Update dependencies

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

### 2. Update monetary properties

Update code that uses the following properties to handle an object instead of a string (ex. `{"amount": "0.0", "currencyCode": "USD" }`):&#x20;

- `variant.price:` update to `variant.price.amount`
- `checkout.totalTax`: update to `checkout.totalTax.amount`
- `checkout.subtotalPrice`: update to `checkout.subtotalPrice.amount`
- `checkout.totalPrice`: update to `checkout.totalPrice.amount`

Update all monetary properties to drop the `V2` suffix. For example, update `variant.compareAtPriceV2` to `variant.compareAtPrice`.&#x20;

### 3. Update product and variant image paths

`@chordcommerce/gatsby-theme-performance@5.0.0` renames the `originalSrc` property of product and variant images to `url`. For example, this code:

```javascript
<Image src={variantImage.originalSrc} />
```

Should be replaced with this:

```javascript
<Image src={variantImage.url} />
```

### 4. Update any references to the Shopify Storefront API version

You may have references to the Shopify Storefront API version in your website code. We suggest updating all Storefront API versions to `2023-04` 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:

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

Should be replaced with this:

```javascript
const path = `https://${SHOPIFY_SUBDOMAIN}.myshopify.com/api/2023-04/graphql.json`
```

:::hint{type="warning"}
If you are querying the Storefront API without using `@chordcommerce/gatsby-theme-performance`, be sure to check for breaking changes 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](https://github.com/chordcommerce/gatsby-starter-performance/commit/cd0311164dbec4aafba05e928ddce5d56e243bf2).

