@medusajs/draft-order 2.10.4-preview-20250922060202 → 2.10.4-preview-20250922120207

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.
@@ -9641,6 +9641,27 @@ const EmailForm = ({ order }) => {
9641
9641
  const schema$5 = objectType({
9642
9642
  email: stringType().email()
9643
9643
  });
9644
+ const CustomItems = () => {
9645
+ return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
9646
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Header, { children: /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Custom Items" }) }) }),
9647
+ /* @__PURE__ */ jsxRuntime.jsx(CustomItemsForm, {})
9648
+ ] });
9649
+ };
9650
+ const CustomItemsForm = () => {
9651
+ const form = reactHookForm.useForm({
9652
+ resolver: zod.zodResolver(schema$4)
9653
+ });
9654
+ return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(KeyboundForm, { className: "flex flex-1 flex-col", children: [
9655
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, {}),
9656
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
9657
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
9658
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", children: "Save" })
9659
+ ] }) })
9660
+ ] }) });
9661
+ };
9662
+ const schema$4 = objectType({
9663
+ email: stringType().email()
9664
+ });
9644
9665
  const NumberInput = React.forwardRef(
9645
9666
  ({
9646
9667
  value,
@@ -11242,10 +11263,116 @@ function getPromotionIds(items, shippingMethods) {
11242
11263
  }
11243
11264
  return Array.from(promotionIds);
11244
11265
  }
11245
- const BillingAddress = () => {
11266
+ const SalesChannel = () => {
11267
+ const { id } = reactRouterDom.useParams();
11268
+ const { draft_order, isPending, isError, error } = useDraftOrder(
11269
+ id,
11270
+ {
11271
+ fields: "+sales_channel_id"
11272
+ },
11273
+ {
11274
+ enabled: !!id
11275
+ }
11276
+ );
11277
+ if (isError) {
11278
+ throw error;
11279
+ }
11280
+ const ISrEADY = !!draft_order && !isPending;
11281
+ return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
11282
+ /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
11283
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Sales Channel" }) }),
11284
+ /* @__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" }) })
11285
+ ] }),
11286
+ ISrEADY && /* @__PURE__ */ jsxRuntime.jsx(SalesChannelForm, { order: draft_order })
11287
+ ] });
11288
+ };
11289
+ const SalesChannelForm = ({ order }) => {
11290
+ const form = reactHookForm.useForm({
11291
+ defaultValues: {
11292
+ sales_channel_id: order.sales_channel_id || ""
11293
+ },
11294
+ resolver: zod.zodResolver(schema$3)
11295
+ });
11296
+ const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
11297
+ const { handleSuccess } = useRouteModal();
11298
+ const onSubmit = form.handleSubmit(async (data) => {
11299
+ await mutateAsync(
11300
+ {
11301
+ sales_channel_id: data.sales_channel_id
11302
+ },
11303
+ {
11304
+ onSuccess: () => {
11305
+ ui.toast.success("Sales channel updated");
11306
+ handleSuccess();
11307
+ },
11308
+ onError: (error) => {
11309
+ ui.toast.error(error.message);
11310
+ }
11311
+ }
11312
+ );
11313
+ });
11314
+ return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
11315
+ KeyboundForm,
11316
+ {
11317
+ className: "flex flex-1 flex-col overflow-hidden",
11318
+ onSubmit,
11319
+ children: [
11320
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsx(SalesChannelField, { control: form.control, order }) }),
11321
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
11322
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
11323
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
11324
+ ] }) })
11325
+ ]
11326
+ }
11327
+ ) });
11328
+ };
11329
+ const SalesChannelField = ({ control, order }) => {
11330
+ const salesChannels = useComboboxData({
11331
+ queryFn: async (params) => {
11332
+ return await sdk.admin.salesChannel.list(params);
11333
+ },
11334
+ queryKey: ["sales-channels"],
11335
+ getOptions: (data) => {
11336
+ return data.sales_channels.map((salesChannel) => ({
11337
+ label: salesChannel.name,
11338
+ value: salesChannel.id
11339
+ }));
11340
+ },
11341
+ defaultValue: order.sales_channel_id || void 0
11342
+ });
11343
+ return /* @__PURE__ */ jsxRuntime.jsx(
11344
+ Form$2.Field,
11345
+ {
11346
+ control,
11347
+ name: "sales_channel_id",
11348
+ render: ({ field }) => {
11349
+ return /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11350
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Sales Channel" }),
11351
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
11352
+ Combobox,
11353
+ {
11354
+ options: salesChannels.options,
11355
+ fetchNextPage: salesChannels.fetchNextPage,
11356
+ isFetchingNextPage: salesChannels.isFetchingNextPage,
11357
+ searchValue: salesChannels.searchValue,
11358
+ onSearchValueChange: salesChannels.onSearchValueChange,
11359
+ placeholder: "Select sales channel",
11360
+ ...field
11361
+ }
11362
+ ) }),
11363
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11364
+ ] });
11365
+ }
11366
+ }
11367
+ );
11368
+ };
11369
+ const schema$3 = objectType({
11370
+ sales_channel_id: stringType().min(1)
11371
+ });
11372
+ const ShippingAddress = () => {
11246
11373
  const { id } = reactRouterDom.useParams();
11247
11374
  const { order, isPending, isError, error } = useOrder(id, {
11248
- fields: "+billing_address"
11375
+ fields: "+shipping_address"
11249
11376
  });
11250
11377
  if (isError) {
11251
11378
  throw error;
@@ -11253,34 +11380,47 @@ const BillingAddress = () => {
11253
11380
  const isReady = !isPending && !!order;
11254
11381
  return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
11255
11382
  /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
11256
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Billing Address" }) }),
11257
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit the billing address for the draft order" }) })
11383
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Shipping Address" }) }),
11384
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit the shipping address for the draft order" }) })
11258
11385
  ] }),
