forked from crowetic/commerce
Added Image Component to ProductView
This commit is contained in:
parent
509ba95bc9
commit
b3cf225275
@ -1,5 +1,6 @@
|
|||||||
import { FC, useState, useEffect } from 'react'
|
import { FC, useState, useEffect } from 'react'
|
||||||
import cn from 'classnames'
|
import cn from 'classnames'
|
||||||
|
import Image from 'next/image'
|
||||||
import { NextSeo } from 'next-seo'
|
import { NextSeo } from 'next-seo'
|
||||||
import type { ProductNode } from '@lib/bigcommerce/api/operations/get-product'
|
import type { ProductNode } from '@lib/bigcommerce/api/operations/get-product'
|
||||||
import useAddItem from '@lib/bigcommerce/cart/use-add-item'
|
import useAddItem from '@lib/bigcommerce/cart/use-add-item'
|
||||||
@ -86,11 +87,12 @@ const ProductView: FC<Props> = ({ product, className }) => {
|
|||||||
<ProductSlider>
|
<ProductSlider>
|
||||||
{/** TODO: Change with Image Component **/}
|
{/** TODO: Change with Image Component **/}
|
||||||
{product.images.edges?.map((image, i) => (
|
{product.images.edges?.map((image, i) => (
|
||||||
<img
|
<Image
|
||||||
key={image?.node.urlSmall}
|
key={image?.node.urlOriginal}
|
||||||
className={s.img}
|
src={getPathname(image?.node.urlOriginal!)}
|
||||||
src={image?.node.urlXL}
|
width={1200}
|
||||||
loading={i === 0 ? 'eager' : 'lazy'}
|
height={1200}
|
||||||
|
priority={i === 0}
|
||||||
/>
|
/>
|
||||||
))}
|
))}
|
||||||
</ProductSlider>
|
</ProductSlider>
|
||||||
|
Loading…
x
Reference in New Issue
Block a user