@medusajs/draft-order 2.10.4-snapshot-20251007081528 → 2.10.4-snapshot-20251008074348

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.
@@ -9573,27 +9573,196 @@ const ID = () => {
9573
9573
  /* @__PURE__ */ jsxRuntime.jsx(reactRouterDom.Outlet, {})
9574
9574
  ] });
9575
9575
  };
9576
- const CustomItems = () => {
9576
+ const BillingAddress = () => {
9577
+ const { id } = reactRouterDom.useParams();
9578
+ const { order, isPending, isError, error } = useOrder(id, {
9579
+ fields: "+billing_address"
9580
+ });
9581
+ if (isError) {
9582
+ throw error;
9583
+ }
9584
+ const isReady = !isPending && !!order;
9577
9585
  return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
9578
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Header, { children: /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Custom Items" }) }) }),
9579
- /* @__PURE__ */ jsxRuntime.jsx(CustomItemsForm, {})
9586
+ /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
9587
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Billing Address" }) }),
9588
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit the billing address for the draft order" }) })
9589
+ ] }),
9590
+ isReady && /* @__PURE__ */ jsxRuntime.jsx(BillingAddressForm, { order })
9580
9591
  ] });
9581
9592
  };
9582
- const CustomItemsForm = () => {
9593
+ const BillingAddressForm = ({ order }) => {
9594
+ var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
9583
9595
  const form = reactHookForm.useForm({
9596
+ defaultValues: {
9597
+ first_name: ((_a = order.billing_address) == null ? void 0 : _a.first_name) ?? "",
9598
+ last_name: ((_b = order.billing_address) == null ? void 0 : _b.last_name) ?? "",
9599
+ company: ((_c = order.billing_address) == null ? void 0 : _c.company) ?? "",
9600
+ address_1: ((_d = order.billing_address) == null ? void 0 : _d.address_1) ?? "",
9601
+ address_2: ((_e = order.billing_address) == null ? void 0 : _e.address_2) ?? "",
9602
+ city: ((_f = order.billing_address) == null ? void 0 : _f.city) ?? "",
9603
+ province: ((_g = order.billing_address) == null ? void 0 : _g.province) ?? "",
9604
+ country_code: ((_h = order.billing_address) == null ? void 0 : _h.country_code) ?? "",
9605
+ postal_code: ((_i = order.billing_address) == null ? void 0 : _i.postal_code) ?? "",
9606
+ phone: ((_j = order.billing_address) == null ? void 0 : _j.phone) ?? ""
9607
+ },
9584
9608
  resolver: zod.zodResolver(schema$5)
9585
9609
  });
9586
- return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(KeyboundForm, { className: "flex flex-1 flex-col", children: [
9587
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, {}),
9588
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
9589
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
9590
- /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", children: "Save" })
9591
- ] }) })
9592
- ] }) });
9610
+ const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
9611
+ const { handleSuccess } = useRouteModal();
9612
+ const onSubmit = form.handleSubmit(async (data) => {
9613
+ await mutateAsync(
9614
+ { billing_address: data },
9615
+ {
9616
+ onSuccess: () => {
9617
+ handleSuccess();
9618
+ },
9619
+ onError: (error) => {
9620
+ ui.toast.error(error.message);
9621
+ }
9622
+ }
9623
+ );
9624
+ });
9625
+ return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
9626
+ KeyboundForm,
9627
+ {
9628
+ className: "flex flex-1 flex-col overflow-hidden",
9629
+ onSubmit,
9630
+ children: [
9631
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-y-4", children: [
9632
+ /* @__PURE__ */ jsxRuntime.jsx(
9633
+ Form$2.Field,
9634
+ {
9635
+ control: form.control,
9636
+ name: "country_code",
9637
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9638
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Country" }),
9639
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(CountrySelect, { ...field }) }),
9640
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9641
+ ] })
9642
+ }
9643
+ ),
9644
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
9645
+ /* @__PURE__ */ jsxRuntime.jsx(
9646
+ Form$2.Field,
9647
+ {
9648
+ control: form.control,
9649
+ name: "first_name",
9650
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9651
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "First name" }),
9652
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9653
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9654
+ ] })
9655
+ }
9656
+ ),
9657
+ /* @__PURE__ */ jsxRuntime.jsx(
9658
+ Form$2.Field,
9659
+ {
9660
+ control: form.control,
9661
+ name: "last_name",
9662
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9663
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Last name" }),
9664
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9665
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9666
+ ] })
9667
+ }
9668
+ )
9669
+ ] }),
9670
+ /* @__PURE__ */ jsxRuntime.jsx(
9671
+ Form$2.Field,
9672
+ {
9673
+ control: form.control,
9674
+ name: "company",
9675
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9676
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Company" }),
9677
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9678
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9679
+ ] })
9680
+ }
9681
+ ),
9682
+ /* @__PURE__ */ jsxRuntime.jsx(
9683
+ Form$2.Field,
9684
+ {
9685
+ control: form.control,
9686
+ name: "address_1",
9687
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9688
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Address" }),
9689
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9690
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9691
+ ] })
9692
+ }
9693
+ ),
9694
+ /* @__PURE__ */ jsxRuntime.jsx(
9695
+ Form$2.Field,
9696
+ {
9697
+ control: form.control,
9698
+ name: "address_2",
9699
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9700
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Apartment, suite, etc." }),
9701
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9702
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9703
+ ] })
9704
+ }
9705
+ ),
9706
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
9707
+ /* @__PURE__ */ jsxRuntime.jsx(
9708
+ Form$2.Field,
9709
+ {
9710
+ control: form.control,
9711
+ name: "postal_code",
9712
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9713
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Postal code" }),
9714
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9715
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9716
+ ] })
9717
+ }
9718
+ ),
9719
+ /* @__PURE__ */ jsxRuntime.jsx(
9720
+ Form$2.Field,
9721
+ {
9722
+ control: form.control,
9723
+ name: "city",
9724
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9725
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "City" }),
9726
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9727
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9728
+ ] })
9729
+ }
9730
+ )
9731
+ ] }),
9732
+ /* @__PURE__ */ jsxRuntime.jsx(
9733
+ Form$2.Field,
9734
+ {
9735
+ control: form.control,
9736
+ name: "province",
9737
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9738
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Province / State" }),
9739
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9740
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9741
+ ] })
9742
+ }
9743
+ ),
9744
+ /* @__PURE__ */ jsxRuntime.jsx(
9745
+ Form$2.Field,
9746
+ {
9747
+ control: form.control,
9748
+ name: "phone",
9749
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9750
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Phone" }),
9751
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9752
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9753
+ ] })
9754
+ }
9755
+ )
9756
+ ] }) }),
9757
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
9758
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
9759
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
9760
+ ] }) })
9761
+ ]
9762
+ }
9763
+ ) });
9593
9764
  };
