feat(MED-121): use age+sex specific analysis package variants

app/home/(user)/_components/order-analyses-cards.tsx

@@ -9,30 +9,39 @@ import {
   CardFooter,
   CardDescription,
 } from '@kit/ui/card';
-import { StoreProduct, StoreProductVariant } from '@medusajs/types';
+import { StoreProduct } from '@medusajs/types';
 import { useState } from 'react';
 import { handleAddToCart } from '~/lib/services/medusaCart.service';
 import { useRouter } from 'next/navigation';
 import { InfoTooltip } from '@kit/shared/components/ui/info-tooltip';
 import { Trans } from '@kit/ui/trans';
 
+export type OrderAnalysisCard = Pick<
+  StoreProduct, 'title' | 'description' | 'subtitle'
+> & {
+  isAvailable: boolean;
+  variant: { id: string };
+};
+
 export default function OrderAnalysesCards({
   analyses,
   countryCode,
 }: {
-  analyses: StoreProduct[];
+  analyses: OrderAnalysisCard[];
   countryCode: string;
 }) {
   const router = useRouter();
 
   const [isAddingToCart, setIsAddingToCart] = useState(false);
-  const handleSelect = async (selectedVariant: StoreProductVariant) => {
-    if (!selectedVariant?.id || isAddingToCart) return null
+  const handleSelect = async (variantId: string) => {
+    if (isAddingToCart) {
+      return null;
+    }
 
     setIsAddingToCart(true);
     try {
       await handleAddToCart({
-        selectedVariant,
+        selectedVariant: { id: variantId },
         countryCode,
       });
       setIsAddingToCart(false);
@@ -47,13 +56,11 @@ export default function OrderAnalysesCards({
     <div className="grid grid-cols-3 gap-6 mt-4">
       {analyses.map(({
         title,
-        variants,
+        variant,
         description,
         subtitle,
-        status,
-        metadata,
+        isAvailable,
       }) => {
-        const isAvailable = status === 'published' && !!metadata?.analysisIdOriginal;
         return (
           <Card
             key={title}
@@ -72,7 +79,7 @@ export default function OrderAnalysesCards({
                     size="icon"
                     variant="outline"
                     className="px-2 text-black"
-                    onClick={() => handleSelect(variants![0]!)}
+                    onClick={() => handleSelect(variant.id)}
                   >
                     {isAddingToCart ? <Loader2 className="size-4 stroke-2 animate-spin" /> : <ShoppingCart className="size-4 stroke-2" />}
                   </Button>