fix(admin-ui): TIP in shipping option creation (#5356)

* fix(admin-ui): TIP in shipping option creation

* Create six-pigs-return.md

.changeset/six-pigs-return.md

@@ -0,0 +1,6 @@
+---
+"@medusajs/admin-ui": patch
+"@medusajs/admin": patch
+---
+
+fix(admin-ui): TIP in shipping option creation

packages/admin-ui/ui/src/domain/settings/regions/components/shipping-option-form/use-shipping-option-form-data.tsx

@@ -6,6 +6,8 @@ import { useMemo } from "react"
 import { ShippingOptionFormType } from "."
 import { Option } from "../../../../../types/shared"
 import fulfillmentProvidersMapper from "../../../../../utils/fulfillment-providers.mapper"
+import { AdminPostShippingOptionsReq, Region } from "@medusajs/medusa"
+import { getSubmittableMetadata } from "../../../../../components/forms/general/metadata-form"
 
 type OptionType = {
   id: string
@@ -93,10 +95,42 @@ export const useShippingOptionFormData = (
     return requirements
   }
 
+  const getShippingOptionData = (
+    data: ShippingOptionFormType,
+    region: Region,
+    isReturn = false
+  ) => {
+    const { provider_id, data: fData } = getFulfillmentData(
+      data.fulfillment_provider!.value
+    )
+
+    const payload: AdminPostShippingOptionsReq = {
+      is_return: false,
+      region_id: region.id,
+      profile_id: data.shipping_profile?.value,
+      name: data.name!,
+      data: fData,
+      price_type: data.price_type!.value,
+      provider_id,
+      admin_only: !data.store_option,
+      amount: data.amount!,
+      requirements: getRequirementsData(data),
+      metadata: getSubmittableMetadata(data.metadata),
+    }
+
+    if (isReturn) {
+      payload.is_return = true
+      payload.price_type = "flat_rate"
+    }
+
+    return { payload }
+  }
+
   return {
     shippingProfileOptions,
     fulfillmentOptions,
     getFulfillmentData,
     getRequirementsData,
+    getShippingOptionData,
   }
 }

packages/admin-ui/ui/src/domain/settings/regions/edit/return-shipping-options/create-return-shipping-option.modal.tsx

@@ -2,7 +2,6 @@ import { Region } from "@medusajs/medusa"
 import { useAdminCreateShippingOption } from "medusa-react"
 import { useForm } from "react-hook-form"
 import { useTranslation } from "react-i18next"
-import { getSubmittableMetadata } from "../../../../../components/forms/general/metadata-form"
 import Button from "../../../../../components/fundamentals/button"
 import Modal from "../../../../../components/molecules/modal"
 import useNotification from "../../../../../hooks/use-notification"
@@ -11,6 +10,7 @@ import ShippingOptionForm, {
   ShippingOptionFormType,
 } from "../../components/shipping-option-form"
 import { useShippingOptionFormData } from "../../components/shipping-option-form/use-shipping-option-form-data"
+import { useFeatureFlag } from "../../../../../providers/feature-flag-provider"
 
 type Props = {
   open: boolean
@@ -27,10 +27,9 @@ const CreateReturnShippingOptionModal = ({ open, onClose, region }: Props) => {
     reset,
   } = form
   const { mutate, isLoading } = useAdminCreateShippingOption()
-  const { getFulfillmentData, getRequirementsData } = useShippingOptionFormData(
+  const { getShippingOptionData } = useShippingOptionFormData(region.id)
-    region.id
-  )
   const notifcation = useNotification()
+  const { isFeatureEnabled } = useFeatureFlag()
 
   const closeAndReset = () => {
     reset()
@@ -38,45 +37,32 @@ const CreateReturnShippingOptionModal = ({ open, onClose, region }: Props) => {
   }
 
   const onSubmit = handleSubmit((data) => {
-    const { provider_id, data: fData } = getFulfillmentData(
+    const { payload } = getShippingOptionData(data, region, true)
-      data.fulfillment_provider!.value
-    )
 
-    mutate(
+    if (isFeatureEnabled("tax_inclusive_pricing")) {
-      {
+      payload.includes_tax = region.includes_tax
-        is_return: true,
+    }
-        region_id: region.id,
+
-        name: data.name!,
+    mutate(payload, {
-        profile_id: data.shipping_profile?.value,
+      onSuccess: () => {
-        data: fData,
+        notifcation(
-        price_type: "flat_rate",
+          t("return-shipping-options-success", "Success"),
-        provider_id,
+          t(
-        admin_only: !data.store_option,
+            "return-shipping-options-shipping-option-created",
-        amount: data.amount!,
+            "Shipping option created"
-        requirements: getRequirementsData(data),
+          ),
-        metadata: getSubmittableMetadata(data.metadata),
+          "success"
+        )
+        closeAndReset()
       },
-      {
+      onError: (error) => {
-        onSuccess: () => {
+        notifcation(
-          notifcation(
+          t("return-shipping-options-error", "Error"),
-            t("return-shipping-options-success", "Success"),
+          getErrorMessage(error),
-            t(
+          "error"
-              "return-shipping-options-shipping-option-created",
+        )
-              "Shipping option created"
+      },
-            ),
+    })
-            "success"
-          )
-          closeAndReset()
-        },
-        onError: (error) => {
-          notifcation(
-            t("return-shipping-options-error", "Error"),
-            getErrorMessage(error),
-            "error"
-          )
-        },
-      }
-    )
   })
 
   return (

packages/admin-ui/ui/src/domain/settings/regions/edit/shipping-options/create-shipping-option-modal.tsx

@@ -1,8 +1,6 @@
-import { Region } from "@medusajs/medusa"
 import { useAdminCreateShippingOption } from "medusa-react"
 import { useForm } from "react-hook-form"
 import { useTranslation } from "react-i18next"
-import { getSubmittableMetadata } from "../../../../../components/forms/general/metadata-form"
 import Button from "../../../../../components/fundamentals/button"
 import Modal from "../../../../../components/molecules/modal"
 import useNotification from "../../../../../hooks/use-notification"
@@ -11,6 +9,8 @@ import ShippingOptionForm, {
   ShippingOptionFormType,
 } from "../../components/shipping-option-form"
 import { useShippingOptionFormData } from "../../components/shipping-option-form/use-shipping-option-form-data"
+import { useFeatureFlag } from "../../../../../providers/feature-flag-provider"
+import { Region } from "@medusajs/medusa"
 
 type Props = {
   open: boolean
@@ -21,15 +21,14 @@ type Props = {
 const CreateShippingOptionModal = ({ open, onClose, region }: Props) => {
   const { t } = useTranslation()
   const form = useForm<ShippingOptionFormType>()
+  const { isFeatureEnabled } = useFeatureFlag()
   const {
     formState: { isDirty },
     handleSubmit,
     reset,
   } = form
   const { mutate, isLoading } = useAdminCreateShippingOption()
-  const { getFulfillmentData, getRequirementsData } = useShippingOptionFormData(
+  const { getShippingOptionData } = useShippingOptionFormData(region.id)
-    region.id
-  )
   const notifcation = useNotification()
 
   const closeAndReset = () => {
@@ -38,45 +37,32 @@ const CreateShippingOptionModal = ({ open, onClose, region }: Props) => {
   }
 
   const onSubmit = handleSubmit((data) => {
-    const { provider_id, data: fData } = getFulfillmentData(
+    const { payload } = getShippingOptionData(data, region)
-      data.fulfillment_provider!.value
-    )
 
-    mutate(
+    if (isFeatureEnabled("tax_inclusive_pricing")) {
-      {
+      payload.includes_tax = region.includes_tax
-        is_return: false,
+    }
-        region_id: region.id,
+
-        profile_id: data.shipping_profile?.value,
+    mutate(payload, {
-        name: data.name!,
+      onSuccess: () => {
-        data: fData,
+        notifcation(
-        price_type: data.price_type!.value,
+          t("shipping-options-success", "Success"),
-        provider_id,
+          t(
-        admin_only: !data.store_option,
+            "shipping-options-shipping-option-created",
-        amount: data.amount!,
+            "Shipping option created"
-        requirements: getRequirementsData(data),
+          ),
-        metadata: getSubmittableMetadata(data.metadata),
+          "success"
+        )
+        closeAndReset()
       },
-      {
+      onError: (error) => {
-        onSuccess: () => {
+        notifcation(
-          notifcation(
+          t("shipping-options-error", "Error"),
-            t("shipping-options-success", "Success"),
+          getErrorMessage(error),
-            t(
+          "error"
-              "shipping-options-shipping-option-created",
+        )
-              "Shipping option created"
+      },
-            ),
+    })
-            "success"
-          )
-          closeAndReset()
-        },
-        onError: (error) => {
-          notifcation(
-            t("shipping-options-error", "Error"),
-            getErrorMessage(error),
-            "error"
-          )
-        },
-      }
-    )
   })
 
   return (