@medusajs/draft-order 2.11.2-preview-20251028031854 → 2.11.2-preview-20251028060159

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.
Files changed (3) hide show
  1. package/.medusa/server/src/admin/index.js +700 -700
  2. package/.medusa/server/src/admin/index.mjs +700 -700
  3. package/package.json +16 -16
package/.medusa/server/src/admin/index.js CHANGED
@@ -9571,196 +9571,6 @@ const ID = () => {
9571
9571
  /* @__PURE__ */ jsxRuntime.jsx(reactRouterDom.Outlet, {})
9572
9572
  ] });
9573
9573
  };
9574
- const BillingAddress = () => {
9575
- const { id } = reactRouterDom.useParams();
9576
- const { order, isPending, isError, error } = useOrder(id, {
9577
- fields: "+billing_address"
9578
- });
9579
- if (isError) {
9580
- throw error;
9581
- }
9582
- const isReady = !isPending && !!order;
9583
- return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
9584
- /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
9585
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Billing Address" }) }),
9586
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit the billing address for the draft order" }) })
9587
- ] }),
9588
- isReady && /* @__PURE__ */ jsxRuntime.jsx(BillingAddressForm, { order })
9589
- ] });
9590
- };
9591
- const BillingAddressForm = ({ order }) => {
9592
- var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
9593
- const form = reactHookForm.useForm({
9594
- defaultValues: {
9595
- first_name: ((_a = order.billing_address) == null ? void 0 : _a.first_name) ?? "",
9596
- last_name: ((_b = order.billing_address) == null ? void 0 : _b.last_name) ?? "",
9597
- company: ((_c = order.billing_address) == null ? void 0 : _c.company) ?? "",
9598
- address_1: ((_d = order.billing_address) == null ? void 0 : _d.address_1) ?? "",
9599
- address_2: ((_e = order.billing_address) == null ? void 0 : _e.address_2) ?? "",
9600
- city: ((_f = order.billing_address) == null ? void 0 : _f.city) ?? "",
9601
- province: ((_g = order.billing_address) == null ? void 0 : _g.province) ?? "",
9602
- country_code: ((_h = order.billing_address) == null ? void 0 : _h.country_code) ?? "",
9603
- postal_code: ((_i = order.billing_address) == null ? void 0 : _i.postal_code) ?? "",
9604
- phone: ((_j = order.billing_address) == null ? void 0 : _j.phone) ?? ""
9605
- },
9606
- resolver: zod.zodResolver(schema$5)
9607
- });
9608
- const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
9609
- const { handleSuccess } = useRouteModal();
9610
- const onSubmit = form.handleSubmit(async (data) => {
9611
- await mutateAsync(
9612
- { billing_address: data },
9613
- {
9614
- onSuccess: () => {
9615
- handleSuccess();
9616
- },
9617
- onError: (error) => {
9618
- ui.toast.error(error.message);
9619
- }
9620
- }
9621
- );
9622
- });
9623
- return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
9624
- KeyboundForm,
9625
- {
9626
- className: "flex flex-1 flex-col overflow-hidden",
9627
- onSubmit,
9628
- children: [
9629
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-y-4", children: [
9630
- /* @__PURE__ */ jsxRuntime.jsx(
9631
- Form$2.Field,
9632
- {
9633
- control: form.control,
9634
- name: "country_code",
9635
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9636
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Country" }),
9637
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(CountrySelect, { ...field }) }),
9638
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9639
- ] })
9640
- }
9641
- ),
9642
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
9643
- /* @__PURE__ */ jsxRuntime.jsx(
9644
- Form$2.Field,
9645
- {
9646
- control: form.control,
9647
- name: "first_name",
9648
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9649
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "First name" }),
9650
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9651
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9652
- ] })
9653
- }
9654
- ),
9655
- /* @__PURE__ */ jsxRuntime.jsx(
9656
- Form$2.Field,
9657
- {
9658
- control: form.control,
9659
- name: "last_name",
9660
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9661
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Last name" }),
9662
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9663
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9664
- ] })
9665
- }
9666
- )
9667
- ] }),
9668
- /* @__PURE__ */ jsxRuntime.jsx(
9669
- Form$2.Field,
9670
- {
9671
- control: form.control,
9672
- name: "company",
9673
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9674
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Company" }),
9675
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9676
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9677
- ] })
9678
- }
9679
- ),
9680
- /* @__PURE__ */ jsxRuntime.jsx(
9681
- Form$2.Field,
9682
- {
9683
- control: form.control,
9684
- name: "address_1",
9685
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9686
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Address" }),
9687
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9688
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9689
- ] })
9690
- }
9691
- ),
9692
- /* @__PURE__ */ jsxRuntime.jsx(
9693
- Form$2.Field,
9694
- {
9695
- control: form.control,
9696
- name: "address_2",
9697
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9698
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Apartment, suite, etc." }),
9699
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9700
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9701
- ] })
9702
- }
9703
- ),
9704
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
9705
- /* @__PURE__ */ jsxRuntime.jsx(
9706
- Form$2.Field,
9707
- {
9708
- control: form.control,
9709
- name: "postal_code",
9710
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9711
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Postal code" }),
9712
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9713
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9714
- ] })
9715
- }
9716
- ),
9717
- /* @__PURE__ */ jsxRuntime.jsx(
9718
- Form$2.Field,
9719
- {
9720
- control: form.control,
9721
- name: "city",
9722
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9723
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "City" }),
9724
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9725
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9726
- ] })
9727
- }
9728
- )
9729
- ] }),
9730
- /* @__PURE__ */ jsxRuntime.jsx(
9731
- Form$2.Field,
9732
- {
9733
- control: form.control,
9734
- name: "province",
9735
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9736
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Province / State" }),
9737
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9738
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9739
- ] })
9740
- }
9741
- ),
9742
- /* @__PURE__ */ jsxRuntime.jsx(
9743
- Form$2.Field,
9744
- {
9745
- control: form.control,
9746
- name: "phone",
9747
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9748
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Phone" }),
9749
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9750
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9751
- ] })
9752
- }
9753
- )
9754
- ] }) }),
9755
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
9756
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
9757
- /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
9758
- ] }) })
9759
- ]
9760
- }
9761
- ) });
9762
- };
9763
- const schema$5 = addressSchema;
9764
9574
  const CustomItems = () => {
9765
9575
  return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
9766
9576
  /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Header, { children: /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Custom Items" }) }) }),
@@ -9769,7 +9579,7 @@ const CustomItems = () => {
9769
9579
  };
9770
9580
  const CustomItemsForm = () => {
9771
9581
  const form = reactHookForm.useForm({
9772
- resolver: zod.zodResolver(schema$4)
9582
+ resolver: zod.zodResolver(schema$5)
9773
9583
  });
9774
9584
  return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(KeyboundForm, { className: "flex flex-1 flex-col", children: [
9775
9585
  /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, {}),
@@ -9779,93 +9589,25 @@ const CustomItemsForm = () => {
9779
9589
  ] }) })
9780
9590
  ] }) });
9781
9591
  };
