@medusajs/draft-order 2.11.4-preview-20251106210130 → 2.11.4-preview-20251107000304

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 +1197 -1197
  2. package/.medusa/server/src/admin/index.mjs +1197 -1197
  3. package/package.json +16 -16
package/.medusa/server/src/admin/index.js CHANGED
@@ -9568,6 +9568,27 @@ const ID = () => {
9568
9568
  /* @__PURE__ */ jsxRuntime.jsx(reactRouterDom.Outlet, {})
9569
9569
  ] });
9570
9570
  };
9571
+ const CustomItems = () => {
9572
+ return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
9573
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Header, { children: /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Custom Items" }) }) }),
9574
+ /* @__PURE__ */ jsxRuntime.jsx(CustomItemsForm, {})
9575
+ ] });
9576
+ };
9577
+ const CustomItemsForm = () => {
9578
+ const form = reactHookForm.useForm({
9579
+ resolver: zod.zodResolver(schema$5)
9580
+ });
9581
+ return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(KeyboundForm, { className: "flex flex-1 flex-col", children: [
9582
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, {}),
9583
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
9584
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
9585
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", children: "Save" })
9586
+ ] }) })
9587
+ ] }) });
9588
+ };
9589
+ const schema$5 = objectType({
9590
+ email: stringType().email()
9591
+ });
9571
9592
  const BillingAddress = () => {
9572
9593
  const { id } = reactRouterDom.useParams();
9573
9594
  const { order, isPending, isError, error } = useOrder(id, {
@@ -9600,7 +9621,7 @@ const BillingAddressForm = ({ order }) => {
9600
9621
  postal_code: ((_i = order.billing_address) == null ? void 0 : _i.postal_code) ?? "",
9601
9622
  phone: ((_j = order.billing_address) == null ? void 0 : _j.phone) ?? ""
9602
9623
  },
9603
- resolver: zod.zodResolver(schema$5)
9624
+ resolver: zod.zodResolver(schema$4)
9604
9625
  });
9605
9626
  const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
9606
9627
  const { handleSuccess } = useRouteModal();
@@ -9757,28 +9778,7 @@ const BillingAddressForm = ({ order }) => {
9757
9778
  }
9758
9779
  ) });
9759
9780
  };
9760
- const schema$5 = addressSchema;
9761
- const CustomItems = () => {
9762
- return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
9763
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Header, { children: /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Custom Items" }) }) }),
9764
- /* @__PURE__ */ jsxRuntime.jsx(CustomItemsForm, {})
9765
- ] });
9766
- };
9767
- const CustomItemsForm = () => {
9768
- const form = reactHookForm.useForm({
9769
- resolver: zod.zodResolver(schema$4)
9770
- });
9771
- return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(KeyboundForm, { className: "flex flex-1 flex-col", children: [
9772
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, {}),
9773
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
9774
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
9775
- /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", children: "Save" })
9776
- ] }) })
9777
- ] }) });
9778
- };
9779
- const schema$4 = objectType({
9780
- email: stringType().email()
9781
- });
9781
+ const schema$4 = addressSchema;
9782
9782
  const Email = () => {
9783
9783
  const { id } = reactRouterDom.useParams();
9784
9784
  const { order, isPending, isError, error } = useOrder(id, {
@@ -11554,821 +11554,142 @@ const SalesChannelField = ({ control, order }) => {
11554
11554
  const schema$2 = objectType({
11555
11555
  sales_channel_id: stringType().min(1)
11556
11556
  });
11557
- const ShippingAddress = () => {
11557
+ const STACKED_FOCUS_MODAL_ID = "shipping-form";
11558
+ const Shipping = () => {
11559
+ var _a;
11558
11560
  const { id } = reactRouterDom.useParams();
11559
11561
  const { order, isPending, isError, error } = useOrder(id, {
11560
- fields: "+shipping_address"
11562
+ fields: "+items.*,+items.variant.*,+items.variant.product.*,+items.variant.product.shipping_profile.*,+currency_code"
11561
11563
  });
11564
+ const {
11565
+ order: preview,
11566
+ isPending: isPreviewPending,
11567
+ isError: isPreviewError,
11568
+ error: previewError
11569
+ } = useOrderPreview(id);
11570
+ useInitiateOrderEdit({ preview });
11571
+ const { onCancel } = useCancelOrderEdit({ preview });
11562
11572
  if (isError) {
11563
11573
  throw error;
11564
11574
  }
11565
- const isReady = !isPending && !!order;
11566
- return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
11567
- /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
11568
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Shipping Address" }) }),
11569
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit the shipping address for the draft order" }) })
11570
- ] }),
11571
- isReady && /* @__PURE__ */ jsxRuntime.jsx(ShippingAddressForm, { order })
11572
- ] });
11575
+ if (isPreviewError) {
11576
+ throw previewError;
11577
+ }
11578
+ const orderHasItems = (((_a = order == null ? void 0 : order.items) == null ? void 0 : _a.length) || 0) > 0;
11579
+ const isReady = preview && !isPreviewPending && order && !isPending;
11580
+ return /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal, { onClose: onCancel, children: !orderHasItems ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex h-full flex-col overflow-hidden ", children: [
11581
+ /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Header, {}),
11582
+ /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Body, { className: "flex flex-1 flex-col overflow-hidden", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-1 flex-col items-center overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex w-full max-w-[720px] flex-col gap-y-6 px-6 py-16", children: [
11583
+ /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Shipping" }) }),
11584
+ /* @__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." }) })
11585
+ ] }) }) }),
11586
+ /* @__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" }) }) })
11587
+ ] }) : isReady ? /* @__PURE__ */ jsxRuntime.jsx(ShippingForm, { preview, order }) : /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
11588
+ /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit Shipping" }) }),
11589
+ /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Loading data for the draft order, please wait..." }) })
11590
+ ] }) });
11573
11591
  };
