diff --git a/src/components/products-item/list-item.jsx b/src/components/products-item/list-item.jsx index 67277a19..5b718b42 100644 --- a/src/components/products-item/list-item.jsx +++ b/src/components/products-item/list-item.jsx @@ -4,28 +4,41 @@ import React from 'react'; import type { HTMLElement } from 'types'; import styles from './list-item.css'; import { browserHistory } from 'react-router'; +import _ from 'lodash'; import Currency from 'ui/currency'; +type Image = { + alt?: string, + src: string, + title?: string, +}; + +type Album = { + name: string, + images: Array, +}; + type Product = { id: number, productId: number, context: string, title: string, description: string, - images: ?Array, salePrice: string, currency: string, + albums: ?Array, }; class ListItem extends React.Component { props: Product; render(): HTMLElement { - const {productId, title, images, salePrice, currency} = this.props; + const {productId, title, albums, salePrice, currency} = this.props; + const previewImage = _.get(albums, [0, 'images', 0, 'src']); - const image = images && images.length > 0 - ? + const image = previewImage + ? : null; const click = () => browserHistory.push(`/products/${productId}`); diff --git a/src/core/modules/product-details.js b/src/core/modules/product-details.js index 967a2ce4..ad4a9416 100644 --- a/src/core/modules/product-details.js +++ b/src/core/modules/product-details.js @@ -13,18 +13,21 @@ type Attribute = { type Attributes = { [key:string]: Attribute }; -type BakedProduct = { - id: number, - attributes: Attributes, - activeFrom?: string, - activeTo?: string, +type Image = { + alt?: string, + src: string, + title?: string, +}; + +type Album = { + name: string, + images: Array, }; -type BakedSku = { - code: string, +type Sku = { + id?: number, attributes: Attributes, - activeFrom?: string, - activeTo?: string, + albums: Array, }; type Context = { @@ -35,8 +38,9 @@ type Context = { export type ProductResponse = { id: number, context: Context, - product: BakedProduct, - skus: Array, + attributes: Attributes, + skus: Array, + albums: Array, }; export function getNextId(current: number): Function { diff --git a/src/pages/catalog/pdp.jsx b/src/pages/catalog/pdp.jsx index aaf501f5..86b6ef1e 100644 --- a/src/pages/catalog/pdp.jsx +++ b/src/pages/catalog/pdp.jsx @@ -133,13 +133,15 @@ class Pdp extends Component { } get product(): Product { - const product = _.get(this.props.product, 'product.attributes', {}); + const attributes = _.get(this.props.product, 'attributes', {}); const price = _.get(this.firstSku, 'attributes.salePrice.v', {}); + const images = _.get(this.props.product, ['albums', 0, 'images'], []); + const imageUrls = images.map(image => image.src); return { - title: _.get(product, 'title.v', ''), - description: _.get(product, 'description.v', ''), - images: _.get(product, 'images.v', []), + title: _.get(attributes, 'title.v', ''), + description: _.get(attributes, 'description.v', ''), + images: imageUrls, currency: _.get(price, 'currency', 'USD'), price: _.get(price, 'value', 0), };