forked from crowetic/commerce
Added usePrice to products in the landing
This commit is contained in:
parent
7d9dad9b0d
commit
af9dfe79d2
@ -1,10 +1,11 @@
|
|||||||
import React, { FC, ReactNode, Component } from 'react'
|
import React, { FC, ReactNode, Component } from 'react'
|
||||||
import cn from 'classnames'
|
import cn from 'classnames'
|
||||||
import s from './ProductCard.module.css'
|
|
||||||
import Link from 'next/link'
|
import Link from 'next/link'
|
||||||
|
import type { ProductNode } from '@lib/bigcommerce/api/operations/get-all-products'
|
||||||
|
import usePrice from '@lib/bigcommerce/use-price'
|
||||||
import { Heart } from '@components/icon'
|
import { Heart } from '@components/icon'
|
||||||
import { EnhancedImage } from '@components/core'
|
import { EnhancedImage } from '@components/core'
|
||||||
import type { ProductNode } from '@lib/bigcommerce/api/operations/get-all-products'
|
import s from './ProductCard.module.css'
|
||||||
|
|
||||||
interface Props {
|
interface Props {
|
||||||
className?: string
|
className?: string
|
||||||
@ -46,6 +47,12 @@ const ProductCard: FC<Props> = ({
|
|||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const { price } = usePrice({
|
||||||
|
amount: p.prices?.price?.value,
|
||||||
|
baseAmount: p.prices?.retailPrice?.value,
|
||||||
|
currencyCode: p.prices?.price?.currencyCode!,
|
||||||
|
})
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Link href={`product${p.path}`}>
|
<Link href={`product${p.path}`}>
|
||||||
<a
|
<a
|
||||||
@ -57,7 +64,7 @@ const ProductCard: FC<Props> = ({
|
|||||||
<h3 className={s.productTitle}>
|
<h3 className={s.productTitle}>
|
||||||
<span>{p.name}</span>
|
<span>{p.name}</span>
|
||||||
</h3>
|
</h3>
|
||||||
<span className={s.productPrice}>${p.prices?.price.value}</span>
|
<span className={s.productPrice}>{price}</span>
|
||||||
</div>
|
</div>
|
||||||
<div className={s.wishlistButton}>
|
<div className={s.wishlistButton}>
|
||||||
<Heart />
|
<Heart />
|
||||||
|
@ -51,6 +51,10 @@ export const productInfoFragment = /* GraphQL */ `
|
|||||||
value
|
value
|
||||||
currencyCode
|
currencyCode
|
||||||
}
|
}
|
||||||
|
retailPrice {
|
||||||
|
value
|
||||||
|
currencyCode
|
||||||
|
}
|
||||||
}
|
}
|
||||||
images {
|
images {
|
||||||
edges {
|
edges {
|
||||||
|
3
lib/bigcommerce/schema.d.ts
vendored
3
lib/bigcommerce/schema.d.ts
vendored
@ -1739,6 +1739,9 @@ export type ProductInfoFragment = { __typename?: 'Product' } & Pick<
|
|||||||
salePrice?: Maybe<
|
salePrice?: Maybe<
|
||||||
{ __typename?: 'Money' } & Pick<Money, 'value' | 'currencyCode'>
|
{ __typename?: 'Money' } & Pick<Money, 'value' | 'currencyCode'>
|
||||||
>
|
>
|
||||||
|
retailPrice?: Maybe<
|
||||||
|
{ __typename?: 'Money' } & Pick<Money, 'value' | 'currencyCode'>
|
||||||
|
>
|
||||||
}
|
}
|
||||||
>
|
>
|
||||||
images: { __typename?: 'ImageConnection' } & {
|
images: { __typename?: 'ImageConnection' } & {
|
||||||
|
Loading…
x
Reference in New Issue
Block a user