@medusajs/draft-order 2.11.4-preview-20251113120143 → 2.11.4-preview-20251113150133

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