@medusajs/draft-order 2.10.4-preview-20250929180201 → 2.10.4-preview-20250930000343

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/.medusa/server/src/admin/index.js +1246 -1246
  2. package/.medusa/server/src/admin/index.mjs +1246 -1246
  3. package/package.json +16 -16
package/.medusa/server/src/admin/index.js CHANGED
@@ -9573,6 +9573,196 @@ const ID = () => {
9573
9573
  /* @__PURE__ */ jsxRuntime.jsx(reactRouterDom.Outlet, {})
9574
9574
  ] });
9575
9575
  };
9576
+ const BillingAddress = () => {
9577
+ const { id } = reactRouterDom.useParams();
9578
+ const { order, isPending, isError, error } = useOrder(id, {
9579
+ fields: "+billing_address"
9580
+ });
9581
+ if (isError) {
9582
+ throw error;
9583
+ }
9584
+ const isReady = !isPending && !!order;
9585
+ return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
9586
+ /* @__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" }) })
9589
+ ] }),
9590
+ isReady && /* @__PURE__ */ jsxRuntime.jsx(BillingAddressForm, { order })
9591
+ ] });
9592
+ };
9593
+ const BillingAddressForm = ({ order }) => {
9594
+ var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
9595
+ const form = reactHookForm.useForm({
9596
+ 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) ?? ""
9607
+ },
9608
+ resolver: zod.zodResolver(schema$5)
9609
+ });
9610
+ const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
9611
+ const { handleSuccess } = useRouteModal();
9612
+ const onSubmit = form.handleSubmit(async (data) => {
9613
+ await mutateAsync(
9614
+ { billing_address: data },
9615
+ {
9616
+ onSuccess: () => {
9617
+ handleSuccess();
9618
+ },
9619
+ onError: (error) => {
9620
+ ui.toast.error(error.message);
9621
+ }
9622
+ }
9623
+ );
9624
+ });
9625
+ return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
9626
+ KeyboundForm,
9627
+ {
9628
+ className: "flex flex-1 flex-col overflow-hidden",
9629
+ onSubmit,
9630
+ 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
+ ] }) }),
9757
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
9758
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
9759
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
9760
+ ] }) })
9761
+ ]
9762
+ }
9763
+ ) });
9764
+ };
9765
+ const schema$5 = addressSchema;
9576
9766
  const CustomItems = () => {
9577
9767
  return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
9578
9768
  /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Header, { children: /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Custom Items" }) }) }),
@@ -9581,7 +9771,7 @@ const CustomItems = () => {
9581
9771
  };
9582
9772
  const CustomItemsForm = () => {
9583
9773
  const form = reactHookForm.useForm({
9584
- resolver: zod.zodResolver(schema$5)
9774
+ resolver: zod.zodResolver(schema$4)
9585
9775
  });
9586
9776
  return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(KeyboundForm, { className: "flex flex-1 flex-col", children: [
9587
9777
  /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, {}),
@@ -9591,7 +9781,7 @@ const CustomItemsForm = () => {
9591
9781
  ] }) })
9592
9782
  ] }) });
9593
9783
  };
9594
- const schema$5 = objectType({
9784
+ const schema$4 = objectType({
9595
9785
  email: stringType().email()
9596
9786
  });
9597
9787
  const Email = () => {
@@ -9616,7 +9806,7 @@ const EmailForm = ({ order }) => {
9616
9806
  defaultValues: {
9617
9807
  email: order.email ?? ""
9618
9808
  },
9619
- resolver: zod.zodResolver(schema$4)
9809
+ resolver: zod.zodResolver(schema$3)
9620
9810
  });
9621
9811
  const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
9622
9812
  const { handleSuccess } = useRouteModal();
@@ -9659,7 +9849,7 @@ const EmailForm = ({ order }) => {
9659
9849
  }
9660
9850
  ) });
9661
9851
  };
9662
- const schema$4 = objectType({
9852
+ const schema$3 = objectType({
9663
9853
  email: stringType().email()
9664
9854
  });
9665
9855
  const NumberInput = React.forwardRef(
@@ -11291,7 +11481,7 @@ const SalesChannelForm = ({ order }) => {
11291
11481
  defaultValues: {
11292
11482
  sales_channel_id: order.sales_channel_id || ""
11293
11483
  },
11294
- resolver: zod.zodResolver(schema$3)
11484
+ resolver: zod.zodResolver(schema$2)
11295
11485
  });
11296
11486
  const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
11297
11487
  const { handleSuccess } = useRouteModal();
@@ -11366,1154 +11556,347 @@ const SalesChannelField = ({ control, order }) => {
11366
11556
  }
11367
11557
  );
11368
11558
  };
