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