9782
- const schema$4 = objectType({
9592
+ const schema$5 = objectType({
9783
9593
  email: stringType().email()
9784
9594
  });
9785
- const Email = () => {
9786
- const { id } = reactRouterDom.useParams();
9787
- const { order, isPending, isError, error } = useOrder(id, {
9788
- fields: "+email"
9789
- });
9790
- if (isError) {
9791
- throw error;
9792
- }
9793
- const isReady = !isPending && !!order;
9794
- return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
9795
- /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
9796
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Email" }) }),
9797
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit the email for the draft order" }) })
9798
- ] }),
9799
- isReady && /* @__PURE__ */ jsxRuntime.jsx(EmailForm, { order })
9800
- ] });
9801
- };
9802
- const EmailForm = ({ order }) => {
9803
- const form = reactHookForm.useForm({
9804
- defaultValues: {
9805
- email: order.email ?? ""
9806
- },
9807
- resolver: zod.zodResolver(schema$3)
9808
- });
9809
- const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
9810
- const { handleSuccess } = useRouteModal();
9811
- const onSubmit = form.handleSubmit(async (data) => {
9812
- await mutateAsync(
9813
- { email: data.email },
9814
- {
9815
- onSuccess: () => {
9816
- handleSuccess();
9817
- },
9818
- onError: (error) => {
9819
- ui.toast.error(error.message);
9820
- }
9821
- }
9822
- );
9823
- });
9824
- return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
9825
- KeyboundForm,
9826
- {
9827
- className: "flex flex-1 flex-col overflow-hidden",
9828
- onSubmit,
9829
- children: [
9830
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsx(
9831
- Form$2.Field,
9832
- {
9833
- control: form.control,
9834
- name: "email",
9835
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9836
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Email" }),
9837
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9838
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9839
- ] })
9840
- }
9841
- ) }),
9842
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
9843
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
9844
- /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
9845
- ] }) })
9846
- ]
9847
- }
9848
- ) });
9849
- };
9850
- const schema$3 = objectType({
9851
- email: stringType().email()
9852
- });
9853
- const NumberInput = React.forwardRef(
9854
- ({
9855
- value,
9856
- onChange,
9857
- size = "base",
9858
- min = 0,
9859
- max = 100,
9860
- step = 1,
9861
- className,
9862
- disabled,
9863
- ...props
9864
- }, ref) => {
9865
- const handleChange = (event) => {
9866
- const newValue = event.target.value === "" ? min : Number(event.target.value);
9867
- if (!isNaN(newValue) && (max === void 0 || newValue <= max) && (min === void 0 || newValue >= min)) {
9868
- onChange(newValue);
9595
+ const NumberInput = React.forwardRef(
9596
+ ({
9597
+ value,
9598
+ onChange,
9599
+ size = "base",
9600
+ min = 0,
9601
+ max = 100,
9602
+ step = 1,
9603
+ className,
9604
+ disabled,
9605
+ ...props
9606
+ }, ref) => {
9607
+ const handleChange = (event) => {
9608
+ const newValue = event.target.value === "" ? min : Number(event.target.value);
9609
+ if (!isNaN(newValue) && (max === void 0 || newValue <= max) && (min === void 0 || newValue >= min)) {
9610
+ onChange(newValue);
9869
9611
  }
9870
9612
  };
9871
9613
  const handleIncrement = () => {
@@ -10824,6 +10566,356 @@ const customItemSchema = objectType({
10824
10566
  quantity: numberType(),
10825
10567
  unit_price: unionType([numberType(), stringType()])
10826
10568
  });
10569
+ const InlineTip = React.forwardRef(
10570
+ ({ variant = "tip", label, className, children, ...props }, ref) => {
10571
+ const labelValue = label || (variant === "warning" ? "Warning" : "Tip");
10572
+ return /* @__PURE__ */ jsxRuntime.jsxs(
10573
+ "div",
10574
+ {
10575
+ ref,
10576
+ className: ui.clx(
10577
+ "bg-ui-bg-component txt-small text-ui-fg-subtle grid grid-cols-[4px_1fr] items-start gap-3 rounded-lg border p-3",
10578
+ className
10579
+ ),
10580
+ ...props,
10581
+ children: [
10582
+ /* @__PURE__ */ jsxRuntime.jsx(
10583
+ "div",
10584
+ {
10585
+ role: "presentation",
10586
+ className: ui.clx("w-4px bg-ui-tag-neutral-icon h-full rounded-full", {
10587
+ "bg-ui-tag-orange-icon": variant === "warning"
10588
+ })
10589
+ }
10590
+ ),
10591
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-pretty", children: [
10592
+ /* @__PURE__ */ jsxRuntime.jsxs("strong", { className: "txt-small-plus text-ui-fg-base", children: [
10593
+ labelValue,
10594
+ ":"
10595
+ ] }),
10596
+ " ",
10597
+ children
10598
+ ] })
10599
+ ]
10600
+ }
10601
+ );
10602
+ }
10603
+ );
10604
+ InlineTip.displayName = "InlineTip";
10605
+ const MetadataFieldSchema = objectType({
10606
+ key: stringType(),
10607
+ disabled: booleanType().optional(),
10608
+ value: anyType()
10609
+ });
10610
+ const MetadataSchema = objectType({
10611
+ metadata: arrayType(MetadataFieldSchema)
10612
+ });
10613
+ const Metadata = () => {
10614
+ const { id } = reactRouterDom.useParams();
10615
+ const { order, isPending, isError, error } = useOrder(id, {
10616
+ fields: "metadata"
10617
+ });
10618
+ if (isError) {
10619
+ throw error;
10620
+ }
10621
+ const isReady = !isPending && !!order;
10622
+ return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
10623
+ /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
10624
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Metadata" }) }),
10625
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Add metadata to the draft order." }) })
10626
+ ] }),
10627
+ !isReady ? /* @__PURE__ */ jsxRuntime.jsx(PlaceholderInner, {}) : /* @__PURE__ */ jsxRuntime.jsx(MetadataForm, { orderId: id, metadata: order == null ? void 0 : order.metadata })
10628
+ ] });
10629
+ };
10630
+ const METADATA_KEY_LABEL_ID = "metadata-form-key-label";
10631
+ const METADATA_VALUE_LABEL_ID = "metadata-form-value-label";
10632
+ const MetadataForm = ({ orderId, metadata }) => {
10633
+ const { handleSuccess } = useRouteModal();
10634
+ const hasUneditableRows = getHasUneditableRows(metadata);
10635
+ const { mutateAsync, isPending } = useUpdateDraftOrder(orderId);
10636
+ const form = reactHookForm.useForm({
10637
+ defaultValues: {
10638
+ metadata: getDefaultValues(metadata)
10639
+ },
10640
+ resolver: zod.zodResolver(MetadataSchema)
10641
+ });
10642
+ const handleSubmit = form.handleSubmit(async (data) => {
10643
+ const parsedData = parseValues(data);
10644
+ await mutateAsync(
10645
+ {
10646
+ metadata: parsedData
10647
+ },
10648
+ {
10649
+ onSuccess: () => {
10650
+ ui.toast.success("Metadata updated");
10651
+ handleSuccess();
10652
+ },
10653
+ onError: (error) => {
10654
+ ui.toast.error(error.message);
10655
+ }
10656
+ }
10657
+ );
10658
+ });
10659
+ const { fields, insert, remove } = reactHookForm.useFieldArray({
10660
+ control: form.control,
10661
+ name: "metadata"
10662
+ });
10663
+ function deleteRow(index) {
10664
+ remove(index);
10665
+ if (fields.length === 1) {
10666
+ insert(0, {
10667
+ key: "",
10668
+ value: "",
10669
+ disabled: false
10670
+ });
10671
+ }
10672
+ }
10673
+ function insertRow(index, position) {
10674
+ insert(index + (position === "above" ? 0 : 1), {
10675
+ key: "",
10676
+ value: "",
10677
+ disabled: false
10678
+ });
10679
+ }
10680
+ return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
10681
+ KeyboundForm,
10682
+ {
10683
+ onSubmit: handleSubmit,
10684
+ className: "flex flex-1 flex-col overflow-hidden",
10685
+ children: [
10686
+ /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Body, { className: "flex flex-1 flex-col gap-y-8 overflow-y-auto", children: [
10687
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-ui-bg-base shadow-elevation-card-rest grid grid-cols-1 divide-y rounded-lg", children: [
10688
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-ui-bg-subtle grid grid-cols-2 divide-x rounded-t-lg", children: [
10689
+ /* @__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" }) }),
10690
+ /* @__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" }) })
10691
+ ] }),
10692
+ fields.map((field, index) => {
10693
+ const isDisabled = field.disabled || false;
10694
+ let placeholder = "-";
10695
+ if (typeof field.value === "object") {
10696
+ placeholder = "{ ... }";
10697
+ }
10698
+ if (Array.isArray(field.value)) {
10699
+ placeholder = "[ ... ]";
10700
+ }
10701
+ return /* @__PURE__ */ jsxRuntime.jsx(
10702
+ ConditionalTooltip,
10703
+ {
10704
+ showTooltip: isDisabled,
10705
+ content: "This row is disabled because it contains non-primitive data.",
10706
+ children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "group/table relative", children: [
10707
+ /* @__PURE__ */ jsxRuntime.jsxs(
10708
+ "div",
10709
+ {
10710
+ className: ui.clx("grid grid-cols-2 divide-x", {
10711
+ "overflow-hidden rounded-b-lg": index === fields.length - 1
10712
+ }),
10713
+ children: [
10714
+ /* @__PURE__ */ jsxRuntime.jsx(
10715
+ Form$2.Field,
10716
+ {
10717
+ control: form.control,
10718
+ name: `metadata.${index}.key`,
10719
+ render: ({ field: field2 }) => {
10720
+ return /* @__PURE__ */ jsxRuntime.jsx(Form$2.Item, { children: /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
10721
+ GridInput,
10722
+ {
10723
+ "aria-labelledby": METADATA_KEY_LABEL_ID,
10724
+ ...field2,
10725
+ disabled: isDisabled,
10726
+ placeholder: "Key"
10727
+ }
10728
+ ) }) });
10729
+ }
10730
+ }
10731
+ ),
10732
+ /* @__PURE__ */ jsxRuntime.jsx(
10733
+ Form$2.Field,
10734
+ {
10735
+ control: form.control,
10736
+ name: `metadata.${index}.value`,
10737
+ render: ({ field: { value, ...field2 } }) => {
10738
+ return /* @__PURE__ */ jsxRuntime.jsx(Form$2.Item, { children: /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
10739
+ GridInput,
10740
+ {
10741
+ "aria-labelledby": METADATA_VALUE_LABEL_ID,
10742
+ ...field2,
10743
+ value: isDisabled ? placeholder : value,
10744
+ disabled: isDisabled,
10745
+ placeholder: "Value"
10746
+ }
10747
+ ) }) });
10748
+ }
10749
+ }
10750
+ )
10751
+ ]
10752
+ }
10753
+ ),
10754
+ /* @__PURE__ */ jsxRuntime.jsxs(ui.DropdownMenu, { children: [
10755
+ /* @__PURE__ */ jsxRuntime.jsx(
10756
+ ui.DropdownMenu.Trigger,
10757
+ {
10758
+ className: ui.clx(
10759
+ "invisible absolute inset-y-0 -right-2.5 my-auto group-hover/table:visible data-[state='open']:visible",
10760
+ {
10761
+ hidden: isDisabled
10762
+ }
10763
+ ),
10764
+ disabled: isDisabled,
10765
+ asChild: true,
10766
+ children: /* @__PURE__ */ jsxRuntime.jsx(ui.IconButton, { size: "2xsmall", children: /* @__PURE__ */ jsxRuntime.jsx(icons.EllipsisVertical, {}) })
10767
+ }
10768
+ ),
10769
+ /* @__PURE__ */ jsxRuntime.jsxs(ui.DropdownMenu.Content, { children: [
10770
+ /* @__PURE__ */ jsxRuntime.jsxs(
10771
+ ui.DropdownMenu.Item,
10772
+ {
10773
+ className: "gap-x-2",
10774
+ onClick: () => insertRow(index, "above"),
10775
+ children: [
10776
+ /* @__PURE__ */ jsxRuntime.jsx(icons.ArrowUpMini, { className: "text-ui-fg-subtle" }),
10777
+ "Insert row above"
10778
+ ]
10779
+ }
10780
+ ),
10781
+ /* @__PURE__ */ jsxRuntime.jsxs(
10782
+ ui.DropdownMenu.Item,
10783
+ {
10784
+ className: "gap-x-2",
10785
+ onClick: () => insertRow(index, "below"),
10786
+ children: [
10787
+ /* @__PURE__ */ jsxRuntime.jsx(icons.ArrowDownMini, { className: "text-ui-fg-subtle" }),
10788
+ "Insert row below"
10789
+ ]
10790
+ }
10791
+ ),
10792
+ /* @__PURE__ */ jsxRuntime.jsx(ui.DropdownMenu.Separator, {}),
10793
+ /* @__PURE__ */ jsxRuntime.jsxs(
10794
+ ui.DropdownMenu.Item,
10795
+ {
10796
+ className: "gap-x-2",
10797
+ onClick: () => deleteRow(index),
10798
+ children: [
10799
+ /* @__PURE__ */ jsxRuntime.jsx(icons.Trash, { className: "text-ui-fg-subtle" }),
10800
+ "Delete row"
10801
+ ]
10802
+ }
10803
+ )
10804
+ ] })
10805
+ ] })
10806
+ ] })
10807
+ },
10808
+ field.id
10809
+ );
10810
+ })
10811
+ ] }),
10812
+ 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." })
10813
+ ] }),
10814
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
10815
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", type: "button", children: "Cancel" }) }),
10816
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
10817
+ ] }) })
10818
+ ]
10819
+ }
10820
+ ) });
10821
+ };
10822
+ const GridInput = React.forwardRef(({ className, ...props }, ref) => {
10823
+ return /* @__PURE__ */ jsxRuntime.jsx(
10824
+ "input",
10825
+ {
10826
+ ref,
10827
+ ...props,
10828
+ autoComplete: "off",
10829
+ className: ui.clx(
10830
+ "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",
10831
+ className
10832
+ )
10833
+ }
10834
+ );
10835
+ });
10836
+ GridInput.displayName = "MetadataForm.GridInput";
10837
+ const PlaceholderInner = () => {
10838
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-1 flex-col overflow-hidden", children: [
10839
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Skeleton, { className: "h-[148ox] w-full rounded-lg" }) }),
10840
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
10841
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Skeleton, { className: "h-7 w-12 rounded-md" }),
10842
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Skeleton, { className: "h-7 w-12 rounded-md" })
10843
+ ] }) })
10844
+ ] });
10845
+ };
10846
+ const EDITABLE_TYPES = ["string", "number", "boolean"];
10847
+ function getDefaultValues(metadata) {
10848
+ if (!metadata || !Object.keys(metadata).length) {
10849
+ return [
10850
+ {
10851
+ key: "",
10852
+ value: "",
10853
+ disabled: false
10854
+ }
10855
+ ];
10856
+ }
10857
+ return Object.entries(metadata).map(([key, value]) => {
10858
+ if (!EDITABLE_TYPES.includes(typeof value)) {
10859
+ return {
10860
+ key,
10861
+ value,
10862
+ disabled: true
10863
+ };
10864
+ }
10865
+ let stringValue = value;
10866
+ if (typeof value !== "string") {
10867
+ stringValue = JSON.stringify(value);
10868
+ }
10869
+ return {
10870
+ key,
10871
+ value: stringValue,
10872
+ original_key: key
10873
+ };
10874
+ });
10875
+ }
10876
+ function parseValues(values) {
10877
+ const metadata = values.metadata;
10878
+ const isEmpty = !metadata.length || metadata.length === 1 && !metadata[0].key && !metadata[0].value;
10879
+ if (isEmpty) {
10880
+ return null;
10881
+ }
10882
+ const update = {};
10883
+ metadata.forEach((field) => {
10884
+ let key = field.key;
10885
+ let value = field.value;
10886
+ const disabled = field.disabled;
10887
+ if (!key || !value) {
10888
+ return;
10889
+ }
10890
+ if (disabled) {
10891
+ update[key] = value;
10892
+ return;
10893
+ }
10894
+ key = key.trim();
10895
+ value = value.trim();
10896
+ if (value === "true") {
10897
+ update[key] = true;
10898
+ } else if (value === "false") {
10899
+ update[key] = false;
10900
+ } else {
10901
+ const parsedNumber = parseFloat(value);
10902
+ if (!isNaN(parsedNumber)) {
10903
+ update[key] = parsedNumber;
10904
+ } else {
10905
+ update[key] = value;
10906
+ }
10907
+ }
10908
+ });
10909
+ return update;
10910
+ }
10911
+ function getHasUneditableRows(metadata) {
10912
+ if (!metadata) {
10913
+ return false;
10914
+ }
10915
+ return Object.values(metadata).some(
10916
+ (value) => !EDITABLE_TYPES.includes(typeof value)
10917
+ );
10918
+ }
10827
10919
  const PROMOTION_QUERY_KEY = "promotions";