11259
- isReady && /* @__PURE__ */ jsxRuntime.jsx(BillingAddressForm, { order })
11386
+ isReady && /* @__PURE__ */ jsxRuntime.jsx(ShippingAddressForm, { order })
11260
11387
  ] });
11261
11388
  };
11262
- const BillingAddressForm = ({ order }) => {
11389
+ const ShippingAddressForm = ({ order }) => {
11263
11390
  var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
11264
11391
  const form = reactHookForm.useForm({
11265
11392
  defaultValues: {
11266
- first_name: ((_a = order.billing_address) == null ? void 0 : _a.first_name) ?? "",
11267
- last_name: ((_b = order.billing_address) == null ? void 0 : _b.last_name) ?? "",
11268
- company: ((_c = order.billing_address) == null ? void 0 : _c.company) ?? "",
11269
- address_1: ((_d = order.billing_address) == null ? void 0 : _d.address_1) ?? "",
11270
- address_2: ((_e = order.billing_address) == null ? void 0 : _e.address_2) ?? "",
11271
- city: ((_f = order.billing_address) == null ? void 0 : _f.city) ?? "",
11272
- province: ((_g = order.billing_address) == null ? void 0 : _g.province) ?? "",
11273
- country_code: ((_h = order.billing_address) == null ? void 0 : _h.country_code) ?? "",
11274
- postal_code: ((_i = order.billing_address) == null ? void 0 : _i.postal_code) ?? "",
11275
- phone: ((_j = order.billing_address) == null ? void 0 : _j.phone) ?? ""
11393
+ first_name: ((_a = order.shipping_address) == null ? void 0 : _a.first_name) ?? "",
11394
+ last_name: ((_b = order.shipping_address) == null ? void 0 : _b.last_name) ?? "",
11395
+ company: ((_c = order.shipping_address) == null ? void 0 : _c.company) ?? "",
11396
+ address_1: ((_d = order.shipping_address) == null ? void 0 : _d.address_1) ?? "",
11397
+ address_2: ((_e = order.shipping_address) == null ? void 0 : _e.address_2) ?? "",
11398
+ city: ((_f = order.shipping_address) == null ? void 0 : _f.city) ?? "",
11399
+ province: ((_g = order.shipping_address) == null ? void 0 : _g.province) ?? "",
11400
+ country_code: ((_h = order.shipping_address) == null ? void 0 : _h.country_code) ?? "",
11401
+ postal_code: ((_i = order.shipping_address) == null ? void 0 : _i.postal_code) ?? "",
11402
+ phone: ((_j = order.shipping_address) == null ? void 0 : _j.phone) ?? ""
11276
11403
  },
11277
- resolver: zod.zodResolver(schema$4)
11404
+ resolver: zod.zodResolver(schema$2)
11278
11405
  });
11279
11406
  const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
11280
11407
  const { handleSuccess } = useRouteModal();
11281
11408
  const onSubmit = form.handleSubmit(async (data) => {
11282
11409
  await mutateAsync(
11283
- { billing_address: data },
11410
+ {
11411
+ shipping_address: {
11412
+ first_name: data.first_name,
11413
+ last_name: data.last_name,
11414
+ company: data.company,
11415
+ address_1: data.address_1,
11416
+ address_2: data.address_2,
11417
+ city: data.city,
11418
+ province: data.province,
11419
+ country_code: data.country_code,
11420
+ postal_code: data.postal_code,
11421
+ phone: data.phone
11422
+ }
11423
+ },
11284
11424
  {
11285
11425
  onSuccess: () => {
11286
11426
  handleSuccess();
@@ -11431,173 +11571,67 @@ const BillingAddressForm = ({ order }) => {
11431
11571
  }
11432
11572
  ) });
11433
11573
  };
11434
- const schema$4 = addressSchema;
11435
- const SalesChannel = () => {
11574
+ const schema$2 = addressSchema;
11575
+ const STACKED_FOCUS_MODAL_ID = "shipping-form";
11576
+ const Shipping = () => {
11577
+ var _a;
11436
11578
  const { id } = reactRouterDom.useParams();
11437
- const { draft_order, isPending, isError, error } = useDraftOrder(
11438
- id,
11439
- {
11440
- fields: "+sales_channel_id"
11441
- },
11442
- {
11443
- enabled: !!id
11444
- }
11445
- );
11579
+ const { order, isPending, isError, error } = useOrder(id, {
11580
+ fields: "+items.*,+items.variant.*,+items.variant.product.*,+items.variant.product.shipping_profile.*,+currency_code"
11581
+ });
11582
+ const {
11583
+ order: preview,
11584
+ isPending: isPreviewPending,
11585
+ isError: isPreviewError,
11586
+ error: previewError
11587
+ } = useOrderPreview(id);
11588
+ useInitiateOrderEdit({ preview });
11589
+ const { onCancel } = useCancelOrderEdit({ preview });
11446
11590
  if (isError) {
11447
11591
  throw error;
11448
11592
  }
11449
- const ISrEADY = !!draft_order && !isPending;
11450
- return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
11451
- /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
11452
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Sales Channel" }) }),
11453
- /* @__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" }) })
11454
- ] }),
11455
- ISrEADY && /* @__PURE__ */ jsxRuntime.jsx(SalesChannelForm, { order: draft_order })
11456
- ] });
11593
+ if (isPreviewError) {
11594
+ throw previewError;
11595
+ }
11596
+ const orderHasItems = (((_a = order == null ? void 0 : order.items) == null ? void 0 : _a.length) || 0) > 0;
11597
+ const isReady = preview && !isPreviewPending && order && !isPending;
11598
+ return /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal, { onClose: onCancel, children: !orderHasItems ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex h-full flex-col overflow-hidden ", children: [
11599
+ /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Header, {}),
11600
+ /* @__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: [
11601
+ /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Shipping" }) }),
11602
+ /* @__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." }) })
11603
+ ] }) }) }),
11604
+ /* @__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" }) }) })
11605
+ ] }) : isReady ? /* @__PURE__ */ jsxRuntime.jsx(ShippingForm, { preview, order }) : /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
11606
+ /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit Shipping" }) }),
11607
+ /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Loading data for the draft order, please wait..." }) })
11608
+ ] }) });
11457
11609
  };
