@graphcommerce/magento-store 10.0.0 → 10.0.1-canary.1

package/CHANGELOG.md

@@ -1,5 +1,15 @@
 # Change Log
 
+## 10.0.1-canary.1
+
+### Patch Changes
+
+- [#2571](https://github.com/graphcommerce-org/graphcommerce/pull/2571) [`d9c7545`](https://github.com/graphcommerce-org/graphcommerce/commit/d9c754570cd04da61ee3282bde465cc33395c8d9) - When switching stores unset the currency when there is no selection available for a given store. ([@paales](https://github.com/paales))
+
+- [#2571](https://github.com/graphcommerce-org/graphcommerce/pull/2571) [`6d5ff59`](https://github.com/graphcommerce-org/graphcommerce/commit/6d5ff59090b5fe37bf053a2540fcf13150331a27) - Do not send an unacceptable store currency due to a configuration error and make sure the correct currency is stored. Show a StoreSwitcherFab on mobile. ([@paales](https://github.com/paales))
+
+## 10.0.1-canary.0
+
 ## 10.0.0
 
 ### Major Changes
@@ -120,288 +130,6 @@
 
 - [#2485](https://github.com/graphcommerce-org/graphcommerce/pull/2485) [`b0ec078`](https://github.com/graphcommerce-org/graphcommerce/commit/b0ec0784a0b3ca977598ded3777d23bc929072b0) - Added a CurrencySymbol component that renders the current currency symbol ([@paales](https://github.com/paales))
 
-## 10.0.0-canary.72
-
-## 10.0.0-canary.71
-
-## 10.0.0-canary.70
-
-### Major Changes
-
-- [#2565](https://github.com/graphcommerce-org/graphcommerce/pull/2565) [`c96dfcd`](https://github.com/graphcommerce-org/graphcommerce/commit/c96dfcdca981baca387c270ad9e2b9515cdd00cc) - Updated to Apollo Client 4 ([@paales](https://github.com/paales))
-
-## 10.0.0-canary.69
-
-## 10.0.0-canary.68
-
-## 10.0.0-canary.67
-
-## 10.0.0-canary.66
-
-## 10.0.0-canary.65
-
-## 10.0.0-canary.64
-
-## 10.0.0-canary.63
-
-## 10.0.0-canary.62
-
-## 10.0.0-canary.61
-
-## 10.0.0-canary.60
-
-## 10.0.0-canary.59
-
-## 10.0.0-canary.58
-
-## 10.0.0-canary.57
-
-## 10.0.0-canary.56
-
-### Major Changes
-
-- [#2546](https://github.com/graphcommerce-org/graphcommerce/pull/2546) [`ed9332a`](https://github.com/graphcommerce-org/graphcommerce/commit/ed9332a7f78966d932041d9a7725641edc92b28d) - ## GraphCommerce 10 - Turbopack Support
-
-  This major release brings full Turbopack compatibility, dramatically improving development speed.
-
-  ### 🚀 Turbopack-Compatible Interceptor System
-
-  The entire plugin/interceptor system has been rewritten to work with Turbopack:
-
-  - **No more Webpack plugins** - Removed `InterceptorPlugin` webpack plugin entirely
-  - **File-based interception** - Original files are moved to `.original.tsx` and replaced with interceptor content
-  - **Direct imports** - Interceptors import from `.original` files instead of embedding source
-  - **New CLI commands**:
-    - `graphcommerce codegen-interceptors` - Generate interceptor files
-    - `graphcommerce cleanup-interceptors` - Reset interceptor system, restore original files
-  - **Stable file hashing** - Deterministic interceptor generation for better caching
-
-  ### ⚙️ Treeshakable Configuration System
-
-  Replaced Webpack `DefinePlugin`-based `import.meta.graphCommerce` with a new generated configuration system:
-
-  - **New `codegen-config-values` command** - Generates TypeScript files with precise typing
-  - **Schema-driven** - Dynamically introspects Zod schemas to determine all available properties
-  - **Fully treeshakable** - Unused config values are eliminated from the bundle
-  - **Type-safe** - Uses `Get<GraphCommerceConfig, 'path'>` for nested property access
-  - **Separate files for nested objects** - Optimal treeshaking for complex configurations
-
-  ### 🔧 withGraphCommerce Changes
-
-  - **Removed** `InterceptorPlugin` - No longer needed with file-based interception
-  - **Removed** `DefinePlugin` for `import.meta.graphCommerce` - Replaced with generated config
-  - **Removed** `@mui/*` alias rewrites - No longer required
-  - **Added** Turbopack loader rules for `.yaml`, `.yml`, and `.po` files
-  - **Added** `serverExternalPackages` for all `@whatwg-node/*` packages
-  - **Added** `optimizePackageImports` for better bundle optimization
-  - **Added** `images.qualities: [52, 75]` for Next.js image optimization
-
-  ### 📦 Lingui Configuration
-
-  - **Renamed** `lingui.config.js` → `lingui.config.ts` with TypeScript support
-  - **Updated** `@graphcommerce/lingui-next/config` to TypeScript with proper exports
-  - **Simplified** formatter options
-
-  ### ⚛️ React 19 & Next.js 16 Compatibility
-
-  - Updated `RefObject<T>` types for React 19 (now includes `null` by default)
-  - Replaced deprecated `React.VFC` with `React.FC`
-  - Fixed `useRef` calls to require explicit initial values
-  - Updated `MutableRefObject` usage in `framer-scroller`
-
-  ### 📋 ESLint 9 Flat Config
-
-  - Migrated from legacy `.eslintrc` to new flat config format (`eslint.config.mjs`)
-  - Updated `@typescript-eslint/*` packages to v8
-  - Fixed AST selector for `SxProps` rule (`typeParameters` → `typeArguments`)
-
-  ### 🔄 Apollo Client
-
-  - Fixed deprecated `name` option → `clientAwareness: { name: 'ssr' }`
-  - Updated error handling types to accept `ApolloError | null | undefined`
-
-  ### ⚠️ Breaking Changes
-
-  - **Node.js 24.x not supported** - Restricted to `>=20 <24.0.0` due to [nodejs/undici#4290](https://github.com/nodejs/undici/issues/4290)
-  - **Interceptor files changed** - Original components now at `.original.tsx`
-  - **Config access changed** - Use generated config values instead of `import.meta.graphCommerce`
-  - **ESLint config format** - Must use flat config (`eslint.config.mjs`)
-  - **Lingui config** - Rename `lingui.config.js` to `lingui.config.ts`
-
-  ### 🗑️ Removed
-
-  - `InterceptorPlugin` webpack plugin
-  - `configToImportMeta` utility
-  - Webpack `DefinePlugin` usage for config
-  - `@mui/*` modern alias rewrites
-  - Debug plugins (`CircularDependencyPlugin`, `DuplicatesPlugin`) ([@paales](https://github.com/paales))
-
-## 9.1.0-canary.55
-
-## 9.1.0-canary.54
-
-## 9.1.0-canary.53
-
-## 9.1.0-canary.52
-
-## 9.1.0-canary.51
-
-### Minor Changes
-
-- [#2537](https://github.com/graphcommerce-org/graphcommerce/pull/2537) [`958dcb6`](https://github.com/graphcommerce-org/graphcommerce/commit/958dcb62d5abb3427a38e2a4583897f3e2043cc4) - Intoduce a new Product-`uid` to solve an issue where cache normalization was not working properly on the frontend when viewing products with a differen curreny, etc.
-
-  Products now have a more detailed `uid` which will include the scope the product is retrieved from. For example: `NDg5MDM=?store=nl_NL&currencyCode=EUR`. This results in a better cache normalization in Apollo Client and allows for switching between scopes (store/currency/price views/accounts) without creating a broken cache state.
-
-  We have implemented this with a new resolver that rewrites the `uid` passed from Magento to the Mesh Resolver, and additing additonal data to the `uid` based on the headers passed from the client. This also requires each package to implement the `getPrivateQueryContextMesh` method to retrieve the current PrivateQuery context from the GraphQL request headers. ([@paales](https://github.com/paales))
-
-### Patch Changes
-
-- [#2537](https://github.com/graphcommerce-org/graphcommerce/pull/2537) [`31397f9`](https://github.com/graphcommerce-org/graphcommerce/commit/31397f9c5b2d85895d6e00732b2e3d7a99ffee53) - Solve issue where a magento store reference was added to the graphql-mesh package. ([@paales](https://github.com/paales))
-
-## 9.1.0-canary.50
-
-## 9.1.0-canary.49
-
-## 9.1.0-canary.48
-
-## 9.1.0-canary.47
-
-## 9.1.0-canary.46
-
-## 9.1.0-canary.45
-
-## 9.1.0-canary.44
-
-## 9.1.0-canary.43
-
-## 9.1.0-canary.42
-
-## 9.1.0-canary.41
-
-### Patch Changes
-
-- [#2530](https://github.com/graphcommerce-org/graphcommerce/pull/2530) [`2075f33`](https://github.com/graphcommerce-org/graphcommerce/commit/2075f331eec38e894722d8ba4539d865f2db5507) - Support asNumber for Money component to easily render all prices as number ([@paales](https://github.com/paales))
-
-## 9.1.0-canary.40
-
-## 9.1.0-canary.39
-
-## 9.1.0-canary.38
-
-## 9.1.0-canary.37
-
-## 9.1.0-canary.36
-
-### Patch Changes
-
-- [`4c92400`](https://github.com/graphcommerce-org/graphcommerce/commit/4c92400733bb3764494298122771d5bd9bacd5a2) - Render prices with a narrowSymbol so users just see $ instead of US$ ([@paales](https://github.com/paales))
-
-- [`f0d244e`](https://github.com/graphcommerce-org/graphcommerce/commit/f0d244ef8625e9cd2fc08d8518f8afa1edb3d688) - Solve issue where the currency switcher would result in an additional query ([@paales](https://github.com/paales))
-
-## 9.1.0-canary.35
-
-### Patch Changes
-
-- [#2528](https://github.com/graphcommerce-org/graphcommerce/pull/2528) [`5a41fff`](https://github.com/graphcommerce-org/graphcommerce/commit/5a41fff74c38ed1f9793e48ec42cba71d1d539d1) - Use the default display currency instead of the base currency in case they differ from one another. ([@paales](https://github.com/paales))
-
-- [#2528](https://github.com/graphcommerce-org/graphcommerce/pull/2528) [`5a41fff`](https://github.com/graphcommerce-org/graphcommerce/commit/5a41fff74c38ed1f9793e48ec42cba71d1d539d1) - Store switcher now allows switching between currencies without navigating and just switches the @privateContext. ([@paales](https://github.com/paales))
-
-- [#2528](https://github.com/graphcommerce-org/graphcommerce/pull/2528) [`5a41fff`](https://github.com/graphcommerce-org/graphcommerce/commit/5a41fff74c38ed1f9793e48ec42cba71d1d539d1) - Added store switcher to the header and mobile navigation ([@paales](https://github.com/paales))
-
-## 9.1.0-canary.34
-
-## 9.1.0-canary.33
-
-## 9.1.0-canary.32
-
-## 9.1.0-canary.31
-
-## 9.1.0-canary.30
-
-## 9.1.0-canary.29
-
-## 9.1.0-canary.28
-
-## 9.1.0-canary.27
-
-## 9.1.0-canary.26
-
-## 9.1.0-canary.25
-
-## 9.1.0-canary.24
-
-## 9.1.0-canary.23
-
-## 9.1.0-canary.22
-
-### Patch Changes
-
-- [#2510](https://github.com/graphcommerce-org/graphcommerce/pull/2510) [`61a2e16`](https://github.com/graphcommerce-org/graphcommerce/commit/61a2e1641c75a0497406e70f2ab96c8e3f5bdd96) - Allow setting alternate store switcher URL ([@bramvanderholst](https://github.com/bramvanderholst))
-
-## 9.1.0-canary.21
-
-## 9.1.0-canary.20
-
-## 9.1.0-canary.19
-
-### Minor Changes
-
-- [#2499](https://github.com/graphcommerce-org/graphcommerce/pull/2499) [`9f040a4`](https://github.com/graphcommerce-org/graphcommerce/commit/9f040a4c0947f05f2f27e4c5078a684b04e711e1) - Implemented the `query { attributesForm }` to be able to dynamically render forms with useAttributesForm/preloadAttributesForm and AttributesFormAutoLayout, and additional utilities to handle form submissions. ([@paales](https://github.com/paales))
-
-### Patch Changes
-
-- [#2499](https://github.com/graphcommerce-org/graphcommerce/pull/2499) [`798c122`](https://github.com/graphcommerce-org/graphcommerce/commit/798c12271e90cf0e02f021e7ad4aa088b4c7c2a3) - Use the `storeConfig.head_shortcut_icon` when configured, if not configured it will use the favicon.ico and favicon.svg from the public folder. ([@paales](https://github.com/paales))
-
-- [#2499](https://github.com/graphcommerce-org/graphcommerce/pull/2499) [`6b2b44c`](https://github.com/graphcommerce-org/graphcommerce/commit/6b2b44ca853279144d7768067f3462d4d4bf0af1) - Created a new PriceModifiers component that is implemented on CartItems, allowing different product types to render their options in a consistent manner and allow rendering a base price so that the sum in the cart is correct. ([@paales](https://github.com/paales))
-
-## 9.1.0-canary.18
-
-## 9.1.0-canary.17
-
-### Minor Changes
-
-- [#2496](https://github.com/graphcommerce-org/graphcommerce/pull/2496) [`4b6a65d`](https://github.com/graphcommerce-org/graphcommerce/commit/4b6a65db089d92492e7fde28a8e32bc41f5b9103) - Added support for multiple display currencies in the frontend. Multiple currencies were already supported, but this introduces Display Currencies for viewing the cart in different currencies. ([@paales](https://github.com/paales))
-
-- [#2496](https://github.com/graphcommerce-org/graphcommerce/pull/2496) [`4b6a65d`](https://github.com/graphcommerce-org/graphcommerce/commit/4b6a65db089d92492e7fde28a8e32bc41f5b9103) - Refactored the Store Selector to be more of a form and have multiple nested toggles to switch groups, then stores and then currencies. It automatically hides features that aren't used: If only a single group is used with multiple stores only the store selector is shown. If multiple groups are used with each a single store is used, only the group selector is shown. If only a single currency is used, there is no currency selector. If multiple currencies are used, the currency selector is shown. This makes the selector more user-friendly and less cluttered. ([@paales](https://github.com/paales))
-
-## 9.1.0-canary.16
-
-## 9.1.0-canary.15
-
-## 9.0.4-canary.14
-
-## 9.0.4-canary.13
-
-## 9.0.4-canary.12
-
-## 9.0.4-canary.11
-
-### Patch Changes
-
-- [#2485](https://github.com/graphcommerce-org/graphcommerce/pull/2485) [`b0ec078`](https://github.com/graphcommerce-org/graphcommerce/commit/b0ec0784a0b3ca977598ded3777d23bc929072b0) - Added a CurrencySymbol component that renders the current currency symbol ([@paales](https://github.com/paales))
-
-## 9.0.4-canary.10
-
-## 9.0.4-canary.9
-
-## 9.0.4-canary.8
-
-## 9.0.4-canary.7
-
-## 9.0.4-canary.6
-
-## 9.0.4-canary.5
-
-## 9.0.4-canary.4
-
-## 9.0.4-canary.3
-
-## 9.0.4-canary.2
-
-## 9.0.4-canary.1
-
-## 9.0.4-canary.0
-
 ## 9.0.1
 
 ### Patch Changes

package/components/StoreSwitcher/StoreSwitcherStoreSelector.tsx

@@ -52,10 +52,6 @@ export function StoreSwitcherStoreSelector(props: StoreSwitcherSelectorProps) {
           ),
           value: store.store_code,
           disabled: store.disabled,
-          slotProps: {
-            title: { sx: { typography: 'subtitle1' } },
-            details: { sx: { typography: 'body1', color: 'text.secondary' } },
-          },
         }))}
         {...actionCardProps}
       />

package/components/StoreSwitcher/useStoreSwitcher.tsx

@@ -190,8 +190,12 @@ export function StoreSwitcherFormProvider(props: StoreSwitcherFormProviderProps)
     const formStore = context.stores.find((s) => s.store_code === formValues.storeCode)
     const isDefaultDisplayCurrency =
       formValues.currency === formStore?.default_display_currency_code
+    const isCurrencyAvailable = formStore?.currency?.available_currency_codes?.includes(
+      formValues.currency,
+    )
 
-    if (isDefaultDisplayCurrency) cookie('Magento-Content-Currency', null)
+    // Clear cookie if using default currency or if the currency is not available for the target store
+    if (isDefaultDisplayCurrency || !isCurrencyAvailable) cookie('Magento-Content-Currency', null)
     else cookie('Magento-Content-Currency', formValues.currency)
 
     await onSubmit?.(formValues, event)

package/components/StoreSwitcherButton/StoreSwitcherFab.tsx

@@ -1,20 +1,24 @@
-import { iconLanguage, IconSvg, sxx } from '@graphcommerce/next-ui'
-import { Fab, type FabProps } from '@mui/material'
-import { StoreSwitcherText } from './StoreSwitcherText'
+import type { FabProps } from '@graphcommerce/next-ui'
+import { Fab, iconLanguage } from '@graphcommerce/next-ui'
 import { useShowStoreSwitcherButton } from './useStoreSwitcherButton'
 
-export function StoreSwitcherFab(props: FabProps) {
+export type StoreSwitcherFabProps = Omit<FabProps, 'icon' | 'onClick'>
+
+export function StoreSwitcherFab(props: StoreSwitcherFabProps) {
+  const { sx, ...fabProps } = props
   const { show, onClick } = useShowStoreSwitcherButton()
+
   if (!show) return null
 
   return (
     <Fab
-      variant='extended'
+      color='inherit'
+      size='medium'
+      sx={sx}
+      icon={iconLanguage}
       onClick={onClick}
-      sx={sxx({ width: 'max-content', columnGap: '3px', typography: 'body1' })}
-      {...props}
-    >
-      <IconSvg src={iconLanguage} /> <StoreSwitcherText />
-    </Fab>
+      slotProps={{ icon: { size: 'default' } }}
+      {...fabProps}
+    />
   )
 }

package/components/StoreSwitcherButton/useStoreSwitcherButton.ts

@@ -8,17 +8,23 @@ export function useShowStoreSwitcherButton(options?: Record<string, never>) {
   const country = config.data?.storeConfig?.locale?.split('_')?.[1]?.toLowerCase() ?? ''
   const router = useRouter()
   const multiLocale = (router.locales?.length ?? 0) > 1
-  const multiCurrency =
-    new Set(config.data?.storeConfig?.currency?.available_currency_codes ?? []).size > 1
+  const availableCurrencies = config.data?.storeConfig?.currency?.available_currency_codes ?? []
+  const multiCurrency = new Set(availableCurrencies).size > 1
 
-  const [currency] = useCookie('Magento-Content-Currency')
+  const [cookieCurrency] = useCookie('Magento-Content-Currency')
+
+  // Validate cookie currency against available currencies
+  const currency =
+    cookieCurrency && availableCurrencies.includes(cookieCurrency)
+      ? cookieCurrency
+      : config.data?.storeConfig?.default_display_currency_code
 
   return {
     show: multiLocale || multiCurrency,
     multiCurrency,
     country,
     multiLocale,
-    currency: currency ?? config.data?.storeConfig?.default_display_currency_code,
+    currency,
     storeName: config.data?.storeConfig?.store_name,
     onClick: () => router.push('/switch-stores'),
   }

package/package.json

@@ -2,7 +2,7 @@
   "name": "@graphcommerce/magento-store",
   "homepage": "https://www.graphcommerce.org/",
   "repository": "github:graphcommerce-org/graphcommerce",
-  "version": "10.0.0",
+  "version": "10.0.1-canary.1",
   "sideEffects": false,
   "prettier": "@graphcommerce/prettier-config-pwa",
   "eslintConfig": {
@@ -19,15 +19,15 @@
     "./mesh/resolvers.ts": "./mesh/resolvers.ts"
   },
   "peerDependencies": {
-    "@graphcommerce/ecommerce-ui": "^10.0.0",
-    "@graphcommerce/eslint-config-pwa": "^10.0.0",
-    "@graphcommerce/framer-utils": "^10.0.0",
-    "@graphcommerce/graphql": "^10.0.0",
-    "@graphcommerce/graphql-mesh": "^10.0.0",
-    "@graphcommerce/image": "^10.0.0",
-    "@graphcommerce/next-ui": "^10.0.0",
-    "@graphcommerce/prettier-config-pwa": "^10.0.0",
-    "@graphcommerce/typescript-config-pwa": "^10.0.0",
+    "@graphcommerce/ecommerce-ui": "^10.0.1-canary.1",
+    "@graphcommerce/eslint-config-pwa": "^10.0.1-canary.1",
+    "@graphcommerce/framer-utils": "^10.0.1-canary.1",
+    "@graphcommerce/graphql": "^10.0.1-canary.1",
+    "@graphcommerce/graphql-mesh": "^10.0.1-canary.1",
+    "@graphcommerce/image": "^10.0.1-canary.1",
+    "@graphcommerce/next-ui": "^10.0.1-canary.1",
+    "@graphcommerce/prettier-config-pwa": "^10.0.1-canary.1",
+    "@graphcommerce/typescript-config-pwa": "^10.0.1-canary.1",
     "@lingui/core": "^5",
     "@lingui/macro": "^5",
     "@lingui/react": "^5",

package/plugins/magentoStoreGraphqlConfig.ts

@@ -1,6 +1,7 @@
 import { SetContextLink, type graphqlConfig as graphqlConfigType } from '@graphcommerce/graphql'
 import type { FunctionPlugin, PluginConfig } from '@graphcommerce/next-config'
 import { cookie } from '@graphcommerce/next-ui'
+import { StoreConfigDocument } from '../graphql/queries/StoreConfig.gql'
 
 export const config: PluginConfig = {
   type: 'function',
@@ -14,7 +15,7 @@ export const graphqlConfig: FunctionPlugin<typeof graphqlConfigType> = (prev, co
     ...results,
     links: [
       ...results.links,
-      new SetContextLink((prevContext) => {
+      new SetContextLink((prevContext, operation) => {
         const headers: Record<string, string> = { ...prevContext.headers }
 
         if (!headers.store) {
@@ -22,8 +23,16 @@ export const graphqlConfig: FunctionPlugin<typeof graphqlConfigType> = (prev, co
         }
 
         const contentCurrency = cookie('Magento-Content-Currency')
-        if (contentCurrency && typeof headers['content-currency'] === 'undefined')
-          headers['content-currency'] = contentCurrency
+        if (contentCurrency && typeof headers['content-currency'] === 'undefined') {
+          // Validate currency against available currencies from StoreConfig cache
+          const storeConfig = operation.client.cache.readQuery({ query: StoreConfigDocument })
+          const availableCurrencies = storeConfig?.storeConfig?.currency?.available_currency_codes
+
+          if (!availableCurrencies || availableCurrencies.includes(contentCurrency)) {
+            headers['content-currency'] = contentCurrency
+          }
+          // If currency is not valid, don't set the header - backend will use default
+        }
 
         if (conf.preview) {
           // To disable caching from the backend, we provide a bogus cache ID.