10828
10920
  const promotionsQueryKeys = {
10829
10921
  list: (query2) => [
@@ -11101,88 +11193,46 @@ function getPromotionIds(items, shippingMethods) {
11101
11193
  }
11102
11194
  return Array.from(promotionIds);
11103
11195
  }
11104
- const InlineTip = React.forwardRef(
11105
- ({ variant = "tip", label, className, children, ...props }, ref) => {
11106
- const labelValue = label || (variant === "warning" ? "Warning" : "Tip");
11107
- return /* @__PURE__ */ jsxRuntime.jsxs(
11108
- "div",
11109
- {
11110
- ref,
11111
- className: ui.clx(
11112
- "bg-ui-bg-component txt-small text-ui-fg-subtle grid grid-cols-[4px_1fr] items-start gap-3 rounded-lg border p-3",
11113
- className
11114
- ),
11115
- ...props,
11116
- children: [
11117
- /* @__PURE__ */ jsxRuntime.jsx(
11118
- "div",
11119
- {
11120
- role: "presentation",
11121
- className: ui.clx("w-4px bg-ui-tag-neutral-icon h-full rounded-full", {
11122
- "bg-ui-tag-orange-icon": variant === "warning"
11123
- })
11124
- }
11125
- ),
11126
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-pretty", children: [
11127
- /* @__PURE__ */ jsxRuntime.jsxs("strong", { className: "txt-small-plus text-ui-fg-base", children: [
11128
- labelValue,
11129
- ":"
11130
- ] }),
11131
- " ",
11132
- children
11133
- ] })
11134
- ]
11135
- }
11136
- );
11137
- }
11138
- );
11139
- InlineTip.displayName = "InlineTip";
11140
- const MetadataFieldSchema = objectType({
11141
- key: stringType(),
11142
- disabled: booleanType().optional(),
11143
- value: anyType()
11144
- });
11145
- const MetadataSchema = objectType({
11146
- metadata: arrayType(MetadataFieldSchema)
11147
- });
11148
- const Metadata = () => {
11196
+ const SalesChannel = () => {
11149
11197
  const { id } = reactRouterDom.useParams();
11150
- const { order, isPending, isError, error } = useOrder(id, {
11151
- fields: "metadata"
11152
- });
11198
+ const { draft_order, isPending, isError, error } = useDraftOrder(
11199
+ id,
11200
+ {
11201
+ fields: "+sales_channel_id"
11202
+ },
11203
+ {
11204
+ enabled: !!id
11205
+ }
11206
+ );
11153
11207
  if (isError) {
11154
11208
  throw error;
11155
11209
  }
11156
- const isReady = !isPending && !!order;
11210
+ const ISrEADY = !!draft_order && !isPending;
11157
11211
  return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
11158
11212
  /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
11159
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Metadata" }) }),
11160
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Add metadata to the draft order." }) })
11213
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Sales Channel" }) }),
11214
+ /* @__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" }) })
11161
11215
  ] }),
11162
- !isReady ? /* @__PURE__ */ jsxRuntime.jsx(PlaceholderInner, {}) : /* @__PURE__ */ jsxRuntime.jsx(MetadataForm, { orderId: id, metadata: order == null ? void 0 : order.metadata })
11216
+ ISrEADY && /* @__PURE__ */ jsxRuntime.jsx(SalesChannelForm, { order: draft_order })
11163
11217
  ] });
