@medusajs/draft-order 2.11.0-preview-20251020210155 → 2.11.0-preview-20251021031736

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.
@@ -9571,6 +9571,196 @@ const ID = () => {
9571
9571
  /* @__PURE__ */ jsxRuntime.jsx(reactRouterDom.Outlet, {})
9572
9572
  ] });
9573
9573
  };
9574
+ const BillingAddress = () => {
9575
+ const { id } = reactRouterDom.useParams();
9576
+ const { order, isPending, isError, error } = useOrder(id, {
9577
+ fields: "+billing_address"
9578
+ });
9579
+ if (isError) {
9580
+ throw error;
9581
+ }
9582
+ const isReady = !isPending && !!order;
9583
+ return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
9584
+ /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
9585
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Billing Address" }) }),
9586
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit the billing address for the draft order" }) })
9587
+ ] }),
9588
+ isReady && /* @__PURE__ */ jsxRuntime.jsx(BillingAddressForm, { order })
9589
+ ] });
9590
+ };
9591
+ const BillingAddressForm = ({ order }) => {
9592
+ var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
9593
+ const form = reactHookForm.useForm({
9594
+ defaultValues: {
9595
+ first_name: ((_a = order.billing_address) == null ? void 0 : _a.first_name) ?? "",
9596
+ last_name: ((_b = order.billing_address) == null ? void 0 : _b.last_name) ?? "",
9597
+ company: ((_c = order.billing_address) == null ? void 0 : _c.company) ?? "",
9598
+ address_1: ((_d = order.billing_address) == null ? void 0 : _d.address_1) ?? "",
9599
+ address_2: ((_e = order.billing_address) == null ? void 0 : _e.address_2) ?? "",
9600
+ city: ((_f = order.billing_address) == null ? void 0 : _f.city) ?? "",
9601
+ province: ((_g = order.billing_address) == null ? void 0 : _g.province) ?? "",
9602
+ country_code: ((_h = order.billing_address) == null ? void 0 : _h.country_code) ?? "",
9603
+ postal_code: ((_i = order.billing_address) == null ? void 0 : _i.postal_code) ?? "",
9604
+ phone: ((_j = order.billing_address) == null ? void 0 : _j.phone) ?? ""
9605
+ },
9606
+ resolver: zod.zodResolver(schema$5)
9607
+ });
9608
+ const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
9609
+ const { handleSuccess } = useRouteModal();
9610
+ const onSubmit = form.handleSubmit(async (data) => {
9611
+ await mutateAsync(
9612
+ { billing_address: data },
9613
+ {
9614
+ onSuccess: () => {
9615
+ handleSuccess();
9616
+ },
9617
+ onError: (error) => {
9618
+ ui.toast.error(error.message);
9619
+ }
9620
+ }
9621
+ );
9622
+ });
9623
+ return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
9624
+ KeyboundForm,
9625
+ {
9626
+ className: "flex flex-1 flex-col overflow-hidden",
9627
+ onSubmit,
9628
+ children: [
9629
+ /* @__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: [
9630
+ /* @__PURE__ */ jsxRuntime.jsx(
9631
+ Form$2.Field,
9632
+ {
9633
+ control: form.control,
9634
+ name: "country_code",
9635
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9636
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Country" }),
9637
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(CountrySelect, { ...field }) }),
9638
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9639
+ ] })
9640
+ }
9641
+ ),
9642
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
9643
+ /* @__PURE__ */ jsxRuntime.jsx(
9644
+ Form$2.Field,
9645
+ {
9646
+ control: form.control,
9647
+ name: "first_name",
9648
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9649
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "First name" }),
9650
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9651
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9652
+ ] })
9653
+ }
9654
+ ),
9655
+ /* @__PURE__ */ jsxRuntime.jsx(
9656
+ Form$2.Field,
9657
+ {
9658
+ control: form.control,
9659
+ name: "last_name",
9660
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9661
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Last name" }),
9662
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9663
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9664
+ ] })
9665
+ }
9666
+ )
9667
+ ] }),
9668
+ /* @__PURE__ */ jsxRuntime.jsx(
9669
+ Form$2.Field,
9670
+ {
9671
+ control: form.control,
9672
+ name: "company",
9673
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9674
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Company" }),
9675
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9676
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9677
+ ] })
9678
+ }
9679
+ ),
9680
+ /* @__PURE__ */ jsxRuntime.jsx(
9681
+ Form$2.Field,
9682
+ {
9683
+ control: form.control,
9684
+ name: "address_1",
9685
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9686
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Address" }),
9687
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9688
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9689
+ ] })
9690
+ }
9691
+ ),
9692
+ /* @__PURE__ */ jsxRuntime.jsx(
9693
+ Form$2.Field,
9694
+ {
9695
+ control: form.control,
9696
+ name: "address_2",
9697
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9698
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Apartment, suite, etc." }),
9699
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9700
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9701
+ ] })
9702
+ }
9703
+ ),
9704
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
9705
+ /* @__PURE__ */ jsxRuntime.jsx(
9706
+ Form$2.Field,
9707
+ {
9708
+ control: form.control,
9709
+ name: "postal_code",
9710
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9711
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Postal code" }),
9712
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9713
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9714
+ ] })
9715
+ }
9716
+ ),
9717
+ /* @__PURE__ */ jsxRuntime.jsx(
9718
+ Form$2.Field,
9719
+ {
9720
+ control: form.control,
9721
+ name: "city",
9722
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9723
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "City" }),
9724
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9725
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9726
+ ] })
9727
+ }
9728
+ )
9729
+ ] }),
9730
+ /* @__PURE__ */ jsxRuntime.jsx(
9731
+ Form$2.Field,
9732
+ {
9733
+ control: form.control,
9734
+ name: "province",
9735
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9736
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Province / State" }),
9737
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9738
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9739
+ ] })
9740
+ }
9741
+ ),
9742
+ /* @__PURE__ */ jsxRuntime.jsx(
9743
+ Form$2.Field,
9744
+ {
9745
+ control: form.control,
9746
+ name: "phone",
9747
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9748
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Phone" }),
9749
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9750
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9751
+ ] })
9752
+ }
9753
+ )
9754
+ ] }) }),
9755
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
9756
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
9757
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
9758
+ ] }) })
9759
+ ]
9760
+ }
9761
+ ) });
9762
+ };
9763
+ const schema$5 = addressSchema;
9574
9764
  const CustomItems = () => {
9575
9765
  return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
9576
9766
  /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Header, { children: /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Custom Items" }) }) }),
@@ -9579,7 +9769,7 @@ const CustomItems = () => {
9579
9769
  };
9580
9770
  const CustomItemsForm = () => {
9581
9771
  const form = reactHookForm.useForm({
9582
- resolver: zod.zodResolver(schema$5)
9772
+ resolver: zod.zodResolver(schema$4)
9583
9773
  });
9584
9774
  return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(KeyboundForm, { className: "flex flex-1 flex-col", children: [
9585
9775
  /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, {}),
@@ -9589,7 +9779,7 @@ const CustomItemsForm = () => {
9589
9779
  ] }) })
9590
9780
  ] }) });
