mirror of
https://github.com/vercel/commerce.git
synced 2025-07-05 04:31:22 +00:00
425 lines
7.5 KiB
TypeScript
425 lines
7.5 KiB
TypeScript
import { useState } from 'react'
|
|
import {
|
|
ButtonCommon,
|
|
CardItemCheckout,
|
|
Layout,
|
|
ModalCommon,
|
|
ModalConfirm,
|
|
ModalInfo,
|
|
ProductCarousel,
|
|
ProductList,
|
|
} from 'src/components/common'
|
|
import PaginationCommon from 'src/components/common/PaginationCommon/PaginationCommon'
|
|
import image5 from '../public/assets/images/image5.png'
|
|
import image6 from '../public/assets/images/image6.png'
|
|
import image7 from '../public/assets/images/image7.png'
|
|
import image8 from '../public/assets/images/image8.png'
|
|
const dataTest = [
|
|
{
|
|
name: 'Tomato',
|
|
weight: '250g',
|
|
category: 'VEGGIE',
|
|
price: 'Rp 27.500',
|
|
imageSrc: image7.src,
|
|
},
|
|
{
|
|
name: 'Tomato',
|
|
weight: '250g',
|
|
category: 'VEGGIE',
|
|
price: 'Rp 27.500',
|
|
imageSrc: image5.src,
|
|
},
|
|
{
|
|
name: 'Tomato',
|
|
weight: '250g',
|
|
category: 'VEGGIE',
|
|
price: 'Rp 27.500',
|
|
imageSrc: image5.src,
|
|
},
|
|
{
|
|
name: 'Tomato',
|
|
weight: '250g',
|
|
category: 'VEGGIE',
|
|
price: 'Rp 27.500',
|
|
imageSrc: image5.src,
|
|
},
|
|
{
|
|
name: 'Tomato',
|
|
weight: '250g',
|
|
category: 'VEGGIE',
|
|
price: 'Rp 27.500',
|
|
imageSrc: image5.src,
|
|
},
|
|
{
|
|
name: 'Tomato',
|
|
weight: '250g',
|
|
category: 'VEGGIE',
|
|
price: 'Rp 27.500',
|
|
imageSrc: image5.src,
|
|
},
|
|
{
|
|
name: 'Tomato',
|
|
weight: '250g',
|
|
category: 'VEGGIE',
|
|
price: 'Rp 27.500',
|
|
imageSrc: image5.src,
|
|
},
|
|
{
|
|
name: 'Tomato',
|
|
weight: '250g',
|
|
category: 'VEGGIE',
|
|
price: 'Rp 27.500',
|
|
imageSrc: image5.src,
|
|
},
|
|
{
|
|
name: 'Tomato',
|
|
weight: '250g',
|
|
category: 'VEGGIE',
|
|
price: 'Rp 27.500',
|
|
imageSrc: image5.src,
|
|
},
|
|
{
|
|
name: 'Tomato',
|
|
weight: '250g',
|
|
category: 'VEGGIE',
|
|
price: 'Rp 27.500',
|
|
imageSrc: image5.src,
|
|
},
|
|
{
|
|
name: 'Tomato',
|
|
weight: '250g',
|
|
category: 'VEGGIE',
|
|
price: 'Rp 27.500',
|
|
imageSrc: image5.src,
|
|
},
|
|
{
|
|
name: 'Tomato',
|
|
weight: '250g',
|
|
category: 'VEGGIE',
|
|
price: 'Rp 27.500',
|
|
imageSrc: image5.src,
|
|
},
|
|
{
|
|
name: 'Tomato',
|
|
weight: '250g',
|
|
category: 'VEGGIE',
|
|
price: 'Rp 27.500',
|
|
imageSrc: image5.src,
|
|
},
|
|
{
|
|
name: 'Tomato',
|
|
weight: '250g',
|
|
category: 'VEGGIE',
|
|
price: 'Rp 27.500',
|
|
imageSrc: image5.src,
|
|
},
|
|
{
|
|
name: 'Tomato',
|
|
weight: '250g',
|
|
category: 'VEGGIE',
|
|
price: 'Rp 27.500',
|
|
imageSrc: image5.src,
|
|
},
|
|
{
|
|
name: 'Tomato',
|
|
weight: '250g',
|
|
category: 'VEGGIE',
|
|
price: 'Rp 27.500',
|
|
imageSrc: image5.src,
|
|
},
|
|
{
|
|
name: 'Tomato',
|
|
weight: '250g',
|
|
category: 'VEGGIE',
|
|
price: 'Rp 27.500',
|
|
imageSrc: image5.src,
|
|
},
|
|
{
|
|
name: 'Tomato',
|
|
weight: '250g',
|
|
category: 'VEGGIE',
|
|
price: 'Rp 27.500',
|
|
imageSrc: image5.src,
|
|
},
|
|
{
|
|
name: 'Tomato',
|
|
weight: '250g',
|
|
category: 'VEGGIE',
|
|
price: 'Rp 27.500',
|
|
imageSrc: image5.src,
|
|
},
|
|
{
|
|
name: 'Tomato',
|
|
weight: '250g',
|
|
category: 'VEGGIE',
|
|
price: 'Rp 27.500',
|
|
imageSrc: image5.src,
|
|
},
|
|
{
|
|
name: 'Cucumber',
|
|
weight: '250g',
|
|
category: 'VEGGIE',
|
|
price: 'Rp 27.500',
|
|
imageSrc: image6.src,
|
|
},
|
|
{
|
|
name: 'Carrot',
|
|
weight: '250g',
|
|
category: 'VEGGIE',
|
|
price: 'Rp 27.500',
|
|
imageSrc: image7.src,
|
|
},
|
|
{
|
|
name: 'Salad',
|
|
weight: '250g',
|
|
category: 'VEGGIE',
|
|
price: 'Rp 27.500',
|
|
imageSrc: image8.src,
|
|
},
|
|
{
|
|
name: 'Tomato',
|
|
weight: '250g',
|
|
category: 'VEGGIE',
|
|
price: 'Rp 27.500',
|
|
imageSrc: image5.src,
|
|
},
|
|
{
|
|
name: 'Carrot',
|
|
weight: '250g',
|
|
category: 'VEGGIE',
|
|
price: 'Rp 27.500',
|
|
imageSrc: image7.src,
|
|
},
|
|
{
|
|
name: 'Salad',
|
|
weight: '250g',
|
|
category: 'VEGGIE',
|
|
price: 'Rp 27.500',
|
|
imageSrc: image8.src,
|
|
},
|
|
{
|
|
name: 'Tomato',
|
|
weight: '250g',
|
|
category: 'VEGGIE',
|
|
price: 'Rp 27.500',
|
|
imageSrc: image5.src,
|
|
},
|
|
{
|
|
name: 'Carrot',
|
|
weight: '250g',
|
|
category: 'VEGGIE',
|
|
price: 'Rp 27.500',
|
|
imageSrc: image7.src,
|
|
},
|
|
{
|
|
name: 'Salad',
|
|
weight: '250g',
|
|
category: 'VEGGIE',
|
|
price: 'Rp 27.500',
|
|
imageSrc: image8.src,
|
|
},
|
|
{
|
|
name: 'Tomato',
|
|
weight: '250g',
|
|
category: 'VEGGIE',
|
|
price: 'Rp 27.500',
|
|
imageSrc: image5.src,
|
|
},
|
|
{
|
|
name: 'Carrot',
|
|
weight: '250g',
|
|
category: 'VEGGIE',
|
|
price: 'Rp 27.500',
|
|
imageSrc: image7.src,
|
|
},
|
|
{
|
|
name: 'Salad',
|
|
weight: '250g',
|
|
category: 'VEGGIE',
|
|
price: 'Rp 27.500',
|
|
imageSrc: image8.src,
|
|
},
|
|
{
|
|
name: 'Tomato',
|
|
weight: '250g',
|
|
category: 'VEGGIE',
|
|
price: 'Rp 27.500',
|
|
imageSrc: image5.src,
|
|
},
|
|
{
|
|
name: 'Carrot',
|
|
weight: '250g',
|
|
category: 'VEGGIE',
|
|
price: 'Rp 27.500',
|
|
imageSrc: image7.src,
|
|
},
|
|
{
|
|
name: 'Salad',
|
|
weight: '250g',
|
|
category: 'VEGGIE',
|
|
price: 'Rp 27.500',
|
|
imageSrc: image8.src,
|
|
},
|
|
{
|
|
name: 'Tomato',
|
|
weight: '250g',
|
|
category: 'VEGGIE',
|
|
price: 'Rp 27.500',
|
|
imageSrc: image5.src,
|
|
},
|
|
{
|
|
name: 'Carrot',
|
|
weight: '250g',
|
|
category: 'VEGGIE',
|
|
price: 'Rp 27.500',
|
|
imageSrc: image7.src,
|
|
},
|
|
{
|
|
name: 'Salad',
|
|
weight: '250g',
|
|
category: 'VEGGIE',
|
|
price: 'Rp 27.500',
|
|
imageSrc: image8.src,
|
|
},
|
|
{
|
|
name: 'Tomato',
|
|
weight: '250g',
|
|
category: 'VEGGIE',
|
|
price: 'Rp 27.500',
|
|
imageSrc: image5.src,
|
|
},
|
|
{
|
|
name: 'Carrot',
|
|
weight: '250g',
|
|
category: 'VEGGIE',
|
|
price: 'Rp 27.500',
|
|
imageSrc: image7.src,
|
|
},
|
|
{
|
|
name: 'Salad',
|
|
weight: '250g',
|
|
category: 'VEGGIE',
|
|
price: 'Rp 27.500',
|
|
imageSrc: image8.src,
|
|
},
|
|
{
|
|
name: 'Tomato',
|
|
weight: '250g',
|
|
category: 'VEGGIE',
|
|
price: 'Rp 27.500',
|
|
imageSrc: image5.src,
|
|
},
|
|
{
|
|
name: 'Cucumber',
|
|
weight: '250g',
|
|
category: 'VEGGIE',
|
|
price: 'Rp 27.500',
|
|
imageSrc: image6.src,
|
|
},
|
|
{
|
|
name: 'Tomato',
|
|
weight: '250g',
|
|
category: 'VEGGIE',
|
|
price: 'Rp 27.500',
|
|
imageSrc: image5.src,
|
|
},
|
|
{
|
|
name: 'Cucumber',
|
|
weight: '250g',
|
|
category: 'VEGGIE',
|
|
price: 'Rp 27.500',
|
|
imageSrc: image6.src,
|
|
},
|
|
{
|
|
name: 'Carrot',
|
|
weight: '250g',
|
|
category: 'VEGGIE',
|
|
price: 'Rp 27.500',
|
|
imageSrc: image7.src,
|
|
},
|
|
{
|
|
name: 'Salad',
|
|
weight: '250g',
|
|
category: 'VEGGIE',
|
|
price: 'Rp 27.500',
|
|
imageSrc: image8.src,
|
|
},
|
|
{
|
|
name: 'Carrot',
|
|
weight: '250g',
|
|
category: 'VEGGIE',
|
|
price: 'Rp 27.500',
|
|
imageSrc: image7.src,
|
|
},
|
|
{
|
|
name: 'Salad',
|
|
weight: '250g',
|
|
category: 'VEGGIE',
|
|
price: 'Rp 27.500',
|
|
imageSrc: image8.src,
|
|
},
|
|
{
|
|
name: 'Carrot',
|
|
weight: '250g',
|
|
category: 'VEGGIE',
|
|
price: 'Rp 27.500',
|
|
imageSrc: image7.src,
|
|
},
|
|
{
|
|
name: 'Salad',
|
|
weight: '250g',
|
|
category: 'VEGGIE',
|
|
price: 'Rp 27.500',
|
|
imageSrc: image8.src,
|
|
},
|
|
{
|
|
name: 'Carrot',
|
|
weight: '250g',
|
|
category: 'VEGGIE',
|
|
price: 'Rp 27.500',
|
|
imageSrc: image7.src,
|
|
},
|
|
{
|
|
name: 'Salad',
|
|
weight: '250g',
|
|
category: 'VEGGIE',
|
|
price: 'Rp 27.500',
|
|
imageSrc: image8.src,
|
|
},
|
|
{
|
|
name: 'Tomato',
|
|
weight: '250g',
|
|
category: 'VEGGIE',
|
|
price: 'Rp 27.500',
|
|
imageSrc: image5.src,
|
|
},
|
|
{
|
|
name: 'Cucumber',
|
|
weight: '250g',
|
|
category: 'VEGGIE',
|
|
price: 'Rp 27.500',
|
|
imageSrc: image6.src,
|
|
},
|
|
]
|
|
export default function Test() {
|
|
const [visible, setVisible] = useState(false)
|
|
const onClose = () => {
|
|
setVisible(false)
|
|
}
|
|
const onOpen = () => {
|
|
setVisible(true)
|
|
}
|
|
return (
|
|
<>
|
|
<CardItemCheckout {...dataTest[0]} quantity={2}/>
|
|
<div className="w-full" >
|
|
<ButtonCommon>
|
|
test
|
|
</ButtonCommon>
|
|
</div>
|
|
</>
|
|
)
|
|
}
|
|
|
|
Test.Layout = Layout
|