11574
- const ShippingAddressForm = ({ order }) => {
11575
- var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
11576
- const form = reactHookForm.useForm({
11577
- defaultValues: {
11578
- first_name: ((_a = order.shipping_address) == null ? void 0 : _a.first_name) ?? "",
11579
- last_name: ((_b = order.shipping_address) == null ? void 0 : _b.last_name) ?? "",
11580
- company: ((_c = order.shipping_address) == null ? void 0 : _c.company) ?? "",
11581
- address_1: ((_d = order.shipping_address) == null ? void 0 : _d.address_1) ?? "",
11582
- address_2: ((_e = order.shipping_address) == null ? void 0 : _e.address_2) ?? "",
11583
- city: ((_f = order.shipping_address) == null ? void 0 : _f.city) ?? "",
11584
- province: ((_g = order.shipping_address) == null ? void 0 : _g.province) ?? "",
11585
- country_code: ((_h = order.shipping_address) == null ? void 0 : _h.country_code) ?? "",
11586
- postal_code: ((_i = order.shipping_address) == null ? void 0 : _i.postal_code) ?? "",
11587
- phone: ((_j = order.shipping_address) == null ? void 0 : _j.phone) ?? ""
11592
+ const ShippingForm = ({ preview, order }) => {
11593
+ var _a;
11594
+ const { setIsOpen } = useStackedModal();
11595
+ const [isSubmitting, setIsSubmitting] = React.useState(false);
11596
+ const [data, setData] = React.useState(null);
11597
+ const appliedShippingOptionIds = (_a = preview.shipping_methods) == null ? void 0 : _a.map((method) => method.shipping_option_id).filter(Boolean);
11598
+ const { shipping_options } = useShippingOptions(
11599
+ {
11600
+ id: appliedShippingOptionIds,
11601
+ fields: "+service_zone.*,+service_zone.fulfillment_set.*,+service_zone.fulfillment_set.location.*"
11588
11602
  },
11589
- resolver: zod.zodResolver(schema$1)
11590
- });
11591
- const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
11603
+ {
11604
+ enabled: appliedShippingOptionIds.length > 0
11605
+ }
11606
+ );
11607
+ const uniqueShippingProfiles = React.useMemo(() => {
11608
+ const profiles = /* @__PURE__ */ new Map();
11609
+ getUniqueShippingProfiles(order.items).forEach((profile) => {
11610
+ profiles.set(profile.id, profile);
11611
+ });
11612
+ shipping_options == null ? void 0 : shipping_options.forEach((option) => {
11613
+ profiles.set(option.shipping_profile_id, option.shipping_profile);
11614
+ });
11615
+ return Array.from(profiles.values());
11616
+ }, [order.items, shipping_options]);
11592
11617
  const { handleSuccess } = useRouteModal();
11593
- const onSubmit = form.handleSubmit(async (data) => {
11594
- await mutateAsync(
11595
- {
11596
- shipping_address: {
11597
- first_name: data.first_name,
11598
- last_name: data.last_name,
11599
- company: data.company,
11600
- address_1: data.address_1,
11601
- address_2: data.address_2,
11602
- city: data.city,
11603
- province: data.province,
11604
- country_code: data.country_code,
11605
- postal_code: data.postal_code,
11606
- phone: data.phone
11607
- }
11618
+ const { mutateAsync: confirmOrderEdit } = useDraftOrderConfirmEdit(preview.id);
11619
+ const { mutateAsync: requestOrderEdit } = useDraftOrderRequestEdit(preview.id);
11620
+ const { mutateAsync: removeShippingMethod } = useDraftOrderRemoveShippingMethod(preview.id);
11621
+ const { mutateAsync: removeActionShippingMethod } = useDraftOrderRemoveActionShippingMethod(preview.id);
11622
+ const onSubmit = async () => {
11623
+ setIsSubmitting(true);
11624
+ let requestSucceeded = false;
11625
+ await requestOrderEdit(void 0, {
11626
+ onError: (e) => {
11627
+ ui.toast.error(`Failed to request order edit: ${e.message}`);
11608
11628
  },
11609
- {
11610
- onSuccess: () => {
11611
- handleSuccess();
11612
- },
11613
- onError: (error) => {
11614
- ui.toast.error(error.message);
11629
+ onSuccess: () => {
11630
+ requestSucceeded = true;
11631
+ }
11632
+ });
11633
+ if (!requestSucceeded) {
11634
+ setIsSubmitting(false);
11635
+ return;
11636
+ }
11637
+ await confirmOrderEdit(void 0, {
11638
+ onError: (e) => {
11639
+ ui.toast.error(`Failed to confirm order edit: ${e.message}`);
11640
+ },
11641
+ onSuccess: () => {
11642
+ handleSuccess();
11643
+ },
11644
+ onSettled: () => {
11645
+ setIsSubmitting(false);
11646
+ }
11647
+ });
11648
+ };
11649
+ const onKeydown = React.useCallback(
11650
+ (e) => {
11651
+ if (e.key === "Enter" && (e.ctrlKey || e.metaKey)) {
11652
+ if (data || isSubmitting) {
11653
+ return;
11615
11654
  }
11655
+ onSubmit();
11616
11656
  }
11617
- );
11618
- });
11619
- return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
11620
- KeyboundForm,
11621
- {
11622
- className: "flex flex-1 flex-col overflow-hidden",
11623
- onSubmit,
11624
- children: [
11625
- /* @__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: [
11626
- /* @__PURE__ */ jsxRuntime.jsx(
11627
- Form$2.Field,
11628
- {
11629
- control: form.control,
11630
- name: "country_code",
11631
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11632
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Country" }),
11633
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(CountrySelect, { ...field }) }),
11634
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11635
- ] })
11636
- }
11637
- ),
11638
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
11657
+ },
11658
+ [data, isSubmitting, onSubmit]
11659
+ );
11660
+ React.useEffect(() => {
11661
+ document.addEventListener("keydown", onKeydown);
11662
+ return () => {
11663
+ document.removeEventListener("keydown", onKeydown);
11664
+ };
11665
+ }, [onKeydown]);
11666
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex h-full flex-col overflow-hidden", children: [
11667
+ /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Header, {}),
11668
+ /* @__PURE__ */ jsxRuntime.jsxs(RouteFocusModal.Body, { className: "flex flex-1 flex-col overflow-hidden", children: [
11669
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-1 flex-col items-center overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex w-full max-w-[720px] flex-col gap-y-6 px-6 py-16", children: [
11670
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
11671
+ /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Shipping" }) }),
11672
+ /* @__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." }) })
11673
+ ] }),
11674
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Divider, { variant: "dashed" }),
11675
+ /* @__PURE__ */ jsxRuntime.jsx(radixUi.Accordion.Root, { type: "multiple", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-ui-bg-subtle shadow-elevation-card-rest rounded-xl", children: [
11676
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between px-4 py-2", children: [
11639
11677
  /* @__PURE__ */ jsxRuntime.jsx(
11640
- Form$2.Field,
11678
+ ui.Text,
11641
11679
  {
11642
- control: form.control,
11643
- name: "first_name",
11644
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11645
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "First name" }),
11646
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11647
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11648
- ] })
11680
+ size: "xsmall",
11681
+ weight: "plus",
11682
+ className: "text-ui-fg-muted",
11683
+ children: "Shipping profile"
11649
11684
  }
11650
11685
  ),
11651
11686
  /* @__PURE__ */ jsxRuntime.jsx(
11652
- Form$2.Field,
11687
+ ui.Text,
11653
11688
  {
11654
- control: form.control,
11655
- name: "last_name",
11656
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11657
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Last name" }),
11658
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11659
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11660
- ] })
11661
- }
11662
- )
11663
- ] }),
11664
- /* @__PURE__ */ jsxRuntime.jsx(
11665
- Form$2.Field,
11666
- {
11667
- control: form.control,
11668
- name: "company",
11669
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11670
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Company" }),
11671
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11672
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11673
- ] })
11674
- }
11675
- ),
11676
- /* @__PURE__ */ jsxRuntime.jsx(
11677
- Form$2.Field,
11678
- {
11679
- control: form.control,
11680
- name: "address_1",
11681
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11682
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Address" }),
11683
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11684
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11685
- ] })
11686
- }
11687
- ),
11688
- /* @__PURE__ */ jsxRuntime.jsx(
11689
- Form$2.Field,
11690
- {
11691
- control: form.control,
11692
- name: "address_2",
11693
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11694
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Apartment, suite, etc." }),
11695
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11696
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11697
- ] })
11698
- }
11699
- ),
11700
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
11701
- /* @__PURE__ */ jsxRuntime.jsx(
11702
- Form$2.Field,
11703
- {
11704
- control: form.control,
11705
- name: "postal_code",
11706
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11707
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Postal code" }),
11708
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11709
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11710
- ] })
11711
- }
11712
- ),
11713
- /* @__PURE__ */ jsxRuntime.jsx(
11714
- Form$2.Field,
11715
- {
11716
- control: form.control,
11717
- name: "city",
11718
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11719
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "City" }),
11720
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11721
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11722
- ] })
11723
- }
11724
- )
11725
- ] }),
11726
- /* @__PURE__ */ jsxRuntime.jsx(
11727
- Form$2.Field,
11728
- {
11729
- control: form.control,
11730
- name: "province",
11731
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11732
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Province / State" }),
11733
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11734
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11735
- ] })
11736
- }
11737
- ),
11738
- /* @__PURE__ */ jsxRuntime.jsx(
11739
- Form$2.Field,
11740
- {
11741
- control: form.control,
11742
- name: "phone",
11743
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11744
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Phone" }),
11745
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11746
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11747
- ] })
11748
- }
11749
- )
11750
- ] }) }),
11751
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
11752
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
11753
- /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
11754
- ] }) })
11755
- ]
11756
- }
11757
- ) });
11758
- };
11759
- const schema$1 = addressSchema;
11760
- const TransferOwnership = () => {
11761
- const { id } = reactRouterDom.useParams();
11762
- const { draft_order, isPending, isError, error } = useDraftOrder(id, {
11763
- fields: "id,customer_id,customer.*"
11764
- });
11765
- if (isError) {
11766
- throw error;
11767
- }
11768
- const isReady = !isPending && !!draft_order;
11769
- return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
11770
- /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
11771
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Transfer Ownership" }) }),
11772
- /* @__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" }) })
11773
- ] }),
11774
- isReady && /* @__PURE__ */ jsxRuntime.jsx(TransferOwnershipForm, { order: draft_order })
11775
- ] });
11776
- };
11777
- const TransferOwnershipForm = ({ order }) => {
11778
- var _a, _b;
11779
- const form = reactHookForm.useForm({
11780
- defaultValues: {
11781
- customer_id: order.customer_id || ""
11782
- },
11783
- resolver: zod.zodResolver(schema)
11784
- });
11785
- const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
11786
- const { handleSuccess } = useRouteModal();
11787
- const name = [(_a = order.customer) == null ? void 0 : _a.first_name, (_b = order.customer) == null ? void 0 : _b.last_name].filter(Boolean).join(" ");
11788
- const currentCustomer = order.customer ? {
11789
- label: name ? `${name} (${order.customer.email})` : order.customer.email,
11790
- value: order.customer.id
11791
- } : null;
11792
- const onSubmit = form.handleSubmit(async (data) => {
11793
- await mutateAsync(
11794
- { customer_id: data.customer_id },
11795
- {
11796
- onSuccess: () => {
11797
- ui.toast.success("Customer updated");
11798
- handleSuccess();
11799
- },
11800
- onError: (error) => {
11801
- ui.toast.error(error.message);
11802
- }
11803
- }
11804
- );
11805
- });
11806
- return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
11807
- KeyboundForm,
11808
- {
11809
- className: "flex flex-1 flex-col overflow-hidden",
11810
- onSubmit,
11811
- children: [
11812
- /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: [
11813
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center justify-center bg-ui-bg-component rounded-md border", children: /* @__PURE__ */ jsxRuntime.jsx(Illustration, {}) }),
11814
- currentCustomer && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col space-y-3", children: [
11815
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col", children: [
11816
- /* @__PURE__ */ jsxRuntime.jsx(ui.Label, { size: "small", weight: "plus", htmlFor: "current-customer", children: "Current owner" }),
11817
- /* @__PURE__ */ jsxRuntime.jsx(ui.Hint, { children: "The customer that is currently associated with this draft order." })
11818
- ] }),
11819
- /* @__PURE__ */ jsxRuntime.jsxs(ui.Select, { disabled: true, value: currentCustomer.value, children: [
11820
- /* @__PURE__ */ jsxRuntime.jsx(ui.Select.Trigger, { id: "current-customer", children: /* @__PURE__ */ jsxRuntime.jsx(ui.Select.Value, {}) }),
11821
- /* @__PURE__ */ jsxRuntime.jsx(ui.Select.Content, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Select.Item, { value: currentCustomer.value, children: currentCustomer.label }) })
11822
- ] })
11823
- ] }),
11824
- /* @__PURE__ */ jsxRuntime.jsx(
11825
- CustomerField,
11826
- {
11827
- control: form.control,
11828
- currentCustomerId: order.customer_id
11829
- }
11830
- )
11831
- ] }),
11832
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
11833
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { variant: "secondary", size: "small", children: "Cancel" }) }),
11834
- /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
11835
- ] }) })
11836
- ]
11837
- }
11838
- ) });
11839
- };
11840
- const CustomerField = ({ control, currentCustomerId }) => {
11841
- const customers = useComboboxData({
11842
- queryFn: async (params) => {
11843
- return await sdk.admin.customer.list({
11844
- ...params,
11845
- id: currentCustomerId ? { $nin: [currentCustomerId] } : void 0
11846
- });
11847
- },
11848
- queryKey: ["customers"],
11849
- getOptions: (data) => {
11850
- return data.customers.map((customer) => {
11851
- const name = [customer.first_name, customer.last_name].filter(Boolean).join(" ");
11852
- return {
11853
- label: name ? `${name} (${customer.email})` : customer.email,
11854
- value: customer.id
11855
- };
11856
- });
11857
- }
11858
- });
11859
- return /* @__PURE__ */ jsxRuntime.jsx(
11860
- Form$2.Field,
11861
- {
11862
- name: "customer_id",
11863
- control,
11864
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { className: "space-y-3", children: [
11865
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col", children: [
11866
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "New customer" }),
11867
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Hint, { children: "The customer to transfer this draft order to." })
11868
- ] }),
11869
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
11870
- Combobox,
11871
- {
11872
- options: customers.options,
11873
- fetchNextPage: customers.fetchNextPage,
11874
- isFetchingNextPage: customers.isFetchingNextPage,
11875
- searchValue: customers.searchValue,
11876
- onSearchValueChange: customers.onSearchValueChange,
11877
- placeholder: "Select customer",
11878
- ...field
11879
- }
11880
- ) }),
11881
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11882
- ] })
11883
- }
11884
- );
11885
- };
11886
- const Illustration = () => {
11887
- return /* @__PURE__ */ jsxRuntime.jsxs(
11888
- "svg",
11889
- {
11890
- width: "280",
11891
- height: "180",
11892
- viewBox: "0 0 280 180",
11893
- fill: "none",
11894
- xmlns: "http://www.w3.org/2000/svg",
11895
- children: [
11896
- /* @__PURE__ */ jsxRuntime.jsx(
11897
- "rect",
11898
- {
11899
- x: "0.00428286",
11900
- y: "-0.742904",
11901
- width: "33.5",
11902
- height: "65.5",
11903
- rx: "6.75",
11904
- transform: "matrix(0.865865 0.500278 -0.871576 0.490261 189.756 88.438)",
11905
- fill: "#D4D4D8",
11906
- stroke: "#52525B",
11907
- strokeWidth: "1.5"
11908
- }
11909
- ),
11910
- /* @__PURE__ */ jsxRuntime.jsx(
11911
- "rect",
11912
- {
11913
- x: "0.00428286",
11914
- y: "-0.742904",
11915
- width: "33.5",
11916
- height: "65.5",
11917
- rx: "6.75",
11918
- transform: "matrix(0.865865 0.500278 -0.871576 0.490261 189.756 85.4381)",
11919
- fill: "white",
11920
- stroke: "#52525B",
11921
- strokeWidth: "1.5"
11922
- }
11923
- ),
11924
- /* @__PURE__ */ jsxRuntime.jsx(
11925
- "path",
11926
- {
11927
- d: "M180.579 107.142L179.126 107.959",
11928
- stroke: "#52525B",
11929
- strokeWidth: "1.5",
11930
- strokeLinecap: "round",
11931
- strokeLinejoin: "round"
11932
- }
11933
- ),
11934
- /* @__PURE__ */ jsxRuntime.jsx(
11935
- "path",
11936
- {
11937
- opacity: "0.88",
11938
- d: "M182.305 109.546L180.257 109.534",
11939
- stroke: "#52525B",
11940
- strokeWidth: "1.5",
11941
- strokeLinecap: "round",
11942
- strokeLinejoin: "round"
11943
- }
11944
- ),
11945
- /* @__PURE__ */ jsxRuntime.jsx(
11946
- "path",
11947
- {
11948
- opacity: "0.75",
11949
- d: "M180.551 111.93L179.108 111.096",
11950
- stroke: "#52525B",
11951
- strokeWidth: "1.5",
11952
- strokeLinecap: "round",
11953
- strokeLinejoin: "round"
11954
- }
11955
- ),
11956
- /* @__PURE__ */ jsxRuntime.jsx(
11957
- "path",
11958
- {
11959
- opacity: "0.63",
11960
- d: "M176.347 112.897L176.354 111.73",
11961
- stroke: "#52525B",
11962
- strokeWidth: "1.5",
11963
- strokeLinecap: "round",
11964
- strokeLinejoin: "round"
11965
- }
11966
- ),
11967
- /* @__PURE__ */ jsxRuntime.jsx(
11968
- "path",
11969
- {
11970
- opacity: "0.5",
11971
- d: "M172.153 111.881L173.606 111.064",
11972
- stroke: "#52525B",
11973
- strokeWidth: "1.5",
11974
- strokeLinecap: "round",
11975
- strokeLinejoin: "round"
11976
- }
11977
- ),
11978
- /* @__PURE__ */ jsxRuntime.jsx(
11979
- "path",
11980
- {
11981
- opacity: "0.38",
11982
- d: "M170.428 109.478L172.476 109.489",
11983
- stroke: "#52525B",
11984
- strokeWidth: "1.5",
11985
- strokeLinecap: "round",
11986
- strokeLinejoin: "round"
11987
- }
11988
- ),
11989
- /* @__PURE__ */ jsxRuntime.jsx(
11990
- "path",
11991
- {
11992
- opacity: "0.25",
11993
- d: "M172.181 107.094L173.624 107.928",
11994
- stroke: "#52525B",
11995
- strokeWidth: "1.5",
11996
- strokeLinecap: "round",
11997
- strokeLinejoin: "round"
11998
- }
11999
- ),
12000
- /* @__PURE__ */ jsxRuntime.jsx(
12001
- "path",
12002
- {
12003
- opacity: "0.13",
12004
- d: "M176.386 106.126L176.379 107.294",
12005
- stroke: "#52525B",
12006
- strokeWidth: "1.5",
12007
- strokeLinecap: "round",
12008
- strokeLinejoin: "round"
12009
- }
12010
- ),
12011
- /* @__PURE__ */ jsxRuntime.jsx(
12012
- "rect",
12013
- {
12014
- width: "12",
12015
- height: "3",
12016
- rx: "1.5",
12017
- transform: "matrix(0.865865 0.500278 -0.871576 0.490261 196.447 92.2925)",
12018
- fill: "#D4D4D8"
12019
- }
12020
- ),
12021
- /* @__PURE__ */ jsxRuntime.jsx(
12022
- "rect",
12023
- {
12024
- x: "0.00428286",
12025
- y: "-0.742904",
12026
- width: "33.5",
12027
- height: "65.5",
12028
- rx: "6.75",
12029
- transform: "matrix(0.865865 0.500278 -0.871576 0.490261 117.023 46.4147)",
12030
- fill: "#D4D4D8",
12031
- stroke: "#52525B",
12032
- strokeWidth: "1.5"
12033
- }
12034
- ),
12035
- /* @__PURE__ */ jsxRuntime.jsx(
12036
- "rect",
12037
- {
12038
- x: "0.00428286",
12039
- y: "-0.742904",
12040
- width: "33.5",
12041
- height: "65.5",
12042
- rx: "6.75",
12043
- transform: "matrix(0.865865 0.500278 -0.871576 0.490261 117.023 43.4147)",
12044
- fill: "white",
12045
- stroke: "#52525B",
12046
- strokeWidth: "1.5"
12047
- }
12048
- ),
12049
- /* @__PURE__ */ jsxRuntime.jsx(
12050
- "rect",
12051
- {
12052
- width: "12",
12053
- height: "3",
12054
- rx: "1.5",
12055
- transform: "matrix(0.865865 0.500278 -0.871576 0.490261 123.714 50.2691)",
12056
- fill: "#D4D4D8"
12057
- }
12058
- ),
12059
- /* @__PURE__ */ jsxRuntime.jsx(
12060
- "rect",
12061
- {
12062
- width: "17",
12063
- height: "3",
12064
- rx: "1.5",
12065
- transform: "matrix(0.865865 0.500278 -0.871576 0.490261 97.5557 66.958)",
12066
- fill: "#D4D4D8"
12067
- }
12068
- ),
12069
- /* @__PURE__ */ jsxRuntime.jsx(
12070
- "rect",
12071
- {
12072
- width: "12",
12073
- height: "3",
12074
- rx: "1.5",
12075
- transform: "matrix(0.865865 0.500278 -0.871576 0.490261 93.1978 69.4093)",
12076
- fill: "#D4D4D8"
12077
- }
12078
- ),
12079
- /* @__PURE__ */ jsxRuntime.jsx(
12080
- "path",
12081
- {
12082
- d: "M92.3603 63.9563C90.9277 63.1286 88.59 63.1152 87.148 63.9263C85.7059 64.7374 85.6983 66.0702 87.1308 66.8979C88.5634 67.7256 90.9011 67.7391 92.3432 66.928C93.7852 66.1168 93.7929 64.784 92.3603 63.9563ZM88.4382 66.1625C87.7221 65.7488 87.726 65.0822 88.4468 64.6767C89.1676 64.2713 90.3369 64.278 91.0529 64.6917C91.769 65.1055 91.7652 65.7721 91.0444 66.1775C90.3236 66.583 89.1543 66.5762 88.4382 66.1625Z",
12083
- fill: "#A1A1AA"
12084
- }
12085
- ),
12086
- /* @__PURE__ */ jsxRuntime.jsx(
12087
- "rect",
12088
- {
12089
- width: "17",
12090
- height: "3",
12091
- rx: "1.5",
12092
- transform: "matrix(0.865865 0.500278 -0.871576 0.490261 109.758 60.0944)",
12093
- fill: "#A1A1AA"
12094
- }
12095
- ),
12096
- /* @__PURE__ */ jsxRuntime.jsx(
12097
- "rect",
12098
- {
12099
- width: "12",
12100
- height: "3",
12101
- rx: "1.5",
12102
- transform: "matrix(0.865865 0.500278 -0.871576 0.490261 105.4 62.5457)",
12103
- fill: "#A1A1AA"
12104
- }
12105
- ),
12106
- /* @__PURE__ */ jsxRuntime.jsx(
12107
- "path",
12108
- {
12109
- d: "M104.562 57.0927C103.13 56.265 100.792 56.2515 99.3501 57.0626C97.9081 57.8738 97.9004 59.2065 99.333 60.0343C100.766 60.862 103.103 60.8754 104.545 60.0643C105.987 59.2532 105.995 57.9204 104.562 57.0927ZM103.858 58.8972L100.815 59.1265C100.683 59.1367 100.55 59.1134 100.449 59.063C100.44 59.0585 100.432 59.0545 100.425 59.05C100.339 59.0005 100.29 58.9336 100.291 58.8637L100.294 58.1201C100.294 57.9752 100.501 57.8585 100.756 57.86C101.01 57.8615 101.217 57.98 101.216 58.1256L101.214 58.5669L103.732 58.3769C103.984 58.3578 104.217 58.4584 104.251 58.603C104.286 58.7468 104.11 58.8788 103.858 58.8977L103.858 58.8972Z",
12110
- fill: "#52525B"
12111
- }
12112
- ),
12113
- /* @__PURE__ */ jsxRuntime.jsx("g", { clipPath: "url(#clip0_20915_38670)", children: /* @__PURE__ */ jsxRuntime.jsx(
12114
- "path",
12115
- {
12116
- d: "M133.106 81.8022L140.49 81.8447L140.515 77.6349",
12117
- stroke: "#A1A1AA",
12118
- strokeWidth: "1.5",
12119
- strokeLinecap: "round",
12120
- strokeLinejoin: "round"
12121
- }
12122
- ) }),
12123
- /* @__PURE__ */ jsxRuntime.jsx("g", { clipPath: "url(#clip1_20915_38670)", children: /* @__PURE__ */ jsxRuntime.jsx(
12124
- "path",
12125
- {
12126
- d: "M143.496 87.8055L150.881 87.8481L150.905 83.6383",
12127
- stroke: "#A1A1AA",
12128
- strokeWidth: "1.5",
12129
- strokeLinecap: "round",
12130
- strokeLinejoin: "round"
12131
- }
12132
- ) }),
12133
- /* @__PURE__ */ jsxRuntime.jsx("g", { clipPath: "url(#clip2_20915_38670)", children: /* @__PURE__ */ jsxRuntime.jsx(
12134
- "path",
12135
- {
12136
- d: "M153.887 93.8088L161.271 93.8514L161.295 89.6416",
12137
- stroke: "#A1A1AA",
12138
- strokeWidth: "1.5",
12139
- strokeLinecap: "round",
12140
- strokeLinejoin: "round"
12141
- }
12142
- ) }),
12143
- /* @__PURE__ */ jsxRuntime.jsx("g", { clipPath: "url(#clip3_20915_38670)", children: /* @__PURE__ */ jsxRuntime.jsx(
12144
- "path",
12145
- {
12146
- d: "M126.114 89.1912L118.729 89.1486L118.705 93.3584",
12147
- stroke: "#A1A1AA",
12148
- strokeWidth: "1.5",
12149
- strokeLinecap: "round",
12150
- strokeLinejoin: "round"
12151
- }
12152
- ) }),
12153
- /* @__PURE__ */ jsxRuntime.jsx("g", { clipPath: "url(#clip4_20915_38670)", children: /* @__PURE__ */ jsxRuntime.jsx(
12154
- "path",
12155
- {
12156
- d: "M136.504 95.1945L129.12 95.1519L129.095 99.3617",
12157
- stroke: "#A1A1AA",
12158
- strokeWidth: "1.5",
12159
- strokeLinecap: "round",
12160
- strokeLinejoin: "round"
12161
- }
12162
- ) }),
12163
- /* @__PURE__ */ jsxRuntime.jsx("g", { clipPath: "url(#clip5_20915_38670)", children: /* @__PURE__ */ jsxRuntime.jsx(
12164
- "path",
12165
- {
12166
- d: "M146.894 101.198L139.51 101.155L139.486 105.365",
12167
- stroke: "#A1A1AA",
12168
- strokeWidth: "1.5",
12169
- strokeLinecap: "round",
12170
- strokeLinejoin: "round"
12171
- }
12172
- ) }),
12173
- /* @__PURE__ */ jsxRuntime.jsxs("defs", { children: [
12174
- /* @__PURE__ */ jsxRuntime.jsx("clipPath", { id: "clip0_20915_38670", children: /* @__PURE__ */ jsxRuntime.jsx(
12175
- "rect",
12176
- {
12177
- width: "12",
12178
- height: "12",
12179
- fill: "white",
12180
- transform: "matrix(0.865865 0.500278 -0.871576 0.490261 138.36 74.6508)"
12181
- }
12182
- ) }),
12183
- /* @__PURE__ */ jsxRuntime.jsx("clipPath", { id: "clip1_20915_38670", children: /* @__PURE__ */ jsxRuntime.jsx(
12184
- "rect",
12185
- {
12186
- width: "12",
12187
- height: "12",
12188
- fill: "white",
12189
- transform: "matrix(0.865865 0.500278 -0.871576 0.490261 148.75 80.6541)"
12190
- }
12191
- ) }),
12192
- /* @__PURE__ */ jsxRuntime.jsx("clipPath", { id: "clip2_20915_38670", children: /* @__PURE__ */ jsxRuntime.jsx(
12193
- "rect",
12194
- {
12195
- width: "12",
12196
- height: "12",
12197
- fill: "white",
12198
- transform: "matrix(0.865865 0.500278 -0.871576 0.490261 159.141 86.6575)"
12199
- }
12200
- ) }),
12201
- /* @__PURE__ */ jsxRuntime.jsx("clipPath", { id: "clip3_20915_38670", children: /* @__PURE__ */ jsxRuntime.jsx(
12202
- "rect",
12203
- {
12204
- width: "12",
12205
- height: "12",
12206
- fill: "white",
12207
- transform: "matrix(0.865865 0.500278 -0.871576 0.490261 120.928 84.4561)"
12208
- }
12209
- ) }),
12210
- /* @__PURE__ */ jsxRuntime.jsx("clipPath", { id: "clip4_20915_38670", children: /* @__PURE__ */ jsxRuntime.jsx(
12211
- "rect",
12212
- {
12213
- width: "12",
12214
- height: "12",
12215
- fill: "white",
12216
- transform: "matrix(0.865865 0.500278 -0.871576 0.490261 131.318 90.4594)"
12217
- }
12218
- ) }),
12219
- /* @__PURE__ */ jsxRuntime.jsx("clipPath", { id: "clip5_20915_38670", children: /* @__PURE__ */ jsxRuntime.jsx(
12220
- "rect",
12221
- {
12222
- width: "12",
12223
- height: "12",
12224
- fill: "white",
12225
- transform: "matrix(0.865865 0.500278 -0.871576 0.490261 141.709 96.4627)"
12226
- }
12227
- ) })
12228
- ] })
12229
- ]
12230
- }
12231
- );
12232
- };
12233
- const schema = objectType({
12234
- customer_id: stringType().min(1)
12235
- });
12236
- const STACKED_FOCUS_MODAL_ID = "shipping-form";
12237
- const Shipping = () => {
12238
- var _a;
12239
- const { id } = reactRouterDom.useParams();
12240
- const { order, isPending, isError, error } = useOrder(id, {
12241
- fields: "+items.*,+items.variant.*,+items.variant.product.*,+items.variant.product.shipping_profile.*,+currency_code"
12242
- });
12243
- const {
12244
- order: preview,
12245
- isPending: isPreviewPending,
12246
- isError: isPreviewError,
12247
- error: previewError
12248
- } = useOrderPreview(id);
12249
- useInitiateOrderEdit({ preview });
12250
- const { onCancel } = useCancelOrderEdit({ preview });
12251
- if (isError) {
12252
- throw error;
12253
- }
12254
- if (isPreviewError) {
12255
- throw previewError;
12256
- }
12257
- const orderHasItems = (((_a = order == null ? void 0 : order.items) == null ? void 0 : _a.length) || 0) > 0;
12258
- const isReady = preview && !isPreviewPending && order && !isPending;
12259
- return /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal, { onClose: onCancel, children: !orderHasItems ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex h-full flex-col overflow-hidden ", children: [
12260
- /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Header, {}),
12261
- /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Body, { className: "flex flex-1 flex-col overflow-hidden", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-1 flex-col items-center overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex w-full max-w-[720px] flex-col gap-y-6 px-6 py-16", children: [
12262
- /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Shipping" }) }),
12263
- /* @__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." }) })
12264
- ] }) }) }),
12265
- /* @__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" }) }) })
12266
- ] }) : isReady ? /* @__PURE__ */ jsxRuntime.jsx(ShippingForm, { preview, order }) : /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
12267
- /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit Shipping" }) }),
12268
- /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Loading data for the draft order, please wait..." }) })
12269
- ] }) });
12270
- };
12271
- const ShippingForm = ({ preview, order }) => {
12272
- var _a;
12273
- const { setIsOpen } = useStackedModal();
12274
- const [isSubmitting, setIsSubmitting] = React.useState(false);
12275
- const [data, setData] = React.useState(null);
12276
- const appliedShippingOptionIds = (_a = preview.shipping_methods) == null ? void 0 : _a.map((method) => method.shipping_option_id).filter(Boolean);
12277
- const { shipping_options } = useShippingOptions(
12278
- {
12279
- id: appliedShippingOptionIds,
12280
- fields: "+service_zone.*,+service_zone.fulfillment_set.*,+service_zone.fulfillment_set.location.*"
12281
- },
12282
- {
12283
- enabled: appliedShippingOptionIds.length > 0
12284
- }
12285
- );
12286
- const uniqueShippingProfiles = React.useMemo(() => {
12287
- const profiles = /* @__PURE__ */ new Map();
12288
- getUniqueShippingProfiles(order.items).forEach((profile) => {
12289
- profiles.set(profile.id, profile);
12290
- });
12291
- shipping_options == null ? void 0 : shipping_options.forEach((option) => {
12292
- profiles.set(option.shipping_profile_id, option.shipping_profile);
12293
- });
12294
- return Array.from(profiles.values());
12295
- }, [order.items, shipping_options]);
12296
- const { handleSuccess } = useRouteModal();
12297
- const { mutateAsync: confirmOrderEdit } = useDraftOrderConfirmEdit(preview.id);
12298
- const { mutateAsync: requestOrderEdit } = useDraftOrderRequestEdit(preview.id);
12299
- const { mutateAsync: removeShippingMethod } = useDraftOrderRemoveShippingMethod(preview.id);
12300
- const { mutateAsync: removeActionShippingMethod } = useDraftOrderRemoveActionShippingMethod(preview.id);
12301
- const onSubmit = async () => {
12302
- setIsSubmitting(true);
12303
- let requestSucceeded = false;
12304
- await requestOrderEdit(void 0, {
12305
- onError: (e) => {
12306
- ui.toast.error(`Failed to request order edit: ${e.message}`);
12307
- },
12308
- onSuccess: () => {
12309
- requestSucceeded = true;
12310
- }
12311
- });
12312
- if (!requestSucceeded) {
12313
- setIsSubmitting(false);
12314
- return;
12315
- }
12316
- await confirmOrderEdit(void 0, {
12317
- onError: (e) => {
12318
- ui.toast.error(`Failed to confirm order edit: ${e.message}`);
12319
- },
12320
- onSuccess: () => {
12321
- handleSuccess();
12322
- },
12323
- onSettled: () => {
12324
- setIsSubmitting(false);
12325
- }
12326
- });
12327
- };
12328
- const onKeydown = React.useCallback(
12329
- (e) => {
12330
- if (e.key === "Enter" && (e.ctrlKey || e.metaKey)) {
12331
- if (data || isSubmitting) {
12332
- return;
12333
- }
12334
- onSubmit();
12335
- }
12336
- },
12337
- [data, isSubmitting, onSubmit]
12338
- );
12339
- React.useEffect(() => {
12340
- document.addEventListener("keydown", onKeydown);
12341
- return () => {
12342
- document.removeEventListener("keydown", onKeydown);
12343
- };
12344
- }, [onKeydown]);
12345
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex h-full flex-col overflow-hidden", children: [
12346
- /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Header, {}),
12347
- /* @__PURE__ */ jsxRuntime.jsxs(RouteFocusModal.Body, { className: "flex flex-1 flex-col overflow-hidden", children: [
12348
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-1 flex-col items-center overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex w-full max-w-[720px] flex-col gap-y-6 px-6 py-16", children: [
12349
- /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
12350
- /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Shipping" }) }),
12351
- /* @__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." }) })
12352
- ] }),
12353
- /* @__PURE__ */ jsxRuntime.jsx(ui.Divider, { variant: "dashed" }),
12354
- /* @__PURE__ */ jsxRuntime.jsx(radixUi.Accordion.Root, { type: "multiple", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-ui-bg-subtle shadow-elevation-card-rest rounded-xl", children: [
12355
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between px-4 py-2", children: [
12356
- /* @__PURE__ */ jsxRuntime.jsx(
12357
- ui.Text,
12358
- {
12359
- size: "xsmall",
12360
- weight: "plus",
12361
- className: "text-ui-fg-muted",
12362
- children: "Shipping profile"
12363
- }
12364
- ),
12365
- /* @__PURE__ */ jsxRuntime.jsx(
12366
- ui.Text,
12367
- {
12368
- size: "xsmall",
12369
- weight: "plus",
12370
- className: "text-ui-fg-muted",
12371
- children: "Action"
11689
+ size: "xsmall",
11690
+ weight: "plus",
11691
+ className: "text-ui-fg-muted",
11692
+ children: "Action"
12372
11693
  }
12373
11694
  )
12374
11695
  ] }),
@@ -12621,425 +11942,1104 @@ const ShippingForm = ({ preview, order }) => {
12621
11942
  );
12622
11943
  }) })