11458
- const SalesChannelForm = ({ order }) => {
11459
- const form = reactHookForm.useForm({
11460
- defaultValues: {
11461
- sales_channel_id: order.sales_channel_id || ""
11610
+ const ShippingForm = ({ preview, order }) => {
11611
+ var _a;
11612
+ const { setIsOpen } = useStackedModal();
11613
+ const [isSubmitting, setIsSubmitting] = React.useState(false);
11614
+ const [data, setData] = React.useState(null);
11615
+ const appliedShippingOptionIds = (_a = preview.shipping_methods) == null ? void 0 : _a.map((method) => method.shipping_option_id).filter(Boolean);
11616
+ const { shipping_options } = useShippingOptions(
11617
+ {
11618
+ id: appliedShippingOptionIds,
11619
+ fields: "+service_zone.*,+service_zone.fulfillment_set.*,+service_zone.fulfillment_set.location.*"
11462
11620
  },
11463
- resolver: zod.zodResolver(schema$3)
11464
- });
11465
- const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
11466
- const { handleSuccess } = useRouteModal();
11467
- const onSubmit = form.handleSubmit(async (data) => {
11468
- await mutateAsync(
11469
- {
11470
- sales_channel_id: data.sales_channel_id
11471
- },
11472
- {
11473
- onSuccess: () => {
11474
- ui.toast.success("Sales channel updated");
11475
- handleSuccess();
11476
- },
11477
- onError: (error) => {
11478
- ui.toast.error(error.message);
11479
- }
11480
- }
11481
- );
11482
- });
11483
- return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
11484
- KeyboundForm,
11485
- {
11486
- className: "flex flex-1 flex-col overflow-hidden",
11487
- onSubmit,
11488
- children: [
11489
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsx(SalesChannelField, { control: form.control, order }) }),
11490
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
11491
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
11492
- /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
11493
- ] }) })
11494
- ]
11495
- }
11496
- ) });
11497
- };
11498
- const SalesChannelField = ({ control, order }) => {
11499
- const salesChannels = useComboboxData({
11500
- queryFn: async (params) => {
11501
- return await sdk.admin.salesChannel.list(params);
11502
- },
11503
- queryKey: ["sales-channels"],
11504
- getOptions: (data) => {
11505
- return data.sales_channels.map((salesChannel) => ({
11506
- label: salesChannel.name,
11507
- value: salesChannel.id
11508
- }));
11509
- },
11510
- defaultValue: order.sales_channel_id || void 0
11511
- });
11512
- return /* @__PURE__ */ jsxRuntime.jsx(
11513
- Form$2.Field,
11514
- {
11515
- control,
11516
- name: "sales_channel_id",
11517
- render: ({ field }) => {
11518
- return /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11519
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Sales Channel" }),
11520
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
11521
- Combobox,
11522
- {
11523
- options: salesChannels.options,
11524
- fetchNextPage: salesChannels.fetchNextPage,
11525
- isFetchingNextPage: salesChannels.isFetchingNextPage,
11526
- searchValue: salesChannels.searchValue,
11527
- onSearchValueChange: salesChannels.onSearchValueChange,
11528
- placeholder: "Select sales channel",
11529
- ...field
11530
- }
11531
- ) }),
11532
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11533
- ] });
11534
- }
11535
- }
11536
- );
11537
- };
11538
- const schema$3 = objectType({
11539
- sales_channel_id: stringType().min(1)
11540
- });
11541
- const STACKED_FOCUS_MODAL_ID = "shipping-form";
11542
- const Shipping = () => {
11543
- var _a;
11544
- const { id } = reactRouterDom.useParams();
11545
- const { order, isPending, isError, error } = useOrder(id, {
11546
- fields: "+items.*,+items.variant.*,+items.variant.product.*,+items.variant.product.shipping_profile.*,+currency_code"
11547
- });
11548
- const {
11549
- order: preview,
11550
- isPending: isPreviewPending,
11551
- isError: isPreviewError,
11552
- error: previewError
11553
- } = useOrderPreview(id);
11554
- useInitiateOrderEdit({ preview });
11555
- const { onCancel } = useCancelOrderEdit({ preview });
11556
- if (isError) {
11557
- throw error;
11558
- }
11559
- if (isPreviewError) {
11560
- throw previewError;
11561
- }
11562
- const orderHasItems = (((_a = order == null ? void 0 : order.items) == null ? void 0 : _a.length) || 0) > 0;
11563
- const isReady = preview && !isPreviewPending && order && !isPending;
11564
- return /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal, { onClose: onCancel, children: !orderHasItems ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex h-full flex-col overflow-hidden ", children: [
11565
- /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Header, {}),
11566
- /* @__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: [
11567
- /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Shipping" }) }),
11568
- /* @__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." }) })
11569
- ] }) }) }),
11570
- /* @__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" }) }) })
11571
- ] }) : isReady ? /* @__PURE__ */ jsxRuntime.jsx(ShippingForm, { preview, order }) : /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
11572
- /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit Shipping" }) }),
11573
- /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Loading data for the draft order, please wait..." }) })
11574
- ] }) });
11575
- };
11576
- const ShippingForm = ({ preview, order }) => {
11577
- var _a;
11578
- const { setIsOpen } = useStackedModal();
11579
- const [isSubmitting, setIsSubmitting] = React.useState(false);
11580
- const [data, setData] = React.useState(null);
11581
- const appliedShippingOptionIds = (_a = preview.shipping_methods) == null ? void 0 : _a.map((method) => method.shipping_option_id).filter(Boolean);
11582
- const { shipping_options } = useShippingOptions(
11583
- {
11584
- id: appliedShippingOptionIds,
11585
- fields: "+service_zone.*,+service_zone.fulfillment_set.*,+service_zone.fulfillment_set.location.*"
11586
- },
11587
- {
11588
- enabled: appliedShippingOptionIds.length > 0
11589
- }
11590
- );
11591
- const uniqueShippingProfiles = React.useMemo(() => {
11592
- const profiles = /* @__PURE__ */ new Map();
11593
- getUniqueShippingProfiles(order.items).forEach((profile) => {
11594
- profiles.set(profile.id, profile);
11595
- });
11596
- shipping_options == null ? void 0 : shipping_options.forEach((option) => {
11597
- profiles.set(option.shipping_profile_id, option.shipping_profile);
11598
- });
11599
- return Array.from(profiles.values());
11600
- }, [order.items, shipping_options]);
11621
+ {
11622
+ enabled: appliedShippingOptionIds.length > 0
11623
+ }
11624
+ );
11625
+ const uniqueShippingProfiles = React.useMemo(() => {
11626
+ const profiles = /* @__PURE__ */ new Map();
11627
+ getUniqueShippingProfiles(order.items).forEach((profile) => {
11628
+ profiles.set(profile.id, profile);
11629
+ });
11630
+ shipping_options == null ? void 0 : shipping_options.forEach((option) => {
11631
+ profiles.set(option.shipping_profile_id, option.shipping_profile);
11632
+ });
11633
+ return Array.from(profiles.values());
11634
+ }, [order.items, shipping_options]);
11601
11635
  const { handleSuccess } = useRouteModal();
