@medusajs/draft-order 2.10.4-snapshot-20251008160740 → 2.10.4-snapshot-20251009074418

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.
@@ -9573,10 +9573,31 @@ const ID = () => {
9573
9573
  /* @__PURE__ */ jsxRuntime.jsx(reactRouterDom.Outlet, {})
9574
9574
  ] });
9575
9575
  };
9576
- const BillingAddress = () => {
9576
+ const CustomItems = () => {
9577
+ return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
9578
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Header, { children: /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Custom Items" }) }) }),
9579
+ /* @__PURE__ */ jsxRuntime.jsx(CustomItemsForm, {})
9580
+ ] });
9581
+ };
9582
+ const CustomItemsForm = () => {
9583
+ const form = reactHookForm.useForm({
9584
+ resolver: zod.zodResolver(schema$5)
9585
+ });
9586
+ return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(KeyboundForm, { className: "flex flex-1 flex-col", children: [
9587
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, {}),
9588
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
9589
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
9590
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", children: "Save" })
9591
+ ] }) })
9592
+ ] }) });
9593
+ };
9594
+ const schema$5 = objectType({
9595
+ email: stringType().email()
9596
+ });
9597
+ const Email = () => {
9577
9598
  const { id } = reactRouterDom.useParams();
9578
9599
  const { order, isPending, isError, error } = useOrder(id, {
9579
- fields: "+billing_address"
9600
+ fields: "+email"
9580
9601
  });
9581
9602
  if (isError) {
9582
9603
  throw error;
@@ -9584,34 +9605,24 @@ const BillingAddress = () => {
9584
9605
  const isReady = !isPending && !!order;
9585
9606
  return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
9586
9607
  /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
9587
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Billing Address" }) }),
9588
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit the billing address for the draft order" }) })
9608
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Email" }) }),
9609
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit the email for the draft order" }) })
9589
9610
  ] }),
9590
- isReady && /* @__PURE__ */ jsxRuntime.jsx(BillingAddressForm, { order })
9611
+ isReady && /* @__PURE__ */ jsxRuntime.jsx(EmailForm, { order })
9591
9612
  ] });
9592
9613
  };
9593
- const BillingAddressForm = ({ order }) => {
9594
- var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
9614
+ const EmailForm = ({ order }) => {
9595
9615
  const form = reactHookForm.useForm({
9596
9616
  defaultValues: {
9597
- first_name: ((_a = order.billing_address) == null ? void 0 : _a.first_name) ?? "",
9598
- last_name: ((_b = order.billing_address) == null ? void 0 : _b.last_name) ?? "",
9599
- company: ((_c = order.billing_address) == null ? void 0 : _c.company) ?? "",
9600
- address_1: ((_d = order.billing_address) == null ? void 0 : _d.address_1) ?? "",
9601
- address_2: ((_e = order.billing_address) == null ? void 0 : _e.address_2) ?? "",
9602
- city: ((_f = order.billing_address) == null ? void 0 : _f.city) ?? "",
9603
- province: ((_g = order.billing_address) == null ? void 0 : _g.province) ?? "",
9604
- country_code: ((_h = order.billing_address) == null ? void 0 : _h.country_code) ?? "",
9605
- postal_code: ((_i = order.billing_address) == null ? void 0 : _i.postal_code) ?? "",
9606
- phone: ((_j = order.billing_address) == null ? void 0 : _j.phone) ?? ""
9617
+ email: order.email ?? ""
9607
9618
  },
9608
- resolver: zod.zodResolver(schema$5)
9619
+ resolver: zod.zodResolver(schema$4)
9609
9620
  });
9610
9621
  const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
9611
9622
  const { handleSuccess } = useRouteModal();
9612
9623
  const onSubmit = form.handleSubmit(async (data) => {
9613
9624
  await mutateAsync(
9614
- { billing_address: data },
9625
+ { email: data.email },
9615
9626
  {
9616
9627
  onSuccess: () => {
9617
9628
  handleSuccess();
@@ -9628,132 +9639,18 @@ const BillingAddressForm = ({ order }) => {
9628
9639
  className: "flex flex-1 flex-col overflow-hidden",
9629
9640
  onSubmit,
9630
9641
  children: [
9631
- /* @__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: [
9632
- /* @__PURE__ */ jsxRuntime.jsx(
9633
- Form$2.Field,
9634
- {
9635
- control: form.control,
9636
- name: "country_code",
9637
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9638
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Country" }),
9639
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(CountrySelect, { ...field }) }),
9640
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9641
- ] })
9642
- }
9643
- ),
9644
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
9645
- /* @__PURE__ */ jsxRuntime.jsx(
9646
- Form$2.Field,
9647
- {
9648
- control: form.control,
9649
- name: "first_name",
9650
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9651
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "First name" }),
9652
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9653
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9654
- ] })
9655
- }
9656
- ),
9657
- /* @__PURE__ */ jsxRuntime.jsx(
9658
- Form$2.Field,
9659
- {
9660
- control: form.control,
9661
- name: "last_name",
9662
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9663
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Last name" }),
9664
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9665
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9666
- ] })
9667
- }
9668
- )
9669
- ] }),
9670
- /* @__PURE__ */ jsxRuntime.jsx(
9671
- Form$2.Field,
9672
- {
9673
- control: form.control,
9674
- name: "company",
9675
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9676
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Company" }),
9677
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9678
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9679
- ] })
9680
- }
9681
- ),
9682
- /* @__PURE__ */ jsxRuntime.jsx(
9683
- Form$2.Field,
9684
- {
9685
- control: form.control,
9686
- name: "address_1",
9687
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9688
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Address" }),
9689
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9690
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9691
- ] })
9692
- }
9693
- ),
9694
- /* @__PURE__ */ jsxRuntime.jsx(
9695
- Form$2.Field,
9696
- {
9697
- control: form.control,
9698
- name: "address_2",
9699
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9700
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Apartment, suite, etc." }),
9701
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9702
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9703
- ] })
9704
- }
9705
- ),
9706
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
9707
- /* @__PURE__ */ jsxRuntime.jsx(
9708
- Form$2.Field,
9709
- {
9710
- control: form.control,
9711
- name: "postal_code",
9712
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9713
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Postal code" }),
9714
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9715
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9716
- ] })
9717
- }
9718
- ),
9719
- /* @__PURE__ */ jsxRuntime.jsx(
9720
- Form$2.Field,
9721
- {
9722
- control: form.control,
9723
- name: "city",
9724
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9725
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "City" }),
9726
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9727
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9728
- ] })
9729
- }
9730
- )
9731
- ] }),
9732
- /* @__PURE__ */ jsxRuntime.jsx(
9733
- Form$2.Field,
9734
- {
9735
- control: form.control,
9736
- name: "province",
9737
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9738
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Province / State" }),
9739
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9740
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9741
- ] })
9742
- }
9743
- ),
9744
- /* @__PURE__ */ jsxRuntime.jsx(
9745
- Form$2.Field,
9746
- {
9747
- control: form.control,
9748
- name: "phone",
9749
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9750
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Phone" }),
9751
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9752
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9753
- ] })
9754
- }
9755
- )
9756
- ] }) }),
9642
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsx(
9643
+ Form$2.Field,
9644
+ {
9645
+ control: form.control,
9646
+ name: "email",
9647
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9648
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Email" }),
9649
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9650
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9651
+ ] })
9652
+ }
9653
+ ) }),
9757
9654
  /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