12623
11944
  ] }) })
12624
- ] }) }),
12625
- /* @__PURE__ */ jsxRuntime.jsx(
12626
- StackedFocusModal,
11945
+ ] }) }),
11946
+ /* @__PURE__ */ jsxRuntime.jsx(
11947
+ StackedFocusModal,
11948
+ {
11949
+ id: STACKED_FOCUS_MODAL_ID,
11950
+ onOpenChangeCallback: (open) => {
11951
+ if (!open) {
11952
+ setData(null);
11953
+ }
11954
+ return open;
11955
+ },
11956
+ children: data && /* @__PURE__ */ jsxRuntime.jsx(ShippingProfileForm, { data, order, preview })
11957
+ }
11958
+ )
11959
+ ] }),
11960
+ /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-x-2", children: [
11961
+ /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", type: "button", children: "Cancel" }) }),
11962
+ /* @__PURE__ */ jsxRuntime.jsx(
11963
+ ui.Button,
11964
+ {
11965
+ size: "small",
11966
+ type: "button",
11967
+ isLoading: isSubmitting,
11968
+ onClick: onSubmit,
11969
+ children: "Save"
11970
+ }
11971
+ )
11972
+ ] }) })
11973
+ ] });
11974
+ };
11975
+ const StackedModalTrigger = ({
11976
+ shippingProfileId,
11977
+ shippingOption,
11978
+ shippingMethod,
11979
+ setData,
11980
+ children
11981
+ }) => {
11982
+ const { setIsOpen, getIsOpen } = useStackedModal();
11983
+ const isOpen = getIsOpen(STACKED_FOCUS_MODAL_ID);
11984
+ const onToggle = () => {
11985
+ if (isOpen) {
11986
+ setIsOpen(STACKED_FOCUS_MODAL_ID, false);
11987
+ setData(null);
11988
+ } else {
11989
+ setIsOpen(STACKED_FOCUS_MODAL_ID, true);
11990
+ setData({
11991
+ shippingProfileId,
11992
+ shippingOption,
11993
+ shippingMethod
11994
+ });
11995
+ }
11996
+ };
11997
+ return /* @__PURE__ */ jsxRuntime.jsx(
11998
+ ui.Button,
11999
+ {
12000
+ size: "small",
12001
+ variant: "secondary",
12002
+ onClick: onToggle,
12003
+ className: "text-ui-fg-primary shrink-0",
12004
+ children
12005
+ }
12006
+ );
12007
+ };
12008
+ const ShippingProfileForm = ({
12009
+ data,
12010
+ order,
12011
+ preview
12012
+ }) => {
12013
+ var _a, _b, _c, _d, _e, _f;
12014
+ const { setIsOpen } = useStackedModal();
12015
+ const form = reactHookForm.useForm({
12016
+ resolver: zod.zodResolver(shippingMethodSchema),
12017
+ defaultValues: {
12018
+ 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,
12019
+ shipping_option_id: (_e = data.shippingOption) == null ? void 0 : _e.id,
12020
+ custom_amount: (_f = data.shippingMethod) == null ? void 0 : _f.amount
12021
+ }
12022
+ });
12023
+ const { mutateAsync: addShippingMethod, isPending } = useDraftOrderAddShippingMethod(order.id);
12024
+ const {
12025
+ mutateAsync: updateShippingMethod,
12026
+ isPending: isUpdatingShippingMethod
12027
+ } = useDraftOrderUpdateShippingMethod(order.id);
12028
+ const onSubmit = form.handleSubmit(async (values) => {
12029
+ if (isEqual__default.default(values, form.formState.defaultValues)) {
12030
+ setIsOpen(STACKED_FOCUS_MODAL_ID, false);
12031
+ return;
12032
+ }
12033
+ if (data.shippingMethod) {
12034
+ await updateShippingMethod(
12035
+ {
12036
+ method_id: data.shippingMethod.id,
12037
+ shipping_option_id: values.shipping_option_id,
12038
+ custom_amount: values.custom_amount ? convertNumber(values.custom_amount) : void 0
12039
+ },
12040
+ {
12041
+ onError: (e) => {
12042
+ ui.toast.error(e.message);
12043
+ },
12044
+ onSuccess: () => {
12045
+ setIsOpen(STACKED_FOCUS_MODAL_ID, false);
12046
+ }
12047
+ }
12048
+ );
12049
+ return;
12050
+ }
12051
+ await addShippingMethod(
12052
+ {
12053
+ shipping_option_id: values.shipping_option_id,
12054
+ custom_amount: values.custom_amount ? convertNumber(values.custom_amount) : void 0
12055
+ },
12056
+ {
12057
+ onError: (e) => {
12058
+ ui.toast.error(e.message);
12059
+ },
12060
+ onSuccess: () => {
12061
+ setIsOpen(STACKED_FOCUS_MODAL_ID, false);
12062
+ }
12063
+ }
12064
+ );
12065
+ });
12066
+ return /* @__PURE__ */ jsxRuntime.jsx(StackedFocusModal.Content, { children: /* @__PURE__ */ jsxRuntime.jsx(Form$2, { ...form, children: /* @__PURE__ */ jsxRuntime.jsxs(
12067
+ KeyboundForm,
12068
+ {
12069
+ className: "flex h-full flex-col overflow-hidden",
12070
+ onSubmit,
12071
+ children: [
12072
+ /* @__PURE__ */ jsxRuntime.jsx(StackedFocusModal.Header, {}),
12073
+ /* @__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 px-6 py-16", children: [
12074
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
12075
+ /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Shipping" }) }),
12076
+ /* @__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." }) })
12077
+ ] }),
12078
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Divider, { variant: "dashed" }),
12079
+ /* @__PURE__ */ jsxRuntime.jsx(
12080
+ LocationField,
12081
+ {
12082
+ control: form.control,
12083
+ setValue: form.setValue
12084
+ }
12085
+ ),
12086
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Divider, { variant: "dashed" }),
12087
+ /* @__PURE__ */ jsxRuntime.jsx(
12088
+ ShippingOptionField,
12089
+ {
12090
+ shippingProfileId: data.shippingProfileId,
12091
+ preview,
12092
+ control: form.control
12093
+ }
12094
+ ),
12095
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Divider, { variant: "dashed" }),
12096
+ /* @__PURE__ */ jsxRuntime.jsx(
12097
+ CustomAmountField,
12098
+ {
12099
+ control: form.control,
12100
+ currencyCode: order.currency_code
12101
+ }
12102
+ ),
12103
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Divider, { variant: "dashed" }),
12104
+ /* @__PURE__ */ jsxRuntime.jsx(
12105
+ ItemsPreview,
12106
+ {
12107
+ order,
12108
+ shippingProfileId: data.shippingProfileId
12109
+ }
12110
+ )
12111
+ ] }) }) }),
12112
+ /* @__PURE__ */ jsxRuntime.jsx(StackedFocusModal.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-x-2", children: [
12113
+ /* @__PURE__ */ jsxRuntime.jsx(StackedFocusModal.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", type: "button", children: "Cancel" }) }),
12114
+ /* @__PURE__ */ jsxRuntime.jsx(
12115
+ ui.Button,
12116
+ {
12117
+ size: "small",
12118
+ type: "submit",
12119
+ isLoading: isPending || isUpdatingShippingMethod,
12120
+ children: data.shippingMethod ? "Update" : "Add"
12121
+ }
12122
+ )
12123
+ ] }) })
12124
+ ]
12125
+ }
12126
+ ) }) });
12127
+ };
12128
+ const shippingMethodSchema = objectType({
12129
+ location_id: stringType(),
12130
+ shipping_option_id: stringType(),
12131
+ custom_amount: unionType([numberType(), stringType()]).optional()
12132
+ });
12133
+ const ItemsPreview = ({ order, shippingProfileId }) => {
12134
+ const matches = order.items.filter(
12135
+ (item) => {
12136
+ var _a, _b, _c;
12137
+ return ((_c = (_b = (_a = item.variant) == null ? void 0 : _a.product) == null ? void 0 : _b.shipping_profile) == null ? void 0 : _c.id) === shippingProfileId;
12138
+ }
12139
+ );
12140
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-y-6", children: [
12141
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid grid-cols-2 items-center gap-3", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col", children: [
12142
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", weight: "plus", leading: "compact", children: "Items to ship" }),
12143
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", className: "text-ui-fg-subtle", children: "Items with the selected shipping profile." })
12144
+ ] }) }),
12145
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-ui-bg-subtle shadow-elevation-card-rest rounded-xl", children: [
12146
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-ui-fg-muted grid grid-cols-2 gap-3 px-4 py-2", children: [
12147
+ /* @__PURE__ */ jsxRuntime.jsx("div", { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", weight: "plus", children: "Item" }) }),
12148
+ /* @__PURE__ */ jsxRuntime.jsx("div", { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", weight: "plus", children: "Quantity" }) })
12149
+ ] }),
12150
+ /* @__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(
12151
+ "div",
12627
12152
  {
12628
- id: STACKED_FOCUS_MODAL_ID,
12629
- onOpenChangeCallback: (open) => {
12630
- if (!open) {
12631
- setData(null);
12153
+ className: "bg-ui-bg-base shadow-elevation-card-rest grid grid-cols-2 items-center gap-3 rounded-lg px-4 py-2",
12154
+ children: [
12155
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-x-3", children: [
12156
+ /* @__PURE__ */ jsxRuntime.jsx(
12157
+ Thumbnail,
12158
+ {
12159
+ thumbnail: item.thumbnail,
12160
+ alt: item.product_title ?? void 0
12161
+ }
12162
+ ),
12163
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col", children: [
12164
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-x-1", children: [
12165
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", weight: "plus", leading: "compact", children: item.product_title }),
12166
+ /* @__PURE__ */ jsxRuntime.jsxs(
12167
+ ui.Text,
12168
+ {
12169
+ size: "small",
12170
+ leading: "compact",
12171
+ className: "text-ui-fg-subtle",
12172
+ children: [
12173
+ "(",
12174
+ item.variant_title,
12175
+ ")"
12176
+ ]
12177
+ }
12178
+ )
12179
+ ] }),
12180
+ /* @__PURE__ */ jsxRuntime.jsx(
12181
+ ui.Text,
12182
+ {
12183
+ size: "small",
12184
+ leading: "compact",
12185
+ className: "text-ui-fg-subtle",
12186
+ children: item.variant_sku
12187
+ }
12188
+ )
12189
+ ] })
12190
+ ] }),
12191
+ /* @__PURE__ */ jsxRuntime.jsxs(
12192
+ ui.Text,
12193
+ {
12194
+ size: "small",
12195
+ leading: "compact",
12196
+ className: "text-ui-fg-subtle",
12197
+ children: [
12198
+ item.quantity,
12199
+ "x"
12200
+ ]
12201
+ }
12202
+ )
12203
+ ]
12204
+ },
12205
+ item.id
12206
+ )) : /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-ui-bg-base shadow-elevation-card-rest flex flex-col items-center justify-center gap-1 gap-x-3 rounded-lg p-4", children: [
12207
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", weight: "plus", leading: "compact", children: "No items found" }),
12208
+ /* @__PURE__ */ jsxRuntime.jsxs(ui.Text, { size: "small", className: "text-ui-fg-subtle", children: [
12209
+ 'No items found for "',
12210
+ query,
12211
+ '".'
12212
+ ] })
12213
+ ] }) })
12214
+ ] })
12215
+ ] });
12216
+ };
12217
+ const LocationField = ({ control, setValue }) => {
12218
+ const locations = useComboboxData({
12219
+ queryKey: ["locations"],
12220
+ queryFn: async (params) => {
12221
+ return await sdk.admin.stockLocation.list(params);
12222
+ },
12223
+ getOptions: (data) => {
12224
+ return data.stock_locations.map((location) => ({
12225
+ label: location.name,
12226
+ value: location.id
12227
+ }));
12228
+ }
12229
+ });
12230
+ return /* @__PURE__ */ jsxRuntime.jsx(
12231
+ Form$2.Field,
12232
+ {
12233
+ control,
12234
+ name: "location_id",
12235
+ render: ({ field: { onChange, ...field } }) => {
12236
+ return /* @__PURE__ */ jsxRuntime.jsx(Form$2.Item, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-x-3", children: [
12237
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
12238
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Location" }),
12239
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Hint, { children: "Choose where you want to ship the items from." })
12240
+ ] }),
12241
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
12242
+ Combobox,
12243
+ {
12244
+ options: locations.options,
12245
+ fetchNextPage: locations.fetchNextPage,
12246
+ isFetchingNextPage: locations.isFetchingNextPage,
12247
+ searchValue: locations.searchValue,
12248
+ onSearchValueChange: locations.onSearchValueChange,
12249
+ placeholder: "Select location",
12250
+ onChange: (value) => {
12251
+ setValue("shipping_option_id", "", {
12252
+ shouldDirty: true,
12253
+ shouldTouch: true
12254
+ });
12255
+ onChange(value);
12256
+ },
12257
+ ...field
12258
+ }
12259
+ ) })
12260
+ ] }) });
12261
+ }
12262
+ }
12263
+ );
12264
+ };
12265
+ const ShippingOptionField = ({
12266
+ shippingProfileId,
12267
+ preview,
12268
+ control
12269
+ }) => {
12270
+ var _a;
12271
+ const locationId = reactHookForm.useWatch({ control, name: "location_id" });
12272
+ const shippingOptions = useComboboxData({
12273
+ queryKey: ["shipping_options", locationId, shippingProfileId],
12274
+ queryFn: async (params) => {
12275
+ return await sdk.admin.shippingOption.list({
12276
+ ...params,
12277
+ stock_location_id: locationId,
12278
+ shipping_profile_id: shippingProfileId
12279
+ });
12280
+ },
12281
+ getOptions: (data) => {
12282
+ return data.shipping_options.map((option) => {
12283
+ var _a2;
12284
+ if ((_a2 = option.rules) == null ? void 0 : _a2.find(
12285
+ (r) => r.attribute === "is_return" && r.value === "true"
12286
+ )) {
12287
+ return void 0;
12288
+ }
12289
+ return {
12290
+ label: option.name,
12291
+ value: option.id
12292
+ };
12293
+ }).filter(Boolean);
12294
+ },
12295
+ enabled: !!locationId && !!shippingProfileId,
12296
+ defaultValue: ((_a = preview.shipping_methods[0]) == null ? void 0 : _a.shipping_option_id) || void 0
12297
+ });
12298
+ const tooltipContent = !locationId && !shippingProfileId ? "Choose a location and shipping profile first." : !locationId ? "Choose a location first." : "Choose a shipping profile first.";
12299
+ return /* @__PURE__ */ jsxRuntime.jsx(
12300
+ Form$2.Field,
12301
+ {
12302
+ control,
12303
+ name: "shipping_option_id",
12304
+ render: ({ field }) => {
12305
+ return /* @__PURE__ */ jsxRuntime.jsx(Form$2.Item, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-x-3", children: [
12306
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col", children: [
12307
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Shipping option" }),
12308
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Hint, { children: "Choose the shipping option to use." })
12309
+ ] }),
12310
+ /* @__PURE__ */ jsxRuntime.jsx(
12311
+ ConditionalTooltip,
12312
+ {
12313
+ content: tooltipContent,
12314
+ showTooltip: !locationId || !shippingProfileId,
12315
+ children: /* @__PURE__ */ jsxRuntime.jsx("div", { children: /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
12316
+ Combobox,
12317
+ {
12318
+ options: shippingOptions.options,
12319
+ fetchNextPage: shippingOptions.fetchNextPage,
12320
+ isFetchingNextPage: shippingOptions.isFetchingNextPage,
12321
+ searchValue: shippingOptions.searchValue,
12322
+ onSearchValueChange: shippingOptions.onSearchValueChange,
12323
+ placeholder: "Select shipping option",
12324
+ ...field,
12325
+ disabled: !locationId || !shippingProfileId
12326
+ }
12327
+ ) }) })
12328
+ }
12329
+ )
12330
+ ] }) });
12331
+ }
12332
+ }
12333
+ );
12334
+ };
12335
+ const CustomAmountField = ({
12336
+ control,
12337
+ currencyCode
12338
+ }) => {
12339
+ return /* @__PURE__ */ jsxRuntime.jsx(
12340
+ Form$2.Field,
12341
+ {
12342
+ control,
12343
+ name: "custom_amount",
12344
+ render: ({ field: { onChange, ...field } }) => {
12345
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-x-3", children: [
12346
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col", children: [
12347
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Custom amount" }),
12348
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Hint, { children: "Set a custom amount for the shipping option." })
12349
+ ] }),
12350
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
12351
+ ui.CurrencyInput,
12352
+ {
12353
+ ...field,
12354
+ onValueChange: (value) => onChange(value),
12355
+ symbol: getNativeSymbol(currencyCode),
12356
+ code: currencyCode
12632
12357
  }