11602
11636
  const { mutateAsync: confirmOrderEdit } = useDraftOrderConfirmEdit(preview.id);
11603
11637
  const { mutateAsync: requestOrderEdit } = useDraftOrderRequestEdit(preview.id);
@@ -12345,60 +12379,44 @@ const CustomAmountField = ({
12345
12379
  }
12346
12380
  );
12347
12381
  };
12348
- const ShippingAddress = () => {
12382
+ const TransferOwnership = () => {
12349
12383
  const { id } = reactRouterDom.useParams();
12350
- const { order, isPending, isError, error } = useOrder(id, {
12351
- fields: "+shipping_address"
12384
+ const { draft_order, isPending, isError, error } = useDraftOrder(id, {
12385
+ fields: "id,customer_id,customer.*"
12352
12386
  });
12353
12387
  if (isError) {
12354
12388
  throw error;
12355
12389
  }
12356
- const isReady = !isPending && !!order;
12390
+ const isReady = !isPending && !!draft_order;
12357
12391
  return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
12358
12392
  /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
12359
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Shipping Address" }) }),
12360
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit the shipping address for the draft order" }) })
12393
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Transfer Ownership" }) }),
12394
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Transfer the ownership of this draft order to a new customer" }) })
12361
12395
  ] }),
12362
- isReady && /* @__PURE__ */ jsxRuntime.jsx(ShippingAddressForm, { order })
12396
+ isReady && /* @__PURE__ */ jsxRuntime.jsx(TransferOwnershipForm, { order: draft_order })
12363
12397
  ] });