11164
11218
  };
11165
- const METADATA_KEY_LABEL_ID = "metadata-form-key-label";
11166
- const METADATA_VALUE_LABEL_ID = "metadata-form-value-label";
11167
- const MetadataForm = ({ orderId, metadata }) => {
11168
- const { handleSuccess } = useRouteModal();
11169
- const hasUneditableRows = getHasUneditableRows(metadata);
11170
- const { mutateAsync, isPending } = useUpdateDraftOrder(orderId);
11219
+ const SalesChannelForm = ({ order }) => {
11171
11220
  const form = reactHookForm.useForm({
11172
11221
  defaultValues: {
11173
- metadata: getDefaultValues(metadata)
11222
+ sales_channel_id: order.sales_channel_id || ""
11174
11223
  },
11175
- resolver: zod.zodResolver(MetadataSchema)
11224
+ resolver: zod.zodResolver(schema$4)
11176
11225
  });
11177
- const handleSubmit = form.handleSubmit(async (data) => {
11178
- const parsedData = parseValues(data);
11226
+ const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
11227
+ const { handleSuccess } = useRouteModal();
11228
+ const onSubmit = form.handleSubmit(async (data) => {
11179
11229
  await mutateAsync(
11180
11230
  {
11181
- metadata: parsedData
11231
+ sales_channel_id: data.sales_channel_id
11182
11232
  },
11183
11233
  {
11184
11234
  onSuccess: () => {
11185
- ui.toast.success("Metadata updated");
11235
+ ui.toast.success("Sales channel updated");
11186
11236
  handleSuccess();
11187
11237
  },
11188
11238
  onError: (error) => {
@@ -11191,266 +11241,64 @@ const MetadataForm = ({ orderId, metadata }) => {
11191
11241
  }
11192
11242
  );
11193
11243
  });
11194
- const { fields, insert, remove } = reactHookForm.useFieldArray({
11195
- control: form.control,
11196
- name: "metadata"
11197
- });
11198
- function deleteRow(index) {
11199
- remove(index);
11200
- if (fields.length === 1) {
11201
- insert(0, {
11202
- key: "",
11203
- value: "",
11204
- disabled: false
11205
- });
11206
- }
11207
- }
11208
- function insertRow(index, position) {
11209
- insert(index + (position === "above" ? 0 : 1), {
11210
- key: "",
11211
- value: "",
11212
- disabled: false
11213
- });
11214
- }
11215
11244
  return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
11216
11245
  KeyboundForm,
11217
11246
  {
11218
- onSubmit: handleSubmit,
11219
11247
  className: "flex flex-1 flex-col overflow-hidden",
11220
- children: [
11221
- /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Body, { className: "flex flex-1 flex-col gap-y-8 overflow-y-auto", children: [
11222
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-ui-bg-base shadow-elevation-card-rest grid grid-cols-1 divide-y rounded-lg", children: [
11223
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-ui-bg-subtle grid grid-cols-2 divide-x rounded-t-lg", children: [
11224
- /* @__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" }) }),
11225
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "txt-compact-small-plus text-ui-fg-subtle px-2 py-1.5", children: /* @__PURE__ */ jsxRuntime.jsx("label", { id: METADATA_VALUE_LABEL_ID, children: "Value" }) })
11226
- ] }),
11227
- fields.map((field, index) => {
11228
- const isDisabled = field.disabled || false;
11229
- let placeholder = "-";
11230
- if (typeof field.value === "object") {
11231
- placeholder = "{ ... }";
11232
- }
11233
- if (Array.isArray(field.value)) {
11234
- placeholder = "[ ... ]";
11235
- }
11236
- return /* @__PURE__ */ jsxRuntime.jsx(
11237
- ConditionalTooltip,
11238
- {
11239
- showTooltip: isDisabled,
11240
- content: "This row is disabled because it contains non-primitive data.",
11241
- children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "group/table relative", children: [
11242
- /* @__PURE__ */ jsxRuntime.jsxs(
11243
- "div",
11244
- {
11245
- className: ui.clx("grid grid-cols-2 divide-x", {
11246
- "overflow-hidden rounded-b-lg": index === fields.length - 1
11247
- }),
11248
- children: [
11249
- /* @__PURE__ */ jsxRuntime.jsx(
11250
- Form$2.Field,
11251
- {
11252
- control: form.control,
11253
- name: `metadata.${index}.key`,
11254
- render: ({ field: field2 }) => {
11255
- return /* @__PURE__ */ jsxRuntime.jsx(Form$2.Item, { children: /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
11256
- GridInput,
11257
- {
11258
- "aria-labelledby": METADATA_KEY_LABEL_ID,
11259
- ...field2,
11260
- disabled: isDisabled,
11261
- placeholder: "Key"
11262
- }
11263
- ) }) });
11264
- }
11265
- }
11266
- ),
11267
- /* @__PURE__ */ jsxRuntime.jsx(
11268
- Form$2.Field,
11269
- {
11270
- control: form.control,
11271
- name: `metadata.${index}.value`,
11272
- render: ({ field: { value, ...field2 } }) => {
11273
- return /* @__PURE__ */ jsxRuntime.jsx(Form$2.Item, { children: /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
11274
- GridInput,
11275
- {
11276
- "aria-labelledby": METADATA_VALUE_LABEL_ID,
11277
- ...field2,
11278
- value: isDisabled ? placeholder : value,
11279
- disabled: isDisabled,
11280
- placeholder: "Value"
11281
- }
11282
- ) }) });
11283
- }
11284
- }
11285
- )
11286
- ]
11287
- }
11288
- ),
11289
- /* @__PURE__ */ jsxRuntime.jsxs(ui.DropdownMenu, { children: [
11290
- /* @__PURE__ */ jsxRuntime.jsx(
11291
- ui.DropdownMenu.Trigger,
11292
- {
11293
- className: ui.clx(
11294
- "invisible absolute inset-y-0 -right-2.5 my-auto group-hover/table:visible data-[state='open']:visible",
11295
- {
11296
- hidden: isDisabled
11297
- }
11298
- ),
11299
- disabled: isDisabled,
11300
- asChild: true,
11301
- children: /* @__PURE__ */ jsxRuntime.jsx(ui.IconButton, { size: "2xsmall", children: /* @__PURE__ */ jsxRuntime.jsx(icons.EllipsisVertical, {}) })
11302
- }
11303
- ),
11304
- /* @__PURE__ */ jsxRuntime.jsxs(ui.DropdownMenu.Content, { children: [
11305
- /* @__PURE__ */ jsxRuntime.jsxs(
11306
- ui.DropdownMenu.Item,
11307
- {
11308
- className: "gap-x-2",
11309
- onClick: () => insertRow(index, "above"),
11310
- children: [
11311
- /* @__PURE__ */ jsxRuntime.jsx(icons.ArrowUpMini, { className: "text-ui-fg-subtle" }),
11312
- "Insert row above"
11313
- ]
11314
- }
11315
- ),
11316
- /* @__PURE__ */ jsxRuntime.jsxs(
11317
- ui.DropdownMenu.Item,
11318
- {
11319
- className: "gap-x-2",
11320
- onClick: () => insertRow(index, "below"),
11321
- children: [
11322
- /* @__PURE__ */ jsxRuntime.jsx(icons.ArrowDownMini, { className: "text-ui-fg-subtle" }),
11323
- "Insert row below"
11324
- ]
11325
- }
11326
- ),
11327
- /* @__PURE__ */ jsxRuntime.jsx(ui.DropdownMenu.Separator, {}),
11328
- /* @__PURE__ */ jsxRuntime.jsxs(
11329
- ui.DropdownMenu.Item,
11330
- {
11331
- className: "gap-x-2",
11332
- onClick: () => deleteRow(index),
11333
- children: [
11334
- /* @__PURE__ */ jsxRuntime.jsx(icons.Trash, { className: "text-ui-fg-subtle" }),
11335
- "Delete row"
11336
- ]
11337
- }
11338
- )
11339
- ] })
11340
- ] })
11341
- ] })
11342
- },
11343
- field.id
11344
- );
11345
- })
11346
- ] }),
11347
- 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." })
11348
- ] }),
11349
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
11350
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", type: "button", children: "Cancel" }) }),
11248
+ onSubmit,
11249
+ children: [
11250
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsx(SalesChannelField, { control: form.control, order }) }),
11251
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
11252
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
11351
11253
  /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