9594
- const schema$5 = objectType({
9595
- email: stringType().email()
9596
- });
9765
+ const schema$5 = addressSchema;
9597
9766
  const Email = () => {
9598
9767
  const { id } = reactRouterDom.useParams();
9599
9768
  const { order, isPending, isError, error } = useOrder(id, {
@@ -11369,243 +11538,40 @@ const SalesChannelField = ({ control, order }) => {
11369
11538
  const schema$3 = objectType({
11370
11539
  sales_channel_id: stringType().min(1)
11371
11540
  });
11372
- const ShippingAddress = () => {
11541
+ const STACKED_FOCUS_MODAL_ID = "shipping-form";
11542
+ const Shipping = () => {
11543
+ var _a;
11373
11544
  const { id } = reactRouterDom.useParams();
11374
11545
  const { order, isPending, isError, error } = useOrder(id, {
11375
- fields: "+shipping_address"
11546
+ fields: "+items.*,+items.variant.*,+items.variant.product.*,+items.variant.product.shipping_profile.*,+currency_code"
11376
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 });
11377
11556
  if (isError) {
11378
11557
  throw error;
11379
11558
  }
11380
- const isReady = !isPending && !!order;
11381
- return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
11382
- /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
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" }) })
11385
- ] }),
11386
- isReady && /* @__PURE__ */ jsxRuntime.jsx(ShippingAddressForm, { order })
11387
- ] });
11388
- };
11389
- const ShippingAddressForm = ({ order }) => {
11390
- var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
11391
- const form = reactHookForm.useForm({
11392
- defaultValues: {
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) ?? ""
11403
- },
11404
- resolver: zod.zodResolver(schema$2)
11405
- });
11406
- const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
11407
- const { handleSuccess } = useRouteModal();
11408
- const onSubmit = form.handleSubmit(async (data) => {
11409
- await mutateAsync(
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
- },
11424
- {
11425
- onSuccess: () => {
11426
- handleSuccess();
11427
- },
11428
- onError: (error) => {
11429
- ui.toast.error(error.message);
11430
- }
11431
- }
11432
- );
11433
- });
11434
- return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
11435
- KeyboundForm,
11436
- {
11437
- className: "flex flex-1 flex-col overflow-hidden",
11438
- onSubmit,
11439
- children: [
11440
- /* @__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: [
11441
- /* @__PURE__ */ jsxRuntime.jsx(
11442
- Form$2.Field,
11443
- {
11444
- control: form.control,
11445
- name: "country_code",
11446
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11447
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Country" }),
11448
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(CountrySelect, { ...field }) }),
11449
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11450
- ] })
11451
- }
11452
- ),
11453
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
11454
- /* @__PURE__ */ jsxRuntime.jsx(
11455
- Form$2.Field,
11456
- {
11457
- control: form.control,
11458
- name: "first_name",
11459
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11460
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "First name" }),
11461
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11462
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11463
- ] })
11464
- }
11465
- ),
11466
- /* @__PURE__ */ jsxRuntime.jsx(
11467
- Form$2.Field,
11468
- {
11469
- control: form.control,
11470
- name: "last_name",
11471
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11472
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Last name" }),
11473
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11474
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11475
- ] })
11476
- }
11477
- )
11478
- ] }),
11479
- /* @__PURE__ */ jsxRuntime.jsx(
11480
- Form$2.Field,
11481
- {
11482
- control: form.control,
11483
- name: "company",
11484
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11485
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Company" }),
11486
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11487
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11488
- ] })
11489
- }
11490
- ),
11491
- /* @__PURE__ */ jsxRuntime.jsx(
11492
- Form$2.Field,
11493
- {
11494
- control: form.control,
11495
- name: "address_1",
11496
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11497
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Address" }),
11498
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11499
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11500
- ] })
11501
- }
11502
- ),
11503
- /* @__PURE__ */ jsxRuntime.jsx(
11504
- Form$2.Field,
11505
- {
11506
- control: form.control,
11507
- name: "address_2",
11508
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11509
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Apartment, suite, etc." }),
11510
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11511
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11512
- ] })
11513
- }
11514
- ),
11515
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
11516
- /* @__PURE__ */ jsxRuntime.jsx(
11517
- Form$2.Field,
11518
- {
11519
- control: form.control,
11520
- name: "postal_code",
11521
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11522
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Postal code" }),
11523
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11524
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11525
- ] })
11526
- }
11527
- ),
11528
- /* @__PURE__ */ jsxRuntime.jsx(
11529
- Form$2.Field,
11530
- {
11531
- control: form.control,
11532
- name: "city",
11533
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11534
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "City" }),
11535
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11536
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11537
- ] })
11538
- }
11539
- )
11540
- ] }),
11541
- /* @__PURE__ */ jsxRuntime.jsx(
11542
- Form$2.Field,
11543
- {
11544
- control: form.control,
11545
- name: "province",
11546
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11547
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Province / State" }),
11548
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11549
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11550
- ] })
11551
- }
11552
- ),
11553
- /* @__PURE__ */ jsxRuntime.jsx(
11554
- Form$2.Field,
11555
- {
11556
- control: form.control,
11557
- name: "phone",
11558
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11559
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Phone" }),
11560
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11561
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11562
- ] })
11563
- }
11564
- )
11565
- ] }) }),
11566
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
11567
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
11568
- /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
11569
- ] }) })
11570
- ]
11571
- }
11572
- ) });
11573
- };
11574
- const schema$2 = addressSchema;
11575
- const STACKED_FOCUS_MODAL_ID = "shipping-form";
11576
- const Shipping = () => {
11577
- var _a;
11578
- const { id } = reactRouterDom.useParams();
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 });
11590
- if (isError) {
11591
- throw error;
11592
- }
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
- ] }) });
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
+ ] }) });
11609
11575
  };
