tabshift/payloadcms
1
0
Fork 0
Code Issues Pull Requests Actions 3 Packages Projects Releases Wiki Activity

fix(templates): ecommerce wrong links in readme and docs and issue with missing graphql dependency (#14045)

Browse Source 
Fixes some links in readme and docs and missing graphql dependency for
npm users.
This commit is contained in:
Paul
2025-10-02 15:24:35 -07:00
committed by GitHub
parent bffb9ef8b9
commit e4f90a24fb
4 changed files with 29 additions and 53 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
docs/ecommerce/frontend.mdx
View File

@@ -39,10 +39,10 @@ The `EcommerceProvider` component is used to wrap your application and provide t
Example usage:
```tsx
import { EcommerceProvider } from '@payloadcms/plugin-ecommerce/react'
import { EcommerceProvider } from '@payloadcms/plugin-ecommerce/client/react'
// Import any payment adapters you want to use on the client side
import { stripeAdapterClient } from '@payloadcms/plugin-ecommerce/payments/stripe'
import { USD, EUR } from '@payloadcms/plugin-ecommerce/currencies'
import { USD, EUR } from '@payloadcms/plugin-ecommerce'
export const Providers = () => (
<EcommerceProvider
@@ -117,7 +117,7 @@ The `useCart` hook is used to manage the cart state and actions. It provides met
Example usage:
```tsx
import { useCart } from '@payloadcms/plugin-ecommerce/react'
import { useCart } from '@payloadcms/plugin-ecommerce/client/react'
const CartComponent = () => {
const { addItem, cart, clearCart, decrementItem, incrementItem, removeItem } =
@@ -140,7 +140,7 @@ The `useAddresses` hook is used to fetch and manage addresses. It provides metho
Example usage:
```tsx
import { useAddresses } from '@payloadcms/plugin-ecommerce/react'
import { useAddresses } from '@payloadcms/plugin-ecommerce/client/react'
const AddressesComponent = () => {
const { addresses, createAddress, updateAddress } = useAddresses()
@@ -163,7 +163,7 @@ The `usePayments` hook is used to manage the checkout process. It provides metho
Example usage:
```tsx
import { usePayments } from '@payloadcms/plugin-ecommerce/react'
import { usePayments } from '@payloadcms/plugin-ecommerce/client/react'
const CheckoutComponent = () => {
const {
@@ -244,7 +244,7 @@ The `useCurrency` hook is used to format prices based on the selected currency.
`formatPrice` in particular is very helpful as all prices are stored as integers to avoid any potential issues with decimal calculations, therefore on the frontend you can use this utility to format your price accounting for the currency and decimals. Example usage:
```tsx
import { useCurrency } from '@payloadcms/plugin-ecommerce/react'
import { useCurrency } from '@payloadcms/plugin-ecommerce/client/react'
const PriceComponent = ({ amount }) => {
const { currenciesConfig, currency, setCurrency } = useCurrency()
@@ -260,7 +260,7 @@ The `useEcommerce` hook encompasses all of the above hooks in one. It provides a
Example usage:
```tsx
import { useEcommerce } from '@payloadcms/plugin-ecommerce/react'
import { useEcommerce } from '@payloadcms/plugin-ecommerce/client/react'
const EcommerceComponent = () => {
const { cart, addresses, selectedPaymentMethod } = useEcommerce()

53
pnpm-lock.yaml generated
View File

@@ -1955,7 +1955,10 @@ importers:
version: 8.6.0(react@19.1.1)
geist:
specifier: ^1.3.0
version: 1.4.2(next@15.5.4(@opentelemetry/api@1.9.0)(@playwright/test@1.50.0)(babel-plugin-macros@3.1.0)(react-dom@19.1.1(react@19.1.1))(react@19.1.1)(sass@1.77.4))
version: 1.4.2(next@15.5.4(@babel/core@7.27.4)(@opentelemetry/api@1.9.0)(@playwright/test@1.50.0)(babel-plugin-macros@3.1.0)(react-dom@19.1.1(react@19.1.1))(react@19.1.1)(sass@1.77.4))
graphql:
specifier: ^16.8.1
version: 16.9.0
jsonwebtoken:
specifier: 9.0.1
version: 9.0.1
@@ -1964,7 +1967,7 @@ importers:
version: 0.477.0(react@19.1.1)
next:
specifier: ^15.5.4
version: 15.5.4(@opentelemetry/api@1.9.0)(@playwright/test@1.50.0)(babel-plugin-macros@3.1.0)(react-dom@19.1.1(react@19.1.1))(react@19.1.1)(sass@1.77.4)
version: 15.5.4(@babel/core@7.27.4)(@opentelemetry/api@1.9.0)(@playwright/test@1.50.0)(babel-plugin-macros@3.1.0)(react-dom@19.1.1(react@19.1.1))(react@19.1.1)(sass@1.77.4)
next-themes:
specifier: 0.4.6
version: 0.4.6(react-dom@19.1.1(react@19.1.1))(react@19.1.1)
@@ -2154,7 +2157,7 @@ importers:
version: 16.4.7
geist:
specifier: ^1.3.0
version: 1.4.2(next@15.4.4(@babel/core@7.27.4)(@opentelemetry/api@1.9.0)(@playwright/test@1.54.1)(babel-plugin-macros@3.1.0)(react-dom@19.1.1(react@19.1.1))(react@19.1.1)(sass@1.77.4))
version: 1.4.2(next@15.4.4(@opentelemetry/api@1.9.0)(@playwright/test@1.54.1)(babel-plugin-macros@3.1.0)(react-dom@19.1.1(react@19.1.1))(react@19.1.1)(sass@1.77.4))
graphql:
specifier: ^16.8.1
version: 16.9.0
@@ -2163,10 +2166,10 @@ importers:
version: 0.378.0(react@19.1.1)
next:
specifier: 15.4.4
version: 15.4.4(@babel/core@7.27.4)(@opentelemetry/api@1.9.0)(@playwright/test@1.54.1)(babel-plugin-macros@3.1.0)(react-dom@19.1.1(react@19.1.1))(react@19.1.1)(sass@1.77.4)
version: 15.4.4(@opentelemetry/api@1.9.0)(@playwright/test@1.54.1)(babel-plugin-macros@3.1.0)(babel-plugin-react-compiler@19.1.0-rc.3)(react-dom@19.1.1(react@19.1.1))(react@19.1.1)(sass@1.77.4)
next-sitemap:
specifier: ^4.2.3
version: 4.2.3(next@15.4.4(@babel/core@7.27.4)(@opentelemetry/api@1.9.0)(@playwright/test@1.54.1)(babel-plugin-macros@3.1.0)(react-dom@19.1.1(react@19.1.1))(react@19.1.1)(sass@1.77.4))
version: 4.2.3(next@15.4.4(@opentelemetry/api@1.9.0)(@playwright/test@1.54.1)(babel-plugin-macros@3.1.0)(react-dom@19.1.1(react@19.1.1))(react@19.1.1)(sass@1.77.4))
payload:
specifier: workspace:*
version: link:../../packages/payload
@@ -22020,13 +22023,13 @@ snapshots:
- encoding
- supports-color
geist@1.4.2(next@15.4.4(@babel/core@7.27.4)(@opentelemetry/api@1.9.0)(@playwright/test@1.54.1)(babel-plugin-macros@3.1.0)(react-dom@19.1.1(react@19.1.1))(react@19.1.1)(sass@1.77.4)):
geist@1.4.2(next@15.4.4(@opentelemetry/api@1.9.0)(@playwright/test@1.54.1)(babel-plugin-macros@3.1.0)(react-dom@19.1.1(react@19.1.1))(react@19.1.1)(sass@1.77.4)):
dependencies:
next: 15.4.4(@babel/core@7.27.4)(@opentelemetry/api@1.9.0)(@playwright/test@1.54.1)(babel-plugin-macros@3.1.0)(react-dom@19.1.1(react@19.1.1))(react@19.1.1)(sass@1.77.4)
next: 15.4.4(@opentelemetry/api@1.9.0)(@playwright/test@1.54.1)(babel-plugin-macros@3.1.0)(babel-plugin-react-compiler@19.1.0-rc.3)(react-dom@19.1.1(react@19.1.1))(react@19.1.1)(sass@1.77.4)
geist@1.4.2(next@15.5.4(@opentelemetry/api@1.9.0)(@playwright/test@1.50.0)(babel-plugin-macros@3.1.0)(react-dom@19.1.1(react@19.1.1))(react@19.1.1)(sass@1.77.4)):
geist@1.4.2(next@15.5.4(@babel/core@7.27.4)(@opentelemetry/api@1.9.0)(@playwright/test@1.50.0)(babel-plugin-macros@3.1.0)(react-dom@19.1.1(react@19.1.1))(react@19.1.1)(sass@1.77.4)):
dependencies:
next: 15.5.4(@opentelemetry/api@1.9.0)(@playwright/test@1.50.0)(babel-plugin-macros@3.1.0)(react-dom@19.1.1(react@19.1.1))(react@19.1.1)(sass@1.77.4)
next: 15.5.4(@babel/core@7.27.4)(@opentelemetry/api@1.9.0)(@playwright/test@1.50.0)(babel-plugin-macros@3.1.0)(react-dom@19.1.1(react@19.1.1))(react@19.1.1)(sass@1.77.4)
gel@2.0.1:
dependencies:
@@ -23884,13 +23887,13 @@ snapshots:
transitivePeerDependencies:
- supports-color
next-sitemap@4.2.3(next@15.4.4(@babel/core@7.27.4)(@opentelemetry/api@1.9.0)(@playwright/test@1.54.1)(babel-plugin-macros@3.1.0)(react-dom@19.1.1(react@19.1.1))(react@19.1.1)(sass@1.77.4)):
next-sitemap@4.2.3(next@15.4.4(@opentelemetry/api@1.9.0)(@playwright/test@1.54.1)(babel-plugin-macros@3.1.0)(react-dom@19.1.1(react@19.1.1))(react@19.1.1)(sass@1.77.4)):
dependencies:
'@corex/deepmerge': 4.0.43
'@next/env': 13.5.11
fast-glob: 3.3.2
minimist: 1.2.8
next: 15.4.4(@babel/core@7.27.4)(@opentelemetry/api@1.9.0)(@playwright/test@1.54.1)(babel-plugin-macros@3.1.0)(react-dom@19.1.1(react@19.1.1))(react@19.1.1)(sass@1.77.4)
next: 15.4.4(@opentelemetry/api@1.9.0)(@playwright/test@1.54.1)(babel-plugin-macros@3.1.0)(babel-plugin-react-compiler@19.1.0-rc.3)(react-dom@19.1.1(react@19.1.1))(react@19.1.1)(sass@1.77.4)
next-themes@0.4.6(react-dom@19.1.1(react@19.1.1))(react@19.1.1):
dependencies:
@@ -23954,32 +23957,6 @@ snapshots:
- '@babel/core'
- babel-plugin-macros
next@15.4.4(@babel/core@7.27.4)(@opentelemetry/api@1.9.0)(@playwright/test@1.54.1)(babel-plugin-macros@3.1.0)(react-dom@19.1.1(react@19.1.1))(react@19.1.1)(sass@1.77.4):
dependencies:
'@next/env': 15.4.4
'@swc/helpers': 0.5.15
caniuse-lite: 1.0.30001720
postcss: 8.4.31
react: 19.1.1
react-dom: 19.1.1(react@19.1.1)
styled-jsx: 5.1.6(@babel/core@7.27.4)(babel-plugin-macros@3.1.0)(react@19.1.1)
optionalDependencies:
'@next/swc-darwin-arm64': 15.4.4
'@next/swc-darwin-x64': 15.4.4
'@next/swc-linux-arm64-gnu': 15.4.4
'@next/swc-linux-arm64-musl': 15.4.4
'@next/swc-linux-x64-gnu': 15.4.4
'@next/swc-linux-x64-musl': 15.4.4
'@next/swc-win32-arm64-msvc': 15.4.4
'@next/swc-win32-x64-msvc': 15.4.4
'@opentelemetry/api': 1.9.0
'@playwright/test': 1.54.1
sass: 1.77.4
sharp: 0.34.3
transitivePeerDependencies:
- '@babel/core'
- babel-plugin-macros
next@15.4.4(@opentelemetry/api@1.9.0)(@playwright/test@1.54.1)(babel-plugin-macros@3.1.0)(babel-plugin-react-compiler@19.1.0-rc.3)(react-dom@19.1.1(react@19.1.1))(react@19.1.1)(sass@1.77.4):
dependencies:
'@next/env': 15.4.4
@@ -24007,7 +23984,7 @@ snapshots:
- '@babel/core'
- babel-plugin-macros
next@15.5.4(@opentelemetry/api@1.9.0)(@playwright/test@1.50.0)(babel-plugin-macros@3.1.0)(react-dom@19.1.1(react@19.1.1))(react@19.1.1)(sass@1.77.4):
next@15.5.4(@babel/core@7.27.4)(@opentelemetry/api@1.9.0)(@playwright/test@1.50.0)(babel-plugin-macros@3.1.0)(react-dom@19.1.1(react@19.1.1))(react@19.1.1)(sass@1.77.4):
dependencies:
'@next/env': 15.5.4
'@swc/helpers': 0.5.15

14
templates/ecommerce/README.md
View File

@@ -89,23 +89,23 @@ See the [Collections](https://payloadcms.com/docs/configuration/collections) doc
- ### Carts
Used to track user and guest carts within Payload. Added by the [ecommerce plugin](https://payloadcms.com/docs/plugins/ecommerce#carts).
Used to track user and guest carts within Payload. Added by the [ecommerce plugin](https://payloadcms.com/docs/ecommerce/plugin#carts).
- ### Addresses
Saves user's addresses for easier checkout. Added by the [ecommerce plugin](https://payloadcms.com/docs/plugins/ecommerce#addresses).
Saves user's addresses for easier checkout. Added by the [ecommerce plugin](https://payloadcms.com/docs/ecommerce/plugin#addresses).
- ### Orders
Tracks orders once a transaction successfully completes. Added by the [ecommerce plugin](https://payloadcms.com/docs/plugins/ecommerce#orders).
Tracks orders once a transaction successfully completes. Added by the [ecommerce plugin](https://payloadcms.com/docs/ecommerce/plugin#orders).
- ### Transactions
Tracks transactions from initiation to completion, once completed they will have a related Order item. Added by the [ecommerce plugin](https://payloadcms.com/docs/plugins/ecommerce#transactions).
Tracks transactions from initiation to completion, once completed they will have a related Order item. Added by the [ecommerce plugin](https://payloadcms.com/docs/ecommerce/plugin#transactions).
- ### Products and Variants
Primary collections for product details such as pricing per currency and optionally supports variants per product. Added by the [ecommerce plugin](https://payloadcms.com/docs/plugins/ecommerce#products).
Primary collections for product details such as pricing per currency and optionally supports variants per product. Added by the [ecommerce plugin](https://payloadcms.com/docs/ecommerce/plugin#products).
### Globals
@@ -187,7 +187,7 @@ An order is created only once a transaction is successfully completed. This is a
## Currencies
By default the template ships with support only for USD however you can change the supported currencies via the [plugin configuration](https://payloadcms.com/docs/plugins/ecommerce#currencies). You will need to ensure that the supported currencies in Payload are also configured in your Payment platforms.
By default the template ships with support only for USD however you can change the supported currencies via the [plugin configuration](https://payloadcms.com/docs/ecommerce/plugin#currencies). You will need to ensure that the supported currencies in Payload are also configured in your Payment platforms.
## Stripe
@@ -360,8 +360,6 @@ export default buildConfig({
// ...
```
There is also a simplified [one click deploy](https://github.com/payloadcms/payload/tree/templates/with-vercel-postgres) to Vercel should you need it.
### Self-hosting
Before deploying your app, you need to:

1
templates/ecommerce/package.json
View File

@@ -49,6 +49,7 @@
"embla-carousel-auto-scroll": "^8.1.5",
"embla-carousel-react": "^8.5.2",
"geist": "^1.3.0",
"graphql": "^16.8.2",
"jsonwebtoken": "9.0.1",
"lucide-react": "^0.477.0",
"next": "^15.5.4",