12633
- return open;
12634
- },
12635
- children: data && /* @__PURE__ */ jsxRuntime.jsx(ShippingProfileForm, { data, order, preview })
12636
- }
12637
- )
12358
+ ) })
12359
+ ] });
12360
+ }
12361
+ }
12362
+ );
12363
+ };
12364
+ const ShippingAddress = () => {
12365
+ const { id } = reactRouterDom.useParams();
12366
+ const { order, isPending, isError, error } = useOrder(id, {
12367
+ fields: "+shipping_address"
12368
+ });
12369
+ if (isError) {
12370
+ throw error;
12371
+ }
12372
+ const isReady = !isPending && !!order;
12373
+ return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
12374
+ /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
12375
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Shipping Address" }) }),
12376
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit the shipping address for the draft order" }) })
12638
12377
  ] }),
12639
- /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-x-2", children: [
12640
- /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", type: "button", children: "Cancel" }) }),
12641
- /* @__PURE__ */ jsxRuntime.jsx(
12642
- ui.Button,
12643
- {
12644
- size: "small",
12645
- type: "button",
12646
- isLoading: isSubmitting,
12647
- onClick: onSubmit,
12648
- children: "Save"
12649
- }
12650
- )
12651
- ] }) })
12378
+ isReady && /* @__PURE__ */ jsxRuntime.jsx(ShippingAddressForm, { order })
12652
12379
  ] });