11352
11254
  ] }) })
11353
11255
  ]
11354
11256
  }
11355
11257
  ) });
11356
11258
  };
11357
- const GridInput = React.forwardRef(({ className, ...props }, ref) => {
11259
+ const SalesChannelField = ({ control, order }) => {
11260
+ const salesChannels = useComboboxData({
11261
+ queryFn: async (params) => {
11262
+ return await sdk.admin.salesChannel.list(params);
11263
+ },
11264
+ queryKey: ["sales-channels"],
11265
+ getOptions: (data) => {
11266
+ return data.sales_channels.map((salesChannel) => ({
11267
+ label: salesChannel.name,
11268
+ value: salesChannel.id
11269
+ }));
11270
+ },
11271
+ defaultValue: order.sales_channel_id || void 0
11272
+ });
11358
11273
  return /* @__PURE__ */ jsxRuntime.jsx(
11359
- "input",
11274
+ Form$2.Field,
11360
11275
  {
11361
- ref,
11362
- ...props,
11363
- autoComplete: "off",
11364
- className: ui.clx(
11365
- "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",
11366
- className
11367
- )
11368
- }
11369
- );
11370
- });
11371
- GridInput.displayName = "MetadataForm.GridInput";
11372
- const PlaceholderInner = () => {
11373
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-1 flex-col overflow-hidden", children: [
11374
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Skeleton, { className: "h-[148ox] w-full rounded-lg" }) }),
11375
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
11376
- /* @__PURE__ */ jsxRuntime.jsx(ui.Skeleton, { className: "h-7 w-12 rounded-md" }),
11377
- /* @__PURE__ */ jsxRuntime.jsx(ui.Skeleton, { className: "h-7 w-12 rounded-md" })
11378
- ] }) })
11379
- ] });
11380
- };
11381
- const EDITABLE_TYPES = ["string", "number", "boolean"];
11382
- function getDefaultValues(metadata) {
11383
- if (!metadata || !Object.keys(metadata).length) {
11384
- return [
11385
- {
11386
- key: "",
11387
- value: "",
11388
- disabled: false
11389
- }
11390
- ];
11391
- }
11392
- return Object.entries(metadata).map(([key, value]) => {
11393
- if (!EDITABLE_TYPES.includes(typeof value)) {
11394
- return {
11395
- key,
11396
- value,
11397
- disabled: true
11398
- };
11399
- }
11400
- let stringValue = value;
11401
- if (typeof value !== "string") {
11402
- stringValue = JSON.stringify(value);
11403
- }
11404
- return {
11405
- key,
11406
- value: stringValue,
11407
- original_key: key
11408
- };
11409
- });
11410
- }
11411
- function parseValues(values) {
11412
- const metadata = values.metadata;
11413
- const isEmpty = !metadata.length || metadata.length === 1 && !metadata[0].key && !metadata[0].value;
11414
- if (isEmpty) {
11415
- return null;
11416
- }
11417
- const update = {};
11418
- metadata.forEach((field) => {
11419
- let key = field.key;
11420
- let value = field.value;
11421
- const disabled = field.disabled;
11422
- if (!key || !value) {
11423
- return;
11424
- }
11425
- if (disabled) {
11426
- update[key] = value;
11427
- return;
11428
- }
11429
- key = key.trim();
11430
- value = value.trim();
11431
- if (value === "true") {
11432
- update[key] = true;
11433
- } else if (value === "false") {
11434
- update[key] = false;
11435
- } else {
11436
- const parsedNumber = parseFloat(value);
11437
- if (!isNaN(parsedNumber)) {
11438
- update[key] = parsedNumber;
11439
- } else {
11440
- update[key] = value;
11276
+ control,
11277
+ name: "sales_channel_id",
11278
+ render: ({ field }) => {
11279
+ return /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11280
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Sales Channel" }),
11281
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
11282
+ Combobox,
11283
+ {
11284
+ options: salesChannels.options,
11285
+ fetchNextPage: salesChannels.fetchNextPage,
11286
+ isFetchingNextPage: salesChannels.isFetchingNextPage,
11287
+ searchValue: salesChannels.searchValue,
11288
+ onSearchValueChange: salesChannels.onSearchValueChange,
11289
+ placeholder: "Select sales channel",
11290
+ ...field
11291
+ }
11292
+ ) }),
11293
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11294
+ ] });
11441
11295
  }
