@medusajs/draft-order 2.12.2-preview-20251205000306 → 2.12.2-preview-20251205060136

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.
@@ -9783,74 +9783,6 @@ const CustomItemsForm = () => {
9783
9783
  const schema$4 = objectType({
9784
9784
  email: stringType().email()
9785
9785
  });
9786
- const Email = () => {
9787
- const { id } = reactRouterDom.useParams();
9788
- const { order, isPending, isError, error } = useOrder(id, {
9789
- fields: "+email"
9790
- });
9791
- if (isError) {
9792
- throw error;
9793
- }
9794
- const isReady = !isPending && !!order;
9795
- return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
9796
- /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
9797
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Email" }) }),
9798
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit the email for the draft order" }) })
9799
- ] }),
9800
- isReady && /* @__PURE__ */ jsxRuntime.jsx(EmailForm, { order })
9801
- ] });
9802
- };
9803
- const EmailForm = ({ order }) => {
9804
- const form = reactHookForm.useForm({
9805
- defaultValues: {
9806
- email: order.email ?? ""
9807
- },
9808
- resolver: zod.zodResolver(schema$3)
9809
- });
9810
- const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
9811
- const { handleSuccess } = useRouteModal();
9812
- const onSubmit = form.handleSubmit(async (data) => {
9813
- await mutateAsync(
9814
- { email: data.email },
9815
- {
9816
- onSuccess: () => {
9817
- handleSuccess();
9818
- },
9819
- onError: (error) => {
9820
- ui.toast.error(error.message);
9821
- }
9822
- }
9823
- );
9824
- });
9825
- return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
9826
- KeyboundForm,
9827
- {
9828
- className: "flex flex-1 flex-col overflow-hidden",
9829
- onSubmit,
9830
- children: [
9831
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsx(
9832
- Form$2.Field,
9833
- {
9834
- control: form.control,
9835
- name: "email",
9836
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9837
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Email" }),
9838
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9839
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9840
- ] })
9841
- }
9842
- ) }),
9843
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
9844
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
9845
- /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
9846
- ] }) })
9847
- ]
9848
- }
9849
- ) });
9850
- };
9851
- const schema$3 = objectType({
9852
- email: stringType().email()
9853
- });
9854
9786
  const NumberInput = React.forwardRef(
9855
9787
  ({
9856
9788
  value,
@@ -11452,6 +11384,74 @@ function getPromotionIds(items, shippingMethods) {
11452
11384
  }
11453
11385
  return Array.from(promotionIds);
11454
11386
  }
11387
+ const Email = () => {
11388
+ const { id } = reactRouterDom.useParams();
11389
+ const { order, isPending, isError, error } = useOrder(id, {
11390
+ fields: "+email"
11391
+ });
11392
+ if (isError) {
11393
+ throw error;
11394
+ }
11395
+ const isReady = !isPending && !!order;
11396
+ return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
11397
+ /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
11398
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Email" }) }),
11399
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit the email for the draft order" }) })
11400
+ ] }),
11401
+ isReady && /* @__PURE__ */ jsxRuntime.jsx(EmailForm, { order })
11402
+ ] });
11403
+ };
11404
+ const EmailForm = ({ order }) => {
11405
+ const form = reactHookForm.useForm({
11406
+ defaultValues: {
11407
+ email: order.email ?? ""
11408
+ },
11409
+ resolver: zod.zodResolver(schema$3)
11410
+ });
11411
+ const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
11412
+ const { handleSuccess } = useRouteModal();
11413
+ const onSubmit = form.handleSubmit(async (data) => {
11414
+ await mutateAsync(
11415
+ { email: data.email },
11416
+ {
11417
+ onSuccess: () => {
11418
+ handleSuccess();
11419
+ },
11420
+ onError: (error) => {
11421
+ ui.toast.error(error.message);
11422
+ }
11423
+ }
11424
+ );
11425
+ });
11426
+ return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
11427
+ KeyboundForm,
11428
+ {
11429
+ className: "flex flex-1 flex-col overflow-hidden",
11430
+ onSubmit,
11431
+ children: [
11432
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsx(
11433
+ Form$2.Field,
11434
+ {
11435
+ control: form.control,
11436
+ name: "email",
11437
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11438
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Email" }),
11439
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11440
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11441
+ ] })
11442
+ }
11443
+ ) }),
11444
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
11445
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
11446
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
11447
+ ] }) })
11448
+ ]
11449
+ }
11450
+ ) });
11451
+ };
11452
+ const schema$3 = objectType({
11453
+ email: stringType().email()
11454
+ });
11455
11455
  const SalesChannel = () => {
11456
11456
  const { id } = reactRouterDom.useParams();
11457
11457
  const { draft_order, isPending, isError, error } = useDraftOrder(
@@ -11558,283 +11558,80 @@ const SalesChannelField = ({ control, order }) => {
11558
11558
  const schema$2 = objectType({
11559
11559
  sales_channel_id: stringType().min(1)
11560
11560
  });
11561
- const ShippingAddress = () => {
11561
+ const STACKED_FOCUS_MODAL_ID = "shipping-form";
11562
+ const Shipping = () => {
11563
+ var _a;
11562
11564
  const { id } = reactRouterDom.useParams();
11563
11565
  const { order, isPending, isError, error } = useOrder(id, {
11564
- fields: "+shipping_address"
11566
+ fields: "+items.*,+items.variant.*,+items.variant.product.*,+items.variant.product.shipping_profile.*,+currency_code"
11565
11567
  });
11568
+ const {
11569
+ order: preview,
11570
+ isPending: isPreviewPending,
11571
+ isError: isPreviewError,
11572
+ error: previewError
11573
+ } = useOrderPreview(id);
11574
+ useInitiateOrderEdit({ preview });
11575
+ const { onCancel } = useCancelOrderEdit({ preview });
11566
11576
  if (isError) {
11567
11577
  throw error;
11568
11578
  }
11569
- const isReady = !isPending && !!order;
11570
- return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
11571
- /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
11572
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Shipping Address" }) }),
11573
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit the shipping address for the draft order" }) })
11574
- ] }),
11575
- isReady && /* @__PURE__ */ jsxRuntime.jsx(ShippingAddressForm, { order })
11576
- ] });
11579
+ if (isPreviewError) {
11580
+ throw previewError;
11581
+ }
11582
+ const orderHasItems = (((_a = order == null ? void 0 : order.items) == null ? void 0 : _a.length) || 0) > 0;
11583
+ const isReady = preview && !isPreviewPending && order && !isPending;
11584
+ return /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal, { onClose: onCancel, children: !orderHasItems ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex h-full flex-col overflow-hidden ", children: [
11585
+ /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Header, {}),
11586
+ /* @__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 px-6 py-16", children: [
11587
+ /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Shipping" }) }),
11588
+ /* @__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." }) })
11589
+ ] }) }) }),
11590
+ /* @__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" }) }) })
11591
+ ] }) : isReady ? /* @__PURE__ */ jsxRuntime.jsx(ShippingForm, { preview, order }) : /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
11592
+ /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit Shipping" }) }),
11593
+ /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Loading data for the draft order, please wait..." }) })
11594
+ ] }) });
11577
11595
  };