12653
12380
  };
12654
- const StackedModalTrigger = ({
12655
- shippingProfileId,
12656
- shippingOption,
12657
- shippingMethod,
12658
- setData,
12659
- children
12660
- }) => {
12661
- const { setIsOpen, getIsOpen } = useStackedModal();
12662
- const isOpen = getIsOpen(STACKED_FOCUS_MODAL_ID);
12663
- const onToggle = () => {
12664
- if (isOpen) {
12665
- setIsOpen(STACKED_FOCUS_MODAL_ID, false);
12666
- setData(null);
12667
- } else {
12668
- setIsOpen(STACKED_FOCUS_MODAL_ID, true);
12669
- setData({
12670
- shippingProfileId,
12671
- shippingOption,
12672
- shippingMethod
12673
- });
12674
- }
12675
- };
12676
- return /* @__PURE__ */ jsxRuntime.jsx(
12677
- ui.Button,
12381
+ const ShippingAddressForm = ({ order }) => {
12382
+ var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
12383
+ const form = reactHookForm.useForm({
12384
+ defaultValues: {
12385
+ first_name: ((_a = order.shipping_address) == null ? void 0 : _a.first_name) ?? "",
12386
+ last_name: ((_b = order.shipping_address) == null ? void 0 : _b.last_name) ?? "",
12387
+ company: ((_c = order.shipping_address) == null ? void 0 : _c.company) ?? "",
12388
+ address_1: ((_d = order.shipping_address) == null ? void 0 : _d.address_1) ?? "",
12389
+ address_2: ((_e = order.shipping_address) == null ? void 0 : _e.address_2) ?? "",
12390
+ city: ((_f = order.shipping_address) == null ? void 0 : _f.city) ?? "",
12391
+ province: ((_g = order.shipping_address) == null ? void 0 : _g.province) ?? "",
12392
+ country_code: ((_h = order.shipping_address) == null ? void 0 : _h.country_code) ?? "",
12393
+ postal_code: ((_i = order.shipping_address) == null ? void 0 : _i.postal_code) ?? "",
12394
+ phone: ((_j = order.shipping_address) == null ? void 0 : _j.phone) ?? ""
12395
+ },
12396
+ resolver: zod.zodResolver(schema$1)
12397
+ });
12398
+ const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
12399
+ const { handleSuccess } = useRouteModal();
12400
+ const onSubmit = form.handleSubmit(async (data) => {
12401
+ await mutateAsync(
12402
+ {
12403
+ shipping_address: {
12404
+ first_name: data.first_name,
12405
+ last_name: data.last_name,
12406
+ company: data.company,
12407
+ address_1: data.address_1,
12408
+ address_2: data.address_2,
12409
+ city: data.city,
12410
+ province: data.province,
12411
+ country_code: data.country_code,
12412
+ postal_code: data.postal_code,
12413
+ phone: data.phone
12414
+ }
12415
+ },
12416
+ {
12417
+ onSuccess: () => {
12418
+ handleSuccess();
12419
+ },
12420
+ onError: (error) => {
12421
+ ui.toast.error(error.message);
12422
+ }
12423
+ }
12424
+ );
12425
+ });
12426
+ return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
12427
+ KeyboundForm,
12678
12428
  {
12679
- size: "small",
12680
- variant: "secondary",
12681
- onClick: onToggle,
12682
- className: "text-ui-fg-primary shrink-0",
12683
- children
12429
+ className: "flex flex-1 flex-col overflow-hidden",
12430
+ onSubmit,
12431
+ children: [
12432
+ /* @__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: [
12433
+ /* @__PURE__ */ jsxRuntime.jsx(
12434
+ Form$2.Field,
12435
+ {
12436
+ control: form.control,
12437
+ name: "country_code",
12438
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12439
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Country" }),
12440
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(CountrySelect, { ...field }) }),
12441
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12442
+ ] })
12443
+ }
12444
+ ),
12445
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
12446
+ /* @__PURE__ */ jsxRuntime.jsx(
12447
+ Form$2.Field,
12448
+ {
12449
+ control: form.control,
12450
+ name: "first_name",
12451
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12452
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "First name" }),
12453
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12454
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12455
+ ] })
12456
+ }
12457
+ ),
12458
+ /* @__PURE__ */ jsxRuntime.jsx(
12459
+ Form$2.Field,
12460
+ {
12461
+ control: form.control,
12462
+ name: "last_name",
12463
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12464
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Last name" }),
12465
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12466
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12467
+ ] })
12468
+ }
12469
+ )
12470
+ ] }),
12471
+ /* @__PURE__ */ jsxRuntime.jsx(
12472
+ Form$2.Field,
12473
+ {
12474
+ control: form.control,
12475
+ name: "company",
12476
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12477
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Company" }),
12478
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12479
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12480
+ ] })
12481
+ }
12482
+ ),
12483
+ /* @__PURE__ */ jsxRuntime.jsx(
12484
+ Form$2.Field,
12485
+ {
12486
+ control: form.control,
12487
+ name: "address_1",
12488
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12489
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Address" }),
12490
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12491
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12492
+ ] })
12493
+ }
12494
+ ),
12495
+ /* @__PURE__ */ jsxRuntime.jsx(
12496
+ Form$2.Field,
12497
+ {
12498
+ control: form.control,
12499
+ name: "address_2",
12500
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12501
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Apartment, suite, etc." }),
12502
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12503
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12504
+ ] })
12505
+ }
12506
+ ),
12507
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
12508
+ /* @__PURE__ */ jsxRuntime.jsx(
12509
+ Form$2.Field,
12510
+ {
12511
+ control: form.control,
12512
+ name: "postal_code",
12513
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12514
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Postal code" }),
12515
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12516
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12517
+ ] })
12518
+ }
12519
+ ),
12520
+ /* @__PURE__ */ jsxRuntime.jsx(
12521
+ Form$2.Field,
12522
+ {
12523
+ control: form.control,
12524
+ name: "city",
12525
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12526
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "City" }),
12527
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12528
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12529
+ ] })
12530
+ }
12531
+ )
12532
+ ] }),
12533
+ /* @__PURE__ */ jsxRuntime.jsx(
12534
+ Form$2.Field,
12535
+ {
12536
+ control: form.control,
12537
+ name: "province",
12538
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12539
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Province / State" }),
12540
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12541
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12542
+ ] })
12543
+ }
12544
+ ),
12545
+ /* @__PURE__ */ jsxRuntime.jsx(
12546
+ Form$2.Field,
12547
+ {
12548
+ control: form.control,
12549
+ name: "phone",
12550
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12551
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Phone" }),
12552
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12553
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12554
+ ] })
12555
+ }
12556
+ )
12557
+ ] }) }),
12558
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
12559
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
12560
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
12561
+ ] }) })
12562
+ ]
12684
12563
  }