9758
9655
  /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
9759
9656
  /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
@@ -9762,7 +9659,9 @@ const BillingAddressForm = ({ order }) => {
9762
9659
  }
9763
9660
  ) });
9764
9661
  };
9765
- const schema$5 = addressSchema;
9662
+ const schema$4 = objectType({
9663
+ email: stringType().email()
9664
+ });
9766
9665
  const NumberInput = React.forwardRef(
9767
9666
  ({
9768
9667
  value,
@@ -10737,10 +10636,54 @@ const customItemSchema = objectType({
10737
10636
  quantity: numberType(),
10738
10637
  unit_price: unionType([numberType(), stringType()])
10739
10638
  });
10740
- const Email = () => {
10639
+ const InlineTip = React.forwardRef(
10640
+ ({ variant = "tip", label, className, children, ...props }, ref) => {
10641
+ const labelValue = label || (variant === "warning" ? "Warning" : "Tip");
10642
+ return /* @__PURE__ */ jsxRuntime.jsxs(
10643
+ "div",
10644
+ {
10645
+ ref,
10646
+ className: ui.clx(
10647
+ "bg-ui-bg-component txt-small text-ui-fg-subtle grid grid-cols-[4px_1fr] items-start gap-3 rounded-lg border p-3",
10648
+ className
10649
+ ),
10650
+ ...props,
10651
+ children: [
10652
+ /* @__PURE__ */ jsxRuntime.jsx(
10653
+ "div",
10654
+ {
10655
+ role: "presentation",
10656
+ className: ui.clx("w-4px bg-ui-tag-neutral-icon h-full rounded-full", {
10657
+ "bg-ui-tag-orange-icon": variant === "warning"
10658
+ })
10659
+ }
10660
+ ),
10661
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-pretty", children: [
10662
+ /* @__PURE__ */ jsxRuntime.jsxs("strong", { className: "txt-small-plus text-ui-fg-base", children: [
10663
+ labelValue,
10664
+ ":"
10665
+ ] }),
10666
+ " ",
10667
+ children
10668
+ ] })
10669
+ ]
10670
+ }
10671
+ );
10672
+ }
10673
+ );
10674
+ InlineTip.displayName = "InlineTip";
10675
+ const MetadataFieldSchema = objectType({
10676
+ key: stringType(),
10677
+ disabled: booleanType().optional(),
10678
+ value: anyType()
10679
+ });
10680
+ const MetadataSchema = objectType({
10681
+ metadata: arrayType(MetadataFieldSchema)
10682
+ });
10683
+ const Metadata = () => {
10741
10684
  const { id } = reactRouterDom.useParams();
10742
10685
  const { order, isPending, isError, error } = useOrder(id, {
10743
- fields: "+email"
10686
+ fields: "metadata"
10744
10687
  });
10745
10688
  if (isError) {
10746
10689
  throw error;
@@ -10748,135 +10691,23 @@ const Email = () => {
10748
10691
  const isReady = !isPending && !!order;
10749
10692
  return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
10750
10693
  /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
10751
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Email" }) }),
10752
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit the email for the draft order" }) })
10694
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Metadata" }) }),
10695
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Add metadata to the draft order." }) })
10753
10696
  ] }),
10754
- isReady && /* @__PURE__ */ jsxRuntime.jsx(EmailForm, { order })
10697
+ !isReady ? /* @__PURE__ */ jsxRuntime.jsx(PlaceholderInner, {}) : /* @__PURE__ */ jsxRuntime.jsx(MetadataForm, { orderId: id, metadata: order == null ? void 0 : order.metadata })
10755
10698
  ] });
10756
10699
  };