11442
11296
  }
11443
- });
11444
- return update;
11445
- }
11446
- function getHasUneditableRows(metadata) {
11447
- if (!metadata) {
11448
- return false;
11449
- }
11450
- return Object.values(metadata).some(
11451
- (value) => !EDITABLE_TYPES.includes(typeof value)
11452
11297
  );
11453
- }
11298
+ };
11299
+ const schema$4 = objectType({
11300
+ sales_channel_id: stringType().min(1)
11301
+ });
11454
11302
  const STACKED_FOCUS_MODAL_ID = "shipping-form";
11455
11303
  const Shipping = () => {
11456
11304
  var _a;
@@ -12290,7 +12138,7 @@ const ShippingAddressForm = ({ order }) => {
12290
12138
  postal_code: ((_i = order.shipping_address) == null ? void 0 : _i.postal_code) ?? "",
12291
12139
  phone: ((_j = order.shipping_address) == null ? void 0 : _j.phone) ?? ""
12292
12140
  },
12293
- resolver: zod.zodResolver(schema$2)
12141
+ resolver: zod.zodResolver(schema$3)
12294
12142
  });
12295
12143
  const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
12296
12144
  const { handleSuccess } = useRouteModal();
@@ -12460,7 +12308,7 @@ const ShippingAddressForm = ({ order }) => {
12460
12308
  }
12461
12309
  ) });
12462
12310
  };
