prettier fix
This commit is contained in:
@@ -1,25 +1,23 @@
|
||||
"use client";
|
||||
'use client';
|
||||
|
||||
import { useState } from 'react';
|
||||
|
||||
import { formatCurrency } from '@/packages/shared/src/utils';
|
||||
import { StoreProduct } from '@medusajs/types';
|
||||
import { HeartPulse, Loader2, ShoppingCart } from 'lucide-react';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
|
||||
import { Button } from '@kit/ui/button';
|
||||
import {
|
||||
Card,
|
||||
CardHeader,
|
||||
CardFooter,
|
||||
CardDescription,
|
||||
} from '@kit/ui/card';
|
||||
import { StoreProduct } from '@medusajs/types';
|
||||
import { useState } from 'react';
|
||||
import { handleAddToCart } from '~/lib/services/medusaCart.service';
|
||||
import { InfoTooltip } from '@kit/shared/components/ui/info-tooltip';
|
||||
import { Trans } from '@kit/ui/trans';
|
||||
import { Button } from '@kit/ui/button';
|
||||
import { Card, CardDescription, CardFooter, CardHeader } from '@kit/ui/card';
|
||||
import { toast } from '@kit/ui/sonner';
|
||||
import { formatCurrency } from '@/packages/shared/src/utils';
|
||||
import { Trans } from '@kit/ui/trans';
|
||||
|
||||
import { handleAddToCart } from '~/lib/services/medusaCart.service';
|
||||
|
||||
export type OrderAnalysisCard = Pick<
|
||||
StoreProduct, 'title' | 'description' | 'subtitle'
|
||||
StoreProduct,
|
||||
'title' | 'description' | 'subtitle'
|
||||
> & {
|
||||
variant: { id: string };
|
||||
price: number | null;
|
||||
@@ -32,10 +30,13 @@ export default function OrderAnalysesCards({
|
||||
analyses: OrderAnalysisCard[];
|
||||
countryCode: string;
|
||||
}) {
|
||||
const {
|
||||
i18n: { language },
|
||||
} = useTranslation();
|
||||
|
||||
const { i18n: { language } } = useTranslation()
|
||||
|
||||
const [variantAddingToCart, setVariantAddingToCart] = useState<string | null>(null);
|
||||
const [variantAddingToCart, setVariantAddingToCart] = useState<string | null>(
|
||||
null,
|
||||
);
|
||||
const handleSelect = async (variantId: string) => {
|
||||
if (variantAddingToCart) {
|
||||
return null;
|
||||
@@ -54,24 +55,19 @@ export default function OrderAnalysesCards({
|
||||
setVariantAddingToCart(null);
|
||||
console.error(e);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="grid xs:grid-cols-3 gap-6 mt-4">
|
||||
{analyses.map(({
|
||||
title,
|
||||
variant,
|
||||
description,
|
||||
subtitle,
|
||||
price,
|
||||
}) => {
|
||||
const formattedPrice = typeof price === 'number'
|
||||
? formatCurrency({
|
||||
currencyCode: 'eur',
|
||||
locale: language,
|
||||
value: price,
|
||||
})
|
||||
: null;
|
||||
<div className="xs:grid-cols-3 mt-4 grid gap-6">
|
||||
{analyses.map(({ title, variant, description, subtitle, price }) => {
|
||||
const formattedPrice =
|
||||
typeof price === 'number'
|
||||
? formatCurrency({
|
||||
currencyCode: 'eur',
|
||||
locale: language,
|
||||
value: price,
|
||||
})
|
||||
: null;
|
||||
return (
|
||||
<Card
|
||||
key={title}
|
||||
@@ -80,23 +76,29 @@ export default function OrderAnalysesCards({
|
||||
>
|
||||
<CardHeader className="flex-row">
|
||||
<div
|
||||
className={'flex size-8 items-center-safe justify-center-safe rounded-full text-white bg-primary\/10 mb-6'}
|
||||
className={
|
||||
'bg-primary/10 mb-6 flex size-8 items-center-safe justify-center-safe rounded-full text-white'
|
||||
}
|
||||
>
|
||||
<HeartPulse className="size-4 fill-green-500" />
|
||||
</div>
|
||||
<div className='ml-auto flex size-8 items-center-safe justify-center-safe rounded-full text-white bg-warning'>
|
||||
<div className="bg-warning ml-auto flex size-8 items-center-safe justify-center-safe rounded-full text-white">
|
||||
<Button
|
||||
size="icon"
|
||||
variant="outline"
|
||||
className="px-2 text-black"
|
||||
onClick={() => handleSelect(variant.id)}
|
||||
>
|
||||
{variantAddingToCart === variant.id ? <Loader2 className="size-4 stroke-2 animate-spin" /> : <ShoppingCart className="size-4 stroke-2" />}
|
||||
{variantAddingToCart === variant.id ? (
|
||||
<Loader2 className="size-4 animate-spin stroke-2" />
|
||||
) : (
|
||||
<ShoppingCart className="size-4 stroke-2" />
|
||||
)}
|
||||
</Button>
|
||||
</div>
|
||||
</CardHeader>
|
||||
<CardFooter className="flex gap-2">
|
||||
<div className="flex flex-col items-start gap-2 flex-1">
|
||||
<div className="flex flex-1 flex-col items-start gap-2">
|
||||
<h5>
|
||||
{title}
|
||||
{description && (
|
||||
@@ -104,7 +106,7 @@ export default function OrderAnalysesCards({
|
||||
{' '}
|
||||
<InfoTooltip
|
||||
content={
|
||||
<div className='flex flex-col gap-2'>
|
||||
<div className="flex flex-col gap-2">
|
||||
<span>{formattedPrice}</span>
|
||||
<span>{description}</span>
|
||||
</div>
|
||||
@@ -113,11 +115,7 @@ export default function OrderAnalysesCards({
|
||||
</>
|
||||
)}
|
||||
</h5>
|
||||
{subtitle && (
|
||||
<CardDescription>
|
||||
{subtitle}
|
||||
</CardDescription>
|
||||
)}
|
||||
{subtitle && <CardDescription>{subtitle}</CardDescription>}
|
||||
</div>
|
||||
<div className="flex flex-col items-end gap-2 self-end text-sm">
|
||||
<span>{formattedPrice}</span>
|
||||
|
||||
Reference in New Issue
Block a user