10757
- const EmailForm = ({ order }) => {
10700
+ const METADATA_KEY_LABEL_ID = "metadata-form-key-label";
10701
+ const METADATA_VALUE_LABEL_ID = "metadata-form-value-label";
10702
+ const MetadataForm = ({ orderId, metadata }) => {
10703
+ const { handleSuccess } = useRouteModal();
10704
+ const hasUneditableRows = getHasUneditableRows(metadata);
10705
+ const { mutateAsync, isPending } = useUpdateDraftOrder(orderId);
10758
10706
  const form = reactHookForm.useForm({
10759
10707
  defaultValues: {
10760
- email: order.email ?? ""
10708
+ metadata: getDefaultValues(metadata)
10761
10709
  },
10762
- resolver: zod.zodResolver(schema$4)
10763
- });
10764
- const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
10765
- const { handleSuccess } = useRouteModal();
10766
- const onSubmit = form.handleSubmit(async (data) => {
10767
- await mutateAsync(
10768
- { email: data.email },
10769
- {
10770
- onSuccess: () => {
10771
- handleSuccess();
10772
- },
10773
- onError: (error) => {
10774
- ui.toast.error(error.message);
10775
- }
10776
- }
10777
- );
10778
- });
10779
- return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
10780
- KeyboundForm,
10781
- {
10782
- className: "flex flex-1 flex-col overflow-hidden",
10783
- onSubmit,
10784
- children: [
10785
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsx(
10786
- Form$2.Field,
10787
- {
10788
- control: form.control,
10789
- name: "email",
10790
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
10791
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Email" }),
10792
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
10793
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
10794
- ] })
10795
- }
10796
- ) }),
10797
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
10798
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
10799
- /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
10800
- ] }) })
10801
- ]
10802
- }
10803
- ) });
10804
- };
10805
- const schema$4 = objectType({
10806
- email: stringType().email()
10807
- });
10808
- const InlineTip = React.forwardRef(
10809
- ({ variant = "tip", label, className, children, ...props }, ref) => {
10810
- const labelValue = label || (variant === "warning" ? "Warning" : "Tip");
10811
- return /* @__PURE__ */ jsxRuntime.jsxs(
10812
- "div",
10813
- {
10814
- ref,
10815
- className: ui.clx(
10816
- "bg-ui-bg-component txt-small text-ui-fg-subtle grid grid-cols-[4px_1fr] items-start gap-3 rounded-lg border p-3",
10817
- className
10818
- ),
10819
- ...props,
10820
- children: [
10821
- /* @__PURE__ */ jsxRuntime.jsx(
10822
- "div",
10823
- {
10824
- role: "presentation",
10825
- className: ui.clx("w-4px bg-ui-tag-neutral-icon h-full rounded-full", {
10826
- "bg-ui-tag-orange-icon": variant === "warning"
10827
- })
10828
- }
10829
- ),
10830
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-pretty", children: [
10831
- /* @__PURE__ */ jsxRuntime.jsxs("strong", { className: "txt-small-plus text-ui-fg-base", children: [
10832
- labelValue,
10833
- ":"
10834
- ] }),
10835
- " ",
10836
- children
10837
- ] })
10838
- ]
10839
- }
10840
- );
10841
- }
10842
- );
10843
- InlineTip.displayName = "InlineTip";
10844
- const MetadataFieldSchema = objectType({
10845
- key: stringType(),
10846
- disabled: booleanType().optional(),
10847
- value: anyType()
10848
- });
10849
- const MetadataSchema = objectType({
10850
- metadata: arrayType(MetadataFieldSchema)
10851
- });
10852
- const Metadata = () => {
10853
- const { id } = reactRouterDom.useParams();
10854
- const { order, isPending, isError, error } = useOrder(id, {
10855
- fields: "metadata"
10856
- });
10857
- if (isError) {
10858
- throw error;
10859
- }
10860
- const isReady = !isPending && !!order;
10861
- return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
10862
- /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
10863
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Metadata" }) }),
10864
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Add metadata to the draft order." }) })
10865
- ] }),
10866
- !isReady ? /* @__PURE__ */ jsxRuntime.jsx(PlaceholderInner, {}) : /* @__PURE__ */ jsxRuntime.jsx(MetadataForm, { orderId: id, metadata: order == null ? void 0 : order.metadata })
10867
- ] });
10868
- };
10869
- const METADATA_KEY_LABEL_ID = "metadata-form-key-label";
10870
- const METADATA_VALUE_LABEL_ID = "metadata-form-value-label";
10871
- const MetadataForm = ({ orderId, metadata }) => {
10872
- const { handleSuccess } = useRouteModal();
10873
- const hasUneditableRows = getHasUneditableRows(metadata);
10874
- const { mutateAsync, isPending } = useUpdateDraftOrder(orderId);
10875
- const form = reactHookForm.useForm({
10876
- defaultValues: {
10877
- metadata: getDefaultValues(metadata)
10878
- },
10879
- resolver: zod.zodResolver(MetadataSchema)
10710
+ resolver: zod.zodResolver(MetadataSchema)
10880
10711
  });
10881
10712
  const handleSubmit = form.handleSubmit(async (data) => {
10882
10713
  const parsedData = parseValues(data);
@@ -11155,27 +10986,6 @@ function getHasUneditableRows(metadata) {
11155
10986
  (value) => !EDITABLE_TYPES.includes(typeof value)
11156
10987
  );
11157
10988
  }
11158
- const CustomItems = () => {
11159
- return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
11160
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Header, { children: /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Custom Items" }) }) }),
11161
- /* @__PURE__ */ jsxRuntime.jsx(CustomItemsForm, {})
11162
- ] });
11163
- };
11164
- const CustomItemsForm = () => {
11165
- const form = reactHookForm.useForm({
11166
- resolver: zod.zodResolver(schema$3)
11167
- });
11168
- return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(KeyboundForm, { className: "flex flex-1 flex-col", children: [
11169
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, {}),
11170
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
11171
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
11172
- /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", children: "Save" })
11173
- ] }) })
11174
- ] }) });
11175
- };
11176
- const schema$3 = objectType({
11177
- email: stringType().email()
11178
- });
11179
10989
  const PROMOTION_QUERY_KEY = "promotions";
11180
10990
  const promotionsQueryKeys = {
11181
10991
  list: (query2) => [
@@ -11481,7 +11291,7 @@ const SalesChannelForm = ({ order }) => {
11481
11291
  defaultValues: {
11482
11292
  sales_channel_id: order.sales_channel_id || ""
11483
11293
  },
11484
- resolver: zod.zodResolver(schema$2)
11294
+ resolver: zod.zodResolver(schema$3)
11485
11295
  });
11486
11296
  const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
11487
11297
  const { handleSuccess } = useRouteModal();
@@ -11556,286 +11366,83 @@ const SalesChannelField = ({ control, order }) => {
11556
11366
  }
11557
11367
  );
11558
11368
  };
