@shopify/cli-hydrogen 11.0.1 → 11.1.1

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

@@ -1,5 +1,11 @@
 # skeleton
 
+## 2025.5.2
+
+### Patch Changes
+
+- Fixing the skeleton's Vite Config ([#2958](https://github.com/Shopify/hydrogen/pull/2958)) by [@balazsbajorics](https://github.com/balazsbajorics)
+
 ## 2025.5.1
 
 ### Patch Changes

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

@@ -1,8 +1,8 @@
 import type {CartApiQueryFragment} from 'storefrontapi.generated';
 import type {CartLayout} from '~/components/CartMain';
 import {CartForm, Money, type OptimisticCart} from '@shopify/hydrogen';
-import {useRef} from 'react';
-import { FetcherWithComponents } from 'react-router';
+import {useEffect, useRef} from 'react';
+import {FetcherWithComponents, useFetcher} from 'react-router';
 
 type CartSummaryProps = {
   cart: OptimisticCart<CartApiQueryFragment | null>;
@@ -55,28 +55,48 @@ function CartDiscounts({
       ?.filter((discount) => discount.applicable)
       ?.map(({code}) => code) || [];
 
+  const discountRemoveFetcher = useFetcher({key: 'discount-remove'});
+  const discountAddFetcher = useFetcher({key: 'discount-add'});
+  const discountCodeInput = useRef<HTMLInputElement>(null);
+
+  // Clear the discount code input after the discount is added
+  useEffect(() => {
+    if (discountAddFetcher.data) {
+      discountCodeInput.current!.value = '';
+    }
+  }, [discountAddFetcher.data]);
+
   return (
     <div>
       {/* Have existing discount, display it with a remove option */}
       <dl hidden={!codes.length}>
         <div>
           <dt>Discount(s)</dt>
-          <UpdateDiscountForm>
+          <UpdateDiscountForm fetcherKey="discount-remove">
             <div className="cart-discount">
               <code>{codes?.join(', ')}</code>
               &nbsp;
-              <button>Remove</button>
+              <button disabled={discountRemoveFetcher.state !== 'idle'}>
+                Remove
+              </button>
             </div>
           </UpdateDiscountForm>
         </div>
       </dl>
 
       {/* Show an input to apply a discount */}
-      <UpdateDiscountForm discountCodes={codes}>
+      <UpdateDiscountForm discountCodes={codes} fetcherKey="discount-add">
         <div>
-          <input type="text" name="discountCode" placeholder="Discount code" />
+          <input
+            type="text"
+            name="discountCode"
+            placeholder="Discount code"
+            ref={discountCodeInput}
+          />
           &nbsp;
-          <button type="submit">Apply</button>
+          <button type="submit" disabled={discountAddFetcher.state !== 'idle'}>
+            Apply
+          </button>
         </div>
       </UpdateDiscountForm>
     </div>
@@ -86,12 +106,15 @@ function CartDiscounts({
 function UpdateDiscountForm({
   discountCodes,
   children,
+  fetcherKey,
 }: {
   discountCodes?: string[];
   children: React.ReactNode;
+  fetcherKey?: string;
 }) {
   return (
     <CartForm
+      fetcherKey={fetcherKey}
       route="/cart"
       action={CartForm.ACTIONS.DiscountCodesUpdate}
       inputs={{

package/dist/assets/hydrogen/starter/app/graphql/customer-account/CustomerAddressMutations.ts

@@ -4,7 +4,8 @@ export const UPDATE_ADDRESS_MUTATION = `#graphql
     $address: CustomerAddressInput!
     $addressId: ID!
     $defaultAddress: Boolean
- ) {
+    $language: LanguageCode
+ ) @inContext(language: $language) {
     customerAddressUpdate(
       address: $address
       addressId: $addressId
@@ -25,8 +26,9 @@ export const UPDATE_ADDRESS_MUTATION = `#graphql
 // NOTE: https://shopify.dev/docs/api/customer/latest/mutations/customerAddressDelete
 export const DELETE_ADDRESS_MUTATION = `#graphql
   mutation customerAddressDelete(
-    $addressId: ID!,
-  ) {
+    $addressId: ID!
+    $language: LanguageCode
+  ) @inContext(language: $language) {
     customerAddressDelete(addressId: $addressId) {
       deletedAddressId
       userErrors {
@@ -43,7 +45,8 @@ export const CREATE_ADDRESS_MUTATION = `#graphql
   mutation customerAddressCreate(
     $address: CustomerAddressInput!
     $defaultAddress: Boolean
-  ) {
+    $language: LanguageCode
+  ) @inContext(language: $language) {
     customerAddressCreate(
       address: $address
       defaultAddress: $defaultAddress

package/dist/assets/hydrogen/starter/app/graphql/customer-account/CustomerDetailsQuery.ts

@@ -31,7 +31,7 @@ export const CUSTOMER_FRAGMENT = `#graphql
 
 // NOTE: https://shopify.dev/docs/api/customer/latest/queries/customer
 export const CUSTOMER_DETAILS_QUERY = `#graphql
-  query CustomerDetails {
+  query CustomerDetails($language: LanguageCode) @inContext(language: $language) {
     customer {
       ...Customer
     }

package/dist/assets/hydrogen/starter/app/graphql/customer-account/CustomerOrderQuery.ts

@@ -46,6 +46,7 @@ export const CUSTOMER_ORDER_QUERY = `#graphql
     id
     name
     statusPageUrl
+    fulfillmentStatus
     processedAt
     fulfillments(first: 1) {
       nodes {
@@ -77,7 +78,8 @@ export const CUSTOMER_ORDER_QUERY = `#graphql
       }
     }
   }
-  query Order($orderId: ID!) {
+  query Order($orderId: ID!, $language: LanguageCode)
+    @inContext(language: $language) {
     order(id: $orderId) {
       ... on Order {
         ...Order

package/dist/assets/hydrogen/starter/app/graphql/customer-account/CustomerOrdersQuery.ts

@@ -1,4 +1,4 @@
-// https://shopify.dev/docs/api/customer/latest/objects/Order
+// NOTE: https://shopify.dev/docs/api/customer/latest/objects/Order
 export const ORDER_ITEM_FRAGMENT = `#graphql
   fragment OrderItem on Order {
     totalPrice {
@@ -6,6 +6,7 @@ export const ORDER_ITEM_FRAGMENT = `#graphql
       currencyCode
     }
     financialStatus
+    fulfillmentStatus
     fulfillments(first: 1) {
       nodes {
         status
@@ -17,7 +18,7 @@ export const ORDER_ITEM_FRAGMENT = `#graphql
   }
 ` as const;
 
-// https://shopify.dev/docs/api/customer/latest/objects/Customer
+// NOTE: https://shopify.dev/docs/api/customer/latest/objects/Customer
 export const CUSTOMER_ORDERS_FRAGMENT = `#graphql
   fragment CustomerOrders on Customer {
     orders(
@@ -42,7 +43,7 @@ export const CUSTOMER_ORDERS_FRAGMENT = `#graphql
   ${ORDER_ITEM_FRAGMENT}
 ` as const;
 
-// https://shopify.dev/docs/api/customer/latest/queries/customer
+// NOTE: https://shopify.dev/docs/api/customer/latest/queries/customer
 export const CUSTOMER_ORDERS_QUERY = `#graphql
   ${CUSTOMER_ORDERS_FRAGMENT}
   query CustomerOrders(
@@ -50,7 +51,8 @@ export const CUSTOMER_ORDERS_QUERY = `#graphql
     $first: Int
     $last: Int
     $startCursor: String
-  ) {
+    $language: LanguageCode
+  ) @inContext(language: $language) {
     customer {
       ...CustomerOrders
     }

package/dist/assets/hydrogen/starter/app/graphql/customer-account/CustomerUpdateMutation.ts

@@ -1,8 +1,9 @@
+// NOTE: https://shopify.dev/docs/api/customer/latest/mutations/customerUpdate
 export const CUSTOMER_UPDATE_MUTATION = `#graphql
-  # https://shopify.dev/docs/api/customer/latest/mutations/customerUpdate
   mutation customerUpdate(
     $customer: CustomerUpdateInput!
-  ){
+    $language: LanguageCode
+  ) @inContext(language: $language) {
     customerUpdate(input: $customer) {
       customer {
         firstName

package/dist/assets/hydrogen/starter/app/routes/account.addresses.tsx

@@ -42,7 +42,8 @@ export async function loader({context}: LoaderFunctionArgs) {
 }
 
 export async function action({request, context}: ActionFunctionArgs) {
-  const {customerAccount} = context;
+  const {customerAccount, storefront} = context;
+  const {i18n} = storefront;
 
   try {
     const form = await request.formData();
@@ -96,7 +97,11 @@ export async function action({request, context}: ActionFunctionArgs) {
           const {data, errors} = await customerAccount.mutate(
             CREATE_ADDRESS_MUTATION,
             {
-              variables: {address, defaultAddress},
+              variables: {
+                address,
+                defaultAddress,
+                language: i18n.language,
+              },
             },
           );
 
@@ -145,6 +150,7 @@ export async function action({request, context}: ActionFunctionArgs) {
                 address,
                 addressId: decodeURIComponent(addressId),
                 defaultAddress,
+                language: i18n.language,
               },
             },
           );
@@ -190,7 +196,10 @@ export async function action({request, context}: ActionFunctionArgs) {
           const {data, errors} = await customerAccount.mutate(
             DELETE_ADDRESS_MUTATION,
             {
-              variables: {addressId: decodeURIComponent(addressId)},
+              variables: {
+                addressId: decodeURIComponent(addressId),
+                language: i18n.language,
+              },
             },
           );
 

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

@@ -17,7 +17,10 @@ export async function loader({params, context}: LoaderFunctionArgs) {
   const {data, errors} = await context.customerAccount.query(
     CUSTOMER_ORDER_QUERY,
     {
-      variables: {orderId},
+      variables: {
+        orderId,
+        language: context.storefront.i18n.language,
+      },
     },
   );
 

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

@@ -26,6 +26,7 @@ export async function loader({request, context}: LoaderFunctionArgs) {
     {
       variables: {
         ...paginationVariables,
+        language: context.storefront.i18n.language,
       },
     },
   );

package/dist/assets/hydrogen/starter/app/routes/account.profile.tsx

@@ -50,6 +50,7 @@ export async function action({request, context}: ActionFunctionArgs) {
       {
         variables: {
           customer,
+          language: context.storefront.i18n.language,
         },
       },
     );

package/dist/assets/hydrogen/starter/app/routes/account.tsx

@@ -1,3 +1,4 @@
+
 import {data as remixData, type LoaderFunctionArgs} from '@shopify/remix-oxygen';
 import { Form, NavLink, Outlet, useLoaderData } from 'react-router';
 import {CUSTOMER_DETAILS_QUERY} from '~/graphql/customer-account/CustomerDetailsQuery';
@@ -9,6 +10,11 @@ export function shouldRevalidate() {
 export async function loader({context}: LoaderFunctionArgs) {
   const {data, errors} = await context.customerAccount.query(
     CUSTOMER_DETAILS_QUERY,
+    {
+      variables: {
+        language: context.storefront.i18n.language,
+      },
+    },
   );
 
   if (errors?.length || !data?.customer) {

package/dist/assets/hydrogen/starter/app/routes/cart.tsx

@@ -1,4 +1,4 @@
-import { type MetaFunction, useLoaderData } from 'react-router';
+import {type MetaFunction, useLoaderData} from 'react-router';
 import type {CartQueryDataReturn} from '@shopify/hydrogen';
 import {CartForm} from '@shopify/hydrogen';
 import {

package/dist/assets/hydrogen/starter/customer-accountapi.generated.d.ts

@@ -9,6 +9,7 @@ export type CustomerAddressUpdateMutationVariables = CustomerAccountAPI.Exact<{
   defaultAddress?: CustomerAccountAPI.InputMaybe<
     CustomerAccountAPI.Scalars['Boolean']['input']
   >;
+  language?: CustomerAccountAPI.InputMaybe<CustomerAccountAPI.LanguageCode>;
 }>;
 
 export type CustomerAddressUpdateMutation = {
@@ -27,6 +28,7 @@ export type CustomerAddressUpdateMutation = {
 
 export type CustomerAddressDeleteMutationVariables = CustomerAccountAPI.Exact<{
   addressId: CustomerAccountAPI.Scalars['ID']['input'];
+  language?: CustomerAccountAPI.InputMaybe<CustomerAccountAPI.LanguageCode>;
 }>;
 
 export type CustomerAddressDeleteMutation = {
@@ -50,6 +52,7 @@ export type CustomerAddressCreateMutationVariables = CustomerAccountAPI.Exact<{
   defaultAddress?: CustomerAccountAPI.InputMaybe<
     CustomerAccountAPI.Scalars['Boolean']['input']
   >;
+  language?: CustomerAccountAPI.InputMaybe<CustomerAccountAPI.LanguageCode>;
 }>;
 
 export type CustomerAddressCreateMutation = {
@@ -125,7 +128,7 @@ export type AddressFragment = Pick<
 >;
 
 export type CustomerDetailsQueryVariables = CustomerAccountAPI.Exact<{
-  [key: string]: never;
+  language?: CustomerAccountAPI.InputMaybe<CustomerAccountAPI.LanguageCode>;
 }>;
 
 export type CustomerDetailsQuery = {
@@ -224,7 +227,7 @@ export type OrderLineItemFullFragment = Pick<
 
 export type OrderFragment = Pick<
   CustomerAccountAPI.Order,
-  'id' | 'name' | 'statusPageUrl' | 'processedAt'
+  'id' | 'name' | 'statusPageUrl' | 'fulfillmentStatus' | 'processedAt'
 > & {
   fulfillments: {nodes: Array<Pick<CustomerAccountAPI.Fulfillment, 'status'>>};
   totalTax?: CustomerAccountAPI.Maybe<
@@ -296,13 +299,14 @@ export type OrderFragment = Pick<
 
 export type OrderQueryVariables = CustomerAccountAPI.Exact<{
   orderId: CustomerAccountAPI.Scalars['ID']['input'];
+  language?: CustomerAccountAPI.InputMaybe<CustomerAccountAPI.LanguageCode>;
 }>;
 
 export type OrderQuery = {
   order?: CustomerAccountAPI.Maybe<
     Pick<
       CustomerAccountAPI.Order,
-      'id' | 'name' | 'statusPageUrl' | 'processedAt'
+      'id' | 'name' | 'statusPageUrl' | 'fulfillmentStatus' | 'processedAt'
     > & {
       fulfillments: {
         nodes: Array<Pick<CustomerAccountAPI.Fulfillment, 'status'>>;
@@ -378,7 +382,7 @@ export type OrderQuery = {
 
 export type OrderItemFragment = Pick<
   CustomerAccountAPI.Order,
-  'financialStatus' | 'id' | 'number' | 'processedAt'
+  'financialStatus' | 'fulfillmentStatus' | 'id' | 'number' | 'processedAt'
 > & {
   totalPrice: Pick<CustomerAccountAPI.MoneyV2, 'amount' | 'currencyCode'>;
   fulfillments: {nodes: Array<Pick<CustomerAccountAPI.Fulfillment, 'status'>>};
@@ -389,7 +393,11 @@ export type CustomerOrdersFragment = {
     nodes: Array<
       Pick<
         CustomerAccountAPI.Order,
-        'financialStatus' | 'id' | 'number' | 'processedAt'
+        | 'financialStatus'
+        | 'fulfillmentStatus'
+        | 'id'
+        | 'number'
+        | 'processedAt'
       > & {
         totalPrice: Pick<CustomerAccountAPI.MoneyV2, 'amount' | 'currencyCode'>;
         fulfillments: {
@@ -417,6 +425,7 @@ export type CustomerOrdersQueryVariables = CustomerAccountAPI.Exact<{
   startCursor?: CustomerAccountAPI.InputMaybe<
     CustomerAccountAPI.Scalars['String']['input']
   >;
+  language?: CustomerAccountAPI.InputMaybe<CustomerAccountAPI.LanguageCode>;
 }>;
 
 export type CustomerOrdersQuery = {
@@ -425,7 +434,11 @@ export type CustomerOrdersQuery = {
       nodes: Array<
         Pick<
           CustomerAccountAPI.Order,
-          'financialStatus' | 'id' | 'number' | 'processedAt'
+          | 'financialStatus'
+          | 'fulfillmentStatus'
+          | 'id'
+          | 'number'
+          | 'processedAt'
         > & {
           totalPrice: Pick<
             CustomerAccountAPI.MoneyV2,
@@ -446,6 +459,7 @@ export type CustomerOrdersQuery = {
 
 export type CustomerUpdateMutationVariables = CustomerAccountAPI.Exact<{
   customer: CustomerAccountAPI.CustomerUpdateInput;
+  language?: CustomerAccountAPI.InputMaybe<CustomerAccountAPI.LanguageCode>;
 }>;
 
 export type CustomerUpdateMutation = {
@@ -470,34 +484,34 @@ export type CustomerUpdateMutation = {
 };
 
 interface GeneratedQueryTypes {
-  '#graphql\n  query CustomerDetails {\n    customer {\n      ...Customer\n    }\n  }\n  #graphql\n  fragment Customer on Customer {\n    id\n    firstName\n    lastName\n    defaultAddress {\n      ...Address\n    }\n    addresses(first: 6) {\n      nodes {\n        ...Address\n      }\n    }\n  }\n  fragment Address on CustomerAddress {\n    id\n    formatted\n    firstName\n    lastName\n    company\n    address1\n    address2\n    territoryCode\n    zoneCode\n    city\n    zip\n    phoneNumber\n  }\n\n': {
+  '#graphql\n  query CustomerDetails($language: LanguageCode) @inContext(language: $language) {\n    customer {\n      ...Customer\n    }\n  }\n  #graphql\n  fragment Customer on Customer {\n    id\n    firstName\n    lastName\n    defaultAddress {\n      ...Address\n    }\n    addresses(first: 6) {\n      nodes {\n        ...Address\n      }\n    }\n  }\n  fragment Address on CustomerAddress {\n    id\n    formatted\n    firstName\n    lastName\n    company\n    address1\n    address2\n    territoryCode\n    zoneCode\n    city\n    zip\n    phoneNumber\n  }\n\n': {
     return: CustomerDetailsQuery;
     variables: CustomerDetailsQueryVariables;
   };
-  '#graphql\n  fragment OrderMoney on MoneyV2 {\n    amount\n    currencyCode\n  }\n  fragment DiscountApplication on DiscountApplication {\n    value {\n      __typename\n      ... on MoneyV2 {\n        ...OrderMoney\n      }\n      ... on PricingPercentageValue {\n        percentage\n      }\n    }\n  }\n  fragment OrderLineItemFull on LineItem {\n    id\n    title\n    quantity\n    price {\n      ...OrderMoney\n    }\n    discountAllocations {\n      allocatedAmount {\n        ...OrderMoney\n      }\n      discountApplication {\n        ...DiscountApplication\n      }\n    }\n    totalDiscount {\n      ...OrderMoney\n    }\n    image {\n      altText\n      height\n      url\n      id\n      width\n    }\n    variantTitle\n  }\n  fragment Order on Order {\n    id\n    name\n    statusPageUrl\n    processedAt\n    fulfillments(first: 1) {\n      nodes {\n        status\n      }\n    }\n    totalTax {\n      ...OrderMoney\n    }\n    totalPrice {\n      ...OrderMoney\n    }\n    subtotal {\n      ...OrderMoney\n    }\n    shippingAddress {\n      name\n      formatted(withName: true)\n      formattedArea\n    }\n    discountApplications(first: 100) {\n      nodes {\n        ...DiscountApplication\n      }\n    }\n    lineItems(first: 100) {\n      nodes {\n        ...OrderLineItemFull\n      }\n    }\n  }\n  query Order($orderId: ID!) {\n    order(id: $orderId) {\n      ... on Order {\n        ...Order\n      }\n    }\n  }\n': {
+  '#graphql\n  fragment OrderMoney on MoneyV2 {\n    amount\n    currencyCode\n  }\n  fragment DiscountApplication on DiscountApplication {\n    value {\n      __typename\n      ... on MoneyV2 {\n        ...OrderMoney\n      }\n      ... on PricingPercentageValue {\n        percentage\n      }\n    }\n  }\n  fragment OrderLineItemFull on LineItem {\n    id\n    title\n    quantity\n    price {\n      ...OrderMoney\n    }\n    discountAllocations {\n      allocatedAmount {\n        ...OrderMoney\n      }\n      discountApplication {\n        ...DiscountApplication\n      }\n    }\n    totalDiscount {\n      ...OrderMoney\n    }\n    image {\n      altText\n      height\n      url\n      id\n      width\n    }\n    variantTitle\n  }\n  fragment Order on Order {\n    id\n    name\n    statusPageUrl\n    fulfillmentStatus\n    processedAt\n    fulfillments(first: 1) {\n      nodes {\n        status\n      }\n    }\n    totalTax {\n      ...OrderMoney\n    }\n    totalPrice {\n      ...OrderMoney\n    }\n    subtotal {\n      ...OrderMoney\n    }\n    shippingAddress {\n      name\n      formatted(withName: true)\n      formattedArea\n    }\n    discountApplications(first: 100) {\n      nodes {\n        ...DiscountApplication\n      }\n    }\n    lineItems(first: 100) {\n      nodes {\n        ...OrderLineItemFull\n      }\n    }\n  }\n  query Order($orderId: ID!, $language: LanguageCode)\n    @inContext(language: $language) {\n    order(id: $orderId) {\n      ... on Order {\n        ...Order\n      }\n    }\n  }\n': {
     return: OrderQuery;
     variables: OrderQueryVariables;
   };
-  '#graphql\n  #graphql\n  fragment CustomerOrders on Customer {\n    orders(\n      sortKey: PROCESSED_AT,\n      reverse: true,\n      first: $first,\n      last: $last,\n      before: $startCursor,\n      after: $endCursor\n    ) {\n      nodes {\n        ...OrderItem\n      }\n      pageInfo {\n        hasPreviousPage\n        hasNextPage\n        endCursor\n        startCursor\n      }\n    }\n  }\n  #graphql\n  fragment OrderItem on Order {\n    totalPrice {\n      amount\n      currencyCode\n    }\n    financialStatus\n    fulfillments(first: 1) {\n      nodes {\n        status\n      }\n    }\n    id\n    number\n    processedAt\n  }\n\n\n  query CustomerOrders(\n    $endCursor: String\n    $first: Int\n    $last: Int\n    $startCursor: String\n  ) {\n    customer {\n      ...CustomerOrders\n    }\n  }\n': {
+  '#graphql\n  #graphql\n  fragment CustomerOrders on Customer {\n    orders(\n      sortKey: PROCESSED_AT,\n      reverse: true,\n      first: $first,\n      last: $last,\n      before: $startCursor,\n      after: $endCursor\n    ) {\n      nodes {\n        ...OrderItem\n      }\n      pageInfo {\n        hasPreviousPage\n        hasNextPage\n        endCursor\n        startCursor\n      }\n    }\n  }\n  #graphql\n  fragment OrderItem on Order {\n    totalPrice {\n      amount\n      currencyCode\n    }\n    financialStatus\n    fulfillmentStatus\n    fulfillments(first: 1) {\n      nodes {\n        status\n      }\n    }\n    id\n    number\n    processedAt\n  }\n\n\n  query CustomerOrders(\n    $endCursor: String\n    $first: Int\n    $last: Int\n    $startCursor: String\n    $language: LanguageCode\n  ) @inContext(language: $language) {\n    customer {\n      ...CustomerOrders\n    }\n  }\n': {
     return: CustomerOrdersQuery;
     variables: CustomerOrdersQueryVariables;
   };
 }
 
 interface GeneratedMutationTypes {
-  '#graphql\n  mutation customerAddressUpdate(\n    $address: CustomerAddressInput!\n    $addressId: ID!\n    $defaultAddress: Boolean\n ) {\n    customerAddressUpdate(\n      address: $address\n      addressId: $addressId\n      defaultAddress: $defaultAddress\n    ) {\n      customerAddress {\n        id\n      }\n      userErrors {\n        code\n        field\n        message\n      }\n    }\n  }\n': {
+  '#graphql\n  mutation customerAddressUpdate(\n    $address: CustomerAddressInput!\n    $addressId: ID!\n    $defaultAddress: Boolean\n    $language: LanguageCode\n ) @inContext(language: $language) {\n    customerAddressUpdate(\n      address: $address\n      addressId: $addressId\n      defaultAddress: $defaultAddress\n    ) {\n      customerAddress {\n        id\n      }\n      userErrors {\n        code\n        field\n        message\n      }\n    }\n  }\n': {
     return: CustomerAddressUpdateMutation;
     variables: CustomerAddressUpdateMutationVariables;
   };
-  '#graphql\n  mutation customerAddressDelete(\n    $addressId: ID!,\n  ) {\n    customerAddressDelete(addressId: $addressId) {\n      deletedAddressId\n      userErrors {\n        code\n        field\n        message\n      }\n    }\n  }\n': {
+  '#graphql\n  mutation customerAddressDelete(\n    $addressId: ID!\n    $language: LanguageCode\n  ) @inContext(language: $language) {\n    customerAddressDelete(addressId: $addressId) {\n      deletedAddressId\n      userErrors {\n        code\n        field\n        message\n      }\n    }\n  }\n': {
     return: CustomerAddressDeleteMutation;
     variables: CustomerAddressDeleteMutationVariables;
   };
-  '#graphql\n  mutation customerAddressCreate(\n    $address: CustomerAddressInput!\n    $defaultAddress: Boolean\n  ) {\n    customerAddressCreate(\n      address: $address\n      defaultAddress: $defaultAddress\n    ) {\n      customerAddress {\n        id\n      }\n      userErrors {\n        code\n        field\n        message\n      }\n    }\n  }\n': {
+  '#graphql\n  mutation customerAddressCreate(\n    $address: CustomerAddressInput!\n    $defaultAddress: Boolean\n    $language: LanguageCode\n  ) @inContext(language: $language) {\n    customerAddressCreate(\n      address: $address\n      defaultAddress: $defaultAddress\n    ) {\n      customerAddress {\n        id\n      }\n      userErrors {\n        code\n        field\n        message\n      }\n    }\n  }\n': {
     return: CustomerAddressCreateMutation;
     variables: CustomerAddressCreateMutationVariables;
   };
-  '#graphql\n  # https://shopify.dev/docs/api/customer/latest/mutations/customerUpdate\n  mutation customerUpdate(\n    $customer: CustomerUpdateInput!\n  ){\n    customerUpdate(input: $customer) {\n      customer {\n        firstName\n        lastName\n        emailAddress {\n          emailAddress\n        }\n        phoneNumber {\n          phoneNumber\n        }\n      }\n      userErrors {\n        code\n        field\n        message\n      }\n    }\n  }\n': {
+  '#graphql\n  mutation customerUpdate(\n    $customer: CustomerUpdateInput!\n    $language: LanguageCode\n  ) @inContext(language: $language) {\n    customerUpdate(input: $customer) {\n      customer {\n        firstName\n        lastName\n        emailAddress {\n          emailAddress\n        }\n        phoneNumber {\n          phoneNumber\n        }\n      }\n      userErrors {\n        code\n        field\n        message\n      }\n    }\n  }\n': {
     return: CustomerUpdateMutation;
     variables: CustomerUpdateMutationVariables;
   };

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

@@ -2,7 +2,7 @@
   "name": "skeleton",
   "private": true,
   "sideEffects": false,
-  "version": "2025.5.1",
+  "version": "2025.5.2",
   "type": "module",
   "scripts": {
     "build": "shopify hydrogen build --codegen",
@@ -21,8 +21,8 @@
     "isbot": "^5.1.22",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
-    "react-router": "7.6.0",
-    "react-router-dom": "7.6.0"
+    "react-router": "^7.6.0",
+    "react-router-dom": "^7.6.0"
   },
   "devDependencies": {
     "@eslint/compat": "^1.2.5",
@@ -60,4 +60,4 @@
   "engines": {
     "node": ">=18.0.0"
   }
-}
+}

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

@@ -1,10 +1,20 @@
 {
   "include": [
-    "./**/*.d.ts",
-    "./**/*.ts",
-    "./**/*.tsx",
+    "env.d.ts",
+    "app/**/*.ts",
+    "app/**/*.tsx",
+    "app/**/*.d.ts",
+    "*.ts",
+    "*.tsx",
+    "*.d.ts",
     ".react-router/types/**/*"
   ],
+  "exclude": [
+    "node_modules",
+    "dist",
+    "build",
+    "packages/**/dist/**/*"
+  ],
   "compilerOptions": {
     "lib": [
       "DOM",

package/dist/assets/hydrogen/starter/vite.config.ts

@@ -23,7 +23,7 @@ export default defineConfig({
        * Include 'example-dep' in the array below.
        * @see https://vitejs.dev/config/dep-optimization-options
        */
-      include: [],
+      include: ['set-cookie-parser', 'cookie', 'react-router'],
     },
   },
 });

package/dist/commands/hydrogen/deploy.js

@@ -7,7 +7,7 @@ import { AbortError } from '@shopify/cli-kit/node/error';
 import { writeFile } from '@shopify/cli-kit/node/fs';
 import { ensureIsClean, getLatestGitCommit, GitDirectoryNotCleanError } from '@shopify/cli-kit/node/git';
 import { resolvePath, relativePath } from '@shopify/cli-kit/node/path';
-import { renderWarning, renderSelectPrompt, renderConfirmationPrompt, renderSuccess, renderTasks } from '@shopify/cli-kit/node/ui';
+import { renderWarning, renderSelectPrompt, renderConfirmationPrompt, renderInfo, renderSuccess, renderTasks } from '@shopify/cli-kit/node/ui';
 import { ciPlatform } from '@shopify/cli-kit/node/context/local';
 import { parseToken, createDeploy } from '@shopify/oxygen-cli/deploy';
 import { createRequire } from 'node:module';
@@ -109,7 +109,11 @@ class Deploy extends Command {
       env: "SHOPIFY_HYDROGEN_FLAG_METADATA_VERSION",
       hidden: true
     }),
-    ...commonFlags.diff
+    ...commonFlags.diff,
+    "force-client-sourcemap": Flags.boolean({
+      description: "Client sourcemapping is avoided by default because it makes backend code visible in the browser. Use this flag to force enabling it.",
+      env: "SHOPIFY_HYDROGEN_FLAG_FORCE_CLIENT_SOURCEMAP"
+    })
   };
   async run() {
     const { flags } = await this.parse(Deploy);
@@ -160,6 +164,7 @@ async function runDeploy(options) {
     envBranch,
     environmentFile,
     force: forceOnUncommitedChanges,
+    forceClientSourcemap = false,
     noVerify,
     lockfileCheck,
     jsonOutput,
@@ -434,6 +439,13 @@ Continue?`.value
     }
   };
   if (buildCommand) {
+    if (forceClientSourcemap) {
+      console.log("");
+      renderInfo({
+        headline: "The `--force-client-sourcemap` flag is not supported with a custom build command",
+        body: "Client sourcemaps will not be generated."
+      });
+    }
     config.buildCommand = buildCommand;
   } else {
     hooks.buildFunction = async (assetPath) => {
@@ -448,6 +460,7 @@ Continue?`.value
         assetPath,
         lockfileCheck,
         sourcemap: true,
+        forceClientSourcemap,
         useCodegen: false,
         entry: ssrEntry
       });

package/dist/commands/hydrogen/upgrade.js

@@ -6,7 +6,8 @@ import { ensureInsideGitDirectory, isClean } from '@shopify/cli-kit/node/git';
 import Command from '@shopify/cli-kit/node/base-command';
 import { renderSuccess, renderInfo, renderConfirmationPrompt, renderTasks, renderSelectPrompt, renderWarning } from '@shopify/cli-kit/node/ui';
 import { readFile, isDirectory, mkdir, fileExists, touchFile, removeFile, writeFile } from '@shopify/cli-kit/node/fs';
-import { installNodeModules, getPackageManager, getDependencies } from '@shopify/cli-kit/node/node-package-manager';
+import { getPackageManager, getDependencies, installNodeModules } from '@shopify/cli-kit/node/node-package-manager';
+import { exec } from '@shopify/cli-kit/node/system';
 import { AbortError } from '@shopify/cli-kit/node/error';
 import { resolvePath, joinPath, dirname } from '@shopify/cli-kit/node/path';
 import { getCliCommand } from '../../lib/shell.js';
@@ -155,11 +156,25 @@ async function getHydrogenVersion({ appPath }) {
 }
 async function getChangelog() {
   if (CACHED_CHANGELOG) return CACHED_CHANGELOG;
-  if (isHydrogenMonorepo && hydrogenPackagesPath && process.env.FORCE_CHANGELOG_SOURCE !== "remote") {
+  if (process.env.FORCE_CHANGELOG_SOURCE === "local" || isHydrogenMonorepo && hydrogenPackagesPath && process.env.FORCE_CHANGELOG_SOURCE !== "remote") {
     const require2 = createRequire(import.meta.url);
-    return require2(
-      joinPath(dirname(hydrogenPackagesPath), "docs", "changelog.json")
-    );
+    const localChangelogPath = isHydrogenMonorepo && hydrogenPackagesPath ? joinPath(dirname(hydrogenPackagesPath), "docs", "changelog.json") : joinPath(process.cwd(), "docs", "changelog.json");
+    try {
+      const changelog = require2(localChangelogPath);
+      CACHED_CHANGELOG = changelog;
+      return changelog;
+    } catch (error) {
+      console.warn(
+        `Failed to load local changelog from ${localChangelogPath}:`,
+        error.message
+      );
+      if (process.env.FORCE_CHANGELOG_SOURCE === "local") {
+        throw new AbortError(
+          "Failed to load local changelog",
+          `Could not read changelog from ${localChangelogPath}`
+        );
+      }
+    }
   }
   try {
     const response = await fetch("https://hydrogen.shopify.dev/changelog.json");
@@ -394,8 +409,8 @@ function buildUpgradeCommandArgs({
   const selectedReactRouter = Object.entries(selectedRelease.dependencies).find(
     isReactRouterDependency
   );
-  if (currentReactRouter && selectedReactRouter) {
-    const shouldUpgradeReactRouter = semver.lt(
+  if (selectedReactRouter) {
+    const shouldUpgradeReactRouter = !currentReactRouter || semver.lt(
       getAbsoluteVersion(currentReactRouter[1]),
       getAbsoluteVersion(selectedReactRouter[1])
     );
@@ -415,24 +430,52 @@ async function upgradeNodeModules({
   selectedRelease,
   currentDependencies
 }) {
-  await renderTasks(
-    [
-      {
-        title: `Upgrading dependencies`,
-        task: async () => {
-          await installNodeModules({
-            directory: appPath,
-            packageManager: await getPackageManager(appPath),
-            args: buildUpgradeCommandArgs({
-              selectedRelease,
-              currentDependencies
-            })
-          });
-        }
+  const tasks = [];
+  const depsToRemove = [
+    ...selectedRelease.removeDependencies || [],
+    ...selectedRelease.removeDevDependencies || []
+  ].filter((dep) => dep in currentDependencies);
+  if (depsToRemove.length > 0) {
+    tasks.push({
+      title: `Removing deprecated dependencies`,
+      task: async () => {
+        await uninstallNodeModules({
+          directory: appPath,
+          packageManager: await getPackageManager(appPath),
+          args: depsToRemove
+        });
       }
-    ],
-    {}
-  );
+    });
+  }
+  const upgradeArgs = buildUpgradeCommandArgs({
+    selectedRelease,
+    currentDependencies
+  });
+  if (upgradeArgs.length > 0) {
+    tasks.push({
+      title: `Upgrading dependencies`,
+      task: async () => {
+        await installNodeModules({
+          directory: appPath,
+          packageManager: await getPackageManager(appPath),
+          args: upgradeArgs
+        });
+      }
+    });
+  }
+  if (tasks.length > 0) {
+    await renderTasks(tasks, {});
+  }
+}
+async function uninstallNodeModules({
+  directory,
+  packageManager,
+  args
+}) {
+  if (args.length === 0) return;
+  const command = packageManager === "npm" ? "uninstall" : packageManager === "yarn" ? "remove" : packageManager === "pnpm" ? "remove" : packageManager === "bun" ? "remove" : "uninstall";
+  const actualPackageManager = packageManager === "unknown" ? "npm" : packageManager;
+  await exec(actualPackageManager, [command, ...args], { cwd: directory });
 }
 function appendRemixDependencies({
   currentDependencies,
@@ -453,12 +496,15 @@ function appendReactRouterDependencies({
   selectedReactRouter
 }) {
   const command = [];
-  for (const [name, version] of Object.entries(currentDependencies)) {
-    const isReactRouterPackage = isReactRouterDependency([name, version]);
-    if (!isReactRouterPackage) {
-      continue;
-    }
-    command.push(`${name}@${getAbsoluteVersion(selectedReactRouter[1])}`);
+  const targetVersion = getAbsoluteVersion(selectedReactRouter[1]);
+  const reactRouterPackages = [
+    "react-router",
+    "react-router-dom",
+    "@react-router/dev",
+    "@react-router/fs-routes"
+  ];
+  for (const packageName of reactRouterPackages) {
+    command.push(`${packageName}@${targetVersion}`);
   }
   return command;
 }

package/dist/lib/build.js

@@ -55,6 +55,9 @@ function getSkeletonSourceDir() {
   }
   return joinPath(dirname(monorepoPackagesPath), "templates", "skeleton");
 }
+function getSkeletonNodeModules() {
+  return joinPath(getSkeletonSourceDir(), "node_modules");
+}
 async function getRepoNodeModules() {
   const { stdout } = await execAsync("npm root");
   let nodeModulesPath = stdout.trim();
@@ -64,4 +67,4 @@ async function getRepoNodeModules() {
   return nodeModulesPath;
 }
 
-export { ASSETS_DIR_PREFIX, ASSETS_STARTER_DIR, ASSETS_STARTER_DIR_ROUTES, getAssetsDir, getPkgJsonPath, getRepoNodeModules, getSkeletonSourceDir, getStarterDir, getTemplateAppFile, hydrogenPackagesPath, isHydrogenMonorepo };
+export { ASSETS_DIR_PREFIX, ASSETS_STARTER_DIR, ASSETS_STARTER_DIR_ROUTES, getAssetsDir, getPkgJsonPath, getRepoNodeModules, getSkeletonNodeModules, getSkeletonSourceDir, getStarterDir, getTemplateAppFile, hydrogenPackagesPath, isHydrogenMonorepo };

package/dist/lib/import-utils.js

@@ -10,7 +10,10 @@ async function importVite(root) {
     process.env.SHOPIFY_UNIT_TEST ? void 0 : { paths: [root] }
   );
   const vitePackageJson = await findUpAndReadPackageJson(vitePath);
-  let viteNodeIndexFile = vitePackageJson.content.exports?.["."].import;
+  let viteNodeIndexFile = vitePackageJson.content.exports?.["."];
+  if (typeof viteNodeIndexFile !== "string") {
+    viteNodeIndexFile = viteNodeIndexFile?.import;
+  }
   if (typeof viteNodeIndexFile !== "string") {
     viteNodeIndexFile = viteNodeIndexFile.default;
   }

package/dist/lib/onboarding/setup-template.mocks.js

@@ -2,7 +2,7 @@ import { rm, symlink } from 'node:fs/promises';
 import { vi } from 'vitest';
 import { writeFile } from '@shopify/cli-kit/node/fs';
 import { dirname, joinPath } from '@shopify/cli-kit/node/path';
-import { getSkeletonSourceDir, getRepoNodeModules } from '../build.js';
+import { getSkeletonSourceDir, getSkeletonNodeModules } from '../build.js';
 
 const { renderTasksHook } = vi.hoisted(() => ({ renderTasksHook: vi.fn() }));
 vi.mock("../template-downloader.js", async () => ({
@@ -43,15 +43,13 @@ vi.mock(
         renderTasksHook.mockImplementationOnce(async () => {
           await writeFile(`${directory}/package-lock.json`, "{}");
         });
-        await rm(joinPath(directory, "node_modules"), {
+        const targetNodeModules = joinPath(directory, "node_modules");
+        await rm(targetNodeModules, {
           force: true,
           recursive: true
         }).catch(() => {
         });
-        await symlink(
-          await getRepoNodeModules(),
-          joinPath(directory, "node_modules")
-        );
+        await symlink(await getSkeletonNodeModules(), targetNodeModules);
       })
     };
   }

package/dist/lib/route-validator.js

@@ -1,6 +1,6 @@
 import { renderWarning, renderSuccess } from '@shopify/cli-kit/node/ui';
 
-const RESERVED_ROUTES = ["^api/[^/]+/graphql.json", "^cdn/", "^_t/"];
+const RESERVED_ROUTES = ["^cdn/", "^_t/"];
 function findReservedRoutes(config) {
   const routes = /* @__PURE__ */ new Set();
   Object.values(config.routes).filter(

package/dist/lib/template-diff.js

@@ -45,7 +45,8 @@ ${colors.dim(
         "**/*.generated.d.ts",
         "**/package.json",
         "**/tsconfig.json",
-        "**/.shopify"
+        "**/.shopify",
+        "**/.gitignore"
       ]
     }).on("all", async (eventName, eventFilePath) => {
       const targetFile = joinPath(
@@ -171,7 +172,7 @@ async function applyTemplateDiff(targetDirectory, diffDirectory, templateDir) {
     force: true,
     recursive: true,
     filter: createFilter(
-      /(^|\/|\\)(dist|node_modules|\.cache|.turbo|package\.json|tsconfig\.json)(\/|\\|$)/i
+      /(^|\/|\\)(dist|node_modules|\.cache|\.turbo|package\.json|tsconfig\.json|\.gitignore)(\/|\\|$)/i
     )
   });
   await mergePackageJson(diffDirectory, targetDirectory, {

package/dist/lib/vite-config.js

@@ -37,7 +37,7 @@ async function getViteConfig(root, ssrEntryFlag) {
     mode,
     mode
   );
-  const { appDirectory, serverBuildFile, routes } = getRemixConfigFromVite(resolvedViteConfig);
+  const { appDirectory, serverBuildFile, routes } = getReactRouterOrRemixConfigFromVite(resolvedViteConfig);
   const serverOutDir = resolvedViteConfig.build.outDir;
   const clientOutDir = serverOutDir.replace(/server$/, "client");
   const rollupOutput = resolvedViteConfig.build.rollupOptions.output;
@@ -58,8 +58,8 @@ async function getViteConfig(root, ssrEntryFlag) {
     resolvedViteConfig,
     userViteConfig: maybeConfig.config,
     remixConfig: {
-      routes,
-      appDirectory,
+      routes: routes ?? {},
+      appDirectory: appDirectory ?? joinPath(resolvedViteConfig.root, "app"),
       rootDirectory: resolvedViteConfig.root,
       serverEntryPoint: (await findFileWithExtension(
         dirname(resolvedSsrEntry),
@@ -68,7 +68,16 @@ async function getViteConfig(root, ssrEntryFlag) {
     }
   };
 }
-function getRemixConfigFromVite(viteConfig) {
+function getReactRouterOrRemixConfigFromVite(viteConfig) {
+  try {
+    const reactRouterConfig = getReactRouterConfigFromVite(viteConfig);
+    return reactRouterConfig;
+  } catch (error) {
+    const remixConfig = getRemixConfigFromVite(viteConfig);
+    return remixConfig;
+  }
+}
+function getReactRouterConfigFromVite(viteConfig) {
   if (!viteConfig.__reactRouterPluginContext) {
     throw new Error("Could not resolve React Router config");
   }
@@ -79,6 +88,14 @@ function getRemixConfigFromVite(viteConfig) {
     routes
   };
 }
+function getRemixConfigFromVite(viteConfig) {
+  const { remixConfig } = findHydrogenPlugin(viteConfig)?.api?.getPluginOptions() ?? {};
+  return remixConfig ? {
+    appDirectory: remixConfig.appDirectory,
+    serverBuildFile: remixConfig.serverBuildFile,
+    routes: remixConfig.routes
+  } : {};
+}
 function findPlugin(config, name) {
   return config.plugins.find((plugin) => plugin.name === name);
 }

package/oclif.manifest.json

@@ -503,6 +503,13 @@
           "required": false,
           "allowNo": false,
           "type": "boolean"
+        },
+        "force-client-sourcemap": {
+          "description": "Client sourcemapping is avoided by default because it makes backend code visible in the browser. Use this flag to force enabling it.",
+          "env": "SHOPIFY_HYDROGEN_FLAG_FORCE_CLIENT_SOURCEMAP",
+          "name": "force-client-sourcemap",
+          "allowNo": false,
+          "type": "boolean"
         }
       },
       "hasDynamicHelp": false,
@@ -1728,5 +1735,5 @@
       ]
     }
   },
-  "version": "11.0.1"
+  "version": "11.1.1"
 }

package/package.json

@@ -4,7 +4,7 @@
     "access": "public",
     "@shopify:registry": "https://registry.npmjs.org"
   },
-  "version": "11.0.1",
+  "version": "11.1.1",
   "license": "MIT",
   "type": "module",
   "repository": {
@@ -37,7 +37,7 @@
     "vitest": "^1.0.4"
   },
   "dependencies": {
-    "@ast-grep/napi": "0.11.0",
+    "@ast-grep/napi": "0.34.1",
     "@oclif/core": "3.26.5",
     "@shopify/cli-kit": "^3.80.4",
     "@shopify/oxygen-cli": "4.6.18",