12685
- );
12564
+ ) });
12686
12565
  };
12687
- const ShippingProfileForm = ({
12688
- data,
12689
- order,
12690
- preview
12691
- }) => {
12692
- var _a, _b, _c, _d, _e, _f;
12693
- const { setIsOpen } = useStackedModal();
12566
+ const schema$1 = addressSchema;
12567
+ const TransferOwnership = () => {
12568
+ const { id } = reactRouterDom.useParams();
12569
+ const { draft_order, isPending, isError, error } = useDraftOrder(id, {
12570
+ fields: "id,customer_id,customer.*"
12571
+ });
12572
+ if (isError) {
12573
+ throw error;
12574
+ }
12575
+ const isReady = !isPending && !!draft_order;
12576
+ return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
12577
+ /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
12578
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Transfer Ownership" }) }),
12579
+ /* @__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" }) })
12580
+ ] }),
12581
+ isReady && /* @__PURE__ */ jsxRuntime.jsx(TransferOwnershipForm, { order: draft_order })
12582
+ ] });
12583
+ };
12584
+ const TransferOwnershipForm = ({ order }) => {
12585
+ var _a, _b;
12694
12586
  const form = reactHookForm.useForm({
12695
- resolver: zod.zodResolver(shippingMethodSchema),
12696
12587
  defaultValues: {
12697
- 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,
12698
- shipping_option_id: (_e = data.shippingOption) == null ? void 0 : _e.id,
12699
- custom_amount: (_f = data.shippingMethod) == null ? void 0 : _f.amount
12700
- }
12588
+ customer_id: order.customer_id || ""
12589
+ },
12590
+ resolver: zod.zodResolver(schema)
12701
12591
  });
12702
- const { mutateAsync: addShippingMethod, isPending } = useDraftOrderAddShippingMethod(order.id);
12703
- const {
12704
- mutateAsync: updateShippingMethod,
12705
- isPending: isUpdatingShippingMethod
12706
- } = useDraftOrderUpdateShippingMethod(order.id);
12707
- const onSubmit = form.handleSubmit(async (values) => {
12708
- if (isEqual__default.default(values, form.formState.defaultValues)) {
12709
- setIsOpen(STACKED_FOCUS_MODAL_ID, false);
12710
- return;
12711
- }
12712
- if (data.shippingMethod) {
12713
- await updateShippingMethod(
12714
- {
12715
- method_id: data.shippingMethod.id,
12716
- shipping_option_id: values.shipping_option_id,
12717
- custom_amount: values.custom_amount ? convertNumber(values.custom_amount) : void 0
12718
- },
12719
- {
12720
- onError: (e) => {
12721
- ui.toast.error(e.message);
12722
- },
12723
- onSuccess: () => {
12724
- setIsOpen(STACKED_FOCUS_MODAL_ID, false);
12725
- }
12726
- }
12727
- );
12728
- return;
12729
- }
12730
- await addShippingMethod(
12731
- {
12732
- shipping_option_id: values.shipping_option_id,
12733
- custom_amount: values.custom_amount ? convertNumber(values.custom_amount) : void 0
12734
- },
12592
+ const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
12593
+ const { handleSuccess } = useRouteModal();
12594
+ const name = [(_a = order.customer) == null ? void 0 : _a.first_name, (_b = order.customer) == null ? void 0 : _b.last_name].filter(Boolean).join(" ");
12595
+ const currentCustomer = order.customer ? {
12596
+ label: name ? `${name} (${order.customer.email})` : order.customer.email,
12597
+ value: order.customer.id
12598
+ } : null;
12599
+ const onSubmit = form.handleSubmit(async (data) => {
12600
+ await mutateAsync(
12601
+ { customer_id: data.customer_id },
12735
12602
  {
12736
- onError: (e) => {
12737
- ui.toast.error(e.message);
12738
- },
12739
12603
  onSuccess: () => {
12740
- setIsOpen(STACKED_FOCUS_MODAL_ID, false);
12604
+ ui.toast.success("Customer updated");
12605
+ handleSuccess();
12606
+ },
12607
+ onError: (error) => {
12608
+ ui.toast.error(error.message);
12741
12609
  }
12742
12610
  }
12743
12611
  );
12744
12612
  });
12745
- return /* @__PURE__ */ jsxRuntime.jsx(StackedFocusModal.Content, { children: /* @__PURE__ */ jsxRuntime.jsx(Form$2, { ...form, children: /* @__PURE__ */ jsxRuntime.jsxs(
12613
+ return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
12746
12614
  KeyboundForm,
12747
12615
  {
12748
- className: "flex h-full flex-col overflow-hidden",
12616
+ className: "flex flex-1 flex-col overflow-hidden",
12749
12617
  onSubmit,
12750
12618
  children: [
12751
- /* @__PURE__ */ jsxRuntime.jsx(StackedFocusModal.Header, {}),
12752
- /* @__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 px-6 py-16", children: [
12753
- /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
12754
- /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Shipping" }) }),
12755
- /* @__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." }) })
12619
+ /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: [
12620
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center justify-center bg-ui-bg-component rounded-md border", children: /* @__PURE__ */ jsxRuntime.jsx(Illustration, {}) }),
12621
+ currentCustomer && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col space-y-3", children: [
12622
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col", children: [
12623
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Label, { size: "small", weight: "plus", htmlFor: "current-customer", children: "Current owner" }),
12624
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Hint, { children: "The customer that is currently associated with this draft order." })
12625
+ ] }),
12626
+ /* @__PURE__ */ jsxRuntime.jsxs(ui.Select, { disabled: true, value: currentCustomer.value, children: [
12627
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Select.Trigger, { id: "current-customer", children: /* @__PURE__ */ jsxRuntime.jsx(ui.Select.Value, {}) }),
12628
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Select.Content, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Select.Item, { value: currentCustomer.value, children: currentCustomer.label }) })
12629
+ ] })
12756
12630
  ] }),
12757
- /* @__PURE__ */ jsxRuntime.jsx(ui.Divider, { variant: "dashed" }),
12758
- /* @__PURE__ */ jsxRuntime.jsx(
12759
- LocationField,
12760
- {
12761
- control: form.control,
12762
- setValue: form.setValue
12763
- }
12764
- ),
12765
- /* @__PURE__ */ jsxRuntime.jsx(ui.Divider, { variant: "dashed" }),
12766
- /* @__PURE__ */ jsxRuntime.jsx(
12767
- ShippingOptionField,
12768
- {
12769
- shippingProfileId: data.shippingProfileId,
12770
- preview,
12771
- control: form.control
12772
- }
12773
- ),
12774
- /* @__PURE__ */ jsxRuntime.jsx(ui.Divider, { variant: "dashed" }),
12775
12631
  /* @__PURE__ */ jsxRuntime.jsx(
12776
- CustomAmountField,
12632
+ CustomerField,
12777
12633
  {
12778
12634
  control: form.control,
12779
- currencyCode: order.currency_code
12780
- }
12781
- ),
12782
- /* @__PURE__ */ jsxRuntime.jsx(ui.Divider, { variant: "dashed" }),
12783
- /* @__PURE__ */ jsxRuntime.jsx(
12784
- ItemsPreview,
12785
- {
12786
- order,
12787
- shippingProfileId: data.shippingProfileId
12788
- }
12789
- )
12790
- ] }) }) }),
12791
- /* @__PURE__ */ jsxRuntime.jsx(StackedFocusModal.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-x-2", children: [
12792
- /* @__PURE__ */ jsxRuntime.jsx(StackedFocusModal.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", type: "button", children: "Cancel" }) }),
12793
- /* @__PURE__ */ jsxRuntime.jsx(
12794
- ui.Button,
12795
- {
12796
- size: "small",
12797
- type: "submit",
12798
- isLoading: isPending || isUpdatingShippingMethod,
12799
- children: data.shippingMethod ? "Update" : "Add"
12635
+ currentCustomerId: order.customer_id
12800
12636
  }
12801
12637
  )
12638
+ ] }),
12639
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
12640
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { variant: "secondary", size: "small", children: "Cancel" }) }),
12641
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
12802
12642
  ] }) })
12803
12643
  ]
12804
12644
  }
12805
- ) }) });
12806
- };
12807
- const shippingMethodSchema = objectType({
12808
- location_id: stringType(),
12809
- shipping_option_id: stringType(),
12810
- custom_amount: unionType([numberType(), stringType()]).optional()
12811
- });
12812
- const ItemsPreview = ({ order, shippingProfileId }) => {
12813
- const matches = order.items.filter(
12814
- (item) => {
12815
- var _a, _b, _c;
12816
- return ((_c = (_b = (_a = item.variant) == null ? void 0 : _a.product) == null ? void 0 : _b.shipping_profile) == null ? void 0 : _c.id) === shippingProfileId;
12817
- }
12818
- );
12819
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-y-6", children: [
12820
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid grid-cols-2 items-center gap-3", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col", children: [
12821
- /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", weight: "plus", leading: "compact", children: "Items to ship" }),
12822
- /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", className: "text-ui-fg-subtle", children: "Items with the selected shipping profile." })
12823
- ] }) }),
12824
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-ui-bg-subtle shadow-elevation-card-rest rounded-xl", children: [
12825
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-ui-fg-muted grid grid-cols-2 gap-3 px-4 py-2", children: [
12826
- /* @__PURE__ */ jsxRuntime.jsx("div", { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", weight: "plus", children: "Item" }) }),
12827
- /* @__PURE__ */ jsxRuntime.jsx("div", { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", weight: "plus", children: "Quantity" }) })
12828
- ] }),
12829
- /* @__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(
12830
- "div",
12831
- {
12832
- className: "bg-ui-bg-base shadow-elevation-card-rest grid grid-cols-2 items-center gap-3 rounded-lg px-4 py-2",
12833
- children: [
12834
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-x-3", children: [
12835
- /* @__PURE__ */ jsxRuntime.jsx(
12836
- Thumbnail,
12837
- {
12838
- thumbnail: item.thumbnail,
12839
- alt: item.product_title ?? void 0
12840
- }
12841
- ),
12842
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col", children: [
12843
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-x-1", children: [
12844
- /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", weight: "plus", leading: "compact", children: item.product_title }),
12845
- /* @__PURE__ */ jsxRuntime.jsxs(
12846
- ui.Text,
12847
- {
12848
- size: "small",
12849
- leading: "compact",
12850
- className: "text-ui-fg-subtle",
12851
- children: [
12852
- "(",
12853
- item.variant_title,
12854
- ")"
12855
- ]
12856
- }
12857
- )
12858
- ] }),
12859
- /* @__PURE__ */ jsxRuntime.jsx(
12860
- ui.Text,
12861
- {
12862
- size: "small",
12863
- leading: "compact",
12864
- className: "text-ui-fg-subtle",
12865
- children: item.variant_sku
12866
- }
12867
- )
12868
- ] })
12869
- ] }),
12870
- /* @__PURE__ */ jsxRuntime.jsxs(
12871
- ui.Text,
12872
- {
12873
- size: "small",
12874
- leading: "compact",
12875
- className: "text-ui-fg-subtle",
12876
- children: [
12877
- item.quantity,
12878
- "x"
12879
- ]
12880
- }
12881
- )
12882
- ]
12883
- },
12884
- item.id
12885
- )) : /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-ui-bg-base shadow-elevation-card-rest flex flex-col items-center justify-center gap-1 gap-x-3 rounded-lg p-4", children: [
12886
- /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", weight: "plus", leading: "compact", children: "No items found" }),
12887
- /* @__PURE__ */ jsxRuntime.jsxs(ui.Text, { size: "small", className: "text-ui-fg-subtle", children: [
12888
- 'No items found for "',
12889
- query,
12890
- '".'
12891
- ] })
12892
- ] }) })
12893
- ] })
12894
- ] });
12645
+ ) });
12895
12646
  };