11559
- const schema$2 = objectType({
11369
+ const schema$3 = objectType({
11560
11370
  sales_channel_id: stringType().min(1)
11561
11371
  });
11562
- const ShippingAddress = () => {
11372
+ const STACKED_FOCUS_MODAL_ID = "shipping-form";
11373
+ const Shipping = () => {
11374
+ var _a;
11563
11375
  const { id } = reactRouterDom.useParams();
11564
11376
  const { order, isPending, isError, error } = useOrder(id, {
11565
- fields: "+shipping_address"
11377
+ fields: "+items.*,+items.variant.*,+items.variant.product.*,+items.variant.product.shipping_profile.*,+currency_code"
11566
11378
  });
11379
+ const {
11380
+ order: preview,
11381
+ isPending: isPreviewPending,
11382
+ isError: isPreviewError,
11383
+ error: previewError
11384
+ } = useOrderPreview(id);
11385
+ useInitiateOrderEdit({ preview });
11386
+ const { onCancel } = useCancelOrderEdit({ preview });
11567
11387
  if (isError) {
11568
11388
  throw error;
11569
11389
  }
11570
- const isReady = !isPending && !!order;
11571
- return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
11572
- /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
11573
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Shipping Address" }) }),
11574
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit the shipping address for the draft order" }) })
11575
- ] }),
11576
- isReady && /* @__PURE__ */ jsxRuntime.jsx(ShippingAddressForm, { order })
11577
- ] });
11390
+ if (isPreviewError) {
11391
+ throw previewError;
11392
+ }
11393
+ const orderHasItems = (((_a = order == null ? void 0 : order.items) == null ? void 0 : _a.length) || 0) > 0;
11394
+ const isReady = preview && !isPreviewPending && order && !isPending;
11395
+ return /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal, { onClose: onCancel, children: !orderHasItems ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex h-full flex-col overflow-hidden ", children: [
11396
+ /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Header, {}),
11397
+ /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Body, { className: "flex flex-1 flex-col overflow-hidden", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-1 flex-col items-center overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex w-full max-w-[720px] flex-col gap-y-6 py-16 px-6", children: [
11398
+ /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Shipping" }) }),
11399
+ /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", className: "text-ui-fg-subtle", children: "This draft order currently has no items. Add items to the order before adding shipping." }) })
11400
+ ] }) }) }),
11401
+ /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Footer, { children: /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", type: "button", children: "Cancel" }) }) })
11402
+ ] }) : isReady ? /* @__PURE__ */ jsxRuntime.jsx(ShippingForm, { preview, order }) : /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
11403
+ /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit Shipping" }) }),
11404
+ /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Loading data for the draft order, please wait..." }) })
11405
+ ] }) });
11578
11406
  };