12463
- const schema$2 = addressSchema;
12311
+ const schema$3 = addressSchema;
12464
12312
  const TransferOwnership = () => {
12465
12313
  const { id } = reactRouterDom.useParams();
12466
12314
  const { draft_order, isPending, isError, error } = useDraftOrder(id, {
@@ -12484,7 +12332,7 @@ const TransferOwnershipForm = ({ order }) => {
12484
12332
  defaultValues: {
12485
12333
  customer_id: order.customer_id || ""
12486
12334
  },
12487
- resolver: zod.zodResolver(schema$1)
12335
+ resolver: zod.zodResolver(schema$2)
12488
12336
  });
12489
12337
  const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
12490
12338
  const { handleSuccess } = useRouteModal();
@@ -12887,83 +12735,267 @@ const Illustration = () => {
12887
12735
  /* @__PURE__ */ jsxRuntime.jsx("clipPath", { id: "clip1_20915_38670", children: /* @__PURE__ */ jsxRuntime.jsx(
12888
12736
  "rect",
12889
12737
  {
12890
- width: "12",
12891
- height: "12",
12892
- fill: "white",
12893
- transform: "matrix(0.865865 0.500278 -0.871576 0.490261 148.75 80.6541)"
12738
+ width: "12",
12739
+ height: "12",
12740
+ fill: "white",
12741
+ transform: "matrix(0.865865 0.500278 -0.871576 0.490261 148.75 80.6541)"
12742
+ }
12743
+ ) }),
12744
+ /* @__PURE__ */ jsxRuntime.jsx("clipPath", { id: "clip2_20915_38670", children: /* @__PURE__ */ jsxRuntime.jsx(
12745
+ "rect",
12746
+ {
12747
+ width: "12",
12748
+ height: "12",
12749
+ fill: "white",
12750
+ transform: "matrix(0.865865 0.500278 -0.871576 0.490261 159.141 86.6575)"
12751
+ }
12752
+ ) }),
12753
+ /* @__PURE__ */ jsxRuntime.jsx("clipPath", { id: "clip3_20915_38670", children: /* @__PURE__ */ jsxRuntime.jsx(
12754
+ "rect",
12755
+ {
12756
+ width: "12",
12757
+ height: "12",
12758
+ fill: "white",
12759
+ transform: "matrix(0.865865 0.500278 -0.871576 0.490261 120.928 84.4561)"
12760
+ }
12761
+ ) }),
12762
+ /* @__PURE__ */ jsxRuntime.jsx("clipPath", { id: "clip4_20915_38670", children: /* @__PURE__ */ jsxRuntime.jsx(
12763
+ "rect",
12764
+ {
12765
+ width: "12",
12766
+ height: "12",
12767
+ fill: "white",
12768
+ transform: "matrix(0.865865 0.500278 -0.871576 0.490261 131.318 90.4594)"
12769
+ }
12770
+ ) }),
12771
+ /* @__PURE__ */ jsxRuntime.jsx("clipPath", { id: "clip5_20915_38670", children: /* @__PURE__ */ jsxRuntime.jsx(
12772
+ "rect",
12773
+ {
12774
+ width: "12",
12775
+ height: "12",
12776
+ fill: "white",
12777
+ transform: "matrix(0.865865 0.500278 -0.871576 0.490261 141.709 96.4627)"
12778
+ }
12779
+ ) })
12780
+ ] })
12781
+ ]
12782
+ }
12783
+ );
12784
+ };
12785
+ const schema$2 = objectType({
12786
+ customer_id: stringType().min(1)
12787
+ });
12788
+ const BillingAddress = () => {
12789
+ const { id } = reactRouterDom.useParams();
12790
+ const { order, isPending, isError, error } = useOrder(id, {
12791
+ fields: "+billing_address"
12792
+ });
12793
+ if (isError) {
12794
+ throw error;
12795
+ }
12796
+ const isReady = !isPending && !!order;
12797
+ return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
12798
+ /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
12799
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Billing Address" }) }),
12800
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit the billing address for the draft order" }) })
12801
+ ] }),
12802
+ isReady && /* @__PURE__ */ jsxRuntime.jsx(BillingAddressForm, { order })
12803
+ ] });
12804
+ };
12805
+ const BillingAddressForm = ({ order }) => {
12806
+ var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
12807
+ const form = reactHookForm.useForm({
12808
+ defaultValues: {
12809
+ first_name: ((_a = order.billing_address) == null ? void 0 : _a.first_name) ?? "",
12810
+ last_name: ((_b = order.billing_address) == null ? void 0 : _b.last_name) ?? "",
12811
+ company: ((_c = order.billing_address) == null ? void 0 : _c.company) ?? "",
12812
+ address_1: ((_d = order.billing_address) == null ? void 0 : _d.address_1) ?? "",
12813
+ address_2: ((_e = order.billing_address) == null ? void 0 : _e.address_2) ?? "",
12814
+ city: ((_f = order.billing_address) == null ? void 0 : _f.city) ?? "",
12815
+ province: ((_g = order.billing_address) == null ? void 0 : _g.province) ?? "",
12816
+ country_code: ((_h = order.billing_address) == null ? void 0 : _h.country_code) ?? "",
12817
+ postal_code: ((_i = order.billing_address) == null ? void 0 : _i.postal_code) ?? "",
12818
+ phone: ((_j = order.billing_address) == null ? void 0 : _j.phone) ?? ""
12819
+ },
12820
+ resolver: zod.zodResolver(schema$1)
12821
+ });
12822
+ const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
12823
+ const { handleSuccess } = useRouteModal();
12824
+ const onSubmit = form.handleSubmit(async (data) => {
12825
+ await mutateAsync(
12826
+ { billing_address: data },
12827
+ {
12828
+ onSuccess: () => {
12829
+ handleSuccess();
12830
+ },
12831
+ onError: (error) => {
12832
+ ui.toast.error(error.message);
12833
+ }
12834
+ }
12835
+ );
12836
+ });
12837
+ return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
12838
+ KeyboundForm,
12839
+ {
12840
+ className: "flex flex-1 flex-col overflow-hidden",
12841
+ onSubmit,
12842
+ children: [
12843
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-y-4", children: [
12844
+ /* @__PURE__ */ jsxRuntime.jsx(
12845
+ Form$2.Field,
12846
+ {
12847
+ control: form.control,
12848
+ name: "country_code",
12849
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12850
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Country" }),
12851
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(CountrySelect, { ...field }) }),
12852
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12853
+ ] })
12854
+ }
12855
+ ),
12856
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
12857
+ /* @__PURE__ */ jsxRuntime.jsx(
12858
+ Form$2.Field,
12859
+ {
12860
+ control: form.control,
12861
+ name: "first_name",
12862
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12863
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "First name" }),
12864
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12865
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12866
+ ] })
12867
+ }
12868
+ ),
12869
+ /* @__PURE__ */ jsxRuntime.jsx(
12870
+ Form$2.Field,
12871
+ {
12872
+ control: form.control,
12873
+ name: "last_name",
12874
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12875
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Last name" }),
12876
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12877
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12878
+ ] })
12879
+ }
12880
+ )
12881
+ ] }),
12882
+ /* @__PURE__ */ jsxRuntime.jsx(
12883
+ Form$2.Field,
12884
+ {
12885
+ control: form.control,
12886
+ name: "company",
12887
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12888
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Company" }),
12889
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12890
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12891
+ ] })
12894
12892
  }
12895
- ) }),
12896
- /* @__PURE__ */ jsxRuntime.jsx("clipPath", { id: "clip2_20915_38670", children: /* @__PURE__ */ jsxRuntime.jsx(
12897
- "rect",
12893
+ ),
12894
+ /* @__PURE__ */ jsxRuntime.jsx(
12895
+ Form$2.Field,
12898
12896
  {
12899
- width: "12",
12900
- height: "12",
12901
- fill: "white",
12902
- transform: "matrix(0.865865 0.500278 -0.871576 0.490261 159.141 86.6575)"
12897
+ control: form.control,
12898
+ name: "address_1",
12899
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12900
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Address" }),
12901
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12902
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12903
+ ] })
12903
12904
  }
12904
- ) }),
12905
- /* @__PURE__ */ jsxRuntime.jsx("clipPath", { id: "clip3_20915_38670", children: /* @__PURE__ */ jsxRuntime.jsx(
12906
- "rect",
12905
+ ),
12906
+ /* @__PURE__ */ jsxRuntime.jsx(
12907
+ Form$2.Field,
12907
12908
  {
12908
- width: "12",
12909
- height: "12",
12910
- fill: "white",
12911
- transform: "matrix(0.865865 0.500278 -0.871576 0.490261 120.928 84.4561)"
12909
+ control: form.control,
12910
+ name: "address_2",
12911
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12912
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Apartment, suite, etc." }),
12913
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12914
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12915
+ ] })
12912
12916
  }
12913
- ) }),
12914
- /* @__PURE__ */ jsxRuntime.jsx("clipPath", { id: "clip4_20915_38670", children: /* @__PURE__ */ jsxRuntime.jsx(
12915
- "rect",
12917
+ ),
12918
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
12919
+ /* @__PURE__ */ jsxRuntime.jsx(
12920
+ Form$2.Field,
12921
+ {
12922
+ control: form.control,
12923
+ name: "postal_code",
12924
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12925
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Postal code" }),
12926
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12927
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12928
+ ] })
12929
+ }
12930
+ ),
12931
+ /* @__PURE__ */ jsxRuntime.jsx(
12932
+ Form$2.Field,
12933
+ {
12934
+ control: form.control,
12935
+ name: "city",
12936
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12937
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "City" }),
12938
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12939
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12940
+ ] })
12941
+ }
12942
+ )
12943
+ ] }),
12944
+ /* @__PURE__ */ jsxRuntime.jsx(
12945
+ Form$2.Field,
12916
12946
  {
12917
- width: "12",
12918
- height: "12",
12919
- fill: "white",
12920
- transform: "matrix(0.865865 0.500278 -0.871576 0.490261 131.318 90.4594)"
12947
+ control: form.control,
12948
+ name: "province",
12949
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12950
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Province / State" }),
12951
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12952
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12953
+ ] })
12921
12954
  }
