@graphcommerce/docs 8.0.1 → 8.0.2-canary.2

package/CHANGELOG.md

@@ -1,5 +1,21 @@
 # Change Log
 
+## 8.0.2-canary.2
+
+## 8.0.2-canary.1
+
+### Patch Changes
+
+- [#2193](https://github.com/graphcommerce-org/graphcommerce/pull/2193) [`317250a`](https://github.com/graphcommerce-org/graphcommerce/commit/317250a580b9f0b5175d9df93ba2cf62193ea383) - Updated docs to reflect featurelist more accurately
+  ([@paales](https://github.com/paales))
+
+## 8.0.2-canary.0
+
+### Patch Changes
+
+- [#2195](https://github.com/graphcommerce-org/graphcommerce/pull/2195) [`207cd41`](https://github.com/graphcommerce-org/graphcommerce/commit/207cd4147621e53353b0b354c80d575df78089f0) - Documentation on multistore setup added
+  ([@paales](https://github.com/paales))
+
 ## 8.0.1
 
 ### Patch Changes

package/feature-list.md

@@ -87,15 +87,15 @@ Features taken from the Magento Commerce 2 Feature List
 - [x] Blend content and commerce by adding products to content pages and rich
       content to product pages. — [Enhanced]
 - [x] Create reusable dynamic blocks targeted to customer segments. — [Commerce]
-- [x] Easily stage and preview content for seamless updates. — [Enhanced]
-- [x] Manage upcoming site changes with a timeline dashboard. — [Enhanced]
+- [x] Easily stage and preview content for seamless updates. — [Partial]
+- [x] Manage upcoming site changes with a timeline dashboard. - [Commerce]
 - [x] Organize content pages and add pagination, navigation, and menus with a
       page hierarchy tool. — [Enhanced]
 - [x] Track and restore previous versions of content pages. — [Enhanced]
 - [x] Engage customers with exciting imagery from Adobe Stock, straight from
       your Adobe Commerce instance.
 - [x] Save content and layouts as templates. Apply them to new areas across
-      sites and store views. — [Enhanced]
+      sites and store views.
 - [x] Provide creatives, designers, and agencies with direct, controlled access
       to the Media Gallery.
 
@@ -214,7 +214,7 @@ Features taken from the Magento Commerce 2 Feature List
 ### Checkout
 
 - [x] Include a mini cart on store pages to summarize products in the cart.
-- [x] Display an order summary with product images in checkout.
+- [x] Display an order summary with product images in checkout. [Todo]
 - [x] Offer guest and registered user checkout. Registered customers are
       automatically recognized when they enter their email addresses.
 - [ ] Boost conversion rates with an Instant Purchase option that uses saved
@@ -382,7 +382,7 @@ Features taken from the Magento Commerce 2 Feature List
       APIs with REST and GraphQL support. — [Enhanced]
 - [x] Smoothly manage interactions between extensions using plug-ins and
       dependency injection software design patterns. —
-      [Plugins](https://www.graphcommerce.org/docs/framework/plugins-react_)
+      [Plugins](https://www.graphcommerce.org/docs/framework/plugins-react)
 - [ ] Accelerate time-to-market and improve code quality with a fully-automated
       testing framework.
 - [ ] Update code with a standalone installer that checks for prerequisites
@@ -404,10 +404,12 @@ Features taken from the Magento Commerce 2 Feature List
 - [x] Feel confident with regular scanning, external penetration testing, and
       bug bounty programs that promote core platform security.
 - [x] Stay informed about security issues through the Adobe Security Center and
-      mailing list.
+      mailing list. [Commerce]
 - [x] Prevent private data from sending to third parties with Egress Filtering.
+      [Commerce]
 - [x] Support for leading iPaaS platforms to enable enterprise integrations
 - [x] Optimize your upgrade process with the Upgrade Compatibility Tool.
+      [Commerce]
 
 ### Layout and theming
 

package/framework/config.md

@@ -334,7 +334,9 @@ All storefront configuration for the project
 
 #### locale: string (required)
 
-Must be a locale string https://www.unicode.org/reports/tr35/tr35-59/tr35.html#Identifiers
+Must be a [locale string](https://www.unicode.org/reports/tr35/tr35-59/tr35.html#Identifiers) for automatic redirects to work.
+
+This value can be used as a sub-path identifier only, make sure linguiLocale is configured for each URL.
 
 #### magentoStoreCode: string (required)
 
@@ -390,7 +392,9 @@ Add a gcms-locales header to make sure queries return in a certain language, can
 
 #### linguiLocale: string
 
-Specify a custom locale for to load translations.
+Specify a custom locale for to load translations. Must be lowercase valid locale.
+
+This value is also used for the Intl.
 
 ### MagentoConfigurableVariantValues
 

package/framework/translations.md

@@ -215,6 +215,10 @@ msgstr ""
 > suggestions in VS Code with the
 > [Github copilot extention ↗](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot).
 
+## Use country specific locales like `en-us` and `en-gb`
+
+Configure `linguiLocale` in the storefront config.
+
 ## Next steps
 
 - Learn more about

package/framework/troubleshooting.md

@@ -5,17 +5,24 @@
 If any errors are detected during the build phase, the console and browser will
 display an error message. Common causes for errors are:
 
+```bash
+[next] [GraphQL Errors] failed to fetch to https://magento.test/graphql products
+```
+
+You are connecting with a local endpoint with a self signed SSL certicate, start
+your dev server with `NODE_TLS_REJECT_UNAUTHORIZED=0 yarn dev`
+
 ```bash
 [next] 🕸️ - m2: Failed to generate schema: request to [...] failed, reason: connect ETIMEDOUT
 ```
 
-Missing MAGENTO_ENDPOINT environment variable in your .env file
+Missing `magentoEndpoint` in your graphcommerce.config.js
 
 ```bash
 🕸️ - m2: Failed to generate schema: invalid json response body at [...] reason: Unexpected '<'
 ```
 
-MAGENTO_ENDPOINT environment variable is not pointing to a Magento graphql
+`magentoEndpoint` environment variable is not pointing to a Magento graphql
 endpoint
 
 ```bash
@@ -28,24 +35,7 @@ The Magento version is outdated. Make sure you are running Magento 2.4.3 and up
 Error: Invalid src prop ([...]) on 'next/image', hostname "[...]" is not configured under images in your 'next.config.js'
 ```
 
-Add the image domain to IMAGE_DOMAINS in your .env file
-
-```bash
-File /[...]/node_modules/@graphcommerce/magento-payment-braint
-ree/hooks/UseBraintree.graphql caused error: Unable to find field "createBraintreeClientToken" on type "Mutation"!
-```
-
-Remove "@graphcommerce/magento-payment-braintree" from your dependencies in
-package.json. Run `yarn` to update dependencies, then run `yarn dev`.
-
-```bash
-File /[...]/node_modules/@graphcommerce/mollie-magento-payment
-/components/MolliePlaceOrder/MolliePlaceOrder.graphql caused error: Unable to
-find field "mollie_redirect_url" on type "Order"!
-```
-
-Remove "@graphcommerce/mollie-magento-payment" from your dependencies in
-package.json. Run `yarn` to update dependencies, then run `yarn dev`.
+Add the image domain to the next.config.js
 
 ```bash
 node_modules/@graphcommerce/graphql/generated/fragments.json

package/getting-started/create.md

@@ -10,6 +10,7 @@ start building.
 
 ### Requirements
 
+- Lixux, MacOS or WSL2
 - Install and use node 16/18: `nvm install 16` or `nvm use 16`
 - Install yarn: `corepack enable`
 

package/magento/multi-store-language-and-website.md

@@ -0,0 +1,100 @@
+# Multi store, language and website setup
+
+GraphCommerce builds on top of the
+[Next.js internationalization feature](https://nextjs.org/docs/pages/building-your-application/routing/internationalization#getting-started).
+
+## Sub-path routing
+
+Locales are UTS Locale Identifiers, a standardized format for defining locales.
+
+Generally a Locale Identifier is made up of a language, region, and script
+separated by a dash: `language-region-script`. The region and script are
+optional. An example how to configure it in GraphCommerce:
+
+```js
+const config = {
+  storefront: [
+    { locale: 'en-US', defaultLocale: true },
+    { locale: 'nl-NL' },
+    { locale: 'de' },
+  ],
+}
+```
+
+This will result in the following URLs:
+
+- `https://www.graphcommerce.org/some-path/here`
+- `https://www.graphcommerce.org/nl-NL/some-path/here`
+- `https://www.graphcommerce.org/de/some-path/here`
+
+## Domain routing
+
+The domains can be subdomains or top-level domains. The configuration is the
+same for both.
+
+```js
+const config = {
+  storefront: [
+    { domain: 'www.graphcommerce.org', locale: 'en-US', defaultLocale: true },
+    { domain: 'www.graphcommerce.org', locale: 'fr' },
+    { domain: 'www.graphcommerce.nl', locale: 'nl-NL' },
+    { domain: 'de.graphcommerce.org', locale: 'de-DE' },
+  ],
+}
+```
+
+This will result in the following URLs:
+
+- `https://www.graphcommerce.org/some-path/here`
+- `https://www.graphcommerce.org/fr/some-path/here`
+- `https://www.graphcommerce.nl/some-path/here`
+- `https://de.graphcommerce.org/some-path/here`
+
+## Domain routing + same locale
+
+Next.js does not allow reusing locales (even if it is on different domains), to
+work around this, we're using the fact that a locale is allowed to have a
+'script' value in the format: `language-region-script`. We use this part to
+differentiate between the same locales on different domains.
+
+Configuring the `linguiLocale` makes sure the correct translation file is loaded
+here.
+
+```js
+const config = {
+  storefront: [
+    { domain: 'domain1.com', locale: 'en-us-domain1', linguiLocale: 'en' },
+    { domain: 'domain2.com', locale: 'en-us-domain2', linguiLocale: 'en' },
+    { domain: 'domain3.com', locale: 'en-us-domain3', linguiLocale: 'en' },
+  ],
+}
+```
+
+### Separating Sub-paths from locales
+
+Note: Available from GraphCommerce 8.1.0
+
+Warning: Separating paths form locales will break Next.js' automatic redirect
+functionality.
+
+```js
+const config = {
+  storefront: [
+    { locale: 'default', linguiLocale: 'en', defaultLocale: true },
+    { locale: 'fr_fr', linguiLocale: 'fr' },
+    { locale: 'nl_nl', linguiLocale: 'nl' },
+  ],
+}
+```
+
+This will result in the following URLs:
+
+- `https://www.graphcommerce.org/some-path/here`
+- `https://www.graphcommerce.org/fr_fr/some-path/here`
+- `https://www.graphcommerce.org/nl_nl/some-path/here`
+
+## Further reading
+
+- [Next.js docs: Prefixing the default locale](https://nextjs.org/docs/pages/building-your-application/routing/internationalization#prefixing-the-default-locale)
+- [Next.js docs: Sub-path routing](https://nextjs.org/docs/pages/building-your-application/routing/internationalization#sub-path-routing).
+- [Next.js docs: Domain routing](https://nextjs.org/docs/pages/building-your-application/routing/internationalization#domain-routing)

package/package.json

@@ -2,10 +2,10 @@
   "name": "@graphcommerce/docs",
   "homepage": "https://www.graphcommerce.org/docs",
   "repository": "github:graphcommerce-org/graphcommerce/docs",
-  "version": "8.0.1",
+  "version": "8.0.2-canary.2",
   "sideEffects": true,
   "peerDependencies": {
-    "@graphcommerce/prettier-config-pwa": "^8.0.1"
+    "@graphcommerce/prettier-config-pwa": "^8.0.2-canary.2"
   },
   "prettier": "@graphcommerce/prettier-config-pwa"
 }