11579
- const ShippingAddressForm = ({ order }) => {
11580
- var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
11581
- const form = reactHookForm.useForm({
11582
- defaultValues: {
11583
- first_name: ((_a = order.shipping_address) == null ? void 0 : _a.first_name) ?? "",
11584
- last_name: ((_b = order.shipping_address) == null ? void 0 : _b.last_name) ?? "",
11585
- company: ((_c = order.shipping_address) == null ? void 0 : _c.company) ?? "",
11586
- address_1: ((_d = order.shipping_address) == null ? void 0 : _d.address_1) ?? "",
11587
- address_2: ((_e = order.shipping_address) == null ? void 0 : _e.address_2) ?? "",
11588
- city: ((_f = order.shipping_address) == null ? void 0 : _f.city) ?? "",
11589
- province: ((_g = order.shipping_address) == null ? void 0 : _g.province) ?? "",
11590
- country_code: ((_h = order.shipping_address) == null ? void 0 : _h.country_code) ?? "",
11591
- postal_code: ((_i = order.shipping_address) == null ? void 0 : _i.postal_code) ?? "",
11592
- phone: ((_j = order.shipping_address) == null ? void 0 : _j.phone) ?? ""
11407
+ const ShippingForm = ({ preview, order }) => {
11408
+ var _a;
11409
+ const { setIsOpen } = useStackedModal();
11410
+ const [isSubmitting, setIsSubmitting] = React.useState(false);
11411
+ const [data, setData] = React.useState(null);
11412
+ const appliedShippingOptionIds = (_a = preview.shipping_methods) == null ? void 0 : _a.map((method) => method.shipping_option_id).filter(Boolean);
11413
+ const { shipping_options } = useShippingOptions(
11414
+ {
11415
+ id: appliedShippingOptionIds,
11416
+ fields: "+service_zone.*,+service_zone.fulfillment_set.*,+service_zone.fulfillment_set.location.*"
11593
11417
  },
11594
- resolver: zod.zodResolver(schema$1)
11595
- });
11596
- const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
11418
+ {
11419
+ enabled: appliedShippingOptionIds.length > 0
11420
+ }
11421
+ );
11422
+ const uniqueShippingProfiles = React.useMemo(() => {
11423
+ const profiles = /* @__PURE__ */ new Map();
11424
+ getUniqueShippingProfiles(order.items).forEach((profile) => {
11425
+ profiles.set(profile.id, profile);
11426
+ });
11427
+ shipping_options == null ? void 0 : shipping_options.forEach((option) => {
11428
+ profiles.set(option.shipping_profile_id, option.shipping_profile);
11429
+ });
11430
+ return Array.from(profiles.values());
11431
+ }, [order.items, shipping_options]);
11597
11432
  const { handleSuccess } = useRouteModal();
11598
- const onSubmit = form.handleSubmit(async (data) => {
11599
- await mutateAsync(
11600
- {
11601
- shipping_address: {
11602
- first_name: data.first_name,
11603
- last_name: data.last_name,
11604
- company: data.company,
11605
- address_1: data.address_1,
11606
- address_2: data.address_2,
11607
- city: data.city,
11608
- province: data.province,
11609
- country_code: data.country_code,
11610
- postal_code: data.postal_code,
11611
- phone: data.phone
11612
- }
11433
+ const { mutateAsync: confirmOrderEdit } = useDraftOrderConfirmEdit(preview.id);
11434
+ const { mutateAsync: requestOrderEdit } = useDraftOrderRequestEdit(preview.id);
11435
+ const { mutateAsync: removeShippingMethod } = useDraftOrderRemoveShippingMethod(preview.id);
11436
+ const { mutateAsync: removeActionShippingMethod } = useDraftOrderRemoveActionShippingMethod(preview.id);
11437
+ const onSubmit = async () => {
11438
+ setIsSubmitting(true);
11439
+ let requestSucceeded = false;
11440
+ await requestOrderEdit(void 0, {
11441
+ onError: (e) => {
11442
+ ui.toast.error(`Failed to request order edit: ${e.message}`);
11613
11443
  },
11614
- {
11615
- onSuccess: () => {
11616
- handleSuccess();
11617
- },
11618
- onError: (error) => {
11619
- ui.toast.error(error.message);
11620
- }
11621
- }
11622
- );
11623
- });
11624
- return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
11625
- KeyboundForm,
11626
- {
11627
- className: "flex flex-1 flex-col overflow-hidden",
11628
- onSubmit,
11629
- children: [
11630
- /* @__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: [
11631
- /* @__PURE__ */ jsxRuntime.jsx(
11632
- Form$2.Field,
11633
- {
11634
- control: form.control,
11635
- name: "country_code",
11636
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11637
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Country" }),
11638
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(CountrySelect, { ...field }) }),
11639
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11640
- ] })
11641
- }
11642
- ),
11643
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
11644
- /* @__PURE__ */ jsxRuntime.jsx(
11645
- Form$2.Field,
11646
- {
11647
- control: form.control,
11648
- name: "first_name",
11649
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11650
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "First name" }),
11651
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11652
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11653
- ] })
11654
- }
11655
- ),
11656
- /* @__PURE__ */ jsxRuntime.jsx(
11657
- Form$2.Field,
11658
- {
11659
- control: form.control,
11660
- name: "last_name",
11661
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11662
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Last name" }),
11663
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11664
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11665
- ] })
11666
- }
11667
- )
11668
- ] }),
11669
- /* @__PURE__ */ jsxRuntime.jsx(
11670
- Form$2.Field,
11671
- {
11672
- control: form.control,
11673
- name: "company",
11674
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11675
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Company" }),
11676
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11677
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11678
- ] })
11679
- }
11680
- ),
11681
- /* @__PURE__ */ jsxRuntime.jsx(
11682
- Form$2.Field,
11683
- {
11684
- control: form.control,
11685
- name: "address_1",
11686
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11687
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Address" }),
11688
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11689
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11690
- ] })
11691
- }
11692
- ),
11693
- /* @__PURE__ */ jsxRuntime.jsx(
11694
- Form$2.Field,
11695
- {
11696
- control: form.control,
11697
- name: "address_2",
11698
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11699
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Apartment, suite, etc." }),
11700
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11701
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11702
- ] })
11703
- }
11704
- ),
11705
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
11706
- /* @__PURE__ */ jsxRuntime.jsx(
11707
- Form$2.Field,
11708
- {
11709
- control: form.control,
11710
- name: "postal_code",
11711
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11712
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Postal code" }),
11713
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11714
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11715
- ] })
11716
- }
11717
- ),
11718
- /* @__PURE__ */ jsxRuntime.jsx(
11719
- Form$2.Field,
11720
- {
11721
- control: form.control,
11722
- name: "city",
11723
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11724
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "City" }),
11725
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11726
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11727
- ] })
11728
- }
11729
- )
11730
- ] }),
11731
- /* @__PURE__ */ jsxRuntime.jsx(
11732
- Form$2.Field,
11733
- {
11734
- control: form.control,
11735
- name: "province",
11736
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11737
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Province / State" }),
11738
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11739
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11740
- ] })
11741
- }
11742
- ),
11743
- /* @__PURE__ */ jsxRuntime.jsx(
11744
- Form$2.Field,
11745
- {
11746
- control: form.control,
11747
- name: "phone",
11748
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11749
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Phone" }),
11750
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11751
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11752
- ] })
11753
- }
11754
- )
11755
- ] }) }),
11756
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
11757
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
11758
- /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
11759
- ] }) })
11760
- ]
11761
- }
11762
- ) });
11763
- };
11764
- const schema$1 = addressSchema;
11765
- const STACKED_FOCUS_MODAL_ID = "shipping-form";
11766
- const Shipping = () => {
11767
- var _a;
11768
- const { id } = reactRouterDom.useParams();
11769
- const { order, isPending, isError, error } = useOrder(id, {
11770
- fields: "+items.*,+items.variant.*,+items.variant.product.*,+items.variant.product.shipping_profile.*,+currency_code"
11771
- });
11772
- const {
11773
- order: preview,
11774
- isPending: isPreviewPending,
11775
- isError: isPreviewError,
11776
- error: previewError
11777
- } = useOrderPreview(id);
11778
- useInitiateOrderEdit({ preview });
11779
- const { onCancel } = useCancelOrderEdit({ preview });
11780
- if (isError) {
11781
- throw error;
11782
- }
11783
- if (isPreviewError) {
11784
- throw previewError;
11785
- }
11786
- const orderHasItems = (((_a = order == null ? void 0 : order.items) == null ? void 0 : _a.length) || 0) > 0;
11787
- const isReady = preview && !isPreviewPending && order && !isPending;
11788
- return /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal, { onClose: onCancel, children: !orderHasItems ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex h-full flex-col overflow-hidden ", children: [
11789
- /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Header, {}),
11790
- /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Body, { className: "flex flex-1 flex-col overflow-hidden", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-1 flex-col items-center overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex w-full max-w-[720px] flex-col gap-y-6 py-16 px-6", children: [
11791
- /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Shipping" }) }),
11792
- /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", className: "text-ui-fg-subtle", children: "This draft order currently has no items. Add items to the order before adding shipping." }) })
11793
- ] }) }) }),
11794
- /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Footer, { children: /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", type: "button", children: "Cancel" }) }) })
11795
- ] }) : isReady ? /* @__PURE__ */ jsxRuntime.jsx(ShippingForm, { preview, order }) : /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
11796
- /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit Shipping" }) }),
11797
- /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Loading data for the draft order, please wait..." }) })
11798
- ] }) });
11799
- };
11800
- const ShippingForm = ({ preview, order }) => {
11801
- var _a;
11802
- const { setIsOpen } = useStackedModal();
11803
- const [isSubmitting, setIsSubmitting] = React.useState(false);
11804
- const [data, setData] = React.useState(null);
11805
- const appliedShippingOptionIds = (_a = preview.shipping_methods) == null ? void 0 : _a.map((method) => method.shipping_option_id).filter(Boolean);
11806
- const { shipping_options } = useShippingOptions(
11807
- {
11808
- id: appliedShippingOptionIds,
11809
- fields: "+service_zone.*,+service_zone.fulfillment_set.*,+service_zone.fulfillment_set.location.*"
11810
- },
11811
- {
11812
- enabled: appliedShippingOptionIds.length > 0
11813
- }
11814
- );
11815
- const uniqueShippingProfiles = React.useMemo(() => {
11816
- const profiles = /* @__PURE__ */ new Map();
11817
- getUniqueShippingProfiles(order.items).forEach((profile) => {
11818
- profiles.set(profile.id, profile);
11819
- });
11820
- shipping_options == null ? void 0 : shipping_options.forEach((option) => {
11821
- profiles.set(option.shipping_profile_id, option.shipping_profile);
11822
- });
11823
- return Array.from(profiles.values());
11824
- }, [order.items, shipping_options]);
11825
- const { handleSuccess } = useRouteModal();
11826
- const { mutateAsync: confirmOrderEdit } = useDraftOrderConfirmEdit(preview.id);
11827
- const { mutateAsync: requestOrderEdit } = useDraftOrderRequestEdit(preview.id);
11828
- const { mutateAsync: removeShippingMethod } = useDraftOrderRemoveShippingMethod(preview.id);
11829
- const { mutateAsync: removeActionShippingMethod } = useDraftOrderRemoveActionShippingMethod(preview.id);
11830
- const onSubmit = async () => {
11831
- setIsSubmitting(true);
11832
- let requestSucceeded = false;
11833
- await requestOrderEdit(void 0, {
11834
- onError: (e) => {
11835
- ui.toast.error(`Failed to request order edit: ${e.message}`);
11836
- },
11837
- onSuccess: () => {
11838
- requestSucceeded = true;
11444
+ onSuccess: () => {
11445
+ requestSucceeded = true;
11839
11446
  }
11840
11447
  });
11841
11448
  if (!requestSucceeded) {
@@ -12569,48 +12176,251 @@ const CustomAmountField = ({
12569
12176
  }
12570
12177
  );
12571
12178
  };
12572
- const TransferOwnership = () => {
12179
+ const ShippingAddress = () => {
12573
12180
  const { id } = reactRouterDom.useParams();
12574
- const { draft_order, isPending, isError, error } = useDraftOrder(id, {
12575
- fields: "id,customer_id,customer.*"
12181
+ const { order, isPending, isError, error } = useOrder(id, {
12182
+ fields: "+shipping_address"
12576
12183
  });
12577
12184
  if (isError) {
12578
12185
  throw error;
12579
12186
  }
12580
- const isReady = !isPending && !!draft_order;
12187
+ const isReady = !isPending && !!order;
12581
12188
  return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
12582
12189
  /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
12583
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Transfer Ownership" }) }),
12584
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Transfer the ownership of this draft order to a new customer" }) })
12190
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Shipping Address" }) }),
12191
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit the shipping address for the draft order" }) })
12585
12192
  ] }),
12586
- isReady && /* @__PURE__ */ jsxRuntime.jsx(TransferOwnershipForm, { order: draft_order })
12193
+ isReady && /* @__PURE__ */ jsxRuntime.jsx(ShippingAddressForm, { order })
12587
12194
  ] });
12588
12195
  };