11610
11576
  const ShippingForm = ({ preview, order }) => {
11611
11577
  var _a;
@@ -12379,44 +12345,60 @@ const CustomAmountField = ({
12379
12345
  }
12380
12346
  );
12381
12347
  };
12382
- const TransferOwnership = () => {
12348
+ const ShippingAddress = () => {
12383
12349
  const { id } = reactRouterDom.useParams();
12384
- const { draft_order, isPending, isError, error } = useDraftOrder(id, {
12385
- fields: "id,customer_id,customer.*"
12350
+ const { order, isPending, isError, error } = useOrder(id, {
12351
+ fields: "+shipping_address"
12386
12352
  });
12387
12353
  if (isError) {
12388
12354
  throw error;
12389
12355
  }
12390
- const isReady = !isPending && !!draft_order;
12356
+ const isReady = !isPending && !!order;
12391
12357
  return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
12392
12358
  /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
12393
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Transfer Ownership" }) }),
12394
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Transfer the ownership of this draft order to a new customer" }) })
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" }) })
12395
12361
  ] }),
12396
- isReady && /* @__PURE__ */ jsxRuntime.jsx(TransferOwnershipForm, { order: draft_order })
12362
+ isReady && /* @__PURE__ */ jsxRuntime.jsx(ShippingAddressForm, { order })
12397
12363
  ] });