12364
12398
  };
12365
- const ShippingAddressForm = ({ order }) => {
12366
- var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
12399
+ const TransferOwnershipForm = ({ order }) => {
12400
+ var _a, _b;
12367
12401
  const form = reactHookForm.useForm({
12368
12402
  defaultValues: {
12369
- first_name: ((_a = order.shipping_address) == null ? void 0 : _a.first_name) ?? "",
12370
- last_name: ((_b = order.shipping_address) == null ? void 0 : _b.last_name) ?? "",
12371
- company: ((_c = order.shipping_address) == null ? void 0 : _c.company) ?? "",
12372
- address_1: ((_d = order.shipping_address) == null ? void 0 : _d.address_1) ?? "",
12373
- address_2: ((_e = order.shipping_address) == null ? void 0 : _e.address_2) ?? "",
12374
- city: ((_f = order.shipping_address) == null ? void 0 : _f.city) ?? "",
12375
- province: ((_g = order.shipping_address) == null ? void 0 : _g.province) ?? "",
12376
- country_code: ((_h = order.shipping_address) == null ? void 0 : _h.country_code) ?? "",
12377
- postal_code: ((_i = order.shipping_address) == null ? void 0 : _i.postal_code) ?? "",
12378
- phone: ((_j = order.shipping_address) == null ? void 0 : _j.phone) ?? ""
12403
+ customer_id: order.customer_id || ""
12379
12404
  },
12380
- resolver: zod.zodResolver(schema$2)
12405
+ resolver: zod.zodResolver(schema$1)
12381
12406
  });
12382
12407
  const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
12383
12408
  const { handleSuccess } = useRouteModal();
12409
+ const name = [(_a = order.customer) == null ? void 0 : _a.first_name, (_b = order.customer) == null ? void 0 : _b.last_name].filter(Boolean).join(" ");
12410
+ const currentCustomer = order.customer ? {
12411
+ label: name ? `${name} (${order.customer.email})` : order.customer.email,
12412
+ value: order.customer.id
12413
+ } : null;
12384
12414
  const onSubmit = form.handleSubmit(async (data) => {
12385
12415
  await mutateAsync(
12386
- {
12387
- shipping_address: {
12388
- first_name: data.first_name,
12389
- last_name: data.last_name,
12390
- company: data.company,
12391
- address_1: data.address_1,
12392
- address_2: data.address_2,
12393
- city: data.city,
12394
- province: data.province,
12395
- country_code: data.country_code,
12396
- postal_code: data.postal_code,
12397
- phone: data.phone
12398
- }
12399
- },
12416
+ { customer_id: data.customer_id },
12400
12417
  {
12401
12418
  onSuccess: () => {
12419
+ ui.toast.success("Customer updated");
12402
12420
  handleSuccess();
12403
12421
  },
12404
12422
  onError: (error) => {
@@ -12413,231 +12431,23 @@ const ShippingAddressForm = ({ order }) => {
12413
12431
  className: "flex flex-1 flex-col overflow-hidden",
12414
12432
  onSubmit,
12415
12433
  children: [
12416
- /* @__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: [
12417
- /* @__PURE__ */ jsxRuntime.jsx(
12418
- Form$2.Field,
12419
- {
12420
- control: form.control,
12421
- name: "country_code",
12422
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12423
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Country" }),
12424
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(CountrySelect, { ...field }) }),
12425
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12426
- ] })
12427
- }
12428
- ),
12429
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
12430
- /* @__PURE__ */ jsxRuntime.jsx(
12431
- Form$2.Field,
12432
- {
12433
- control: form.control,
12434
- name: "first_name",
12435
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12436
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "First name" }),
12437
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12438
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12439
- ] })
12440
- }
12441
- ),
12442
- /* @__PURE__ */ jsxRuntime.jsx(
12443
- Form$2.Field,
12444
- {
12445
- control: form.control,
12446
- name: "last_name",
12447
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12448
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Last name" }),
12449
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12450
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12451
- ] })
12452
- }
12453
- )
12434
+ /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: [
12435
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center justify-center bg-ui-bg-component rounded-md border", children: /* @__PURE__ */ jsxRuntime.jsx(Illustration, {}) }),
12436
+ currentCustomer && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col space-y-3", children: [
12437
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col", children: [
12438
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Label, { size: "small", weight: "plus", htmlFor: "current-customer", children: "Current owner" }),
12439
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Hint, { children: "The customer that is currently associated with this draft order." })
12440
+ ] }),
12441
+ /* @__PURE__ */ jsxRuntime.jsxs(ui.Select, { disabled: true, value: currentCustomer.value, children: [
12442
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Select.Trigger, { id: "current-customer", children: /* @__PURE__ */ jsxRuntime.jsx(ui.Select.Value, {}) }),
12443
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Select.Content, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Select.Item, { value: currentCustomer.value, children: currentCustomer.label }) })
12444
+ ] })
12454
12445
  ] }),