12896
- const LocationField = ({ control, setValue }) => {
12897
- const locations = useComboboxData({
12898
- queryKey: ["locations"],
12647
+ const CustomerField = ({ control, currentCustomerId }) => {
12648
+ const customers = useComboboxData({
12899
12649
  queryFn: async (params) => {
12900
- return await sdk.admin.stockLocation.list(params);
12650
+ return await sdk.admin.customer.list({
12651
+ ...params,
12652
+ id: currentCustomerId ? { $nin: [currentCustomerId] } : void 0
12653
+ });
12901
12654
  },
12655
+ queryKey: ["customers"],
12902
12656
  getOptions: (data) => {
12903
- return data.stock_locations.map((location) => ({
12904
- label: location.name,
12905
- value: location.id
12906
- }));
12657
+ return data.customers.map((customer) => {
12658
+ const name = [customer.first_name, customer.last_name].filter(Boolean).join(" ");
12659
+ return {
12660
+ label: name ? `${name} (${customer.email})` : customer.email,
12661
+ value: customer.id
12662
+ };
12663
+ });
12907
12664
  }
12908
12665
  });
12909
12666
  return /* @__PURE__ */ jsxRuntime.jsx(
12910
12667
  Form$2.Field,
12911
12668
  {
12669
+ name: "customer_id",
12912
12670
  control,
12913
- name: "location_id",
12914
- render: ({ field: { onChange, ...field } }) => {
12915
- return /* @__PURE__ */ jsxRuntime.jsx(Form$2.Item, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-x-3", children: [
12916
- /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
12917
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Location" }),
12918
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Hint, { children: "Choose where you want to ship the items from." })
12919
- ] }),
12920
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
12921
- Combobox,
12671
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { className: "space-y-3", children: [
12672
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col", children: [
12673
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "New customer" }),
12674
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Hint, { children: "The customer to transfer this draft order to." })
12675
+ ] }),
12676
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
12677
+ Combobox,
12678
+ {
12679
+ options: customers.options,
12680
+ fetchNextPage: customers.fetchNextPage,
12681
+ isFetchingNextPage: customers.isFetchingNextPage,
12682
+ searchValue: customers.searchValue,
12683
+ onSearchValueChange: customers.onSearchValueChange,
12684
+ placeholder: "Select customer",
12685
+ ...field
12686
+ }
12687
+ ) }),
12688
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12689
+ ] })
12690
+ }
12691
+ );
12692
+ };
12693
+ const Illustration = () => {
12694
+ return /* @__PURE__ */ jsxRuntime.jsxs(
12695
+ "svg",
12696
+ {
12697
+ width: "280",
12698
+ height: "180",
12699
+ viewBox: "0 0 280 180",
12700
+ fill: "none",
12701
+ xmlns: "http://www.w3.org/2000/svg",
12702
+ children: [
12703
+ /* @__PURE__ */ jsxRuntime.jsx(
12704
+ "rect",
12705
+ {
12706
+ x: "0.00428286",
12707
+ y: "-0.742904",
12708
+ width: "33.5",
12709
+ height: "65.5",
12710
+ rx: "6.75",
12711
+ transform: "matrix(0.865865 0.500278 -0.871576 0.490261 189.756 88.438)",
12712
+ fill: "#D4D4D8",
12713
+ stroke: "#52525B",
12714
+ strokeWidth: "1.5"
12715
+ }
12716
+ ),
12717
+ /* @__PURE__ */ jsxRuntime.jsx(
12718
+ "rect",
12719
+ {
12720
+ x: "0.00428286",
12721
+ y: "-0.742904",
12722
+ width: "33.5",
12723
+ height: "65.5",
12724
+ rx: "6.75",
12725
+ transform: "matrix(0.865865 0.500278 -0.871576 0.490261 189.756 85.4381)",
12726
+ fill: "white",
12727
+ stroke: "#52525B",
12728
+ strokeWidth: "1.5"
12729
+ }
12730
+ ),
12731
+ /* @__PURE__ */ jsxRuntime.jsx(
12732
+ "path",
12733
+ {
12734
+ d: "M180.579 107.142L179.126 107.959",
12735
+ stroke: "#52525B",
12736
+ strokeWidth: "1.5",
12737
+ strokeLinecap: "round",
12738
+ strokeLinejoin: "round"
12739
+ }
12740
+ ),
12741
+ /* @__PURE__ */ jsxRuntime.jsx(
12742
+ "path",
12743
+ {
12744
+ opacity: "0.88",
12745
+ d: "M182.305 109.546L180.257 109.534",
12746
+ stroke: "#52525B",
12747
+ strokeWidth: "1.5",
12748
+ strokeLinecap: "round",
12749
+ strokeLinejoin: "round"
12750
+ }
12751
+ ),
12752
+ /* @__PURE__ */ jsxRuntime.jsx(
12753
+ "path",
12754
+ {
12755
+ opacity: "0.75",
12756
+ d: "M180.551 111.93L179.108 111.096",
12757
+ stroke: "#52525B",
12758
+ strokeWidth: "1.5",
12759
+ strokeLinecap: "round",
12760
+ strokeLinejoin: "round"
12761
+ }
12762
+ ),
12763
+ /* @__PURE__ */ jsxRuntime.jsx(
12764
+ "path",
12765
+ {
12766
+ opacity: "0.63",
12767
+ d: "M176.347 112.897L176.354 111.73",
12768
+ stroke: "#52525B",
12769
+ strokeWidth: "1.5",
12770
+ strokeLinecap: "round",
12771
+ strokeLinejoin: "round"
12772
+ }
12773
+ ),
12774
+ /* @__PURE__ */ jsxRuntime.jsx(
12775
+ "path",
12776
+ {
12777
+ opacity: "0.5",
12778
+ d: "M172.153 111.881L173.606 111.064",
12779
+ stroke: "#52525B",
12780
+ strokeWidth: "1.5",
12781
+ strokeLinecap: "round",
12782
+ strokeLinejoin: "round"
12783
+ }
12784
+ ),
12785
+ /* @__PURE__ */ jsxRuntime.jsx(
12786
+ "path",
12787
+ {
12788
+ opacity: "0.38",
12789
+ d: "M170.428 109.478L172.476 109.489",
12790
+ stroke: "#52525B",
12791
+ strokeWidth: "1.5",
12792
+ strokeLinecap: "round",
12793
+ strokeLinejoin: "round"
12794
+ }
12795
+ ),
12796
+ /* @__PURE__ */ jsxRuntime.jsx(
12797
+ "path",
12798
+ {
12799
+ opacity: "0.25",
12800
+ d: "M172.181 107.094L173.624 107.928",
12801
+ stroke: "#52525B",
12802
+ strokeWidth: "1.5",
12803
+ strokeLinecap: "round",
12804
+ strokeLinejoin: "round"
12805
+ }
12806
+ ),
12807
+ /* @__PURE__ */ jsxRuntime.jsx(
12808
+ "path",
12809
+ {
12810
+ opacity: "0.13",
12811
+ d: "M176.386 106.126L176.379 107.294",
12812
+ stroke: "#52525B",
12813
+ strokeWidth: "1.5",
12814
+ strokeLinecap: "round",
12815
+ strokeLinejoin: "round"
12816
+ }
12817
+ ),
12818
+ /* @__PURE__ */ jsxRuntime.jsx(
12819
+ "rect",
12820
+ {
12821
+ width: "12",
12822
+ height: "3",
12823
+ rx: "1.5",
12824
+ transform: "matrix(0.865865 0.500278 -0.871576 0.490261 196.447 92.2925)",
12825
+ fill: "#D4D4D8"
12826
+ }
12827
+ ),
12828
+ /* @__PURE__ */ jsxRuntime.jsx(
12829
+ "rect",
12830
+ {
12831
+ x: "0.00428286",
12832
+ y: "-0.742904",
12833
+ width: "33.5",
12834
+ height: "65.5",
12835
+ rx: "6.75",
12836
+ transform: "matrix(0.865865 0.500278 -0.871576 0.490261 117.023 46.4147)",
12837
+ fill: "#D4D4D8",
12838
+ stroke: "#52525B",
12839
+ strokeWidth: "1.5"
12840
+ }
12841
+ ),
12842
+ /* @__PURE__ */ jsxRuntime.jsx(
12843
+ "rect",
12844
+ {
12845
+ x: "0.00428286",
12846
+ y: "-0.742904",
12847
+ width: "33.5",
12848
+ height: "65.5",
12849
+ rx: "6.75",
12850
+ transform: "matrix(0.865865 0.500278 -0.871576 0.490261 117.023 43.4147)",
12851
+ fill: "white",
12852
+ stroke: "#52525B",
12853
+ strokeWidth: "1.5"
12854
+ }
12855
+ ),
12856
+ /* @__PURE__ */ jsxRuntime.jsx(
12857
+ "rect",
12858
+ {
12859
+ width: "12",
12860
+ height: "3",
12861
+ rx: "1.5",
12862
+ transform: "matrix(0.865865 0.500278 -0.871576 0.490261 123.714 50.2691)",
12863
+ fill: "#D4D4D8"
12864
+ }
12865
+ ),
12866
+ /* @__PURE__ */ jsxRuntime.jsx(
12867
+ "rect",
12868
+ {
12869
+ width: "17",
12870
+ height: "3",
12871
+ rx: "1.5",
12872
+ transform: "matrix(0.865865 0.500278 -0.871576 0.490261 97.5557 66.958)",
12873
+ fill: "#D4D4D8"
12874
+ }
12875
+ ),
12876
+ /* @__PURE__ */ jsxRuntime.jsx(
12877
+ "rect",
12878
+ {
12879
+ width: "12",
12880
+ height: "3",
12881
+ rx: "1.5",
12882
+ transform: "matrix(0.865865 0.500278 -0.871576 0.490261 93.1978 69.4093)",
12883
+ fill: "#D4D4D8"
12884
+ }
12885
+ ),
12886
+ /* @__PURE__ */ jsxRuntime.jsx(
12887
+ "path",
12888
+ {
12889
+ d: "M92.3603 63.9563C90.9277 63.1286 88.59 63.1152 87.148 63.9263C85.7059 64.7374 85.6983 66.0702 87.1308 66.8979C88.5634 67.7256 90.9011 67.7391 92.3432 66.928C93.7852 66.1168 93.7929 64.784 92.3603 63.9563ZM88.4382 66.1625C87.7221 65.7488 87.726 65.0822 88.4468 64.6767C89.1676 64.2713 90.3369 64.278 91.0529 64.6917C91.769 65.1055 91.7652 65.7721 91.0444 66.1775C90.3236 66.583 89.1543 66.5762 88.4382 66.1625Z",
12890
+ fill: "#A1A1AA"
12891
+ }
12892
+ ),
12893
+ /* @__PURE__ */ jsxRuntime.jsx(
12894
+ "rect",
12895
+ {
12896
+ width: "17",
12897
+ height: "3",
12898
+ rx: "1.5",
12899
+ transform: "matrix(0.865865 0.500278 -0.871576 0.490261 109.758 60.0944)",
12900
+ fill: "#A1A1AA"
12901
+ }
12902
+ ),
12903
+ /* @__PURE__ */ jsxRuntime.jsx(
12904
+ "rect",
12905
+ {
12906
+ width: "12",
12907
+ height: "3",
12908
+ rx: "1.5",
12909
+ transform: "matrix(0.865865 0.500278 -0.871576 0.490261 105.4 62.5457)",
12910
+ fill: "#A1A1AA"
12911
+ }
12912
+ ),
12913
+ /* @__PURE__ */ jsxRuntime.jsx(
12914
+ "path",
12915
+ {
12916
+ d: "M104.562 57.0927C103.13 56.265 100.792 56.2515 99.3501 57.0626C97.9081 57.8738 97.9004 59.2065 99.333 60.0343C100.766 60.862 103.103 60.8754 104.545 60.0643C105.987 59.2532 105.995 57.9204 104.562 57.0927ZM103.858 58.8972L100.815 59.1265C100.683 59.1367 100.55 59.1134 100.449 59.063C100.44 59.0585 100.432 59.0545 100.425 59.05C100.339 59.0005 100.29 58.9336 100.291 58.8637L100.294 58.1201C100.294 57.9752 100.501 57.8585 100.756 57.86C101.01 57.8615 101.217 57.98 101.216 58.1256L101.214 58.5669L103.732 58.3769C103.984 58.3578 104.217 58.4584 104.251 58.603C104.286 58.7468 104.11 58.8788 103.858 58.8977L103.858 58.8972Z",
12917
+ fill: "#52525B"
12918
+ }
12919
+ ),
12920
+ /* @__PURE__ */ jsxRuntime.jsx("g", { clipPath: "url(#clip0_20915_38670)", children: /* @__PURE__ */ jsxRuntime.jsx(
12921
+ "path",
12922
+ {
12923
+ d: "M133.106 81.8022L140.49 81.8447L140.515 77.6349",
12924
+ stroke: "#A1A1AA",
12925
+ strokeWidth: "1.5",
12926
+ strokeLinecap: "round",
12927
+ strokeLinejoin: "round"
12928
+ }
12929
+ ) }),
12930
+ /* @__PURE__ */ jsxRuntime.jsx("g", { clipPath: "url(#clip1_20915_38670)", children: /* @__PURE__ */ jsxRuntime.jsx(
12931
+ "path",
12932
+ {
12933
+ d: "M143.496 87.8055L150.881 87.8481L150.905 83.6383",
12934
+ stroke: "#A1A1AA",
12935
+ strokeWidth: "1.5",
12936
+ strokeLinecap: "round",
12937
+ strokeLinejoin: "round"
12938
+ }
12939
+ ) }),
12940
+ /* @__PURE__ */ jsxRuntime.jsx("g", { clipPath: "url(#clip2_20915_38670)", children: /* @__PURE__ */ jsxRuntime.jsx(
12941
+ "path",
12942
+ {
12943
+ d: "M153.887 93.8088L161.271 93.8514L161.295 89.6416",
12944
+ stroke: "#A1A1AA",
12945
+ strokeWidth: "1.5",
12946
+ strokeLinecap: "round",
12947
+ strokeLinejoin: "round"
12948
+ }
12949
+ ) }),
12950
+ /* @__PURE__ */ jsxRuntime.jsx("g", { clipPath: "url(#clip3_20915_38670)", children: /* @__PURE__ */ jsxRuntime.jsx(
12951
+ "path",
12952
+ {
12953
+ d: "M126.114 89.1912L118.729 89.1486L118.705 93.3584",
12954
+ stroke: "#A1A1AA",
12955
+ strokeWidth: "1.5",
12956
+ strokeLinecap: "round",
12957
+ strokeLinejoin: "round"
12958
+ }
12959
+ ) }),
12960
+ /* @__PURE__ */ jsxRuntime.jsx("g", { clipPath: "url(#clip4_20915_38670)", children: /* @__PURE__ */ jsxRuntime.jsx(
12961
+ "path",
12962
+ {
12963
+ d: "M136.504 95.1945L129.12 95.1519L129.095 99.3617",
12964
+ stroke: "#A1A1AA",
12965
+ strokeWidth: "1.5",
12966
+ strokeLinecap: "round",
12967
+ strokeLinejoin: "round"
12968
+ }
12969
+ ) }),
12970
+ /* @__PURE__ */ jsxRuntime.jsx("g", { clipPath: "url(#clip5_20915_38670)", children: /* @__PURE__ */ jsxRuntime.jsx(
12971
+ "path",
12972
+ {
12973
+ d: "M146.894 101.198L139.51 101.155L139.486 105.365",
12974
+ stroke: "#A1A1AA",
12975
+ strokeWidth: "1.5",
12976
+ strokeLinecap: "round",
12977
+ strokeLinejoin: "round"
12978
+ }
12979
+ ) }),
12980
+ /* @__PURE__ */ jsxRuntime.jsxs("defs", { children: [
12981
+ /* @__PURE__ */ jsxRuntime.jsx("clipPath", { id: "clip0_20915_38670", children: /* @__PURE__ */ jsxRuntime.jsx(
12982
+ "rect",
12922
12983
  {
12923
- options: locations.options,
12924
- fetchNextPage: locations.fetchNextPage,
12925
- isFetchingNextPage: locations.isFetchingNextPage,
12926
- searchValue: locations.searchValue,
12927
- onSearchValueChange: locations.onSearchValueChange,
12928
- placeholder: "Select location",
12929
- onChange: (value) => {
12930
- setValue("shipping_option_id", "", {
12931
- shouldDirty: true,
12932
- shouldTouch: true
12933
- });
12934
- onChange(value);
12935
- },
12936
- ...field
12984
+ width: "12",
12985
+ height: "12",
12986
+ fill: "white",
12987
+ transform: "matrix(0.865865 0.500278 -0.871576 0.490261 138.36 74.6508)"
12937
12988
  }
12938
- ) })
12939
- ] }) });
12940
- }
12941
- }
12942
- );
12943
- };
12944
- const ShippingOptionField = ({
12945
- shippingProfileId,
12946
- preview,
12947
- control
12948
- }) => {
12949
- var _a;
12950
- const locationId = reactHookForm.useWatch({ control, name: "location_id" });
12951
- const shippingOptions = useComboboxData({
12952
- queryKey: ["shipping_options", locationId, shippingProfileId],
12953
- queryFn: async (params) => {
12954
- return await sdk.admin.shippingOption.list({
12955
- ...params,
12956
- stock_location_id: locationId,
12957
- shipping_profile_id: shippingProfileId
12958
- });
12959
- },
12960
- getOptions: (data) => {
12961
- return data.shipping_options.map((option) => {
12962
- var _a2;
12963
- if ((_a2 = option.rules) == null ? void 0 : _a2.find(
12964
- (r) => r.attribute === "is_return" && r.value === "true"
12965
- )) {
12966
- return void 0;
12967
- }
12968
- return {
12969
- label: option.name,
12970
- value: option.id
12971
- };
12972
- }).filter(Boolean);
12973
- },
12974
- enabled: !!locationId && !!shippingProfileId,
12975
- defaultValue: ((_a = preview.shipping_methods[0]) == null ? void 0 : _a.shipping_option_id) || void 0
12976
- });
12977
- const tooltipContent = !locationId && !shippingProfileId ? "Choose a location and shipping profile first." : !locationId ? "Choose a location first." : "Choose a shipping profile first.";
12978
- return /* @__PURE__ */ jsxRuntime.jsx(
12979
- Form$2.Field,
12980
- {
12981
- control,
12982
- name: "shipping_option_id",
12983
- render: ({ field }) => {
12984
- return /* @__PURE__ */ jsxRuntime.jsx(Form$2.Item, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-x-3", children: [
12985
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col", children: [
12986
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Shipping option" }),
12987
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Hint, { children: "Choose the shipping option to use." })
12988
- ] }),
12989
- /* @__PURE__ */ jsxRuntime.jsx(
12990
- ConditionalTooltip,
12989
+ ) }),
12990
+ /* @__PURE__ */ jsxRuntime.jsx("clipPath", { id: "clip1_20915_38670", children: /* @__PURE__ */ jsxRuntime.jsx(
12991
+ "rect",
12991
12992
  {
12992
- content: tooltipContent,
12993
- showTooltip: !locationId || !shippingProfileId,
12994
- children: /* @__PURE__ */ jsxRuntime.jsx("div", { children: /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
12995
- Combobox,
12996
- {
12997
- options: shippingOptions.options,
12998
- fetchNextPage: shippingOptions.fetchNextPage,
12999
- isFetchingNextPage: shippingOptions.isFetchingNextPage,
13000
- searchValue: shippingOptions.searchValue,
13001
- onSearchValueChange: shippingOptions.onSearchValueChange,
13002
- placeholder: "Select shipping option",
13003
- ...field,
13004
- disabled: !locationId || !shippingProfileId
13005
- }
13006
- ) }) })
12993
+ width: "12",
12994
+ height: "12",
12995
+ fill: "white",
12996
+ transform: "matrix(0.865865 0.500278 -0.871576 0.490261 148.75 80.6541)"
13007
12997
  }
