@medusajs/draft-order 2.10.4-preview-20250922031739 → 2.10.4-preview-20250922090200

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -9763,6 +9763,27 @@ const BillingAddressForm = ({ order }) => {
9763
9763
  ) });
9764
9764
  };
9765
9765
  const schema$5 = addressSchema;
9766
+ const CustomItems = () => {
9767
+ return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
9768
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Header, { children: /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Custom Items" }) }) }),
9769
+ /* @__PURE__ */ jsxRuntime.jsx(CustomItemsForm, {})
9770
+ ] });
9771
+ };
9772
+ const CustomItemsForm = () => {
9773
+ const form = reactHookForm.useForm({
9774
+ resolver: zod.zodResolver(schema$4)
9775
+ });
9776
+ return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(KeyboundForm, { className: "flex flex-1 flex-col", children: [
9777
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, {}),
9778
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
9779
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
9780
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", children: "Save" })
9781
+ ] }) })
9782
+ ] }) });
9783
+ };
9784
+ const schema$4 = objectType({
9785
+ email: stringType().email()
9786
+ });
9766
9787
  const Email = () => {
9767
9788
  const { id } = reactRouterDom.useParams();
9768
9789
  const { order, isPending, isError, error } = useOrder(id, {
@@ -9785,7 +9806,7 @@ const EmailForm = ({ order }) => {
9785
9806
  defaultValues: {
9786
9807
  email: order.email ?? ""
9787
9808
  },
9788
- resolver: zod.zodResolver(schema$4)
9809
+ resolver: zod.zodResolver(schema$3)
9789
9810
  });
9790
9811
  const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
9791
9812
  const { handleSuccess } = useRouteModal();
@@ -9828,27 +9849,6 @@ const EmailForm = ({ order }) => {
9828
9849
  }
9829
9850
  ) });
9830
9851
  };
9831
- const schema$4 = objectType({
9832
- email: stringType().email()
9833
- });
9834
- const CustomItems = () => {
9835
- return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
9836
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Header, { children: /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Custom Items" }) }) }),
9837
- /* @__PURE__ */ jsxRuntime.jsx(CustomItemsForm, {})
9838
- ] });
9839
- };
9840
- const CustomItemsForm = () => {
9841
- const form = reactHookForm.useForm({
9842
- resolver: zod.zodResolver(schema$3)
9843
- });
9844
- return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(KeyboundForm, { className: "flex flex-1 flex-col", children: [
9845
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, {}),
9846
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
9847
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
9848
- /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", children: "Save" })
9849
- ] }) })
9850
- ] }) });
9851
- };
9852
9852
  const schema$3 = objectType({
9853
9853
  email: stringType().email()
9854
9854
  });
@@ -10826,392 +10826,115 @@ const customItemSchema = objectType({
10826
10826
  quantity: numberType(),
10827
10827
  unit_price: unionType([numberType(), stringType()])
10828
10828
  });
10829
- const PROMOTION_QUERY_KEY = "promotions";
10830
- const promotionsQueryKeys = {
10831
- list: (query2) => [
10832
- PROMOTION_QUERY_KEY,
10833
- query2 ? query2 : void 0
10834
- ],
10835
- detail: (id, query2) => [
10836
- PROMOTION_QUERY_KEY,
10837
- id,
10838
- query2 ? query2 : void 0
10839
- ]
10840
- };
10841
- const usePromotions = (query2, options) => {
10842
- const { data, ...rest } = reactQuery.useQuery({
10843
- queryKey: promotionsQueryKeys.list(query2),
10844
- queryFn: async () => sdk.admin.promotion.list(query2),
10845
- ...options
10846
- });
10847
- return { ...data, ...rest };
10848
- };
10849
- const Promotions = () => {
10829
+ const InlineTip = React.forwardRef(
10830
+ ({ variant = "tip", label, className, children, ...props }, ref) => {
10831
+ const labelValue = label || (variant === "warning" ? "Warning" : "Tip");
10832
+ return /* @__PURE__ */ jsxRuntime.jsxs(
10833
+ "div",
10834
+ {
10835
+ ref,
10836
+ className: ui.clx(
10837
+ "bg-ui-bg-component txt-small text-ui-fg-subtle grid grid-cols-[4px_1fr] items-start gap-3 rounded-lg border p-3",
10838
+ className
10839
+ ),
10840
+ ...props,
10841
+ children: [
10842
+ /* @__PURE__ */ jsxRuntime.jsx(
10843
+ "div",
10844
+ {
10845
+ role: "presentation",
10846
+ className: ui.clx("w-4px bg-ui-tag-neutral-icon h-full rounded-full", {
10847
+ "bg-ui-tag-orange-icon": variant === "warning"
10848
+ })
10849
+ }
10850
+ ),
10851
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-pretty", children: [
10852
+ /* @__PURE__ */ jsxRuntime.jsxs("strong", { className: "txt-small-plus text-ui-fg-base", children: [
10853
+ labelValue,
10854
+ ":"
10855
+ ] }),
10856
+ " ",
10857
+ children
10858
+ ] })
10859
+ ]
10860
+ }
10861
+ );
10862
+ }
10863
+ );
10864
+ InlineTip.displayName = "InlineTip";
10865
+ const MetadataFieldSchema = objectType({
10866
+ key: stringType(),
10867
+ disabled: booleanType().optional(),
10868
+ value: anyType()
10869
+ });
10870
+ const MetadataSchema = objectType({
10871
+ metadata: arrayType(MetadataFieldSchema)
10872
+ });
10873
+ const Metadata = () => {
10850
10874
  const { id } = reactRouterDom.useParams();
10851
- const {
10852
- order: preview,
10853
- isError: isPreviewError,
10854
- error: previewError
10855
- } = useOrderPreview(id, void 0);
10856
- useInitiateOrderEdit({ preview });
10857
- const { onCancel } = useCancelOrderEdit({ preview });
10858
- if (isPreviewError) {
10859
- throw previewError;
10875
+ const { order, isPending, isError, error } = useOrder(id, {
10876
+ fields: "metadata"
10877
+ });
10878
+ if (isError) {
10879
+ throw error;
10860
10880
  }
10861
- const isReady = !!preview;
10862
- return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { onClose: onCancel, children: [
10863
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Header, { children: /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Promotions" }) }) }),
10864
- isReady && /* @__PURE__ */ jsxRuntime.jsx(PromotionForm, { preview })
10881
+ const isReady = !isPending && !!order;
10882
+ return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
10883
+ /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
10884
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Metadata" }) }),
10885
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Add metadata to the draft order." }) })
10886
+ ] }),
10887
+ !isReady ? /* @__PURE__ */ jsxRuntime.jsx(PlaceholderInner, {}) : /* @__PURE__ */ jsxRuntime.jsx(MetadataForm, { orderId: id, metadata: order == null ? void 0 : order.metadata })
10865
10888
  ] });
