mirror of
https://github.com/vercel/commerce.git
synced 2025-05-15 22:16:58 +00:00
Comment out components not in use for now
This commit is contained in:
parent
35d4697016
commit
bcec144e68
@ -1,3 +1,5 @@
|
|||||||
|
// @ts-nocheck
|
||||||
|
|
||||||
'use client';
|
'use client';
|
||||||
|
|
||||||
import clsx from 'clsx';
|
import clsx from 'clsx';
|
||||||
|
@ -1,28 +1,28 @@
|
|||||||
'use client'
|
'use client';
|
||||||
|
|
||||||
import { Carousel, CarouselItem } from 'components/modules/carousel/carousel'
|
import { Carousel, CarouselItem } from 'components/modules/carousel/carousel';
|
||||||
import Price from 'components/product/price'
|
import Price from 'components/product/price';
|
||||||
import SanityImage from 'components/ui/sanity-image'
|
import SanityImage from 'components/ui/sanity-image';
|
||||||
import { Product } from "lib/storm/types/product"
|
import { Product } from 'lib/storm/types/product';
|
||||||
import { cn } from 'lib/utils'
|
import { cn } from 'lib/utils';
|
||||||
import { useTranslations } from 'next-intl'
|
import { useTranslations } from 'next-intl';
|
||||||
import dynamic from "next/dynamic"
|
import dynamic from 'next/dynamic';
|
||||||
import { AddToCart } from './add-to-cart'
|
const ProductCard = dynamic(() => import('components/ui/product-card'));
|
||||||
const ProductCard = dynamic(() => import('components/ui/product-card'))
|
const Text = dynamic(() => import('components/ui/text'));
|
||||||
const Text = dynamic(() => import('components/ui/text'))
|
|
||||||
interface ProductViewProps {
|
interface ProductViewProps {
|
||||||
product: Product
|
product: Product;
|
||||||
relatedProducts: Product[]
|
relatedProducts: Product[];
|
||||||
}
|
}
|
||||||
|
|
||||||
export default function ProductView({product, relatedProducts }: ProductViewProps) {
|
export default function ProductView({ product, relatedProducts }: ProductViewProps) {
|
||||||
const images = product.images
|
const images = product.images;
|
||||||
const t = useTranslations('product')
|
const t = useTranslations('product');
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="flex flex-col w-full mb-8 lg:my-16">
|
<div className="mb-8 flex w-full flex-col lg:my-16">
|
||||||
<div className={cn('relative grid items-start grid-cols-1 lg:px-8 lg:grid-cols-12 2xl:px-16')}>
|
<div
|
||||||
|
className={cn('relative grid grid-cols-1 items-start lg:grid-cols-12 lg:px-8 2xl:px-16')}
|
||||||
|
>
|
||||||
<div className="relative col-span-1 lg:col-span-7">
|
<div className="relative col-span-1 lg:col-span-7">
|
||||||
<div className={`pdp aspect-square lg:hidden`}>
|
<div className={`pdp aspect-square lg:hidden`}>
|
||||||
{images && (
|
{images && (
|
||||||
@ -35,8 +35,8 @@ export default function ProductView({product, relatedProducts }: ProductViewProp
|
|||||||
responsive={{
|
responsive={{
|
||||||
breakpoint: 1024,
|
breakpoint: 1024,
|
||||||
settings: {
|
settings: {
|
||||||
slidesToShow: 1,
|
slidesToShow: 1
|
||||||
},
|
}
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
{images.map((image: any, index: number) => (
|
{images.map((image: any, index: number) => (
|
||||||
@ -54,7 +54,7 @@ export default function ProductView({product, relatedProducts }: ProductViewProp
|
|||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="hidden lg:grid grid-cols-2 gap-4">
|
<div className="hidden grid-cols-2 gap-4 lg:grid">
|
||||||
{images.map((image: any, index: number) => (
|
{images.map((image: any, index: number) => (
|
||||||
<div key={index} className="first:col-span-2">
|
<div key={index} className="first:col-span-2">
|
||||||
<SanityImage
|
<SanityImage
|
||||||
@ -69,24 +69,19 @@ export default function ProductView({product, relatedProducts }: ProductViewProp
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="flex flex-col col-span-1 mx-auto px-4 py-6 w-full h-auto lg:col-span-5 lg:py-0 lg:px-8 lg:pr-0 2xl:px-16 2xl:pr-0 lg:sticky lg:top-8 2xl:top-16">
|
<div className="col-span-1 mx-auto flex h-auto w-full flex-col px-4 py-6 lg:sticky lg:top-8 lg:col-span-5 lg:px-8 lg:py-0 lg:pr-0 2xl:top-16 2xl:px-16 2xl:pr-0">
|
||||||
<Text variant={'productHeading'}>
|
<Text variant={'productHeading'}>{product.name}</Text>
|
||||||
{product.name}
|
|
||||||
</Text>
|
|
||||||
|
|
||||||
<Price
|
<Price
|
||||||
className='text-sm font-medium leading-tight lg:text-base'
|
className="text-sm font-medium leading-tight lg:text-base"
|
||||||
amount={`${product.price.value}`}
|
amount={`${product.price.value}`}
|
||||||
currencyCode={product.price.currencyCode ? product.price.currencyCode : 'SEK'}
|
currencyCode={product.price.currencyCode ? product.price.currencyCode : 'SEK'}
|
||||||
/>
|
/>
|
||||||
|
|
||||||
<AddToCart availableForSale={true} variants={[]} />
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{relatedProducts.length > 0 && (
|
{relatedProducts.length > 0 && (
|
||||||
<section className="flex flex-col my-16 lg:my-24">
|
<section className="my-16 flex flex-col lg:my-24">
|
||||||
<Text className="px-4 lg:px-8 2xl:px-16" variant="sectionHeading">
|
<Text className="px-4 lg:px-8 2xl:px-16" variant="sectionHeading">
|
||||||
{t('related')}
|
{t('related')}
|
||||||
</Text>
|
</Text>
|
||||||
@ -100,8 +95,8 @@ export default function ProductView({product, relatedProducts }: ProductViewProp
|
|||||||
responsive={{
|
responsive={{
|
||||||
breakpoint: 1024,
|
breakpoint: 1024,
|
||||||
settings: {
|
settings: {
|
||||||
slidesToShow: 4.5,
|
slidesToShow: 4.5
|
||||||
},
|
}
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
{relatedProducts.map((p) => (
|
{relatedProducts.map((p) => (
|
||||||
@ -113,5 +108,5 @@ export default function ProductView({product, relatedProducts }: ProductViewProp
|
|||||||
</section>
|
</section>
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
)
|
);
|
||||||
}
|
}
|
@ -1,3 +1,5 @@
|
|||||||
|
// @ts-nocheck
|
||||||
|
|
||||||
'use client';
|
'use client';
|
||||||
|
|
||||||
import clsx from 'clsx';
|
import clsx from 'clsx';
|
||||||
|
Loading…
x
Reference in New Issue
Block a user