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