12455
12446
  /* @__PURE__ */ jsxRuntime.jsx(
12456
- Form$2.Field,
12457
- {
12458
- control: form.control,
12459
- name: "company",
12460
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12461
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Company" }),
12462
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12463
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12464
- ] })
12465
- }
12466
- ),
12467
- /* @__PURE__ */ jsxRuntime.jsx(
12468
- Form$2.Field,
12447
+ CustomerField,
12469
12448
  {
12470
12449
  control: form.control,
12471
- name: "address_1",
12472
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12473
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Address" }),
12474
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12475
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12476
- ] })
12477
- }
12478
- ),
12479
- /* @__PURE__ */ jsxRuntime.jsx(
12480
- Form$2.Field,
12481
- {
12482
- control: form.control,
12483
- name: "address_2",
12484
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12485
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Apartment, suite, etc." }),
12486
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12487
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12488
- ] })
12489
- }
12490
- ),
12491
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
12492
- /* @__PURE__ */ jsxRuntime.jsx(
12493
- Form$2.Field,
12494
- {
12495
- control: form.control,
12496
- name: "postal_code",
12497
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12498
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Postal code" }),
12499
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12500
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12501
- ] })
12502
- }
12503
- ),
12504
- /* @__PURE__ */ jsxRuntime.jsx(
12505
- Form$2.Field,
12506
- {
12507
- control: form.control,
12508
- name: "city",
12509
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12510
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "City" }),
12511
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12512
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12513
- ] })
12514
- }
12515
- )
12516
- ] }),
12517
- /* @__PURE__ */ jsxRuntime.jsx(
12518
- Form$2.Field,
12519
- {
12520
- control: form.control,
12521
- name: "province",
12522
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12523
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Province / State" }),
12524
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12525
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12526
- ] })
12527
- }
12528
- ),
12529
- /* @__PURE__ */ jsxRuntime.jsx(
12530
- Form$2.Field,
12531
- {
12532
- control: form.control,
12533
- name: "phone",
12534
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12535
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Phone" }),
12536
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12537
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12538
- ] })
12539
- }
12540
- )
12541
- ] }) }),
12542
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
12543
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
12544
- /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
12545
- ] }) })
12546
- ]
12547
- }
12548
- ) });
12549
- };
12550
- const schema$2 = addressSchema;
12551
- const CustomItems = () => {
12552
- return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
12553
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Header, { children: /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Custom Items" }) }) }),
12554
- /* @__PURE__ */ jsxRuntime.jsx(CustomItemsForm, {})
12555
- ] });
12556
- };
12557
- const CustomItemsForm = () => {
12558
- const form = reactHookForm.useForm({
12559
- resolver: zod.zodResolver(schema$1)
12560
- });
12561
- return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(KeyboundForm, { className: "flex flex-1 flex-col", children: [
12562
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, {}),
12563
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
12564
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
12565
- /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", children: "Save" })
12566
- ] }) })
12567
- ] }) });
12568
- };
12569
- const schema$1 = objectType({
12570
- email: stringType().email()
12571
- });
12572
- const TransferOwnership = () => {
12573
- const { id } = reactRouterDom.useParams();
12574
- const { draft_order, isPending, isError, error } = useDraftOrder(id, {
12575
- fields: "id,customer_id,customer.*"
12576
- });
12577
- if (isError) {
12578
- throw error;
12579
- }
12580
- const isReady = !isPending && !!draft_order;
12581
- return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
12582
- /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
12583
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Transfer Ownership" }) }),
12584
- /* @__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" }) })
12585
- ] }),
12586
- isReady && /* @__PURE__ */ jsxRuntime.jsx(TransferOwnershipForm, { order: draft_order })
12587
- ] });
12588
- };
12589
- const TransferOwnershipForm = ({ order }) => {
12590
- var _a, _b;
12591
- const form = reactHookForm.useForm({
12592
- defaultValues: {
12593
- customer_id: order.customer_id || ""
12594
- },
12595
- resolver: zod.zodResolver(schema)
12596
- });
12597
- const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
12598
- const { handleSuccess } = useRouteModal();
12599
- const name = [(_a = order.customer) == null ? void 0 : _a.first_name, (_b = order.customer) == null ? void 0 : _b.last_name].filter(Boolean).join(" ");
12600
- const currentCustomer = order.customer ? {
12601
- label: name ? `${name} (${order.customer.email})` : order.customer.email,
12602
- value: order.customer.id
12603
- } : null;
12604
- const onSubmit = form.handleSubmit(async (data) => {
12605
- await mutateAsync(
12606
- { customer_id: data.customer_id },
12607
- {
12608
- onSuccess: () => {
12609
- ui.toast.success("Customer updated");
12610
- handleSuccess();
12611
- },
12612
- onError: (error) => {
12613
- ui.toast.error(error.message);
12614
- }
12615
- }
12616
- );
12617
- });
12618
- return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
12619
- KeyboundForm,
12620
- {
12621
- className: "flex flex-1 flex-col overflow-hidden",
12622
- onSubmit,
12623
- children: [
12624
- /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: [
12625
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center justify-center bg-ui-bg-component rounded-md border", children: /* @__PURE__ */ jsxRuntime.jsx(Illustration, {}) }),
12626
- currentCustomer && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col space-y-3", children: [
12627
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col", children: [
12628
- /* @__PURE__ */ jsxRuntime.jsx(ui.Label, { size: "small", weight: "plus", htmlFor: "current-customer", children: "Current owner" }),
12629
- /* @__PURE__ */ jsxRuntime.jsx(ui.Hint, { children: "The customer that is currently associated with this draft order." })
12630
- ] }),
12631
- /* @__PURE__ */ jsxRuntime.jsxs(ui.Select, { disabled: true, value: currentCustomer.value, children: [
12632
- /* @__PURE__ */ jsxRuntime.jsx(ui.Select.Trigger, { id: "current-customer", children: /* @__PURE__ */ jsxRuntime.jsx(ui.Select.Value, {}) }),
12633
- /* @__PURE__ */ jsxRuntime.jsx(ui.Select.Content, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Select.Item, { value: currentCustomer.value, children: currentCustomer.label }) })
12634
- ] })
12635
- ] }),
12636
- /* @__PURE__ */ jsxRuntime.jsx(
12637
- CustomerField,
12638
- {
12639
- control: form.control,
12640
- currentCustomerId: order.customer_id
12450
+ currentCustomerId: order.customer_id
12641
12451
  }
12642
12452
  )
