From e029cf3998674b155ad502121771935c78555466 Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" Date: Wed, 5 Jun 2024 19:13:32 +0000 Subject: [PATCH] [ci] release 2024-04 --- .changeset/clean-buckets-divide.md | 104 --------------------- .changeset/curly-olives-dream.md | 7 -- .changeset/flat-camels-dress.md | 5 -- .changeset/gorgeous-ghosts-yawn.md | 5 -- .changeset/honest-penguins-guess.md | 5 -- .changeset/large-rivers-fold.md | 5 -- .changeset/long-candles-cover.md | 22 ----- .changeset/long-emus-cry.md | 5 -- .changeset/purple-carrots-melt.md | 5 -- .changeset/quick-beers-sing.md | 5 -- .changeset/red-grapes-change.md | 5 -- .changeset/slow-colts-chew.md | 5 -- .changeset/strong-buckets-occur.md | 6 -- .changeset/thin-hairs-travel.md | 7 -- .changeset/tiny-pans-help.md | 6 -- .changeset/two-trees-hammer.md | 5 -- .changeset/unlucky-students-tan.md | 5 -- .changeset/weak-rabbits-rest.md | 5 -- .changeset/witty-camels-type.md | 5 -- .changeset/young-dolls-punch.md | 5 -- examples/express/package.json | 4 +- examples/multipass/package.json | 6 +- examples/partytown/package.json | 6 +- examples/subscriptions/package.json | 6 +- packages/cli/CHANGELOG.md | 25 ++++++ packages/cli/oclif.manifest.json | 2 +- packages/cli/package.json | 4 +- packages/create-hydrogen/CHANGELOG.md | 9 ++ packages/create-hydrogen/package.json | 4 +- packages/hydrogen-react/CHANGELOG.md | 25 ++++++ packages/hydrogen-react/package.json | 2 +- packages/hydrogen/CHANGELOG.md | 124 ++++++++++++++++++++++++++ packages/hydrogen/package.json | 4 +- packages/hydrogen/src/version.ts | 2 +- packages/mini-oxygen/CHANGELOG.md | 8 ++ packages/mini-oxygen/package.json | 2 +- templates/hello-world/package.json | 6 +- templates/skeleton/CHANGELOG.md | 14 +++ templates/skeleton/package.json | 8 +- 39 files changed, 233 insertions(+), 250 deletions(-) delete mode 100644 .changeset/clean-buckets-divide.md delete mode 100644 .changeset/curly-olives-dream.md delete mode 100644 .changeset/flat-camels-dress.md delete mode 100644 .changeset/gorgeous-ghosts-yawn.md delete mode 100644 .changeset/honest-penguins-guess.md delete mode 100644 .changeset/large-rivers-fold.md delete mode 100644 .changeset/long-candles-cover.md delete mode 100644 .changeset/long-emus-cry.md delete mode 100644 .changeset/purple-carrots-melt.md delete mode 100644 .changeset/quick-beers-sing.md delete mode 100644 .changeset/red-grapes-change.md delete mode 100644 .changeset/slow-colts-chew.md delete mode 100644 .changeset/strong-buckets-occur.md delete mode 100644 .changeset/thin-hairs-travel.md delete mode 100644 .changeset/tiny-pans-help.md delete mode 100644 .changeset/two-trees-hammer.md delete mode 100644 .changeset/unlucky-students-tan.md delete mode 100644 .changeset/weak-rabbits-rest.md delete mode 100644 .changeset/witty-camels-type.md delete mode 100644 .changeset/young-dolls-punch.md diff --git a/.changeset/clean-buckets-divide.md b/.changeset/clean-buckets-divide.md deleted file mode 100644 index 05b384d5f6..0000000000 --- a/.changeset/clean-buckets-divide.md +++ /dev/null @@ -1,104 +0,0 @@ ---- -'@shopify/hydrogen': patch ---- - -Add the `useOptimisticCart()` hook. This hook takes the cart object as a parameter, and processes all pending cart actions, locally mutating the cart with optimistic state. An optimistic cart makes cart actions immediately render in the browser while the action syncs to the server. This increases the perceived performance of the application. - -Example usage: - -```tsx -// Root loader returns the cart data -export async function loader({context}: LoaderFunctionArgs) { - return defer({ - cart: context.cart.get(), - }); -} - -// The cart component renders each line item in the cart. -export function Cart({cart}) { - if (!cart?.lines?.nodes?.length) return

Nothing in cart