12589
- const TransferOwnershipForm = ({ order }) => {
12590
- var _a, _b;
12196
+ const ShippingAddressForm = ({ order }) => {
12197
+ var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
12591
12198
  const form = reactHookForm.useForm({
12592
12199
  defaultValues: {
12593
- customer_id: order.customer_id || ""
12200
+ first_name: ((_a = order.shipping_address) == null ? void 0 : _a.first_name) ?? "",
12201
+ last_name: ((_b = order.shipping_address) == null ? void 0 : _b.last_name) ?? "",
12202
+ company: ((_c = order.shipping_address) == null ? void 0 : _c.company) ?? "",
12203
+ address_1: ((_d = order.shipping_address) == null ? void 0 : _d.address_1) ?? "",
12204
+ address_2: ((_e = order.shipping_address) == null ? void 0 : _e.address_2) ?? "",
12205
+ city: ((_f = order.shipping_address) == null ? void 0 : _f.city) ?? "",
12206
+ province: ((_g = order.shipping_address) == null ? void 0 : _g.province) ?? "",
12207
+ country_code: ((_h = order.shipping_address) == null ? void 0 : _h.country_code) ?? "",
12208
+ postal_code: ((_i = order.shipping_address) == null ? void 0 : _i.postal_code) ?? "",
12209
+ phone: ((_j = order.shipping_address) == null ? void 0 : _j.phone) ?? ""
12594
12210
  },
12595
- resolver: zod.zodResolver(schema)
12211
+ resolver: zod.zodResolver(schema$2)
12596
12212
  });
12597
12213
  const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
12598
12214
  const { handleSuccess } = useRouteModal();
12599
- const name = [(_a = order.customer) == null ? void 0 : _a.first_name, (_b = order.customer) == null ? void 0 : _b.last_name].filter(Boolean).join(" ");
12600
- const currentCustomer = order.customer ? {
12601
- label: name ? `${name} (${order.customer.email})` : order.customer.email,
12602
- value: order.customer.id
12603
- } : null;
12604
12215
  const onSubmit = form.handleSubmit(async (data) => {
12605
12216
  await mutateAsync(
12606
- { customer_id: data.customer_id },
12607
12217
  {
12608
- onSuccess: () => {
12609
- ui.toast.success("Customer updated");
12610
- handleSuccess();
12611
- },
12612
- onError: (error) => {
12613
- ui.toast.error(error.message);
12218
+ shipping_address: {
12219
+ first_name: data.first_name,
12220
+ last_name: data.last_name,
12221
+ company: data.company,
12222
+ address_1: data.address_1,
12223
+ address_2: data.address_2,
12224
+ city: data.city,
12225
+ province: data.province,
12226
+ country_code: data.country_code,
12227
+ postal_code: data.postal_code,
12228
+ phone: data.phone
12229
+ }
12230
+ },
12231
+ {
12232
+ onSuccess: () => {
12233
+ handleSuccess();
12234
+ },
12235
+ onError: (error) => {
12236
+ ui.toast.error(error.message);
12237
+ }
12238
+ }
12239
+ );
12240
+ });
12241
+ return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
12242
+ KeyboundForm,
12243
+ {
12244
+ className: "flex flex-1 flex-col overflow-hidden",
12245
+ onSubmit,
12246
+ children: [
12247
+ /* @__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: [
12248
+ /* @__PURE__ */ jsxRuntime.jsx(
12249
+ Form$2.Field,
12250
+ {
12251
+ control: form.control,
12252
+ name: "country_code",
12253
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12254
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Country" }),
12255
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(CountrySelect, { ...field }) }),
12256
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12257
+ ] })
12258
+ }
12259
+ ),
12260
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
12261
+ /* @__PURE__ */ jsxRuntime.jsx(
12262
+ Form$2.Field,
12263
+ {
12264
+ control: form.control,
12265
+ name: "first_name",
12266
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12267
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "First name" }),
12268
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12269
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12270
+ ] })
12271
+ }
12272
+ ),
12273
+ /* @__PURE__ */ jsxRuntime.jsx(
12274
+ Form$2.Field,
12275
+ {
12276
+ control: form.control,
12277
+ name: "last_name",
12278
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12279
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Last name" }),
12280
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12281
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12282
+ ] })
12283
+ }
12284
+ )
12285
+ ] }),
12286
+ /* @__PURE__ */ jsxRuntime.jsx(
12287
+ Form$2.Field,
12288
+ {
12289
+ control: form.control,
12290
+ name: "company",
12291
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12292
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Company" }),
12293
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12294
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12295
+ ] })
12296
+ }
12297
+ ),
12298
+ /* @__PURE__ */ jsxRuntime.jsx(
12299
+ Form$2.Field,
12300
+ {
12301
+ control: form.control,
12302
+ name: "address_1",
12303
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12304
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Address" }),
12305
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12306
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12307
+ ] })
12308
+ }
12309
+ ),
12310
+ /* @__PURE__ */ jsxRuntime.jsx(
12311
+ Form$2.Field,
12312
+ {
12313
+ control: form.control,
12314
+ name: "address_2",
12315
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12316
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Apartment, suite, etc." }),
12317
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12318
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12319
+ ] })
12320
+ }
12321
+ ),
12322
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
12323
+ /* @__PURE__ */ jsxRuntime.jsx(
12324
+ Form$2.Field,
12325
+ {
12326
+ control: form.control,
12327
+ name: "postal_code",
12328
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12329
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Postal code" }),
12330
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12331
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12332
+ ] })
12333
+ }
12334
+ ),
12335
+ /* @__PURE__ */ jsxRuntime.jsx(
12336
+ Form$2.Field,
12337
+ {
12338
+ control: form.control,
12339
+ name: "city",
12340
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12341
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "City" }),
12342
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12343
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12344
+ ] })
12345
+ }
12346
+ )
12347
+ ] }),
12348
+ /* @__PURE__ */ jsxRuntime.jsx(
12349
+ Form$2.Field,
12350
+ {
12351
+ control: form.control,
12352
+ name: "province",
12353
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12354
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Province / State" }),
12355
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12356
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12357
+ ] })
12358
+ }
12359
+ ),
12360
+ /* @__PURE__ */ jsxRuntime.jsx(
12361
+ Form$2.Field,
12362
+ {
12363
+ control: form.control,
12364
+ name: "phone",
12365
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12366
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Phone" }),
12367
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12368
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12369
+ ] })
12370
+ }
12371
+ )
12372
+ ] }) }),
12373
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
12374
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
12375
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
12376
+ ] }) })
12377
+ ]
12378
+ }
12379
+ ) });
12380
+ };
12381
+ const schema$2 = addressSchema;
12382
+ const TransferOwnership = () => {
12383
+ const { id } = reactRouterDom.useParams();
12384
+ const { draft_order, isPending, isError, error } = useDraftOrder(id, {
12385
+ fields: "id,customer_id,customer.*"
12386
+ });
12387
+ if (isError) {
12388
+ throw error;
12389
+ }
12390
+ const isReady = !isPending && !!draft_order;
12391
+ return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
12392
+ /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
12393
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Transfer Ownership" }) }),
12394
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Transfer the ownership of this draft order to a new customer" }) })
12395
+ ] }),
12396
+ isReady && /* @__PURE__ */ jsxRuntime.jsx(TransferOwnershipForm, { order: draft_order })
12397
+ ] });
12398
+ };
12399
+ const TransferOwnershipForm = ({ order }) => {
12400
+ var _a, _b;
12401
+ const form = reactHookForm.useForm({
12402
+ defaultValues: {
12403
+ customer_id: order.customer_id || ""
12404
+ },
12405
+ resolver: zod.zodResolver(schema$1)
12406
+ });
12407
+ const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
12408
+ const { handleSuccess } = useRouteModal();
12409
+ const name = [(_a = order.customer) == null ? void 0 : _a.first_name, (_b = order.customer) == null ? void 0 : _b.last_name].filter(Boolean).join(" ");
12410
+ const currentCustomer = order.customer ? {
12411
+ label: name ? `${name} (${order.customer.email})` : order.customer.email,
12412
+ value: order.customer.id
12413
+ } : null;
12414
+ const onSubmit = form.handleSubmit(async (data) => {
12415
+ await mutateAsync(
12416
+ { customer_id: data.customer_id },
12417
+ {
12418
+ onSuccess: () => {
12419
+ ui.toast.success("Customer updated");
12420
+ handleSuccess();
12421
+ },
12422
+ onError: (error) => {
12423
+ ui.toast.error(error.message);
12614
12424
  }
12615
12425
  }
12616
12426
  );
@@ -13042,9 +12852,199 @@ const Illustration = () => {
13042
12852
  }
13043
12853
  );
13044
12854
  };
13045
- const schema = objectType({
12855
+ const schema$1 = objectType({
13046
12856
  customer_id: stringType().min(1)
13047
12857
  });
12858
+ const BillingAddress = () => {
12859
+ const { id } = reactRouterDom.useParams();
12860
+ const { order, isPending, isError, error } = useOrder(id, {
12861
+ fields: "+billing_address"
12862
+ });
12863
+ if (isError) {
12864
+ throw error;
12865
+ }
12866
+ const isReady = !isPending && !!order;
12867
+ return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
12868
+ /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
12869
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Billing Address" }) }),
12870
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit the billing address for the draft order" }) })
12871
+ ] }),
12872
+ isReady && /* @__PURE__ */ jsxRuntime.jsx(BillingAddressForm, { order })
12873
+ ] });
12874
+ };
12875
+ const BillingAddressForm = ({ order }) => {
12876
+ var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
12877
+ const form = reactHookForm.useForm({
12878
+ defaultValues: {
12879
+ first_name: ((_a = order.billing_address) == null ? void 0 : _a.first_name) ?? "",
12880
+ last_name: ((_b = order.billing_address) == null ? void 0 : _b.last_name) ?? "",
12881
+ company: ((_c = order.billing_address) == null ? void 0 : _c.company) ?? "",
12882
+ address_1: ((_d = order.billing_address) == null ? void 0 : _d.address_1) ?? "",
12883
+ address_2: ((_e = order.billing_address) == null ? void 0 : _e.address_2) ?? "",
12884
+ city: ((_f = order.billing_address) == null ? void 0 : _f.city) ?? "",
12885
+ province: ((_g = order.billing_address) == null ? void 0 : _g.province) ?? "",
12886
+ country_code: ((_h = order.billing_address) == null ? void 0 : _h.country_code) ?? "",
12887
+ postal_code: ((_i = order.billing_address) == null ? void 0 : _i.postal_code) ?? "",
12888
+ phone: ((_j = order.billing_address) == null ? void 0 : _j.phone) ?? ""
12889
+ },
12890
+ resolver: zod.zodResolver(schema)
12891
+ });
12892
+ const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
12893
+ const { handleSuccess } = useRouteModal();
12894
+ const onSubmit = form.handleSubmit(async (data) => {
12895
+ await mutateAsync(
12896
+ { billing_address: data },
12897
+ {
12898
+ onSuccess: () => {
12899
+ handleSuccess();
12900
+ },
12901
+ onError: (error) => {
12902
+ ui.toast.error(error.message);
12903
+ }
12904
+ }
12905
+ );
12906
+ });
12907
+ return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
12908
+ KeyboundForm,
12909
+ {
12910
+ className: "flex flex-1 flex-col overflow-hidden",
12911
+ onSubmit,
12912
+ children: [
12913
+ /* @__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: [
12914
+ /* @__PURE__ */ jsxRuntime.jsx(
12915
+ Form$2.Field,
12916
+ {
12917
+ control: form.control,
12918
+ name: "country_code",
12919
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12920
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Country" }),
12921
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(CountrySelect, { ...field }) }),
12922
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12923
+ ] })
12924
+ }
12925
+ ),
12926
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
12927
+ /* @__PURE__ */ jsxRuntime.jsx(
12928
+ Form$2.Field,
12929
+ {
12930
+ control: form.control,
12931
+ name: "first_name",
12932
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12933
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "First name" }),
12934
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12935
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12936
+ ] })
12937
+ }
12938
+ ),
12939
+ /* @__PURE__ */ jsxRuntime.jsx(
12940
+ Form$2.Field,
12941
+ {
12942
+ control: form.control,
12943
+ name: "last_name",
12944
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12945
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Last name" }),
12946
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12947
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12948
+ ] })
12949
+ }
12950
+ )
12951
+ ] }),
12952
+ /* @__PURE__ */ jsxRuntime.jsx(
12953
+ Form$2.Field,
12954
+ {
12955
+ control: form.control,
12956
+ name: "company",
12957
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12958
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Company" }),
12959
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12960
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12961
+ ] })
12962
+ }
12963
+ ),
12964
+ /* @__PURE__ */ jsxRuntime.jsx(
12965
+ Form$2.Field,
12966
+ {
12967
+ control: form.control,
12968
+ name: "address_1",
12969
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12970
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Address" }),
12971
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12972
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12973
+ ] })
12974
+ }
12975
+ ),
12976
+ /* @__PURE__ */ jsxRuntime.jsx(
12977
+ Form$2.Field,
12978
+ {
12979
+ control: form.control,
12980
+ name: "address_2",
12981
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12982
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Apartment, suite, etc." }),
12983
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12984
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12985
+ ] })
12986
+ }
12987
+ ),
12988
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
12989
+ /* @__PURE__ */ jsxRuntime.jsx(
12990
+ Form$2.Field,
12991
+ {
12992
+ control: form.control,
12993
+ name: "postal_code",
12994
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12995
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Postal code" }),
12996
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12997
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12998
+ ] })
12999
+ }
13000
+ ),
13001
+ /* @__PURE__ */ jsxRuntime.jsx(
13002
+ Form$2.Field,
13003
+ {
13004
+ control: form.control,
13005
+ name: "city",
13006
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
13007
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "City" }),
13008
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
13009
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
13010
+ ] })
13011
+ }
13012
+ )
13013
+ ] }),
13014
+ /* @__PURE__ */ jsxRuntime.jsx(
13015
+ Form$2.Field,
13016
+ {
13017
+ control: form.control,
13018
+ name: "province",
13019
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
13020
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Province / State" }),
13021
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
13022
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
13023
+ ] })
13024
+ }
13025
+ ),
13026
+ /* @__PURE__ */ jsxRuntime.jsx(
13027
+ Form$2.Field,
13028
+ {
13029
+ control: form.control,
13030
+ name: "phone",
13031
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
13032
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Phone" }),
13033
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
13034
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
13035
+ ] })
13036
+ }
13037
+ )
13038
+ ] }) }),
13039
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
13040
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
13041
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
13042
+ ] }) })
13043
+ ]
13044
+ }
13045
+ ) });
13046
+ };
13047
+ const schema = addressSchema;
13048
13048
  const widgetModule = { widgets: [] };
