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