crowetic/commerce
1
0
Fork 1
mirror of https://github.com/vercel/commerce.git synced 2025-03-14 22:42:33 +00:00
Code Issues Packages Projects Releases Wiki Activity

More corrections for useCart

Browse Source
This commit is contained in:
Luis Alvarez 2021-01-28 18:34:44 -05:00
parent 3e27b80658
commit 59a4535f0e
4 changed files with 17 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
components/common/UserNav/UserNav.tsx
View File

@ -13,15 +13,13 @@ interface Props {
className?: string
}
const countItem = (count: number, item: any) => count + item.quantity
const countItems = (count: number, items: any[]) =>
items.reduce(countItem, count)
const countItem = (count: number, item: LineItem) => count + item.quantity
const UserNav: FC<Props> = ({ className, children, ...props }) => {
const UserNav: FC<Props> = ({ className, children }) => {
const { data } = useCart()
const { data: customer } = useCustomer()
const { toggleSidebar, closeSidebarIfPresent, openModal } = useUI()
const itemsCount = Object.values(data?.line_items ?? {}).reduce(countItems, 0)
const itemsCount = data?.lineItems.reduce(countItem, 0) ?? 0
return (
<nav className={cn(s.root, className)}>

6
framework/bigcommerce/README.md
View File

@ -191,13 +191,11 @@ Returns the current cart data for use
...
import useCart from '@bigcommerce/storefront-data-hooks/cart/use-cart'
const countItem = (count: number, item: any) => count + item.quantity
const countItems = (count: number, items: any[]) =>
items.reduce(countItem, count)
const countItem = (count: number, item: LineItem) => count + item.quantity
const CartNumber = () => {
const { data } = useCart()
const itemsCount = Object.values(data?.line_items ?? {}).reduce(countItems, 0)
const itemsCount = data?.lineItems.reduce(countItem, 0) ?? 0
return itemsCount > 0 ? <span>{itemsCount}</span> : null
}

6
framework/commerce/types.d.ts vendored
View File

@ -79,9 +79,6 @@ interface BaseProductVariant {
sku: string
// The product variant’s title, or the product's name.
name: string
// Image associated with the product variant. Falls back to the product image
// if no image is available.
image: Image
// Whether a customer needs to provide a shipping address when placing
// an order for the product variant.
requiresShipping: boolean
@ -89,6 +86,9 @@ interface BaseProductVariant {
price: number
// Product variant’s price, as quoted by the manufacturer/distributor.
listPrice: number
// Image associated with the product variant. Falls back to the product image
// if no image is available.
image?: Image
// Indicates whether this product variant is in stock.
isInStock?: boolean
// Indicates if the product variant is available for sale.

15
pages/cart.tsx
View File

@ -28,14 +28,14 @@ export default function Cart() {
const { price: subTotal } = usePrice(
data && {
amount: Number(data.subTotal),
currencyCode: data.currency.code || 'USD',
amount: Number(data.subtotalPrice),
currencyCode: data.currency.code,
}
)
const { price: total } = usePrice(
data && {
amount: Number(data.total),
currencyCode: data.currency?.code || 'USD',
amount: Number(data.totalPrice),
currencyCode: data.currency.code,
}
)
@ -78,7 +78,7 @@ export default function Cart() {
<Text variant="pageHeading">My Cart</Text>
<Text variant="sectionHeading">Review your Order</Text>
<ul className="py-6 space-y-6 sm:py-0 sm:space-y-0 sm:divide-y sm:divide-accents-2 border-b border-accents-2">
{data?.items.map((item) => (
{data!.lineItems.map((item) => (
<CartItem
key={item.id}
item={item}
@ -93,7 +93,10 @@ export default function Cart() {
</Text>
<div className="flex py-6 space-x-6">
{[1, 2, 3, 4, 5, 6].map((x) => (
<div className="border border-accents-3 w-full h-24 bg-accents-2 bg-opacity-50 transform cursor-pointer hover:scale-110 duration-75" />
<div
key={x}
className="border border-accents-3 w-full h-24 bg-accents-2 bg-opacity-50 transform cursor-pointer hover:scale-110 duration-75"
/>
))}
</div>
</div>