13049
13049
  const routeModule = {
13050
13050
  routes: [
@@ -13066,24 +13066,20 @@ const routeModule = {
13066
13066
  loader,
13067
13067
  children: [
13068
13068
  {
13069
- Component: BillingAddress,
13070
- path: "/draft-orders/:id/billing-address"
13071
- },
13072
- {
13073
- Component: Items,
13074
- path: "/draft-orders/:id/items"
13069
+ Component: CustomItems,
13070
+ path: "/draft-orders/:id/custom-items"
13075
13071
  },
13076
13072
  {
13077
13073
  Component: Email,
13078
13074
  path: "/draft-orders/:id/email"
13079
13075
  },
13080
13076
  {
13081
- Component: Metadata,
13082
- path: "/draft-orders/:id/metadata"
13077
+ Component: Items,
13078
+ path: "/draft-orders/:id/items"
13083
13079
  },
13084
13080
  {
13085
- Component: CustomItems,
13086
- path: "/draft-orders/:id/custom-items"
13081
+ Component: Metadata,
13082
+ path: "/draft-orders/:id/metadata"
13087
13083
  },
13088
13084
  {
13089
13085
  Component: Promotions,
@@ -13093,17 +13089,21 @@ const routeModule = {
13093
13089
  Component: SalesChannel,
13094
13090
  path: "/draft-orders/:id/sales-channel"
13095
13091
  },
13096
- {
13097
- Component: ShippingAddress,
13098
- path: "/draft-orders/:id/shipping-address"
13099
- },
13100
13092
  {
13101
13093
  Component: Shipping,
13102
13094
  path: "/draft-orders/:id/shipping"
13103
13095
  },
13096
+ {
13097
+ Component: ShippingAddress,
13098
+ path: "/draft-orders/:id/shipping-address"
13099
+ },
13104
13100
  {
13105
13101
  Component: TransferOwnership,
13106
13102
  path: "/draft-orders/:id/transfer-ownership"
13103
+ },
13104
+ {
13105
+ Component: BillingAddress,
13106
+ path: "/draft-orders/:id/billing-address"
13107
13107
  }
13108
13108
  ]
13109
13109
  }