9591
9781
  };
9592
- const schema$5 = objectType({
9782
+ const schema$4 = objectType({
9593
9783
  email: stringType().email()
9594
9784
  });
9595
9785
  const Email = () => {
@@ -9614,7 +9804,7 @@ const EmailForm = ({ order }) => {
9614
9804
  defaultValues: {
9615
9805
  email: order.email ?? ""
9616
9806
  },
9617
- resolver: zod.zodResolver(schema$4)
9807
+ resolver: zod.zodResolver(schema$3)
9618
9808
  });
9619
9809
  const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
9620
9810
  const { handleSuccess } = useRouteModal();
@@ -9657,7 +9847,7 @@ const EmailForm = ({ order }) => {
9657
9847
  }
9658
9848
  ) });
9659
9849
  };
9660
- const schema$4 = objectType({
9850
+ const schema$3 = objectType({
9661
9851
  email: stringType().email()
9662
9852
  });
9663
9853
  const NumberInput = React.forwardRef(
@@ -11261,160 +11451,54 @@ function getPromotionIds(items, shippingMethods) {
11261
11451
  }
11262
11452
  return Array.from(promotionIds);
11263
11453
  }
11264
- const SalesChannel = () => {
11454
+ const STACKED_FOCUS_MODAL_ID = "shipping-form";
11455
+ const Shipping = () => {
11456
+ var _a;
11265
11457
  const { id } = reactRouterDom.useParams();
11266
- const { draft_order, isPending, isError, error } = useDraftOrder(
11267
- id,
11458
+ const { order, isPending, isError, error } = useOrder(id, {
11459
+ fields: "+items.*,+items.variant.*,+items.variant.product.*,+items.variant.product.shipping_profile.*,+currency_code"
11460
+ });
11461
+ const {
11462
+ order: preview,
11463
+ isPending: isPreviewPending,
11464
+ isError: isPreviewError,
11465
+ error: previewError
11466
+ } = useOrderPreview(id);
11467
+ useInitiateOrderEdit({ preview });
11468
+ const { onCancel } = useCancelOrderEdit({ preview });
11469
+ if (isError) {
11470
+ throw error;
11471
+ }
11472
+ if (isPreviewError) {
11473
+ throw previewError;
11474
+ }
11475
+ const orderHasItems = (((_a = order == null ? void 0 : order.items) == null ? void 0 : _a.length) || 0) > 0;
11476
+ const isReady = preview && !isPreviewPending && order && !isPending;
11477
+ return /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal, { onClose: onCancel, children: !orderHasItems ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex h-full flex-col overflow-hidden ", children: [
11478
+ /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Header, {}),
11479
+ /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Body, { className: "flex flex-1 flex-col overflow-hidden", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-1 flex-col items-center overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex w-full max-w-[720px] flex-col gap-y-6 py-16 px-6", children: [
11480
+ /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Shipping" }) }),
11481
+ /* @__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." }) })
11482
+ ] }) }) }),
11483
+ /* @__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" }) }) })
11484
+ ] }) : isReady ? /* @__PURE__ */ jsxRuntime.jsx(ShippingForm, { preview, order }) : /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
11485
+ /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit Shipping" }) }),
11486
+ /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Loading data for the draft order, please wait..." }) })
11487
+ ] }) });
11488
+ };
11489
+ const ShippingForm = ({ preview, order }) => {
11490
+ var _a;
11491
+ const { setIsOpen } = useStackedModal();
11492
+ const [isSubmitting, setIsSubmitting] = React.useState(false);
11493
+ const [data, setData] = React.useState(null);
11494
+ const appliedShippingOptionIds = (_a = preview.shipping_methods) == null ? void 0 : _a.map((method) => method.shipping_option_id).filter(Boolean);
11495
+ const { shipping_options } = useShippingOptions(
11268
11496
  {
11269
- fields: "+sales_channel_id"
11497
+ id: appliedShippingOptionIds,
11498
+ fields: "+service_zone.*,+service_zone.fulfillment_set.*,+service_zone.fulfillment_set.location.*"
11270
11499
  },
11271
11500
  {
11272
- enabled: !!id
11273
- }
11274
- );
11275
- if (isError) {
11276
- throw error;
11277
- }
11278
- const ISrEADY = !!draft_order && !isPending;
11279
- return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
11280
- /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
11281
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Sales Channel" }) }),
11282
- /* @__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" }) })
11283
- ] }),
11284
- ISrEADY && /* @__PURE__ */ jsxRuntime.jsx(SalesChannelForm, { order: draft_order })
11285
- ] });
11286
- };
11287
- const SalesChannelForm = ({ order }) => {
11288
- const form = reactHookForm.useForm({
11289
- defaultValues: {
11290
- sales_channel_id: order.sales_channel_id || ""
11291
- },
11292
- resolver: zod.zodResolver(schema$3)
11293
- });
11294
- const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
11295
- const { handleSuccess } = useRouteModal();
11296
- const onSubmit = form.handleSubmit(async (data) => {
11297
- await mutateAsync(
11298
- {
11299
- sales_channel_id: data.sales_channel_id
11300
- },
11301
- {
11302
- onSuccess: () => {
11303
- ui.toast.success("Sales channel updated");
11304
- handleSuccess();
11305
- },
11306
- onError: (error) => {
11307
- ui.toast.error(error.message);
11308
- }
11309
- }
11310
- );
11311
- });
11312
- return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
11313
- KeyboundForm,
11314
- {
11315
- className: "flex flex-1 flex-col overflow-hidden",
11316
- onSubmit,
11317
- children: [
11318
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsx(SalesChannelField, { control: form.control, order }) }),
11319
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
11320
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
11321
- /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
11322
- ] }) })
11323
- ]
11324
- }
11325
- ) });
11326
- };
11327
- const SalesChannelField = ({ control, order }) => {
11328
- const salesChannels = useComboboxData({
11329
- queryFn: async (params) => {
11330
- return await sdk.admin.salesChannel.list(params);
11331
- },
11332
- queryKey: ["sales-channels"],
11333
- getOptions: (data) => {
11334
- return data.sales_channels.map((salesChannel) => ({
11335
- label: salesChannel.name,
11336
- value: salesChannel.id
11337
- }));
11338
- },
11339
- defaultValue: order.sales_channel_id || void 0
11340
- });
11341
- return /* @__PURE__ */ jsxRuntime.jsx(
11342
- Form$2.Field,
11343
- {
11344
- control,
11345
- name: "sales_channel_id",
11346
- render: ({ field }) => {
11347
- return /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11348
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Sales Channel" }),
11349
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
11350
- Combobox,
11351
- {
11352
- options: salesChannels.options,
11353
- fetchNextPage: salesChannels.fetchNextPage,
11354
- isFetchingNextPage: salesChannels.isFetchingNextPage,
11355
- searchValue: salesChannels.searchValue,
11356
- onSearchValueChange: salesChannels.onSearchValueChange,
11357
- placeholder: "Select sales channel",
11358
- ...field
11359
- }
11360
- ) }),
11361
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11362
- ] });
11363
- }
11364
- }
11365
- );
11366
- };
11367
- const schema$3 = objectType({
11368
- sales_channel_id: stringType().min(1)
11369
- });
11370
- const STACKED_FOCUS_MODAL_ID = "shipping-form";
11371
- const Shipping = () => {
11372
- var _a;
11373
- const { id } = reactRouterDom.useParams();
11374
- const { order, isPending, isError, error } = useOrder(id, {
11375
- fields: "+items.*,+items.variant.*,+items.variant.product.*,+items.variant.product.shipping_profile.*,+currency_code"
11376
- });
11377
- const {
11378
- order: preview,
11379
- isPending: isPreviewPending,
11380
- isError: isPreviewError,
11381
- error: previewError
11382
- } = useOrderPreview(id);
11383
- useInitiateOrderEdit({ preview });
11384
- const { onCancel } = useCancelOrderEdit({ preview });
11385
- if (isError) {
11386
- throw error;
11387
- }
11388
- if (isPreviewError) {
11389
- throw previewError;
11390
- }
11391
- const orderHasItems = (((_a = order == null ? void 0 : order.items) == null ? void 0 : _a.length) || 0) > 0;
11392
- const isReady = preview && !isPreviewPending && order && !isPending;
11393
- return /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal, { onClose: onCancel, children: !orderHasItems ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex h-full flex-col overflow-hidden ", children: [
11394
- /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Header, {}),
11395
- /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Body, { className: "flex flex-1 flex-col overflow-hidden", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-1 flex-col items-center overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex w-full max-w-[720px] flex-col gap-y-6 py-16 px-6", children: [
11396
- /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Shipping" }) }),
11397
- /* @__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." }) })
11398
- ] }) }) }),
11399
- /* @__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" }) }) })
11400
- ] }) : isReady ? /* @__PURE__ */ jsxRuntime.jsx(ShippingForm, { preview, order }) : /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
11401
- /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit Shipping" }) }),
11402
- /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Loading data for the draft order, please wait..." }) })
11403
- ] }) });
11404
- };
11405
- const ShippingForm = ({ preview, order }) => {
11406
- var _a;
11407
- const { setIsOpen } = useStackedModal();
11408
- const [isSubmitting, setIsSubmitting] = React.useState(false);
11409
- const [data, setData] = React.useState(null);
11410
- const appliedShippingOptionIds = (_a = preview.shipping_methods) == null ? void 0 : _a.map((method) => method.shipping_option_id).filter(Boolean);
11411
- const { shipping_options } = useShippingOptions(
11412
- {
11413
- id: appliedShippingOptionIds,
11414
- fields: "+service_zone.*,+service_zone.fulfillment_set.*,+service_zone.fulfillment_set.location.*"
11415
- },
11416
- {
11417
- enabled: appliedShippingOptionIds.length > 0
11501
+ enabled: appliedShippingOptionIds.length > 0
11418
11502
  }
11419
11503
  );
11420
11504
  const uniqueShippingProfiles = React.useMemo(() => {
@@ -12853,37 +12937,33 @@ const Illustration = () => {
12853
12937
  const schema$1 = objectType({
12854
12938
  customer_id: stringType().min(1)
12855
12939
  });
12856
- const BillingAddress = () => {
12940
+ const SalesChannel = () => {
12857
12941
  const { id } = reactRouterDom.useParams();
12858
- const { order, isPending, isError, error } = useOrder(id, {
12859
- fields: "+billing_address"
12860
- });
12942
+ const { draft_order, isPending, isError, error } = useDraftOrder(
12943
+ id,
12944
+ {
12945
+ fields: "+sales_channel_id"
12946
+ },
12947
+ {
12948
+ enabled: !!id
12949
+ }
12950
+ );
12861
12951
  if (isError) {
12862
12952
  throw error;
12863
12953
  }
12864
- const isReady = !isPending && !!order;
12954
+ const ISrEADY = !!draft_order && !isPending;
12865
12955
  return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
12866
12956
  /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
12867
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Billing Address" }) }),
12868
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit the billing address for the draft order" }) })
12957
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Sales Channel" }) }),
12958
+ /* @__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" }) })
12869
12959
  ] }),
12870
- isReady && /* @__PURE__ */ jsxRuntime.jsx(BillingAddressForm, { order })
12960
+ ISrEADY && /* @__PURE__ */ jsxRuntime.jsx(SalesChannelForm, { order: draft_order })
12871
12961
  ] });
12872
12962
  };
12873
- const BillingAddressForm = ({ order }) => {
12874
- var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
12963
+ const SalesChannelForm = ({ order }) => {
12875
12964
  const form = reactHookForm.useForm({
12876
12965
  defaultValues: {
12877
- first_name: ((_a = order.billing_address) == null ? void 0 : _a.first_name) ?? "",
12878
- last_name: ((_b = order.billing_address) == null ? void 0 : _b.last_name) ?? "",
12879
- company: ((_c = order.billing_address) == null ? void 0 : _c.company) ?? "",
12880
- address_1: ((_d = order.billing_address) == null ? void 0 : _d.address_1) ?? "",
12881
- address_2: ((_e = order.billing_address) == null ? void 0 : _e.address_2) ?? "",
12882
- city: ((_f = order.billing_address) == null ? void 0 : _f.city) ?? "",
12883
- province: ((_g = order.billing_address) == null ? void 0 : _g.province) ?? "",
12884
- country_code: ((_h = order.billing_address) == null ? void 0 : _h.country_code) ?? "",
12885
- postal_code: ((_i = order.billing_address) == null ? void 0 : _i.postal_code) ?? "",
12886
- phone: ((_j = order.billing_address) == null ? void 0 : _j.phone) ?? ""
12966
+ sales_channel_id: order.sales_channel_id || ""
12887
12967
  },
12888
12968
  resolver: zod.zodResolver(schema)
12889
12969
  });
@@ -12891,9 +12971,12 @@ const BillingAddressForm = ({ order }) => {
12891
12971
  const { handleSuccess } = useRouteModal();
12892
12972
  const onSubmit = form.handleSubmit(async (data) => {
12893
12973
  await mutateAsync(
12894
- { billing_address: data },
12974
+ {
12975
+ sales_channel_id: data.sales_channel_id
12976
+ },
12895
12977
  {
12896
12978
  onSuccess: () => {
12979
+ ui.toast.success("Sales channel updated");
12897
12980
  handleSuccess();
12898
12981
  },
12899
12982
  onError: (error) => {
@@ -12908,132 +12991,7 @@ const BillingAddressForm = ({ order }) => {
12908
12991
  className: "flex flex-1 flex-col overflow-hidden",
12909
12992
  onSubmit,
12910
12993
  children: [
12911
- /* @__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: [
12912
- /* @__PURE__ */ jsxRuntime.jsx(
12913
- Form$2.Field,
12914
- {
12915
- control: form.control,
12916
- name: "country_code",
12917
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12918
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Country" }),
12919
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(CountrySelect, { ...field }) }),
12920
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12921
- ] })
12922
- }
12923
- ),
12924
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
12925
- /* @__PURE__ */ jsxRuntime.jsx(
12926
- Form$2.Field,
12927
- {
12928
- control: form.control,
12929
- name: "first_name",
12930
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12931
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "First name" }),
12932
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12933
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12934
- ] })
12935
- }
12936
- ),
12937
- /* @__PURE__ */ jsxRuntime.jsx(
12938
- Form$2.Field,
12939
- {
12940
- control: form.control,
12941
- name: "last_name",
12942
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12943
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Last name" }),
12944
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12945
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12946
- ] })
12947
- }
12948
- )
12949
- ] }),
12950
- /* @__PURE__ */ jsxRuntime.jsx(
12951
- Form$2.Field,
12952
- {
12953
- control: form.control,
12954
- name: "company",
12955
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12956
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Company" }),
12957
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12958
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12959
- ] })
12960
- }
12961
- ),
12962
- /* @__PURE__ */ jsxRuntime.jsx(
12963
- Form$2.Field,
12964
- {
12965
- control: form.control,
12966
- name: "address_1",
12967
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12968
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Address" }),
12969
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12970
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12971
- ] })
12972
- }
12973
- ),
12974
- /* @__PURE__ */ jsxRuntime.jsx(
12975
- Form$2.Field,
12976
- {
12977
- control: form.control,
12978
- name: "address_2",
12979
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12980
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Apartment, suite, etc." }),
12981
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12982
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12983
- ] })
12984
- }
12985
- ),
12986
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
12987
- /* @__PURE__ */ jsxRuntime.jsx(
12988
- Form$2.Field,
12989
- {
12990
- control: form.control,
12991
- name: "postal_code",
12992
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12993
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Postal code" }),
12994
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12995
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12996
- ] })
12997
- }
12998
- ),
12999
- /* @__PURE__ */ jsxRuntime.jsx(
13000
- Form$2.Field,
13001
- {
13002
- control: form.control,
13003
- name: "city",
13004
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
13005
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "City" }),
13006
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
13007
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
13008
- ] })
13009
- }
13010
- )
13011
- ] }),
13012
- /* @__PURE__ */ jsxRuntime.jsx(
13013
- Form$2.Field,
13014
- {
13015
- control: form.control,
13016
- name: "province",
13017
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
13018
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Province / State" }),
13019
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
13020
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
13021
- ] })
13022
- }
13023
- ),
13024
- /* @__PURE__ */ jsxRuntime.jsx(
13025
- Form$2.Field,
13026
- {
13027
- control: form.control,
13028
- name: "phone",
13029
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
13030
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Phone" }),
13031
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
13032
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
13033
- ] })
13034
- }
13035
- )
13036
- ] }) }),
12994
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsx(SalesChannelField, { control: form.control, order }) }),
13037
12995
  /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