12922
- ) }),
12923
- /* @__PURE__ */ jsxRuntime.jsx("clipPath", { id: "clip5_20915_38670", children: /* @__PURE__ */ jsxRuntime.jsx(
12924
- "rect",
12955
+ ),
12956
+ /* @__PURE__ */ jsxRuntime.jsx(
12957
+ Form$2.Field,
12925
12958
  {
12926
- width: "12",
12927
- height: "12",
12928
- fill: "white",
12929
- transform: "matrix(0.865865 0.500278 -0.871576 0.490261 141.709 96.4627)"
12959
+ control: form.control,
12960
+ name: "phone",
12961
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12962
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Phone" }),
12963
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12964
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12965
+ ] })
12930
12966
  }
12931
- ) })
12932
- ] })
12967
+ )
12968
+ ] }) }),
12969
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
12970
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
12971
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
12972
+ ] }) })
12933
12973
  ]
12934
12974
  }
12935
- );
12975
+ ) });
12936
12976
  };
12937
- const schema$1 = objectType({
12938
- customer_id: stringType().min(1)
12939
- });
12940
- const SalesChannel = () => {
12977
+ const schema$1 = addressSchema;
12978
+ const Email = () => {
12941
12979
  const { id } = reactRouterDom.useParams();
12942
- const { draft_order, isPending, isError, error } = useDraftOrder(
12943
- id,
12944
- {
12945
- fields: "+sales_channel_id"
12946
- },
12947
- {
12948
- enabled: !!id
12949
- }
12950
- );
12980
+ const { order, isPending, isError, error } = useOrder(id, {
12981
+ fields: "+email"
12982
+ });
12951
12983
  if (isError) {
12952
12984
  throw error;
12953
12985
  }
12954
- const ISrEADY = !!draft_order && !isPending;
12986
+ const isReady = !isPending && !!order;
12955
12987
  return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
12956
12988
  /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
12957
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Sales Channel" }) }),
12958
- /* @__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" }) })
12989
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Email" }) }),
12990
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit the email for the draft order" }) })
12959
12991
  ] }),
12960
- ISrEADY && /* @__PURE__ */ jsxRuntime.jsx(SalesChannelForm, { order: draft_order })
12992
+ isReady && /* @__PURE__ */ jsxRuntime.jsx(EmailForm, { order })
12961
12993
  ] });
12962
12994
  };
12963
- const SalesChannelForm = ({ order }) => {
12995
+ const EmailForm = ({ order }) => {
12964
12996
  const form = reactHookForm.useForm({
12965
12997
  defaultValues: {
12966
- sales_channel_id: order.sales_channel_id || ""
12998
+ email: order.email ?? ""
12967
12999
  },
12968
13000
  resolver: zod.zodResolver(schema)
12969
13001
  });
@@ -12971,12 +13003,9 @@ const SalesChannelForm = ({ order }) => {
12971
13003
  const { handleSuccess } = useRouteModal();
12972
13004
  const onSubmit = form.handleSubmit(async (data) => {
12973
13005
  await mutateAsync(
12974
- {
12975
- sales_channel_id: data.sales_channel_id
12976
- },
13006
+ { email: data.email },
12977
13007
  {
12978
13008
  onSuccess: () => {
12979
- ui.toast.success("Sales channel updated");
12980
13009
  handleSuccess();
12981
13010
  },
12982
13011
  onError: (error) => {
@@ -12991,7 +13020,18 @@ const SalesChannelForm = ({ order }) => {
12991
13020
  className: "flex flex-1 flex-col overflow-hidden",
12992
13021
  onSubmit,
12993
13022
  children: [
12994
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsx(SalesChannelField, { control: form.control, order }) }),
13023
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsx(
13024
+ Form$2.Field,
13025
+ {
13026
+ control: form.control,
13027
+ name: "email",
13028
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
13029
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Email" }),
13030
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
13031
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
13032
+ ] })
13033
+ }
13034
+ ) }),
12995
13035
  /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
12996
13036
  /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
12997
13037
  /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
@@ -13000,48 +13040,8 @@ const SalesChannelForm = ({ order }) => {
13000
13040
  }
13001
13041
  ) });
13002
13042
  };
13003
- const SalesChannelField = ({ control, order }) => {
13004
- const salesChannels = useComboboxData({
13005
- queryFn: async (params) => {
13006
- return await sdk.admin.salesChannel.list(params);
13007
- },
13008
- queryKey: ["sales-channels"],
13009
- getOptions: (data) => {
13010
- return data.sales_channels.map((salesChannel) => ({
13011
- label: salesChannel.name,
13012
- value: salesChannel.id
13013
- }));
13014
- },
13015
- defaultValue: order.sales_channel_id || void 0
13016
- });
13017
- return /* @__PURE__ */ jsxRuntime.jsx(
13018
- Form$2.Field,
13019
- {
13020
- control,
13021
- name: "sales_channel_id",
13022
- render: ({ field }) => {
13023
- return /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
13024
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Sales Channel" }),
13025
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
13026
- Combobox,
13027
- {
13028
- options: salesChannels.options,
13029
- fetchNextPage: salesChannels.fetchNextPage,
13030
- isFetchingNextPage: salesChannels.isFetchingNextPage,
13031
- searchValue: salesChannels.searchValue,
13032
- onSearchValueChange: salesChannels.onSearchValueChange,
13033
- placeholder: "Select sales channel",
13034
- ...field
13035
- }
13036
- ) }),
13037
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
13038
- ] });
13039
- }
13040
- }
13041
- );
13042
- };
13043
13043
  const schema = objectType({
13044
- sales_channel_id: stringType().min(1)
13044
+ email: stringType().email()
13045
13045
  });
13046
13046
  const widgetModule = { widgets: [] };
13047
13047
  const routeModule = {
@@ -13063,29 +13063,25 @@ const routeModule = {
13063
13063
  handle,
13064
13064
  loader,
13065
13065
  children: [
13066
- {
13067
- Component: BillingAddress,
13068
- path: "/draft-orders/:id/billing-address"
13069
- },
13070
13066
  {
13071
13067
  Component: CustomItems,
13072
13068
  path: "/draft-orders/:id/custom-items"
13073
13069
  },
13074
- {
13075
- Component: Email,
13076
- path: "/draft-orders/:id/email"
13077
- },
13078
13070
  {
13079
13071
  Component: Items,
13080
13072
  path: "/draft-orders/:id/items"
13081
13073
  },
13074
+ {
13075
+ Component: Metadata,
13076
+ path: "/draft-orders/:id/metadata"
13077
+ },
13082
13078
  {
13083
13079
  Component: Promotions,
13084
13080
  path: "/draft-orders/:id/promotions"
13085
13081
  },
13086
13082
  {
13087
- Component: Metadata,
13088
- path: "/draft-orders/:id/metadata"
13083
+ Component: SalesChannel,
13084
+ path: "/draft-orders/:id/sales-channel"
13089
13085
  },
13090
13086
  {
13091
13087
  Component: Shipping,
@@ -13100,8 +13096,12 @@ const routeModule = {
13100
13096
  path: "/draft-orders/:id/transfer-ownership"
13101
13097
  },
13102
13098
  {
13103
- Component: SalesChannel,
13104
- path: "/draft-orders/:id/sales-channel"
13099
+ Component: BillingAddress,
13100
+ path: "/draft-orders/:id/billing-address"
13101
+ },
13102
+ {
13103
+ Component: Email,
13104
+ path: "/draft-orders/:id/email"
13105
13105
  }
13106
13106
  ]
13107
13107
  }