10866
10889
  };
10867
- const PromotionForm = ({ preview }) => {
10868
- const { items, shipping_methods } = preview;
10869
- const [isSubmitting, setIsSubmitting] = React.useState(false);
10870
- const [comboboxValue, setComboboxValue] = React.useState("");
10890
+ const METADATA_KEY_LABEL_ID = "metadata-form-key-label";
10891
+ const METADATA_VALUE_LABEL_ID = "metadata-form-value-label";
10892
+ const MetadataForm = ({ orderId, metadata }) => {
10871
10893
  const { handleSuccess } = useRouteModal();
10872
- const { mutateAsync: addPromotions, isPending: isAddingPromotions } = useDraftOrderAddPromotions(preview.id);
10873
- const promoIds = getPromotionIds(items, shipping_methods);
10874
- const { promotions, isPending, isError, error } = usePromotions(
10875
- {
10876
- id: promoIds
10877
- },
10878
- {
10879
- enabled: !!promoIds.length
10880
- }
10881
- );
10882
- const comboboxData = useComboboxData({
10883
- queryKey: ["promotions", "combobox", promoIds],
10884
- queryFn: async (params) => {
10885
- return await sdk.admin.promotion.list({
10886
- ...params,
10887
- id: {
10888
- $nin: promoIds
10889
- }
10890
- });
10894
+ const hasUneditableRows = getHasUneditableRows(metadata);
10895
+ const { mutateAsync, isPending } = useUpdateDraftOrder(orderId);
10896
+ const form = reactHookForm.useForm({
10897
+ defaultValues: {
10898
+ metadata: getDefaultValues(metadata)
10891
10899
  },
10892
- getOptions: (data) => {
10893
- return data.promotions.map((promotion) => ({
10894
- label: promotion.code,
10895
- value: promotion.code
10896
- }));
10897
- }
10900
+ resolver: zod.zodResolver(MetadataSchema)
10898
10901
  });
10899
- const add = async (value) => {
10900
- if (!value) {
10901
- return;
10902
- }
10903
- addPromotions(
10902
+ const handleSubmit = form.handleSubmit(async (data) => {
10903
+ const parsedData = parseValues(data);
10904
+ await mutateAsync(
10904
10905
  {
10905
- promo_codes: [value]
10906
+ metadata: parsedData
10906
10907
  },
10907
10908
  {
10908
- onError: (e) => {
10909
- ui.toast.error(e.message);
10910
- comboboxData.onSearchValueChange("");
10911
- setComboboxValue("");
10912
- },
10913
10909
  onSuccess: () => {
10914
- comboboxData.onSearchValueChange("");
10915
- setComboboxValue("");
10910
+ ui.toast.success("Metadata updated");
10911
+ handleSuccess();
10912
+ },
10913
+ onError: (error) => {
10914
+ ui.toast.error(error.message);
10916
10915
  }
10917
10916
  }
10918
10917
  );
10919
- };
10920
- const { mutateAsync: confirmOrderEdit } = useDraftOrderConfirmEdit(preview.id);
10921
- const { mutateAsync: requestOrderEdit } = useOrderEditRequest(preview.id);
10922
- const onSubmit = async () => {
10923
- setIsSubmitting(true);
10924
- let requestSucceeded = false;
10925
- await requestOrderEdit(void 0, {
10926
- onError: (e) => {
10927
- ui.toast.error(e.message);
10928
- },
10929
- onSuccess: () => {
10930
- requestSucceeded = true;
10931
- }
10932
- });
10933
- if (!requestSucceeded) {
10934
- setIsSubmitting(false);
10935
- return;
10918
+ });
10919
+ const { fields, insert, remove } = reactHookForm.useFieldArray({
10920
+ control: form.control,
10921
+ name: "metadata"
10922
+ });
10923
+ function deleteRow(index) {
10924
+ remove(index);
10925
+ if (fields.length === 1) {
10926
+ insert(0, {
10927
+ key: "",
10928
+ value: "",
10929
+ disabled: false
10930
+ });
10936
10931
  }
10937
- await confirmOrderEdit(void 0, {
10938
- onError: (e) => {
10939
- ui.toast.error(e.message);
10940
- },
10941
- onSuccess: () => {
10942
- handleSuccess();
10943
- },
10944
- onSettled: () => {
10945
- setIsSubmitting(false);
10946
- }
10947
- });
10948
- };
10949
- if (isError) {
10950
- throw error;
10951
- }
10952
- return /* @__PURE__ */ jsxRuntime.jsxs(KeyboundForm, { className: "flex flex-1 flex-col", onSubmit, children: [
10953
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-4", children: [
10954
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-3", children: [
10955
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col", children: [
10956
- /* @__PURE__ */ jsxRuntime.jsx(ui.Label, { size: "small", weight: "plus", htmlFor: "promotion-combobox", children: "Apply promotions" }),
10957
- /* @__PURE__ */ jsxRuntime.jsx(ui.Hint, { id: "promotion-combobox-hint", children: "Manage promotions that should be applied to the order." })
10958
- ] }),
10959
- /* @__PURE__ */ jsxRuntime.jsx(
10960
- Combobox,
10961
- {
10962
- id: "promotion-combobox",
10963
- "aria-describedby": "promotion-combobox-hint",
10964
- isFetchingNextPage: comboboxData.isFetchingNextPage,
10965
- fetchNextPage: comboboxData.fetchNextPage,
10966
- options: comboboxData.options,
10967
- onSearchValueChange: comboboxData.onSearchValueChange,
10968
- searchValue: comboboxData.searchValue,
10969
- disabled: comboboxData.disabled || isAddingPromotions,
10970
- onChange: add,
10971
- value: comboboxValue
10972
- }
10973
- )
10974
- ] }),
10975
- /* @__PURE__ */ jsxRuntime.jsx(ui.Divider, { variant: "dashed" }),
10976
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col gap-2", children: promotions == null ? void 0 : promotions.map((promotion) => /* @__PURE__ */ jsxRuntime.jsx(
10977
- PromotionItem,
10978
- {
10979
- promotion,
10980
- orderId: preview.id,
10981
- isLoading: isPending
10982
- },
10983
- promotion.id
10984
- )) })
10985
- ] }) }),
10986
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
10987
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
10988
- /* @__PURE__ */ jsxRuntime.jsx(
10989
- ui.Button,
10990
- {
10991
- size: "small",
10992
- type: "submit",
10993
- isLoading: isSubmitting || isAddingPromotions,
10994
- children: "Save"
10995
- }
10996
- )
10997
- ] }) })
10998
- ] });
10999
- };
11000
- const PromotionItem = ({
11001
- promotion,
11002
- orderId,
11003
- isLoading
11004
- }) => {
11005
- var _a;
11006
- const { mutateAsync: removePromotions, isPending } = useDraftOrderRemovePromotions(orderId);
11007
- const onRemove = async () => {
11008
- removePromotions(
11009
- {
11010
- promo_codes: [promotion.code]
11011
- },
11012
- {
11013
- onError: (e) => {
11014
- ui.toast.error(e.message);
11015
- }
11016
- }
11017
- );
11018
- };
11019
- const displayValue = getDisplayValue(promotion);
11020
- return /* @__PURE__ */ jsxRuntime.jsxs(
11021
- "div",
11022
- {
11023
- className: ui.clx(
11024
- "bg-ui-bg-component shadow-elevation-card-rest flex items-center justify-between rounded-lg px-3 py-2",
11025
- {
11026
- "animate-pulse": isLoading
11027
- }
11028
- ),
11029
- children: [
11030
- /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
11031
- /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", weight: "plus", leading: "compact", children: promotion.code }),
11032
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-ui-fg-subtle flex items-center gap-1.5", children: [
11033
- displayValue && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1.5", children: [
11034
- /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", leading: "compact", children: displayValue }),
11035
- /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", leading: "compact", children: "·" })
11036
- ] }),
11037
- /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", leading: "compact", className: "capitalize", children: (_a = promotion.application_method) == null ? void 0 : _a.allocation })
11038
- ] })
11039
- ] }),
11040
- /* @__PURE__ */ jsxRuntime.jsx(
11041
- ui.IconButton,
11042
- {
11043
- size: "small",
11044
- type: "button",
11045
- variant: "transparent",
11046
- onClick: onRemove,
11047
- isLoading: isPending || isLoading,
11048
- children: /* @__PURE__ */ jsxRuntime.jsx(icons.XMark, {})
11049
- }
11050
- )
11051
- ]
11052
- },
11053
- promotion.id
11054
- );
11055
- };
11056
- function getDisplayValue(promotion) {
11057
- var _a, _b, _c, _d;
11058
- const value = (_a = promotion.application_method) == null ? void 0 : _a.value;
11059
- if (!value) {
11060
- return null;
11061
- }
11062
- if (((_b = promotion.application_method) == null ? void 0 : _b.type) === "fixed") {
11063
- const currency = (_c = promotion.application_method) == null ? void 0 : _c.currency_code;
11064
- if (!currency) {
11065
- return null;
11066
- }
11067
- return getLocaleAmount(value, currency);
11068
- } else if (((_d = promotion.application_method) == null ? void 0 : _d.type) === "percentage") {
11069
- return formatPercentage(value);
11070
- }
11071
- return null;
11072
- }
11073
- const formatter = new Intl.NumberFormat([], {
11074
- style: "percent",
11075
- minimumFractionDigits: 2
11076
- });
11077
- const formatPercentage = (value, isPercentageValue = false) => {
11078
- let val = value || 0;
11079
- if (!isPercentageValue) {
11080
- val = val / 100;
11081
- }
11082
- return formatter.format(val);
11083
- };
11084
- function getPromotionIds(items, shippingMethods) {
11085
- const promotionIds = /* @__PURE__ */ new Set();
11086
- for (const item of items) {
11087
- if (item.adjustments) {
11088
- for (const adjustment of item.adjustments) {
11089
- if (adjustment.promotion_id) {
11090
- promotionIds.add(adjustment.promotion_id);
11091
- }
11092
- }
11093
- }
11094
- }
11095
- for (const shippingMethod of shippingMethods) {
11096
- if (shippingMethod.adjustments) {
11097
- for (const adjustment of shippingMethod.adjustments) {
11098
- if (adjustment.promotion_id) {
11099
- promotionIds.add(adjustment.promotion_id);
11100
- }
11101
- }
11102
- }
11103
- }
11104
- return Array.from(promotionIds);
11105
- }
11106
- const InlineTip = React.forwardRef(
11107
- ({ variant = "tip", label, className, children, ...props }, ref) => {
11108
- const labelValue = label || (variant === "warning" ? "Warning" : "Tip");
11109
- return /* @__PURE__ */ jsxRuntime.jsxs(
11110
- "div",
11111
- {
11112
- ref,
11113
- className: ui.clx(
11114
- "bg-ui-bg-component txt-small text-ui-fg-subtle grid grid-cols-[4px_1fr] items-start gap-3 rounded-lg border p-3",
11115
- className
11116
- ),
11117
- ...props,
11118
- children: [
11119
- /* @__PURE__ */ jsxRuntime.jsx(
11120
- "div",
11121
- {
11122
- role: "presentation",
11123
- className: ui.clx("w-4px bg-ui-tag-neutral-icon h-full rounded-full", {
11124
- "bg-ui-tag-orange-icon": variant === "warning"
11125
- })
11126
- }
11127
- ),
11128
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-pretty", children: [
11129
- /* @__PURE__ */ jsxRuntime.jsxs("strong", { className: "txt-small-plus text-ui-fg-base", children: [
11130
- labelValue,
11131
- ":"
11132
- ] }),
11133
- " ",
11134
- children
11135
- ] })
11136
- ]
11137
- }
11138
- );
11139
- }
11140
- );
11141
- InlineTip.displayName = "InlineTip";
11142
- const MetadataFieldSchema = objectType({
11143
- key: stringType(),
11144
- disabled: booleanType().optional(),
11145
- value: anyType()
11146
- });
11147
- const MetadataSchema = objectType({
11148
- metadata: arrayType(MetadataFieldSchema)
11149
- });
11150
- const Metadata = () => {
11151
- const { id } = reactRouterDom.useParams();
11152
- const { order, isPending, isError, error } = useOrder(id, {
11153
- fields: "metadata"
11154
- });
11155
- if (isError) {
11156
- throw error;
11157
- }
11158
- const isReady = !isPending && !!order;
11159
- return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
11160
- /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
11161
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Metadata" }) }),
11162
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Add metadata to the draft order." }) })
11163
- ] }),
11164
- !isReady ? /* @__PURE__ */ jsxRuntime.jsx(PlaceholderInner, {}) : /* @__PURE__ */ jsxRuntime.jsx(MetadataForm, { orderId: id, metadata: order == null ? void 0 : order.metadata })
11165
- ] });
11166
- };
11167
- const METADATA_KEY_LABEL_ID = "metadata-form-key-label";
11168
- const METADATA_VALUE_LABEL_ID = "metadata-form-value-label";
11169
- const MetadataForm = ({ orderId, metadata }) => {
11170
- const { handleSuccess } = useRouteModal();
11171
- const hasUneditableRows = getHasUneditableRows(metadata);
11172
- const { mutateAsync, isPending } = useUpdateDraftOrder(orderId);
11173
- const form = reactHookForm.useForm({
11174
- defaultValues: {
11175
- metadata: getDefaultValues(metadata)
11176
- },
11177
- resolver: zod.zodResolver(MetadataSchema)
11178
- });
11179
- const handleSubmit = form.handleSubmit(async (data) => {
11180
- const parsedData = parseValues(data);
11181
- await mutateAsync(
11182
- {
11183
- metadata: parsedData
11184
- },
11185
- {
11186
- onSuccess: () => {
11187
- ui.toast.success("Metadata updated");
11188
- handleSuccess();
11189
- },
11190
- onError: (error) => {
11191
- ui.toast.error(error.message);
11192
- }
11193
- }
11194
- );
11195
- });
11196
- const { fields, insert, remove } = reactHookForm.useFieldArray({
11197
- control: form.control,
11198
- name: "metadata"
11199
- });
11200
- function deleteRow(index) {
11201
- remove(index);
11202
- if (fields.length === 1) {
11203
- insert(0, {
11204
- key: "",
11205
- value: "",
11206
- disabled: false
11207
- });
11208
- }
11209
- }
11210
- function insertRow(index, position) {
11211
- insert(index + (position === "above" ? 0 : 1), {
11212
- key: "",
11213
- value: "",
11214
- disabled: false
10932
+ }
10933
+ function insertRow(index, position) {
10934
+ insert(index + (position === "above" ? 0 : 1), {
10935
+ key: "",
10936
+ value: "",
10937
+ disabled: false
11215
10938
  });
11216
10939
  }
11217
10940
  return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
@@ -11354,104 +11077,381 @@ const MetadataForm = ({ orderId, metadata }) => {
11354
11077
  ] }) })