12398
12364
  };
12399
- const TransferOwnershipForm = ({ order }) => {
12400
- var _a, _b;
12365
+ const ShippingAddressForm = ({ order }) => {
12366
+ var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
12401
12367
  const form = reactHookForm.useForm({
12402
12368
  defaultValues: {
12403
- customer_id: order.customer_id || ""
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) ?? ""
12404
12379
  },
12405
- resolver: zod.zodResolver(schema$1)
12380
+ resolver: zod.zodResolver(schema$2)
12406
12381
  });
12407
12382
  const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
12408
12383
  const { handleSuccess } = useRouteModal();
12409
- const name = [(_a = order.customer) == null ? void 0 : _a.first_name, (_b = order.customer) == null ? void 0 : _b.last_name].filter(Boolean).join(" ");
12410
- const currentCustomer = order.customer ? {
12411
- label: name ? `${name} (${order.customer.email})` : order.customer.email,
12412
- value: order.customer.id
12413
- } : null;
12414
12384
  const onSubmit = form.handleSubmit(async (data) => {
12415
12385
  await mutateAsync(
12416
- { customer_id: data.customer_id },
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
+ },
12417
12400
  {
12418
12401
  onSuccess: () => {
12419
- ui.toast.success("Customer updated");
12420
12402
  handleSuccess();
12421
12403
  },
12422
12404
  onError: (error) => {
@@ -12431,12 +12413,199 @@ const TransferOwnershipForm = ({ order }) => {
12431
12413
  className: "flex flex-1 flex-col overflow-hidden",
12432
12414
  onSubmit,
12433
12415
  children: [
12434
- /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: [
12435
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center justify-center bg-ui-bg-component rounded-md border", children: /* @__PURE__ */ jsxRuntime.jsx(Illustration, {}) }),
12436
- currentCustomer && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col space-y-3", children: [
12437
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col", children: [
12438
- /* @__PURE__ */ jsxRuntime.jsx(ui.Label, { size: "small", weight: "plus", htmlFor: "current-customer", children: "Current owner" }),
12439
- /* @__PURE__ */ jsxRuntime.jsx(ui.Hint, { children: "The customer that is currently associated with this draft order." })
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
+ )
12454
+ ] }),
12455
+ /* @__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,
12469
+ {
12470
+ 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 TransferOwnership = () => {
12552
+ const { id } = reactRouterDom.useParams();
12553
+ const { draft_order, isPending, isError, error } = useDraftOrder(id, {
12554
+ fields: "id,customer_id,customer.*"
12555
+ });
12556
+ if (isError) {
12557
+ throw error;
12558
+ }
12559
+ const isReady = !isPending && !!draft_order;
12560
+ return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
12561
+ /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
12562
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Transfer Ownership" }) }),
12563
+ /* @__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" }) })
12564
+ ] }),
12565
+ isReady && /* @__PURE__ */ jsxRuntime.jsx(TransferOwnershipForm, { order: draft_order })
12566
+ ] });
12567
+ };
12568
+ const TransferOwnershipForm = ({ order }) => {
12569
+ var _a, _b;
12570
+ const form = reactHookForm.useForm({
12571
+ defaultValues: {
12572
+ customer_id: order.customer_id || ""
12573
+ },
12574
+ resolver: zod.zodResolver(schema$1)
12575
+ });
12576
+ const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
12577
+ const { handleSuccess } = useRouteModal();
12578
+ const name = [(_a = order.customer) == null ? void 0 : _a.first_name, (_b = order.customer) == null ? void 0 : _b.last_name].filter(Boolean).join(" ");
12579
+ const currentCustomer = order.customer ? {
12580
+ label: name ? `${name} (${order.customer.email})` : order.customer.email,
12581
+ value: order.customer.id
12582
+ } : null;
12583
+ const onSubmit = form.handleSubmit(async (data) => {
12584
+ await mutateAsync(
12585
+ { customer_id: data.customer_id },
12586
+ {
12587
+ onSuccess: () => {
12588
+ ui.toast.success("Customer updated");
12589
+ handleSuccess();
12590
+ },
12591
+ onError: (error) => {
12592
+ ui.toast.error(error.message);
12593
+ }
12594
+ }
12595
+ );
12596
+ });
12597
+ return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
12598
+ KeyboundForm,
12599
+ {
12600
+ className: "flex flex-1 flex-col overflow-hidden",
12601
+ onSubmit,
12602
+ children: [
12603
+ /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: [
12604
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center justify-center bg-ui-bg-component rounded-md border", children: /* @__PURE__ */ jsxRuntime.jsx(Illustration, {}) }),
12605
+ currentCustomer && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col space-y-3", children: [
12606
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col", children: [
12607
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Label, { size: "small", weight: "plus", htmlFor: "current-customer", children: "Current owner" }),
12608
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Hint, { children: "The customer that is currently associated with this draft order." })
12440
12609
  ] }),
