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

package/src/routes/promotions/promotion-create/components/create-promotion-form/create-promotion-form.tsx

@@ -19,6 +19,7 @@ import {
   ProgressStatus,
   ProgressTabs,
   RadioGroup,
+  Switch,
   Text,
   toast,
 } from "@medusajs/ui"
@@ -35,13 +36,17 @@ import {
 import { KeyboundForm } from "../../../../../components/utilities/keybound-form"
 import { useCampaigns } from "../../../../../hooks/api/campaigns"
 import { useCreatePromotion } from "../../../../../hooks/api/promotions"
-import { getCurrencySymbol } from "../../../../../lib/data/currencies"
+import {
+  currencies,
+  getCurrencySymbol,
+} from "../../../../../lib/data/currencies"
 import { DEFAULT_CAMPAIGN_VALUES } from "../../../../campaigns/common/constants"
 import { RulesFormField } from "../../../common/edit-rules/components/rules-form-field"
 import { AddCampaignPromotionFields } from "../../../promotion-add-campaign/components/add-campaign-promotion-form"
 import { Tab } from "./constants"
 import { CreatePromotionSchema } from "./form-schema"
 import { templates } from "./templates"
+import { useDocumentDirection } from "../../../../../hooks/use-document-direction"
 
 const defaultValues = {
   campaign_id: undefined,
@@ -52,6 +57,7 @@ const defaultValues = {
   type: "standard" as PromotionTypeValues,
   status: "draft" as PromotionStatusValues,
   rules: [],
+  is_tax_inclusive: false,
   application_method: {
     allocation: "each" as ApplicationMethodAllocationValues,
     type: "fixed" as ApplicationMethodTypeValues,
@@ -75,7 +81,7 @@ export const CreatePromotionForm = () => {
 
   const { t } = useTranslation()
   const { handleSuccess } = useRouteModal()
-
+  const direction = useDocumentDirection()
   const form = useForm<z.infer<typeof CreatePromotionSchema>>({
     defaultValues,
     resolver: zodResolver(CreatePromotionSchema),
@@ -89,6 +95,7 @@ export const CreatePromotionForm = () => {
       const {
         campaign_choice: _campaignChoice,
         is_automatic,
+        is_tax_inclusive,
         template_id: _templateId,
         application_method,
         rules,
@@ -132,6 +139,13 @@ export const CreatePromotionForm = () => {
           }))
       }
 
+      if (data.campaign) {
+        data.campaign.budget.attribute = data.campaign.budget.attribute || null
+        data.campaign.budget.type = data.campaign.budget.attribute
+          ? "use_by_attribute"
+          : data.campaign.budget.type
+      }
+
       createPromotion(
         {
           ...promotionData,
@@ -139,9 +153,11 @@ export const CreatePromotionForm = () => {
           application_method: {
             ...applicationMethodData,
             ...applicationMethodRuleData,
+            value: parseFloat(applicationMethodData.value as string) as number,
             target_rules: buildRulesData(targetRulesData),
             buy_rules: buildRulesData(buyRulesData),
           },
+          is_tax_inclusive,
           is_automatic: is_automatic === "true",
         },
         {
@@ -284,6 +300,7 @@ export const CreatePromotionForm = () => {
   })
 
   const isTypeStandard = watchType === "standard"
+  const isTypeBuyGet = watchType === "buyget"
 
   const targetType = useWatch({
     control: form.control,
@@ -295,7 +312,7 @@ export const CreatePromotionForm = () => {
   const formData = form.getValues()
   let campaignQuery: object = {}
 
-  if (isFixedValueType && formData.application_method.currency_code) {
+  if (formData.application_method.currency_code) {
     campaignQuery = {
       budget: { currency_code: formData.application_method.currency_code },
     }
@@ -355,6 +372,7 @@ export const CreatePromotionForm = () => {
     <RouteFocusModal.Form form={form}>
       <KeyboundForm className="flex h-full flex-col" onSubmit={handleSubmit}>
         <ProgressTabs
+          dir={direction}
           value={tab}
           onValueChange={(tab) => handleTabChange(tab as Tab)}
           className="flex h-full flex-col overflow-hidden"
@@ -408,6 +426,7 @@ export const CreatePromotionForm = () => {
 
                           <Form.Control>
                             <RadioGroup
+                              dir={direction}
                               key={"template_id"}
                               className="flex-col gap-y-3"
                               {...field}
@@ -477,6 +496,7 @@ export const CreatePromotionForm = () => {
 
                           <Form.Control>
                             <RadioGroup
+                              dir={direction}
                               className="flex gap-y-3"
                               {...field}
                               value={field.value}
@@ -521,6 +541,7 @@ export const CreatePromotionForm = () => {
 
                           <Form.Control>
                             <RadioGroup
+                              dir={direction}
                               className="flex gap-y-3"
                               {...field}
                               value={field.value}
@@ -583,6 +604,50 @@ export const CreatePromotionForm = () => {
                     />
                   </div>
 
+                  {!currentTemplate?.hiddenFields?.includes(
+                    "is_tax_inclusive"
+                  ) && (
+                    <>
+                      <Divider />
+                      <div className="flex gap-x-2 gap-y-4">
+                        <Form.Field
+                          control={form.control}
+                          name="is_tax_inclusive"
+                          render={({
+                            field: { onChange, value, ...field },
+                          }) => {
+                            return (
+                              <Form.Item className="basis-full">
+                                <div className="flex items-center justify-between">
+                                  <div className="block">
+                                    <Form.Label>
+                                      {t("promotions.form.taxInclusive.title")}
+                                    </Form.Label>
+                                    <Form.Hint className="!mt-1">
+                                      {t(
+                                        "promotions.form.taxInclusive.description"
+                                      )}
+                                    </Form.Hint>
+                                  </div>
+                                  <Form.Control className="mr-2 self-center">
+                                    <Switch
+                                      dir="ltr"
+                                      className="mt-[2px] rtl:rotate-180"
+                                      checked={!!value}
+                                      onCheckedChange={onChange}
+                                      {...field}
+                                    />
+                                  </Form.Control>
+                                </div>
+                                <Form.ErrorMessage />
+                              </Form.Item>
+                            )
+                          }}
+                        />
+                      </div>
+                    </>
+                  )}
+
                   {!currentTemplate?.hiddenFields?.includes("type") && (
                     <Form.Field
                       control={form.control}
@@ -595,6 +660,7 @@ export const CreatePromotionForm = () => {
                             </Form.Label>
                             <Form.Control>
                               <RadioGroup
+                                dir={direction}
                                 className="flex gap-y-3"
                                 {...field}
                                 onValueChange={field.onChange}
@@ -631,60 +697,63 @@ export const CreatePromotionForm = () => {
 
                   <RulesFormField form={form} ruleType={"rules"} />
 
-                  <Divider />
-
                   {!currentTemplate?.hiddenFields?.includes(
                     "application_method.type"
                   ) && (
-                    <Form.Field
-                      control={form.control}
-                      name="application_method.type"
-                      render={({ field }) => {
-                        return (
-                          <Form.Item>
-                            <Form.Label>
-                              {t("promotions.fields.value_type")}
-                            </Form.Label>
-                            <Form.Control>
-                              <RadioGroup
-                                className="flex gap-y-3"
-                                {...field}
-                                onValueChange={field.onChange}
-                              >
-                                <RadioGroup.ChoiceBox
-                                  value={"fixed"}
-                                  label={t(
-                                    "promotions.form.value_type.fixed.title"
-                                  )}
-                                  description={t(
-                                    "promotions.form.value_type.fixed.description"
-                                  )}
-                                  className={clx("basis-1/2")}
-                                />
+                    <>
+                      <Divider />
+                      <Form.Field
+                        control={form.control}
+                        name="application_method.type"
+                        render={({ field }) => {
+                          return (
+                            <Form.Item>
+                              <Form.Label>
+                                {t("promotions.fields.value_type")}
+                              </Form.Label>
+                              <Form.Control>
+                                <RadioGroup
+                                  dir={direction}
+                                  className="flex gap-y-3"
+                                  {...field}
+                                  onValueChange={field.onChange}
+                                >
+                                  <RadioGroup.ChoiceBox
+                                    value={"fixed"}
+                                    label={t(
+                                      "promotions.form.value_type.fixed.title"
+                                    )}
+                                    description={t(
+                                      "promotions.form.value_type.fixed.description"
+                                    )}
+                                    className={clx("basis-1/2")}
+                                  />
 
-                                <RadioGroup.ChoiceBox
-                                  value={"percentage"}
-                                  label={t(
-                                    "promotions.form.value_type.percentage.title"
-                                  )}
-                                  description={t(
-                                    "promotions.form.value_type.percentage.description"
-                                  )}
-                                  className={clx("basis-1/2")}
-                                />
-                              </RadioGroup>
-                            </Form.Control>
-                            <Form.ErrorMessage />
-                          </Form.Item>
-                        )
-                      }}
-                    />
+                                  <RadioGroup.ChoiceBox
+                                    value={"percentage"}
+                                    label={t(
+                                      "promotions.form.value_type.percentage.title"
+                                    )}
+                                    description={t(
+                                      "promotions.form.value_type.percentage.description"
+                                    )}
+                                    className={clx("basis-1/2")}
+                                  />
+                                </RadioGroup>
+                              </Form.Control>
+                              <Form.ErrorMessage />
+                            </Form.Item>
+                          )
+                        }}
+                      />
+                    </>
                   )}
 
-                  <div className="flex gap-x-2 gap-y-4">
-                    {!currentTemplate?.hiddenFields?.includes(
-                      "application_method.value"
-                    ) && (
+                  {!currentTemplate?.hiddenFields?.includes(
+                    "application_method.value"
+                  ) && (
+                    <>
+                      <Divider />
                       <Form.Field
                         control={form.control}
                         name="application_method.value"
@@ -692,6 +761,9 @@ export const CreatePromotionForm = () => {
                           const currencyCode =
                             form.getValues().application_method.currency_code
 
+                          const currencyInfo =
+                            currencies[currencyCode?.toUpperCase() || "USD"]
+
                           return (
                             <Form.Item className="basis-1/2">
                               <Form.Label
@@ -709,10 +781,16 @@ export const CreatePromotionForm = () => {
                                   <CurrencyInput
                                     {...field}
                                     min={0}
-                                    onValueChange={(value) => {
-                                      onChange(value ? parseInt(value) : "")
-                                    }}
                                     code={currencyCode || "USD"}
+                                    onValueChange={(_value, _name, values) =>
+                                      onChange(values?.value)
+                                    }
+                                    decimalScale={
+                                      currencyInfo?.decimal_digits ?? 2
+                                    }
+                                    decimalsLimit={
+                                      currencyInfo?.decimal_digits ?? 2
+                                    }
                                     symbol={
                                       currencyCode
                                         ? getCurrencySymbol(currencyCode)
@@ -733,7 +811,7 @@ export const CreatePromotionForm = () => {
                                       onChange(
                                         e.target.value === ""
                                           ? null
-                                          : parseInt(e.target.value)
+                                          : parseFloat(e.target.value)
                                       )
                                     }}
                                   />
@@ -759,9 +837,19 @@ export const CreatePromotionForm = () => {
                           )
                         }}
                       />
-                    )}
+                    </>
+                  )}
 
-                    {isTypeStandard && watchAllocation === "each" && (
+                  {((isTypeStandard &&
+                    (watchAllocation === "each" ||
+                      watchAllocation === "once")) ||
+                    isTypeBuyGet) && (
+                    <>
+                      {isTypeBuyGet && (
+                        <>
+                          <Divider />
+                        </>
+                      )}
                       <Form.Field
                         control={form.control}
                         name="application_method.max_quantity"
@@ -799,8 +887,8 @@ export const CreatePromotionForm = () => {
                           )
                         }}
                       />
-                    )}
-                  </div>
+                    </>
+                  )}
 
                   {isTypeStandard &&
                     !currentTemplate?.hiddenFields?.includes(
@@ -812,37 +900,63 @@ export const CreatePromotionForm = () => {
                         render={({ field }) => {
                           return (
                             <Form.Item>
-                              <Form.Label>
+                              <Form.Label
+                                tooltip={t("promotions.fields.allocationTooltip")}
+                              >
                                 {t("promotions.fields.allocation")}
                               </Form.Label>
 
                               <Form.Control>
                                 <RadioGroup
+                                  dir={direction}
                                   className="flex gap-y-3"
                                   {...field}
                                   onValueChange={field.onChange}
                                 >
-                                  <RadioGroup.ChoiceBox
-                                    value={"each"}
-                                    label={t(
-                                      "promotions.form.allocation.each.title"
-                                    )}
-                                    description={t(
-                                      "promotions.form.allocation.each.description"
-                                    )}
-                                    className={clx("basis-1/2")}
-                                  />
+                                  {!currentTemplate?.hiddenFields?.includes(
+                                    "application_method.allocation.each"
+                                  ) && (
+                                    <RadioGroup.ChoiceBox
+                                      value={"each"}
+                                      label={t(
+                                        "promotions.form.allocation.each.title"
+                                      )}
+                                      description={t(
+                                        "promotions.form.allocation.each.description"
+                                      )}
+                                      className={clx("basis-1/3")}
+                                    />
+                                  )}
 
-                                  <RadioGroup.ChoiceBox
-                                    value={"across"}
-                                    label={t(
-                                      "promotions.form.allocation.across.title"
-                                    )}
-                                    description={t(
-                                      "promotions.form.allocation.across.description"
-                                    )}
-                                    className={clx("basis-1/2")}
-                                  />
+                                  {!currentTemplate?.hiddenFields?.includes(
+                                    "application_method.allocation.across"
+                                  ) && (
+                                    <RadioGroup.ChoiceBox
+                                      value={"across"}
+                                      label={t(
+                                        "promotions.form.allocation.across.title"
+                                      )}
+                                      description={t(
+                                        "promotions.form.allocation.across.description"
+                                      )}
+                                      className={clx("basis-1/3")}
+                                    />
+                                  )}
+
+                                  {!currentTemplate?.hiddenFields?.includes(
+                                    "application_method.allocation.once"
+                                  ) && (
+                                    <RadioGroup.ChoiceBox
+                                      value={"once"}
+                                      label={t(
+                                        "promotions.form.allocation.once.title"
+                                      )}
+                                      description={t(
+                                        "promotions.form.allocation.once.description"
+                                      )}
+                                      className={clx("basis-1/3")}
+                                    />
+                                  )}
                                 </RadioGroup>
                               </Form.Control>
                               <Form.ErrorMessage />
@@ -854,6 +968,7 @@ export const CreatePromotionForm = () => {
 
                   {!isTypeStandard && (
                     <>
+                      <Divider />
                       <RulesFormField
                         form={form}
                         ruleType={"buy-rules"}

package/src/routes/promotions/promotion-create/components/create-promotion-form/form-schema.ts

@@ -27,9 +27,10 @@ export const CreatePromotionSchema = z
     type: z.enum(["buyget", "standard"]),
     status: z.enum(["draft", "active", "inactive"]),
     rules: RuleSchema,
+    is_tax_inclusive: z.boolean().optional(),
     application_method: z.object({
-      allocation: z.enum(["each", "across"]),
-      value: z.number().min(0),
+      allocation: z.enum(["each", "across", "once"]),
+      value: z.number().min(0).or(z.string().min(1)),
       currency_code: z.string().optional(),
       max_quantity: z.number().optional().nullable(),
       target_rules: RuleSchema,
@@ -46,7 +47,8 @@ export const CreatePromotionSchema = z
       }
 
       return (
-        data.application_method.allocation === "each" &&
+        (data.application_method.allocation === "each" ||
+          data.application_method.allocation === "once") &&
         typeof data.application_method.max_quantity === "number"
       )
     },

package/src/routes/promotions/promotion-create/components/create-promotion-form/templates.ts

@@ -1,7 +1,41 @@
 const commonHiddenFields = [
   "type",
   "application_method.type",
+]
+
+const amountOfOrderHiddenFields = [
+  ...commonHiddenFields,
+  "application_method.allocation",
+]
+
+const amountOfProductHiddenFields = [
+  ...commonHiddenFields,
+  "application_method.allocation.across",
+]
+
+const percentageOfOrderHiddenFields = [
+  ...commonHiddenFields,
+  "application_method.allocation",
+  "is_tax_inclusive",
+]
+const percentageOfProductHiddenFields = [
+  ...commonHiddenFields,
+  "application_method.allocation.across",
+  "is_tax_inclusive",
+]
+
+const buyGetHiddenFields = [
+  ...commonHiddenFields,
+  "application_method.value",
+  "application_method.allocation",
+  "is_tax_inclusive",
+]
+
+const freeShippingHiddenFields = [
+  ...commonHiddenFields,
+  "application_method.value",
   "application_method.allocation",
+  "is_tax_inclusive",
 ]
 
 export const templates = [
@@ -10,7 +44,7 @@ export const templates = [
     type: "standard",
     title: "Amount off products",
     description: "Discount specific products or collection of products",
-    hiddenFields: [...commonHiddenFields],
+    hiddenFields: amountOfProductHiddenFields,
     defaults: {
       is_automatic: "false",
       type: "standard",
@@ -26,7 +60,7 @@ export const templates = [
     type: "standard",
     title: "Amount off order",
     description: "Discounts the total order amount",
-    hiddenFields: [...commonHiddenFields],
+    hiddenFields: amountOfOrderHiddenFields,
     defaults: {
       is_automatic: "false",
       type: "standard",
@@ -42,7 +76,7 @@ export const templates = [
     type: "standard",
     title: "Percentage off product",
     description: "Discounts a percentage off selected products",
-    hiddenFields: [...commonHiddenFields],
+    hiddenFields: percentageOfProductHiddenFields,
     defaults: {
       is_automatic: "false",
       type: "standard",
@@ -58,7 +92,7 @@ export const templates = [
     type: "standard",
     title: "Percentage off order",
     description: "Discounts a percentage of the total order amount",
-    hiddenFields: [...commonHiddenFields],
+    hiddenFields: percentageOfOrderHiddenFields,
     defaults: {
       is_automatic: "false",
       type: "standard",
@@ -74,7 +108,7 @@ export const templates = [
     type: "buy_get",
     title: "Buy X Get Y",
     description: "Buy X product(s), get Y product(s)",
-    hiddenFields: [...commonHiddenFields, "application_method.value"],
+    hiddenFields: buyGetHiddenFields,
     defaults: {
       is_automatic: "false",
       type: "buyget",
@@ -86,4 +120,21 @@ export const templates = [
       },
     },
   },
+  {
+    id: "shipping_discount",
+    type: "standard",
+    title: "Free shipping",
+    description: "Applies a 100% discount to shipping fees",
+    hiddenFields: freeShippingHiddenFields,
+    defaults: {
+      is_automatic: "false",
+      type: "standard",
+      application_method: {
+        allocation: "across",
+        target_type: "shipping_methods",
+        type: "percentage",
+        value: 100,
+      },
+    },
+  },
 ]

package/src/routes/promotions/promotion-detail/components/promotion-conditions-section/promotion-conditions-section.tsx

@@ -1,5 +1,5 @@
 import { PencilSquare } from "@medusajs/icons"
-import { HttpTypes, PromotionRuleTypes } from "@medusajs/types"
+import { ApplicationMethodTargetTypeValues, HttpTypes, PromotionRuleTypes, } from "@medusajs/types"
 import { Badge, Container, Heading } from "@medusajs/ui"
 import { useTranslation } from "react-i18next"
 
@@ -44,11 +44,13 @@ function RuleBlock({ rule }: RuleProps) {
 type PromotionConditionsSectionProps = {
   rules: HttpTypes.AdminPromotionRule[]
   ruleType: PromotionRuleTypes
+  applicationMethodTargetType: ApplicationMethodTargetTypeValues
 }
 
 export const PromotionConditionsSection = ({
   rules,
   ruleType,
+  applicationMethodTargetType,
 }: PromotionConditionsSectionProps) => {
   const { t } = useTranslation()
 
@@ -56,8 +58,12 @@ export const PromotionConditionsSection = ({
     <Container className="p-0">
       <div className="flex items-center justify-between px-6 py-4">
         <div className="flex flex-col">
-          <Heading>
-            {t(`promotions.fields.conditions.${ruleType}.title`)}
+          <Heading level="h2">
+            {t(
+              ruleType === "target-rules"
+                ? `promotions.fields.conditions.${ruleType}.${applicationMethodTargetType}.title`
+                : `promotions.fields.conditions.${ruleType}.title`
+            )}
           </Heading>
         </div>
 

package/src/routes/promotions/promotion-detail/components/promotion-general-section/promotion-general-section.tsx

@@ -180,6 +180,22 @@ export const PromotionGeneralSection = ({
           {promotion.application_method?.allocation!}
         </Text>
       </div>
+
+      {promotion.application_method?.type === "fixed" && (
+        <div className="text-ui-fg-subtle grid grid-cols-2 items-start px-6 py-4">
+          <Text size="small" weight="plus" leading="compact">
+            {t("promotions.fields.taxInclusive")}
+          </Text>
+
+          <div className="flex items-center gap-x-2">
+            <Text className="inline" size="small" leading="compact">
+              {promotion.is_tax_inclusive
+                ? t("fields.true")
+                : t("fields.false")}
+            </Text>
+          </div>
+        </div>
+      )}
     </Container>
   )
 }

package/src/routes/promotions/promotion-detail/promotion-detail.tsx

@@ -52,11 +52,15 @@ export const PromotionDetail = () => {
         <PromotionConditionsSection
           rules={targetRules || []}
           ruleType={"target-rules"}
+          applicationMethodTargetType={
+            promotion.application_method.target_type || "items"
+          }
         />
         {promotion.type === "buyget" && (
           <PromotionConditionsSection
             rules={buyRules || []}
             ruleType={"buy-rules"}
+            applicationMethodTargetType={"items"}
           />
         )}
       </TwoColumnPage.Main>