11355
11078
  ]
11356
11079
  }
11357
- ) });
11358
- };
11359
- const GridInput = React.forwardRef(({ className, ...props }, ref) => {
11360
- return /* @__PURE__ */ jsxRuntime.jsx(
11361
- "input",
11362
- {
11363
- ref,
11364
- ...props,
11365
- autoComplete: "off",
11366
- className: ui.clx(
11367
- "txt-compact-small text-ui-fg-base placeholder:text-ui-fg-muted disabled:text-ui-fg-disabled disabled:bg-ui-bg-base bg-transparent px-2 py-1.5 outline-none",
11368
- className
11080
+ ) });
11081
+ };
11082
+ const GridInput = React.forwardRef(({ className, ...props }, ref) => {
11083
+ return /* @__PURE__ */ jsxRuntime.jsx(
11084
+ "input",
11085
+ {
11086
+ ref,
11087
+ ...props,
11088
+ autoComplete: "off",
11089
+ className: ui.clx(
11090
+ "txt-compact-small text-ui-fg-base placeholder:text-ui-fg-muted disabled:text-ui-fg-disabled disabled:bg-ui-bg-base bg-transparent px-2 py-1.5 outline-none",
11091
+ className
11092
+ )
11093
+ }
11094
+ );
11095
+ });
11096
+ GridInput.displayName = "MetadataForm.GridInput";
11097
+ const PlaceholderInner = () => {
11098
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-1 flex-col overflow-hidden", children: [
11099
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Skeleton, { className: "h-[148ox] w-full rounded-lg" }) }),
11100
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
11101
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Skeleton, { className: "h-7 w-12 rounded-md" }),
11102
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Skeleton, { className: "h-7 w-12 rounded-md" })
11103
+ ] }) })
11104
+ ] });
11105
+ };
11106
+ const EDITABLE_TYPES = ["string", "number", "boolean"];
11107
+ function getDefaultValues(metadata) {
11108
+ if (!metadata || !Object.keys(metadata).length) {
11109
+ return [
11110
+ {
11111
+ key: "",
11112
+ value: "",
11113
+ disabled: false
11114
+ }
11115
+ ];
11116
+ }
11117
+ return Object.entries(metadata).map(([key, value]) => {
11118
+ if (!EDITABLE_TYPES.includes(typeof value)) {
11119
+ return {
11120
+ key,
11121
+ value,
11122
+ disabled: true
11123
+ };
11124
+ }
11125
+ let stringValue = value;
11126
+ if (typeof value !== "string") {
11127
+ stringValue = JSON.stringify(value);
11128
+ }
11129
+ return {
11130
+ key,
11131
+ value: stringValue,
11132
+ original_key: key
11133
+ };
11134
+ });
11135
+ }
11136
+ function parseValues(values) {
11137
+ const metadata = values.metadata;
11138
+ const isEmpty = !metadata.length || metadata.length === 1 && !metadata[0].key && !metadata[0].value;
11139
+ if (isEmpty) {
11140
+ return null;
11141
+ }
11142
+ const update = {};
11143
+ metadata.forEach((field) => {
11144
+ let key = field.key;
11145
+ let value = field.value;
11146
+ const disabled = field.disabled;
11147
+ if (!key || !value) {
11148
+ return;
11149
+ }
11150
+ if (disabled) {
11151
+ update[key] = value;
11152
+ return;
11153
+ }
11154
+ key = key.trim();
11155
+ value = value.trim();
11156
+ if (value === "true") {
11157
+ update[key] = true;
11158
+ } else if (value === "false") {
11159
+ update[key] = false;
11160
+ } else {
11161
+ const parsedNumber = parseFloat(value);
11162
+ if (!isNaN(parsedNumber)) {
11163
+ update[key] = parsedNumber;
11164
+ } else {
11165
+ update[key] = value;
11166
+ }
11167
+ }
11168
+ });
11169
+ return update;
11170
+ }
11171
+ function getHasUneditableRows(metadata) {
11172
+ if (!metadata) {
11173
+ return false;
11174
+ }
11175
+ return Object.values(metadata).some(
11176
+ (value) => !EDITABLE_TYPES.includes(typeof value)
11177
+ );
11178
+ }
11179
+ const PROMOTION_QUERY_KEY = "promotions";
11180
+ const promotionsQueryKeys = {
11181
+ list: (query2) => [
11182
+ PROMOTION_QUERY_KEY,
11183
+ query2 ? query2 : void 0
11184
+ ],
11185
+ detail: (id, query2) => [
11186
+ PROMOTION_QUERY_KEY,
11187
+ id,
11188
+ query2 ? query2 : void 0
11189
+ ]
11190
+ };
11191
+ const usePromotions = (query2, options) => {
11192
+ const { data, ...rest } = reactQuery.useQuery({
11193
+ queryKey: promotionsQueryKeys.list(query2),
11194
+ queryFn: async () => sdk.admin.promotion.list(query2),
11195
+ ...options
11196
+ });
11197
+ return { ...data, ...rest };
11198
+ };
11199
+ const Promotions = () => {
11200
+ const { id } = reactRouterDom.useParams();
11201
+ const {
11202
+ order: preview,
11203
+ isError: isPreviewError,
11204
+ error: previewError
11205
+ } = useOrderPreview(id, void 0);
11206
+ useInitiateOrderEdit({ preview });
11207
+ const { onCancel } = useCancelOrderEdit({ preview });
11208
+ if (isPreviewError) {
11209
+ throw previewError;
11210
+ }
11211
+ const isReady = !!preview;
11212
+ return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { onClose: onCancel, children: [
11213
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Header, { children: /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Promotions" }) }) }),
11214
+ isReady && /* @__PURE__ */ jsxRuntime.jsx(PromotionForm, { preview })
11215
+ ] });
11216
+ };
11217
+ const PromotionForm = ({ preview }) => {
11218
+ const { items, shipping_methods } = preview;
11219
+ const [isSubmitting, setIsSubmitting] = React.useState(false);
11220
+ const [comboboxValue, setComboboxValue] = React.useState("");
11221
+ const { handleSuccess } = useRouteModal();
11222
+ const { mutateAsync: addPromotions, isPending: isAddingPromotions } = useDraftOrderAddPromotions(preview.id);
11223
+ const promoIds = getPromotionIds(items, shipping_methods);
11224
+ const { promotions, isPending, isError, error } = usePromotions(
11225
+ {
11226
+ id: promoIds
11227
+ },
11228
+ {
11229
+ enabled: !!promoIds.length
11230
+ }
11231
+ );
11232
+ const comboboxData = useComboboxData({
11233
+ queryKey: ["promotions", "combobox", promoIds],
11234
+ queryFn: async (params) => {
11235
+ return await sdk.admin.promotion.list({
11236
+ ...params,
11237
+ id: {
11238
+ $nin: promoIds
11239
+ }
11240
+ });
11241
+ },
11242
+ getOptions: (data) => {
11243
+ return data.promotions.map((promotion) => ({
11244
+ label: promotion.code,
11245
+ value: promotion.code
11246
+ }));
11247
+ }
11248
+ });
11249
+ const add = async (value) => {
11250
+ if (!value) {
11251
+ return;
11252
+ }
11253
+ addPromotions(
11254
+ {
11255
+ promo_codes: [value]
11256
+ },
11257
+ {
11258
+ onError: (e) => {
11259
+ ui.toast.error(e.message);
11260
+ comboboxData.onSearchValueChange("");
11261
+ setComboboxValue("");
11262
+ },
11263
+ onSuccess: () => {
11264
+ comboboxData.onSearchValueChange("");
11265
+ setComboboxValue("");
11266
+ }
11267
+ }
11268
+ );
11269
+ };
11270
+ const { mutateAsync: confirmOrderEdit } = useDraftOrderConfirmEdit(preview.id);
11271
+ const { mutateAsync: requestOrderEdit } = useOrderEditRequest(preview.id);
11272
+ const onSubmit = async () => {
11273
+ setIsSubmitting(true);
11274
+ let requestSucceeded = false;
11275
+ await requestOrderEdit(void 0, {
11276
+ onError: (e) => {
11277
+ ui.toast.error(e.message);
11278
+ },
11279
+ onSuccess: () => {
11280
+ requestSucceeded = true;
11281
+ }
11282
+ });
11283
+ if (!requestSucceeded) {
11284
+ setIsSubmitting(false);
11285
+ return;
11286
+ }
11287
+ await confirmOrderEdit(void 0, {
11288
+ onError: (e) => {
11289
+ ui.toast.error(e.message);
11290
+ },
11291
+ onSuccess: () => {
11292
+ handleSuccess();
11293
+ },
11294
+ onSettled: () => {
11295
+ setIsSubmitting(false);
11296
+ }
11297
+ });
11298
+ };
11299
+ if (isError) {
11300
+ throw error;
11301
+ }
11302
+ return /* @__PURE__ */ jsxRuntime.jsxs(KeyboundForm, { className: "flex flex-1 flex-col", onSubmit, children: [
11303
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-4", children: [
11304
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-3", children: [
11305
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col", children: [
11306
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Label, { size: "small", weight: "plus", htmlFor: "promotion-combobox", children: "Apply promotions" }),
11307
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Hint, { id: "promotion-combobox-hint", children: "Manage promotions that should be applied to the order." })
11308
+ ] }),
11309
+ /* @__PURE__ */ jsxRuntime.jsx(
11310
+ Combobox,
11311
+ {
11312
+ id: "promotion-combobox",
11313
+ "aria-describedby": "promotion-combobox-hint",
11314
+ isFetchingNextPage: comboboxData.isFetchingNextPage,
11315
+ fetchNextPage: comboboxData.fetchNextPage,
11316
+ options: comboboxData.options,
11317
+ onSearchValueChange: comboboxData.onSearchValueChange,
11318
+ searchValue: comboboxData.searchValue,
11319
+ disabled: comboboxData.disabled || isAddingPromotions,
11320
+ onChange: add,
11321
+ value: comboboxValue
11322
+ }
11323
+ )
11324
+ ] }),
11325
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Divider, { variant: "dashed" }),
11326
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col gap-2", children: promotions == null ? void 0 : promotions.map((promotion) => /* @__PURE__ */ jsxRuntime.jsx(
11327
+ PromotionItem,
11328
+ {
11329
+ promotion,
11330
+ orderId: preview.id,
11331
+ isLoading: isPending
11332
+ },
11333
+ promotion.id
11334
+ )) })
11335
+ ] }) }),
11336
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
11337
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
11338
+ /* @__PURE__ */ jsxRuntime.jsx(
11339
+ ui.Button,
11340
+ {
11341
+ size: "small",
11342
+ type: "submit",
11343
+ isLoading: isSubmitting || isAddingPromotions,
11344
+ children: "Save"
11345
+ }
11369
11346
  )