; - - return cart.lines.nodes.map((line) => ( -
- - {line.merchandise.product.title} - -
- )); -} -``` - -The problem with this code is that it can feel slow. If a new item is added to the cart, it won't render until the server action completes and the client revalidates the root loader with the new cart data. - -If we update the cart implementation with a new `useOptimisticCart()` hook, Hydrogen can take the pending add to cart action, and apply it locally with the existing cart data: - -```tsx -export function Cart({cart}) { - const optimisticCart = useOptimisticCart(cart); - - if (!optimisticCart?.lines?.nodes?.length) return

Nothing in cart

; - - return optimisticCart.lines.nodes.map((line) => ( -
- - {line.merchandise.product.title} - -
- )); -} -``` - -This works automatically with the `CartForm.ACTIONS.LinesUpdate` and `CartForm.ACTIONS.LinesRemove`. To make it work with `CartForm.Actions.LinesAdd`, update the `CartForm` to include the `selectedVariant`: - -```tsx -export function ProductCard({product}) { - return ( -
-

{product.title}

- - - -
- ); -} -``` - -Sometimes line items need to render differently when they have yet to process on the server. A new isOptimistic flag is added to each line item: - -```tsx -export function Cart({cart}) { - const optimisticCart = useOptimisticCart(cart); - - if (!cart?.lines?.nodes?.length) return

Nothing in cart

; - - return optimisticCart.lines.nodes.map((line) => ( -
- - {line.merchandise.product.title} - - - - -
- )); -} -``` diff --git a/.changeset/curly-olives-dream.md b/.changeset/curly-olives-dream.md deleted file mode 100644 index 4faf853984..0000000000 --- a/.changeset/curly-olives-dream.md +++ /dev/null @@ -1,7 +0,0 @@ ---- -'skeleton': patch -'@shopify/cli-hydrogen': patch -'@shopify/create-hydrogen': patch ---- - -Update remix to v2.9.2 diff --git a/.changeset/flat-camels-dress.md b/.changeset/flat-camels-dress.md deleted file mode 100644 index 12f5bf81eb..0000000000 --- a/.changeset/flat-camels-dress.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'@shopify/hydrogen': patch ---- - -Adds type support for the script-src-elem directive for CSPs diff --git a/.changeset/gorgeous-ghosts-yawn.md b/.changeset/gorgeous-ghosts-yawn.md deleted file mode 100644 index 52ad63de82..0000000000 --- a/.changeset/gorgeous-ghosts-yawn.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'@shopify/hydrogen-react': patch ---- - -Fix shopify cookie domain setting diff --git a/.changeset/honest-penguins-guess.md b/.changeset/honest-penguins-guess.md deleted file mode 100644 index 6e6abfa0a9..0000000000 --- a/.changeset/honest-penguins-guess.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'@shopify/cli-hydrogen': patch ---- - -The CLI now tries to add optimizable dependencies to Vite's ssr.optimizeDeps.include automatically. diff --git a/.changeset/large-rivers-fold.md b/.changeset/large-rivers-fold.md deleted file mode 100644 index 789023601b..0000000000 --- a/.changeset/large-rivers-fold.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'@shopify/hydrogen': patch ---- - -Fix `storefrontRedirect` to strip trailing slashes when querying for redirects. Resolves [#2090](https://github.com/Shopify/hydrogen/issues/2090) diff --git a/.changeset/long-candles-cover.md b/.changeset/long-candles-cover.md deleted file mode 100644 index 45b0c50d6c..0000000000 --- a/.changeset/long-candles-cover.md +++ /dev/null @@ -1,22 +0,0 @@ ---- -'@shopify/hydrogen-react': patch ---- - -Add a RichText component to easily render \`rich_text_field\` metafields. Thank you @bastienrobert for the original implementation. Example usage: - -```tsx -import {RichText} from '@shopify/hydrogen-react'; - -export function MainRichText({metaFieldData}: {metaFieldData: string}) { - return ( - {node.children}

; - }, - }} - /> - ); -} -``` diff --git a/.changeset/long-emus-cry.md b/.changeset/long-emus-cry.md deleted file mode 100644 index 7f6416f831..0000000000 --- a/.changeset/long-emus-cry.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'@shopify/cli-hydrogen': patch ---- - -Fix Hydrogen upgrade notification when running the dev command. diff --git a/.changeset/purple-carrots-melt.md b/.changeset/purple-carrots-melt.md deleted file mode 100644 index 7299ea4d47..0000000000 --- a/.changeset/purple-carrots-melt.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'@shopify/mini-oxygen': patch ---- - -Update server in development when entry point (`/server.js`) changes. diff --git a/.changeset/quick-beers-sing.md b/.changeset/quick-beers-sing.md deleted file mode 100644 index 6f427cdfb0..0000000000 --- a/.changeset/quick-beers-sing.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'@shopify/hydrogen': patch ---- - -Ignore `/favicon.ico` route in Subrequest Profiler. diff --git a/.changeset/red-grapes-change.md b/.changeset/red-grapes-change.md deleted file mode 100644 index 317f8852ef..0000000000 --- a/.changeset/red-grapes-change.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'@shopify/cli-hydrogen': patch ---- - -Hide non actionable warning about ts-node. diff --git a/.changeset/slow-colts-chew.md b/.changeset/slow-colts-chew.md deleted file mode 100644 index 24b7124f16..0000000000 --- a/.changeset/slow-colts-chew.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'@shopify/cli-hydrogen': minor ---- - -Support Vite projects in `h2 debug cpu` command. diff --git a/.changeset/strong-buckets-occur.md b/.changeset/strong-buckets-occur.md deleted file mode 100644 index 87315464c4..0000000000 --- a/.changeset/strong-buckets-occur.md +++ /dev/null @@ -1,6 +0,0 @@ ---- -'@shopify/mini-oxygen': patch -'@shopify/hydrogen': patch ---- - -Improve errors when a CJS dependency needs to be added to Vite's ssr.optimizeDeps.include. diff --git a/.changeset/thin-hairs-travel.md b/.changeset/thin-hairs-travel.md deleted file mode 100644 index 5c4f954a4f..0000000000 --- a/.changeset/thin-hairs-travel.md +++ /dev/null @@ -1,7 +0,0 @@ ---- -'skeleton': patch -'@shopify/hydrogen': patch -'@shopify/cli-hydrogen': patch ---- - -`` and `useAnalytics` are now stable. diff --git a/.changeset/tiny-pans-help.md b/.changeset/tiny-pans-help.md deleted file mode 100644 index 90d4254dba..0000000000 --- a/.changeset/tiny-pans-help.md +++ /dev/null @@ -1,6 +0,0 @@ ---- -'@shopify/cli-hydrogen': minor ---- - -The `h2 preview` command now supports `--build` and `--watch` flags to preview the project using the build process instead of Vite's dev process. - \ No newline at end of file diff --git a/.changeset/two-trees-hammer.md b/.changeset/two-trees-hammer.md deleted file mode 100644 index e94bf77695..0000000000 --- a/.changeset/two-trees-hammer.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'@shopify/hydrogen': patch ---- - -Improve VariantSelector to return variant object in option values. Thank you @NabeelAhmed1721 diff --git a/.changeset/unlucky-students-tan.md b/.changeset/unlucky-students-tan.md deleted file mode 100644 index a99c009cad..0000000000 --- a/.changeset/unlucky-students-tan.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'@shopify/hydrogen': patch ---- - -Fix: Use exiting `id_token` during Customer Account API token refresh because it does not get return in the API. \ No newline at end of file diff --git a/.changeset/weak-rabbits-rest.md b/.changeset/weak-rabbits-rest.md deleted file mode 100644 index 84bf52ddcf..0000000000 --- a/.changeset/weak-rabbits-rest.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'@shopify/cli-hydrogen': patch ---- - -Updated internal CLI dependencies to `3.60.0`. diff --git a/.changeset/witty-camels-type.md b/.changeset/witty-camels-type.md deleted file mode 100644 index 0ae646384c..0000000000 --- a/.changeset/witty-camels-type.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'skeleton': patch ---- - -Update the skeleton template to use React state in the aside dialogs diff --git a/.changeset/young-dolls-punch.md b/.changeset/young-dolls-punch.md deleted file mode 100644 index aa9229bebb..0000000000 --- a/.changeset/young-dolls-punch.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'@shopify/hydrogen': patch ---- - -Fix optimizing deps when using PNPM. diff --git a/examples/express/package.json b/examples/express/package.json index e0e53eabc3..f4ce299c07 100644 --- a/examples/express/package.json +++ b/examples/express/package.json @@ -17,8 +17,8 @@ "@remix-run/react": "^2.9.2", "@remix-run/server-runtime": "^2.9.2", "@shopify/cli": "3.60.0", - "@shopify/cli-hydrogen": "^8.0.4", - "@shopify/hydrogen": "2024.4.2", + "@shopify/cli-hydrogen": "^8.1.0", + "@shopify/hydrogen": "2024.4.3", "compression": "^1.7.4", "cross-env": "^7.0.3", "express": "^4.19.2", diff --git a/examples/multipass/package.json b/examples/multipass/package.json index 92661fa899..e6e3c5ac00 100644 --- a/examples/multipass/package.json +++ b/examples/multipass/package.json @@ -14,8 +14,8 @@ "dependencies": { "@remix-run/react": "^2.9.2", "@shopify/cli": "3.60.0", - "@shopify/cli-hydrogen": "^8.0.4", - "@shopify/hydrogen": "2024.4.2", + "@shopify/cli-hydrogen": "^8.1.0", + "@shopify/hydrogen": "2024.4.3", "@shopify/remix-oxygen": "^2.0.4", "crypto-js": "^4.2.0", "graphql": "^16.6.0", @@ -28,7 +28,7 @@ "devDependencies": { "@remix-run/dev": "^2.9.2", "@remix-run/eslint-config": "^2.9.2", - "@shopify/mini-oxygen": "^3.0.2", + "@shopify/mini-oxygen": "^3.0.3", "@shopify/oxygen-workers-types": "^4.0.0", "@shopify/prettier-config": "^1.1.2", "@total-typescript/ts-reset": "^0.4.2", diff --git a/examples/partytown/package.json b/examples/partytown/package.json index f45f71a072..3daaf5f530 100644 --- a/examples/partytown/package.json +++ b/examples/partytown/package.json @@ -17,8 +17,8 @@ "@builder.io/partytown": "^0.8.1", "@remix-run/react": "^2.9.2", "@shopify/cli": "3.60.0", - "@shopify/cli-hydrogen": "^8.0.4", - "@shopify/hydrogen": "2024.4.2", + "@shopify/cli-hydrogen": "^8.1.0", + "@shopify/hydrogen": "2024.4.3", "@shopify/remix-oxygen": "^2.0.4", "graphql": "^16.6.0", "graphql-tag": "^2.12.6", @@ -29,7 +29,7 @@ "devDependencies": { "@remix-run/dev": "^2.9.2", "@remix-run/eslint-config": "^2.9.2", - "@shopify/mini-oxygen": "^3.0.2", + "@shopify/mini-oxygen": "^3.0.3", "@shopify/oxygen-workers-types": "^4.0.0", "@shopify/prettier-config": "^1.1.2", "@total-typescript/ts-reset": "^0.4.2", diff --git a/examples/subscriptions/package.json b/examples/subscriptions/package.json index 3876d9d642..9d4a1d4f2c 100644 --- a/examples/subscriptions/package.json +++ b/examples/subscriptions/package.json @@ -14,8 +14,8 @@ "dependencies": { "@remix-run/react": "^2.9.2", "@shopify/cli": "3.60.0", - "@shopify/cli-hydrogen": "^8.0.4", - "@shopify/hydrogen": "2024.4.2", + "@shopify/cli-hydrogen": "^8.1.0", + "@shopify/hydrogen": "2024.4.3", "@shopify/remix-oxygen": "^2.0.4", "graphql": "^16.6.0", "graphql-tag": "^2.12.6", @@ -26,7 +26,7 @@ "devDependencies": { "@remix-run/dev": "^2.9.2", "@remix-run/eslint-config": "^2.9.2", - "@shopify/mini-oxygen": "^3.0.2", + "@shopify/mini-oxygen": "^3.0.3", "@shopify/oxygen-workers-types": "^4.0.0", "@shopify/prettier-config": "^1.1.2", "@tailwindcss/forms": "^0.5.3", diff --git a/packages/cli/CHANGELOG.md b/packages/cli/CHANGELOG.md index 203cd90d73..e340d2f2b3 100644 --- a/packages/cli/CHANGELOG.md +++ b/packages/cli/CHANGELOG.md @@ -1,5 +1,30 @@ # @shopify/cli-hydrogen +## 8.1.0 + +### Minor Changes + +- Support Vite projects in `h2 debug cpu` command. ([#2124](https://github.com/Shopify/hydrogen/pull/2124)) by [@frandiox](https://github.com/frandiox) + +- The `h2 preview` command now supports `--build` and `--watch` flags to preview the project using the build process instead of Vite's dev process. ([#2100](https://github.com/Shopify/hydrogen/pull/2100)) by [@frandiox](https://github.com/frandiox) + +### Patch Changes + +- Update remix to v2.9.2 ([#2135](https://github.com/Shopify/hydrogen/pull/2135)) by [@michenly](https://github.com/michenly) + +- The CLI now tries to add optimizable dependencies to Vite's ssr.optimizeDeps.include automatically. ([#2106](https://github.com/Shopify/hydrogen/pull/2106)) by [@frandiox](https://github.com/frandiox) + +- Fix Hydrogen upgrade notification when running the dev command. ([#2120](https://github.com/Shopify/hydrogen/pull/2120)) by [@frandiox](https://github.com/frandiox) + +- Hide non actionable warning about ts-node. ([#2123](https://github.com/Shopify/hydrogen/pull/2123)) by [@frandiox](https://github.com/frandiox) + +- `` and `useAnalytics` are now stable. ([#2141](https://github.com/Shopify/hydrogen/pull/2141)) by [@wizardlyhel](https://github.com/wizardlyhel) + +- Updated internal CLI dependencies to `3.60.0`. ([#2087](https://github.com/Shopify/hydrogen/pull/2087)) by [@isaacroldan](https://github.com/isaacroldan) + +- Updated dependencies [[`cd888ec5`](https://github.com/Shopify/hydrogen/commit/cd888ec5ae5a0677aff7cd41962f5a44f155184e), [`27e51abf`](https://github.com/Shopify/hydrogen/commit/27e51abfc1f5444afa952c503886bfa12fc55c7e)]: + - @shopify/mini-oxygen@3.0.3 + ## 8.0.4 ### Patch Changes diff --git a/packages/cli/oclif.manifest.json b/packages/cli/oclif.manifest.json index 0b80a7eb71..c2d504cf56 100644 --- a/packages/cli/oclif.manifest.json +++ b/packages/cli/oclif.manifest.json @@ -1667,5 +1667,5 @@ ] } }, - "version": "8.0.4" + "version": "8.1.0" } \ No newline at end of file diff --git a/packages/cli/package.json b/packages/cli/package.json index 8fbcd58b72..137e256d38 100644 --- a/packages/cli/package.json +++ b/packages/cli/package.json @@ -4,7 +4,7 @@ "access": "public", "@shopify:registry": "https://registry.npmjs.org" }, - "version": "8.0.4", + "version": "8.1.0", "license": "MIT", "type": "module", "scripts": { @@ -60,7 +60,7 @@ "@graphql-codegen/cli": "^5.0.2", "@remix-run/dev": "^2.1.0", "@shopify/hydrogen-codegen": "^0.3.1", - "@shopify/mini-oxygen": "^3.0.2", + "@shopify/mini-oxygen": "^3.0.3", "graphql-config": "^5.0.3", "vite": "^5.1.0" }, diff --git a/packages/create-hydrogen/CHANGELOG.md b/packages/create-hydrogen/CHANGELOG.md index e9f46785a3..42fa0f2d20 100644 --- a/packages/create-hydrogen/CHANGELOG.md +++ b/packages/create-hydrogen/CHANGELOG.md @@ -1,5 +1,14 @@ # @shopify/create-hydrogen +## 4.3.10 + +### Patch Changes + +- Update remix to v2.9.2 ([#2135](https://github.com/Shopify/hydrogen/pull/2135)) by [@michenly](https://github.com/michenly) + +- Updated dependencies [[`32d4c33e`](https://github.com/Shopify/hydrogen/commit/32d4c33e4421a9c56f62a8c392f5417edddd0402), [`27e51abf`](https://github.com/Shopify/hydrogen/commit/27e51abfc1f5444afa952c503886bfa12fc55c7e), [`7b838beb`](https://github.com/Shopify/hydrogen/commit/7b838beb7c43380ffc9c32c2bb9f34291912fa42), [`ca4cf045`](https://github.com/Shopify/hydrogen/commit/ca4cf045f7fb72ad98b62af7bd172ff8cf553de2), [`5a554b2e`](https://github.com/Shopify/hydrogen/commit/5a554b2e9d91894c2db8032f0c29666dce1ea3f2), [`5d6465b3`](https://github.com/Shopify/hydrogen/commit/5d6465b32d90052e5580fcb81d98427bcb8ad528), [`608389d6`](https://github.com/Shopify/hydrogen/commit/608389d6d69c6a9801935d528507c165d1dd4ccf), [`65239c76`](https://github.com/Shopify/hydrogen/commit/65239c76ca1d0b294b59b1ad53624485859c4da5)]: + - @shopify/cli-hydrogen@8.1.0 + ## 4.3.9 ### Patch Changes diff --git a/packages/create-hydrogen/package.json b/packages/create-hydrogen/package.json index 442dde00fe..f7951967ab 100644 --- a/packages/create-hydrogen/package.json +++ b/packages/create-hydrogen/package.json @@ -5,7 +5,7 @@ "@shopify:registry": "https://registry.npmjs.org" }, "license": "MIT", - "version": "4.3.9", + "version": "4.3.10", "type": "module", "scripts": { "build": "tsup --clean", @@ -13,7 +13,7 @@ "typecheck": "tsc --noEmit" }, "dependencies": { - "@shopify/cli-hydrogen": "^8.0.4" + "@shopify/cli-hydrogen": "^8.1.0" }, "bin": "dist/create-app.js", "files": [ diff --git a/packages/hydrogen-react/CHANGELOG.md b/packages/hydrogen-react/CHANGELOG.md index 7660ed0bd4..66af395d8e 100644 --- a/packages/hydrogen-react/CHANGELOG.md +++ b/packages/hydrogen-react/CHANGELOG.md @@ -1,5 +1,30 @@ # @shopify/hydrogen-react +## 2024.4.3 + +### Patch Changes + +- Fix shopify cookie domain setting ([#2142](https://github.com/Shopify/hydrogen/pull/2142)) by [@wizardlyhel](https://github.com/wizardlyhel) + +- Add a RichText component to easily render \`rich_text_field\` metafields. Thank you @bastienrobert for the original implementation. Example usage: ([#2144](https://github.com/Shopify/hydrogen/pull/2144)) by [@blittle](https://github.com/blittle) + + ```tsx + import {RichText} from '@shopify/hydrogen-react'; + + export function MainRichText({metaFieldData}: {metaFieldData: string}) { + return ( + {node.children}

; + }, + }} + /> + ); + } + ``` + ## 2024.4.2 ### Patch Changes diff --git a/packages/hydrogen-react/package.json b/packages/hydrogen-react/package.json index 46ff087f6f..ad6827a913 100644 --- a/packages/hydrogen-react/package.json +++ b/packages/hydrogen-react/package.json @@ -1,6 +1,6 @@ { "name": "@shopify/hydrogen-react", - "version": "2024.4.2", + "version": "2024.4.3", "description": "React components, hooks, and utilities for creating custom Shopify storefronts", "homepage": "https://github.com/Shopify/hydrogen/tree/main/packages/hydrogen-react", "license": "MIT", diff --git a/packages/hydrogen/CHANGELOG.md b/packages/hydrogen/CHANGELOG.md index d4cb4916b7..08f1bc62aa 100644 --- a/packages/hydrogen/CHANGELOG.md +++ b/packages/hydrogen/CHANGELOG.md @@ -1,5 +1,129 @@ # @shopify/hydrogen +## 2024.4.3 + +### Patch Changes + +- Add the `useOptimisticCart()` hook. This hook takes the cart object as a parameter, and processes all pending cart actions, locally mutating the cart with optimistic state. An optimistic cart makes cart actions immediately render in the browser while the action syncs to the server. This increases the perceived performance of the application. ([#2069](https://github.com/Shopify/hydrogen/pull/2069)) by [@blittle](https://github.com/blittle) + + Example usage: + + ```tsx + // Root loader returns the cart data + export async function loader({context}: LoaderFunctionArgs) { + return defer({ + cart: context.cart.get(), + }); + } + + // The cart component renders each line item in the cart. + export function Cart({cart}) { + if (!cart?.lines?.nodes?.length) return

