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

Comment out components not in use for now

Browse Source
This commit is contained in:
Henrik Larsson 2023-05-23 08:40:45 +02:00
parent 35d4697016
commit bcec144e68
3 changed files with 36 additions and 37 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
components/product/add-to-cart.tsx
View File

@ -1,3 +1,5 @@
// @ts-nocheck
'use client'; 'use client';
import clsx from 'clsx'; import clsx from 'clsx';

61
components/product/product-view.tsx
View File

@ -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>
) );
} }

2
components/product/variant-selector.tsx
View File

@ -1,3 +1,5 @@
// @ts-nocheck
'use client'; 'use client';
import clsx from 'clsx'; import clsx from 'clsx';