13038
12996
  /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
13039
12997
  /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
@@ -13042,7 +13000,49 @@ const BillingAddressForm = ({ order }) => {
13042
13000
  }
13043
13001
  ) });
13044
13002
  };
13045
- const schema = addressSchema;
13003
+ const SalesChannelField = ({ control, order }) => {
13004
+ const salesChannels = useComboboxData({
13005
+ queryFn: async (params) => {
13006
+ return await sdk.admin.salesChannel.list(params);
13007
+ },
13008
+ queryKey: ["sales-channels"],
13009
+ getOptions: (data) => {
13010
+ return data.sales_channels.map((salesChannel) => ({
13011
+ label: salesChannel.name,
13012
+ value: salesChannel.id
13013
+ }));
13014
+ },
13015
+ defaultValue: order.sales_channel_id || void 0
13016
+ });
13017
+ return /* @__PURE__ */ jsxRuntime.jsx(
13018
+ Form$2.Field,
13019
+ {
13020
+ control,
13021
+ name: "sales_channel_id",
13022
+ render: ({ field }) => {
13023
+ return /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
13024
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Sales Channel" }),
13025
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
13026
+ Combobox,
13027
+ {
13028
+ options: salesChannels.options,
13029
+ fetchNextPage: salesChannels.fetchNextPage,
13030
+ isFetchingNextPage: salesChannels.isFetchingNextPage,
13031
+ searchValue: salesChannels.searchValue,
13032
+ onSearchValueChange: salesChannels.onSearchValueChange,
13033
+ placeholder: "Select sales channel",
13034
+ ...field
13035
+ }
13036
+ ) }),
13037
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
13038
+ ] });
13039
+ }
13040
+ }
13041
+ );
13042
+ };
13043
+ const schema = objectType({
13044
+ sales_channel_id: stringType().min(1)
13045
+ });
13046
13046
  const widgetModule = { widgets: [] };
