@medusajs/draft-order 2.11.0-snapshot-20251019075109 → 2.11.0
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 +495 -497
- package/.medusa/server/src/admin/index.mjs +495 -497
- package/package.json +22 -24
|
@@ -7823,12 +7823,10 @@ const CustomerField$1 = ({ control, setValue }) => {
|
|
|
7823
7823
|
(option) => option.value === value
|
|
7824
7824
|
)) == null ? void 0 : _a.label;
|
|
7825
7825
|
const customerEmail = ((_b = label == null ? void 0 : label.match(/\((.*@.*)\)$/)) == null ? void 0 : _b[1]) || label;
|
|
7826
|
-
|
|
7827
|
-
|
|
7828
|
-
|
|
7829
|
-
|
|
7830
|
-
});
|
|
7831
|
-
}
|
|
7826
|
+
setValue("email", customerEmail || "", {
|
|
7827
|
+
shouldDirty: true,
|
|
7828
|
+
shouldTouch: true
|
|
7829
|
+
});
|
|
7832
7830
|
},
|
|
7833
7831
|
[email, setValue, customers.options]
|
|
7834
7832
|
);
|
|
@@ -9784,74 +9782,6 @@ const BillingAddressForm = ({ order }) => {
|
|
|
9784
9782
|
) });
|
|
9785
9783
|
};
|
|
9786
9784
|
const schema$4 = addressSchema;
|
|
9787
|
-
const Email = () => {
|
|
9788
|
-
const { id } = reactRouterDom.useParams();
|
|
9789
|
-
const { order, isPending, isError, error } = useOrder(id, {
|
|
9790
|
-
fields: "+email"
|
|
9791
|
-
});
|
|
9792
|
-
if (isError) {
|
|
9793
|
-
throw error;
|
|
9794
|
-
}
|
|
9795
|
-
const isReady = !isPending && !!order;
|
|
9796
|
-
return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
|
|
9797
|
-
/* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
|
|
9798
|
-
/* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Email" }) }),
|
|
9799
|
-
/* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit the email for the draft order" }) })
|
|
9800
|
-
] }),
|
|
9801
|
-
isReady && /* @__PURE__ */ jsxRuntime.jsx(EmailForm, { order })
|
|
9802
|
-
] });
|
|
9803
|
-
};
|
|
9804
|
-
const EmailForm = ({ order }) => {
|
|
9805
|
-
const form = reactHookForm.useForm({
|
|
9806
|
-
defaultValues: {
|
|
9807
|
-
email: order.email ?? ""
|
|
9808
|
-
},
|
|
9809
|
-
resolver: zod.zodResolver(schema$3)
|
|
9810
|
-
});
|
|
9811
|
-
const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
|
|
9812
|
-
const { handleSuccess } = useRouteModal();
|
|
9813
|
-
const onSubmit = form.handleSubmit(async (data) => {
|
|
9814
|
-
await mutateAsync(
|
|
9815
|
-
{ email: data.email },
|
|
9816
|
-
{
|
|
9817
|
-
onSuccess: () => {
|
|
9818
|
-
handleSuccess();
|
|
9819
|
-
},
|
|
9820
|
-
onError: (error) => {
|
|
9821
|
-
ui.toast.error(error.message);
|
|
9822
|
-
}
|
|
9823
|
-
}
|
|
9824
|
-
);
|
|
9825
|
-
});
|
|
9826
|
-
return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
|
|
9827
|
-
KeyboundForm,
|
|
9828
|
-
{
|
|
9829
|
-
className: "flex flex-1 flex-col overflow-hidden",
|
|
9830
|
-
onSubmit,
|
|
9831
|
-
children: [
|
|
9832
|
-
/* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
9833
|
-
Form$2.Field,
|
|
9834
|
-
{
|
|
9835
|
-
control: form.control,
|
|
9836
|
-
name: "email",
|
|
9837
|
-
render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
|
|
9838
|
-
/* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Email" }),
|
|
9839
|
-
/* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
|
|
9840
|
-
/* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
|
|
9841
|
-
] })
|
|
9842
|
-
}
|
|
9843
|
-
) }),
|
|
9844
|
-
/* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
|
|
9845
|
-
/* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
|
|
9846
|
-
/* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
|
|
9847
|
-
] }) })
|
|
9848
|
-
]
|
|
9849
|
-
}
|
|
9850
|
-
) });
|
|
9851
|
-
};
|
|
9852
|
-
const schema$3 = objectType({
|
|
9853
|
-
email: stringType().email()
|
|
9854
|
-
});
|
|
9855
9785
|
const NumberInput = React.forwardRef(
|
|
9856
9786
|
({
|
|
9857
9787
|
value,
|
|
@@ -10826,54 +10756,10 @@ const customItemSchema = objectType({
|
|
|
10826
10756
|
quantity: numberType(),
|
|
10827
10757
|
unit_price: unionType([numberType(), stringType()])
|
|
10828
10758
|
});
|
|
10829
|
-
const
|
|
10830
|
-
({ variant = "tip", label, className, children, ...props }, ref) => {
|
|
10831
|
-
const labelValue = label || (variant === "warning" ? "Warning" : "Tip");
|
|
10832
|
-
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
10833
|
-
"div",
|
|
10834
|
-
{
|
|
10835
|
-
ref,
|
|
10836
|
-
className: ui.clx(
|
|
10837
|
-
"bg-ui-bg-component txt-small text-ui-fg-subtle grid grid-cols-[4px_1fr] items-start gap-3 rounded-lg border p-3",
|
|
10838
|
-
className
|
|
10839
|
-
),
|
|
10840
|
-
...props,
|
|
10841
|
-
children: [
|
|
10842
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
10843
|
-
"div",
|
|
10844
|
-
{
|
|
10845
|
-
role: "presentation",
|
|
10846
|
-
className: ui.clx("w-4px bg-ui-tag-neutral-icon h-full rounded-full", {
|
|
10847
|
-
"bg-ui-tag-orange-icon": variant === "warning"
|
|
10848
|
-
})
|
|
10849
|
-
}
|
|
10850
|
-
),
|
|
10851
|
-
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-pretty", children: [
|
|
10852
|
-
/* @__PURE__ */ jsxRuntime.jsxs("strong", { className: "txt-small-plus text-ui-fg-base", children: [
|
|
10853
|
-
labelValue,
|
|
10854
|
-
":"
|
|
10855
|
-
] }),
|
|
10856
|
-
" ",
|
|
10857
|
-
children
|
|
10858
|
-
] })
|
|
10859
|
-
]
|
|
10860
|
-
}
|
|
10861
|
-
);
|
|
10862
|
-
}
|
|
10863
|
-
);
|
|
10864
|
-
InlineTip.displayName = "InlineTip";
|
|
10865
|
-
const MetadataFieldSchema = objectType({
|
|
10866
|
-
key: stringType(),
|
|
10867
|
-
disabled: booleanType().optional(),
|
|
10868
|
-
value: anyType()
|
|
10869
|
-
});
|
|
10870
|
-
const MetadataSchema = objectType({
|
|
10871
|
-
metadata: arrayType(MetadataFieldSchema)
|
|
10872
|
-
});
|
|
10873
|
-
const Metadata = () => {
|
|
10759
|
+
const Email = () => {
|
|
10874
10760
|
const { id } = reactRouterDom.useParams();
|
|
10875
10761
|
const { order, isPending, isError, error } = useOrder(id, {
|
|
10876
|
-
fields: "
|
|
10762
|
+
fields: "+email"
|
|
10877
10763
|
});
|
|
10878
10764
|
if (isError) {
|
|
10879
10765
|
throw error;
|
|
@@ -10881,33 +10767,103 @@ const Metadata = () => {
|
|
|
10881
10767
|
const isReady = !isPending && !!order;
|
|
10882
10768
|
return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
|
|
10883
10769
|
/* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
|
|
10884
|
-
/* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "
|
|
10885
|
-
/* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "
|
|
10770
|
+
/* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Email" }) }),
|
|
10771
|
+
/* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit the email for the draft order" }) })
|
|
10886
10772
|
] }),
|
|
10887
|
-
|
|
10773
|
+
isReady && /* @__PURE__ */ jsxRuntime.jsx(EmailForm, { order })
|
|
10888
10774
|
] });
|
|
10889
10775
|
};
|
|
10890
|
-
const
|
|
10891
|
-
const
|
|
10892
|
-
|
|
10776
|
+
const EmailForm = ({ order }) => {
|
|
10777
|
+
const form = reactHookForm.useForm({
|
|
10778
|
+
defaultValues: {
|
|
10779
|
+
email: order.email ?? ""
|
|
10780
|
+
},
|
|
10781
|
+
resolver: zod.zodResolver(schema$3)
|
|
10782
|
+
});
|
|
10783
|
+
const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
|
|
10893
10784
|
const { handleSuccess } = useRouteModal();
|
|
10894
|
-
const
|
|
10895
|
-
|
|
10785
|
+
const onSubmit = form.handleSubmit(async (data) => {
|
|
10786
|
+
await mutateAsync(
|
|
10787
|
+
{ email: data.email },
|
|
10788
|
+
{
|
|
10789
|
+
onSuccess: () => {
|
|
10790
|
+
handleSuccess();
|
|
10791
|
+
},
|
|
10792
|
+
onError: (error) => {
|
|
10793
|
+
ui.toast.error(error.message);
|
|
10794
|
+
}
|
|
10795
|
+
}
|
|
10796
|
+
);
|
|
10797
|
+
});
|
|
10798
|
+
return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
|
|
10799
|
+
KeyboundForm,
|
|
10800
|
+
{
|
|
10801
|
+
className: "flex flex-1 flex-col overflow-hidden",
|
|
10802
|
+
onSubmit,
|
|
10803
|
+
children: [
|
|
10804
|
+
/* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
10805
|
+
Form$2.Field,
|
|
10806
|
+
{
|
|
10807
|
+
control: form.control,
|
|
10808
|
+
name: "email",
|
|
10809
|
+
render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
|
|
10810
|
+
/* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Email" }),
|
|
10811
|
+
/* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
|
|
10812
|
+
/* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
|
|
10813
|
+
] })
|
|
10814
|
+
}
|
|
10815
|
+
) }),
|
|
10816
|
+
/* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
|
|
10817
|
+
/* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
|
|
10818
|
+
/* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
|
|
10819
|
+
] }) })
|
|
10820
|
+
]
|
|
10821
|
+
}
|
|
10822
|
+
) });
|
|
10823
|
+
};
|
|
10824
|
+
const schema$3 = objectType({
|
|
10825
|
+
email: stringType().email()
|
|
10826
|
+
});
|
|
10827
|
+
const SalesChannel = () => {
|
|
10828
|
+
const { id } = reactRouterDom.useParams();
|
|
10829
|
+
const { draft_order, isPending, isError, error } = useDraftOrder(
|
|
10830
|
+
id,
|
|
10831
|
+
{
|
|
10832
|
+
fields: "+sales_channel_id"
|
|
10833
|
+
},
|
|
10834
|
+
{
|
|
10835
|
+
enabled: !!id
|
|
10836
|
+
}
|
|
10837
|
+
);
|
|
10838
|
+
if (isError) {
|
|
10839
|
+
throw error;
|
|
10840
|
+
}
|
|
10841
|
+
const ISrEADY = !!draft_order && !isPending;
|
|
10842
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
|
|
10843
|
+
/* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
|
|
10844
|
+
/* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Sales Channel" }) }),
|
|
10845
|
+
/* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Update which sales channel the draft order is associated with" }) })
|
|
10846
|
+
] }),
|
|
10847
|
+
ISrEADY && /* @__PURE__ */ jsxRuntime.jsx(SalesChannelForm, { order: draft_order })
|
|
10848
|
+
] });
|
|
10849
|
+
};
|
|
10850
|
+
const SalesChannelForm = ({ order }) => {
|
|
10896
10851
|
const form = reactHookForm.useForm({
|
|
10897
10852
|
defaultValues: {
|
|
10898
|
-
|
|
10853
|
+
sales_channel_id: order.sales_channel_id || ""
|
|
10899
10854
|
},
|
|
10900
|
-
resolver: zod.zodResolver(
|
|
10855
|
+
resolver: zod.zodResolver(schema$2)
|
|
10901
10856
|
});
|
|
10902
|
-
const
|
|
10903
|
-
|
|
10857
|
+
const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
|
|
10858
|
+
const { handleSuccess } = useRouteModal();
|
|
10859
|
+
const onSubmit = form.handleSubmit(async (data) => {
|
|
10904
10860
|
await mutateAsync(
|
|
10905
10861
|
{
|
|
10906
|
-
|
|
10862
|
+
sales_channel_id: data.sales_channel_id
|
|
10907
10863
|
},
|
|
10908
10864
|
{
|
|
10909
10865
|
onSuccess: () => {
|
|
10910
|
-
ui.toast.success("
|
|
10866
|
+
ui.toast.success("Sales channel updated");
|
|
10911
10867
|
handleSuccess();
|
|
10912
10868
|
},
|
|
10913
10869
|
onError: (error) => {
|
|
@@ -10916,266 +10872,64 @@ const MetadataForm = ({ orderId, metadata }) => {
|
|
|
10916
10872
|
}
|
|
10917
10873
|
);
|
|
10918
10874
|
});
|
|
10919
|
-
const { fields, insert, remove } = reactHookForm.useFieldArray({
|
|
10920
|
-
control: form.control,
|
|
10921
|
-
name: "metadata"
|
|
10922
|
-
});
|
|
10923
|
-
function deleteRow(index) {
|
|
10924
|
-
remove(index);
|
|
10925
|
-
if (fields.length === 1) {
|
|
10926
|
-
insert(0, {
|
|
10927
|
-
key: "",
|
|
10928
|
-
value: "",
|
|
10929
|
-
disabled: false
|
|
10930
|
-
});
|
|
10931
|
-
}
|
|
10932
|
-
}
|
|
10933
|
-
function insertRow(index, position) {
|
|
10934
|
-
insert(index + (position === "above" ? 0 : 1), {
|
|
10935
|
-
key: "",
|
|
10936
|
-
value: "",
|
|
10937
|
-
disabled: false
|
|
10938
|
-
});
|
|
10939
|
-
}
|
|
10940
10875
|
return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
|
|
10941
10876
|
KeyboundForm,
|
|
10942
10877
|
{
|
|
10943
|
-
onSubmit: handleSubmit,
|
|
10944
10878
|
className: "flex flex-1 flex-col overflow-hidden",
|
|
10879
|
+
onSubmit,
|
|
10945
10880
|
children: [
|
|
10946
|
-
/* @__PURE__ */ jsxRuntime.
|
|
10947
|
-
|
|
10948
|
-
|
|
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." })
|
|
11073
|
-
] }),
|
|
11074
|
-
/* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
|
|
11075
|
-
/* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", type: "button", children: "Cancel" }) }),
|
|
10881
|
+
/* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsx(SalesChannelField, { control: form.control, order }) }),
|
|
10882
|
+
/* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
|
|
10883
|
+
/* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
|
|
11076
10884
|
/* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
|
|
11077
10885
|
] }) })
|
|
11078
10886
|
]
|
|
11079
10887
|
}
|
|
11080
10888
|
) });
|
|
11081
10889
|
};
|
|
11082
|
-
const
|
|
10890
|
+
const SalesChannelField = ({ control, order }) => {
|
|
10891
|
+
const salesChannels = useComboboxData({
|
|
10892
|
+
queryFn: async (params) => {
|
|
10893
|
+
return await sdk.admin.salesChannel.list(params);
|
|
10894
|
+
},
|
|
10895
|
+
queryKey: ["sales-channels"],
|
|
10896
|
+
getOptions: (data) => {
|
|
10897
|
+
return data.sales_channels.map((salesChannel) => ({
|
|
10898
|
+
label: salesChannel.name,
|
|
10899
|
+
value: salesChannel.id
|
|
10900
|
+
}));
|
|
10901
|
+
},
|
|
10902
|
+
defaultValue: order.sales_channel_id || void 0
|
|
10903
|
+
});
|
|
11083
10904
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
11084
|
-
|
|
10905
|
+
Form$2.Field,
|
|
11085
10906
|
{
|
|
11086
|
-
|
|
11087
|
-
|
|
11088
|
-
|
|
11089
|
-
|
|
11090
|
-
|
|
11091
|
-
|
|
11092
|
-
|
|
11093
|
-
|
|
11094
|
-
|
|
11095
|
-
|
|
11096
|
-
|
|
11097
|
-
|
|
11098
|
-
|
|
11099
|
-
|
|
11100
|
-
|
|
11101
|
-
|
|
11102
|
-
|
|
11103
|
-
|
|
11104
|
-
|
|
11105
|
-
};
|
|
11106
|
-
const EDITABLE_TYPES = ["string", "number", "boolean"];
|
|
11107
|
-
function getDefaultValues(metadata) {
|
|
11108
|
-
if (!metadata || !Object.keys(metadata).length) {
|
|
11109
|
-
return [
|
|
11110
|
-
{
|
|
11111
|
-
key: "",
|
|
11112
|
-
value: "",
|
|
11113
|
-
disabled: false
|
|
11114
|
-
}
|
|
11115
|
-
];
|
|
11116
|
-
}
|
|
11117
|
-
return Object.entries(metadata).map(([key, value]) => {
|
|
11118
|
-
if (!EDITABLE_TYPES.includes(typeof value)) {
|
|
11119
|
-
return {
|
|
11120
|
-
key,
|
|
11121
|
-
value,
|
|
11122
|
-
disabled: true
|
|
11123
|
-
};
|
|
11124
|
-
}
|
|
11125
|
-
let stringValue = value;
|
|
11126
|
-
if (typeof value !== "string") {
|
|
11127
|
-
stringValue = JSON.stringify(value);
|
|
11128
|
-
}
|
|
11129
|
-
return {
|
|
11130
|
-
key,
|
|
11131
|
-
value: stringValue,
|
|
11132
|
-
original_key: key
|
|
11133
|
-
};
|
|
11134
|
-
});
|
|
11135
|
-
}
|
|
11136
|
-
function parseValues(values) {
|
|
11137
|
-
const metadata = values.metadata;
|
|
11138
|
-
const isEmpty = !metadata.length || metadata.length === 1 && !metadata[0].key && !metadata[0].value;
|
|
11139
|
-
if (isEmpty) {
|
|
11140
|
-
return null;
|
|
11141
|
-
}
|
|
11142
|
-
const update = {};
|
|
11143
|
-
metadata.forEach((field) => {
|
|
11144
|
-
let key = field.key;
|
|
11145
|
-
let value = field.value;
|
|
11146
|
-
const disabled = field.disabled;
|
|
11147
|
-
if (!key || !value) {
|
|
11148
|
-
return;
|
|
11149
|
-
}
|
|
11150
|
-
if (disabled) {
|
|
11151
|
-
update[key] = value;
|
|
11152
|
-
return;
|
|
11153
|
-
}
|
|
11154
|
-
key = key.trim();
|
|
11155
|
-
value = value.trim();
|
|
11156
|
-
if (value === "true") {
|
|
11157
|
-
update[key] = true;
|
|
11158
|
-
} else if (value === "false") {
|
|
11159
|
-
update[key] = false;
|
|
11160
|
-
} else {
|
|
11161
|
-
const parsedNumber = parseFloat(value);
|
|
11162
|
-
if (!isNaN(parsedNumber)) {
|
|
11163
|
-
update[key] = parsedNumber;
|
|
11164
|
-
} else {
|
|
11165
|
-
update[key] = value;
|
|
10907
|
+
control,
|
|
10908
|
+
name: "sales_channel_id",
|
|
10909
|
+
render: ({ field }) => {
|
|
10910
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
|
|
10911
|
+
/* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Sales Channel" }),
|
|
10912
|
+
/* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
10913
|
+
Combobox,
|
|
10914
|
+
{
|
|
10915
|
+
options: salesChannels.options,
|
|
10916
|
+
fetchNextPage: salesChannels.fetchNextPage,
|
|
10917
|
+
isFetchingNextPage: salesChannels.isFetchingNextPage,
|
|
10918
|
+
searchValue: salesChannels.searchValue,
|
|
10919
|
+
onSearchValueChange: salesChannels.onSearchValueChange,
|
|
10920
|
+
placeholder: "Select sales channel",
|
|
10921
|
+
...field
|
|
10922
|
+
}
|
|
10923
|
+
) }),
|
|
10924
|
+
/* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
|
|
10925
|
+
] });
|
|
11166
10926
|
}
|
|
11167
10927
|
}
|
|
11168
|
-
});
|
|
11169
|
-
return update;
|
|
11170
|
-
}
|
|
11171
|
-
function getHasUneditableRows(metadata) {
|
|
11172
|
-
if (!metadata) {
|
|
11173
|
-
return false;
|
|
11174
|
-
}
|
|
11175
|
-
return Object.values(metadata).some(
|
|
11176
|
-
(value) => !EDITABLE_TYPES.includes(typeof value)
|
|
11177
10928
|
);
|
|
11178
|
-
}
|
|
10929
|
+
};
|
|
10930
|
+
const schema$2 = objectType({
|
|
10931
|
+
sales_channel_id: stringType().min(1)
|
|
10932
|
+
});
|
|
11179
10933
|
const PROMOTION_QUERY_KEY = "promotions";
|
|
11180
10934
|
const promotionsQueryKeys = {
|
|
11181
10935
|
list: (query2) => [
|
|
@@ -11453,115 +11207,9 @@ function getPromotionIds(items, shippingMethods) {
|
|
|
11453
11207
|
}
|
|
11454
11208
|
return Array.from(promotionIds);
|
|
11455
11209
|
}
|
|
11456
|
-
const
|
|
11457
|
-
|
|
11458
|
-
|
|
11459
|
-
id,
|
|
11460
|
-
{
|
|
11461
|
-
fields: "+sales_channel_id"
|
|
11462
|
-
},
|
|
11463
|
-
{
|
|
11464
|
-
enabled: !!id
|
|
11465
|
-
}
|
|
11466
|
-
);
|
|
11467
|
-
if (isError) {
|
|
11468
|
-
throw error;
|
|
11469
|
-
}
|
|
11470
|
-
const ISrEADY = !!draft_order && !isPending;
|
|
11471
|
-
return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
|
|
11472
|
-
/* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
|
|
11473
|
-
/* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Sales Channel" }) }),
|
|
11474
|
-
/* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Update which sales channel the draft order is associated with" }) })
|
|
11475
|
-
] }),
|
|
11476
|
-
ISrEADY && /* @__PURE__ */ jsxRuntime.jsx(SalesChannelForm, { order: draft_order })
|
|
11477
|
-
] });
|
|
11478
|
-
};
|
|
11479
|
-
const SalesChannelForm = ({ order }) => {
|
|
11480
|
-
const form = reactHookForm.useForm({
|
|
11481
|
-
defaultValues: {
|
|
11482
|
-
sales_channel_id: order.sales_channel_id || ""
|
|
11483
|
-
},
|
|
11484
|
-
resolver: zod.zodResolver(schema$2)
|
|
11485
|
-
});
|
|
11486
|
-
const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
|
|
11487
|
-
const { handleSuccess } = useRouteModal();
|
|
11488
|
-
const onSubmit = form.handleSubmit(async (data) => {
|
|
11489
|
-
await mutateAsync(
|
|
11490
|
-
{
|
|
11491
|
-
sales_channel_id: data.sales_channel_id
|
|
11492
|
-
},
|
|
11493
|
-
{
|
|
11494
|
-
onSuccess: () => {
|
|
11495
|
-
ui.toast.success("Sales channel updated");
|
|
11496
|
-
handleSuccess();
|
|
11497
|
-
},
|
|
11498
|
-
onError: (error) => {
|
|
11499
|
-
ui.toast.error(error.message);
|
|
11500
|
-
}
|
|
11501
|
-
}
|
|
11502
|
-
);
|
|
11503
|
-
});
|
|
11504
|
-
return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
|
|
11505
|
-
KeyboundForm,
|
|
11506
|
-
{
|
|
11507
|
-
className: "flex flex-1 flex-col overflow-hidden",
|
|
11508
|
-
onSubmit,
|
|
11509
|
-
children: [
|
|
11510
|
-
/* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsx(SalesChannelField, { control: form.control, order }) }),
|
|
11511
|
-
/* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
|
|
11512
|
-
/* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
|
|
11513
|
-
/* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
|
|
11514
|
-
] }) })
|
|
11515
|
-
]
|
|
11516
|
-
}
|
|
11517
|
-
) });
|
|
11518
|
-
};
|
|
11519
|
-
const SalesChannelField = ({ control, order }) => {
|
|
11520
|
-
const salesChannels = useComboboxData({
|
|
11521
|
-
queryFn: async (params) => {
|
|
11522
|
-
return await sdk.admin.salesChannel.list(params);
|
|
11523
|
-
},
|
|
11524
|
-
queryKey: ["sales-channels"],
|
|
11525
|
-
getOptions: (data) => {
|
|
11526
|
-
return data.sales_channels.map((salesChannel) => ({
|
|
11527
|
-
label: salesChannel.name,
|
|
11528
|
-
value: salesChannel.id
|
|
11529
|
-
}));
|
|
11530
|
-
},
|
|
11531
|
-
defaultValue: order.sales_channel_id || void 0
|
|
11532
|
-
});
|
|
11533
|
-
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
11534
|
-
Form$2.Field,
|
|
11535
|
-
{
|
|
11536
|
-
control,
|
|
11537
|
-
name: "sales_channel_id",
|
|
11538
|
-
render: ({ field }) => {
|
|
11539
|
-
return /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
|
|
11540
|
-
/* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Sales Channel" }),
|
|
11541
|
-
/* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
11542
|
-
Combobox,
|
|
11543
|
-
{
|
|
11544
|
-
options: salesChannels.options,
|
|
11545
|
-
fetchNextPage: salesChannels.fetchNextPage,
|
|
11546
|
-
isFetchingNextPage: salesChannels.isFetchingNextPage,
|
|
11547
|
-
searchValue: salesChannels.searchValue,
|
|
11548
|
-
onSearchValueChange: salesChannels.onSearchValueChange,
|
|
11549
|
-
placeholder: "Select sales channel",
|
|
11550
|
-
...field
|
|
11551
|
-
}
|
|
11552
|
-
) }),
|
|
11553
|
-
/* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
|
|
11554
|
-
] });
|
|
11555
|
-
}
|
|
11556
|
-
}
|
|
11557
|
-
);
|
|
11558
|
-
};
|
|
11559
|
-
const schema$2 = objectType({
|
|
11560
|
-
sales_channel_id: stringType().min(1)
|
|
11561
|
-
});
|
|
11562
|
-
const STACKED_FOCUS_MODAL_ID = "shipping-form";
|
|
11563
|
-
const Shipping = () => {
|
|
11564
|
-
var _a;
|
|
11210
|
+
const STACKED_FOCUS_MODAL_ID = "shipping-form";
|
|
11211
|
+
const Shipping = () => {
|
|
11212
|
+
var _a;
|
|
11565
11213
|
const { id } = reactRouterDom.useParams();
|
|
11566
11214
|
const { order, isPending, isError, error } = useOrder(id, {
|
|
11567
11215
|
fields: "+items.*,+items.variant.*,+items.variant.product.*,+items.variant.product.shipping_profile.*,+currency_code"
|
|
@@ -13045,6 +12693,356 @@ const Illustration = () => {
|
|
|
13045
12693
|
const schema = objectType({
|
|
13046
12694
|
customer_id: stringType().min(1)
|
|
13047
12695
|
});
|
|
12696
|
+
const InlineTip = React.forwardRef(
|
|
12697
|
+
({ variant = "tip", label, className, children, ...props }, ref) => {
|
|
12698
|
+
const labelValue = label || (variant === "warning" ? "Warning" : "Tip");
|
|
12699
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
12700
|
+
"div",
|
|
12701
|
+
{
|
|
12702
|
+
ref,
|
|
12703
|
+
className: ui.clx(
|
|
12704
|
+
"bg-ui-bg-component txt-small text-ui-fg-subtle grid grid-cols-[4px_1fr] items-start gap-3 rounded-lg border p-3",
|
|
12705
|
+
className
|
|
12706
|
+
),
|
|
12707
|
+
...props,
|
|
12708
|
+
children: [
|
|
12709
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
12710
|
+
"div",
|
|
12711
|
+
{
|
|
12712
|
+
role: "presentation",
|
|
12713
|
+
className: ui.clx("w-4px bg-ui-tag-neutral-icon h-full rounded-full", {
|
|
12714
|
+
"bg-ui-tag-orange-icon": variant === "warning"
|
|
12715
|
+
})
|
|
12716
|
+
}
|
|
12717
|
+
),
|
|
12718
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-pretty", children: [
|
|
12719
|
+
/* @__PURE__ */ jsxRuntime.jsxs("strong", { className: "txt-small-plus text-ui-fg-base", children: [
|
|
12720
|
+
labelValue,
|
|
12721
|
+
":"
|
|
12722
|
+
] }),
|
|
12723
|
+
" ",
|
|
12724
|
+
children
|
|
12725
|
+
] })
|
|
12726
|
+
]
|
|
12727
|
+
}
|
|
12728
|
+
);
|
|
12729
|
+
}
|
|
12730
|
+
);
|
|
12731
|
+
InlineTip.displayName = "InlineTip";
|
|
12732
|
+
const MetadataFieldSchema = objectType({
|
|
12733
|
+
key: stringType(),
|
|
12734
|
+
disabled: booleanType().optional(),
|
|
12735
|
+
value: anyType()
|
|
12736
|
+
});
|
|
12737
|
+
const MetadataSchema = objectType({
|
|
12738
|
+
metadata: arrayType(MetadataFieldSchema)
|
|
12739
|
+
});
|
|
12740
|
+
const Metadata = () => {
|
|
12741
|
+
const { id } = reactRouterDom.useParams();
|
|
12742
|
+
const { order, isPending, isError, error } = useOrder(id, {
|
|
12743
|
+
fields: "metadata"
|
|
12744
|
+
});
|
|
12745
|
+
if (isError) {
|
|
12746
|
+
throw error;
|
|
12747
|
+
}
|
|
12748
|
+
const isReady = !isPending && !!order;
|
|
12749
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
|
|
12750
|
+
/* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
|
|
12751
|
+
/* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Metadata" }) }),
|
|
12752
|
+
/* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Add metadata to the draft order." }) })
|
|
12753
|
+
] }),
|
|
12754
|
+
!isReady ? /* @__PURE__ */ jsxRuntime.jsx(PlaceholderInner, {}) : /* @__PURE__ */ jsxRuntime.jsx(MetadataForm, { orderId: id, metadata: order == null ? void 0 : order.metadata })
|
|
12755
|
+
] });
|
|
12756
|
+
};
|
|
12757
|
+
const METADATA_KEY_LABEL_ID = "metadata-form-key-label";
|
|
12758
|
+
const METADATA_VALUE_LABEL_ID = "metadata-form-value-label";
|
|
12759
|
+
const MetadataForm = ({ orderId, metadata }) => {
|
|
12760
|
+
const { handleSuccess } = useRouteModal();
|
|
12761
|
+
const hasUneditableRows = getHasUneditableRows(metadata);
|
|
12762
|
+
const { mutateAsync, isPending } = useUpdateDraftOrder(orderId);
|
|
12763
|
+
const form = reactHookForm.useForm({
|
|
12764
|
+
defaultValues: {
|
|
12765
|
+
metadata: getDefaultValues(metadata)
|
|
12766
|
+
},
|
|
12767
|
+
resolver: zod.zodResolver(MetadataSchema)
|
|
12768
|
+
});
|
|
12769
|
+
const handleSubmit = form.handleSubmit(async (data) => {
|
|
12770
|
+
const parsedData = parseValues(data);
|
|
12771
|
+
await mutateAsync(
|
|
12772
|
+
{
|
|
12773
|
+
metadata: parsedData
|
|
12774
|
+
},
|
|
12775
|
+
{
|
|
12776
|
+
onSuccess: () => {
|
|
12777
|
+
ui.toast.success("Metadata updated");
|
|
12778
|
+
handleSuccess();
|
|
12779
|
+
},
|
|
12780
|
+
onError: (error) => {
|
|
12781
|
+
ui.toast.error(error.message);
|
|
12782
|
+
}
|
|
12783
|
+
}
|
|
12784
|
+
);
|
|
12785
|
+
});
|
|
12786
|
+
const { fields, insert, remove } = reactHookForm.useFieldArray({
|
|
12787
|
+
control: form.control,
|
|
12788
|
+
name: "metadata"
|
|
12789
|
+
});
|
|
12790
|
+
function deleteRow(index) {
|
|
12791
|
+
remove(index);
|
|
12792
|
+
if (fields.length === 1) {
|
|
12793
|
+
insert(0, {
|
|
12794
|
+
key: "",
|
|
12795
|
+
value: "",
|
|
12796
|
+
disabled: false
|
|
12797
|
+
});
|
|
12798
|
+
}
|
|
12799
|
+
}
|
|
12800
|
+
function insertRow(index, position) {
|
|
12801
|
+
insert(index + (position === "above" ? 0 : 1), {
|
|
12802
|
+
key: "",
|
|
12803
|
+
value: "",
|
|
12804
|
+
disabled: false
|
|
12805
|
+
});
|
|
12806
|
+
}
|
|
12807
|
+
return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
|
|
12808
|
+
KeyboundForm,
|
|
12809
|
+
{
|
|
12810
|
+
onSubmit: handleSubmit,
|
|
12811
|
+
className: "flex flex-1 flex-col overflow-hidden",
|
|
12812
|
+
children: [
|
|
12813
|
+
/* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Body, { className: "flex flex-1 flex-col gap-y-8 overflow-y-auto", children: [
|
|
12814
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-ui-bg-base shadow-elevation-card-rest grid grid-cols-1 divide-y rounded-lg", children: [
|
|
12815
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-ui-bg-subtle grid grid-cols-2 divide-x rounded-t-lg", children: [
|
|
12816
|
+
/* @__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" }) }),
|
|
12817
|
+
/* @__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" }) })
|
|
12818
|
+
] }),
|
|
12819
|
+
fields.map((field, index) => {
|
|
12820
|
+
const isDisabled = field.disabled || false;
|
|
12821
|
+
let placeholder = "-";
|
|
12822
|
+
if (typeof field.value === "object") {
|
|
12823
|
+
placeholder = "{ ... }";
|
|
12824
|
+
}
|
|
12825
|
+
if (Array.isArray(field.value)) {
|
|
12826
|
+
placeholder = "[ ... ]";
|
|
12827
|
+
}
|
|
12828
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
12829
|
+
ConditionalTooltip,
|
|
12830
|
+
{
|
|
12831
|
+
showTooltip: isDisabled,
|
|
12832
|
+
content: "This row is disabled because it contains non-primitive data.",
|
|
12833
|
+
children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "group/table relative", children: [
|
|
12834
|
+
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
12835
|
+
"div",
|
|
12836
|
+
{
|
|
12837
|
+
className: ui.clx("grid grid-cols-2 divide-x", {
|
|
12838
|
+
"overflow-hidden rounded-b-lg": index === fields.length - 1
|
|
12839
|
+
}),
|
|
12840
|
+
children: [
|
|
12841
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
12842
|
+
Form$2.Field,
|
|
12843
|
+
{
|
|
12844
|
+
control: form.control,
|
|
12845
|
+
name: `metadata.${index}.key`,
|
|
12846
|
+
render: ({ field: field2 }) => {
|
|
12847
|
+
return /* @__PURE__ */ jsxRuntime.jsx(Form$2.Item, { children: /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
12848
|
+
GridInput,
|
|
12849
|
+
{
|
|
12850
|
+
"aria-labelledby": METADATA_KEY_LABEL_ID,
|
|
12851
|
+
...field2,
|
|
12852
|
+
disabled: isDisabled,
|
|
12853
|
+
placeholder: "Key"
|
|
12854
|
+
}
|
|
12855
|
+
) }) });
|
|
12856
|
+
}
|
|
12857
|
+
}
|
|
12858
|
+
),
|
|
12859
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
12860
|
+
Form$2.Field,
|
|
12861
|
+
{
|
|
12862
|
+
control: form.control,
|
|
12863
|
+
name: `metadata.${index}.value`,
|
|
12864
|
+
render: ({ field: { value, ...field2 } }) => {
|
|
12865
|
+
return /* @__PURE__ */ jsxRuntime.jsx(Form$2.Item, { children: /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
12866
|
+
GridInput,
|
|
12867
|
+
{
|
|
12868
|
+
"aria-labelledby": METADATA_VALUE_LABEL_ID,
|
|
12869
|
+
...field2,
|
|
12870
|
+
value: isDisabled ? placeholder : value,
|
|
12871
|
+
disabled: isDisabled,
|
|
12872
|
+
placeholder: "Value"
|
|
12873
|
+
}
|
|
12874
|
+
) }) });
|
|
12875
|
+
}
|
|
12876
|
+
}
|
|
12877
|
+
)
|
|
12878
|
+
]
|
|
12879
|
+
}
|
|
12880
|
+
),
|
|
12881
|
+
/* @__PURE__ */ jsxRuntime.jsxs(ui.DropdownMenu, { children: [
|
|
12882
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
12883
|
+
ui.DropdownMenu.Trigger,
|
|
12884
|
+
{
|
|
12885
|
+
className: ui.clx(
|
|
12886
|
+
"invisible absolute inset-y-0 -right-2.5 my-auto group-hover/table:visible data-[state='open']:visible",
|
|
12887
|
+
{
|
|
12888
|
+
hidden: isDisabled
|
|
12889
|
+
}
|
|
12890
|
+
),
|
|
12891
|
+
disabled: isDisabled,
|
|
12892
|
+
asChild: true,
|
|
12893
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(ui.IconButton, { size: "2xsmall", children: /* @__PURE__ */ jsxRuntime.jsx(icons.EllipsisVertical, {}) })
|
|
12894
|
+
}
|
|
12895
|
+
),
|
|
12896
|
+
/* @__PURE__ */ jsxRuntime.jsxs(ui.DropdownMenu.Content, { children: [
|
|
12897
|
+
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
12898
|
+
ui.DropdownMenu.Item,
|
|
12899
|
+
{
|
|
12900
|
+
className: "gap-x-2",
|
|
12901
|
+
onClick: () => insertRow(index, "above"),
|
|
12902
|
+
children: [
|
|
12903
|
+
/* @__PURE__ */ jsxRuntime.jsx(icons.ArrowUpMini, { className: "text-ui-fg-subtle" }),
|
|
12904
|
+
"Insert row above"
|
|
12905
|
+
]
|
|
12906
|
+
}
|
|
12907
|
+
),
|
|
12908
|
+
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
12909
|
+
ui.DropdownMenu.Item,
|
|
12910
|
+
{
|
|
12911
|
+
className: "gap-x-2",
|
|
12912
|
+
onClick: () => insertRow(index, "below"),
|
|
12913
|
+
children: [
|
|
12914
|
+
/* @__PURE__ */ jsxRuntime.jsx(icons.ArrowDownMini, { className: "text-ui-fg-subtle" }),
|
|
12915
|
+
"Insert row below"
|
|
12916
|
+
]
|
|
12917
|
+
}
|
|
12918
|
+
),
|
|
12919
|
+
/* @__PURE__ */ jsxRuntime.jsx(ui.DropdownMenu.Separator, {}),
|
|
12920
|
+
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
12921
|
+
ui.DropdownMenu.Item,
|
|
12922
|
+
{
|
|
12923
|
+
className: "gap-x-2",
|
|
12924
|
+
onClick: () => deleteRow(index),
|
|
12925
|
+
children: [
|
|
12926
|
+
/* @__PURE__ */ jsxRuntime.jsx(icons.Trash, { className: "text-ui-fg-subtle" }),
|
|
12927
|
+
"Delete row"
|
|
12928
|
+
]
|
|
12929
|
+
}
|
|
12930
|
+
)
|
|
12931
|
+
] })
|
|
12932
|
+
] })
|
|
12933
|
+
] })
|
|
12934
|
+
},
|
|
12935
|
+
field.id
|
|
12936
|
+
);
|
|
12937
|
+
})
|
|
12938
|
+
] }),
|
|
12939
|
+
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." })
|
|
12940
|
+
] }),
|
|
12941
|
+
/* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
|
|
12942
|
+
/* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", type: "button", children: "Cancel" }) }),
|
|
12943
|
+
/* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
|
|
12944
|
+
] }) })
|
|
12945
|
+
]
|
|
12946
|
+
}
|
|
12947
|
+
) });
|
|
12948
|
+
};
|
|
12949
|
+
const GridInput = React.forwardRef(({ className, ...props }, ref) => {
|
|
12950
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
12951
|
+
"input",
|
|
12952
|
+
{
|
|
12953
|
+
ref,
|
|
12954
|
+
...props,
|
|
12955
|
+
autoComplete: "off",
|
|
12956
|
+
className: ui.clx(
|
|
12957
|
+
"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",
|
|
12958
|
+
className
|
|
12959
|
+
)
|
|
12960
|
+
}
|
|
12961
|
+
);
|
|
12962
|
+
});
|
|
12963
|
+
GridInput.displayName = "MetadataForm.GridInput";
|
|
12964
|
+
const PlaceholderInner = () => {
|
|
12965
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-1 flex-col overflow-hidden", children: [
|
|
12966
|
+
/* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Skeleton, { className: "h-[148ox] w-full rounded-lg" }) }),
|
|
12967
|
+
/* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
|
|
12968
|
+
/* @__PURE__ */ jsxRuntime.jsx(ui.Skeleton, { className: "h-7 w-12 rounded-md" }),
|
|
12969
|
+
/* @__PURE__ */ jsxRuntime.jsx(ui.Skeleton, { className: "h-7 w-12 rounded-md" })
|
|
12970
|
+
] }) })
|
|
12971
|
+
] });
|
|
12972
|
+
};
|
|
12973
|
+
const EDITABLE_TYPES = ["string", "number", "boolean"];
|
|
12974
|
+
function getDefaultValues(metadata) {
|
|
12975
|
+
if (!metadata || !Object.keys(metadata).length) {
|
|
12976
|
+
return [
|
|
12977
|
+
{
|
|
12978
|
+
key: "",
|
|
12979
|
+
value: "",
|
|
12980
|
+
disabled: false
|
|
12981
|
+
}
|
|
12982
|
+
];
|
|
12983
|
+
}
|
|
12984
|
+
return Object.entries(metadata).map(([key, value]) => {
|
|
12985
|
+
if (!EDITABLE_TYPES.includes(typeof value)) {
|
|
12986
|
+
return {
|
|
12987
|
+
key,
|
|
12988
|
+
value,
|
|
12989
|
+
disabled: true
|
|
12990
|
+
};
|
|
12991
|
+
}
|
|
12992
|
+
let stringValue = value;
|
|
12993
|
+
if (typeof value !== "string") {
|
|
12994
|
+
stringValue = JSON.stringify(value);
|
|
12995
|
+
}
|
|
12996
|
+
return {
|
|
12997
|
+
key,
|
|
12998
|
+
value: stringValue,
|
|
12999
|
+
original_key: key
|
|
13000
|
+
};
|
|
13001
|
+
});
|
|
13002
|
+
}
|
|
13003
|
+
function parseValues(values) {
|
|
13004
|
+
const metadata = values.metadata;
|
|
13005
|
+
const isEmpty = !metadata.length || metadata.length === 1 && !metadata[0].key && !metadata[0].value;
|
|
13006
|
+
if (isEmpty) {
|
|
13007
|
+
return null;
|
|
13008
|
+
}
|
|
13009
|
+
const update = {};
|
|
13010
|
+
metadata.forEach((field) => {
|
|
13011
|
+
let key = field.key;
|
|
13012
|
+
let value = field.value;
|
|
13013
|
+
const disabled = field.disabled;
|
|
13014
|
+
if (!key || !value) {
|
|
13015
|
+
return;
|
|
13016
|
+
}
|
|
13017
|
+
if (disabled) {
|
|
13018
|
+
update[key] = value;
|
|
13019
|
+
return;
|
|
13020
|
+
}
|
|
13021
|
+
key = key.trim();
|
|
13022
|
+
value = value.trim();
|
|
13023
|
+
if (value === "true") {
|
|
13024
|
+
update[key] = true;
|
|
13025
|
+
} else if (value === "false") {
|
|
13026
|
+
update[key] = false;
|
|
13027
|
+
} else {
|
|
13028
|
+
const parsedNumber = parseFloat(value);
|
|
13029
|
+
if (!isNaN(parsedNumber)) {
|
|
13030
|
+
update[key] = parsedNumber;
|
|
13031
|
+
} else {
|
|
13032
|
+
update[key] = value;
|
|
13033
|
+
}
|
|
13034
|
+
}
|
|
13035
|
+
});
|
|
13036
|
+
return update;
|
|
13037
|
+
}
|
|
13038
|
+
function getHasUneditableRows(metadata) {
|
|
13039
|
+
if (!metadata) {
|
|
13040
|
+
return false;
|
|
13041
|
+
}
|
|
13042
|
+
return Object.values(metadata).some(
|
|
13043
|
+
(value) => !EDITABLE_TYPES.includes(typeof value)
|
|
13044
|
+
);
|
|
13045
|
+
}
|
|
13048
13046
|
const widgetModule = { widgets: [] };
|
|
13049
13047
|
const routeModule = {
|
|
13050
13048
|
routes: [
|
|
@@ -13073,26 +13071,22 @@ const routeModule = {
|
|
|
13073
13071
|
Component: BillingAddress,
|
|
13074
13072
|
path: "/draft-orders/:id/billing-address"
|
|
13075
13073
|
},
|
|
13076
|
-
{
|
|
13077
|
-
Component: Email,
|
|
13078
|
-
path: "/draft-orders/:id/email"
|
|
13079
|
-
},
|
|
13080
13074
|
{
|
|
13081
13075
|
Component: Items,
|
|
13082
13076
|
path: "/draft-orders/:id/items"
|
|
13083
13077
|
},
|
|
13084
13078
|
{
|
|
13085
|
-
Component:
|
|
13086
|
-
path: "/draft-orders/:id/
|
|
13087
|
-
},
|
|
13088
|
-
{
|
|
13089
|
-
Component: Promotions,
|
|
13090
|
-
path: "/draft-orders/:id/promotions"
|
|
13079
|
+
Component: Email,
|
|
13080
|
+
path: "/draft-orders/:id/email"
|
|
13091
13081
|
},
|
|
13092
13082
|
{
|
|
13093
13083
|
Component: SalesChannel,
|
|
13094
13084
|
path: "/draft-orders/:id/sales-channel"
|
|
13095
13085
|
},
|
|
13086
|
+
{
|
|
13087
|
+
Component: Promotions,
|
|
13088
|
+
path: "/draft-orders/:id/promotions"
|
|
13089
|
+
},
|
|
13096
13090
|
{
|
|
13097
13091
|
Component: Shipping,
|
|
13098
13092
|
path: "/draft-orders/:id/shipping"
|
|
@@ -13104,6 +13098,10 @@ const routeModule = {
|
|
|
13104
13098
|
{
|
|
13105
13099
|
Component: TransferOwnership,
|
|
13106
13100
|
path: "/draft-orders/:id/transfer-ownership"
|
|
13101
|
+
},
|
|
13102
|
+
{
|
|
13103
|
+
Component: Metadata,
|
|
13104
|
+
path: "/draft-orders/:id/metadata"
|
|
13107
13105
|
}
|
|
13108
13106
|
]
|
|
13109
13107
|
}
|