@medusajs/draft-order 2.10.4-preview-20251006031531 → 2.10.4-preview-20251006060203
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 +516 -516
- package/.medusa/server/src/admin/index.mjs +516 -516
- package/package.json +16 -16
|
@@ -9567,6 +9567,196 @@ const ID = () => {
|
|
|
9567
9567
|
/* @__PURE__ */ jsx(Outlet, {})
|
|
9568
9568
|
] });
|
|
9569
9569
|
};
|
|
9570
|
+
const BillingAddress = () => {
|
|
9571
|
+
const { id } = useParams();
|
|
9572
|
+
const { order, isPending, isError, error } = useOrder(id, {
|
|
9573
|
+
fields: "+billing_address"
|
|
9574
|
+
});
|
|
9575
|
+
if (isError) {
|
|
9576
|
+
throw error;
|
|
9577
|
+
}
|
|
9578
|
+
const isReady = !isPending && !!order;
|
|
9579
|
+
return /* @__PURE__ */ jsxs(RouteDrawer, { children: [
|
|
9580
|
+
/* @__PURE__ */ jsxs(RouteDrawer.Header, { children: [
|
|
9581
|
+
/* @__PURE__ */ jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Edit Billing Address" }) }),
|
|
9582
|
+
/* @__PURE__ */ jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Edit the billing address for the draft order" }) })
|
|
9583
|
+
] }),
|
|
9584
|
+
isReady && /* @__PURE__ */ jsx(BillingAddressForm, { order })
|
|
9585
|
+
] });
|
|
9586
|
+
};
|
|
9587
|
+
const BillingAddressForm = ({ order }) => {
|
|
9588
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
|
|
9589
|
+
const form = useForm({
|
|
9590
|
+
defaultValues: {
|
|
9591
|
+
first_name: ((_a = order.billing_address) == null ? void 0 : _a.first_name) ?? "",
|
|
9592
|
+
last_name: ((_b = order.billing_address) == null ? void 0 : _b.last_name) ?? "",
|
|
9593
|
+
company: ((_c = order.billing_address) == null ? void 0 : _c.company) ?? "",
|
|
9594
|
+
address_1: ((_d = order.billing_address) == null ? void 0 : _d.address_1) ?? "",
|
|
9595
|
+
address_2: ((_e = order.billing_address) == null ? void 0 : _e.address_2) ?? "",
|
|
9596
|
+
city: ((_f = order.billing_address) == null ? void 0 : _f.city) ?? "",
|
|
9597
|
+
province: ((_g = order.billing_address) == null ? void 0 : _g.province) ?? "",
|
|
9598
|
+
country_code: ((_h = order.billing_address) == null ? void 0 : _h.country_code) ?? "",
|
|
9599
|
+
postal_code: ((_i = order.billing_address) == null ? void 0 : _i.postal_code) ?? "",
|
|
9600
|
+
phone: ((_j = order.billing_address) == null ? void 0 : _j.phone) ?? ""
|
|
9601
|
+
},
|
|
9602
|
+
resolver: zodResolver(schema$5)
|
|
9603
|
+
});
|
|
9604
|
+
const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
|
|
9605
|
+
const { handleSuccess } = useRouteModal();
|
|
9606
|
+
const onSubmit = form.handleSubmit(async (data) => {
|
|
9607
|
+
await mutateAsync(
|
|
9608
|
+
{ billing_address: data },
|
|
9609
|
+
{
|
|
9610
|
+
onSuccess: () => {
|
|
9611
|
+
handleSuccess();
|
|
9612
|
+
},
|
|
9613
|
+
onError: (error) => {
|
|
9614
|
+
toast.error(error.message);
|
|
9615
|
+
}
|
|
9616
|
+
}
|
|
9617
|
+
);
|
|
9618
|
+
});
|
|
9619
|
+
return /* @__PURE__ */ jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxs(
|
|
9620
|
+
KeyboundForm,
|
|
9621
|
+
{
|
|
9622
|
+
className: "flex flex-1 flex-col overflow-hidden",
|
|
9623
|
+
onSubmit,
|
|
9624
|
+
children: [
|
|
9625
|
+
/* @__PURE__ */ jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-y-4", children: [
|
|
9626
|
+
/* @__PURE__ */ jsx(
|
|
9627
|
+
Form$2.Field,
|
|
9628
|
+
{
|
|
9629
|
+
control: form.control,
|
|
9630
|
+
name: "country_code",
|
|
9631
|
+
render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
|
|
9632
|
+
/* @__PURE__ */ jsx(Form$2.Label, { children: "Country" }),
|
|
9633
|
+
/* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(CountrySelect, { ...field }) }),
|
|
9634
|
+
/* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
|
|
9635
|
+
] })
|
|
9636
|
+
}
|
|
9637
|
+
),
|
|
9638
|
+
/* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
|
|
9639
|
+
/* @__PURE__ */ jsx(
|
|
9640
|
+
Form$2.Field,
|
|
9641
|
+
{
|
|
9642
|
+
control: form.control,
|
|
9643
|
+
name: "first_name",
|
|
9644
|
+
render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
|
|
9645
|
+
/* @__PURE__ */ jsx(Form$2.Label, { children: "First name" }),
|
|
9646
|
+
/* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
|
|
9647
|
+
/* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
|
|
9648
|
+
] })
|
|
9649
|
+
}
|
|
9650
|
+
),
|
|
9651
|
+
/* @__PURE__ */ jsx(
|
|
9652
|
+
Form$2.Field,
|
|
9653
|
+
{
|
|
9654
|
+
control: form.control,
|
|
9655
|
+
name: "last_name",
|
|
9656
|
+
render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
|
|
9657
|
+
/* @__PURE__ */ jsx(Form$2.Label, { children: "Last name" }),
|
|
9658
|
+
/* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
|
|
9659
|
+
/* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
|
|
9660
|
+
] })
|
|
9661
|
+
}
|
|
9662
|
+
)
|
|
9663
|
+
] }),
|
|
9664
|
+
/* @__PURE__ */ jsx(
|
|
9665
|
+
Form$2.Field,
|
|
9666
|
+
{
|
|
9667
|
+
control: form.control,
|
|
9668
|
+
name: "company",
|
|
9669
|
+
render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
|
|
9670
|
+
/* @__PURE__ */ jsx(Form$2.Label, { optional: true, children: "Company" }),
|
|
9671
|
+
/* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
|
|
9672
|
+
/* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
|
|
9673
|
+
] })
|
|
9674
|
+
}
|
|
9675
|
+
),
|
|
9676
|
+
/* @__PURE__ */ jsx(
|
|
9677
|
+
Form$2.Field,
|
|
9678
|
+
{
|
|
9679
|
+
control: form.control,
|
|
9680
|
+
name: "address_1",
|
|
9681
|
+
render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
|
|
9682
|
+
/* @__PURE__ */ jsx(Form$2.Label, { children: "Address" }),
|
|
9683
|
+
/* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
|
|
9684
|
+
/* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
|
|
9685
|
+
] })
|
|
9686
|
+
}
|
|
9687
|
+
),
|
|
9688
|
+
/* @__PURE__ */ jsx(
|
|
9689
|
+
Form$2.Field,
|
|
9690
|
+
{
|
|
9691
|
+
control: form.control,
|
|
9692
|
+
name: "address_2",
|
|
9693
|
+
render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
|
|
9694
|
+
/* @__PURE__ */ jsx(Form$2.Label, { optional: true, children: "Apartment, suite, etc." }),
|
|
9695
|
+
/* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
|
|
9696
|
+
/* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
|
|
9697
|
+
] })
|
|
9698
|
+
}
|
|
9699
|
+
),
|
|
9700
|
+
/* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
|
|
9701
|
+
/* @__PURE__ */ jsx(
|
|
9702
|
+
Form$2.Field,
|
|
9703
|
+
{
|
|
9704
|
+
control: form.control,
|
|
9705
|
+
name: "postal_code",
|
|
9706
|
+
render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
|
|
9707
|
+
/* @__PURE__ */ jsx(Form$2.Label, { children: "Postal code" }),
|
|
9708
|
+
/* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
|
|
9709
|
+
/* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
|
|
9710
|
+
] })
|
|
9711
|
+
}
|
|
9712
|
+
),
|
|
9713
|
+
/* @__PURE__ */ jsx(
|
|
9714
|
+
Form$2.Field,
|
|
9715
|
+
{
|
|
9716
|
+
control: form.control,
|
|
9717
|
+
name: "city",
|
|
9718
|
+
render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
|
|
9719
|
+
/* @__PURE__ */ jsx(Form$2.Label, { children: "City" }),
|
|
9720
|
+
/* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
|
|
9721
|
+
/* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
|
|
9722
|
+
] })
|
|
9723
|
+
}
|
|
9724
|
+
)
|
|
9725
|
+
] }),
|
|
9726
|
+
/* @__PURE__ */ jsx(
|
|
9727
|
+
Form$2.Field,
|
|
9728
|
+
{
|
|
9729
|
+
control: form.control,
|
|
9730
|
+
name: "province",
|
|
9731
|
+
render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
|
|
9732
|
+
/* @__PURE__ */ jsx(Form$2.Label, { optional: true, children: "Province / State" }),
|
|
9733
|
+
/* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
|
|
9734
|
+
/* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
|
|
9735
|
+
] })
|
|
9736
|
+
}
|
|
9737
|
+
),
|
|
9738
|
+
/* @__PURE__ */ jsx(
|
|
9739
|
+
Form$2.Field,
|
|
9740
|
+
{
|
|
9741
|
+
control: form.control,
|
|
9742
|
+
name: "phone",
|
|
9743
|
+
render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
|
|
9744
|
+
/* @__PURE__ */ jsx(Form$2.Label, { optional: true, children: "Phone" }),
|
|
9745
|
+
/* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
|
|
9746
|
+
/* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
|
|
9747
|
+
] })
|
|
9748
|
+
}
|
|
9749
|
+
)
|
|
9750
|
+
] }) }),
|
|
9751
|
+
/* @__PURE__ */ jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex justify-end gap-2", children: [
|
|
9752
|
+
/* @__PURE__ */ jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
|
|
9753
|
+
/* @__PURE__ */ jsx(Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
|
|
9754
|
+
] }) })
|
|
9755
|
+
]
|
|
9756
|
+
}
|
|
9757
|
+
) });
|
|
9758
|
+
};
|
|
9759
|
+
const schema$5 = addressSchema;
|
|
9570
9760
|
const CustomItems = () => {
|
|
9571
9761
|
return /* @__PURE__ */ jsxs(RouteDrawer, { children: [
|
|
9572
9762
|
/* @__PURE__ */ jsx(RouteDrawer.Header, { children: /* @__PURE__ */ jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Edit Custom Items" }) }) }),
|
|
@@ -9575,7 +9765,7 @@ const CustomItems = () => {
|
|
|
9575
9765
|
};
|
|
9576
9766
|
const CustomItemsForm = () => {
|
|
9577
9767
|
const form = useForm({
|
|
9578
|
-
resolver: zodResolver(schema$
|
|
9768
|
+
resolver: zodResolver(schema$4)
|
|
9579
9769
|
});
|
|
9580
9770
|
return /* @__PURE__ */ jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxs(KeyboundForm, { className: "flex flex-1 flex-col", children: [
|
|
9581
9771
|
/* @__PURE__ */ jsx(RouteDrawer.Body, {}),
|
|
@@ -9585,7 +9775,7 @@ const CustomItemsForm = () => {
|
|
|
9585
9775
|
] }) })
|
|
9586
9776
|
] }) });
|
|
9587
9777
|
};
|
|
9588
|
-
const schema$
|
|
9778
|
+
const schema$4 = objectType({
|
|
9589
9779
|
email: stringType().email()
|
|
9590
9780
|
});
|
|
9591
9781
|
const Email = () => {
|
|
@@ -9610,7 +9800,7 @@ const EmailForm = ({ order }) => {
|
|
|
9610
9800
|
defaultValues: {
|
|
9611
9801
|
email: order.email ?? ""
|
|
9612
9802
|
},
|
|
9613
|
-
resolver: zodResolver(schema$
|
|
9803
|
+
resolver: zodResolver(schema$3)
|
|
9614
9804
|
});
|
|
9615
9805
|
const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
|
|
9616
9806
|
const { handleSuccess } = useRouteModal();
|
|
@@ -9653,7 +9843,7 @@ const EmailForm = ({ order }) => {
|
|
|
9653
9843
|
}
|
|
9654
9844
|
) });
|
|
9655
9845
|
};
|
|
9656
|
-
const schema$
|
|
9846
|
+
const schema$3 = objectType({
|
|
9657
9847
|
email: stringType().email()
|
|
9658
9848
|
});
|
|
9659
9849
|
const NumberInput = forwardRef(
|
|
@@ -10630,356 +10820,6 @@ const customItemSchema = objectType({
|
|
|
10630
10820
|
quantity: numberType(),
|
|
10631
10821
|
unit_price: unionType([numberType(), stringType()])
|
|
10632
10822
|
});
|
|
10633
|
-
const InlineTip = forwardRef(
|
|
10634
|
-
({ variant = "tip", label, className, children, ...props }, ref) => {
|
|
10635
|
-
const labelValue = label || (variant === "warning" ? "Warning" : "Tip");
|
|
10636
|
-
return /* @__PURE__ */ jsxs(
|
|
10637
|
-
"div",
|
|
10638
|
-
{
|
|
10639
|
-
ref,
|
|
10640
|
-
className: clx(
|
|
10641
|
-
"bg-ui-bg-component txt-small text-ui-fg-subtle grid grid-cols-[4px_1fr] items-start gap-3 rounded-lg border p-3",
|
|
10642
|
-
className
|
|
10643
|
-
),
|
|
10644
|
-
...props,
|
|
10645
|
-
children: [
|
|
10646
|
-
/* @__PURE__ */ jsx(
|
|
10647
|
-
"div",
|
|
10648
|
-
{
|
|
10649
|
-
role: "presentation",
|
|
10650
|
-
className: clx("w-4px bg-ui-tag-neutral-icon h-full rounded-full", {
|
|
10651
|
-
"bg-ui-tag-orange-icon": variant === "warning"
|
|
10652
|
-
})
|
|
10653
|
-
}
|
|
10654
|
-
),
|
|
10655
|
-
/* @__PURE__ */ jsxs("div", { className: "text-pretty", children: [
|
|
10656
|
-
/* @__PURE__ */ jsxs("strong", { className: "txt-small-plus text-ui-fg-base", children: [
|
|
10657
|
-
labelValue,
|
|
10658
|
-
":"
|
|
10659
|
-
] }),
|
|
10660
|
-
" ",
|
|
10661
|
-
children
|
|
10662
|
-
] })
|
|
10663
|
-
]
|
|
10664
|
-
}
|
|
10665
|
-
);
|
|
10666
|
-
}
|
|
10667
|
-
);
|
|
10668
|
-
InlineTip.displayName = "InlineTip";
|
|
10669
|
-
const MetadataFieldSchema = objectType({
|
|
10670
|
-
key: stringType(),
|
|
10671
|
-
disabled: booleanType().optional(),
|
|
10672
|
-
value: anyType()
|
|
10673
|
-
});
|
|
10674
|
-
const MetadataSchema = objectType({
|
|
10675
|
-
metadata: arrayType(MetadataFieldSchema)
|
|
10676
|
-
});
|
|
10677
|
-
const Metadata = () => {
|
|
10678
|
-
const { id } = useParams();
|
|
10679
|
-
const { order, isPending, isError, error } = useOrder(id, {
|
|
10680
|
-
fields: "metadata"
|
|
10681
|
-
});
|
|
10682
|
-
if (isError) {
|
|
10683
|
-
throw error;
|
|
10684
|
-
}
|
|
10685
|
-
const isReady = !isPending && !!order;
|
|
10686
|
-
return /* @__PURE__ */ jsxs(RouteDrawer, { children: [
|
|
10687
|
-
/* @__PURE__ */ jsxs(RouteDrawer.Header, { children: [
|
|
10688
|
-
/* @__PURE__ */ jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Metadata" }) }),
|
|
10689
|
-
/* @__PURE__ */ jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Add metadata to the draft order." }) })
|
|
10690
|
-
] }),
|
|
10691
|
-
!isReady ? /* @__PURE__ */ jsx(PlaceholderInner, {}) : /* @__PURE__ */ jsx(MetadataForm, { orderId: id, metadata: order == null ? void 0 : order.metadata })
|
|
10692
|
-
] });
|
|
10693
|
-
};
|
|
10694
|
-
const METADATA_KEY_LABEL_ID = "metadata-form-key-label";
|
|
10695
|
-
const METADATA_VALUE_LABEL_ID = "metadata-form-value-label";
|
|
10696
|
-
const MetadataForm = ({ orderId, metadata }) => {
|
|
10697
|
-
const { handleSuccess } = useRouteModal();
|
|
10698
|
-
const hasUneditableRows = getHasUneditableRows(metadata);
|
|
10699
|
-
const { mutateAsync, isPending } = useUpdateDraftOrder(orderId);
|
|
10700
|
-
const form = useForm({
|
|
10701
|
-
defaultValues: {
|
|
10702
|
-
metadata: getDefaultValues(metadata)
|
|
10703
|
-
},
|
|
10704
|
-
resolver: zodResolver(MetadataSchema)
|
|
10705
|
-
});
|
|
10706
|
-
const handleSubmit = form.handleSubmit(async (data) => {
|
|
10707
|
-
const parsedData = parseValues(data);
|
|
10708
|
-
await mutateAsync(
|
|
10709
|
-
{
|
|
10710
|
-
metadata: parsedData
|
|
10711
|
-
},
|
|
10712
|
-
{
|
|
10713
|
-
onSuccess: () => {
|
|
10714
|
-
toast.success("Metadata updated");
|
|
10715
|
-
handleSuccess();
|
|
10716
|
-
},
|
|
10717
|
-
onError: (error) => {
|
|
10718
|
-
toast.error(error.message);
|
|
10719
|
-
}
|
|
10720
|
-
}
|
|
10721
|
-
);
|
|
10722
|
-
});
|
|
10723
|
-
const { fields, insert, remove } = useFieldArray({
|
|
10724
|
-
control: form.control,
|
|
10725
|
-
name: "metadata"
|
|
10726
|
-
});
|
|
10727
|
-
function deleteRow(index) {
|
|
10728
|
-
remove(index);
|
|
10729
|
-
if (fields.length === 1) {
|
|
10730
|
-
insert(0, {
|
|
10731
|
-
key: "",
|
|
10732
|
-
value: "",
|
|
10733
|
-
disabled: false
|
|
10734
|
-
});
|
|
10735
|
-
}
|
|
10736
|
-
}
|
|
10737
|
-
function insertRow(index, position) {
|
|
10738
|
-
insert(index + (position === "above" ? 0 : 1), {
|
|
10739
|
-
key: "",
|
|
10740
|
-
value: "",
|
|
10741
|
-
disabled: false
|
|
10742
|
-
});
|
|
10743
|
-
}
|
|
10744
|
-
return /* @__PURE__ */ jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxs(
|
|
10745
|
-
KeyboundForm,
|
|
10746
|
-
{
|
|
10747
|
-
onSubmit: handleSubmit,
|
|
10748
|
-
className: "flex flex-1 flex-col overflow-hidden",
|
|
10749
|
-
children: [
|
|
10750
|
-
/* @__PURE__ */ jsxs(RouteDrawer.Body, { className: "flex flex-1 flex-col gap-y-8 overflow-y-auto", children: [
|
|
10751
|
-
/* @__PURE__ */ jsxs("div", { className: "bg-ui-bg-base shadow-elevation-card-rest grid grid-cols-1 divide-y rounded-lg", children: [
|
|
10752
|
-
/* @__PURE__ */ jsxs("div", { className: "bg-ui-bg-subtle grid grid-cols-2 divide-x rounded-t-lg", children: [
|
|
10753
|
-
/* @__PURE__ */ jsx("div", { className: "txt-compact-small-plus text-ui-fg-subtle px-2 py-1.5", children: /* @__PURE__ */ jsx("label", { id: METADATA_KEY_LABEL_ID, children: "Key" }) }),
|
|
10754
|
-
/* @__PURE__ */ jsx("div", { className: "txt-compact-small-plus text-ui-fg-subtle px-2 py-1.5", children: /* @__PURE__ */ jsx("label", { id: METADATA_VALUE_LABEL_ID, children: "Value" }) })
|
|
10755
|
-
] }),
|
|
10756
|
-
fields.map((field, index) => {
|
|
10757
|
-
const isDisabled = field.disabled || false;
|
|
10758
|
-
let placeholder = "-";
|
|
10759
|
-
if (typeof field.value === "object") {
|
|
10760
|
-
placeholder = "{ ... }";
|
|
10761
|
-
}
|
|
10762
|
-
if (Array.isArray(field.value)) {
|
|
10763
|
-
placeholder = "[ ... ]";
|
|
10764
|
-
}
|
|
10765
|
-
return /* @__PURE__ */ jsx(
|
|
10766
|
-
ConditionalTooltip,
|
|
10767
|
-
{
|
|
10768
|
-
showTooltip: isDisabled,
|
|
10769
|
-
content: "This row is disabled because it contains non-primitive data.",
|
|
10770
|
-
children: /* @__PURE__ */ jsxs("div", { className: "group/table relative", children: [
|
|
10771
|
-
/* @__PURE__ */ jsxs(
|
|
10772
|
-
"div",
|
|
10773
|
-
{
|
|
10774
|
-
className: clx("grid grid-cols-2 divide-x", {
|
|
10775
|
-
"overflow-hidden rounded-b-lg": index === fields.length - 1
|
|
10776
|
-
}),
|
|
10777
|
-
children: [
|
|
10778
|
-
/* @__PURE__ */ jsx(
|
|
10779
|
-
Form$2.Field,
|
|
10780
|
-
{
|
|
10781
|
-
control: form.control,
|
|
10782
|
-
name: `metadata.${index}.key`,
|
|
10783
|
-
render: ({ field: field2 }) => {
|
|
10784
|
-
return /* @__PURE__ */ jsx(Form$2.Item, { children: /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(
|
|
10785
|
-
GridInput,
|
|
10786
|
-
{
|
|
10787
|
-
"aria-labelledby": METADATA_KEY_LABEL_ID,
|
|
10788
|
-
...field2,
|
|
10789
|
-
disabled: isDisabled,
|
|
10790
|
-
placeholder: "Key"
|
|
10791
|
-
}
|
|
10792
|
-
) }) });
|
|
10793
|
-
}
|
|
10794
|
-
}
|
|
10795
|
-
),
|
|
10796
|
-
/* @__PURE__ */ jsx(
|
|
10797
|
-
Form$2.Field,
|
|
10798
|
-
{
|
|
10799
|
-
control: form.control,
|
|
10800
|
-
name: `metadata.${index}.value`,
|
|
10801
|
-
render: ({ field: { value, ...field2 } }) => {
|
|
10802
|
-
return /* @__PURE__ */ jsx(Form$2.Item, { children: /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(
|
|
10803
|
-
GridInput,
|
|
10804
|
-
{
|
|
10805
|
-
"aria-labelledby": METADATA_VALUE_LABEL_ID,
|
|
10806
|
-
...field2,
|
|
10807
|
-
value: isDisabled ? placeholder : value,
|
|
10808
|
-
disabled: isDisabled,
|
|
10809
|
-
placeholder: "Value"
|
|
10810
|
-
}
|
|
10811
|
-
) }) });
|
|
10812
|
-
}
|
|
10813
|
-
}
|
|
10814
|
-
)
|
|
10815
|
-
]
|
|
10816
|
-
}
|
|
10817
|
-
),
|
|
10818
|
-
/* @__PURE__ */ jsxs(DropdownMenu, { children: [
|
|
10819
|
-
/* @__PURE__ */ jsx(
|
|
10820
|
-
DropdownMenu.Trigger,
|
|
10821
|
-
{
|
|
10822
|
-
className: clx(
|
|
10823
|
-
"invisible absolute inset-y-0 -right-2.5 my-auto group-hover/table:visible data-[state='open']:visible",
|
|
10824
|
-
{
|
|
10825
|
-
hidden: isDisabled
|
|
10826
|
-
}
|
|
10827
|
-
),
|
|
10828
|
-
disabled: isDisabled,
|
|
10829
|
-
asChild: true,
|
|
10830
|
-
children: /* @__PURE__ */ jsx(IconButton, { size: "2xsmall", children: /* @__PURE__ */ jsx(EllipsisVertical, {}) })
|
|
10831
|
-
}
|
|
10832
|
-
),
|
|
10833
|
-
/* @__PURE__ */ jsxs(DropdownMenu.Content, { children: [
|
|
10834
|
-
/* @__PURE__ */ jsxs(
|
|
10835
|
-
DropdownMenu.Item,
|
|
10836
|
-
{
|
|
10837
|
-
className: "gap-x-2",
|
|
10838
|
-
onClick: () => insertRow(index, "above"),
|
|
10839
|
-
children: [
|
|
10840
|
-
/* @__PURE__ */ jsx(ArrowUpMini, { className: "text-ui-fg-subtle" }),
|
|
10841
|
-
"Insert row above"
|
|
10842
|
-
]
|
|
10843
|
-
}
|
|
10844
|
-
),
|
|
10845
|
-
/* @__PURE__ */ jsxs(
|
|
10846
|
-
DropdownMenu.Item,
|
|
10847
|
-
{
|
|
10848
|
-
className: "gap-x-2",
|
|
10849
|
-
onClick: () => insertRow(index, "below"),
|
|
10850
|
-
children: [
|
|
10851
|
-
/* @__PURE__ */ jsx(ArrowDownMini, { className: "text-ui-fg-subtle" }),
|
|
10852
|
-
"Insert row below"
|
|
10853
|
-
]
|
|
10854
|
-
}
|
|
10855
|
-
),
|
|
10856
|
-
/* @__PURE__ */ jsx(DropdownMenu.Separator, {}),
|
|
10857
|
-
/* @__PURE__ */ jsxs(
|
|
10858
|
-
DropdownMenu.Item,
|
|
10859
|
-
{
|
|
10860
|
-
className: "gap-x-2",
|
|
10861
|
-
onClick: () => deleteRow(index),
|
|
10862
|
-
children: [
|
|
10863
|
-
/* @__PURE__ */ jsx(Trash, { className: "text-ui-fg-subtle" }),
|
|
10864
|
-
"Delete row"
|
|
10865
|
-
]
|
|
10866
|
-
}
|
|
10867
|
-
)
|
|
10868
|
-
] })
|
|
10869
|
-
] })
|
|
10870
|
-
] })
|
|
10871
|
-
},
|
|
10872
|
-
field.id
|
|
10873
|
-
);
|
|
10874
|
-
})
|
|
10875
|
-
] }),
|
|
10876
|
-
hasUneditableRows && /* @__PURE__ */ 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." })
|
|
10877
|
-
] }),
|
|
10878
|
-
/* @__PURE__ */ jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
|
|
10879
|
-
/* @__PURE__ */ jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", type: "button", children: "Cancel" }) }),
|
|
10880
|
-
/* @__PURE__ */ jsx(Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
|
|
10881
|
-
] }) })
|
|
10882
|
-
]
|
|
10883
|
-
}
|
|
10884
|
-
) });
|
|
10885
|
-
};
|
|
10886
|
-
const GridInput = forwardRef(({ className, ...props }, ref) => {
|
|
10887
|
-
return /* @__PURE__ */ jsx(
|
|
10888
|
-
"input",
|
|
10889
|
-
{
|
|
10890
|
-
ref,
|
|
10891
|
-
...props,
|
|
10892
|
-
autoComplete: "off",
|
|
10893
|
-
className: clx(
|
|
10894
|
-
"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",
|
|
10895
|
-
className
|
|
10896
|
-
)
|
|
10897
|
-
}
|
|
10898
|
-
);
|
|
10899
|
-
});
|
|
10900
|
-
GridInput.displayName = "MetadataForm.GridInput";
|
|
10901
|
-
const PlaceholderInner = () => {
|
|
10902
|
-
return /* @__PURE__ */ jsxs("div", { className: "flex flex-1 flex-col overflow-hidden", children: [
|
|
10903
|
-
/* @__PURE__ */ jsx(RouteDrawer.Body, { children: /* @__PURE__ */ jsx(Skeleton, { className: "h-[148ox] w-full rounded-lg" }) }),
|
|
10904
|
-
/* @__PURE__ */ jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
|
|
10905
|
-
/* @__PURE__ */ jsx(Skeleton, { className: "h-7 w-12 rounded-md" }),
|
|
10906
|
-
/* @__PURE__ */ jsx(Skeleton, { className: "h-7 w-12 rounded-md" })
|
|
10907
|
-
] }) })
|
|
10908
|
-
] });
|
|
10909
|
-
};
|
|
10910
|
-
const EDITABLE_TYPES = ["string", "number", "boolean"];
|
|
10911
|
-
function getDefaultValues(metadata) {
|
|
10912
|
-
if (!metadata || !Object.keys(metadata).length) {
|
|
10913
|
-
return [
|
|
10914
|
-
{
|
|
10915
|
-
key: "",
|
|
10916
|
-
value: "",
|
|
10917
|
-
disabled: false
|
|
10918
|
-
}
|
|
10919
|
-
];
|
|
10920
|
-
}
|
|
10921
|
-
return Object.entries(metadata).map(([key, value]) => {
|
|
10922
|
-
if (!EDITABLE_TYPES.includes(typeof value)) {
|
|
10923
|
-
return {
|
|
10924
|
-
key,
|
|
10925
|
-
value,
|
|
10926
|
-
disabled: true
|
|
10927
|
-
};
|
|
10928
|
-
}
|
|
10929
|
-
let stringValue = value;
|
|
10930
|
-
if (typeof value !== "string") {
|
|
10931
|
-
stringValue = JSON.stringify(value);
|
|
10932
|
-
}
|
|
10933
|
-
return {
|
|
10934
|
-
key,
|
|
10935
|
-
value: stringValue,
|
|
10936
|
-
original_key: key
|
|
10937
|
-
};
|
|
10938
|
-
});
|
|
10939
|
-
}
|
|
10940
|
-
function parseValues(values) {
|
|
10941
|
-
const metadata = values.metadata;
|
|
10942
|
-
const isEmpty = !metadata.length || metadata.length === 1 && !metadata[0].key && !metadata[0].value;
|
|
10943
|
-
if (isEmpty) {
|
|
10944
|
-
return null;
|
|
10945
|
-
}
|
|
10946
|
-
const update = {};
|
|
10947
|
-
metadata.forEach((field) => {
|
|
10948
|
-
let key = field.key;
|
|
10949
|
-
let value = field.value;
|
|
10950
|
-
const disabled = field.disabled;
|
|
10951
|
-
if (!key || !value) {
|
|
10952
|
-
return;
|
|
10953
|
-
}
|
|
10954
|
-
if (disabled) {
|
|
10955
|
-
update[key] = value;
|
|
10956
|
-
return;
|
|
10957
|
-
}
|
|
10958
|
-
key = key.trim();
|
|
10959
|
-
value = value.trim();
|
|
10960
|
-
if (value === "true") {
|
|
10961
|
-
update[key] = true;
|
|
10962
|
-
} else if (value === "false") {
|
|
10963
|
-
update[key] = false;
|
|
10964
|
-
} else {
|
|
10965
|
-
const parsedNumber = parseFloat(value);
|
|
10966
|
-
if (!isNaN(parsedNumber)) {
|
|
10967
|
-
update[key] = parsedNumber;
|
|
10968
|
-
} else {
|
|
10969
|
-
update[key] = value;
|
|
10970
|
-
}
|
|
10971
|
-
}
|
|
10972
|
-
});
|
|
10973
|
-
return update;
|
|
10974
|
-
}
|
|
10975
|
-
function getHasUneditableRows(metadata) {
|
|
10976
|
-
if (!metadata) {
|
|
10977
|
-
return false;
|
|
10978
|
-
}
|
|
10979
|
-
return Object.values(metadata).some(
|
|
10980
|
-
(value) => !EDITABLE_TYPES.includes(typeof value)
|
|
10981
|
-
);
|
|
10982
|
-
}
|
|
10983
10823
|
const PROMOTION_QUERY_KEY = "promotions";
|
|
10984
10824
|
const promotionsQueryKeys = {
|
|
10985
10825
|
list: (query2) => [
|
|
@@ -11285,7 +11125,7 @@ const SalesChannelForm = ({ order }) => {
|
|
|
11285
11125
|
defaultValues: {
|
|
11286
11126
|
sales_channel_id: order.sales_channel_id || ""
|
|
11287
11127
|
},
|
|
11288
|
-
resolver: zodResolver(schema$
|
|
11128
|
+
resolver: zodResolver(schema$2)
|
|
11289
11129
|
});
|
|
11290
11130
|
const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
|
|
11291
11131
|
const { handleSuccess } = useRouteModal();
|
|
@@ -11360,7 +11200,7 @@ const SalesChannelField = ({ control, order }) => {
|
|
|
11360
11200
|
}
|
|
11361
11201
|
);
|
|
11362
11202
|
};
|
|
11363
|
-
const schema$
|
|
11203
|
+
const schema$2 = objectType({
|
|
11364
11204
|
sales_channel_id: stringType().min(1)
|
|
11365
11205
|
});
|
|
11366
11206
|
const STACKED_FOCUS_MODAL_ID = "shipping-form";
|
|
@@ -12202,7 +12042,7 @@ const ShippingAddressForm = ({ order }) => {
|
|
|
12202
12042
|
postal_code: ((_i = order.shipping_address) == null ? void 0 : _i.postal_code) ?? "",
|
|
12203
12043
|
phone: ((_j = order.shipping_address) == null ? void 0 : _j.phone) ?? ""
|
|
12204
12044
|
},
|
|
12205
|
-
resolver: zodResolver(schema$
|
|
12045
|
+
resolver: zodResolver(schema$1)
|
|
12206
12046
|
});
|
|
12207
12047
|
const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
|
|
12208
12048
|
const { handleSuccess } = useRouteModal();
|
|
@@ -12372,7 +12212,7 @@ const ShippingAddressForm = ({ order }) => {
|
|
|
12372
12212
|
}
|
|
12373
12213
|
) });
|
|
12374
12214
|
};
|
|
12375
|
-
const schema$
|
|
12215
|
+
const schema$1 = addressSchema;
|
|
12376
12216
|
const TransferOwnership = () => {
|
|
12377
12217
|
const { id } = useParams();
|
|
12378
12218
|
const { draft_order, isPending, isError, error } = useDraftOrder(id, {
|
|
@@ -12396,7 +12236,7 @@ const TransferOwnershipForm = ({ order }) => {
|
|
|
12396
12236
|
defaultValues: {
|
|
12397
12237
|
customer_id: order.customer_id || ""
|
|
12398
12238
|
},
|
|
12399
|
-
resolver: zodResolver(schema
|
|
12239
|
+
resolver: zodResolver(schema)
|
|
12400
12240
|
});
|
|
12401
12241
|
const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
|
|
12402
12242
|
const { handleSuccess } = useRouteModal();
|
|
@@ -12846,13 +12686,57 @@ const Illustration = () => {
|
|
|
12846
12686
|
}
|
|
12847
12687
|
);
|
|
12848
12688
|
};
|
|
12849
|
-
const schema
|
|
12689
|
+
const schema = objectType({
|
|
12850
12690
|
customer_id: stringType().min(1)
|
|
12851
12691
|
});
|
|
12852
|
-
const
|
|
12692
|
+
const InlineTip = forwardRef(
|
|
12693
|
+
({ variant = "tip", label, className, children, ...props }, ref) => {
|
|
12694
|
+
const labelValue = label || (variant === "warning" ? "Warning" : "Tip");
|
|
12695
|
+
return /* @__PURE__ */ jsxs(
|
|
12696
|
+
"div",
|
|
12697
|
+
{
|
|
12698
|
+
ref,
|
|
12699
|
+
className: clx(
|
|
12700
|
+
"bg-ui-bg-component txt-small text-ui-fg-subtle grid grid-cols-[4px_1fr] items-start gap-3 rounded-lg border p-3",
|
|
12701
|
+
className
|
|
12702
|
+
),
|
|
12703
|
+
...props,
|
|
12704
|
+
children: [
|
|
12705
|
+
/* @__PURE__ */ jsx(
|
|
12706
|
+
"div",
|
|
12707
|
+
{
|
|
12708
|
+
role: "presentation",
|
|
12709
|
+
className: clx("w-4px bg-ui-tag-neutral-icon h-full rounded-full", {
|
|
12710
|
+
"bg-ui-tag-orange-icon": variant === "warning"
|
|
12711
|
+
})
|
|
12712
|
+
}
|
|
12713
|
+
),
|
|
12714
|
+
/* @__PURE__ */ jsxs("div", { className: "text-pretty", children: [
|
|
12715
|
+
/* @__PURE__ */ jsxs("strong", { className: "txt-small-plus text-ui-fg-base", children: [
|
|
12716
|
+
labelValue,
|
|
12717
|
+
":"
|
|
12718
|
+
] }),
|
|
12719
|
+
" ",
|
|
12720
|
+
children
|
|
12721
|
+
] })
|
|
12722
|
+
]
|
|
12723
|
+
}
|
|
12724
|
+
);
|
|
12725
|
+
}
|
|
12726
|
+
);
|
|
12727
|
+
InlineTip.displayName = "InlineTip";
|
|
12728
|
+
const MetadataFieldSchema = objectType({
|
|
12729
|
+
key: stringType(),
|
|
12730
|
+
disabled: booleanType().optional(),
|
|
12731
|
+
value: anyType()
|
|
12732
|
+
});
|
|
12733
|
+
const MetadataSchema = objectType({
|
|
12734
|
+
metadata: arrayType(MetadataFieldSchema)
|
|
12735
|
+
});
|
|
12736
|
+
const Metadata = () => {
|
|
12853
12737
|
const { id } = useParams();
|
|
12854
12738
|
const { order, isPending, isError, error } = useOrder(id, {
|
|
12855
|
-
fields: "
|
|
12739
|
+
fields: "metadata"
|
|
12856
12740
|
});
|
|
12857
12741
|
if (isError) {
|
|
12858
12742
|
throw error;
|
|
@@ -12860,36 +12744,33 @@ const BillingAddress = () => {
|
|
|
12860
12744
|
const isReady = !isPending && !!order;
|
|
12861
12745
|
return /* @__PURE__ */ jsxs(RouteDrawer, { children: [
|
|
12862
12746
|
/* @__PURE__ */ jsxs(RouteDrawer.Header, { children: [
|
|
12863
|
-
/* @__PURE__ */ jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "
|
|
12864
|
-
/* @__PURE__ */ jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsx("span", { className: "sr-only", children: "
|
|
12747
|
+
/* @__PURE__ */ jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Metadata" }) }),
|
|
12748
|
+
/* @__PURE__ */ jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Add metadata to the draft order." }) })
|
|
12865
12749
|
] }),
|
|
12866
|
-
isReady
|
|
12750
|
+
!isReady ? /* @__PURE__ */ jsx(PlaceholderInner, {}) : /* @__PURE__ */ jsx(MetadataForm, { orderId: id, metadata: order == null ? void 0 : order.metadata })
|
|
12867
12751
|
] });
|
|
12868
12752
|
};
|
|
12869
|
-
const
|
|
12870
|
-
|
|
12753
|
+
const METADATA_KEY_LABEL_ID = "metadata-form-key-label";
|
|
12754
|
+
const METADATA_VALUE_LABEL_ID = "metadata-form-value-label";
|
|
12755
|
+
const MetadataForm = ({ orderId, metadata }) => {
|
|
12756
|
+
const { handleSuccess } = useRouteModal();
|
|
12757
|
+
const hasUneditableRows = getHasUneditableRows(metadata);
|
|
12758
|
+
const { mutateAsync, isPending } = useUpdateDraftOrder(orderId);
|
|
12871
12759
|
const form = useForm({
|
|
12872
12760
|
defaultValues: {
|
|
12873
|
-
|
|
12874
|
-
last_name: ((_b = order.billing_address) == null ? void 0 : _b.last_name) ?? "",
|
|
12875
|
-
company: ((_c = order.billing_address) == null ? void 0 : _c.company) ?? "",
|
|
12876
|
-
address_1: ((_d = order.billing_address) == null ? void 0 : _d.address_1) ?? "",
|
|
12877
|
-
address_2: ((_e = order.billing_address) == null ? void 0 : _e.address_2) ?? "",
|
|
12878
|
-
city: ((_f = order.billing_address) == null ? void 0 : _f.city) ?? "",
|
|
12879
|
-
province: ((_g = order.billing_address) == null ? void 0 : _g.province) ?? "",
|
|
12880
|
-
country_code: ((_h = order.billing_address) == null ? void 0 : _h.country_code) ?? "",
|
|
12881
|
-
postal_code: ((_i = order.billing_address) == null ? void 0 : _i.postal_code) ?? "",
|
|
12882
|
-
phone: ((_j = order.billing_address) == null ? void 0 : _j.phone) ?? ""
|
|
12761
|
+
metadata: getDefaultValues(metadata)
|
|
12883
12762
|
},
|
|
12884
|
-
resolver: zodResolver(
|
|
12763
|
+
resolver: zodResolver(MetadataSchema)
|
|
12885
12764
|
});
|
|
12886
|
-
const
|
|
12887
|
-
|
|
12888
|
-
const onSubmit = form.handleSubmit(async (data) => {
|
|
12765
|
+
const handleSubmit = form.handleSubmit(async (data) => {
|
|
12766
|
+
const parsedData = parseValues(data);
|
|
12889
12767
|
await mutateAsync(
|
|
12890
|
-
{
|
|
12768
|
+
{
|
|
12769
|
+
metadata: parsedData
|
|
12770
|
+
},
|
|
12891
12771
|
{
|
|
12892
12772
|
onSuccess: () => {
|
|
12773
|
+
toast.success("Metadata updated");
|
|
12893
12774
|
handleSuccess();
|
|
12894
12775
|
},
|
|
12895
12776
|
onError: (error) => {
|
|
@@ -12898,147 +12779,266 @@ const BillingAddressForm = ({ order }) => {
|
|
|
12898
12779
|
}
|
|
12899
12780
|
);
|
|
12900
12781
|
});
|
|
12782
|
+
const { fields, insert, remove } = useFieldArray({
|
|
12783
|
+
control: form.control,
|
|
12784
|
+
name: "metadata"
|
|
12785
|
+
});
|
|
12786
|
+
function deleteRow(index) {
|
|
12787
|
+
remove(index);
|
|
12788
|
+
if (fields.length === 1) {
|
|
12789
|
+
insert(0, {
|
|
12790
|
+
key: "",
|
|
12791
|
+
value: "",
|
|
12792
|
+
disabled: false
|
|
12793
|
+
});
|
|
12794
|
+
}
|
|
12795
|
+
}
|
|
12796
|
+
function insertRow(index, position) {
|
|
12797
|
+
insert(index + (position === "above" ? 0 : 1), {
|
|
12798
|
+
key: "",
|
|
12799
|
+
value: "",
|
|
12800
|
+
disabled: false
|
|
12801
|
+
});
|
|
12802
|
+
}
|
|
12901
12803
|
return /* @__PURE__ */ jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxs(
|
|
12902
12804
|
KeyboundForm,
|
|
12903
12805
|
{
|
|
12806
|
+
onSubmit: handleSubmit,
|
|
12904
12807
|
className: "flex flex-1 flex-col overflow-hidden",
|
|
12905
|
-
onSubmit,
|
|
12906
12808
|
children: [
|
|
12907
|
-
/* @__PURE__ */
|
|
12908
|
-
/* @__PURE__ */
|
|
12909
|
-
|
|
12910
|
-
|
|
12911
|
-
|
|
12912
|
-
|
|
12913
|
-
|
|
12914
|
-
|
|
12915
|
-
|
|
12916
|
-
|
|
12917
|
-
|
|
12918
|
-
}
|
|
12919
|
-
),
|
|
12920
|
-
/* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
|
|
12921
|
-
/* @__PURE__ */ jsx(
|
|
12922
|
-
Form$2.Field,
|
|
12923
|
-
{
|
|
12924
|
-
control: form.control,
|
|
12925
|
-
name: "first_name",
|
|
12926
|
-
render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
|
|
12927
|
-
/* @__PURE__ */ jsx(Form$2.Label, { children: "First name" }),
|
|
12928
|
-
/* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
|
|
12929
|
-
/* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
|
|
12930
|
-
] })
|
|
12931
|
-
}
|
|
12932
|
-
),
|
|
12933
|
-
/* @__PURE__ */ jsx(
|
|
12934
|
-
Form$2.Field,
|
|
12935
|
-
{
|
|
12936
|
-
control: form.control,
|
|
12937
|
-
name: "last_name",
|
|
12938
|
-
render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
|
|
12939
|
-
/* @__PURE__ */ jsx(Form$2.Label, { children: "Last name" }),
|
|
12940
|
-
/* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
|
|
12941
|
-
/* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
|
|
12942
|
-
] })
|
|
12943
|
-
}
|
|
12944
|
-
)
|
|
12945
|
-
] }),
|
|
12946
|
-
/* @__PURE__ */ jsx(
|
|
12947
|
-
Form$2.Field,
|
|
12948
|
-
{
|
|
12949
|
-
control: form.control,
|
|
12950
|
-
name: "company",
|
|
12951
|
-
render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
|
|
12952
|
-
/* @__PURE__ */ jsx(Form$2.Label, { optional: true, children: "Company" }),
|
|
12953
|
-
/* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
|
|
12954
|
-
/* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
|
|
12955
|
-
] })
|
|
12956
|
-
}
|
|
12957
|
-
),
|
|
12958
|
-
/* @__PURE__ */ jsx(
|
|
12959
|
-
Form$2.Field,
|
|
12960
|
-
{
|
|
12961
|
-
control: form.control,
|
|
12962
|
-
name: "address_1",
|
|
12963
|
-
render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
|
|
12964
|
-
/* @__PURE__ */ jsx(Form$2.Label, { children: "Address" }),
|
|
12965
|
-
/* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
|
|
12966
|
-
/* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
|
|
12967
|
-
] })
|
|
12968
|
-
}
|
|
12969
|
-
),
|
|
12970
|
-
/* @__PURE__ */ jsx(
|
|
12971
|
-
Form$2.Field,
|
|
12972
|
-
{
|
|
12973
|
-
control: form.control,
|
|
12974
|
-
name: "address_2",
|
|
12975
|
-
render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
|
|
12976
|
-
/* @__PURE__ */ jsx(Form$2.Label, { optional: true, children: "Apartment, suite, etc." }),
|
|
12977
|
-
/* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
|
|
12978
|
-
/* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
|
|
12979
|
-
] })
|
|
12980
|
-
}
|
|
12981
|
-
),
|
|
12982
|
-
/* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
|
|
12983
|
-
/* @__PURE__ */ jsx(
|
|
12984
|
-
Form$2.Field,
|
|
12985
|
-
{
|
|
12986
|
-
control: form.control,
|
|
12987
|
-
name: "postal_code",
|
|
12988
|
-
render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
|
|
12989
|
-
/* @__PURE__ */ jsx(Form$2.Label, { children: "Postal code" }),
|
|
12990
|
-
/* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
|
|
12991
|
-
/* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
|
|
12992
|
-
] })
|
|
12993
|
-
}
|
|
12994
|
-
),
|
|
12995
|
-
/* @__PURE__ */ jsx(
|
|
12996
|
-
Form$2.Field,
|
|
12997
|
-
{
|
|
12998
|
-
control: form.control,
|
|
12999
|
-
name: "city",
|
|
13000
|
-
render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
|
|
13001
|
-
/* @__PURE__ */ jsx(Form$2.Label, { children: "City" }),
|
|
13002
|
-
/* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
|
|
13003
|
-
/* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
|
|
13004
|
-
] })
|
|
12809
|
+
/* @__PURE__ */ jsxs(RouteDrawer.Body, { className: "flex flex-1 flex-col gap-y-8 overflow-y-auto", children: [
|
|
12810
|
+
/* @__PURE__ */ jsxs("div", { className: "bg-ui-bg-base shadow-elevation-card-rest grid grid-cols-1 divide-y rounded-lg", children: [
|
|
12811
|
+
/* @__PURE__ */ jsxs("div", { className: "bg-ui-bg-subtle grid grid-cols-2 divide-x rounded-t-lg", children: [
|
|
12812
|
+
/* @__PURE__ */ jsx("div", { className: "txt-compact-small-plus text-ui-fg-subtle px-2 py-1.5", children: /* @__PURE__ */ jsx("label", { id: METADATA_KEY_LABEL_ID, children: "Key" }) }),
|
|
12813
|
+
/* @__PURE__ */ jsx("div", { className: "txt-compact-small-plus text-ui-fg-subtle px-2 py-1.5", children: /* @__PURE__ */ jsx("label", { id: METADATA_VALUE_LABEL_ID, children: "Value" }) })
|
|
12814
|
+
] }),
|
|
12815
|
+
fields.map((field, index) => {
|
|
12816
|
+
const isDisabled = field.disabled || false;
|
|
12817
|
+
let placeholder = "-";
|
|
12818
|
+
if (typeof field.value === "object") {
|
|
12819
|
+
placeholder = "{ ... }";
|
|
13005
12820
|
}
|
|
13006
|
-
|
|
12821
|
+
if (Array.isArray(field.value)) {
|
|
12822
|
+
placeholder = "[ ... ]";
|
|
12823
|
+
}
|
|
12824
|
+
return /* @__PURE__ */ jsx(
|
|
12825
|
+
ConditionalTooltip,
|
|
12826
|
+
{
|
|
12827
|
+
showTooltip: isDisabled,
|
|
12828
|
+
content: "This row is disabled because it contains non-primitive data.",
|
|
12829
|
+
children: /* @__PURE__ */ jsxs("div", { className: "group/table relative", children: [
|
|
12830
|
+
/* @__PURE__ */ jsxs(
|
|
12831
|
+
"div",
|
|
12832
|
+
{
|
|
12833
|
+
className: clx("grid grid-cols-2 divide-x", {
|
|
12834
|
+
"overflow-hidden rounded-b-lg": index === fields.length - 1
|
|
12835
|
+
}),
|
|
12836
|
+
children: [
|
|
12837
|
+
/* @__PURE__ */ jsx(
|
|
12838
|
+
Form$2.Field,
|
|
12839
|
+
{
|
|
12840
|
+
control: form.control,
|
|
12841
|
+
name: `metadata.${index}.key`,
|
|
12842
|
+
render: ({ field: field2 }) => {
|
|
12843
|
+
return /* @__PURE__ */ jsx(Form$2.Item, { children: /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(
|
|
12844
|
+
GridInput,
|
|
12845
|
+
{
|
|
12846
|
+
"aria-labelledby": METADATA_KEY_LABEL_ID,
|
|
12847
|
+
...field2,
|
|
12848
|
+
disabled: isDisabled,
|
|
12849
|
+
placeholder: "Key"
|
|
12850
|
+
}
|
|
12851
|
+
) }) });
|
|
12852
|
+
}
|
|
12853
|
+
}
|
|
12854
|
+
),
|
|
12855
|
+
/* @__PURE__ */ jsx(
|
|
12856
|
+
Form$2.Field,
|
|
12857
|
+
{
|
|
12858
|
+
control: form.control,
|
|
12859
|
+
name: `metadata.${index}.value`,
|
|
12860
|
+
render: ({ field: { value, ...field2 } }) => {
|
|
12861
|
+
return /* @__PURE__ */ jsx(Form$2.Item, { children: /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(
|
|
12862
|
+
GridInput,
|
|
12863
|
+
{
|
|
12864
|
+
"aria-labelledby": METADATA_VALUE_LABEL_ID,
|
|
12865
|
+
...field2,
|
|
12866
|
+
value: isDisabled ? placeholder : value,
|
|
12867
|
+
disabled: isDisabled,
|
|
12868
|
+
placeholder: "Value"
|
|
12869
|
+
}
|
|
12870
|
+
) }) });
|
|
12871
|
+
}
|
|
12872
|
+
}
|
|
12873
|
+
)
|
|
12874
|
+
]
|
|
12875
|
+
}
|
|
12876
|
+
),
|
|
12877
|
+
/* @__PURE__ */ jsxs(DropdownMenu, { children: [
|
|
12878
|
+
/* @__PURE__ */ jsx(
|
|
12879
|
+
DropdownMenu.Trigger,
|
|
12880
|
+
{
|
|
12881
|
+
className: clx(
|
|
12882
|
+
"invisible absolute inset-y-0 -right-2.5 my-auto group-hover/table:visible data-[state='open']:visible",
|
|
12883
|
+
{
|
|
12884
|
+
hidden: isDisabled
|
|
12885
|
+
}
|
|
12886
|
+
),
|
|
12887
|
+
disabled: isDisabled,
|
|
12888
|
+
asChild: true,
|
|
12889
|
+
children: /* @__PURE__ */ jsx(IconButton, { size: "2xsmall", children: /* @__PURE__ */ jsx(EllipsisVertical, {}) })
|
|
12890
|
+
}
|
|
12891
|
+
),
|
|
12892
|
+
/* @__PURE__ */ jsxs(DropdownMenu.Content, { children: [
|
|
12893
|
+
/* @__PURE__ */ jsxs(
|
|
12894
|
+
DropdownMenu.Item,
|
|
12895
|
+
{
|
|
12896
|
+
className: "gap-x-2",
|
|
12897
|
+
onClick: () => insertRow(index, "above"),
|
|
12898
|
+
children: [
|
|
12899
|
+
/* @__PURE__ */ jsx(ArrowUpMini, { className: "text-ui-fg-subtle" }),
|
|
12900
|
+
"Insert row above"
|
|
12901
|
+
]
|
|
12902
|
+
}
|
|
12903
|
+
),
|
|
12904
|
+
/* @__PURE__ */ jsxs(
|
|
12905
|
+
DropdownMenu.Item,
|
|
12906
|
+
{
|
|
12907
|
+
className: "gap-x-2",
|
|
12908
|
+
onClick: () => insertRow(index, "below"),
|
|
12909
|
+
children: [
|
|
12910
|
+
/* @__PURE__ */ jsx(ArrowDownMini, { className: "text-ui-fg-subtle" }),
|
|
12911
|
+
"Insert row below"
|
|
12912
|
+
]
|
|
12913
|
+
}
|
|
12914
|
+
),
|
|
12915
|
+
/* @__PURE__ */ jsx(DropdownMenu.Separator, {}),
|
|
12916
|
+
/* @__PURE__ */ jsxs(
|
|
12917
|
+
DropdownMenu.Item,
|
|
12918
|
+
{
|
|
12919
|
+
className: "gap-x-2",
|
|
12920
|
+
onClick: () => deleteRow(index),
|
|
12921
|
+
children: [
|
|
12922
|
+
/* @__PURE__ */ jsx(Trash, { className: "text-ui-fg-subtle" }),
|
|
12923
|
+
"Delete row"
|
|
12924
|
+
]
|
|
12925
|
+
}
|
|
12926
|
+
)
|
|
12927
|
+
] })
|
|
12928
|
+
] })
|
|
12929
|
+
] })
|
|
12930
|
+
},
|
|
12931
|
+
field.id
|
|
12932
|
+
);
|
|
12933
|
+
})
|
|
13007
12934
|
] }),
|
|
13008
|
-
/* @__PURE__ */ jsx(
|
|
13009
|
-
|
|
13010
|
-
|
|
13011
|
-
|
|
13012
|
-
name: "province",
|
|
13013
|
-
render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
|
|
13014
|
-
/* @__PURE__ */ jsx(Form$2.Label, { optional: true, children: "Province / State" }),
|
|
13015
|
-
/* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
|
|
13016
|
-
/* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
|
|
13017
|
-
] })
|
|
13018
|
-
}
|
|
13019
|
-
),
|
|
13020
|
-
/* @__PURE__ */ jsx(
|
|
13021
|
-
Form$2.Field,
|
|
13022
|
-
{
|
|
13023
|
-
control: form.control,
|
|
13024
|
-
name: "phone",
|
|
13025
|
-
render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
|
|
13026
|
-
/* @__PURE__ */ jsx(Form$2.Label, { optional: true, children: "Phone" }),
|
|
13027
|
-
/* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
|
|
13028
|
-
/* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
|
|
13029
|
-
] })
|
|
13030
|
-
}
|
|
13031
|
-
)
|
|
13032
|
-
] }) }),
|
|
13033
|
-
/* @__PURE__ */ jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex justify-end gap-2", children: [
|
|
13034
|
-
/* @__PURE__ */ jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
|
|
12935
|
+
hasUneditableRows && /* @__PURE__ */ 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." })
|
|
12936
|
+
] }),
|
|
12937
|
+
/* @__PURE__ */ jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
|
|
12938
|
+
/* @__PURE__ */ jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", type: "button", children: "Cancel" }) }),
|
|
13035
12939
|
/* @__PURE__ */ jsx(Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
|
|
13036
12940
|
] }) })
|
|
13037
12941
|
]
|
|
13038
12942
|
}
|
|
13039
12943
|
) });
|
|
13040
12944
|
};
|
|
13041
|
-
const
|
|
12945
|
+
const GridInput = forwardRef(({ className, ...props }, ref) => {
|
|
12946
|
+
return /* @__PURE__ */ jsx(
|
|
12947
|
+
"input",
|
|
12948
|
+
{
|
|
12949
|
+
ref,
|
|
12950
|
+
...props,
|
|
12951
|
+
autoComplete: "off",
|
|
12952
|
+
className: clx(
|
|
12953
|
+
"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",
|
|
12954
|
+
className
|
|
12955
|
+
)
|
|
12956
|
+
}
|
|
12957
|
+
);
|
|
12958
|
+
});
|
|
12959
|
+
GridInput.displayName = "MetadataForm.GridInput";
|
|
12960
|
+
const PlaceholderInner = () => {
|
|
12961
|
+
return /* @__PURE__ */ jsxs("div", { className: "flex flex-1 flex-col overflow-hidden", children: [
|
|
12962
|
+
/* @__PURE__ */ jsx(RouteDrawer.Body, { children: /* @__PURE__ */ jsx(Skeleton, { className: "h-[148ox] w-full rounded-lg" }) }),
|
|
12963
|
+
/* @__PURE__ */ jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
|
|
12964
|
+
/* @__PURE__ */ jsx(Skeleton, { className: "h-7 w-12 rounded-md" }),
|
|
12965
|
+
/* @__PURE__ */ jsx(Skeleton, { className: "h-7 w-12 rounded-md" })
|
|
12966
|
+
] }) })
|
|
12967
|
+
] });
|
|
12968
|
+
};
|
|
12969
|
+
const EDITABLE_TYPES = ["string", "number", "boolean"];
|
|
12970
|
+
function getDefaultValues(metadata) {
|
|
12971
|
+
if (!metadata || !Object.keys(metadata).length) {
|
|
12972
|
+
return [
|
|
12973
|
+
{
|
|
12974
|
+
key: "",
|
|
12975
|
+
value: "",
|
|
12976
|
+
disabled: false
|
|
12977
|
+
}
|
|
12978
|
+
];
|
|
12979
|
+
}
|
|
12980
|
+
return Object.entries(metadata).map(([key, value]) => {
|
|
12981
|
+
if (!EDITABLE_TYPES.includes(typeof value)) {
|
|
12982
|
+
return {
|
|
12983
|
+
key,
|
|
12984
|
+
value,
|
|
12985
|
+
disabled: true
|
|
12986
|
+
};
|
|
12987
|
+
}
|
|
12988
|
+
let stringValue = value;
|
|
12989
|
+
if (typeof value !== "string") {
|
|
12990
|
+
stringValue = JSON.stringify(value);
|
|
12991
|
+
}
|
|
12992
|
+
return {
|
|
12993
|
+
key,
|
|
12994
|
+
value: stringValue,
|
|
12995
|
+
original_key: key
|
|
12996
|
+
};
|
|
12997
|
+
});
|
|
12998
|
+
}
|
|
12999
|
+
function parseValues(values) {
|
|
13000
|
+
const metadata = values.metadata;
|
|
13001
|
+
const isEmpty = !metadata.length || metadata.length === 1 && !metadata[0].key && !metadata[0].value;
|
|
13002
|
+
if (isEmpty) {
|
|
13003
|
+
return null;
|
|
13004
|
+
}
|
|
13005
|
+
const update = {};
|
|
13006
|
+
metadata.forEach((field) => {
|
|
13007
|
+
let key = field.key;
|
|
13008
|
+
let value = field.value;
|
|
13009
|
+
const disabled = field.disabled;
|
|
13010
|
+
if (!key || !value) {
|
|
13011
|
+
return;
|
|
13012
|
+
}
|
|
13013
|
+
if (disabled) {
|
|
13014
|
+
update[key] = value;
|
|
13015
|
+
return;
|
|
13016
|
+
}
|
|
13017
|
+
key = key.trim();
|
|
13018
|
+
value = value.trim();
|
|
13019
|
+
if (value === "true") {
|
|
13020
|
+
update[key] = true;
|
|
13021
|
+
} else if (value === "false") {
|
|
13022
|
+
update[key] = false;
|
|
13023
|
+
} else {
|
|
13024
|
+
const parsedNumber = parseFloat(value);
|
|
13025
|
+
if (!isNaN(parsedNumber)) {
|
|
13026
|
+
update[key] = parsedNumber;
|
|
13027
|
+
} else {
|
|
13028
|
+
update[key] = value;
|
|
13029
|
+
}
|
|
13030
|
+
}
|
|
13031
|
+
});
|
|
13032
|
+
return update;
|
|
13033
|
+
}
|
|
13034
|
+
function getHasUneditableRows(metadata) {
|
|
13035
|
+
if (!metadata) {
|
|
13036
|
+
return false;
|
|
13037
|
+
}
|
|
13038
|
+
return Object.values(metadata).some(
|
|
13039
|
+
(value) => !EDITABLE_TYPES.includes(typeof value)
|
|
13040
|
+
);
|
|
13041
|
+
}
|
|
13042
13042
|
const widgetModule = { widgets: [] };
|
|
13043
13043
|
const routeModule = {
|
|
13044
13044
|
routes: [
|
|
@@ -13059,6 +13059,10 @@ const routeModule = {
|
|
|
13059
13059
|
handle,
|
|
13060
13060
|
loader,
|
|
13061
13061
|
children: [
|
|
13062
|
+
{
|
|
13063
|
+
Component: BillingAddress,
|
|
13064
|
+
path: "/draft-orders/:id/billing-address"
|
|
13065
|
+
},
|
|
13062
13066
|
{
|
|
13063
13067
|
Component: CustomItems,
|
|
13064
13068
|
path: "/draft-orders/:id/custom-items"
|
|
@@ -13071,10 +13075,6 @@ const routeModule = {
|
|
|
13071
13075
|
Component: Items,
|
|
13072
13076
|
path: "/draft-orders/:id/items"
|
|
13073
13077
|
},
|
|
13074
|
-
{
|
|
13075
|
-
Component: Metadata,
|
|
13076
|
-
path: "/draft-orders/:id/metadata"
|
|
13077
|
-
},
|
|
13078
13078
|
{
|
|
13079
13079
|
Component: Promotions,
|
|
13080
13080
|
path: "/draft-orders/:id/promotions"
|
|
@@ -13096,8 +13096,8 @@ const routeModule = {
|
|
|
13096
13096
|
path: "/draft-orders/:id/transfer-ownership"
|
|
13097
13097
|
},
|
|
13098
13098
|
{
|
|
13099
|
-
Component:
|
|
13100
|
-
path: "/draft-orders/:id/
|
|
13099
|
+
Component: Metadata,
|
|
13100
|
+
path: "/draft-orders/:id/metadata"
|
|
13101
13101
|
}
|
|
13102
13102
|
]
|
|
13103
13103
|
}
|