@shopify/cli-hydrogen 8.4.4 → 8.4.5

package/dist/assets/hydrogen/starter/CHANGELOG.md

@@ -1,5 +1,13 @@
 # skeleton
 
+## 2024.7.9
+
+### Patch Changes
+
+- Updated dependencies [[`f3363030`](https://github.com/Shopify/hydrogen/commit/f3363030a50bd24d946427e01b88ba77253a6cc9), [`bb5b0979`](https://github.com/Shopify/hydrogen/commit/bb5b0979ddffb007111885b3a9b7aa490a3c6882)]:
+  - @shopify/hydrogen@2024.7.8
+  - @shopify/remix-oxygen@2.0.8
+
 ## 2024.7.8
 
 ### Patch Changes

package/dist/assets/hydrogen/starter/app/components/Aside.tsx

@@ -1,4 +1,10 @@
-import {createContext, type ReactNode, useContext, useState} from 'react';
+import {
+  createContext,
+  type ReactNode,
+  useContext,
+  useEffect,
+  useState,
+} from 'react';
 
 type AsideType = 'search' | 'cart' | 'mobile' | 'closed';
 type AsideContextValue = {
@@ -29,6 +35,23 @@ export function Aside({
   const {type: activeType, close} = useAside();
   const expanded = type === activeType;
 
+  useEffect(() => {
+    const abortController = new AbortController();
+
+    if (expanded) {
+      document.addEventListener(
+        'keydown',
+        function handler(event: KeyboardEvent) {
+          if (event.key === 'Escape') {
+            close();
+          }
+        },
+        {signal: abortController.signal},
+      );
+    }
+    return () => abortController.abort();
+  }, [close, expanded]);
+
   return (
     <div
       aria-modal

package/dist/assets/hydrogen/starter/app/components/Header.tsx

@@ -1,6 +1,10 @@
 import {Suspense} from 'react';
-import {Await, NavLink} from '@remix-run/react';
-import {type CartViewPayload, useAnalytics} from '@shopify/hydrogen';
+import {Await, NavLink, useAsyncValue} from '@remix-run/react';
+import {
+  type CartViewPayload,
+  useAnalytics,
+  useOptimisticCart,
+} from '@shopify/hydrogen';
 import type {HeaderQuery, CartApiQueryFragment} from 'storefrontapi.generated';
 import {useAside} from '~/components/Aside';
 
@@ -159,15 +163,18 @@ function CartToggle({cart}: Pick<HeaderProps, 'cart'>) {
   return (
     <Suspense fallback={<CartBadge count={null} />}>
       <Await resolve={cart}>
-        {(cart) => {
-          if (!cart) return <CartBadge count={0} />;
-          return <CartBadge count={cart.totalQuantity || 0} />;
-        }}
+        <CartBanner />
       </Await>
     </Suspense>
   );
 }
 
+function CartBanner() {
+  const originalCart = useAsyncValue() as CartApiQueryFragment | null;
+  const cart = useOptimisticCart(originalCart);
+  return <CartBadge count={cart?.totalQuantity ?? 0} />;
+}
+
 const FALLBACK_HEADER_MENU = {
   id: 'gid://shopify/Menu/199655587896',
   items: [

package/dist/assets/hydrogen/starter/app/routes/account.orders.$id.tsx

@@ -29,7 +29,9 @@ export async function loader({params, context}: LoaderFunctionArgs) {
 
   const lineItems = flattenConnection(order.lineItems);
   const discountApplications = flattenConnection(order.discountApplications);
-  const fulfillmentStatus = flattenConnection(order.fulfillments)[0].status;
+
+  const fulfillmentStatus =
+    flattenConnection(order.fulfillments)[0]?.status ?? 'N/A';
 
   const firstDiscount = discountApplications[0]?.value;
 

package/dist/assets/hydrogen/starter/package.json

@@ -2,7 +2,7 @@
   "name": "skeleton",
   "private": true,
   "sideEffects": false,
-  "version": "2024.7.8",
+  "version": "2024.7.9",
   "type": "module",
   "scripts": {
     "build": "shopify hydrogen build --codegen",
@@ -16,8 +16,8 @@
   "dependencies": {
     "@remix-run/react": "^2.10.1",
     "@remix-run/server-runtime": "^2.10.1",
-    "@shopify/hydrogen": "2024.7.7",
-    "@shopify/remix-oxygen": "^2.0.7",
+    "@shopify/hydrogen": "2024.7.8",
+    "@shopify/remix-oxygen": "^2.0.8",
     "graphql": "^16.6.0",
     "graphql-tag": "^2.12.6",
     "isbot": "^3.8.0",

package/oclif.manifest.json

@@ -1758,5 +1758,5 @@
       ]
     }
   },
-  "version": "8.4.4"
+  "version": "8.4.5"
 }

package/package.json

@@ -4,7 +4,7 @@
     "access": "public",
     "@shopify:registry": "https://registry.npmjs.org"
   },
-  "version": "8.4.4",
+  "version": "8.4.5",
   "license": "MIT",
   "type": "module",
   "scripts": {
@@ -56,7 +56,7 @@
     "@graphql-codegen/cli": "^5.0.2",
     "@remix-run/dev": "^2.1.0",
     "@shopify/hydrogen-codegen": "^0.3.1",
-    "@shopify/mini-oxygen": "^3.0.5",
+    "@shopify/mini-oxygen": "^3.0.6",
     "graphql-config": "^5.0.3",
     "vite": "^5.1.0"
   },