12441
12610
  /* @__PURE__ */ jsxRuntime.jsxs(ui.Select, { disabled: true, value: currentCustomer.value, children: [
12442
12611
  /* @__PURE__ */ jsxRuntime.jsx(ui.Select.Trigger, { id: "current-customer", children: /* @__PURE__ */ jsxRuntime.jsx(ui.Select.Value, {}) }),
@@ -12855,196 +13024,27 @@ const Illustration = () => {
12855
13024
  const schema$1 = objectType({
12856
13025
  customer_id: stringType().min(1)
12857
13026
  });
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;
13027
+ const CustomItems = () => {
12867
13028
  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 })
13029
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Header, { children: /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Custom Items" }) }) }),
13030
+ /* @__PURE__ */ jsxRuntime.jsx(CustomItemsForm, {})
12873
13031
  ] });
12874
13032
  };
12875
- const BillingAddressForm = ({ order }) => {
12876
- var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
13033
+ const CustomItemsForm = () => {
12877
13034
  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
13035
  resolver: zod.zodResolver(schema)
12891
13036
  });
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
- ) });
13037
+ return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(KeyboundForm, { className: "flex flex-1 flex-col", children: [
13038
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, {}),
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", children: "Save" })
13042
+ ] }) })
13043
+ ] }) });
13046
13044
  };
13047
- const schema = addressSchema;
13045
+ const schema = objectType({
13046
+ email: stringType().email()
13047
+ });
13048
13048
  const widgetModule = { widgets: [] };
13049
13049
  const routeModule = {
13050
13050
  routes: [
@@ -13066,8 +13066,8 @@ const routeModule = {
13066
13066
  loader,
13067
13067
  children: [
13068
13068
  {
13069
- Component: CustomItems,
13070
- path: "/draft-orders/:id/custom-items"
13069
+ Component: BillingAddress,
13070
+ path: "/draft-orders/:id/billing-address"
13071
13071
  },
13072
13072
  {
13073
13073
  Component: Email,
@@ -13089,21 +13089,21 @@ const routeModule = {
13089
13089
  Component: SalesChannel,
13090
13090
  path: "/draft-orders/:id/sales-channel"
13091
13091
  },
13092
- {
13093
- Component: ShippingAddress,
13094
- path: "/draft-orders/:id/shipping-address"
13095
- },
13096
13092
  {
13097
13093
  Component: Shipping,
13098
13094
  path: "/draft-orders/:id/shipping"
13099
13095
  },
13096
+ {
13097
+ Component: ShippingAddress,
13098
+ path: "/draft-orders/:id/shipping-address"
13099
+ },
13100
13100
  {
13101
13101
  Component: TransferOwnership,
13102
13102
  path: "/draft-orders/:id/transfer-ownership"
13103
13103
  },
13104
13104
  {
13105
- Component: BillingAddress,
13106
- path: "/draft-orders/:id/billing-address"
13105
+ Component: CustomItems,
13106
+ path: "/draft-orders/:id/custom-items"
13107
13107
  }
13108
13108
  ]
13109
13109
  }