mirror of
https://github.com/vercel/commerce.git
synced 2025-07-30 13:41:22 +00:00
.github
.vscode
app
components
cart
grid
icons
layout
navbar
search
footer-menu.tsx
footer.tsx
product-grid-items.tsx
product
carousel.tsx
label.tsx
loading-dots.tsx
logo-square.tsx
opengraph-image.tsx
price.tsx
prose.tsx
e2e
fonts
lib
.env.example
.eslintrc.js
.gitignore
.nvmrc
.prettierignore
README.md
license.md
next.config.js
package.json
playwright.config.ts
pnpm-lock.yaml
postcss.config.js
prettier.config.js
tailwind.config.js
tsconfig.json
30 lines
956 B
TypeScript
30 lines
956 B
TypeScript
import Grid from 'components/grid';
|
|
import { GridTileImage } from 'components/grid/tile';
|
|
import { Product } from 'lib/shopify/types';
|
|
import Link from 'next/link';
|
|
|
|
export default function ProductGridItems({ products }: { products: Product[] }) {
|
|
return (
|
|
<>
|
|
{products.map((product) => (
|
|
<Grid.Item key={product.handle} className="animate-fadeIn">
|
|
<Link className="inline-block h-full w-full" href={`/product/${product.handle}`}>
|
|
<GridTileImage
|
|
alt={product.title}
|
|
labels={{
|
|
isSmall: true,
|
|
title: product.title,
|
|
amount: product.priceRange.maxVariantPrice.amount,
|
|
currencyCode: product.priceRange.maxVariantPrice.currencyCode
|
|
}}
|
|
src={product.featuredImage?.url}
|
|
width={600}
|
|
height={600}
|
|
/>
|
|
</Link>
|
|
</Grid.Item>
|
|
))}
|
|
</>
|
|
);
|
|
}
|