12643
12453
  ] }),
@@ -13042,9 +12852,199 @@ const Illustration = () => {
13042
12852
  }
13043
12853
  );
13044
12854
  };
13045
- const schema = objectType({
12855
+ const schema$1 = objectType({
13046
12856
  customer_id: stringType().min(1)
13047
12857
  });
12858
+ const BillingAddress = () => {
12859
+ const { id } = reactRouterDom.useParams();
12860
+ const { order, isPending, isError, error } = useOrder(id, {
12861
+ fields: "+billing_address"
12862
+ });
12863
+ if (isError) {
12864
+ throw error;
12865
+ }
12866
+ const isReady = !isPending && !!order;
12867
+ return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
12868
+ /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
12869
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Billing Address" }) }),
12870
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit the billing address for the draft order" }) })
12871
+ ] }),
12872
+ isReady && /* @__PURE__ */ jsxRuntime.jsx(BillingAddressForm, { order })
12873
+ ] });
12874
+ };
12875
+ const BillingAddressForm = ({ order }) => {
12876
+ var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
12877
+ const form = reactHookForm.useForm({
12878
+ defaultValues: {
12879
+ first_name: ((_a = order.billing_address) == null ? void 0 : _a.first_name) ?? "",
12880
+ last_name: ((_b = order.billing_address) == null ? void 0 : _b.last_name) ?? "",
12881
+ company: ((_c = order.billing_address) == null ? void 0 : _c.company) ?? "",
12882
+ address_1: ((_d = order.billing_address) == null ? void 0 : _d.address_1) ?? "",
12883
+ address_2: ((_e = order.billing_address) == null ? void 0 : _e.address_2) ?? "",
12884
+ city: ((_f = order.billing_address) == null ? void 0 : _f.city) ?? "",
12885
+ province: ((_g = order.billing_address) == null ? void 0 : _g.province) ?? "",
12886
+ country_code: ((_h = order.billing_address) == null ? void 0 : _h.country_code) ?? "",
12887
+ postal_code: ((_i = order.billing_address) == null ? void 0 : _i.postal_code) ?? "",
12888
+ phone: ((_j = order.billing_address) == null ? void 0 : _j.phone) ?? ""
12889
+ },
12890
+ resolver: zod.zodResolver(schema)
12891
+ });
12892
+ const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
12893
+ const { handleSuccess } = useRouteModal();
12894
+ const onSubmit = form.handleSubmit(async (data) => {
12895
+ await mutateAsync(
12896
+ { billing_address: data },
12897
+ {
12898
+ onSuccess: () => {
12899
+ handleSuccess();
12900
+ },
12901
+ onError: (error) => {
12902
+ ui.toast.error(error.message);
12903
+ }
12904
+ }
12905
+ );
12906
+ });
12907
+ return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
12908
+ KeyboundForm,
12909
+ {
12910
+ className: "flex flex-1 flex-col overflow-hidden",
12911
+ onSubmit,
12912
+ children: [
12913
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-y-4", children: [
12914
+ /* @__PURE__ */ jsxRuntime.jsx(
12915
+ Form$2.Field,
12916
+ {
12917
+ control: form.control,
12918
+ name: "country_code",
12919
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12920
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Country" }),
12921
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(CountrySelect, { ...field }) }),
12922
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12923
+ ] })
12924
+ }
12925
+ ),
12926
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
12927
+ /* @__PURE__ */ jsxRuntime.jsx(
12928
+ Form$2.Field,
12929
+ {
12930
+ control: form.control,
12931
+ name: "first_name",
12932
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12933
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "First name" }),
12934
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12935
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12936
+ ] })
12937
+ }
12938
+ ),
12939
+ /* @__PURE__ */ jsxRuntime.jsx(
12940
+ Form$2.Field,
12941
+ {
12942
+ control: form.control,
12943
+ name: "last_name",
12944
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12945
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Last name" }),
12946
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12947
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12948
+ ] })
12949
+ }
12950
+ )
12951
+ ] }),
12952
+ /* @__PURE__ */ jsxRuntime.jsx(
12953
+ Form$2.Field,
12954
+ {
12955
+ control: form.control,
12956
+ name: "company",
12957
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12958
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Company" }),
12959
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12960
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12961
+ ] })
12962
+ }
12963
+ ),
12964
+ /* @__PURE__ */ jsxRuntime.jsx(
12965
+ Form$2.Field,
12966
+ {
12967
+ control: form.control,
12968
+ name: "address_1",
12969
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12970
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Address" }),
12971
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12972
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12973
+ ] })
12974
+ }
12975
+ ),
12976
+ /* @__PURE__ */ jsxRuntime.jsx(
12977
+ Form$2.Field,
12978
+ {
12979
+ control: form.control,
12980
+ name: "address_2",
12981
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12982
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Apartment, suite, etc." }),
12983
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12984
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12985
+ ] })
12986
+ }
12987
+ ),
12988
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
12989
+ /* @__PURE__ */ jsxRuntime.jsx(
12990
+ Form$2.Field,
12991
+ {
12992
+ control: form.control,
12993
+ name: "postal_code",
12994
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12995
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Postal code" }),
12996
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12997
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12998
+ ] })
12999
+ }
13000
+ ),
13001
+ /* @__PURE__ */ jsxRuntime.jsx(
13002
+ Form$2.Field,
13003
+ {
13004
+ control: form.control,
13005
+ name: "city",
13006
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
13007
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "City" }),
13008
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
13009
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
13010
+ ] })
13011
+ }
13012
+ )
13013
+ ] }),
13014
+ /* @__PURE__ */ jsxRuntime.jsx(
13015
+ Form$2.Field,
13016
+ {
13017
+ control: form.control,
13018
+ name: "province",
13019
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
13020
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Province / State" }),
13021
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
13022
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
13023
+ ] })
13024
+ }
13025
+ ),
13026
+ /* @__PURE__ */ jsxRuntime.jsx(
13027
+ Form$2.Field,
13028
+ {
13029
+ control: form.control,
13030
+ name: "phone",
13031
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
13032
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Phone" }),
13033
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
13034
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
13035
+ ] })
13036
+ }
13037
+ )
13038
+ ] }) }),
13039
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
13040
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
13041
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
13042
+ ] }) })
13043
+ ]
13044
+ }
13045
+ ) });
13046
+ };
13047
+ const schema = addressSchema;
13048
13048
  const widgetModule = { widgets: [] };