Nothing in cart

; + + return cart.lines.nodes.map((line) => ( +
+ + {line.merchandise.product.title} + +
+ )); + } + ``` + + The problem with this code is that it can feel slow. If a new item is added to the cart, it won't render until the server action completes and the client revalidates the root loader with the new cart data. + + If we update the cart implementation with a new `useOptimisticCart()` hook, Hydrogen can take the pending add to cart action, and apply it locally with the existing cart data: + + ```tsx + export function Cart({cart}) { + const optimisticCart = useOptimisticCart(cart); + + if (!optimisticCart?.lines?.nodes?.length) return

Nothing in cart

; + + return optimisticCart.lines.nodes.map((line) => ( +
+ + {line.merchandise.product.title} + +
+ )); + } + ``` + + This works automatically with the `CartForm.ACTIONS.LinesUpdate` and `CartForm.ACTIONS.LinesRemove`. To make it work with `CartForm.Actions.LinesAdd`, update the `CartForm` to include the `selectedVariant`: + + ```tsx + export function ProductCard({product}) { + return ( +
+

{product.title}

+ + + +
+ ); + } + ``` + + Sometimes line items need to render differently when they have yet to process on the server. A new isOptimistic flag is added to each line item: + + ```tsx + export function Cart({cart}) { + const optimisticCart = useOptimisticCart(cart); + + if (!cart?.lines?.nodes?.length) return

Nothing in cart

; + + return optimisticCart.lines.nodes.map((line) => ( +
+ + {line.merchandise.product.title} + + + + +
+ )); + } + ``` + +- Adds type support for the script-src-elem directive for CSPs ([#2105](https://github.com/Shopify/hydrogen/pull/2105)) by [@altonchaney](https://github.com/altonchaney) + +- Fix `storefrontRedirect` to strip trailing slashes when querying for redirects. Resolves [#2090](https://github.com/Shopify/hydrogen/issues/2090) ([#2110](https://github.com/Shopify/hydrogen/pull/2110)) by [@blittle](https://github.com/blittle) + +- Ignore `/favicon.ico` route in Subrequest Profiler. ([#2180](https://github.com/Shopify/hydrogen/pull/2180)) by [@frandiox](https://github.com/frandiox) + +- Improve errors when a CJS dependency needs to be added to Vite's ssr.optimizeDeps.include. ([#2106](https://github.com/Shopify/hydrogen/pull/2106)) by [@frandiox](https://github.com/frandiox) + +- `` and `useAnalytics` are now stable. ([#2141](https://github.com/Shopify/hydrogen/pull/2141)) by [@wizardlyhel](https://github.com/wizardlyhel) + +- Improve VariantSelector to return variant object in option values. Thank you @NabeelAhmed1721 by [@blittle](https://github.com/blittle) + +- Fix: Use exiting `id_token` during Customer Account API token refresh because it does not get return in the API. ([#2103](https://github.com/Shopify/hydrogen/pull/2103)) by [@juanpprieto](https://github.com/juanpprieto) + +- Fix optimizing deps when using PNPM. ([#2172](https://github.com/Shopify/hydrogen/pull/2172)) by [@frandiox](https://github.com/frandiox) + +- Updated dependencies [[`73716c88`](https://github.com/Shopify/hydrogen/commit/73716c885c75b394265b50318baefaee8518c22f), [`30d18bdb`](https://github.com/Shopify/hydrogen/commit/30d18bdb2d48020a0fb416d4661fa6794600f2ba)]: + - @shopify/hydrogen-react@2024.4.3 + ## 2024.4.2 ### Patch Changes diff --git a/packages/hydrogen/package.json b/packages/hydrogen/package.json index b26780939e..d56974f13c 100644 --- a/packages/hydrogen/package.json +++ b/packages/hydrogen/package.json @@ -5,7 +5,7 @@ "@shopify:registry": "https://registry.npmjs.org" }, "type": "module", - "version": "2024.4.2", + "version": "2024.4.3", "license": "MIT", "main": "dist/index.cjs", "module": "dist/production/index.js", @@ -63,7 +63,7 @@ "dist" ], "dependencies": { - "@shopify/hydrogen-react": "2024.4.2", + "@shopify/hydrogen-react": "2024.4.3", "content-security-policy-builder": "^2.2.0", "type-fest": "^4.5.0", "source-map-support": "^0.5.21", diff --git a/packages/hydrogen/src/version.ts b/packages/hydrogen/src/version.ts index 244f8cfd44..6d5eb62122 100644 --- a/packages/hydrogen/src/version.ts +++ b/packages/hydrogen/src/version.ts @@ -1 +1 @@ -export const LIB_VERSION = '2024.4.2'; +export const LIB_VERSION = '2024.4.3'; diff --git a/packages/mini-oxygen/CHANGELOG.md b/packages/mini-oxygen/CHANGELOG.md index 69cb3d39c0..0c8a004849 100644 --- a/packages/mini-oxygen/CHANGELOG.md +++ b/packages/mini-oxygen/CHANGELOG.md @@ -1,5 +1,13 @@ # @shopify/mini-oxygen +## 3.0.3 + +### Patch Changes + +- Update server in development when entry point (`/server.js`) changes. ([#2153](https://github.com/Shopify/hydrogen/pull/2153)) by [@frandiox](https://github.com/frandiox) + +- Improve errors when a CJS dependency needs to be added to Vite's ssr.optimizeDeps.include. ([#2106](https://github.com/Shopify/hydrogen/pull/2106)) by [@frandiox](https://github.com/frandiox) + ## 3.0.2 ### Patch Changes diff --git a/packages/mini-oxygen/package.json b/packages/mini-oxygen/package.json index a8ffcf4e64..9db8994548 100644 --- a/packages/mini-oxygen/package.json +++ b/packages/mini-oxygen/package.json @@ -4,7 +4,7 @@ "access": "public", "@shopify:registry": "https://registry.npmjs.org" }, - "version": "3.0.2", + "version": "3.0.3", "license": "MIT", "type": "module", "description": "Development assistant for custom Shopify Oxygen hosted storefronts", diff --git a/templates/hello-world/package.json b/templates/hello-world/package.json index 5efa7ab8f9..3a5a3e9782 100644 --- a/templates/hello-world/package.json +++ b/templates/hello-world/package.json @@ -16,8 +16,8 @@ "@remix-run/react": "^2.9.2", "@remix-run/server-runtime": "^2.9.2", "@shopify/cli": "3.60.0", - "@shopify/cli-hydrogen": "^8.0.4", - "@shopify/hydrogen": "2024.4.2", + "@shopify/cli-hydrogen": "^8.1.0", + "@shopify/hydrogen": "2024.4.3", "@shopify/remix-oxygen": "^2.0.4", "@total-typescript/ts-reset": "^0.4.2", "graphql": "^16.6.0", @@ -28,7 +28,7 @@ }, "devDependencies": { "@remix-run/dev": "^2.9.2", - "@shopify/mini-oxygen": "^3.0.2", + "@shopify/mini-oxygen": "^3.0.3", "@shopify/oxygen-workers-types": "^4.0.0", "@shopify/prettier-config": "^1.1.2", "@types/eslint": "^8.4.10", diff --git a/templates/skeleton/CHANGELOG.md b/templates/skeleton/CHANGELOG.md index f6a2e1bf4f..f525a06afb 100644 --- a/templates/skeleton/CHANGELOG.md +++ b/templates/skeleton/CHANGELOG.md @@ -1,5 +1,19 @@ # skeleton +## 2024.4.5 + +### Patch Changes + +- Update remix to v2.9.2 ([#2135](https://github.com/Shopify/hydrogen/pull/2135)) by [@michenly](https://github.com/michenly) + +- `` and `useAnalytics` are now stable. ([#2141](https://github.com/Shopify/hydrogen/pull/2141)) by [@wizardlyhel](https://github.com/wizardlyhel) + +- Update the skeleton template to use React state in the aside dialogs ([#2088](https://github.com/Shopify/hydrogen/pull/2088)) by [@blittle](https://github.com/blittle) + +- Updated dependencies [[`fe82119f`](https://github.com/Shopify/hydrogen/commit/fe82119f5e75df5a0f727bab6a2186e679abc73d), [`32d4c33e`](https://github.com/Shopify/hydrogen/commit/32d4c33e4421a9c56f62a8c392f5417edddd0402), [`8eea75ec`](https://github.com/Shopify/hydrogen/commit/8eea75ec5ead4de98d7d1b2baedce8511029bcae), [`27e51abf`](https://github.com/Shopify/hydrogen/commit/27e51abfc1f5444afa952c503886bfa12fc55c7e), [`f29c9085`](https://github.com/Shopify/hydrogen/commit/f29c9085eb1adbde9e01226484eba8a85b5074ed), [`7b838beb`](https://github.com/Shopify/hydrogen/commit/7b838beb7c43380ffc9c32c2bb9f34291912fa42), [`d702aec2`](https://github.com/Shopify/hydrogen/commit/d702aec2214646a78cdafc2c25d510489db73f6d), [`ca4cf045`](https://github.com/Shopify/hydrogen/commit/ca4cf045f7fb72ad98b62af7bd172ff8cf553de2), [`5a554b2e`](https://github.com/Shopify/hydrogen/commit/5a554b2e9d91894c2db8032f0c29666dce1ea3f2), [`27e51abf`](https://github.com/Shopify/hydrogen/commit/27e51abfc1f5444afa952c503886bfa12fc55c7e), [`5d6465b3`](https://github.com/Shopify/hydrogen/commit/5d6465b32d90052e5580fcb81d98427bcb8ad528), [`608389d6`](https://github.com/Shopify/hydrogen/commit/608389d6d69c6a9801935d528507c165d1dd4ccf), [`9dfd1cfe`](https://github.com/Shopify/hydrogen/commit/9dfd1cfeb3e96c6d3426427a4b5d97ef475dab6d), [`7def3e9f`](https://github.com/Shopify/hydrogen/commit/7def3e9fa6e28f4fde7af43e2f346aa32267c38e), [`65239c76`](https://github.com/Shopify/hydrogen/commit/65239c76ca1d0b294b59b1ad53624485859c4da5), [`ca7f2888`](https://github.com/Shopify/hydrogen/commit/ca7f28887367a4882e57a67c4e248b0f0bba1c9b)]: + - @shopify/hydrogen@2024.4.3 + - @shopify/cli-hydrogen@8.1.0 + ## 2024.4.4 ### Patch Changes diff --git a/templates/skeleton/package.json b/templates/skeleton/package.json index ab2f6ab5f0..605891fe71 100644 --- a/templates/skeleton/package.json +++ b/templates/skeleton/package.json @@ -2,7 +2,7 @@ "name": "skeleton", "private": true, "sideEffects": false, - "version": "2024.4.4", + "version": "2024.4.5", "type": "module", "scripts": { "build": "shopify hydrogen build --codegen", @@ -17,8 +17,8 @@ "@remix-run/react": "^2.9.2", "@remix-run/server-runtime": "^2.9.2", "@shopify/cli": "3.60.0", - "@shopify/cli-hydrogen": "^8.0.4", - "@shopify/hydrogen": "2024.4.2", + "@shopify/cli-hydrogen": "^8.1.0", + "@shopify/hydrogen": "2024.4.3", "@shopify/remix-oxygen": "^2.0.4", "graphql": "^16.6.0", "graphql-tag": "^2.12.6", @@ -31,7 +31,7 @@ "@remix-run/dev": "^2.9.2", "@remix-run/eslint-config": "^2.9.2", "@shopify/hydrogen-codegen": "^0.3.1", - "@shopify/mini-oxygen": "^3.0.2", + "@shopify/mini-oxygen": "^3.0.3", "@shopify/oxygen-workers-types": "^4.0.0", "@shopify/prettier-config": "^1.1.2", "@total-typescript/ts-reset": "^0.4.2",