Update marketplace product card for updated WCCOM search API (#39689)

This commit is contained in:
And Finally 2023-08-17 08:59:46 +01:00 committed by GitHub
commit 6b1694f89b
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 13 additions and 10 deletions

View File

@ -9,7 +9,6 @@ import { Button, Card } from '@wordpress/components';
*/ */
import './product-card.scss'; import './product-card.scss';
import { Product } from '../product-list/types'; import { Product } from '../product-list/types';
import { getAdminSetting } from '../../../../client/utils/admin-settings';
import { appendUTMParams } from '../../utils/functions'; import { appendUTMParams } from '../../utils/functions';
export interface ProductCardProps { export interface ProductCardProps {
@ -19,7 +18,8 @@ export interface ProductCardProps {
function ProductCard( props: ProductCardProps ): JSX.Element { function ProductCard( props: ProductCardProps ): JSX.Element {
const { product } = props; const { product } = props;
const currencySymbol = getAdminSetting( 'currency' )?.symbol; // We hardcode this for now while we only display prices in USD.
const currencySymbol = '$';
// Append UTM parameters to the vendor URL // Append UTM parameters to the vendor URL
let vendorUrl = ''; let vendorUrl = '';
@ -76,12 +76,15 @@ function ProductCard( props: ProductCardProps ): JSX.Element {
variant="link" variant="link"
> >
<span> <span>
{ product.price === 0 || product.price === '0' {
? __( 'Free download', 'woocommerce' ) // '0' is a free product
: currencySymbol + product.price } product.price === 0
? __( 'Free download', 'woocommerce' )
: currencySymbol + product.price
}
</span> </span>
<span className="woocommerce-marketplace__product-card__price-billing"> <span className="woocommerce-marketplace__product-card__price-billing">
{ product.price === 0 || product.price === '0' { product.price === 0
? '' ? ''
: __( ' annually', 'woocommerce' ) } : __( ' annually', 'woocommerce' ) }
</span> </span>

View File

@ -5,6 +5,7 @@ export type SearchAPIProductType = {
link: string; link: string;
demo_url: string; demo_url: string;
price: string; price: string;
raw_price: number;
hash: string; hash: string;
slug: string; slug: string;
id: number; id: number;
@ -23,9 +24,8 @@ export interface Product {
vendorUrl: string; vendorUrl: string;
icon: string; icon: string;
url: string; url: string;
price: string | number; price: number;
productType?: string; productType?: string;
averageRating?: number | null; averageRating?: number | null;
reviewsCount?: number | null; reviewsCount?: number | null;
currency?: string;
} }

View File

@ -78,10 +78,10 @@ export function ProductListContextProvider(
vendorUrl: product.vendor_url, vendorUrl: product.vendor_url,
icon: product.icon, icon: product.icon,
url: product.link, url: product.link,
price: product.price, // Due to backwards compatibility, raw_price is from search API, price is from featured API
price: product.raw_price ?? product.price,
averageRating: product.rating ?? 0, averageRating: product.rating ?? 0,
reviewsCount: product.reviews_count ?? 0, reviewsCount: product.reviews_count ?? 0,
currency: '',
}; };
} }
); );