13047
13047
  const routeModule = {
13048
13048
  routes: [
@@ -13063,6 +13063,10 @@ const routeModule = {
13063
13063
  handle,
13064
13064
  loader,
13065
13065
  children: [
13066
+ {
13067
+ Component: BillingAddress,
13068
+ path: "/draft-orders/:id/billing-address"
13069
+ },
13066
13070
  {
13067
13071
  Component: CustomItems,
13068
13072
  path: "/draft-orders/:id/custom-items"
@@ -13083,10 +13087,6 @@ const routeModule = {
13083
13087
  Component: Promotions,
13084
13088
  path: "/draft-orders/:id/promotions"
13085
13089
  },
13086
- {
13087
- Component: SalesChannel,
13088
- path: "/draft-orders/:id/sales-channel"
13089
- },
13090
13090
  {
13091
13091
  Component: Shipping,
13092
13092
  path: "/draft-orders/:id/shipping"
@@ -13100,8 +13100,8 @@ const routeModule = {
13100
13100
  path: "/draft-orders/:id/transfer-ownership"
13101
13101
  },
13102
13102
  {
13103
- Component: BillingAddress,
13104
- path: "/draft-orders/:id/billing-address"
13103
+ Component: SalesChannel,
13104
+ path: "/draft-orders/:id/sales-channel"
13105
13105
  }
13106
13106
  ]
13107
13107
  }