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