@medusajs/dashboard 3.0.0-snapshot-20251104011621 → 3.0.0-snapshot-20251106181920

package/src/routes/products/product-create/components/product-create-details-form/components/product-create-details-variant-section/product-create-details-variant-section.tsx

@@ -1,32 +1,30 @@
-import { XMarkMini } from "@medusajs/icons"
 import {
   Alert,
-  Button,
   Checkbox,
   clx,
   Heading,
   Hint,
-  IconButton,
   InlineTip,
-  Input,
   Label,
   Text,
 } from "@medusajs/ui"
 import {
-  Controller,
   FieldArrayWithId,
   useFieldArray,
   UseFormReturn,
   useWatch,
 } from "react-hook-form"
 import { useTranslation } from "react-i18next"
+import { useMemo, useState } from "react"
 
 import { Form } from "../../../../../../../components/common/form"
 import { SortableList } from "../../../../../../../components/common/sortable-list"
 import { SwitchBox } from "../../../../../../../components/common/switch-box"
-import { ChipInput } from "../../../../../../../components/inputs/chip-input"
+import { Combobox } from "../../../../../../../components/inputs/combobox"
 import { ProductCreateSchemaType } from "../../../../types"
 import { decorateVariantsWithDefaultValues } from "../../../../utils"
+import { useProductOptions } from "../../../../../../../hooks/api"
+import { AdminProductOption } from "@medusajs/types"
 
 type ProductCreateVariantsSectionProps = {
   form: UseFormReturn<ProductCreateSchemaType>
@@ -65,11 +63,6 @@ export const ProductCreateVariantsSection = ({
 }: ProductCreateVariantsSectionProps) => {
   const { t } = useTranslation()
 
-  const options = useFieldArray({
-    control: form.control,
-    name: "options",
-  })
-
   const variants = useFieldArray({
     control: form.control,
     name: "variants",
@@ -97,90 +90,172 @@ export const ProductCreateVariantsSection = ({
   const showInvalidVariantsMessage =
     form.formState.errors.variants?.root?.message === "invalid_length"
 
-  const handleOptionValueUpdate = (index: number, value: string[]) => {
-    const { isTouched: hasUserSelectedVariants } =
-      form.getFieldState("variants")
-
-    const newOptions = [...watchedOptions]
-    newOptions[index].values = value
+  const { product_options = [], isLoading } = useProductOptions({
+    is_exclusive: false,
+  })
 
-    const permutations = getPermutations(
-      newOptions.filter(({ values }) => values.length)
+  const productOptionChoices = useMemo(() => {
+    return product_options.map((option) => ({
+      value: option.id,
+      label: option.title,
+    }))
+  }, [product_options])
+
+  const [selectedOptionIds, setSelectedOptionIds] = useState<string[]>([])
+  const [selectedOptionValues, setSelectedOptionValues] = useState<
+    Record<string, string[]>
+  >({})
+  const [customValues, setCustomValues] = useState<
+    Record<string, Array<{ id: string; value: string; rank: number }>>
+  >({})
+
+  const handleProductOptionSelect = (optionIds: string[]) => {
+    setSelectedOptionIds(optionIds)
+
+    // Initialize selected values for new options (select all by default)
+    const newSelectedValues: Record<string, string[]> = {}
+    const selectedProductOptions = product_options.filter((option) =>
+      optionIds.includes(option.id)
     )
-    const oldVariants = [...watchedVariants]
 
-    const findMatchingPermutation = (options: Record<string, string>) => {
-      return permutations.find((permutation) =>
-        Object.keys(options).every((key) => options[key] === permutation[key])
-      )
-    }
+    selectedProductOptions.forEach((option) => {
+      // If option was already selected, keep its current value selection
+      if (selectedOptionValues[option.id]) {
+        newSelectedValues[option.id] = selectedOptionValues[option.id]
+      } else {
+        // New option - select all values by default
+        newSelectedValues[option.id] = option.values?.map((v) => v.id) || []
+      }
+    })
 
-    const newVariants = oldVariants.reduce((variants, variant) => {
-      const match = findMatchingPermutation(variant.options)
+    setSelectedOptionValues(newSelectedValues)
+    updateFormWithSelectedValues(selectedProductOptions, newSelectedValues)
+  }
 
-      if (match) {
-        variants.push({
-          ...variant,
-          title: getVariantName(match),
-          options: match,
-        })
+  const handleValueChange = (optionId: string, valueIds: string[]) => {
+    // Ensure at least one value is selected
+    if (valueIds.length === 0) {
+      return
+    }
+
+    // Detect new custom values that aren't in the options yet
+    const allValues = getAllValuesForOption(optionId)
+    const existingValueIds = new Set(allValues.map((v) => v.id))
+
+    const validValueIds: string[] = []
+    const newCustomValues: string[] = []
+    valueIds.forEach((id) => {
+      if (existingValueIds.has(id)) {
+        validValueIds.push(id)
+      } else {
+        newCustomValues.push(id)
       }
+    })
 
-      return variants
-    }, [] as typeof oldVariants)
+    let updatedCustomValues = customValues
+    const updatedValidValueIds = [...validValueIds]
+    newCustomValues.forEach((newValue) => {
+      const tempId = `custom-${Date.now()}-${Math.random()}-${newValue}`
 
-    const usedPermutations = new Set(
-      newVariants.map((variant) => variant.options)
-    )
-    const unusedPermutations = permutations.filter(
-      (permutation) => !usedPermutations.has(permutation)
-    )
+      const existingCustom = updatedCustomValues[optionId] || []
+      const option = product_options.find((opt) => opt.id === optionId)
+      const existingValuesCount =
+        (option?.values?.length || 0) + existingCustom.length
+
+      const newCustomValue = {
+        id: tempId,
+        value: newValue,
+        rank: existingValuesCount + newCustomValues.indexOf(newValue),
+      }
 
-    unusedPermutations.forEach((permutation) => {
-      newVariants.push({
-        title: getVariantName(permutation),
-        options: permutation,
-        should_create: hasUserSelectedVariants ? false : true,
-        variant_rank: newVariants.length,
-        // NOTE - prepare inventory array here for now so we prevent rendering issue if we append the items later
-        inventory: [{ inventory_item_id: "", required_quantity: "" }],
-      })
+      updatedCustomValues = {
+        ...updatedCustomValues,
+        [optionId]: [...(updatedCustomValues[optionId] || []), newCustomValue],
+      }
+
+      updatedValidValueIds.push(tempId)
     })
 
-    form.setValue("variants", newVariants)
-  }
+    if (newCustomValues.length > 0) {
+      setCustomValues(updatedCustomValues)
+    }
 
-  const handleRemoveOption = (index: number) => {
-    if (index === 0) {
-      return
+    const updatedSelectedValues = {
+      ...selectedOptionValues,
+      [optionId]: updatedValidValueIds,
     }
 
-    options.remove(index)
+    setSelectedOptionValues(updatedSelectedValues)
 
-    const newOptions = [...watchedOptions]
-    newOptions.splice(index, 1)
-    const validOptionTitles = new Set(newOptions.map((option) => option.title))
+    const selectedProductOptions = product_options.filter((option) =>
+      selectedOptionIds.includes(option.id)
+    )
+    updateFormWithSelectedValues(
+      selectedProductOptions,
+      updatedSelectedValues,
+      newCustomValues.length > 0 ? updatedCustomValues : undefined
+    )
+  }
 
-    const permutations = getPermutations(newOptions)
-    const oldVariants = [...watchedVariants]
+  const getAllValuesForOption = (
+    optionId: string,
+    customVals?: Record<
+      string,
+      Array<{ id: string; value: string; rank: number }>
+    >
+  ) => {
+    const option = product_options.find((opt) => opt.id === optionId)
+    const existingValues = option?.values || []
+    const customForOption = (customVals || customValues)[optionId] || []
 
-    const newVariants = permutations.reduce((variants, permutation) => {
-      const variant = oldVariants.find(({ options }) =>
-        Object.keys(options)
-          .filter((option) => validOptionTitles.has(option))
-          .every((key) => options[key] === permutation[key])
-      )
+    return [...existingValues, ...customForOption]
+  }
 
-      if (variant) {
-        variants.push({
-          ...variant,
-          title: variant.title,
-          options: permutation,
+  const updateFormWithSelectedValues = (
+    selectedProductOptions: AdminProductOption[],
+    valueSelections: Record<string, string[]>,
+    customVals?: Record<
+      string,
+      Array<{
+        id: string
+        value: string
+        rank: number
+      }>
+    >
+  ) => {
+    const newOptions = selectedProductOptions.map((option) => {
+      const selectedValueIds = valueSelections[option.id] || []
+      const allValues = getAllValuesForOption(option.id, customVals)
+
+      const selectedValues = allValues
+        .filter((v) => selectedValueIds.includes(v.id))
+        .sort((a, b) => {
+          const rankA = a.rank ?? Number.MAX_VALUE
+          const rankB = b.rank ?? Number.MAX_VALUE
+          return rankA - rankB
         })
+        .map((v) => v.value)
+
+      return {
+        id: option.id,
+        title: option.title,
+        values: selectedValues,
       }
+    })
 
-      return variants
-    }, [] as typeof oldVariants)
+    form.setValue("options", newOptions)
+
+    const permutations = getPermutations(
+      newOptions.filter(({ values }) => values.length)
+    )
+
+    const newVariants = permutations.map((permutation, index) => ({
+      title: getVariantName(permutation),
+      options: permutation,
+      should_create: true,
+      variant_rank: index,
+      inventory: [{ inventory_item_id: "", required_quantity: "" }],
+    }))
 
     form.setValue("variants", newVariants)
   }
@@ -295,132 +370,73 @@ export const ProductCreateVariantsSection = ({
       {watchedAreVariantsEnabled && (
         <>
           <div className="flex flex-col gap-y-6">
-            <Form.Field
-              control={form.control}
-              name="options"
-              render={() => {
-                return (
-                  <Form.Item>
-                    <div className="flex flex-col gap-y-6">
-                      <div className="flex items-start justify-between gap-x-4">
-                        <div className="flex flex-col">
-                          <Form.Label>
-                            {t("products.create.variants.productOptions.label")}
-                          </Form.Label>
-                          <Form.Hint>
-                            {t("products.create.variants.productOptions.hint")}
-                          </Form.Hint>
-                        </div>
-                        <Button
-                          size="small"
-                          variant="secondary"
-                          type="button"
-                          onClick={() => {
-                            options.append({
-                              title: "",
-                              values: [],
-                            })
-                          }}
-                        >
-                          {t("actions.add")}
-                        </Button>
-                      </div>
-                      {showInvalidOptionsMessage && (
-                        <Alert dismissible variant="error">
-                          {t("products.create.errors.options")}
-                        </Alert>
-                      )}
-                      <ul className="flex flex-col gap-y-4">
-                        {options.fields.map((option, index) => {
-                          const hasError =
-                            !!form.formState.errors.options?.[index]
-                          return (
-                            <li
-                              key={option.id}
-                              className={clx(
-                                "bg-ui-bg-component shadow-elevation-card-rest grid grid-cols-[1fr_28px] items-center gap-1.5 rounded-xl p-1.5",
-                                {
-                                  "border-ui-border-error shadow-borders-error":
-                                    hasError,
-                                }
-                              )}
-                            >
-                              <div className="grid grid-cols-[min-content,1fr] items-center gap-1.5">
-                                <div className="flex items-center px-2 py-1.5">
-                                  <Label
-                                    size="xsmall"
-                                    weight="plus"
-                                    className="text-ui-fg-subtle"
-                                    htmlFor={`options.${index}.title`}
-                                  >
-                                    {t("fields.title")}
-                                  </Label>
-                                </div>
-                                <Input
-                                  className="bg-ui-bg-field-component hover:bg-ui-bg-field-component-hover"
-                                  {...form.register(
-                                    `options.${index}.title` as const
-                                  )}
-                                  placeholder={t(
-                                    "products.fields.options.optionTitlePlaceholder"
-                                  )}
-                                />
-                                <div className="flex items-center px-2 py-1.5">
-                                  <Label
-                                    size="xsmall"
-                                    weight="plus"
-                                    className="text-ui-fg-subtle"
-                                    htmlFor={`options.${index}.values`}
-                                  >
-                                    {t("fields.values")}
-                                  </Label>
-                                </div>
-                                <Controller
-                                  control={form.control}
-                                  name={`options.${index}.values` as const}
-                                  render={({
-                                    field: { onChange, ...field },
-                                  }) => {
-                                    const handleValueChange = (
-                                      value: string[]
-                                    ) => {
-                                      handleOptionValueUpdate(index, value)
-                                      onChange(value)
-                                    }
-
-                                    return (
-                                      <ChipInput
-                                        {...field}
-                                        variant="contrast"
-                                        onChange={handleValueChange}
-                                        placeholder={t(
-                                          "products.fields.options.variantionsPlaceholder"
-                                        )}
-                                      />
-                                    )
-                                  }}
-                                />
-                              </div>
-                              <IconButton
-                                type="button"
-                                size="small"
-                                variant="transparent"
-                                className="text-ui-fg-muted"
-                                disabled={index === 0}
-                                onClick={() => handleRemoveOption(index)}
-                              >
-                                <XMarkMini />
-                              </IconButton>
-                            </li>
-                          )
-                        })}
-                      </ul>
-                    </div>
-                  </Form.Item>
-                )
-              }}
+            <div className="flex flex-col">
+              <Label weight="plus">
+                {t("products.create.variants.productOptions.label")}
+              </Label>
+              <Hint>{t("products.create.variants.productOptions.hint")}</Hint>
+            </div>
+            {showInvalidOptionsMessage && (
+              <Alert dismissible variant="error">
+                {t("products.create.errors.options")}
+              </Alert>
+            )}
+            <Combobox
+              value={selectedOptionIds}
+              onChange={(value) => handleProductOptionSelect(value as string[])}
+              options={productOptionChoices}
+              placeholder={t("products.fields.options.optionTitlePlaceholder")}
+              disabled={isLoading}
             />
           </div>
+          {selectedOptionIds.length > 0 && (
+            <div className="flex flex-col gap-y-4">
+              <div className="flex flex-col">
+                <Label weight="plus">{t("fields.values")}</Label>
+                <Hint>{t("products.create.variants.selectValuesHint")}</Hint>
+              </div>
+              <div className="flex flex-col gap-y-3">
+                {product_options
+                  .filter((option) => selectedOptionIds.includes(option.id))
+                  .map((option) => {
+                    // Get all values (existing + custom) for this option
+                    const allValues = getAllValuesForOption(option.id)
+
+                    const valueOptions = allValues
+                      .sort((a, b) => {
+                        const rankA = a.rank ?? Number.MAX_VALUE
+                        const rankB = b.rank ?? Number.MAX_VALUE
+                        return rankA - rankB
+                      })
+                      .map((v) => ({
+                        value: v.id,
+                        label: v.value,
+                      }))
+
+                    return (
+                      <div key={option.id} className="flex flex-col gap-y-2">
+                        <Label size="small" weight="plus">
+                          {option.title}
+                        </Label>
+                        <Combobox
+                          value={selectedOptionValues[option.id] || []}
+                          onChange={(value) =>
+                            handleValueChange(option.id, value as string[])
+                          }
+                          onCreateOption={(_) => {
+                            // Nothing
+                          }}
+                          options={valueOptions}
+                          placeholder={t(
+                            "products.fields.options.variantionsPlaceholder"
+                          )}
+                        />
+                      </div>
+                    )
+                  })}
+              </div>
+            </div>
+          )}
           <div className="grid grid-cols-1 gap-x-4 gap-y-8">
             <div className="flex flex-col gap-y-6">
               <div className="flex flex-col">

package/src/routes/products/product-create/components/product-create-form/product-create-form.tsx

@@ -78,13 +78,10 @@ export const ProductCreateForm = ({
       return {}
     }
 
-    return regions.reduce(
-      (acc, reg) => {
-        acc[reg.id] = reg.currency_code
-        return acc
-      },
-      {} as Record<string, string>
-    )
+    return regions.reduce((acc, reg) => {
+      acc[reg.id] = reg.currency_code
+      return acc
+    }, {} as Record<string, string>)
   }, [regions])
 
   /**

package/src/routes/products/product-create/constants.ts

@@ -47,6 +47,7 @@ export type ProductCreateVariantSchema = z.infer<
 >
 
 const ProductCreateOptionSchema = z.object({
+  id: z.string().optional(),
   title: z.string(),
   values: z.array(z.string()).min(1),
 })

package/src/routes/products/product-create/utils.ts

@@ -13,6 +13,8 @@ export const normalizeProductFormValues = (
     ?.filter((media) => !media.isThumbnail)
     .map((media) => ({ url: media.url }))
 
+  const options = values.options.filter((o) => o.title) // clean temp. values
+
   return {
     status: values.status,
     is_giftcard: false,
@@ -41,7 +43,10 @@ export const normalizeProductFormValues = (
     length: values.length ? parseFloat(values.length) : undefined,
     height: values.height ? parseFloat(values.height) : undefined,
     weight: values.weight ? parseFloat(values.weight) : undefined,
-    options: values.options.filter((o) => o.title), // clean temp. values
+    options: options.map((option) => {
+      const { id, ...rest } = option
+      return id ? { id } : rest
+    }),
     variants: normalizeVariants(
       values.variants.filter((variant) => variant.should_create),
       values.regionsCurrencyMap

package/src/routes/products/product-detail/components/product-option-section/product-option-section.tsx

@@ -1,38 +1,16 @@
-import { PencilSquare, Plus, Trash } from "@medusajs/icons"
-import { Badge, Container, Heading, usePrompt } from "@medusajs/ui"
+import { PencilSquare } from "@medusajs/icons"
+import { Badge, Container, Heading } from "@medusajs/ui"
 import { useTranslation } from "react-i18next"
 import { ActionMenu } from "../../../../../components/common/action-menu"
 import { SectionRow } from "../../../../../components/common/section"
-import { useDeleteProductOption } from "../../../../../hooks/api/products"
 import { HttpTypes } from "@medusajs/types"
 
 const OptionActions = ({
-  product,
   option,
 }: {
-  product: HttpTypes.AdminProduct
   option: HttpTypes.AdminProductOption
 }) => {
   const { t } = useTranslation()
-  const { mutateAsync } = useDeleteProductOption(product.id, option.id)
-  const prompt = usePrompt()
-
-  const handleDelete = async () => {
-    const res = await prompt({
-      title: t("general.areYouSure"),
-      description: t("products.options.deleteWarning", {
-        title: option.title,
-      }),
-      confirmText: t("actions.delete"),
-      cancelText: t("actions.cancel"),
-    })
-
-    if (!res) {
-      return
-    }
-
-    await mutateAsync()
-  }
 
   return (
     <ActionMenu
@@ -41,20 +19,11 @@ const OptionActions = ({
           actions: [
             {
               label: t("actions.edit"),
-              to: `options/${option.id}/edit`,
+              to: `/product-options/${option.id}/edit`,
               icon: <PencilSquare />,
             },
           ],
         },
-        {
-          actions: [
-            {
-              label: t("actions.delete"),
-              onClick: handleDelete,
-              icon: <Trash />,
-            },
-          ],
-        },
       ]}
     />
   )
@@ -78,9 +47,9 @@ export const ProductOptionSection = ({
             {
               actions: [
                 {
-                  label: t("actions.create"),
-                  to: "options/create",
-                  icon: <Plus />,
+                  label: t("actions.manage"),
+                  to: "options/manage",
+                  icon: <PencilSquare />,
                 },
               ],
             },
@@ -104,7 +73,7 @@ export const ProductOptionSection = ({
                 </Badge>
               )
             })}
-            actions={<OptionActions product={product} option={option} />}
+            actions={<OptionActions option={option} />}
           />
         )
       })}

package/src/routes/products/product-import/helpers/import-template.ts

@@ -1,11 +1,11 @@
 const ProductImportCSV =
   "data:text/csv;charset=utf-8," +
-  `Product Id,Product Handle,Product Title,Product Subtitle,Product Description,Product Status,Product Thumbnail,Product Weight,Product Length,Product Width,Product Height,Product HS Code,Product Origin Country,Product MID Code,Product Material,Product Collection Id,Product Type Id,Product Tag 1,Product Discountable,Product External Id,Variant Id,Variant Title,Variant SKU,Variant Barcode,Variant Allow Backorder,Variant Manage Inventory,Variant Weight,Variant Length,Variant Width,Variant Height,Variant HS Code,Variant Origin Country,Variant MID Code,Variant Material,Variant Price EUR,Variant Price USD,Variant Option 1 Name,Variant Option 1 Value,Product Image 1 Url,Product Image 2 Url
-,coffee-mug-v3,Medusa Coffee Mug,,Every programmer's best friend.,published,https://medusa-public-images.s3.eu-west-1.amazonaws.com/coffee-mug.png,400,,,,,,,,,,,TRUE,,,One Size,,,FALSE,TRUE,,,,,,,,,10,12,Size,One Size,https://medusa-public-images.s3.eu-west-1.amazonaws.com/coffee-mug.png,
-,sweatpants-v2,Medusa Sweatpants,,"Reimagine the feeling of classic sweatpants. With our cotton sweatpants, everyday essentials no longer have to be ordinary.",published,https://medusa-public-images.s3.eu-west-1.amazonaws.com/sweatpants-gray-front.png,400,,,,,,,,,,,TRUE,,,S,,,FALSE,TRUE,,,,,,,,,29.5,33.5,Size,S,https://medusa-public-images.s3.eu-west-1.amazonaws.com/sweatpants-gray-front.png,https://medusa-public-images.s3.eu-west-1.amazonaws.com/sweatpants-gray-back.png
-,sweatpants-v2,Medusa Sweatpants,,"Reimagine the feeling of classic sweatpants. With our cotton sweatpants, everyday essentials no longer have to be ordinary.",published,https://medusa-public-images.s3.eu-west-1.amazonaws.com/sweatpants-gray-front.png,400,,,,,,,,,,,TRUE,,,M,,,FALSE,TRUE,,,,,,,,,29.5,33.5,Size,M,https://medusa-public-images.s3.eu-west-1.amazonaws.com/sweatpants-gray-front.png,https://medusa-public-images.s3.eu-west-1.amazonaws.com/sweatpants-gray-back.png
-,sweatpants-v2,Medusa Sweatpants,,"Reimagine the feeling of classic sweatpants. With our cotton sweatpants, everyday essentials no longer have to be ordinary.",published,https://medusa-public-images.s3.eu-west-1.amazonaws.com/sweatpants-gray-front.png,400,,,,,,,,,,,TRUE,,,L,,,FALSE,TRUE,,,,,,,,,29.5,33.5,Size,L,https://medusa-public-images.s3.eu-west-1.amazonaws.com/sweatpants-gray-front.png,https://medusa-public-images.s3.eu-west-1.amazonaws.com/sweatpants-gray-back.png
-,sweatpants-v2,Medusa Sweatpants,,"Reimagine the feeling of classic sweatpants. With our cotton sweatpants, everyday essentials no longer have to be ordinary.",published,https://medusa-public-images.s3.eu-west-1.amazonaws.com/sweatpants-gray-front.png,400,,,,,,,,,,,TRUE,,,XL,,,FALSE,TRUE,,,,,,,,,29.5,33.5,Size,XL,https://medusa-public-images.s3.eu-west-1.amazonaws.com/sweatpants-gray-front.png,https://medusa-public-images.s3.eu-west-1.amazonaws.com/sweatpants-gray-back.png`
+  `Product Id,Product Handle,Product Title,Product Subtitle,Product Description,Product Status,Product Thumbnail,Product Weight,Product Length,Product Width,Product Height,Product HS Code,Product Origin Country,Product MID Code,Product Material,Shipping Profile Id,Product Sales Channel 1,Product Collection Id,Product Type Id,Product Tag 1,Product Discountable,Product External Id,Variant Id,Variant Title,Variant SKU,Variant Barcode,Variant Allow Backorder,Variant Manage Inventory,Variant Weight,Variant Length,Variant Width,Variant Height,Variant HS Code,Variant Origin Country,Variant MID Code,Variant Material,Variant Price EUR,Variant Price USD,Variant Option 1 Name,Variant Option 1 Value,Product Image 1 Url,Product Image 2 Url
+,coffee-mug-v3,Medusa Coffee Mug,,Every programmer's best friend.,published,https://medusa-public-images.s3.eu-west-1.amazonaws.com/coffee-mug.png,400,,,,,,,,,,,,,TRUE,,,One Size,,,FALSE,TRUE,,,,,,,,,10,12,Size,One Size,https://medusa-public-images.s3.eu-west-1.amazonaws.com/coffee-mug.png,
+,sweatpants-v2,Medusa Sweatpants,,"Reimagine the feeling of classic sweatpants. With our cotton sweatpants, everyday essentials no longer have to be ordinary.",published,https://medusa-public-images.s3.eu-west-1.amazonaws.com/sweatpants-gray-front.png,400,,,,,,,,,,,,,TRUE,,,S,,,FALSE,TRUE,,,,,,,,,29.5,33.5,Size,S,https://medusa-public-images.s3.eu-west-1.amazonaws.com/sweatpants-gray-front.png,https://medusa-public-images.s3.eu-west-1.amazonaws.com/sweatpants-gray-back.png
+,sweatpants-v2,Medusa Sweatpants,,"Reimagine the feeling of classic sweatpants. With our cotton sweatpants, everyday essentials no longer have to be ordinary.",published,https://medusa-public-images.s3.eu-west-1.amazonaws.com/sweatpants-gray-front.png,400,,,,,,,,,,,,,TRUE,,,M,,,FALSE,TRUE,,,,,,,,,29.5,33.5,Size,M,https://medusa-public-images.s3.eu-west-1.amazonaws.com/sweatpants-gray-front.png,https://medusa-public-images.s3.eu-west-1.amazonaws.com/sweatpants-gray-back.png
+,sweatpants-v2,Medusa Sweatpants,,"Reimagine the feeling of classic sweatpants. With our cotton sweatpants, everyday essentials no longer have to be ordinary.",published,https://medusa-public-images.s3.eu-west-1.amazonaws.com/sweatpants-gray-front.png,400,,,,,,,,,,,,,TRUE,,,L,,,FALSE,TRUE,,,,,,,,,29.5,33.5,Size,L,https://medusa-public-images.s3.eu-west-1.amazonaws.com/sweatpants-gray-front.png,https://medusa-public-images.s3.eu-west-1.amazonaws.com/sweatpants-gray-back.png
+,sweatpants-v2,Medusa Sweatpants,,"Reimagine the feeling of classic sweatpants. With our cotton sweatpants, everyday essentials no longer have to be ordinary.",published,https://medusa-public-images.s3.eu-west-1.amazonaws.com/sweatpants-gray-front.png,400,,,,,,,,,,,,,TRUE,,,XL,,,FALSE,TRUE,,,,,,,,,29.5,33.5,Size,XL,https://medusa-public-images.s3.eu-west-1.amazonaws.com/sweatpants-gray-front.png,https://medusa-public-images.s3.eu-west-1.amazonaws.com/sweatpants-gray-back.png`
 
 export const getProductImportCsvTemplate = () => {
   return encodeURI(ProductImportCSV)

package/src/routes/products/product-options-manage/components/product-options-manage-form/index.ts

@@ -0,0 +1 @@
+export { ProductOptionsManageForm } from "./product-options-manage-form"