11578
- const ShippingAddressForm = ({ order }) => {
11579
- var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
11580
- const form = reactHookForm.useForm({
11581
- defaultValues: {
11582
- first_name: ((_a = order.shipping_address) == null ? void 0 : _a.first_name) ?? "",
11583
- last_name: ((_b = order.shipping_address) == null ? void 0 : _b.last_name) ?? "",
11584
- company: ((_c = order.shipping_address) == null ? void 0 : _c.company) ?? "",
11585
- address_1: ((_d = order.shipping_address) == null ? void 0 : _d.address_1) ?? "",
11586
- address_2: ((_e = order.shipping_address) == null ? void 0 : _e.address_2) ?? "",
11587
- city: ((_f = order.shipping_address) == null ? void 0 : _f.city) ?? "",
11588
- province: ((_g = order.shipping_address) == null ? void 0 : _g.province) ?? "",
11589
- country_code: ((_h = order.shipping_address) == null ? void 0 : _h.country_code) ?? "",
11590
- postal_code: ((_i = order.shipping_address) == null ? void 0 : _i.postal_code) ?? "",
11591
- phone: ((_j = order.shipping_address) == null ? void 0 : _j.phone) ?? ""
11596
+ const ShippingForm = ({ preview, order }) => {
11597
+ var _a;
11598
+ const { setIsOpen } = useStackedModal();
11599
+ const [isSubmitting, setIsSubmitting] = React.useState(false);
11600
+ const [data, setData] = React.useState(null);
11601
+ const appliedShippingOptionIds = (_a = preview.shipping_methods) == null ? void 0 : _a.map((method) => method.shipping_option_id).filter(Boolean);
11602
+ const { shipping_options } = useShippingOptions(
11603
+ {
11604
+ id: appliedShippingOptionIds,
11605
+ fields: "+service_zone.*,+service_zone.fulfillment_set.*,+service_zone.fulfillment_set.location.*"
11592
11606
  },
11593
- resolver: zod.zodResolver(schema$1)
11594
- });
11595
- const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
11607
+ {
11608
+ enabled: appliedShippingOptionIds.length > 0
11609
+ }
11610
+ );
11611
+ const uniqueShippingProfiles = React.useMemo(() => {
11612
+ const profiles = /* @__PURE__ */ new Map();
11613
+ getUniqueShippingProfiles(order.items).forEach((profile) => {
11614
+ profiles.set(profile.id, profile);
11615
+ });
11616
+ shipping_options == null ? void 0 : shipping_options.forEach((option) => {
11617
+ profiles.set(option.shipping_profile_id, option.shipping_profile);
11618
+ });
11619
+ return Array.from(profiles.values());
11620
+ }, [order.items, shipping_options]);
11596
11621
  const { handleSuccess } = useRouteModal();
11597
- const onSubmit = form.handleSubmit(async (data) => {
11598
- await mutateAsync(
11599
- {
11600
- shipping_address: {
11601
- first_name: data.first_name,
11602
- last_name: data.last_name,
11603
- company: data.company,
11604
- address_1: data.address_1,
11605
- address_2: data.address_2,
11606
- city: data.city,
11607
- province: data.province,
11608
- country_code: data.country_code,
11609
- postal_code: data.postal_code,
11610
- phone: data.phone
11611
- }
11622
+ const { mutateAsync: confirmOrderEdit } = useDraftOrderConfirmEdit(preview.id);
11623
+ const { mutateAsync: requestOrderEdit } = useDraftOrderRequestEdit(preview.id);
11624
+ const { mutateAsync: removeShippingMethod } = useDraftOrderRemoveShippingMethod(preview.id);
11625
+ const { mutateAsync: removeActionShippingMethod } = useDraftOrderRemoveActionShippingMethod(preview.id);
11626
+ const onSubmit = async () => {
11627
+ setIsSubmitting(true);
11628
+ let requestSucceeded = false;
11629
+ await requestOrderEdit(void 0, {
11630
+ onError: (e) => {
11631
+ ui.toast.error(`Failed to request order edit: ${e.message}`);
11612
11632
  },
11613
- {
11614
- onSuccess: () => {
11615
- handleSuccess();
11616
- },
11617
- onError: (error) => {
11618
- ui.toast.error(error.message);
11619
- }
11620
- }
11621
- );
11622
- });
11623
- return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
11624
- KeyboundForm,
11625
- {
11626
- className: "flex flex-1 flex-col overflow-hidden",
11627
- onSubmit,
11628
- children: [
11629
- /* @__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: [
11630
- /* @__PURE__ */ jsxRuntime.jsx(
11631
- Form$2.Field,
11632
- {
11633
- control: form.control,
11634
- name: "country_code",
11635
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11636
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Country" }),
11637
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(CountrySelect, { ...field }) }),
11638
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11639
- ] })
11640
- }
11641
- ),
11642
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
11643
- /* @__PURE__ */ jsxRuntime.jsx(
11644
- Form$2.Field,
11645
- {
11646
- control: form.control,
11647
- name: "first_name",
11648
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11649
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "First name" }),
11650
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11651
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11652
- ] })
11653
- }
11654
- ),
11655
- /* @__PURE__ */ jsxRuntime.jsx(
11656
- Form$2.Field,
11657
- {
11658
- control: form.control,
11659
- name: "last_name",
11660
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11661
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Last name" }),
11662
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11663
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11664
- ] })
11665
- }
11666
- )
11667
- ] }),
11668
- /* @__PURE__ */ jsxRuntime.jsx(
11669
- Form$2.Field,
11670
- {
11671
- control: form.control,
11672
- name: "company",
11673
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11674
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Company" }),
11675
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11676
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11677
- ] })
11678
- }
11679
- ),
11680
- /* @__PURE__ */ jsxRuntime.jsx(
11681
- Form$2.Field,
11682
- {
11683
- control: form.control,
11684
- name: "address_1",
11685
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11686
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Address" }),
11687
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11688
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11689
- ] })
11690
- }
11691
- ),
11692
- /* @__PURE__ */ jsxRuntime.jsx(
11693
- Form$2.Field,
11694
- {
11695
- control: form.control,
11696
- name: "address_2",
11697
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11698
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Apartment, suite, etc." }),
11699
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11700
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11701
- ] })
11702
- }
11703
- ),
11704
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
11705
- /* @__PURE__ */ jsxRuntime.jsx(
11706
- Form$2.Field,
11707
- {
11708
- control: form.control,
11709
- name: "postal_code",
11710
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11711
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Postal code" }),
11712
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11713
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11714
- ] })
11715
- }
11716
- ),
11717
- /* @__PURE__ */ jsxRuntime.jsx(
11718
- Form$2.Field,
11719
- {
11720
- control: form.control,
11721
- name: "city",
11722
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11723
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "City" }),
11724
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11725
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11726
- ] })
11727
- }
11728
- )
11729
- ] }),
11730
- /* @__PURE__ */ jsxRuntime.jsx(
11731
- Form$2.Field,
11732
- {
11733
- control: form.control,
11734
- name: "province",
11735
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11736
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Province / State" }),
11737
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11738
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11739
- ] })
11740
- }
11741
- ),
11742
- /* @__PURE__ */ jsxRuntime.jsx(
11743
- Form$2.Field,
11744
- {
11745
- control: form.control,
11746
- name: "phone",
11747
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11748
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Phone" }),
11749
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11750
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11751
- ] })
11752
- }
11753
- )
11754
- ] }) }),
11755
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
11756
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
11757
- /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
11758
- ] }) })
11759
- ]
11760
- }
11761
- ) });
11762
- };
11763
- const schema$1 = addressSchema;
11764
- const STACKED_FOCUS_MODAL_ID = "shipping-form";
11765
- const Shipping = () => {
11766
- var _a;
11767
- const { id } = reactRouterDom.useParams();
11768
- const { order, isPending, isError, error } = useOrder(id, {
11769
- fields: "+items.*,+items.variant.*,+items.variant.product.*,+items.variant.product.shipping_profile.*,+currency_code"
11770
- });
11771
- const {
11772
- order: preview,
11773
- isPending: isPreviewPending,
11774
- isError: isPreviewError,
11775
- error: previewError
11776
- } = useOrderPreview(id);
11777
- useInitiateOrderEdit({ preview });
11778
- const { onCancel } = useCancelOrderEdit({ preview });
11779
- if (isError) {
11780
- throw error;
11781
- }
11782
- if (isPreviewError) {
11783
- throw previewError;
11784
- }
11785
- const orderHasItems = (((_a = order == null ? void 0 : order.items) == null ? void 0 : _a.length) || 0) > 0;
11786
- const isReady = preview && !isPreviewPending && order && !isPending;
11787
- return /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal, { onClose: onCancel, children: !orderHasItems ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex h-full flex-col overflow-hidden ", children: [
11788
- /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Header, {}),
11789
- /* @__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 px-6 py-16", children: [
11790
- /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Shipping" }) }),
11791
- /* @__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." }) })
11792
- ] }) }) }),
11793
- /* @__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" }) }) })
11794
- ] }) : isReady ? /* @__PURE__ */ jsxRuntime.jsx(ShippingForm, { preview, order }) : /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
11795
- /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit Shipping" }) }),
11796
- /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Loading data for the draft order, please wait..." }) })
11797
- ] }) });
11798
- };
11799
- const ShippingForm = ({ preview, order }) => {
11800
- var _a;
11801
- const { setIsOpen } = useStackedModal();
11802
- const [isSubmitting, setIsSubmitting] = React.useState(false);
11803
- const [data, setData] = React.useState(null);
11804
- const appliedShippingOptionIds = (_a = preview.shipping_methods) == null ? void 0 : _a.map((method) => method.shipping_option_id).filter(Boolean);
11805
- const { shipping_options } = useShippingOptions(
11806
- {
11807
- id: appliedShippingOptionIds,
11808
- fields: "+service_zone.*,+service_zone.fulfillment_set.*,+service_zone.fulfillment_set.location.*"
11809
- },
11810
- {
11811
- enabled: appliedShippingOptionIds.length > 0
11812
- }
11813
- );
11814
- const uniqueShippingProfiles = React.useMemo(() => {
11815
- const profiles = /* @__PURE__ */ new Map();
11816
- getUniqueShippingProfiles(order.items).forEach((profile) => {
11817
- profiles.set(profile.id, profile);
11818
- });
11819
- shipping_options == null ? void 0 : shipping_options.forEach((option) => {
11820
- profiles.set(option.shipping_profile_id, option.shipping_profile);
11821
- });
11822
- return Array.from(profiles.values());
11823
- }, [order.items, shipping_options]);
11824
- const { handleSuccess } = useRouteModal();
11825
- const { mutateAsync: confirmOrderEdit } = useDraftOrderConfirmEdit(preview.id);
11826
- const { mutateAsync: requestOrderEdit } = useDraftOrderRequestEdit(preview.id);
11827
- const { mutateAsync: removeShippingMethod } = useDraftOrderRemoveShippingMethod(preview.id);
11828
- const { mutateAsync: removeActionShippingMethod } = useDraftOrderRemoveActionShippingMethod(preview.id);
11829
- const onSubmit = async () => {
11830
- setIsSubmitting(true);
11831
- let requestSucceeded = false;
11832
- await requestOrderEdit(void 0, {
11833
- onError: (e) => {
11834
- ui.toast.error(`Failed to request order edit: ${e.message}`);
11835
- },
11836
- onSuccess: () => {
11837
- requestSucceeded = true;
11633
+ onSuccess: () => {
11634
+ requestSucceeded = true;
11838
11635
  }
11839
11636
  });
11840
11637
  if (!requestSucceeded) {
@@ -12568,6 +12365,209 @@ const CustomAmountField = ({
12568
12365
  }
12569
12366
  );
12570
12367
  };
12368
+ const ShippingAddress = () => {
12369
+ const { id } = reactRouterDom.useParams();
12370
+ const { order, isPending, isError, error } = useOrder(id, {
12371
+ fields: "+shipping_address"
12372
+ });
12373
+ if (isError) {
12374
+ throw error;
12375
+ }
12376
+ const isReady = !isPending && !!order;
12377
+ return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
12378
+ /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
12379
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Shipping Address" }) }),
12380
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit the shipping address for the draft order" }) })
12381
+ ] }),
12382
+ isReady && /* @__PURE__ */ jsxRuntime.jsx(ShippingAddressForm, { order })
12383
+ ] });
12384
+ };
12385
+ const ShippingAddressForm = ({ order }) => {
12386
+ var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
12387
+ const form = reactHookForm.useForm({
12388
+ defaultValues: {
12389
+ first_name: ((_a = order.shipping_address) == null ? void 0 : _a.first_name) ?? "",
12390
+ last_name: ((_b = order.shipping_address) == null ? void 0 : _b.last_name) ?? "",
12391
+ company: ((_c = order.shipping_address) == null ? void 0 : _c.company) ?? "",
12392
+ address_1: ((_d = order.shipping_address) == null ? void 0 : _d.address_1) ?? "",
12393
+ address_2: ((_e = order.shipping_address) == null ? void 0 : _e.address_2) ?? "",
12394
+ city: ((_f = order.shipping_address) == null ? void 0 : _f.city) ?? "",
12395
+ province: ((_g = order.shipping_address) == null ? void 0 : _g.province) ?? "",
12396
+ country_code: ((_h = order.shipping_address) == null ? void 0 : _h.country_code) ?? "",
12397
+ postal_code: ((_i = order.shipping_address) == null ? void 0 : _i.postal_code) ?? "",
12398
+ phone: ((_j = order.shipping_address) == null ? void 0 : _j.phone) ?? ""
12399
+ },
12400
+ resolver: zod.zodResolver(schema$1)
12401
+ });
12402
+ const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
12403
+ const { handleSuccess } = useRouteModal();
12404
+ const onSubmit = form.handleSubmit(async (data) => {
12405
+ await mutateAsync(
12406
+ {
12407
+ shipping_address: {
12408
+ first_name: data.first_name,
12409
+ last_name: data.last_name,
12410
+ company: data.company,
12411
+ address_1: data.address_1,
12412
+ address_2: data.address_2,
12413
+ city: data.city,
12414
+ province: data.province,
12415
+ country_code: data.country_code,
12416
+ postal_code: data.postal_code,
12417
+ phone: data.phone
12418
+ }
12419
+ },
12420
+ {
12421
+ onSuccess: () => {
12422
+ handleSuccess();
12423
+ },
12424
+ onError: (error) => {
12425
+ ui.toast.error(error.message);
12426
+ }
12427
+ }
12428
+ );
12429
+ });
12430
+ return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
12431
+ KeyboundForm,
12432
+ {
12433
+ className: "flex flex-1 flex-col overflow-hidden",
12434
+ onSubmit,
12435
+ children: [
12436
+ /* @__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: [
12437
+ /* @__PURE__ */ jsxRuntime.jsx(
12438
+ Form$2.Field,
12439
+ {
12440
+ control: form.control,
12441
+ name: "country_code",
12442
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12443
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Country" }),
12444
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(CountrySelect, { ...field }) }),
12445
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12446
+ ] })
12447
+ }
12448
+ ),
12449
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
12450
+ /* @__PURE__ */ jsxRuntime.jsx(
12451
+ Form$2.Field,
12452
+ {
12453
+ control: form.control,
12454
+ name: "first_name",
12455
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12456
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "First name" }),
12457
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12458
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12459
+ ] })
12460
+ }
12461
+ ),
12462
+ /* @__PURE__ */ jsxRuntime.jsx(
12463
+ Form$2.Field,
12464
+ {
12465
+ control: form.control,
12466
+ name: "last_name",
12467
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12468
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Last name" }),
12469
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12470
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12471
+ ] })
12472
+ }
12473
+ )
12474
+ ] }),
12475
+ /* @__PURE__ */ jsxRuntime.jsx(
12476
+ Form$2.Field,
12477
+ {
12478
+ control: form.control,
12479
+ name: "company",
12480
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12481
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Company" }),
12482
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12483
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12484
+ ] })
12485
+ }
12486
+ ),
12487
+ /* @__PURE__ */ jsxRuntime.jsx(
12488
+ Form$2.Field,
12489
+ {
12490
+ control: form.control,
12491
+ name: "address_1",
12492
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12493
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Address" }),
12494
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12495
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12496
+ ] })
12497
+ }
12498
+ ),
12499
+ /* @__PURE__ */ jsxRuntime.jsx(
12500
+ Form$2.Field,
12501
+ {
12502
+ control: form.control,
12503
+ name: "address_2",
12504
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12505
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Apartment, suite, etc." }),
12506
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12507
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12508
+ ] })
12509
+ }
12510
+ ),
12511
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
12512
+ /* @__PURE__ */ jsxRuntime.jsx(
12513
+ Form$2.Field,
12514
+ {
12515
+ control: form.control,
12516
+ name: "postal_code",
12517
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12518
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Postal code" }),
12519
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12520
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12521
+ ] })
12522
+ }
12523
+ ),
12524
+ /* @__PURE__ */ jsxRuntime.jsx(
12525
+ Form$2.Field,
12526
+ {
12527
+ control: form.control,
12528
+ name: "city",
12529
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12530
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "City" }),
12531
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12532
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12533
+ ] })
12534
+ }
12535
+ )
12536
+ ] }),
12537
+ /* @__PURE__ */ jsxRuntime.jsx(
12538
+ Form$2.Field,
12539
+ {
12540
+ control: form.control,
12541
+ name: "province",
12542
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12543
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Province / State" }),
12544
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12545
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12546
+ ] })
12547
+ }
12548
+ ),
12549
+ /* @__PURE__ */ jsxRuntime.jsx(
12550
+ Form$2.Field,
12551
+ {
12552
+ control: form.control,
12553
+ name: "phone",
12554
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12555
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Phone" }),
12556
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12557
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12558
+ ] })
12559
+ }
12560
+ )
12561
+ ] }) }),
12562
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
12563
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
12564
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
12565
+ ] }) })
12566
+ ]
12567
+ }
12568
+ ) });
12569
+ };
12570
+ const schema$1 = addressSchema;
12571
12571
  const TransferOwnership = () => {
12572
12572
  const { id } = reactRouterDom.useParams();
12573
12573
  const { draft_order, isPending, isError, error } = useDraftOrder(id, {
@@ -13072,10 +13072,6 @@ const routeModule = {
13072
13072
  Component: CustomItems,
13073
13073
  path: "/draft-orders/:id/custom-items"
13074
13074
  },
13075
- {
13076
- Component: Email,
13077
- path: "/draft-orders/:id/email"
13078
- },
13079
13075
  {
13080
13076
  Component: Items,
13081
13077
  path: "/draft-orders/:id/items"
@@ -13089,17 +13085,21 @@ const routeModule = {
13089
13085
  path: "/draft-orders/:id/promotions"
13090
13086
  },
13091
13087
  {
13092
- Component: SalesChannel,
13093
- path: "/draft-orders/:id/sales-channel"
13088
+ Component: Email,
13089
+ path: "/draft-orders/:id/email"
13094
13090
  },
13095
13091
  {
13096
- Component: ShippingAddress,
13097
- path: "/draft-orders/:id/shipping-address"
13092
+ Component: SalesChannel,
13093
+ path: "/draft-orders/:id/sales-channel"
13098
13094
  },
13099
13095
  {
13100
13096
  Component: Shipping,
13101
13097
  path: "/draft-orders/:id/shipping"
13102
13098
  },
13099
+ {
13100
+ Component: ShippingAddress,
13101
+ path: "/draft-orders/:id/shipping-address"
13102
+ },
13103
13103
  {
13104
13104
  Component: TransferOwnership,
13105
13105
  path: "/draft-orders/:id/transfer-ownership"