13008
- )
13009
- ] }) });
13010
- }
13011
- }
13012
- );
13013
- };
13014
- const CustomAmountField = ({
13015
- control,
13016
- currencyCode
13017
- }) => {
13018
- return /* @__PURE__ */ jsxRuntime.jsx(
13019
- Form$2.Field,
13020
- {
13021
- control,
13022
- name: "custom_amount",
13023
- render: ({ field: { onChange, ...field } }) => {
13024
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-x-3", children: [
13025
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col", children: [
13026
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Custom amount" }),
13027
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Hint, { children: "Set a custom amount for the shipping option." })
13028
- ] }),
13029
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
13030
- ui.CurrencyInput,
12998
+ ) }),
12999
+ /* @__PURE__ */ jsxRuntime.jsx("clipPath", { id: "clip2_20915_38670", children: /* @__PURE__ */ jsxRuntime.jsx(
13000
+ "rect",
13031
13001
  {
13032
- ...field,
13033
- onValueChange: (value) => onChange(value),
13034
- symbol: getNativeSymbol(currencyCode),
13035
- code: currencyCode
13002
+ width: "12",
13003
+ height: "12",
13004
+ fill: "white",
13005
+ transform: "matrix(0.865865 0.500278 -0.871576 0.490261 159.141 86.6575)"
13006
+ }
13007
+ ) }),
13008
+ /* @__PURE__ */ jsxRuntime.jsx("clipPath", { id: "clip3_20915_38670", children: /* @__PURE__ */ jsxRuntime.jsx(
13009
+ "rect",
13010
+ {
13011
+ width: "12",
13012
+ height: "12",
13013
+ fill: "white",
13014
+ transform: "matrix(0.865865 0.500278 -0.871576 0.490261 120.928 84.4561)"
13015
+ }
13016
+ ) }),
13017
+ /* @__PURE__ */ jsxRuntime.jsx("clipPath", { id: "clip4_20915_38670", children: /* @__PURE__ */ jsxRuntime.jsx(
13018
+ "rect",
13019
+ {
13020
+ width: "12",
13021
+ height: "12",
13022
+ fill: "white",
13023
+ transform: "matrix(0.865865 0.500278 -0.871576 0.490261 131.318 90.4594)"
13024
+ }
13025
+ ) }),
13026
+ /* @__PURE__ */ jsxRuntime.jsx("clipPath", { id: "clip5_20915_38670", children: /* @__PURE__ */ jsxRuntime.jsx(
13027
+ "rect",
13028
+ {
13029
+ width: "12",
13030
+ height: "12",
13031
+ fill: "white",
13032
+ transform: "matrix(0.865865 0.500278 -0.871576 0.490261 141.709 96.4627)"
13036
13033
  }
13037
13034
  ) })
13038
- ] });
13039
- }
13035
+ ] })
13036
+ ]
13040
13037
  }
13041
13038
  );
13042
13039
  };
13040
+ const schema = objectType({
13041
+ customer_id: stringType().min(1)
13042
+ });
13043
13043
  const widgetModule = { widgets: [] };
13044
13044
  const routeModule = {
13045
13045
  routes: [
@@ -13060,14 +13060,14 @@ const routeModule = {
13060
13060
  handle,
13061
13061
  loader,
13062
13062
  children: [
13063
- {
13064
- Component: BillingAddress,
13065
- path: "/draft-orders/:id/billing-address"
13066
- },
13067
13063
  {
13068
13064
  Component: CustomItems,
13069
13065
  path: "/draft-orders/:id/custom-items"
13070
13066
  },
13067
+ {
13068
+ Component: BillingAddress,
13069
+ path: "/draft-orders/:id/billing-address"
13070
+ },
13071
13071
  {
13072
13072
  Component: Email,
13073
13073
  path: "/draft-orders/:id/email"
@@ -13088,6 +13088,10 @@ const routeModule = {
13088
13088
  Component: SalesChannel,
13089
13089
  path: "/draft-orders/:id/sales-channel"
13090
13090
  },
13091
+ {
13092
+ Component: Shipping,
13093
+ path: "/draft-orders/:id/shipping"
13094
+ },
13091
13095
  {
13092
13096
  Component: ShippingAddress,
13093
13097
  path: "/draft-orders/:id/shipping-address"
@@ -13095,10 +13099,6 @@ const routeModule = {
13095
13099
  {
13096
13100
  Component: TransferOwnership,
13097
13101
  path: "/draft-orders/:id/transfer-ownership"
13098
- },
13099
- {
13100
- Component: Shipping,
13101
- path: "/draft-orders/:id/shipping"
13102
13102
  }
13103
13103
  ]
13104
13104
  }