11370
- }
11371
- );
11372
- });
11373
- GridInput.displayName = "MetadataForm.GridInput";
11374
- const PlaceholderInner = () => {
11375
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-1 flex-col overflow-hidden", children: [
11376
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Skeleton, { className: "h-[148ox] w-full rounded-lg" }) }),
11377
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
11378
- /* @__PURE__ */ jsxRuntime.jsx(ui.Skeleton, { className: "h-7 w-12 rounded-md" }),
11379
- /* @__PURE__ */ jsxRuntime.jsx(ui.Skeleton, { className: "h-7 w-12 rounded-md" })
11380
11347
  ] }) })
11381
11348
  ] });
11382
11349
  };
11383
- const EDITABLE_TYPES = ["string", "number", "boolean"];
11384
- function getDefaultValues(metadata) {
11385
- if (!metadata || !Object.keys(metadata).length) {
11386
- return [
11350
+ const PromotionItem = ({
11351
+ promotion,
11352
+ orderId,
11353
+ isLoading
11354
+ }) => {
11355
+ var _a;
11356
+ const { mutateAsync: removePromotions, isPending } = useDraftOrderRemovePromotions(orderId);
11357
+ const onRemove = async () => {
11358
+ removePromotions(
11387
11359
  {
11388
- key: "",
11389
- value: "",
11390
- disabled: false
11360
+ promo_codes: [promotion.code]
11361
+ },
11362
+ {
11363
+ onError: (e) => {
11364
+ ui.toast.error(e.message);
11365
+ }
11391
11366
  }
11392
- ];
11367
+ );
11368
+ };
11369
+ const displayValue = getDisplayValue(promotion);
11370
+ return /* @__PURE__ */ jsxRuntime.jsxs(
11371
+ "div",
11372
+ {
11373
+ className: ui.clx(
11374
+ "bg-ui-bg-component shadow-elevation-card-rest flex items-center justify-between rounded-lg px-3 py-2",
11375
+ {
11376
+ "animate-pulse": isLoading
11377
+ }
11378
+ ),
11379
+ children: [
11380
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
11381
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", weight: "plus", leading: "compact", children: promotion.code }),
11382
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-ui-fg-subtle flex items-center gap-1.5", children: [
11383
+ displayValue && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1.5", children: [
11384
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", leading: "compact", children: displayValue }),
11385
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", leading: "compact", children: "·" })
11386
+ ] }),
11387
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", leading: "compact", className: "capitalize", children: (_a = promotion.application_method) == null ? void 0 : _a.allocation })
11388
+ ] })
11389
+ ] }),
11390
+ /* @__PURE__ */ jsxRuntime.jsx(
11391
+ ui.IconButton,
11392
+ {
11393
+ size: "small",
11394
+ type: "button",
11395
+ variant: "transparent",
11396
+ onClick: onRemove,
11397
+ isLoading: isPending || isLoading,
11398
+ children: /* @__PURE__ */ jsxRuntime.jsx(icons.XMark, {})
11399
+ }
11400
+ )
11401
+ ]
11402
+ },
11403
+ promotion.id
11404
+ );
11405
+ };
11406
+ function getDisplayValue(promotion) {
11407
+ var _a, _b, _c, _d;
11408
+ const value = (_a = promotion.application_method) == null ? void 0 : _a.value;
11409
+ if (!value) {
11410
+ return null;
11393
11411
  }
11394
- return Object.entries(metadata).map(([key, value]) => {
11395
- if (!EDITABLE_TYPES.includes(typeof value)) {
11396
- return {
11397
- key,
11398
- value,
11399
- disabled: true
11400
- };
11401
- }
11402
- let stringValue = value;
11403
- if (typeof value !== "string") {
11404
- stringValue = JSON.stringify(value);
11412
+ if (((_b = promotion.application_method) == null ? void 0 : _b.type) === "fixed") {
11413
+ const currency = (_c = promotion.application_method) == null ? void 0 : _c.currency_code;
11414
+ if (!currency) {
11415
+ return null;
11405
11416
  }
11406
- return {
11407
- key,
11408
- value: stringValue,
11409
- original_key: key
11410
- };
11411
- });
11417
+ return getLocaleAmount(value, currency);
11418
+ } else if (((_d = promotion.application_method) == null ? void 0 : _d.type) === "percentage") {
11419
+ return formatPercentage(value);
11420
+ }
11421
+ return null;
11412
11422
  }
11413
- function parseValues(values) {
11414
- const metadata = values.metadata;
11415
- const isEmpty = !metadata.length || metadata.length === 1 && !metadata[0].key && !metadata[0].value;
11416
- if (isEmpty) {
11417
- return null;
11423
+ const formatter = new Intl.NumberFormat([], {
11424
+ style: "percent",
11425
+ minimumFractionDigits: 2
11426
+ });
11427
+ const formatPercentage = (value, isPercentageValue = false) => {
11428
+ let val = value || 0;
11429
+ if (!isPercentageValue) {
11430
+ val = val / 100;
11418
11431
  }
11419
- const update = {};
11420
- metadata.forEach((field) => {
11421
- let key = field.key;
11422
- let value = field.value;
11423
- const disabled = field.disabled;
11424
- if (!key || !value) {
11425
- return;
11426
- }
11427
- if (disabled) {
11428
- update[key] = value;
11429
- return;
11432
+ return formatter.format(val);
11433
+ };
11434
+ function getPromotionIds(items, shippingMethods) {
11435
+ const promotionIds = /* @__PURE__ */ new Set();
11436
+ for (const item of items) {
11437
+ if (item.adjustments) {
11438
+ for (const adjustment of item.adjustments) {
11439
+ if (adjustment.promotion_id) {
11440
+ promotionIds.add(adjustment.promotion_id);
11441
+ }
11442
+ }
11430
11443
  }
11431
- key = key.trim();
11432
- value = value.trim();
11433
- if (value === "true") {
11434
- update[key] = true;
11435
- } else if (value === "false") {
11436
- update[key] = false;
11437
- } else {
11438
- const parsedNumber = parseFloat(value);
11439
- if (!isNaN(parsedNumber)) {
11440
- update[key] = parsedNumber;
11441
- } else {
11442
- update[key] = value;
11444
+ }
11445
+ for (const shippingMethod of shippingMethods) {
11446
+ if (shippingMethod.adjustments) {
11447
+ for (const adjustment of shippingMethod.adjustments) {
11448
+ if (adjustment.promotion_id) {
11449
+ promotionIds.add(adjustment.promotion_id);
11450
+ }
11443
11451
  }
11444
11452
  }
11445
- });
11446
- return update;
11447
- }
11448
- function getHasUneditableRows(metadata) {
11449
- if (!metadata) {
11450
- return false;
11451
11453
  }
11452
- return Object.values(metadata).some(
11453
- (value) => !EDITABLE_TYPES.includes(typeof value)
11454
- );
11454
+ return Array.from(promotionIds);
11455
11455
  }
11456
11456
  const SalesChannel = () => {
11457
11457
  const { id } = reactRouterDom.useParams();
@@ -13069,26 +13069,26 @@ const routeModule = {
13069
13069
  Component: BillingAddress,
13070
13070
  path: "/draft-orders/:id/billing-address"
13071
13071
  },
13072
- {
13073
- Component: Email,
13074
- path: "/draft-orders/:id/email"
13075
- },
13076
13072
  {
13077
13073
  Component: CustomItems,
13078
13074
  path: "/draft-orders/:id/custom-items"
13079
13075
  },
13080
13076
  {
13081
- Component: Items,
13082
- path: "/draft-orders/:id/items"
13077
+ Component: Email,
13078
+ path: "/draft-orders/:id/email"
13083
13079
  },
13084
13080
  {
13085
- Component: Promotions,
13086
- path: "/draft-orders/:id/promotions"
13081
+ Component: Items,
13082
+ path: "/draft-orders/:id/items"
13087
13083
  },
13088
13084
  {
13089
13085
  Component: Metadata,
13090
13086
  path: "/draft-orders/:id/metadata"
13091
13087
  },
13088
+ {
13089
+ Component: Promotions,
13090
+ path: "/draft-orders/:id/promotions"
13091
+ },
13092
13092
  {
13093
13093
  Component: SalesChannel,
13094
13094
  path: "/draft-orders/:id/sales-channel"