13049
13049
  const routeModule = {
13050
13050
  routes: [
@@ -13069,6 +13069,10 @@ const routeModule = {
13069
13069
  Component: Email,
13070
13070
  path: "/draft-orders/:id/email"
13071
13071
  },
13072
+ {
13073
+ Component: CustomItems,
13074
+ path: "/draft-orders/:id/custom-items"
13075
+ },
13072
13076
  {
13073
13077
  Component: Items,
13074
13078
  path: "/draft-orders/:id/items"
@@ -13081,29 +13085,25 @@ const routeModule = {
13081
13085
  Component: Promotions,
13082
13086
  path: "/draft-orders/:id/promotions"
13083
13087
  },
13084
- {
13085
- Component: BillingAddress,
13086
- path: "/draft-orders/:id/billing-address"
13087
- },
13088
13088
  {
13089
13089
  Component: SalesChannel,
13090
13090
  path: "/draft-orders/:id/sales-channel"
13091
13091
  },
13092
- {
13093
- Component: Shipping,
13094
- path: "/draft-orders/:id/shipping"
13095
- },
13096
13092
  {
13097
13093
  Component: ShippingAddress,
13098
13094
  path: "/draft-orders/:id/shipping-address"
13099
13095
  },
13100
13096
  {
13101
- Component: CustomItems,
13102
- path: "/draft-orders/:id/custom-items"
13097
+ Component: Shipping,
13098
+ path: "/draft-orders/:id/shipping"
13103
13099
  },
13104
13100
  {
13105
13101
  Component: TransferOwnership,
13106
13102
  path: "/draft-orders/:id/transfer-ownership"
13103
+ },
13104
+ {
13105
+ Component: BillingAddress,
13106
+ path: "/draft-orders/:id/billing-address"
13107
13107
  }
13108
13108
  ]
13109
13109
  }