@medusajs/dashboard 3.0.0-preview-20250211091350 → 3.0.0-preview-20250406180144

package/src/routes/orders/order-create-fulfillment/components/order-create-fulfillment-form/order-create-fulfillment-form.tsx

@@ -111,30 +111,35 @@ export function OrderCreateFulfillmentForm({
       return
     }
 
-    const selectedShippingProfileId =
-      selectedShippingOption?.shipping_profile_id
-
-    const itemShippingProfileMap = order.items.reduce(
-      (acc, item) => {
+    let items = Object.entries(data.quantity)
+      .map(([id, quantity]) => ({
+        id,
+        quantity,
+      }))
+      .filter(({ quantity }) => !!quantity)
+
+    /**
+     * If items require shipping fulfill only items with matching shipping profile.
+     */
+    if (requiresShipping) {
+      const selectedShippingProfileId =
+        selectedShippingOption?.shipping_profile_id
+
+      const itemShippingProfileMap = order.items.reduce((acc, item) => {
         acc[item.id] = item.variant?.product?.shipping_profile?.id
         return acc
-      },
-      {} as Record<string, string | null>
-    )
+      }, {} as any)
+
+      items = items.filter(
+        ({ id }) => itemShippingProfileMap[id] === selectedShippingProfileId
+      )
+    }
 
     const payload: HttpTypes.AdminCreateOrderFulfillment = {
       location_id: selectedLocationId,
       shipping_option_id: shippingOptionId,
       no_notification: !data.send_notification,
-      items: Object.entries(data.quantity)
-        .filter(
-          ([id, value]) =>
-            !!value && itemShippingProfileMap[id] === selectedShippingProfileId
-        )
-        .map(([id, quantity]) => ({
-          id,
-          quantity,
-        })),
+      items,
     }
 
     try {
@@ -350,7 +355,9 @@ export function OrderCreateFulfillmentForm({
                             form={form}
                             item={item}
                             locationId={selectedLocationId}
-                            disabled={!isShippingProfileMatching}
+                            disabled={
+                              requiresShipping && !isShippingProfileMatching
+                            }
                             itemReservedQuantitiesMap={
                               itemReservedQuantitiesMap
                             }

package/src/routes/orders/order-create-refund/components/create-refund-form/create-refund-form.tsx

@@ -8,7 +8,7 @@ import {
   Textarea,
   toast,
 } from "@medusajs/ui"
-import { useEffect } from "react"
+import { useEffect, useMemo } from "react"
 import { useForm } from "react-hook-form"
 import { useTranslation } from "react-i18next"
 import { useNavigate, useSearchParams } from "react-router-dom"
@@ -17,10 +17,11 @@ import { Form } from "../../../../../components/common/form"
 import { RouteDrawer, useRouteModal } from "../../../../../components/modals"
 import { KeyboundForm } from "../../../../../components/utilities/keybound-form"
 import { useRefundPayment } from "../../../../../hooks/api"
-import { getCurrencySymbol } from "../../../../../lib/data/currencies"
+import { currencies } from "../../../../../lib/data/currencies"
 import { formatCurrency } from "../../../../../lib/format-currency"
 import { getLocaleAmount } from "../../../../../lib/money-amount-helpers"
 import { getPaymentsFromOrder } from "../../../order-detail/components/order-payment-section"
+import { formatValue } from "react-currency-input-field"
 
 type CreateRefundFormProps = {
   order: HttpTypes.AdminOrder
@@ -28,7 +29,7 @@ type CreateRefundFormProps = {
 }
 
 const CreateRefundSchema = zod.object({
-  amount: zod.number(),
+  amount: zod.string().or(zod.number()),
   refund_reason_id: zod.string().nullish(),
   note: zod.string().optional(),
 })
@@ -45,6 +46,12 @@ export const CreateRefundForm = ({
   const payments = getPaymentsFromOrder(order)
   const payment = payments.find((p) => p.id === paymentId)!
   const paymentAmount = payment?.amount || 0
+
+  const currency = useMemo(
+    () => currencies[order.currency_code.toUpperCase()],
+    [order.currency_code]
+  )
+
   const form = useForm<zod.infer<typeof CreateRefundSchema>>({
     defaultValues: {
       amount: paymentAmount,
@@ -72,7 +79,7 @@ export const CreateRefundForm = ({
   const handleSubmit = form.handleSubmit(async (data) => {
     await mutateAsync(
       {
-        amount: data.amount,
+        amount: parseFloat(data.amount as string),
         refund_reason_id: data.refund_reason_id,
         note: data.note,
       },
@@ -166,28 +173,18 @@ export const CreateRefundForm = ({
                       <CurrencyInput
                         {...field}
                         min={0}
-                        onValueChange={(value) => {
-                          const fieldValue = value ? parseInt(value) : ""
-
-                          if (fieldValue && !isNaN(fieldValue)) {
-                            if (fieldValue < 0 || fieldValue > paymentAmount) {
-                              form.setError(`amount`, {
-                                type: "manual",
-                                message: t(
-                                  "orders.payment.createRefundWrongQuantity",
-                                  { number: paymentAmount }
-                                ),
-                              })
-                            } else {
-                              form.clearErrors(`amount`)
-                            }
-                          }
-
-                          onChange(fieldValue)
-                        }}
-                        code={order.currency_code}
-                        symbol={getCurrencySymbol(order.currency_code)}
+                        placeholder={formatValue({
+                          value: "0",
+                          decimalScale: currency.decimal_digits,
+                        })}
+                        decimalScale={currency.decimal_digits}
+                        symbol={currency.symbol_native}
+                        code={currency.code}
                         value={field.value}
+                        onValueChange={(_value, _name, values) =>
+                          onChange(values?.value ? values?.value : "")
+                        }
+                        autoFocus
                       />
                     </Form.Control>
 

package/src/routes/orders/order-create-return/components/return-create-form/return-create-form.tsx

@@ -292,7 +292,9 @@ export const ReturnCreateForm = ({
     await updateReturnRequest({ location_id: selectedLocationId })
   }
 
-  const onShippingOptionChange = async (selectedOptionId: string) => {
+  const onShippingOptionChange = async (
+    selectedOptionId: string | undefined
+  ) => {
     const promises = preview.shipping_methods
       .map((s) => s.actions?.find((a) => a.action === "SHIPPING_ADD")?.id)
       .filter(Boolean)
@@ -300,7 +302,9 @@ export const ReturnCreateForm = ({
 
     await Promise.all(promises)
 
-    await addReturnShipping({ shipping_option_id: selectedOptionId })
+    if (selectedOptionId) {
+      await addReturnShipping({ shipping_option_id: selectedOptionId })
+    }
   }
 
   useEffect(() => {
@@ -392,8 +396,6 @@ export const ReturnCreateForm = ({
     return method?.total || 0
   }, [preview.shipping_methods])
 
-  const refundAmount = returnTotal - shippingTotal
-
   return (
     <RouteFocusModal.Form
       form={form}
@@ -564,7 +566,6 @@ export const ReturnCreateForm = ({
                     </Form.Hint>
                   </div>
 
-                  {/* TODO: WHAT IF THE RETURN OPTION HAS COMPUTED PRICE*/}
                   <Form.Field
                     control={form.control}
                     name="option_id"
@@ -573,6 +574,7 @@ export const ReturnCreateForm = ({
                         <Form.Item>
                           <Form.Control>
                             <Combobox
+                              allowClear
                               value={value}
                               onChange={(v) => {
                                 onChange(v)
@@ -696,11 +698,11 @@ export const ReturnCreateForm = ({
 
               <div className="mt-4 flex items-center justify-between border-t border-dotted pt-4">
                 <span className="txt-small font-medium">
-                  {t("orders.returns.refundAmount")}
+                  {t("orders.returns.estDifference")}
                 </span>
                 <span className="txt-small font-medium">
                   {getStylizedAmount(
-                    refundAmount ? -1 * refundAmount : refundAmount,
+                    preview.summary.pending_difference,
                     order.currency_code
                   )}
                 </span>

package/src/routes/orders/order-detail/components/order-fulfillment-section/order-fulfillment-section.tsx

@@ -30,6 +30,7 @@ import {
 import { useStockLocation } from "../../../../../hooks/api/stock-locations"
 import { formatProvider } from "../../../../../lib/format-provider"
 import { getLocaleAmount } from "../../../../../lib/money-amount-helpers"
+import { FulfillmentSetType } from "../../../../locations/common/constants"
 
 type OrderFulfillmentSectionProps = {
   order: AdminOrder
@@ -213,6 +214,10 @@ const Fulfillment = ({
 
   const showLocation = !!fulfillment.location_id
 
+  const isPickUpFulfillment =
+    fulfillment.shipping_option?.service_zone.fulfillment_set.type ===
+    FulfillmentSetType.Pickup
+
   const { stock_location, isError, error } = useStockLocation(
     fulfillment.location_id!,
     undefined,
@@ -222,7 +227,9 @@ const Fulfillment = ({
   )
 
   let statusText = fulfillment.requires_shipping
-    ? "Awaiting shipping"
+    ? isPickUpFulfillment
+      ? "Awaiting pickup"
+      : "Awaiting shipping"
     : "Awaiting delivery"
   let statusColor: "blue" | "green" | "red" = "blue"
   let statusTimestamp = fulfillment.created_at
@@ -251,7 +258,9 @@ const Fulfillment = ({
     !fulfillment.canceled_at &&
     !fulfillment.shipped_at &&
     !fulfillment.delivered_at &&
-    fulfillment.requires_shipping
+    fulfillment.requires_shipping &&
+    !isPickUpFulfillment
+
   const showDeliveryButton =
     !fulfillment.canceled_at && !fulfillment.delivered_at
 
@@ -267,7 +276,13 @@ const Fulfillment = ({
     if (res) {
       await markAsDelivered(undefined, {
         onSuccess: () => {
-          toast.success(t("orders.fulfillment.toast.fulfillmentDelivered"))
+          toast.success(
+            t(
+              isPickUpFulfillment
+                ? "orders.fulfillment.toast.fulfillmentPickedUp"
+                : "orders.fulfillment.toast.fulfillmentDelivered"
+            )
+          )
         },
         onError: (e) => {
           toast.error(e.message)
@@ -332,7 +347,10 @@ const Fulfillment = ({
                     label: t("actions.cancel"),
                     icon: <XCircle />,
                     onClick: handleCancel,
-                    disabled: !!fulfillment.canceled_at,
+                    disabled:
+                      !!fulfillment.canceled_at ||
+                      !!fulfillment.shipped_at ||
+                      !!fulfillment.delivered_at,
                   },
                 ],
               },
@@ -431,7 +449,11 @@ const Fulfillment = ({
         <div className="bg-ui-bg-subtle flex items-center justify-end gap-x-2 rounded-b-xl px-4 py-4">
           {showDeliveryButton && (
             <Button onClick={handleMarkAsDelivered} variant="secondary">
-              {t("orders.fulfillment.markAsDelivered")}
+              {t(
+                isPickUpFulfillment
+                  ? "orders.fulfillment.markAsPickedUp"
+                  : "orders.fulfillment.markAsDelivered"
+              )}
             </Button>
           )}
 

package/src/routes/orders/order-detail/components/order-summary-section/order-summary-section.tsx

@@ -1,6 +1,6 @@
 import { ReactNode, useMemo, useState } from "react"
 import { useTranslation } from "react-i18next"
-import { useNavigate } from "react-router-dom"
+import { Link, useNavigate } from "react-router-dom"
 
 import {
   ArrowDownRightMini,
@@ -18,9 +18,9 @@ import {
   AdminOrder,
   AdminOrderLineItem,
   AdminOrderPreview,
+  AdminPaymentCollection,
   AdminRegion,
   AdminReturn,
-  AdminPaymentCollection,
 } from "@medusajs/types"
 import {
   Badge,
@@ -188,16 +188,12 @@ export const OrderSummarySection = ({ order }: OrderSummarySectionProps) => {
         <div className="bg-ui-bg-subtle flex items-center justify-end gap-x-2 rounded-b-xl px-4 py-4">
           {showReturns &&
             (receivableReturns.length === 1 ? (
-              <Button
-                onClick={() =>
-                  navigate(
-                    `/orders/${order.id}/returns/${receivableReturns[0].id}/receive`
-                  )
-                }
-                variant="secondary"
-                size="small"
-              >
-                {t("orders.returns.receive.action")}
+              <Button asChild variant="secondary" size="small">
+                <Link
+                  to={`/orders/${order.id}/returns/${receivableReturns[0].id}/receive`}
+                >
+                  {t("orders.returns.receive.action")}
+                </Link>
               </Button>
             ) : (
               <ActionMenu
@@ -236,11 +232,10 @@ export const OrderSummarySection = ({ order }: OrderSummarySectionProps) => {
             ))}
 
           {showAllocateButton && (
-            <Button
-              onClick={() => navigate(`./allocate-items`)}
-              variant="secondary"
-            >
-              {t("orders.allocateItems.action")}
+            <Button asChild variant="secondary" size="small">
+              <Link to="allocate-items">
+                {t("orders.allocateItems.action")}
+              </Link>
             </Button>
           )}
 
@@ -262,17 +257,15 @@ export const OrderSummarySection = ({ order }: OrderSummarySectionProps) => {
           )}
 
           {showRefund && (
-            <Button
-              size="small"
-              variant="secondary"
-              onClick={() => navigate(`/orders/${order.id}/refund`)}
-            >
-              {t("orders.payment.refundAmount", {
-                amount: getStylizedAmount(
-                  pendingDifference * -1,
-                  order?.currency_code
-                ),
-              })}
+            <Button size="small" variant="secondary" asChild>
+              <Link to={`/orders/${order.id}/refund`}>
+                {t("orders.payment.refundAmount", {
+                  amount: getStylizedAmount(
+                    pendingDifference * -1,
+                    order?.currency_code
+                  ),
+                })}
+              </Link>
             </Button>
           )}
         </div>

package/src/routes/orders/order-detail/constants.ts

@@ -37,6 +37,7 @@ const DEFAULT_RELATIONS = [
   "*promotion",
   "*shipping_methods",
   "*fulfillments",
+  "+fulfillments.shipping_option.service_zone.fulfillment_set.type",
   "*fulfillments.items",
   "*fulfillments.labels",
   "*fulfillments.labels",

package/src/routes/orders/order-detail/order-detail.tsx

@@ -2,8 +2,8 @@ import { useLoaderData, useParams } from "react-router-dom"
 
 import { TwoColumnPageSkeleton } from "../../../components/common/skeleton"
 import { TwoColumnPage } from "../../../components/layout/pages"
-import { useDashboardExtension } from "../../../extensions"
 import { useOrder, useOrderPreview } from "../../../hooks/api/orders"
+import { useExtension } from "../../../providers/extension-provider"
 import { ActiveOrderClaimSection } from "./components/active-order-claim-section"
 import { ActiveOrderExchangeSection } from "./components/active-order-exchange-section"
 import { ActiveOrderReturnSection } from "./components/active-order-return-section"
@@ -21,7 +21,7 @@ export const OrderDetail = () => {
   const initialData = useLoaderData() as Awaited<ReturnType<typeof orderLoader>>
 
   const { id } = useParams()
-  const { getWidgets } = useDashboardExtension()
+  const { getWidgets } = useExtension()
 
   const { order, isLoading, isError, error } = useOrder(
     id!,

package/src/routes/orders/order-list/order-list.tsx

@@ -1,10 +1,10 @@
 import { OrderListTable } from "./components/order-list-table"
 
 import { SingleColumnPage } from "../../../components/layout/pages"
-import { useDashboardExtension } from "../../../extensions"
+import { useExtension } from "../../../providers/extension-provider"
 
 export const OrderList = () => {
-  const { getWidgets } = useDashboardExtension()
+  const { getWidgets } = useExtension()
 
   return (
     <SingleColumnPage

package/src/routes/orders/order-receive-return/components/order-receive-return-form/order-receive-return-form.tsx

@@ -1,5 +1,5 @@
 import { zodResolver } from "@hookform/resolvers/zod"
-import { ArrrowRight } from "@medusajs/icons"
+import { ArrowRight } from "@medusajs/icons"
 import { AdminOrder, AdminReturn } from "@medusajs/types"
 import { Alert, Button, Input, Switch, Text, toast } from "@medusajs/ui"
 import { useEffect, useMemo } from "react"
@@ -219,7 +219,7 @@ export function OrderReceiveReturnForm({
             <div>
               {stock_location && (
                 <div className="flex items-center gap-2">
-                  <ArrrowRight className="text-ui-fg-subtle" />{" "}
+                  <ArrowRight className="text-ui-fg-subtle" />{" "}
                   <span className="text-ui-fg-base txt-small font-medium">
                     {stock_location.name}
                   </span>

package/src/routes/price-lists/price-list-detail/components/price-list-configuration-section/price-list-configuration-section.tsx

@@ -55,7 +55,7 @@ const CustomerGroupDisplay = ({
 }) => {
   const { t } = useTranslation()
 
-  const customerGroupIds = priceList.rules.customer_group_id as
+  const customerGroupIds = priceList.rules["customer.groups.id"] as
     | string[]
     | undefined
 

package/src/routes/price-lists/price-list-detail/price-list-detail.tsx

@@ -7,13 +7,13 @@ import { PriceListProductSection } from "./components/price-list-product-section
 
 import { TwoColumnPageSkeleton } from "../../../components/common/skeleton"
 import { TwoColumnPage } from "../../../components/layout/pages"
-import { useDashboardExtension } from "../../../extensions"
+import { useExtension } from "../../../providers/extension-provider"
 
 export const PriceListDetails = () => {
   const { id } = useParams()
 
   const { price_list, isLoading, isError, error } = usePriceList(id!)
-  const { getWidgets } = useDashboardExtension()
+  const { getWidgets } = useExtension()
 
   if (isLoading || !price_list) {
     return (

package/src/routes/price-lists/price-list-list/price-list-list.tsx

@@ -1,9 +1,9 @@
 import { SingleColumnPage } from "../../../components/layout/pages"
-import { useDashboardExtension } from "../../../extensions"
+import { useExtension } from "../../../providers/extension-provider"
 import { PriceListListTable } from "./components/price-list-list-table"
 
 export const PriceListList = () => {
-  const { getWidgets } = useDashboardExtension()
+  const { getWidgets } = useExtension()
 
   return (
     <SingleColumnPage

package/src/routes/product-tags/product-tag-detail/product-tag-detail.tsx

@@ -2,8 +2,8 @@ import { useLoaderData, useParams } from "react-router-dom"
 
 import { SingleColumnPageSkeleton } from "../../../components/common/skeleton"
 import { SingleColumnPage } from "../../../components/layout/pages"
-import { useDashboardExtension } from "../../../extensions"
 import { useProductTag } from "../../../hooks/api"
+import { useExtension } from "../../../providers/extension-provider"
 import { ProductTagGeneralSection } from "./components/product-tag-general-section"
 import { ProductTagProductSection } from "./components/product-tag-product-section"
 import { productTagLoader } from "./loader"
@@ -15,7 +15,7 @@ export const ProductTagDetail = () => {
     ReturnType<typeof productTagLoader>
   >
 
-  const { getWidgets } = useDashboardExtension()
+  const { getWidgets } = useExtension()
 
   const { product_tag, isPending, isError, error } = useProductTag(
     id!,

package/src/routes/product-tags/product-tag-list/product-tag-list.tsx

@@ -1,9 +1,9 @@
 import { SingleColumnPage } from "../../../components/layout/pages"
-import { useDashboardExtension } from "../../../extensions"
+import { useExtension } from "../../../providers/extension-provider"
 import { ProductTagListTable } from "./components/product-tag-list-table"
 
 export const ProductTagList = () => {
-  const { getWidgets } = useDashboardExtension()
+  const { getWidgets } = useExtension()
 
   return (
     <SingleColumnPage

package/src/routes/product-types/common/hooks/use-delete-product-type-action.tsx

@@ -1,17 +1,20 @@
+import { useNavigate } from "react-router-dom"
 import { toast, usePrompt } from "@medusajs/ui"
 import { useTranslation } from "react-i18next"
+
 import { useDeleteProductType } from "../../../../hooks/api/product-types"
 
-export const useDeleteProductTypeAction = (id: string) => {
+export const useDeleteProductTypeAction = (id: string, value: string) => {
   const { t } = useTranslation()
   const prompt = usePrompt()
+  const navigate = useNavigate()
 
   const { mutateAsync } = useDeleteProductType(id)
 
   const handleDelete = async () => {
     const result = await prompt({
       title: t("general.areYouSure"),
-      description: t("productTypes.delete.confirmation"),
+      description: t("productTypes.delete.confirmation", { value }),
       confirmText: t("actions.delete"),
       cancelText: t("actions.cancel"),
     })
@@ -22,7 +25,8 @@ export const useDeleteProductTypeAction = (id: string) => {
 
     await mutateAsync(undefined, {
       onSuccess: () => {
-        toast.success(t("productTypes.delete.successToast"))
+        navigate("/settings/product-types", { replace: true })
+        toast.success(t("productTypes.delete.successToast", { value }))
       },
       onError: (e) => {
         toast.error(e.message)

package/src/routes/product-types/product-type-create/components/create-product-type-form/create-product-type-form.tsx

@@ -34,7 +34,7 @@ export const CreateProductTypeForm = () => {
         onSuccess: ({ product_type }) => {
           toast.success(
             t("productTypes.create.successToast", {
-              value: product_type.value,
+              value: product_type.value.trim(),
             })
           )
 
@@ -49,28 +49,8 @@ export const CreateProductTypeForm = () => {
 
   return (
     <RouteFocusModal.Form form={form}>
-      <KeyboundForm
-        onSubmit={handleSubmit}
-        className="flex flex-col overflow-hidden"
-      >
-        <RouteFocusModal.Header>
-          <div className="flex items-center justify-end gap-x-2">
-            <RouteFocusModal.Close asChild>
-              <Button size="small" variant="secondary">
-                {t("actions.cancel")}
-              </Button>
-            </RouteFocusModal.Close>
-            <Button
-              size="small"
-              variant="primary"
-              type="submit"
-              isLoading={isPending}
-            >
-              {t("actions.create")}
-            </Button>
-          </div>
-        </RouteFocusModal.Header>
-        <RouteFocusModal.Body className="flex flex-col items-center overflow-y-auto p-16">
+      <KeyboundForm onSubmit={handleSubmit} className="flex h-full flex-col">
+        <RouteFocusModal.Body className="flex flex-col items-center overflow-auto p-16">
           <div className="flex w-full max-w-[720px] flex-col gap-y-8">
             <div>
               <Heading>{t("productTypes.create.header")}</Heading>
@@ -97,6 +77,23 @@ export const CreateProductTypeForm = () => {
             </div>
           </div>
         </RouteFocusModal.Body>
+        <RouteFocusModal.Footer>
+          <div className="flex items-center justify-end gap-x-2">
+            <RouteFocusModal.Close asChild>
+              <Button size="small" variant="secondary">
+                {t("actions.cancel")}
+              </Button>
+            </RouteFocusModal.Close>
+            <Button
+              size="small"
+              variant="primary"
+              type="submit"
+              isLoading={isPending}
+            >
+              {t("actions.create")}
+            </Button>
+          </div>
+        </RouteFocusModal.Footer>
       </KeyboundForm>
     </RouteFocusModal.Form>
   )

package/src/routes/product-types/product-type-detail/components/product-type-general-section/product-type-general-section.tsx

@@ -13,7 +13,10 @@ export const ProductTypeGeneralSection = ({
   productType,
 }: ProductTypeGeneralSectionProps) => {
   const { t } = useTranslation()
-  const handleDelete = useDeleteProductTypeAction(productType.id)
+  const handleDelete = useDeleteProductTypeAction(
+    productType.id,
+    productType.value
+  )
 
   return (
     <Container className="flex items-center justify-between">

package/src/routes/product-types/product-type-detail/product-type-detail.tsx

@@ -2,8 +2,8 @@ import { useLoaderData, useParams } from "react-router-dom"
 
 import { SingleColumnPageSkeleton } from "../../../components/common/skeleton"
 import { SingleColumnPage } from "../../../components/layout/pages"
-import { useDashboardExtension } from "../../../extensions"
 import { useProductType } from "../../../hooks/api/product-types"
+import { useExtension } from "../../../providers/extension-provider"
 import { ProductTypeGeneralSection } from "./components/product-type-general-section"
 import { ProductTypeProductSection } from "./components/product-type-product-section"
 import { productTypeLoader } from "./loader"
@@ -22,7 +22,7 @@ export const ProductTypeDetail = () => {
     }
   )
 
-  const { getWidgets } = useDashboardExtension()
+  const { getWidgets } = useExtension()
 
   if (isPending || !product_type) {
     return <SingleColumnPageSkeleton sections={2} showJSON showMetadata />

package/src/routes/product-types/product-type-list/components/product-type-list-table/product-table-row-actions.tsx

@@ -12,7 +12,10 @@ export const ProductTypeRowActions = ({
   productType,
 }: ProductTypeRowActionsProps) => {
   const { t } = useTranslation()
-  const handleDelete = useDeleteProductTypeAction(productType.id)
+  const handleDelete = useDeleteProductTypeAction(
+    productType.id,
+    productType.value
+  )
 
   return (
     <ActionMenu