11369
- const schema$3 = objectType({
11559
+ const schema$2 = objectType({
11370
11560
  sales_channel_id: stringType().min(1)
11371
11561
  });
11372
- const STACKED_FOCUS_MODAL_ID = "shipping-form";
11373
- const Shipping = () => {
11374
- var _a;
11562
+ const ShippingAddress = () => {
11375
11563
  const { id } = reactRouterDom.useParams();
11376
11564
  const { order, isPending, isError, error } = useOrder(id, {
11377
- fields: "+items.*,+items.variant.*,+items.variant.product.*,+items.variant.product.shipping_profile.*,+currency_code"
11565
+ fields: "+shipping_address"
11378
11566
  });
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 });
11387
11567
  if (isError) {
11388
11568
  throw error;
11389
11569
  }
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
- ] }) });
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
+ ] });
11406
11578
  };
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.*"
11417
- },
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]);
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) ?? ""
11593
+ },
11594
+ resolver: zod.zodResolver(schema$1)
11595
+ });
11596
+ const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
11432
11597
  const { handleSuccess } = useRouteModal();
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}`);
11443
- },
11444
- onSuccess: () => {
11445
- requestSucceeded = true;
11446
- }
11447
- });
11448
- if (!requestSucceeded) {
11449
- setIsSubmitting(false);
11450
- return;
11451
- }
11452
- await confirmOrderEdit(void 0, {
11453
- onError: (e) => {
11454
- ui.toast.error(`Failed to confirm order edit: ${e.message}`);
11455
- },
11456
- onSuccess: () => {
11457
- handleSuccess();
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
+ }
11458
11613
  },
11459
- onSettled: () => {
11460
- setIsSubmitting(false);
11461
- }
11462
- });
11463
- };
11464
- const onKeydown = React.useCallback(
11465
- (e) => {
11466
- if (e.key === "Enter" && (e.ctrlKey || e.metaKey)) {
11467
- if (data || isSubmitting) {
11468
- return;
11614
+ {
11615
+ onSuccess: () => {
11616
+ handleSuccess();
11617
+ },
11618
+ onError: (error) => {
11619
+ ui.toast.error(error.message);
11469
11620
  }
11470
- onSubmit();
11471
11621
  }
11472
- },
11473
- [data, isSubmitting, onSubmit]
11474
- );
11475
- React.useEffect(() => {
11476
- document.addEventListener("keydown", onKeydown);
11477
- return () => {
11478
- document.removeEventListener("keydown", onKeydown);
11479
- };
11480
- }, [onKeydown]);
11481
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex h-full flex-col overflow-hidden", children: [
11482
- /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Header, {}),
11483
- /* @__PURE__ */ jsxRuntime.jsxs(RouteFocusModal.Body, { className: "flex flex-1 flex-col overflow-hidden", children: [
11484
- /* @__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: [
11485
- /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
11486
- /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Shipping" }) }),
11487
- /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", className: "text-ui-fg-subtle", children: "Choose which shipping method(s) to use for the items in the order." }) })
11488
- ] }),
11489
- /* @__PURE__ */ jsxRuntime.jsx(ui.Divider, { variant: "dashed" }),
11490
- /* @__PURE__ */ jsxRuntime.jsx(radixUi.Accordion.Root, { type: "multiple", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-ui-bg-subtle rounded-xl shadow-elevation-card-rest", children: [
11491
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "px-4 py-2 flex items-center justify-between", children: [
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: [
11492
11644
  /* @__PURE__ */ jsxRuntime.jsx(
11493
- ui.Text,
11645
+ Form$2.Field,
11494
11646
  {
11495
- size: "xsmall",
11496
- weight: "plus",
11497
- className: "text-ui-fg-muted",
11498
- children: "Shipping profile"
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
+ ] })
11499
11654
  }
11500
11655
  ),
11501
11656
  /* @__PURE__ */ jsxRuntime.jsx(
11502
- ui.Text,
11657
+ Form$2.Field,
11503
11658
  {
11504
- size: "xsmall",
11505
- weight: "plus",
11506
- className: "text-ui-fg-muted",
11507
- children: "Action"
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
+ ] })
11508
11666
  }
11509
11667
  )
11510
11668
  ] }),
11511
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "px-[5px] pb-[5px]", children: uniqueShippingProfiles.map((profile) => {
11512
- var _a2, _b, _c, _d, _e, _f, _g;
11513
- const items = getItemsWithShippingProfile(
11514
- profile.id,
11515
- order.items
11516
- );
11517
- const hasItems = items.length > 0;
11518
- const shippingOption = shipping_options == null ? void 0 : shipping_options.find(
11519
- (option) => option.shipping_profile_id === profile.id
11520
- );
11521
- const shippingMethod = preview.shipping_methods.find(
11522
- (method) => method.shipping_option_id === (shippingOption == null ? void 0 : shippingOption.id)
11523
- );
11524
- const addShippingMethodAction = (_a2 = shippingMethod == null ? void 0 : shippingMethod.actions) == null ? void 0 : _a2.find(
11525
- (action) => action.action === "SHIPPING_ADD"
11526
- );
11527
- return /* @__PURE__ */ jsxRuntime.jsxs(
11528
- radixUi.Accordion.Item,
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,
11529
11708
  {
11530
- value: profile.id,
11531
- className: "bg-ui-bg-base shadow-elevation-card-rest rounded-lg",
11532
- children: [
11533
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "px-3 py-2 flex items-center justify-between gap-3", children: [
11534
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-x-3 w-full overflow-hidden", children: [
11535
- /* @__PURE__ */ jsxRuntime.jsx(radixUi.Accordion.Trigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(
11536
- ui.IconButton,
11537
- {
11538
- size: "2xsmall",
11539
- variant: "transparent",
11540
- className: "group/trigger",
11541
- disabled: !hasItems,
11542
- children: /* @__PURE__ */ jsxRuntime.jsx(icons.TriangleRightMini, { className: "group-data-[state=open]/trigger:rotate-90 transition-transform" })
11543
- }
11544
- ) }),
11545
- !shippingOption ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-x-3", children: [
11546
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "size-7 rounded-md shadow-borders-base flex items-center justify-center", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "size-6 rounded bg-ui-bg-component-hover flex items-center justify-center", children: /* @__PURE__ */ jsxRuntime.jsx(icons.Shopping, { className: "text-ui-fg-subtle" }) }) }),
11547
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col flex-1", children: [
11548
- /* @__PURE__ */ jsxRuntime.jsx(
11549
- ui.Text,
11550
- {
11551
- size: "small",
11552
- weight: "plus",
11553
- leading: "compact",
11554
- children: profile.name
11555
- }
11556
- ),
11557
- /* @__PURE__ */ jsxRuntime.jsxs(
11558
- ui.Text,
11559
- {
11560
- size: "small",
11561
- leading: "compact",
11562
- className: "text-ui-fg-subtle",
11563
- children: [
11564
- items.length,
11565
- " ",
11566
- pluralize(items.length, "items", "item")
11567
- ]
11568
- }
11569
- )
11570
- ] })
11571
- ] }) : /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-[5px] max-sm:flex-col max-sm:items-start flex-1 w-full overflow-hidden", children: [
11572
- /* @__PURE__ */ jsxRuntime.jsx(
11573
- ui.Tooltip,
11574
- {
11575
- content: /* @__PURE__ */ jsxRuntime.jsx("ul", { children: items.map((item) => {
11576
- var _a3, _b2, _c2;
11577
- return /* @__PURE__ */ jsxRuntime.jsx(
11578
- "li",
11579
- {
11580
- children: `${item.quantity}x ${(_b2 = (_a3 = item.variant) == null ? void 0 : _a3.product) == null ? void 0 : _b2.title} (${(_c2 = item.variant) == null ? void 0 : _c2.title})`
11581
- },
11582
- item.id
11583
- );
11584
- }) }),
11585
- children: /* @__PURE__ */ jsxRuntime.jsxs(
11586
- ui.Badge,
11587
- {
11588
- className: "flex items-center gap-x-[3px] overflow-hidden cursor-default",
11589
- size: "xsmall",
11590
- children: [
11591
- /* @__PURE__ */ jsxRuntime.jsx(icons.Shopping, { className: "shrink-0" }),
11592
- /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "truncate", children: [
11593
- items.reduce(
11594
- (acc, item) => acc + item.quantity,
11595
- 0
11596
- ),
11597
- "x",
11598
- " ",
11599
- pluralize(items.length, "items", "item")
11600
- ] })
11601
- ]
11602
- }
11603
- )
11604
- }
11605
- ),
11606
- /* @__PURE__ */ jsxRuntime.jsx(
11607
- ui.Tooltip,
11608
- {
11609
- content: (_d = (_c = (_b = shippingOption.service_zone) == null ? void 0 : _b.fulfillment_set) == null ? void 0 : _c.location) == null ? void 0 : _d.name,
11610
- children: /* @__PURE__ */ jsxRuntime.jsxs(
11611
- ui.Badge,
11612
- {
11613
- className: "flex items-center gap-x-[3px] overflow-hidden cursor-default",
11614
- size: "xsmall",
11615
- children: [
11616
- /* @__PURE__ */ jsxRuntime.jsx(icons.Buildings, { className: "shrink-0" }),
11617
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: "truncate", children: (_g = (_f = (_e = shippingOption.service_zone) == null ? void 0 : _e.fulfillment_set) == null ? void 0 : _f.location) == null ? void 0 : _g.name })
11618
- ]
11619
- }
11620
- )
11621
- }
11622
- ),
11623
- /* @__PURE__ */ jsxRuntime.jsx(ui.Tooltip, { content: shippingOption.name, children: /* @__PURE__ */ jsxRuntime.jsxs(
11624
- ui.Badge,
11625
- {
11626
- className: "flex items-center gap-x-[3px] overflow-hidden cursor-default",
11627
- size: "xsmall",
11628
- children: [
11629
- /* @__PURE__ */ jsxRuntime.jsx(icons.TruckFast, { className: "shrink-0" }),
11630
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: "truncate", children: shippingOption.name })
11631
- ]
11632
- }
11633
- ) })
11634
- ] })
11635
- ] }),
11636
- shippingOption ? /* @__PURE__ */ jsxRuntime.jsx(
11637
- ActionMenu,
11638
- {
11639
- groups: [
11640
- {
11641
- actions: [
11642
- hasItems ? {
11643
- label: "Edit shipping option",
11644
- icon: /* @__PURE__ */ jsxRuntime.jsx(icons.Channels, {}),
11645
- onClick: () => {
11646
- setIsOpen(
11647
- STACKED_FOCUS_MODAL_ID,
11648
- true
11649
- );
11650
- setData({
11651
- shippingProfileId: profile.id,
11652
- shippingOption,
11653
- shippingMethod
11654
- });
11655
- }
11656
- } : void 0,
11657
- {
11658
- label: "Remove shipping option",
11659
- icon: /* @__PURE__ */ jsxRuntime.jsx(icons.Trash, {}),
11660
- onClick: () => {
11661
- if (shippingMethod) {
11662
- if (addShippingMethodAction) {
11663
- removeActionShippingMethod(
11664
- addShippingMethodAction.id
11665
- );
11666
- } else {
11667
- removeShippingMethod(
11668
- shippingMethod.id
11669
- );
11670
- }
11671
- }
11672
- }
11673
- }
11674
- ].filter(Boolean)
11675
- }
11676
- ]
11677
- }
11678
- ) : /* @__PURE__ */ jsxRuntime.jsx(
11679
- StackedModalTrigger,
11680
- {
11681
- shippingProfileId: profile.id,
11682
- shippingOption,
11683
- shippingMethod,
11684
- setData,
11685
- children: "Add shipping option"
11686
- }
11687
- )
11688
- ] }),
11689
- /* @__PURE__ */ jsxRuntime.jsxs(radixUi.Accordion.Content, { children: [
11690
- /* @__PURE__ */ jsxRuntime.jsx(ui.Divider, { variant: "dashed" }),
11691
- items.map((item, idx) => {
11692
- var _a3, _b2, _c2, _d2, _e2;
11693
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
11694
- /* @__PURE__ */ jsxRuntime.jsxs(
11695
- "div",
11696
- {
11697
- className: "px-3 flex items-center gap-x-3",
11698
- children: [
11699
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-5 h-[56px] flex flex-col justify-center items-center", children: /* @__PURE__ */ jsxRuntime.jsx(
11700
- ui.Divider,
11701
- {
11702
- variant: "dashed",
11703
- orientation: "vertical"
11704
- }
11705
- ) }),
11706
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "py-2 flex items-center gap-x-3", children: [
11707
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "size-7 flex items-center justify-center tabular-nums", children: /* @__PURE__ */ jsxRuntime.jsxs(
11708
- ui.Text,
11709
- {
11710
- size: "small",
11711
- leading: "compact",
11712
- className: "text-ui-fg-subtle",
11713
- children: [
11714
- item.quantity,
11715
- "x"
11716
- ]
11717
- }
11718
- ) }),
11719
- /* @__PURE__ */ jsxRuntime.jsx(Thumbnail, { thumbnail: item.thumbnail }),
11720
- /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
11721
- /* @__PURE__ */ jsxRuntime.jsxs(
11722
- ui.Text,
11723
- {
11724
- size: "small",
11725
- leading: "compact",
11726
- weight: "plus",
11727
- children: [
11728
- (_b2 = (_a3 = item.variant) == null ? void 0 : _a3.product) == null ? void 0 : _b2.title,
11729
- " (",
11730
- (_c2 = item.variant) == null ? void 0 : _c2.title,
11731
- ")"
11732
- ]
11733
- }
11734
- ),
11735
- /* @__PURE__ */ jsxRuntime.jsx(
11736
- ui.Text,
11737
- {
11738
- size: "small",
11739
- leading: "compact",
11740
- className: "text-ui-fg-subtle",
11741
- children: (_e2 = (_d2 = item.variant) == null ? void 0 : _d2.options) == null ? void 0 : _e2.map((option) => option.value).join(" · ")
11742
- }
11743
- )
11744
- ] })
11745
- ] })
11746
- ]
11747
- },
11748
- item.id
11749
- ),
11750
- idx !== items.length - 1 && /* @__PURE__ */ jsxRuntime.jsx(ui.Divider, { variant: "dashed" })
11751
- ] }, item.id);
11752
- })
11753
- ] })
11754
- ]
11755
- },
11756
- profile.id
11757
- );
11758
- }) })
11759
- ] }) })
11760
- ] }) }),
11761
- /* @__PURE__ */ jsxRuntime.jsx(
11762
- StackedFocusModal,
11763
- {
11764
- id: STACKED_FOCUS_MODAL_ID,
11765
- onOpenChangeCallback: (open) => {
11766
- if (!open) {
11767
- setData(null);
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
+ ] })
11768
11741
  }
11769
- return open;
11770
- },
11771
- children: data && /* @__PURE__ */ jsxRuntime.jsx(ShippingProfileForm, { data, order, preview })
11772
- }
11773
- )
11774
- ] }),
11775
- /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-x-2", children: [
11776
- /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", type: "button", children: "Cancel" }) }),
11777
- /* @__PURE__ */ jsxRuntime.jsx(
11778
- ui.Button,
11779
- {
11780
- size: "small",
11781
- type: "button",
11782
- isLoading: isSubmitting,
11783
- onClick: onSubmit,
11784
- children: "Save"
11785
- }
11786
- )
11787
- ] }) })
11788
- ] });
11789
- };
11790
- const StackedModalTrigger = ({
11791
- shippingProfileId,
11792
- shippingOption,
11793
- shippingMethod,
11794
- setData,
11795
- children
11796
- }) => {
11797
- const { setIsOpen, getIsOpen } = useStackedModal();
11798
- const isOpen = getIsOpen(STACKED_FOCUS_MODAL_ID);
11799
- const onToggle = () => {
11800
- if (isOpen) {
11801
- setIsOpen(STACKED_FOCUS_MODAL_ID, false);
11802
- setData(null);
11803
- } else {
11804
- setIsOpen(STACKED_FOCUS_MODAL_ID, true);
11805
- setData({
11806
- shippingProfileId,
11807
- shippingOption,
11808
- shippingMethod
11809
- });
11810
- }
11811
- };
11812
- return /* @__PURE__ */ jsxRuntime.jsx(
11813
- ui.Button,
11814
- {
11815
- size: "small",
11816
- variant: "secondary",
11817
- onClick: onToggle,
11818
- className: "text-ui-fg-primary shrink-0",
11819
- children
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
+ ]
11820
11761
  }
11821
- );
11762
+ ) });
11822
11763
  };
11823
- const ShippingProfileForm = ({
11824
- data,
11825
- order,
11826
- preview
11827
- }) => {
11828
- var _a, _b, _c, _d, _e, _f;
11829
- const { setIsOpen } = useStackedModal();
11764
+ const schema$1 = addressSchema;
11765
+ const TransferOwnership = () => {
11766
+ const { id } = reactRouterDom.useParams();
11767
+ const { draft_order, isPending, isError, error } = useDraftOrder(id, {
11768
+ fields: "id,customer_id,customer.*"
11769
+ });
11770
+ if (isError) {
11771
+ throw error;
11772
+ }
11773
+ const isReady = !isPending && !!draft_order;
11774
+ return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
11775
+ /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
11776
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Transfer Ownership" }) }),
11777
+ /* @__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" }) })
11778
+ ] }),
11779
+ isReady && /* @__PURE__ */ jsxRuntime.jsx(TransferOwnershipForm, { order: draft_order })
11780
+ ] });
11781
+ };
11782
+ const TransferOwnershipForm = ({ order }) => {
11783
+ var _a, _b;
11830
11784
  const form = reactHookForm.useForm({
11831
- resolver: zod.zodResolver(shippingMethodSchema),
11832
11785
  defaultValues: {
11833
- location_id: (_d = (_c = (_b = (_a = data.shippingOption) == null ? void 0 : _a.service_zone) == null ? void 0 : _b.fulfillment_set) == null ? void 0 : _c.location) == null ? void 0 : _d.id,
11834
- shipping_option_id: (_e = data.shippingOption) == null ? void 0 : _e.id,
11835
- custom_amount: (_f = data.shippingMethod) == null ? void 0 : _f.amount
11836
- }
11786
+ customer_id: order.customer_id || ""
11787
+ },
11788
+ resolver: zod.zodResolver(schema)
11837
11789
  });
11838
- const { mutateAsync: addShippingMethod, isPending } = useDraftOrderAddShippingMethod(order.id);
11839
- const {
11840
- mutateAsync: updateShippingMethod,
11841
- isPending: isUpdatingShippingMethod
11842
- } = useDraftOrderUpdateShippingMethod(order.id);
11843
- const onSubmit = form.handleSubmit(async (values) => {
11844
- if (lodash.isEqual(values, form.formState.defaultValues)) {
11845
- setIsOpen(STACKED_FOCUS_MODAL_ID, false);
11846
- return;
11847
- }
11848
- if (data.shippingMethod) {
11849
- await updateShippingMethod(
11850
- {
11851
- method_id: data.shippingMethod.id,
11852
- shipping_option_id: values.shipping_option_id,
11853
- custom_amount: values.custom_amount ? convertNumber(values.custom_amount) : void 0
11854
- },
11855
- {
11856
- onError: (e) => {
11857
- ui.toast.error(e.message);
11858
- },
11859
- onSuccess: () => {
11860
- setIsOpen(STACKED_FOCUS_MODAL_ID, false);
11861
- }
11862
- }
11863
- );
11864
- return;
11865
- }
11866
- await addShippingMethod(
11867
- {
11868
- shipping_option_id: values.shipping_option_id,
11869
- custom_amount: values.custom_amount ? convertNumber(values.custom_amount) : void 0
11870
- },
11790
+ const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
11791
+ const { handleSuccess } = useRouteModal();
11792
+ const name = [(_a = order.customer) == null ? void 0 : _a.first_name, (_b = order.customer) == null ? void 0 : _b.last_name].filter(Boolean).join(" ");
11793
+ const currentCustomer = order.customer ? {
11794
+ label: name ? `${name} (${order.customer.email})` : order.customer.email,
11795
+ value: order.customer.id
11796
+ } : null;
11797
+ const onSubmit = form.handleSubmit(async (data) => {
11798
+ await mutateAsync(
11799
+ { customer_id: data.customer_id },
11871
11800
  {
11872
- onError: (e) => {
11873
- ui.toast.error(e.message);
11874
- },
11875
11801
  onSuccess: () => {
11876
- setIsOpen(STACKED_FOCUS_MODAL_ID, false);
11802
+ ui.toast.success("Customer updated");
11803
+ handleSuccess();
11804
+ },
11805
+ onError: (error) => {
11806
+ ui.toast.error(error.message);
11877
11807
  }
11878
11808
  }
11879
11809
  );
11880
11810
  });
11881
- return /* @__PURE__ */ jsxRuntime.jsx(StackedFocusModal.Content, { children: /* @__PURE__ */ jsxRuntime.jsx(Form$2, { ...form, children: /* @__PURE__ */ jsxRuntime.jsxs(
11811
+ return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
11882
11812
  KeyboundForm,
11883
11813
  {
11884
- className: "flex h-full flex-col overflow-hidden",
11814
+ className: "flex flex-1 flex-col overflow-hidden",
11885
11815
  onSubmit,
11886
11816
  children: [
11887
- /* @__PURE__ */ jsxRuntime.jsx(StackedFocusModal.Header, {}),
11888
- /* @__PURE__ */ jsxRuntime.jsx(StackedFocusModal.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: [
11889
- /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
11890
- /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Shipping" }) }),
11891
- /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", className: "text-ui-fg-subtle", children: "Add a shipping method for the selected shipping profile. You can see the items that will be shipped using this method in the preview below." }) })
11817
+ /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: [
11818
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center justify-center bg-ui-bg-component rounded-md border", children: /* @__PURE__ */ jsxRuntime.jsx(Illustration, {}) }),
11819
+ currentCustomer && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col space-y-3", children: [
11820
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col", children: [
11821
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Label, { size: "small", weight: "plus", htmlFor: "current-customer", children: "Current owner" }),
11822
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Hint, { children: "The customer that is currently associated with this draft order." })
11823
+ ] }),
11824
+ /* @__PURE__ */ jsxRuntime.jsxs(ui.Select, { disabled: true, value: currentCustomer.value, children: [
11825
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Select.Trigger, { id: "current-customer", children: /* @__PURE__ */ jsxRuntime.jsx(ui.Select.Value, {}) }),
11826
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Select.Content, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Select.Item, { value: currentCustomer.value, children: currentCustomer.label }) })
11827
+ ] })
11892
11828
  ] }),
11893
- /* @__PURE__ */ jsxRuntime.jsx(ui.Divider, { variant: "dashed" }),
11894
- /* @__PURE__ */ jsxRuntime.jsx(
11895
- LocationField,
11896
- {
11897
- control: form.control,
11898
- setValue: form.setValue
11899
- }
11900
- ),
11901
- /* @__PURE__ */ jsxRuntime.jsx(ui.Divider, { variant: "dashed" }),
11902
- /* @__PURE__ */ jsxRuntime.jsx(
11903
- ShippingOptionField,
11904
- {
11905
- shippingProfileId: data.shippingProfileId,
11906
- preview,
11907
- control: form.control
11908
- }
11909
- ),
11910
- /* @__PURE__ */ jsxRuntime.jsx(ui.Divider, { variant: "dashed" }),
11911
11829
  /* @__PURE__ */ jsxRuntime.jsx(
11912
- CustomAmountField,
11830
+ CustomerField,
11913
11831
  {
11914
11832
  control: form.control,
11915
- currencyCode: order.currency_code
11916
- }
11917
- ),
11918
- /* @__PURE__ */ jsxRuntime.jsx(ui.Divider, { variant: "dashed" }),
11919
- /* @__PURE__ */ jsxRuntime.jsx(
11920
- ItemsPreview,
11921
- {
11922
- order,
11923
- shippingProfileId: data.shippingProfileId
11924
- }
11925
- )
11926
- ] }) }) }),
11927
- /* @__PURE__ */ jsxRuntime.jsx(StackedFocusModal.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-x-2", children: [
11928
- /* @__PURE__ */ jsxRuntime.jsx(StackedFocusModal.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", type: "button", children: "Cancel" }) }),
11929
- /* @__PURE__ */ jsxRuntime.jsx(
11930
- ui.Button,
11931
- {
11932
- size: "small",
11933
- type: "submit",
11934
- isLoading: isPending || isUpdatingShippingMethod,
11935
- children: data.shippingMethod ? "Update" : "Add"
11833
+ currentCustomerId: order.customer_id
11936
11834
  }
11937
11835
  )
11836
+ ] }),
11837
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
11838
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { variant: "secondary", size: "small", children: "Cancel" }) }),
11839
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
11938
11840
  ] }) })
11939
11841
  ]
11940
11842
  }
11941
- ) }) });
11843
+ ) });
11942
11844
  };
11943
- const shippingMethodSchema = objectType({
11944
- location_id: stringType(),
11945
- shipping_option_id: stringType(),
11946
- custom_amount: unionType([numberType(), stringType()]).optional()
11947
- });
11948
- const ItemsPreview = ({ order, shippingProfileId }) => {
11949
- const matches = order.items.filter(
11950
- (item) => {
11951
- var _a, _b, _c;
11952
- return ((_c = (_b = (_a = item.variant) == null ? void 0 : _a.product) == null ? void 0 : _b.shipping_profile) == null ? void 0 : _c.id) === shippingProfileId;
11953
- }
11954
- );
11955
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-y-6", children: [
11956
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid grid-cols-2 items-center gap-3", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col", children: [
11957
- /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", weight: "plus", leading: "compact", children: "Items to ship" }),
11958
- /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", className: "text-ui-fg-subtle", children: "Items with the selected shipping profile." })
11959
- ] }) }),
11960
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-ui-bg-subtle shadow-elevation-card-rest rounded-xl", children: [
11961
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-3 px-4 py-2 text-ui-fg-muted", children: [
11962
- /* @__PURE__ */ jsxRuntime.jsx("div", { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", weight: "plus", children: "Item" }) }),
11963
- /* @__PURE__ */ jsxRuntime.jsx("div", { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", weight: "plus", children: "Quantity" }) })
11964
- ] }),
11965
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col gap-y-1.5 px-[5px] pb-[5px]", children: matches.length > 0 ? matches == null ? void 0 : matches.map((item) => /* @__PURE__ */ jsxRuntime.jsxs(
11966
- "div",
11967
- {
11968
- className: "grid grid-cols-2 gap-3 px-4 py-2 bg-ui-bg-base shadow-elevation-card-rest rounded-lg items-center",
11969
- children: [
11970
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-x-3", children: [
11971
- /* @__PURE__ */ jsxRuntime.jsx(
11972
- Thumbnail,
11973
- {
11974
- thumbnail: item.thumbnail,
11975
- alt: item.product_title ?? void 0
11976
- }
11977
- ),
11978
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col", children: [
11979
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-x-1", children: [
11980
- /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", weight: "plus", leading: "compact", children: item.product_title }),
11981
- /* @__PURE__ */ jsxRuntime.jsxs(
11982
- ui.Text,
11983
- {
11984
- size: "small",
11985
- leading: "compact",
11986
- className: "text-ui-fg-subtle",
11987
- children: [
11988
- "(",
11989
- item.variant_title,
11990
- ")"
11991
- ]
11992
- }
11993
- )
11994
- ] }),
11995
- /* @__PURE__ */ jsxRuntime.jsx(
11996
- ui.Text,
11997
- {
11998
- size: "small",
11999
- leading: "compact",
12000
- className: "text-ui-fg-subtle",
12001
- children: item.variant_sku
12002
- }
12003
- )
12004
- ] })
12005
- ] }),
12006
- /* @__PURE__ */ jsxRuntime.jsxs(
12007
- ui.Text,
12008
- {
12009
- size: "small",
12010
- leading: "compact",
12011
- className: "text-ui-fg-subtle",
12012
- children: [
12013
- item.quantity,
12014
- "x"
12015
- ]
12016
- }
12017
- )
12018
- ]
12019
- },
12020
- item.id
12021
- )) : /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-center gap-x-3 bg-ui-bg-base rounded-lg p-4 shadow-elevation-card-rest flex-col gap-1", children: [
12022
- /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", weight: "plus", leading: "compact", children: "No items found" }),
12023
- /* @__PURE__ */ jsxRuntime.jsxs(ui.Text, { size: "small", className: "text-ui-fg-subtle", children: [
12024
- 'No items found for "',
12025
- query,
12026
- '".'
12027
- ] })
12028
- ] }) })
12029
- ] })
12030
- ] });
12031
- };
12032
- const LocationField = ({ control, setValue }) => {
12033
- const locations = useComboboxData({
12034
- queryKey: ["locations"],
12035
- queryFn: async (params) => {
12036
- return await sdk.admin.stockLocation.list(params);
12037
- },
12038
- getOptions: (data) => {
12039
- return data.stock_locations.map((location) => ({
12040
- label: location.name,
12041
- value: location.id
12042
- }));
12043
- }
12044
- });
12045
- return /* @__PURE__ */ jsxRuntime.jsx(
12046
- Form$2.Field,
12047
- {
12048
- control,
12049
- name: "location_id",
12050
- render: ({ field: { onChange, ...field } }) => {
12051
- return /* @__PURE__ */ jsxRuntime.jsx(Form$2.Item, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-x-3", children: [
12052
- /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
12053
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Location" }),
12054
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Hint, { children: "Choose where you want to ship the items from." })
12055
- ] }),
12056
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
12057
- Combobox,
12058
- {
12059
- options: locations.options,
12060
- fetchNextPage: locations.fetchNextPage,
12061
- isFetchingNextPage: locations.isFetchingNextPage,
12062
- searchValue: locations.searchValue,
12063
- onSearchValueChange: locations.onSearchValueChange,
12064
- placeholder: "Select location",
12065
- onChange: (value) => {
12066
- setValue("shipping_option_id", "", {
12067
- shouldDirty: true,
12068
- shouldTouch: true
12069
- });
12070
- onChange(value);
12071
- },
12072
- ...field
12073
- }
12074
- ) })
12075
- ] }) });
12076
- }
12077
- }
12078
- );
12079
- };
12080
- const ShippingOptionField = ({
12081
- shippingProfileId,
12082
- preview,
12083
- control
12084
- }) => {
12085
- var _a;
12086
- const locationId = reactHookForm.useWatch({ control, name: "location_id" });
12087
- const shippingOptions = useComboboxData({
12088
- queryKey: ["shipping_options", locationId, shippingProfileId],
12089
- queryFn: async (params) => {
12090
- return await sdk.admin.shippingOption.list({
12091
- ...params,
12092
- stock_location_id: locationId,
12093
- shipping_profile_id: shippingProfileId
12094
- });
12095
- },
12096
- getOptions: (data) => {
12097
- return data.shipping_options.map((option) => {
12098
- var _a2;
12099
- if ((_a2 = option.rules) == null ? void 0 : _a2.find(
12100
- (r) => r.attribute === "is_return" && r.value === "true"
12101
- )) {
12102
- return void 0;
12103
- }
12104
- return {
12105
- label: option.name,
12106
- value: option.id
12107
- };
12108
- }).filter(Boolean);
12109
- },
12110
- enabled: !!locationId && !!shippingProfileId,
12111
- defaultValue: ((_a = preview.shipping_methods[0]) == null ? void 0 : _a.shipping_option_id) || void 0
12112
- });
12113
- const tooltipContent = !locationId && !shippingProfileId ? "Choose a location and shipping profile first." : !locationId ? "Choose a location first." : "Choose a shipping profile first.";
12114
- return /* @__PURE__ */ jsxRuntime.jsx(
12115
- Form$2.Field,
12116
- {
12117
- control,
12118
- name: "shipping_option_id",
12119
- render: ({ field }) => {
12120
- return /* @__PURE__ */ jsxRuntime.jsx(Form$2.Item, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-x-3", children: [
12121
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col", children: [
12122
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Shipping option" }),
12123
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Hint, { children: "Choose the shipping option to use." })
12124
- ] }),
12125
- /* @__PURE__ */ jsxRuntime.jsx(
12126
- ConditionalTooltip,
12127
- {
12128
- content: tooltipContent,
12129
- showTooltip: !locationId || !shippingProfileId,
12130
- children: /* @__PURE__ */ jsxRuntime.jsx("div", { children: /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
12131
- Combobox,
12132
- {
12133
- options: shippingOptions.options,
12134
- fetchNextPage: shippingOptions.fetchNextPage,
12135
- isFetchingNextPage: shippingOptions.isFetchingNextPage,
12136
- searchValue: shippingOptions.searchValue,
12137
- onSearchValueChange: shippingOptions.onSearchValueChange,
12138
- placeholder: "Select shipping option",
12139
- ...field,
12140
- disabled: !locationId || !shippingProfileId
12141
- }
12142
- ) }) })
12143
- }
12144
- )
12145
- ] }) });
12146
- }
11845
+ const CustomerField = ({ control, currentCustomerId }) => {
11846
+ const customers = useComboboxData({
11847
+ queryFn: async (params) => {
11848
+ return await sdk.admin.customer.list({
11849
+ ...params,
11850
+ id: currentCustomerId ? { $nin: [currentCustomerId] } : void 0
11851
+ });
11852
+ },
11853
+ queryKey: ["customers"],
11854
+ getOptions: (data) => {
11855
+ return data.customers.map((customer) => {
11856
+ const name = [customer.first_name, customer.last_name].filter(Boolean).join(" ");
11857
+ return {
11858
+ label: name ? `${name} (${customer.email})` : customer.email,
11859
+ value: customer.id
11860
+ };
11861
+ });
11862
+ }
11863
+ });
11864
+ return /* @__PURE__ */ jsxRuntime.jsx(
11865
+ Form$2.Field,
11866
+ {
11867
+ name: "customer_id",
11868
+ control,
11869
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { className: "space-y-3", children: [
11870
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col", children: [
11871
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "New customer" }),
11872
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Hint, { children: "The customer to transfer this draft order to." })
11873
+ ] }),
11874
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
11875
+ Combobox,
11876
+ {
11877
+ options: customers.options,
11878
+ fetchNextPage: customers.fetchNextPage,
11879
+ isFetchingNextPage: customers.isFetchingNextPage,
11880
+ searchValue: customers.searchValue,
11881
+ onSearchValueChange: customers.onSearchValueChange,
11882
+ placeholder: "Select customer",
11883
+ ...field
11884
+ }
11885
+ ) }),
11886
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11887
+ ] })
12147
11888
  }
12148
11889
  );
12149
11890
  };
12150
- const CustomAmountField = ({
12151
- control,
12152
- currencyCode
12153
- }) => {
12154
- return /* @__PURE__ */ jsxRuntime.jsx(
12155
- Form$2.Field,
11891
+ const Illustration = () => {
11892
+ return /* @__PURE__ */ jsxRuntime.jsxs(
11893
+ "svg",
12156
11894
  {
12157
- control,
12158
- name: "custom_amount",
12159
- render: ({ field: { onChange, ...field } }) => {
12160
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-x-3", children: [
12161
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col", children: [
12162
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Custom amount" }),
12163
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Hint, { children: "Set a custom amount for the shipping option." })
12164
- ] }),
12165
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
12166
- ui.CurrencyInput,
12167
- {
12168
- ...field,
12169
- onValueChange: (value) => onChange(value),
12170
- symbol: getNativeSymbol(currencyCode),
12171
- code: currencyCode
12172
- }
12173
- ) })
12174
- ] });
12175
- }
12176
- }
12177
- );
12178
- };
12179
- const ShippingAddress = () => {
12180
- const { id } = reactRouterDom.useParams();
12181
- const { order, isPending, isError, error } = useOrder(id, {
12182
- fields: "+shipping_address"
12183
- });
12184
- if (isError) {
12185
- throw error;
12186
- }
12187
- const isReady = !isPending && !!order;
12188
- return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
12189
- /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
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" }) })
12192
- ] }),
12193
- isReady && /* @__PURE__ */ jsxRuntime.jsx(ShippingAddressForm, { order })
12194
- ] });
12195
- };
12196
- const ShippingAddressForm = ({ order }) => {
12197
- var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
12198
- const form = reactHookForm.useForm({
12199
- defaultValues: {
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) ?? ""
12210
- },
12211
- resolver: zod.zodResolver(schema$2)
12212
- });
12213
- const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
12214
- const { handleSuccess } = useRouteModal();
12215
- const onSubmit = form.handleSubmit(async (data) => {
12216
- await mutateAsync(
12217
- {
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);
12424
- }
12425
- }
12426
- );
12427
- });
12428
- return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
12429
- KeyboundForm,
12430
- {
12431
- className: "flex flex-1 flex-col overflow-hidden",
12432
- onSubmit,
12433
- children: [
12434
- /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: [
12435
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center justify-center bg-ui-bg-component rounded-md border", children: /* @__PURE__ */ jsxRuntime.jsx(Illustration, {}) }),
12436
- currentCustomer && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col space-y-3", children: [
12437
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col", children: [
12438
- /* @__PURE__ */ jsxRuntime.jsx(ui.Label, { size: "small", weight: "plus", htmlFor: "current-customer", children: "Current owner" }),
12439
- /* @__PURE__ */ jsxRuntime.jsx(ui.Hint, { children: "The customer that is currently associated with this draft order." })
12440
- ] }),
12441
- /* @__PURE__ */ jsxRuntime.jsxs(ui.Select, { disabled: true, value: currentCustomer.value, children: [
12442
- /* @__PURE__ */ jsxRuntime.jsx(ui.Select.Trigger, { id: "current-customer", children: /* @__PURE__ */ jsxRuntime.jsx(ui.Select.Value, {}) }),
12443
- /* @__PURE__ */ jsxRuntime.jsx(ui.Select.Content, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Select.Item, { value: currentCustomer.value, children: currentCustomer.label }) })
12444
- ] })
12445
- ] }),
12446
- /* @__PURE__ */ jsxRuntime.jsx(
12447
- CustomerField,
12448
- {
12449
- control: form.control,
12450
- currentCustomerId: order.customer_id
12451
- }
12452
- )
12453
- ] }),
12454
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
12455
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { variant: "secondary", size: "small", children: "Cancel" }) }),
12456
- /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
12457
- ] }) })
12458
- ]
12459
- }
12460
- ) });
12461
- };
12462
- const CustomerField = ({ control, currentCustomerId }) => {
12463
- const customers = useComboboxData({
12464
- queryFn: async (params) => {
12465
- return await sdk.admin.customer.list({
12466
- ...params,
12467
- id: currentCustomerId ? { $nin: [currentCustomerId] } : void 0
12468
- });
12469
- },
12470
- queryKey: ["customers"],
12471
- getOptions: (data) => {
12472
- return data.customers.map((customer) => {
12473
- const name = [customer.first_name, customer.last_name].filter(Boolean).join(" ");
12474
- return {
12475
- label: name ? `${name} (${customer.email})` : customer.email,
12476
- value: customer.id
12477
- };
12478
- });
12479
- }
12480
- });
12481
- return /* @__PURE__ */ jsxRuntime.jsx(
12482
- Form$2.Field,
12483
- {
12484
- name: "customer_id",
12485
- control,
12486
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { className: "space-y-3", children: [
12487
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col", children: [
12488
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "New customer" }),
12489
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Hint, { children: "The customer to transfer this draft order to." })
12490
- ] }),
12491
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
12492
- Combobox,
12493
- {
12494
- options: customers.options,
12495
- fetchNextPage: customers.fetchNextPage,
12496
- isFetchingNextPage: customers.isFetchingNextPage,
12497
- searchValue: customers.searchValue,
12498
- onSearchValueChange: customers.onSearchValueChange,
12499
- placeholder: "Select customer",
12500
- ...field
12501
- }
12502
- ) }),
12503
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12504
- ] })
12505
- }
12506
- );
12507
- };
12508
- const Illustration = () => {
12509
- return /* @__PURE__ */ jsxRuntime.jsxs(
12510
- "svg",
12511
- {
12512
- width: "280",
12513
- height: "180",
12514
- viewBox: "0 0 280 180",
12515
- fill: "none",
12516
- xmlns: "http://www.w3.org/2000/svg",
11895
+ width: "280",
11896
+ height: "180",
11897
+ viewBox: "0 0 280 180",
11898
+ fill: "none",
11899
+ xmlns: "http://www.w3.org/2000/svg",
12517
11900
  children: [
12518
11901
  /* @__PURE__ */ jsxRuntime.jsx(
12519
11902
  "rect",
@@ -12852,199 +12235,816 @@ const Illustration = () => {
12852
12235
  }
12853
12236
  );
12854
12237
  };
12855
- const schema$1 = objectType({
12238
+ const schema = objectType({
12856
12239
  customer_id: stringType().min(1)
12857
12240
  });
12858
- const BillingAddress = () => {
12241
+ const STACKED_FOCUS_MODAL_ID = "shipping-form";
12242
+ const Shipping = () => {
12243
+ var _a;
12859
12244
  const { id } = reactRouterDom.useParams();
12860
12245
  const { order, isPending, isError, error } = useOrder(id, {
12861
- fields: "+billing_address"
12246
+ fields: "+items.*,+items.variant.*,+items.variant.product.*,+items.variant.product.shipping_profile.*,+currency_code"
12862
12247
  });
12248
+ const {
12249
+ order: preview,
12250
+ isPending: isPreviewPending,
12251
+ isError: isPreviewError,
12252
+ error: previewError
12253
+ } = useOrderPreview(id);
12254
+ useInitiateOrderEdit({ preview });
12255
+ const { onCancel } = useCancelOrderEdit({ preview });
12863
12256
  if (isError) {
12864
12257
  throw error;
12865
12258
  }
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" }) })
12259
+ if (isPreviewError) {
12260
+ throw previewError;
12261
+ }
12262
+ const orderHasItems = (((_a = order == null ? void 0 : order.items) == null ? void 0 : _a.length) || 0) > 0;
12263
+ const isReady = preview && !isPreviewPending && order && !isPending;
12264
+ return /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal, { onClose: onCancel, children: !orderHasItems ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex h-full flex-col overflow-hidden ", children: [
12265
+ /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Header, {}),
12266
+ /* @__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: [
12267
+ /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Shipping" }) }),
12268
+ /* @__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." }) })
12269
+ ] }) }) }),
12270
+ /* @__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" }) }) })
12271
+ ] }) : isReady ? /* @__PURE__ */ jsxRuntime.jsx(ShippingForm, { preview, order }) : /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
12272
+ /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit Shipping" }) }),
12273
+ /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Loading data for the draft order, please wait..." }) })
12274
+ ] }) });
12275
+ };
12276
+ const ShippingForm = ({ preview, order }) => {
12277
+ var _a;
12278
+ const { setIsOpen } = useStackedModal();
12279
+ const [isSubmitting, setIsSubmitting] = React.useState(false);
12280
+ const [data, setData] = React.useState(null);
12281
+ const appliedShippingOptionIds = (_a = preview.shipping_methods) == null ? void 0 : _a.map((method) => method.shipping_option_id).filter(Boolean);
12282
+ const { shipping_options } = useShippingOptions(
12283
+ {
12284
+ id: appliedShippingOptionIds,
12285
+ fields: "+service_zone.*,+service_zone.fulfillment_set.*,+service_zone.fulfillment_set.location.*"
12286
+ },
12287
+ {
12288
+ enabled: appliedShippingOptionIds.length > 0
12289
+ }
12290
+ );
12291
+ const uniqueShippingProfiles = React.useMemo(() => {
12292
+ const profiles = /* @__PURE__ */ new Map();
12293
+ getUniqueShippingProfiles(order.items).forEach((profile) => {
12294
+ profiles.set(profile.id, profile);
12295
+ });
12296
+ shipping_options == null ? void 0 : shipping_options.forEach((option) => {
12297
+ profiles.set(option.shipping_profile_id, option.shipping_profile);
12298
+ });
12299
+ return Array.from(profiles.values());
12300
+ }, [order.items, shipping_options]);
12301
+ const { handleSuccess } = useRouteModal();
12302
+ const { mutateAsync: confirmOrderEdit } = useDraftOrderConfirmEdit(preview.id);
12303
+ const { mutateAsync: requestOrderEdit } = useDraftOrderRequestEdit(preview.id);
12304
+ const { mutateAsync: removeShippingMethod } = useDraftOrderRemoveShippingMethod(preview.id);
12305
+ const { mutateAsync: removeActionShippingMethod } = useDraftOrderRemoveActionShippingMethod(preview.id);
12306
+ const onSubmit = async () => {
12307
+ setIsSubmitting(true);
12308
+ let requestSucceeded = false;
12309
+ await requestOrderEdit(void 0, {
12310
+ onError: (e) => {
12311
+ ui.toast.error(`Failed to request order edit: ${e.message}`);
12312
+ },
12313
+ onSuccess: () => {
12314
+ requestSucceeded = true;
12315
+ }
12316
+ });
12317
+ if (!requestSucceeded) {
12318
+ setIsSubmitting(false);
12319
+ return;
12320
+ }
12321
+ await confirmOrderEdit(void 0, {
12322
+ onError: (e) => {
12323
+ ui.toast.error(`Failed to confirm order edit: ${e.message}`);
12324
+ },
12325
+ onSuccess: () => {
12326
+ handleSuccess();
12327
+ },
12328
+ onSettled: () => {
12329
+ setIsSubmitting(false);
12330
+ }
12331
+ });
12332
+ };
12333
+ const onKeydown = React.useCallback(
12334
+ (e) => {
12335
+ if (e.key === "Enter" && (e.ctrlKey || e.metaKey)) {
12336
+ if (data || isSubmitting) {
12337
+ return;
12338
+ }
12339
+ onSubmit();
12340
+ }
12341
+ },
12342
+ [data, isSubmitting, onSubmit]
12343
+ );
12344
+ React.useEffect(() => {
12345
+ document.addEventListener("keydown", onKeydown);
12346
+ return () => {
12347
+ document.removeEventListener("keydown", onKeydown);
12348
+ };
12349
+ }, [onKeydown]);
12350
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex h-full flex-col overflow-hidden", children: [
12351
+ /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Header, {}),
12352
+ /* @__PURE__ */ jsxRuntime.jsxs(RouteFocusModal.Body, { className: "flex flex-1 flex-col overflow-hidden", children: [
12353
+ /* @__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: [
12354
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
12355
+ /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Shipping" }) }),
12356
+ /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", className: "text-ui-fg-subtle", children: "Choose which shipping method(s) to use for the items in the order." }) })
12357
+ ] }),
12358
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Divider, { variant: "dashed" }),
12359
+ /* @__PURE__ */ jsxRuntime.jsx(radixUi.Accordion.Root, { type: "multiple", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-ui-bg-subtle rounded-xl shadow-elevation-card-rest", children: [
12360
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "px-4 py-2 flex items-center justify-between", children: [
12361
+ /* @__PURE__ */ jsxRuntime.jsx(
12362
+ ui.Text,
12363
+ {
12364
+ size: "xsmall",
12365
+ weight: "plus",
12366
+ className: "text-ui-fg-muted",
12367
+ children: "Shipping profile"
12368
+ }
12369
+ ),
12370
+ /* @__PURE__ */ jsxRuntime.jsx(
12371
+ ui.Text,
12372
+ {
12373
+ size: "xsmall",
12374
+ weight: "plus",
12375
+ className: "text-ui-fg-muted",
12376
+ children: "Action"
12377
+ }
12378
+ )
12379
+ ] }),
12380
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "px-[5px] pb-[5px]", children: uniqueShippingProfiles.map((profile) => {
12381
+ var _a2, _b, _c, _d, _e, _f, _g;
12382
+ const items = getItemsWithShippingProfile(
12383
+ profile.id,
12384
+ order.items
12385
+ );
12386
+ const hasItems = items.length > 0;
12387
+ const shippingOption = shipping_options == null ? void 0 : shipping_options.find(
12388
+ (option) => option.shipping_profile_id === profile.id
12389
+ );
12390
+ const shippingMethod = preview.shipping_methods.find(
12391
+ (method) => method.shipping_option_id === (shippingOption == null ? void 0 : shippingOption.id)
12392
+ );
12393
+ const addShippingMethodAction = (_a2 = shippingMethod == null ? void 0 : shippingMethod.actions) == null ? void 0 : _a2.find(
12394
+ (action) => action.action === "SHIPPING_ADD"
12395
+ );
12396
+ return /* @__PURE__ */ jsxRuntime.jsxs(
12397
+ radixUi.Accordion.Item,
12398
+ {
12399
+ value: profile.id,
12400
+ className: "bg-ui-bg-base shadow-elevation-card-rest rounded-lg",
12401
+ children: [
12402
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "px-3 py-2 flex items-center justify-between gap-3", children: [
12403
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-x-3 w-full overflow-hidden", children: [
12404
+ /* @__PURE__ */ jsxRuntime.jsx(radixUi.Accordion.Trigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(
12405
+ ui.IconButton,
12406
+ {
12407
+ size: "2xsmall",
12408
+ variant: "transparent",
12409
+ className: "group/trigger",
12410
+ disabled: !hasItems,
12411
+ children: /* @__PURE__ */ jsxRuntime.jsx(icons.TriangleRightMini, { className: "group-data-[state=open]/trigger:rotate-90 transition-transform" })
12412
+ }
12413
+ ) }),
12414
+ !shippingOption ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-x-3", children: [
12415
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "size-7 rounded-md shadow-borders-base flex items-center justify-center", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "size-6 rounded bg-ui-bg-component-hover flex items-center justify-center", children: /* @__PURE__ */ jsxRuntime.jsx(icons.Shopping, { className: "text-ui-fg-subtle" }) }) }),
12416
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col flex-1", children: [
12417
+ /* @__PURE__ */ jsxRuntime.jsx(
12418
+ ui.Text,
12419
+ {
12420
+ size: "small",
12421
+ weight: "plus",
12422
+ leading: "compact",
12423
+ children: profile.name
12424
+ }
12425
+ ),
12426
+ /* @__PURE__ */ jsxRuntime.jsxs(
12427
+ ui.Text,
12428
+ {
12429
+ size: "small",
12430
+ leading: "compact",
12431
+ className: "text-ui-fg-subtle",
12432
+ children: [
12433
+ items.length,
12434
+ " ",
12435
+ pluralize(items.length, "items", "item")
12436
+ ]
12437
+ }
12438
+ )
12439
+ ] })
12440
+ ] }) : /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-[5px] max-sm:flex-col max-sm:items-start flex-1 w-full overflow-hidden", children: [
12441
+ /* @__PURE__ */ jsxRuntime.jsx(
12442
+ ui.Tooltip,
12443
+ {
12444
+ content: /* @__PURE__ */ jsxRuntime.jsx("ul", { children: items.map((item) => {
12445
+ var _a3, _b2, _c2;
12446
+ return /* @__PURE__ */ jsxRuntime.jsx(
12447
+ "li",
12448
+ {
12449
+ children: `${item.quantity}x ${(_b2 = (_a3 = item.variant) == null ? void 0 : _a3.product) == null ? void 0 : _b2.title} (${(_c2 = item.variant) == null ? void 0 : _c2.title})`
12450
+ },
12451
+ item.id
12452
+ );
12453
+ }) }),
12454
+ children: /* @__PURE__ */ jsxRuntime.jsxs(
12455
+ ui.Badge,
12456
+ {
12457
+ className: "flex items-center gap-x-[3px] overflow-hidden cursor-default",
12458
+ size: "xsmall",
12459
+ children: [
12460
+ /* @__PURE__ */ jsxRuntime.jsx(icons.Shopping, { className: "shrink-0" }),
12461
+ /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "truncate", children: [
12462
+ items.reduce(
12463
+ (acc, item) => acc + item.quantity,
12464
+ 0
12465
+ ),
12466
+ "x",
12467
+ " ",
12468
+ pluralize(items.length, "items", "item")
12469
+ ] })
12470
+ ]
12471
+ }
12472
+ )
12473
+ }
12474
+ ),
12475
+ /* @__PURE__ */ jsxRuntime.jsx(
12476
+ ui.Tooltip,
12477
+ {
12478
+ content: (_d = (_c = (_b = shippingOption.service_zone) == null ? void 0 : _b.fulfillment_set) == null ? void 0 : _c.location) == null ? void 0 : _d.name,
12479
+ children: /* @__PURE__ */ jsxRuntime.jsxs(
12480
+ ui.Badge,
12481
+ {
12482
+ className: "flex items-center gap-x-[3px] overflow-hidden cursor-default",
12483
+ size: "xsmall",
12484
+ children: [
12485
+ /* @__PURE__ */ jsxRuntime.jsx(icons.Buildings, { className: "shrink-0" }),
12486
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "truncate", children: (_g = (_f = (_e = shippingOption.service_zone) == null ? void 0 : _e.fulfillment_set) == null ? void 0 : _f.location) == null ? void 0 : _g.name })
12487
+ ]
12488
+ }
12489
+ )
12490
+ }
12491
+ ),
12492
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Tooltip, { content: shippingOption.name, children: /* @__PURE__ */ jsxRuntime.jsxs(
12493
+ ui.Badge,
12494
+ {
12495
+ className: "flex items-center gap-x-[3px] overflow-hidden cursor-default",
12496
+ size: "xsmall",
12497
+ children: [
12498
+ /* @__PURE__ */ jsxRuntime.jsx(icons.TruckFast, { className: "shrink-0" }),
12499
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "truncate", children: shippingOption.name })
12500
+ ]
12501
+ }
12502
+ ) })
12503
+ ] })
12504
+ ] }),
12505
+ shippingOption ? /* @__PURE__ */ jsxRuntime.jsx(
12506
+ ActionMenu,
12507
+ {
12508
+ groups: [
12509
+ {
12510
+ actions: [
12511
+ hasItems ? {
12512
+ label: "Edit shipping option",
12513
+ icon: /* @__PURE__ */ jsxRuntime.jsx(icons.Channels, {}),
12514
+ onClick: () => {
12515
+ setIsOpen(
12516
+ STACKED_FOCUS_MODAL_ID,
12517
+ true
12518
+ );
12519
+ setData({
12520
+ shippingProfileId: profile.id,
12521
+ shippingOption,
12522
+ shippingMethod
12523
+ });
12524
+ }
12525
+ } : void 0,
12526
+ {
12527
+ label: "Remove shipping option",
12528
+ icon: /* @__PURE__ */ jsxRuntime.jsx(icons.Trash, {}),
12529
+ onClick: () => {
12530
+ if (shippingMethod) {
12531
+ if (addShippingMethodAction) {
12532
+ removeActionShippingMethod(
12533
+ addShippingMethodAction.id
12534
+ );
12535
+ } else {
12536
+ removeShippingMethod(
12537
+ shippingMethod.id
12538
+ );
12539
+ }
12540
+ }
12541
+ }
12542
+ }
12543
+ ].filter(Boolean)
12544
+ }
12545
+ ]
12546
+ }
12547
+ ) : /* @__PURE__ */ jsxRuntime.jsx(
12548
+ StackedModalTrigger,
12549
+ {
12550
+ shippingProfileId: profile.id,
12551
+ shippingOption,
12552
+ shippingMethod,
12553
+ setData,
12554
+ children: "Add shipping option"
12555
+ }
12556
+ )
12557
+ ] }),
12558
+ /* @__PURE__ */ jsxRuntime.jsxs(radixUi.Accordion.Content, { children: [
12559
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Divider, { variant: "dashed" }),
12560
+ items.map((item, idx) => {
12561
+ var _a3, _b2, _c2, _d2, _e2;
12562
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
12563
+ /* @__PURE__ */ jsxRuntime.jsxs(
12564
+ "div",
12565
+ {
12566
+ className: "px-3 flex items-center gap-x-3",
12567
+ children: [
12568
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-5 h-[56px] flex flex-col justify-center items-center", children: /* @__PURE__ */ jsxRuntime.jsx(
12569
+ ui.Divider,
12570
+ {
12571
+ variant: "dashed",
12572
+ orientation: "vertical"
12573
+ }
12574
+ ) }),
12575
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "py-2 flex items-center gap-x-3", children: [
12576
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "size-7 flex items-center justify-center tabular-nums", children: /* @__PURE__ */ jsxRuntime.jsxs(
12577
+ ui.Text,
12578
+ {
12579
+ size: "small",
12580
+ leading: "compact",
12581
+ className: "text-ui-fg-subtle",
12582
+ children: [
12583
+ item.quantity,
12584
+ "x"
12585
+ ]
12586
+ }
12587
+ ) }),
12588
+ /* @__PURE__ */ jsxRuntime.jsx(Thumbnail, { thumbnail: item.thumbnail }),
12589
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
12590
+ /* @__PURE__ */ jsxRuntime.jsxs(
12591
+ ui.Text,
12592
+ {
12593
+ size: "small",
12594
+ leading: "compact",
12595
+ weight: "plus",
12596
+ children: [
12597
+ (_b2 = (_a3 = item.variant) == null ? void 0 : _a3.product) == null ? void 0 : _b2.title,
12598
+ " (",
12599
+ (_c2 = item.variant) == null ? void 0 : _c2.title,
12600
+ ")"
12601
+ ]
12602
+ }
12603
+ ),
12604
+ /* @__PURE__ */ jsxRuntime.jsx(
12605
+ ui.Text,
12606
+ {
12607
+ size: "small",
12608
+ leading: "compact",
12609
+ className: "text-ui-fg-subtle",
12610
+ children: (_e2 = (_d2 = item.variant) == null ? void 0 : _d2.options) == null ? void 0 : _e2.map((option) => option.value).join(" · ")
12611
+ }
12612
+ )
12613
+ ] })
12614
+ ] })
12615
+ ]
12616
+ },
12617
+ item.id
12618
+ ),
12619
+ idx !== items.length - 1 && /* @__PURE__ */ jsxRuntime.jsx(ui.Divider, { variant: "dashed" })
12620
+ ] }, item.id);
12621
+ })
12622
+ ] })
12623
+ ]
12624
+ },
12625
+ profile.id
12626
+ );
12627
+ }) })
12628
+ ] }) })
12629
+ ] }) }),
12630
+ /* @__PURE__ */ jsxRuntime.jsx(
12631
+ StackedFocusModal,
12632
+ {
12633
+ id: STACKED_FOCUS_MODAL_ID,
12634
+ onOpenChangeCallback: (open) => {
12635
+ if (!open) {
12636
+ setData(null);
12637
+ }
12638
+ return open;
12639
+ },
12640
+ children: data && /* @__PURE__ */ jsxRuntime.jsx(ShippingProfileForm, { data, order, preview })
12641
+ }
12642
+ )
12871
12643
  ] }),
12872
- isReady && /* @__PURE__ */ jsxRuntime.jsx(BillingAddressForm, { order })
12644
+ /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-x-2", children: [
12645
+ /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", type: "button", children: "Cancel" }) }),
12646
+ /* @__PURE__ */ jsxRuntime.jsx(
12647
+ ui.Button,
12648
+ {
12649
+ size: "small",
12650
+ type: "button",
12651
+ isLoading: isSubmitting,
12652
+ onClick: onSubmit,
12653
+ children: "Save"
12654
+ }
12655
+ )
12656
+ ] }) })
12873
12657
  ] });
12874
12658
  };
12875
- const BillingAddressForm = ({ order }) => {
12876
- var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
12659
+ const StackedModalTrigger = ({
12660
+ shippingProfileId,
12661
+ shippingOption,
12662
+ shippingMethod,
12663
+ setData,
12664
+ children
12665
+ }) => {
12666
+ const { setIsOpen, getIsOpen } = useStackedModal();
12667
+ const isOpen = getIsOpen(STACKED_FOCUS_MODAL_ID);
12668
+ const onToggle = () => {
12669
+ if (isOpen) {
12670
+ setIsOpen(STACKED_FOCUS_MODAL_ID, false);
12671
+ setData(null);
12672
+ } else {
12673
+ setIsOpen(STACKED_FOCUS_MODAL_ID, true);
12674
+ setData({
12675
+ shippingProfileId,
12676
+ shippingOption,
12677
+ shippingMethod
12678
+ });
12679
+ }
12680
+ };
12681
+ return /* @__PURE__ */ jsxRuntime.jsx(
12682
+ ui.Button,
12683
+ {
12684
+ size: "small",
12685
+ variant: "secondary",
12686
+ onClick: onToggle,
12687
+ className: "text-ui-fg-primary shrink-0",
12688
+ children
12689
+ }
12690
+ );
12691
+ };
12692
+ const ShippingProfileForm = ({
12693
+ data,
12694
+ order,
12695
+ preview
12696
+ }) => {
12697
+ var _a, _b, _c, _d, _e, _f;
12698
+ const { setIsOpen } = useStackedModal();
12877
12699
  const form = reactHookForm.useForm({
12700
+ resolver: zod.zodResolver(shippingMethodSchema),
12878
12701
  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)
12702
+ location_id: (_d = (_c = (_b = (_a = data.shippingOption) == null ? void 0 : _a.service_zone) == null ? void 0 : _b.fulfillment_set) == null ? void 0 : _c.location) == null ? void 0 : _d.id,
12703
+ shipping_option_id: (_e = data.shippingOption) == null ? void 0 : _e.id,
12704
+ custom_amount: (_f = data.shippingMethod) == null ? void 0 : _f.amount
12705
+ }
12891
12706
  });
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 },
12707
+ const { mutateAsync: addShippingMethod, isPending } = useDraftOrderAddShippingMethod(order.id);
12708
+ const {
12709
+ mutateAsync: updateShippingMethod,
12710
+ isPending: isUpdatingShippingMethod
12711
+ } = useDraftOrderUpdateShippingMethod(order.id);
12712
+ const onSubmit = form.handleSubmit(async (values) => {
12713
+ if (lodash.isEqual(values, form.formState.defaultValues)) {
12714
+ setIsOpen(STACKED_FOCUS_MODAL_ID, false);
12715
+ return;
12716
+ }
12717
+ if (data.shippingMethod) {
12718
+ await updateShippingMethod(
12719
+ {
12720
+ method_id: data.shippingMethod.id,
12721
+ shipping_option_id: values.shipping_option_id,
12722
+ custom_amount: values.custom_amount ? convertNumber(values.custom_amount) : void 0
12723
+ },
12724
+ {
12725
+ onError: (e) => {
12726
+ ui.toast.error(e.message);
12727
+ },
12728
+ onSuccess: () => {
12729
+ setIsOpen(STACKED_FOCUS_MODAL_ID, false);
12730
+ }
12731
+ }
12732
+ );
12733
+ return;
12734
+ }
12735
+ await addShippingMethod(
12897
12736
  {
12898
- onSuccess: () => {
12899
- handleSuccess();
12737
+ shipping_option_id: values.shipping_option_id,
12738
+ custom_amount: values.custom_amount ? convertNumber(values.custom_amount) : void 0
12739
+ },
12740
+ {
12741
+ onError: (e) => {
12742
+ ui.toast.error(e.message);
12900
12743
  },
12901
- onError: (error) => {
12902
- ui.toast.error(error.message);
12744
+ onSuccess: () => {
12745
+ setIsOpen(STACKED_FOCUS_MODAL_ID, false);
12903
12746
  }
12904
12747
  }
12905
12748
  );
12906
12749
  });
12907
- return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
12750
+ return /* @__PURE__ */ jsxRuntime.jsx(StackedFocusModal.Content, { children: /* @__PURE__ */ jsxRuntime.jsx(Form$2, { ...form, children: /* @__PURE__ */ jsxRuntime.jsxs(
12908
12751
  KeyboundForm,
12909
12752
  {
12910
- className: "flex flex-1 flex-col overflow-hidden",
12753
+ className: "flex h-full flex-col overflow-hidden",
12911
12754
  onSubmit,
12912
12755
  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: [
12756
+ /* @__PURE__ */ jsxRuntime.jsx(StackedFocusModal.Header, {}),
12757
+ /* @__PURE__ */ jsxRuntime.jsx(StackedFocusModal.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: [
12758
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
12759
+ /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Shipping" }) }),
12760
+ /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", className: "text-ui-fg-subtle", children: "Add a shipping method for the selected shipping profile. You can see the items that will be shipped using this method in the preview below." }) })
12761
+ ] }),
12762
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Divider, { variant: "dashed" }),
12914
12763
  /* @__PURE__ */ jsxRuntime.jsx(
12915
- Form$2.Field,
12764
+ LocationField,
12916
12765
  {
12917
12766
  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
- ] })
12767
+ setValue: form.setValue
12924
12768
  }
12925
12769
  ),
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
- ] }),
12770
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Divider, { variant: "dashed" }),
12952
12771
  /* @__PURE__ */ jsxRuntime.jsx(
12953
- Form$2.Field,
12772
+ ShippingOptionField,
12954
12773
  {
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
- ] })
12774
+ shippingProfileId: data.shippingProfileId,
12775
+ preview,
12776
+ control: form.control
12962
12777
  }
12963
12778
  ),
12779
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Divider, { variant: "dashed" }),
12964
12780
  /* @__PURE__ */ jsxRuntime.jsx(
12965
- Form$2.Field,
12781
+ CustomAmountField,
12966
12782
  {
12967
12783
  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
- ] })
12784
+ currencyCode: order.currency_code
12974
12785
  }
12975
12786
  ),
12787
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Divider, { variant: "dashed" }),
12976
12788
  /* @__PURE__ */ jsxRuntime.jsx(
12977
- Form$2.Field,
12789
+ ItemsPreview,
12978
12790
  {
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, {})
12791
+ order,
12792
+ shippingProfileId: data.shippingProfileId
12793
+ }
12794
+ )
12795
+ ] }) }) }),
12796
+ /* @__PURE__ */ jsxRuntime.jsx(StackedFocusModal.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-x-2", children: [
12797
+ /* @__PURE__ */ jsxRuntime.jsx(StackedFocusModal.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", type: "button", children: "Cancel" }) }),
12798
+ /* @__PURE__ */ jsxRuntime.jsx(
12799
+ ui.Button,
12800
+ {
12801
+ size: "small",
12802
+ type: "submit",
12803
+ isLoading: isPending || isUpdatingShippingMethod,
12804
+ children: data.shippingMethod ? "Update" : "Add"
12805
+ }
12806
+ )
12807
+ ] }) })
12808
+ ]
12809
+ }
12810
+ ) }) });
12811
+ };
12812
+ const shippingMethodSchema = objectType({
12813
+ location_id: stringType(),
12814
+ shipping_option_id: stringType(),
12815
+ custom_amount: unionType([numberType(), stringType()]).optional()
12816
+ });
12817
+ const ItemsPreview = ({ order, shippingProfileId }) => {
12818
+ const matches = order.items.filter(
12819
+ (item) => {
12820
+ var _a, _b, _c;
12821
+ return ((_c = (_b = (_a = item.variant) == null ? void 0 : _a.product) == null ? void 0 : _b.shipping_profile) == null ? void 0 : _c.id) === shippingProfileId;
12822
+ }
12823
+ );
12824
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-y-6", children: [
12825
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid grid-cols-2 items-center gap-3", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col", children: [
12826
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", weight: "plus", leading: "compact", children: "Items to ship" }),
12827
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", className: "text-ui-fg-subtle", children: "Items with the selected shipping profile." })
12828
+ ] }) }),
12829
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-ui-bg-subtle shadow-elevation-card-rest rounded-xl", children: [
12830
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-3 px-4 py-2 text-ui-fg-muted", children: [
12831
+ /* @__PURE__ */ jsxRuntime.jsx("div", { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", weight: "plus", children: "Item" }) }),
12832
+ /* @__PURE__ */ jsxRuntime.jsx("div", { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", weight: "plus", children: "Quantity" }) })
12833
+ ] }),
12834
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col gap-y-1.5 px-[5px] pb-[5px]", children: matches.length > 0 ? matches == null ? void 0 : matches.map((item) => /* @__PURE__ */ jsxRuntime.jsxs(
12835
+ "div",
12836
+ {
12837
+ className: "grid grid-cols-2 gap-3 px-4 py-2 bg-ui-bg-base shadow-elevation-card-rest rounded-lg items-center",
12838
+ children: [
12839
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-x-3", children: [
12840
+ /* @__PURE__ */ jsxRuntime.jsx(
12841
+ Thumbnail,
12842
+ {
12843
+ thumbnail: item.thumbnail,
12844
+ alt: item.product_title ?? void 0
12845
+ }
12846
+ ),
12847
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col", children: [
12848
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-x-1", children: [
12849
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", weight: "plus", leading: "compact", children: item.product_title }),
12850
+ /* @__PURE__ */ jsxRuntime.jsxs(
12851
+ ui.Text,
12852
+ {
12853
+ size: "small",
12854
+ leading: "compact",
12855
+ className: "text-ui-fg-subtle",
12856
+ children: [
12857
+ "(",
12858
+ item.variant_title,
12859
+ ")"
12860
+ ]
12861
+ }
12862
+ )
12863
+ ] }),
12864
+ /* @__PURE__ */ jsxRuntime.jsx(
12865
+ ui.Text,
12866
+ {
12867
+ size: "small",
12868
+ leading: "compact",
12869
+ className: "text-ui-fg-subtle",
12870
+ children: item.variant_sku
12871
+ }
12872
+ )
12985
12873
  ] })
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,
12874
+ ] }),
12875
+ /* @__PURE__ */ jsxRuntime.jsxs(
12876
+ ui.Text,
13003
12877
  {
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
- ] })
12878
+ size: "small",
12879
+ leading: "compact",
12880
+ className: "text-ui-fg-subtle",
12881
+ children: [
12882
+ item.quantity,
12883
+ "x"
12884
+ ]
13011
12885
  }
13012
12886
  )
12887
+ ]
12888
+ },
12889
+ item.id
12890
+ )) : /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-center gap-x-3 bg-ui-bg-base rounded-lg p-4 shadow-elevation-card-rest flex-col gap-1", children: [
12891
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", weight: "plus", leading: "compact", children: "No items found" }),
12892
+ /* @__PURE__ */ jsxRuntime.jsxs(ui.Text, { size: "small", className: "text-ui-fg-subtle", children: [
12893
+ 'No items found for "',
12894
+ query,
12895
+ '".'
12896
+ ] })
12897
+ ] }) })
12898
+ ] })
12899
+ ] });
12900
+ };
12901
+ const LocationField = ({ control, setValue }) => {
12902
+ const locations = useComboboxData({
12903
+ queryKey: ["locations"],
12904
+ queryFn: async (params) => {
12905
+ return await sdk.admin.stockLocation.list(params);
12906
+ },
12907
+ getOptions: (data) => {
12908
+ return data.stock_locations.map((location) => ({
12909
+ label: location.name,
12910
+ value: location.id
12911
+ }));
12912
+ }
12913
+ });
12914
+ return /* @__PURE__ */ jsxRuntime.jsx(
12915
+ Form$2.Field,
12916
+ {
12917
+ control,
12918
+ name: "location_id",
12919
+ render: ({ field: { onChange, ...field } }) => {
12920
+ return /* @__PURE__ */ jsxRuntime.jsx(Form$2.Item, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-x-3", children: [
12921
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
12922
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Location" }),
12923
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Hint, { children: "Choose where you want to ship the items from." })
13013
12924
  ] }),
13014
- /* @__PURE__ */ jsxRuntime.jsx(
13015
- Form$2.Field,
12925
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
12926
+ Combobox,
13016
12927
  {
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
- ] })
12928
+ options: locations.options,
12929
+ fetchNextPage: locations.fetchNextPage,
12930
+ isFetchingNextPage: locations.isFetchingNextPage,
12931
+ searchValue: locations.searchValue,
12932
+ onSearchValueChange: locations.onSearchValueChange,
12933
+ placeholder: "Select location",
12934
+ onChange: (value) => {
12935
+ setValue("shipping_option_id", "", {
12936
+ shouldDirty: true,
12937
+ shouldTouch: true
12938
+ });
12939
+ onChange(value);
12940
+ },
12941
+ ...field
13024
12942
  }
13025
- ),
12943
+ ) })
12944
+ ] }) });
12945
+ }
12946
+ }
12947
+ );
12948
+ };
12949
+ const ShippingOptionField = ({
12950
+ shippingProfileId,
12951
+ preview,
12952
+ control
12953
+ }) => {
12954
+ var _a;
12955
+ const locationId = reactHookForm.useWatch({ control, name: "location_id" });
12956
+ const shippingOptions = useComboboxData({
12957
+ queryKey: ["shipping_options", locationId, shippingProfileId],
12958
+ queryFn: async (params) => {
12959
+ return await sdk.admin.shippingOption.list({
12960
+ ...params,
12961
+ stock_location_id: locationId,
12962
+ shipping_profile_id: shippingProfileId
12963
+ });
12964
+ },
12965
+ getOptions: (data) => {
12966
+ return data.shipping_options.map((option) => {
12967
+ var _a2;
12968
+ if ((_a2 = option.rules) == null ? void 0 : _a2.find(
12969
+ (r) => r.attribute === "is_return" && r.value === "true"
12970
+ )) {
12971
+ return void 0;
12972
+ }
12973
+ return {
12974
+ label: option.name,
12975
+ value: option.id
12976
+ };
12977
+ }).filter(Boolean);
12978
+ },
12979
+ enabled: !!locationId && !!shippingProfileId,
12980
+ defaultValue: ((_a = preview.shipping_methods[0]) == null ? void 0 : _a.shipping_option_id) || void 0
12981
+ });
12982
+ const tooltipContent = !locationId && !shippingProfileId ? "Choose a location and shipping profile first." : !locationId ? "Choose a location first." : "Choose a shipping profile first.";
12983
+ return /* @__PURE__ */ jsxRuntime.jsx(
12984
+ Form$2.Field,
12985
+ {
12986
+ control,
12987
+ name: "shipping_option_id",
12988
+ render: ({ field }) => {
12989
+ return /* @__PURE__ */ jsxRuntime.jsx(Form$2.Item, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-x-3", children: [
12990
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col", children: [
12991
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Shipping option" }),
12992
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Hint, { children: "Choose the shipping option to use." })
12993
+ ] }),
13026
12994
  /* @__PURE__ */ jsxRuntime.jsx(
13027
- Form$2.Field,
12995
+ ConditionalTooltip,
13028
12996
  {
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
- ] })
12997
+ content: tooltipContent,
12998
+ showTooltip: !locationId || !shippingProfileId,
12999
+ children: /* @__PURE__ */ jsxRuntime.jsx("div", { children: /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
13000
+ Combobox,
13001
+ {
13002
+ options: shippingOptions.options,
13003
+ fetchNextPage: shippingOptions.fetchNextPage,
13004
+ isFetchingNextPage: shippingOptions.isFetchingNextPage,
13005
+ searchValue: shippingOptions.searchValue,
13006
+ onSearchValueChange: shippingOptions.onSearchValueChange,
13007
+ placeholder: "Select shipping option",
13008
+ ...field,
13009
+ disabled: !locationId || !shippingProfileId
13010
+ }
13011
+ ) }) })
13036
13012
  }
13037
13013
  )
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
- ]
13014
+ ] }) });
13015
+ }
13044
13016
  }
13045
- ) });
13017
+ );
13018
+ };
13019
+ const CustomAmountField = ({
13020
+ control,
13021
+ currencyCode
13022
+ }) => {
13023
+ return /* @__PURE__ */ jsxRuntime.jsx(
13024
+ Form$2.Field,
13025
+ {
13026
+ control,
13027
+ name: "custom_amount",
13028
+ render: ({ field: { onChange, ...field } }) => {
13029
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-x-3", children: [
13030
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col", children: [
13031
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Custom amount" }),
13032
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Hint, { children: "Set a custom amount for the shipping option." })
13033
+ ] }),
13034
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
13035
+ ui.CurrencyInput,
13036
+ {
13037
+ ...field,
13038
+ onValueChange: (value) => onChange(value),
13039
+ symbol: getNativeSymbol(currencyCode),
13040
+ code: currencyCode
13041
+ }
13042
+ ) })
13043
+ ] });
13044
+ }
13045
+ }
13046
+ );
13046
13047
  };
13047
- const schema = addressSchema;
13048
13048
  const widgetModule = { widgets: [] };
13049
13049
  const routeModule = {
13050
13050
  routes: [
@@ -13065,6 +13065,10 @@ const routeModule = {
13065
13065
  handle,
13066
13066
  loader,
13067
13067
  children: [
13068
+ {
13069
+ Component: BillingAddress,
13070
+ path: "/draft-orders/:id/billing-address"
13071
+ },
13068
13072
  {
13069
13073
  Component: CustomItems,
13070
13074
  path: "/draft-orders/:id/custom-items"
@@ -13089,10 +13093,6 @@ const routeModule = {
13089
13093
  Component: SalesChannel,
13090
13094
  path: "/draft-orders/:id/sales-channel"
13091
13095
  },
13092
- {
13093
- Component: Shipping,
13094
- path: "/draft-orders/:id/shipping"
13095
- },
13096
13096
  {
13097
13097
  Component: ShippingAddress,
13098
13098
  path: "/draft-orders/:id/shipping-address"
@@ -13102,8 +13102,8 @@ const routeModule = {
13102
13102
  path: "/draft-orders/:id/transfer-ownership"
13103
13103
  },
13104
13104
  {
13105
- Component: BillingAddress,
13106
- path: "/draft-orders/:id/billing-address"
13105
+ Component: Shipping,
13106
+ path: "/draft-orders/:id/shipping"
13107
13107
  }
13108
13108
  ]
13109
13109
  }