crowetic/commerce
1
0
Fork 1
mirror of https://github.com/vercel/commerce.git synced 2025-05-17 15:06:59 +00:00
Code Issues Packages Projects Releases Wiki Activity

Add Zoom into product view images

Browse Source
This commit is contained in:
Daniele Pancottini 2023-03-04 21:17:43 +01:00
parent 23a818a57a
commit 0d11232b3d
1 changed files with 2 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
site/components/product/ProductView/ProductView.tsx
View File

@ -12,6 +12,7 @@ import ProductSidebar from '../ProductSidebar'
import ProductTag from '../ProductTag' import ProductTag from '../ProductTag'
import ProductModel from '../ProductModel/ProductModel' import ProductModel from '../ProductModel/ProductModel'
import Lightbox from 'yet-another-react-lightbox' import Lightbox from 'yet-another-react-lightbox'
import Zoom from "yet-another-react-lightbox/plugins/zoom";
import 'yet-another-react-lightbox/styles.css' import 'yet-another-react-lightbox/styles.css'
import { useRouter } from 'next/router' import { useRouter } from 'next/router'
import random from 'lodash.random' import random from 'lodash.random'
@ -89,6 +90,7 @@ const ProductView: FC<ProductViewProps> = ({ product, relatedProducts }) => {
</ProductSlider> </ProductSlider>
<Lightbox <Lightbox
open={isLightboxOpen} open={isLightboxOpen}
plugins={[Zoom]}
close={() => setLightboxOpen(false)} close={() => setLightboxOpen(false)}
slides={product.images.map((image) => { slides={product.images.map((image) => {
return { return {