@medusajs/draft-order 2.10.3-preview-20250915120202 → 2.10.3-snapshot-20250915125232

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.
@@ -9567,196 +9567,27 @@ const ID = () => {
9567
9567
  /* @__PURE__ */ jsx(Outlet, {})
9568
9568
  ] });
9569
9569
  };
9570
- const BillingAddress = () => {
9571
- const { id } = useParams();
9572
- const { order, isPending, isError, error } = useOrder(id, {
9573
- fields: "+billing_address"
9574
- });
9575
- if (isError) {
9576
- throw error;
9577
- }
9578
- const isReady = !isPending && !!order;
9570
+ const CustomItems = () => {
9579
9571
  return /* @__PURE__ */ jsxs(RouteDrawer, { children: [
9580
- /* @__PURE__ */ jsxs(RouteDrawer.Header, { children: [
9581
- /* @__PURE__ */ jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Edit Billing Address" }) }),
9582
- /* @__PURE__ */ jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Edit the billing address for the draft order" }) })
9583
- ] }),
9584
- isReady && /* @__PURE__ */ jsx(BillingAddressForm, { order })
9572
+ /* @__PURE__ */ jsx(RouteDrawer.Header, { children: /* @__PURE__ */ jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Edit Custom Items" }) }) }),
9573
+ /* @__PURE__ */ jsx(CustomItemsForm, {})
9585
9574
  ] });
9586
9575
  };
9587
- const BillingAddressForm = ({ order }) => {
9588
- var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
9576
+ const CustomItemsForm = () => {
9589
9577
  const form = useForm({
9590
- defaultValues: {
9591
- first_name: ((_a = order.billing_address) == null ? void 0 : _a.first_name) ?? "",
9592
- last_name: ((_b = order.billing_address) == null ? void 0 : _b.last_name) ?? "",
9593
- company: ((_c = order.billing_address) == null ? void 0 : _c.company) ?? "",
9594
- address_1: ((_d = order.billing_address) == null ? void 0 : _d.address_1) ?? "",
9595
- address_2: ((_e = order.billing_address) == null ? void 0 : _e.address_2) ?? "",
9596
- city: ((_f = order.billing_address) == null ? void 0 : _f.city) ?? "",
9597
- province: ((_g = order.billing_address) == null ? void 0 : _g.province) ?? "",
9598
- country_code: ((_h = order.billing_address) == null ? void 0 : _h.country_code) ?? "",
9599
- postal_code: ((_i = order.billing_address) == null ? void 0 : _i.postal_code) ?? "",
9600
- phone: ((_j = order.billing_address) == null ? void 0 : _j.phone) ?? ""
9601
- },
9602
9578
  resolver: zodResolver(schema$5)
9603
9579
  });
9604
- const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
9605
- const { handleSuccess } = useRouteModal();
9606
- const onSubmit = form.handleSubmit(async (data) => {
9607
- await mutateAsync(
9608
- { billing_address: data },
9609
- {
9610
- onSuccess: () => {
9611
- handleSuccess();
9612
- },
9613
- onError: (error) => {
9614
- toast.error(error.message);
9615
- }
9616
- }
9617
- );
9618
- });
9619
- return /* @__PURE__ */ jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxs(
9620
- KeyboundForm,
9621
- {
9622
- className: "flex flex-1 flex-col overflow-hidden",
9623
- onSubmit,
9624
- children: [
9625
- /* @__PURE__ */ jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-y-4", children: [
9626
- /* @__PURE__ */ jsx(
9627
- Form$2.Field,
9628
- {
9629
- control: form.control,
9630
- name: "country_code",
9631
- render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
9632
- /* @__PURE__ */ jsx(Form$2.Label, { children: "Country" }),
9633
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(CountrySelect, { ...field }) }),
9634
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
9635
- ] })
9636
- }
9637
- ),
9638
- /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
9639
- /* @__PURE__ */ jsx(
9640
- Form$2.Field,
9641
- {
9642
- control: form.control,
9643
- name: "first_name",
9644
- render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
9645
- /* @__PURE__ */ jsx(Form$2.Label, { children: "First name" }),
9646
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
9647
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
9648
- ] })
9649
- }
9650
- ),
9651
- /* @__PURE__ */ jsx(
9652
- Form$2.Field,
9653
- {
9654
- control: form.control,
9655
- name: "last_name",
9656
- render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
9657
- /* @__PURE__ */ jsx(Form$2.Label, { children: "Last name" }),
9658
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
9659
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
9660
- ] })
9661
- }
9662
- )
9663
- ] }),
9664
- /* @__PURE__ */ jsx(
9665
- Form$2.Field,
9666
- {
9667
- control: form.control,
9668
- name: "company",
9669
- render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
9670
- /* @__PURE__ */ jsx(Form$2.Label, { optional: true, children: "Company" }),
9671
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
9672
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
9673
- ] })
9674
- }
9675
- ),
9676
- /* @__PURE__ */ jsx(
9677
- Form$2.Field,
9678
- {
9679
- control: form.control,
9680
- name: "address_1",
9681
- render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
9682
- /* @__PURE__ */ jsx(Form$2.Label, { children: "Address" }),
9683
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
9684
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
9685
- ] })
9686
- }
9687
- ),
9688
- /* @__PURE__ */ jsx(
9689
- Form$2.Field,
9690
- {
9691
- control: form.control,
9692
- name: "address_2",
9693
- render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
9694
- /* @__PURE__ */ jsx(Form$2.Label, { optional: true, children: "Apartment, suite, etc." }),
9695
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
9696
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
9697
- ] })
9698
- }
9699
- ),
9700
- /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
9701
- /* @__PURE__ */ jsx(
9702
- Form$2.Field,
9703
- {
9704
- control: form.control,
9705
- name: "postal_code",
9706
- render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
9707
- /* @__PURE__ */ jsx(Form$2.Label, { children: "Postal code" }),
9708
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
9709
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
9710
- ] })
9711
- }
9712
- ),
9713
- /* @__PURE__ */ jsx(
9714
- Form$2.Field,
9715
- {
9716
- control: form.control,
9717
- name: "city",
9718
- render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
9719
- /* @__PURE__ */ jsx(Form$2.Label, { children: "City" }),
9720
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
9721
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
9722
- ] })
9723
- }
9724
- )
9725
- ] }),
9726
- /* @__PURE__ */ jsx(
9727
- Form$2.Field,
9728
- {
9729
- control: form.control,
9730
- name: "province",
9731
- render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
9732
- /* @__PURE__ */ jsx(Form$2.Label, { optional: true, children: "Province / State" }),
9733
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
9734
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
9735
- ] })
9736
- }
9737
- ),
9738
- /* @__PURE__ */ jsx(
9739
- Form$2.Field,
9740
- {
9741
- control: form.control,
9742
- name: "phone",
9743
- render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
9744
- /* @__PURE__ */ jsx(Form$2.Label, { optional: true, children: "Phone" }),
9745
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
9746
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
9747
- ] })
9748
- }
9749
- )
9750
- ] }) }),
9751
- /* @__PURE__ */ jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex justify-end gap-2", children: [
9752
- /* @__PURE__ */ jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
9753
- /* @__PURE__ */ jsx(Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
9754
- ] }) })
9755
- ]
9756
- }
9757
- ) });
9580
+ return /* @__PURE__ */ jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxs(KeyboundForm, { className: "flex flex-1 flex-col", children: [
9581
+ /* @__PURE__ */ jsx(RouteDrawer.Body, {}),
9582
+ /* @__PURE__ */ jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex justify-end gap-2", children: [
9583
+ /* @__PURE__ */ jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
9584
+ /* @__PURE__ */ jsx(Button, { size: "small", type: "submit", children: "Save" })
9585
+ ] }) })
9586
+ ] }) });
9758
9587
  };
9759
- const schema$5 = addressSchema;
9588
+ const schema$5 = objectType({
9589
+ email: stringType().email()
9590
+ });
9760
9591
  const Email = () => {
9761
9592
  const { id } = useParams();
9762
9593
  const { order, isPending, isError, error } = useOrder(id, {
@@ -9825,27 +9656,6 @@ const EmailForm = ({ order }) => {
9825
9656
  const schema$4 = objectType({
9826
9657
  email: stringType().email()
9827
9658
  });
9828
- const CustomItems = () => {
9829
- return /* @__PURE__ */ jsxs(RouteDrawer, { children: [
9830
- /* @__PURE__ */ jsx(RouteDrawer.Header, { children: /* @__PURE__ */ jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Edit Custom Items" }) }) }),
9831
- /* @__PURE__ */ jsx(CustomItemsForm, {})
9832
- ] });
9833
- };
9834
- const CustomItemsForm = () => {
9835
- const form = useForm({
9836
- resolver: zodResolver(schema$3)
9837
- });
9838
- return /* @__PURE__ */ jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxs(KeyboundForm, { className: "flex flex-1 flex-col", children: [
9839
- /* @__PURE__ */ jsx(RouteDrawer.Body, {}),
9840
- /* @__PURE__ */ jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex justify-end gap-2", children: [
9841
- /* @__PURE__ */ jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
9842
- /* @__PURE__ */ jsx(Button, { size: "small", type: "submit", children: "Save" })
9843
- ] }) })
9844
- ] }) });
9845
- };
9846
- const schema$3 = objectType({
9847
- email: stringType().email()
9848
- });
9849
9659
  const NumberInput = forwardRef(
9850
9660
  ({
9851
9661
  value,
@@ -11447,47 +11257,153 @@ function getPromotionIds(items, shippingMethods) {
11447
11257
  }
11448
11258
  return Array.from(promotionIds);
11449
11259
  }
11450
- const ShippingAddress = () => {
11260
+ const SalesChannel = () => {
11451
11261
  const { id } = useParams();
11452
- const { order, isPending, isError, error } = useOrder(id, {
11453
- fields: "+shipping_address"
11454
- });
11262
+ const { draft_order, isPending, isError, error } = useDraftOrder(
11263
+ id,
11264
+ {
11265
+ fields: "+sales_channel_id"
11266
+ },
11267
+ {
11268
+ enabled: !!id
11269
+ }
11270
+ );
11455
11271
  if (isError) {
11456
11272
  throw error;
11457
11273
  }
11458
- const isReady = !isPending && !!order;
11274
+ const ISrEADY = !!draft_order && !isPending;
11459
11275
  return /* @__PURE__ */ jsxs(RouteDrawer, { children: [
11460
11276
  /* @__PURE__ */ jsxs(RouteDrawer.Header, { children: [
11461
- /* @__PURE__ */ jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Edit Shipping Address" }) }),
11462
- /* @__PURE__ */ jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Edit the shipping address for the draft order" }) })
11277
+ /* @__PURE__ */ jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Edit Sales Channel" }) }),
11278
+ /* @__PURE__ */ jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Update which sales channel the draft order is associated with" }) })
11463
11279
  ] }),
11464
- isReady && /* @__PURE__ */ jsx(ShippingAddressForm, { order })
11280
+ ISrEADY && /* @__PURE__ */ jsx(SalesChannelForm, { order: draft_order })
11465
11281
  ] });
11466
11282
  };
11467
- const ShippingAddressForm = ({ order }) => {
11468
- var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
11283
+ const SalesChannelForm = ({ order }) => {
11469
11284
  const form = useForm({
11470
11285
  defaultValues: {
11471
- first_name: ((_a = order.shipping_address) == null ? void 0 : _a.first_name) ?? "",
11472
- last_name: ((_b = order.shipping_address) == null ? void 0 : _b.last_name) ?? "",
11473
- company: ((_c = order.shipping_address) == null ? void 0 : _c.company) ?? "",
11474
- address_1: ((_d = order.shipping_address) == null ? void 0 : _d.address_1) ?? "",
11475
- address_2: ((_e = order.shipping_address) == null ? void 0 : _e.address_2) ?? "",
11476
- city: ((_f = order.shipping_address) == null ? void 0 : _f.city) ?? "",
11477
- province: ((_g = order.shipping_address) == null ? void 0 : _g.province) ?? "",
11478
- country_code: ((_h = order.shipping_address) == null ? void 0 : _h.country_code) ?? "",
11479
- postal_code: ((_i = order.shipping_address) == null ? void 0 : _i.postal_code) ?? "",
11480
- phone: ((_j = order.shipping_address) == null ? void 0 : _j.phone) ?? ""
11286
+ sales_channel_id: order.sales_channel_id || ""
11481
11287
  },
11482
- resolver: zodResolver(schema$2)
11288
+ resolver: zodResolver(schema$3)
11483
11289
  });
11484
11290
  const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
11485
11291
  const { handleSuccess } = useRouteModal();
11486
11292
  const onSubmit = form.handleSubmit(async (data) => {
11487
11293
  await mutateAsync(
11488
11294
  {
11489
- shipping_address: {
11490
- first_name: data.first_name,
11295
+ sales_channel_id: data.sales_channel_id
11296
+ },
11297
+ {
11298
+ onSuccess: () => {
11299
+ toast.success("Sales channel updated");
11300
+ handleSuccess();
11301
+ },
11302
+ onError: (error) => {
11303
+ toast.error(error.message);
11304
+ }
11305
+ }
11306
+ );
11307
+ });
11308
+ return /* @__PURE__ */ jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxs(
11309
+ KeyboundForm,
11310
+ {
11311
+ className: "flex flex-1 flex-col overflow-hidden",
11312
+ onSubmit,
11313
+ children: [
11314
+ /* @__PURE__ */ jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsx(SalesChannelField, { control: form.control, order }) }),
11315
+ /* @__PURE__ */ jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex justify-end gap-2", children: [
11316
+ /* @__PURE__ */ jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
11317
+ /* @__PURE__ */ jsx(Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
11318
+ ] }) })
11319
+ ]
11320
+ }
11321
+ ) });
11322
+ };
11323
+ const SalesChannelField = ({ control, order }) => {
11324
+ const salesChannels = useComboboxData({
11325
+ queryFn: async (params) => {
11326
+ return await sdk.admin.salesChannel.list(params);
11327
+ },
11328
+ queryKey: ["sales-channels"],
11329
+ getOptions: (data) => {
11330
+ return data.sales_channels.map((salesChannel) => ({
11331
+ label: salesChannel.name,
11332
+ value: salesChannel.id
11333
+ }));
11334
+ },
11335
+ defaultValue: order.sales_channel_id || void 0
11336
+ });
11337
+ return /* @__PURE__ */ jsx(
11338
+ Form$2.Field,
11339
+ {
11340
+ control,
11341
+ name: "sales_channel_id",
11342
+ render: ({ field }) => {
11343
+ return /* @__PURE__ */ jsxs(Form$2.Item, { children: [
11344
+ /* @__PURE__ */ jsx(Form$2.Label, { children: "Sales Channel" }),
11345
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(
11346
+ Combobox,
11347
+ {
11348
+ options: salesChannels.options,
11349
+ fetchNextPage: salesChannels.fetchNextPage,
11350
+ isFetchingNextPage: salesChannels.isFetchingNextPage,
11351
+ searchValue: salesChannels.searchValue,
11352
+ onSearchValueChange: salesChannels.onSearchValueChange,
11353
+ placeholder: "Select sales channel",
11354
+ ...field
11355
+ }
11356
+ ) }),
11357
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
11358
+ ] });
11359
+ }
11360
+ }
11361
+ );
11362
+ };
11363
+ const schema$3 = objectType({
11364
+ sales_channel_id: stringType().min(1)
11365
+ });
11366
+ const ShippingAddress = () => {
11367
+ const { id } = useParams();
11368
+ const { order, isPending, isError, error } = useOrder(id, {
11369
+ fields: "+shipping_address"
11370
+ });
11371
+ if (isError) {
11372
+ throw error;
11373
+ }
11374
+ const isReady = !isPending && !!order;
11375
+ return /* @__PURE__ */ jsxs(RouteDrawer, { children: [
11376
+ /* @__PURE__ */ jsxs(RouteDrawer.Header, { children: [
11377
+ /* @__PURE__ */ jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Edit Shipping Address" }) }),
11378
+ /* @__PURE__ */ jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Edit the shipping address for the draft order" }) })
11379
+ ] }),
11380
+ isReady && /* @__PURE__ */ jsx(ShippingAddressForm, { order })
11381
+ ] });
11382
+ };
11383
+ const ShippingAddressForm = ({ order }) => {
11384
+ var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
11385
+ const form = useForm({
11386
+ defaultValues: {
11387
+ first_name: ((_a = order.shipping_address) == null ? void 0 : _a.first_name) ?? "",
11388
+ last_name: ((_b = order.shipping_address) == null ? void 0 : _b.last_name) ?? "",
11389
+ company: ((_c = order.shipping_address) == null ? void 0 : _c.company) ?? "",
11390
+ address_1: ((_d = order.shipping_address) == null ? void 0 : _d.address_1) ?? "",
11391
+ address_2: ((_e = order.shipping_address) == null ? void 0 : _e.address_2) ?? "",
11392
+ city: ((_f = order.shipping_address) == null ? void 0 : _f.city) ?? "",
11393
+ province: ((_g = order.shipping_address) == null ? void 0 : _g.province) ?? "",
11394
+ country_code: ((_h = order.shipping_address) == null ? void 0 : _h.country_code) ?? "",
11395
+ postal_code: ((_i = order.shipping_address) == null ? void 0 : _i.postal_code) ?? "",
11396
+ phone: ((_j = order.shipping_address) == null ? void 0 : _j.phone) ?? ""
11397
+ },
11398
+ resolver: zodResolver(schema$2)
11399
+ });
11400
+ const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
11401
+ const { handleSuccess } = useRouteModal();
11402
+ const onSubmit = form.handleSubmit(async (data) => {
11403
+ await mutateAsync(
11404
+ {
11405
+ shipping_address: {
11406
+ first_name: data.first_name,
11491
11407
  last_name: data.last_name,
11492
11408
  company: data.company,
11493
11409
  address_1: data.address_1,
@@ -11650,948 +11566,141 @@ const ShippingAddressForm = ({ order }) => {
11650
11566
  ) });
11651
11567
  };
11652
11568
  const schema$2 = addressSchema;
11653
- const STACKED_FOCUS_MODAL_ID = "shipping-form";
11654
- const Shipping = () => {
11655
- var _a;
11569
+ const TransferOwnership = () => {
11656
11570
  const { id } = useParams();
11657
- const { order, isPending, isError, error } = useOrder(id, {
11658
- fields: "+items.*,+items.variant.*,+items.variant.product.*,+items.variant.product.shipping_profile.*,+currency_code"
11571
+ const { draft_order, isPending, isError, error } = useDraftOrder(id, {
11572
+ fields: "id,customer_id,customer.*"
11659
11573
  });
11660
- const {
11661
- order: preview,
11662
- isPending: isPreviewPending,
11663
- isError: isPreviewError,
11664
- error: previewError
11665
- } = useOrderPreview(id);
11666
- useInitiateOrderEdit({ preview });
11667
- const { onCancel } = useCancelOrderEdit({ preview });
11668
11574
  if (isError) {
11669
11575
  throw error;
11670
11576
  }
11671
- if (isPreviewError) {
11672
- throw previewError;
11673
- }
11674
- const orderHasItems = (((_a = order == null ? void 0 : order.items) == null ? void 0 : _a.length) || 0) > 0;
11675
- const isReady = preview && !isPreviewPending && order && !isPending;
11676
- return /* @__PURE__ */ jsx(RouteFocusModal, { onClose: onCancel, children: !orderHasItems ? /* @__PURE__ */ jsxs("div", { className: "flex h-full flex-col overflow-hidden ", children: [
11677
- /* @__PURE__ */ jsx(RouteFocusModal.Header, {}),
11678
- /* @__PURE__ */ jsx(RouteFocusModal.Body, { className: "flex flex-1 flex-col overflow-hidden", children: /* @__PURE__ */ jsx("div", { className: "flex flex-1 flex-col items-center overflow-y-auto", children: /* @__PURE__ */ jsxs("div", { className: "flex w-full max-w-[720px] flex-col gap-y-6 py-16 px-6", children: [
11679
- /* @__PURE__ */ jsx(RouteFocusModal.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Shipping" }) }),
11680
- /* @__PURE__ */ jsx(RouteFocusModal.Description, { asChild: true, children: /* @__PURE__ */ jsx(Text, { size: "small", className: "text-ui-fg-subtle", children: "This draft order currently has no items. Add items to the order before adding shipping." }) })
11681
- ] }) }) }),
11682
- /* @__PURE__ */ jsx(RouteFocusModal.Footer, { children: /* @__PURE__ */ jsx(RouteFocusModal.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", type: "button", children: "Cancel" }) }) })
11683
- ] }) : isReady ? /* @__PURE__ */ jsx(ShippingForm, { preview, order }) : /* @__PURE__ */ jsxs("div", { children: [
11684
- /* @__PURE__ */ jsx(RouteFocusModal.Title, { asChild: true, children: /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Edit Shipping" }) }),
11685
- /* @__PURE__ */ jsx(RouteFocusModal.Description, { asChild: true, children: /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Loading data for the draft order, please wait..." }) })
11686
- ] }) });
11577
+ const isReady = !isPending && !!draft_order;
11578
+ return /* @__PURE__ */ jsxs(RouteDrawer, { children: [
11579
+ /* @__PURE__ */ jsxs(RouteDrawer.Header, { children: [
11580
+ /* @__PURE__ */ jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Transfer Ownership" }) }),
11581
+ /* @__PURE__ */ jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Transfer the ownership of this draft order to a new customer" }) })
11582
+ ] }),
11583
+ isReady && /* @__PURE__ */ jsx(TransferOwnershipForm, { order: draft_order })
11584
+ ] });
11687
11585
  };
11688
- const ShippingForm = ({ preview, order }) => {
11689
- var _a;
11690
- const { setIsOpen } = useStackedModal();
11691
- const [isSubmitting, setIsSubmitting] = useState(false);
11692
- const [data, setData] = useState(null);
11693
- const appliedShippingOptionIds = (_a = preview.shipping_methods) == null ? void 0 : _a.map((method) => method.shipping_option_id).filter(Boolean);
11694
- const { shipping_options } = useShippingOptions(
11695
- {
11696
- id: appliedShippingOptionIds,
11697
- fields: "+service_zone.*,+service_zone.fulfillment_set.*,+service_zone.fulfillment_set.location.*"
11586
+ const TransferOwnershipForm = ({ order }) => {
11587
+ var _a, _b;
11588
+ const form = useForm({
11589
+ defaultValues: {
11590
+ customer_id: order.customer_id || ""
11698
11591
  },
11699
- {
11700
- enabled: appliedShippingOptionIds.length > 0
11701
- }
11702
- );
11703
- const uniqueShippingProfiles = useMemo(() => {
11704
- const profiles = /* @__PURE__ */ new Map();
11705
- getUniqueShippingProfiles(order.items).forEach((profile) => {
11706
- profiles.set(profile.id, profile);
11707
- });
11708
- shipping_options == null ? void 0 : shipping_options.forEach((option) => {
11709
- profiles.set(option.shipping_profile_id, option.shipping_profile);
11710
- });
11711
- return Array.from(profiles.values());
11712
- }, [order.items, shipping_options]);
11592
+ resolver: zodResolver(schema$1)
11593
+ });
11594
+ const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
11713
11595
  const { handleSuccess } = useRouteModal();
11714
- const { mutateAsync: confirmOrderEdit } = useDraftOrderConfirmEdit(preview.id);
11715
- const { mutateAsync: requestOrderEdit } = useDraftOrderRequestEdit(preview.id);
11716
- const { mutateAsync: removeShippingMethod } = useDraftOrderRemoveShippingMethod(preview.id);
11717
- const { mutateAsync: removeActionShippingMethod } = useDraftOrderRemoveActionShippingMethod(preview.id);
11718
- const onSubmit = async () => {
11719
- setIsSubmitting(true);
11720
- let requestSucceeded = false;
11721
- await requestOrderEdit(void 0, {
11722
- onError: (e) => {
11723
- toast.error(`Failed to request order edit: ${e.message}`);
11724
- },
11725
- onSuccess: () => {
11726
- requestSucceeded = true;
11727
- }
11728
- });
11729
- if (!requestSucceeded) {
11730
- setIsSubmitting(false);
11731
- return;
11732
- }
11733
- await confirmOrderEdit(void 0, {
11734
- onError: (e) => {
11735
- toast.error(`Failed to confirm order edit: ${e.message}`);
11736
- },
11737
- onSuccess: () => {
11738
- handleSuccess();
11739
- },
11740
- onSettled: () => {
11741
- setIsSubmitting(false);
11742
- }
11743
- });
11744
- };
11745
- const onKeydown = useCallback(
11746
- (e) => {
11747
- if (e.key === "Enter" && (e.ctrlKey || e.metaKey)) {
11748
- if (data || isSubmitting) {
11749
- return;
11596
+ const name = [(_a = order.customer) == null ? void 0 : _a.first_name, (_b = order.customer) == null ? void 0 : _b.last_name].filter(Boolean).join(" ");
11597
+ const currentCustomer = order.customer ? {
11598
+ label: name ? `${name} (${order.customer.email})` : order.customer.email,
11599
+ value: order.customer.id
11600
+ } : null;
11601
+ const onSubmit = form.handleSubmit(async (data) => {
11602
+ await mutateAsync(
11603
+ { customer_id: data.customer_id },
11604
+ {
11605
+ onSuccess: () => {
11606
+ toast.success("Customer updated");
11607
+ handleSuccess();
11608
+ },
11609
+ onError: (error) => {
11610
+ toast.error(error.message);
11750
11611
  }
11751
- onSubmit();
11752
11612
  }
11753
- },
11754
- [data, isSubmitting, onSubmit]
11755
- );
11756
- useEffect(() => {
11757
- document.addEventListener("keydown", onKeydown);
11758
- return () => {
11759
- document.removeEventListener("keydown", onKeydown);
11760
- };
11761
- }, [onKeydown]);
11762
- return /* @__PURE__ */ jsxs("div", { className: "flex h-full flex-col overflow-hidden", children: [
11763
- /* @__PURE__ */ jsx(RouteFocusModal.Header, {}),
11764
- /* @__PURE__ */ jsxs(RouteFocusModal.Body, { className: "flex flex-1 flex-col overflow-hidden", children: [
11765
- /* @__PURE__ */ jsx("div", { className: "flex flex-1 flex-col items-center overflow-y-auto", children: /* @__PURE__ */ jsxs("div", { className: "flex w-full max-w-[720px] flex-col gap-y-6 py-16 px-6", children: [
11766
- /* @__PURE__ */ jsxs("div", { children: [
11767
- /* @__PURE__ */ jsx(RouteFocusModal.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Shipping" }) }),
11768
- /* @__PURE__ */ jsx(RouteFocusModal.Description, { asChild: true, children: /* @__PURE__ */ jsx(Text, { size: "small", className: "text-ui-fg-subtle", children: "Choose which shipping method(s) to use for the items in the order." }) })
11769
- ] }),
11770
- /* @__PURE__ */ jsx(Divider, { variant: "dashed" }),
11771
- /* @__PURE__ */ jsx(Accordion.Root, { type: "multiple", children: /* @__PURE__ */ jsxs("div", { className: "bg-ui-bg-subtle rounded-xl shadow-elevation-card-rest", children: [
11772
- /* @__PURE__ */ jsxs("div", { className: "px-4 py-2 flex items-center justify-between", children: [
11773
- /* @__PURE__ */ jsx(
11774
- Text,
11775
- {
11776
- size: "xsmall",
11777
- weight: "plus",
11778
- className: "text-ui-fg-muted",
11779
- children: "Shipping profile"
11780
- }
11781
- ),
11782
- /* @__PURE__ */ jsx(
11783
- Text,
11784
- {
11785
- size: "xsmall",
11786
- weight: "plus",
11787
- className: "text-ui-fg-muted",
11788
- children: "Action"
11789
- }
11790
- )
11613
+ );
11614
+ });
11615
+ return /* @__PURE__ */ jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxs(
11616
+ KeyboundForm,
11617
+ {
11618
+ className: "flex flex-1 flex-col overflow-hidden",
11619
+ onSubmit,
11620
+ children: [
11621
+ /* @__PURE__ */ jsxs(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: [
11622
+ /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center bg-ui-bg-component rounded-md border", children: /* @__PURE__ */ jsx(Illustration, {}) }),
11623
+ currentCustomer && /* @__PURE__ */ jsxs("div", { className: "flex flex-col space-y-3", children: [
11624
+ /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
11625
+ /* @__PURE__ */ jsx(Label$1, { size: "small", weight: "plus", htmlFor: "current-customer", children: "Current owner" }),
11626
+ /* @__PURE__ */ jsx(Hint$1, { children: "The customer that is currently associated with this draft order." })
11627
+ ] }),
11628
+ /* @__PURE__ */ jsxs(Select, { disabled: true, value: currentCustomer.value, children: [
11629
+ /* @__PURE__ */ jsx(Select.Trigger, { id: "current-customer", children: /* @__PURE__ */ jsx(Select.Value, {}) }),
11630
+ /* @__PURE__ */ jsx(Select.Content, { children: /* @__PURE__ */ jsx(Select.Item, { value: currentCustomer.value, children: currentCustomer.label }) })
11631
+ ] })
11791
11632
  ] }),
11792
- /* @__PURE__ */ jsx("div", { className: "px-[5px] pb-[5px]", children: uniqueShippingProfiles.map((profile) => {
11793
- var _a2, _b, _c, _d, _e, _f, _g;
11794
- const items = getItemsWithShippingProfile(
11795
- profile.id,
11796
- order.items
11797
- );
11798
- const hasItems = items.length > 0;
11799
- const shippingOption = shipping_options == null ? void 0 : shipping_options.find(
11800
- (option) => option.shipping_profile_id === profile.id
11801
- );
11802
- const shippingMethod = preview.shipping_methods.find(
11803
- (method) => method.shipping_option_id === (shippingOption == null ? void 0 : shippingOption.id)
11804
- );
11805
- const addShippingMethodAction = (_a2 = shippingMethod == null ? void 0 : shippingMethod.actions) == null ? void 0 : _a2.find(
11806
- (action) => action.action === "SHIPPING_ADD"
11807
- );
11808
- return /* @__PURE__ */ jsxs(
11809
- Accordion.Item,
11810
- {
11811
- value: profile.id,
11812
- className: "bg-ui-bg-base shadow-elevation-card-rest rounded-lg",
11813
- children: [
11814
- /* @__PURE__ */ jsxs("div", { className: "px-3 py-2 flex items-center justify-between gap-3", children: [
11815
- /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-x-3 w-full overflow-hidden", children: [
11816
- /* @__PURE__ */ jsx(Accordion.Trigger, { asChild: true, children: /* @__PURE__ */ jsx(
11817
- IconButton,
11818
- {
11819
- size: "2xsmall",
11820
- variant: "transparent",
11821
- className: "group/trigger",
11822
- disabled: !hasItems,
11823
- children: /* @__PURE__ */ jsx(TriangleRightMini, { className: "group-data-[state=open]/trigger:rotate-90 transition-transform" })
11824
- }
11825
- ) }),
11826
- !shippingOption ? /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-x-3", children: [
11827
- /* @__PURE__ */ jsx("div", { className: "size-7 rounded-md shadow-borders-base flex items-center justify-center", children: /* @__PURE__ */ jsx("div", { className: "size-6 rounded bg-ui-bg-component-hover flex items-center justify-center", children: /* @__PURE__ */ jsx(Shopping, { className: "text-ui-fg-subtle" }) }) }),
11828
- /* @__PURE__ */ jsxs("div", { className: "flex flex-col flex-1", children: [
11829
- /* @__PURE__ */ jsx(
11830
- Text,
11831
- {
11832
- size: "small",
11833
- weight: "plus",
11834
- leading: "compact",
11835
- children: profile.name
11836
- }
11837
- ),
11838
- /* @__PURE__ */ jsxs(
11839
- Text,
11840
- {
11841
- size: "small",
11842
- leading: "compact",
11843
- className: "text-ui-fg-subtle",
11844
- children: [
11845
- items.length,
11846
- " ",
11847
- pluralize(items.length, "items", "item")
11848
- ]
11849
- }
11850
- )
11851
- ] })
11852
- ] }) : /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-[5px] max-sm:flex-col max-sm:items-start flex-1 w-full overflow-hidden", children: [
11853
- /* @__PURE__ */ jsx(
11854
- Tooltip,
11855
- {
11856
- content: /* @__PURE__ */ jsx("ul", { children: items.map((item) => {
11857
- var _a3, _b2, _c2;
11858
- return /* @__PURE__ */ jsx(
11859
- "li",
11860
- {
11861
- children: `${item.quantity}x ${(_b2 = (_a3 = item.variant) == null ? void 0 : _a3.product) == null ? void 0 : _b2.title} (${(_c2 = item.variant) == null ? void 0 : _c2.title})`
11862
- },
11863
- item.id
11864
- );
11865
- }) }),
11866
- children: /* @__PURE__ */ jsxs(
11867
- Badge,
11868
- {
11869
- className: "flex items-center gap-x-[3px] overflow-hidden cursor-default",
11870
- size: "xsmall",
11871
- children: [
11872
- /* @__PURE__ */ jsx(Shopping, { className: "shrink-0" }),
11873
- /* @__PURE__ */ jsxs("span", { className: "truncate", children: [
11874
- items.reduce(
11875
- (acc, item) => acc + item.quantity,
11876
- 0
11877
- ),
11878
- "x",
11879
- " ",
11880
- pluralize(items.length, "items", "item")
11881
- ] })
11882
- ]
11883
- }
11884
- )
11885
- }
11886
- ),
11887
- /* @__PURE__ */ jsx(
11888
- Tooltip,
11889
- {
11890
- content: (_d = (_c = (_b = shippingOption.service_zone) == null ? void 0 : _b.fulfillment_set) == null ? void 0 : _c.location) == null ? void 0 : _d.name,
11891
- children: /* @__PURE__ */ jsxs(
11892
- Badge,
11893
- {
11894
- className: "flex items-center gap-x-[3px] overflow-hidden cursor-default",
11895
- size: "xsmall",
11896
- children: [
11897
- /* @__PURE__ */ jsx(Buildings, { className: "shrink-0" }),
11898
- /* @__PURE__ */ jsx("span", { className: "truncate", children: (_g = (_f = (_e = shippingOption.service_zone) == null ? void 0 : _e.fulfillment_set) == null ? void 0 : _f.location) == null ? void 0 : _g.name })
11899
- ]
11900
- }
11901
- )
11902
- }
11903
- ),
11904
- /* @__PURE__ */ jsx(Tooltip, { content: shippingOption.name, children: /* @__PURE__ */ jsxs(
11905
- Badge,
11906
- {
11907
- className: "flex items-center gap-x-[3px] overflow-hidden cursor-default",
11908
- size: "xsmall",
11909
- children: [
11910
- /* @__PURE__ */ jsx(TruckFast, { className: "shrink-0" }),
11911
- /* @__PURE__ */ jsx("span", { className: "truncate", children: shippingOption.name })
11912
- ]
11913
- }
11914
- ) })
11915
- ] })
11916
- ] }),
11917
- shippingOption ? /* @__PURE__ */ jsx(
11918
- ActionMenu,
11919
- {
11920
- groups: [
11921
- {
11922
- actions: [
11923
- hasItems ? {
11924
- label: "Edit shipping option",
11925
- icon: /* @__PURE__ */ jsx(Channels, {}),
11926
- onClick: () => {
11927
- setIsOpen(
11928
- STACKED_FOCUS_MODAL_ID,
11929
- true
11930
- );
11931
- setData({
11932
- shippingProfileId: profile.id,
11933
- shippingOption,
11934
- shippingMethod
11935
- });
11936
- }
11937
- } : void 0,
11938
- {
11939
- label: "Remove shipping option",
11940
- icon: /* @__PURE__ */ jsx(Trash, {}),
11941
- onClick: () => {
11942
- if (shippingMethod) {
11943
- if (addShippingMethodAction) {
11944
- removeActionShippingMethod(
11945
- addShippingMethodAction.id
11946
- );
11947
- } else {
11948
- removeShippingMethod(
11949
- shippingMethod.id
11950
- );
11951
- }
11952
- }
11953
- }
11954
- }
11955
- ].filter(Boolean)
11956
- }
11957
- ]
11958
- }
11959
- ) : /* @__PURE__ */ jsx(
11960
- StackedModalTrigger,
11961
- {
11962
- shippingProfileId: profile.id,
11963
- shippingOption,
11964
- shippingMethod,
11965
- setData,
11966
- children: "Add shipping option"
11967
- }
11968
- )
11969
- ] }),
11970
- /* @__PURE__ */ jsxs(Accordion.Content, { children: [
11971
- /* @__PURE__ */ jsx(Divider, { variant: "dashed" }),
11972
- items.map((item, idx) => {
11973
- var _a3, _b2, _c2, _d2, _e2;
11974
- return /* @__PURE__ */ jsxs("div", { children: [
11975
- /* @__PURE__ */ jsxs(
11976
- "div",
11977
- {
11978
- className: "px-3 flex items-center gap-x-3",
11979
- children: [
11980
- /* @__PURE__ */ jsx("div", { className: "w-5 h-[56px] flex flex-col justify-center items-center", children: /* @__PURE__ */ jsx(
11981
- Divider,
11982
- {
11983
- variant: "dashed",
11984
- orientation: "vertical"
11985
- }
11986
- ) }),
11987
- /* @__PURE__ */ jsxs("div", { className: "py-2 flex items-center gap-x-3", children: [
11988
- /* @__PURE__ */ jsx("div", { className: "size-7 flex items-center justify-center tabular-nums", children: /* @__PURE__ */ jsxs(
11989
- Text,
11990
- {
11991
- size: "small",
11992
- leading: "compact",
11993
- className: "text-ui-fg-subtle",
11994
- children: [
11995
- item.quantity,
11996
- "x"
11997
- ]
11998
- }
11999
- ) }),
12000
- /* @__PURE__ */ jsx(Thumbnail, { thumbnail: item.thumbnail }),
12001
- /* @__PURE__ */ jsxs("div", { children: [
12002
- /* @__PURE__ */ jsxs(
12003
- Text,
12004
- {
12005
- size: "small",
12006
- leading: "compact",
12007
- weight: "plus",
12008
- children: [
12009
- (_b2 = (_a3 = item.variant) == null ? void 0 : _a3.product) == null ? void 0 : _b2.title,
12010
- " (",
12011
- (_c2 = item.variant) == null ? void 0 : _c2.title,
12012
- ")"
12013
- ]
12014
- }
12015
- ),
12016
- /* @__PURE__ */ jsx(
12017
- Text,
12018
- {
12019
- size: "small",
12020
- leading: "compact",
12021
- className: "text-ui-fg-subtle",
12022
- children: (_e2 = (_d2 = item.variant) == null ? void 0 : _d2.options) == null ? void 0 : _e2.map((option) => option.value).join(" · ")
12023
- }
12024
- )
12025
- ] })
12026
- ] })
12027
- ]
12028
- },
12029
- item.id
12030
- ),
12031
- idx !== items.length - 1 && /* @__PURE__ */ jsx(Divider, { variant: "dashed" })
12032
- ] }, item.id);
12033
- })
12034
- ] })
12035
- ]
12036
- },
12037
- profile.id
12038
- );
12039
- }) })
12040
- ] }) })
12041
- ] }) }),
12042
- /* @__PURE__ */ jsx(
12043
- StackedFocusModal,
12044
- {
12045
- id: STACKED_FOCUS_MODAL_ID,
12046
- onOpenChangeCallback: (open) => {
12047
- if (!open) {
12048
- setData(null);
11633
+ /* @__PURE__ */ jsx(
11634
+ CustomerField,
11635
+ {
11636
+ control: form.control,
11637
+ currentCustomerId: order.customer_id
12049
11638
  }
12050
- return open;
12051
- },
12052
- children: data && /* @__PURE__ */ jsx(ShippingProfileForm, { data, order, preview })
12053
- }
12054
- )
12055
- ] }),
12056
- /* @__PURE__ */ jsx(RouteFocusModal.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex justify-end gap-x-2", children: [
12057
- /* @__PURE__ */ jsx(RouteFocusModal.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", type: "button", children: "Cancel" }) }),
12058
- /* @__PURE__ */ jsx(
12059
- Button,
12060
- {
12061
- size: "small",
12062
- type: "button",
12063
- isLoading: isSubmitting,
12064
- onClick: onSubmit,
12065
- children: "Save"
12066
- }
12067
- )
12068
- ] }) })
12069
- ] });
11639
+ )
11640
+ ] }),
11641
+ /* @__PURE__ */ jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
11642
+ /* @__PURE__ */ jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { variant: "secondary", size: "small", children: "Cancel" }) }),
11643
+ /* @__PURE__ */ jsx(Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
11644
+ ] }) })
11645
+ ]
11646
+ }
11647
+ ) });
12070
11648
  };
12071
- const StackedModalTrigger = ({
12072
- shippingProfileId,
12073
- shippingOption,
12074
- shippingMethod,
12075
- setData,
12076
- children
12077
- }) => {
12078
- const { setIsOpen, getIsOpen } = useStackedModal();
12079
- const isOpen = getIsOpen(STACKED_FOCUS_MODAL_ID);
12080
- const onToggle = () => {
12081
- if (isOpen) {
12082
- setIsOpen(STACKED_FOCUS_MODAL_ID, false);
12083
- setData(null);
12084
- } else {
12085
- setIsOpen(STACKED_FOCUS_MODAL_ID, true);
12086
- setData({
12087
- shippingProfileId,
12088
- shippingOption,
12089
- shippingMethod
11649
+ const CustomerField = ({ control, currentCustomerId }) => {
11650
+ const customers = useComboboxData({
11651
+ queryFn: async (params) => {
11652
+ return await sdk.admin.customer.list({
11653
+ ...params,
11654
+ id: currentCustomerId ? { $nin: [currentCustomerId] } : void 0
11655
+ });
11656
+ },
11657
+ queryKey: ["customers"],
11658
+ getOptions: (data) => {
11659
+ return data.customers.map((customer) => {
11660
+ const name = [customer.first_name, customer.last_name].filter(Boolean).join(" ");
11661
+ return {
11662
+ label: name ? `${name} (${customer.email})` : customer.email,
11663
+ value: customer.id
11664
+ };
12090
11665
  });
12091
11666
  }
12092
- };
11667
+ });
12093
11668
  return /* @__PURE__ */ jsx(
12094
- Button,
11669
+ Form$2.Field,
12095
11670
  {
12096
- size: "small",
12097
- variant: "secondary",
12098
- onClick: onToggle,
12099
- className: "text-ui-fg-primary shrink-0",
12100
- children
11671
+ name: "customer_id",
11672
+ control,
11673
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { className: "space-y-3", children: [
11674
+ /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
11675
+ /* @__PURE__ */ jsx(Form$2.Label, { children: "New customer" }),
11676
+ /* @__PURE__ */ jsx(Form$2.Hint, { children: "The customer to transfer this draft order to." })
11677
+ ] }),
11678
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(
11679
+ Combobox,
11680
+ {
11681
+ options: customers.options,
11682
+ fetchNextPage: customers.fetchNextPage,
11683
+ isFetchingNextPage: customers.isFetchingNextPage,
11684
+ searchValue: customers.searchValue,
11685
+ onSearchValueChange: customers.onSearchValueChange,
11686
+ placeholder: "Select customer",
11687
+ ...field
11688
+ }
11689
+ ) }),
11690
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
11691
+ ] })
12101
11692
  }
12102
11693
  );
12103
11694
  };
12104
- const ShippingProfileForm = ({
12105
- data,
12106
- order,
12107
- preview
12108
- }) => {
12109
- var _a, _b, _c, _d, _e, _f;
12110
- const { setIsOpen } = useStackedModal();
12111
- const form = useForm({
12112
- resolver: zodResolver(shippingMethodSchema),
12113
- defaultValues: {
12114
- location_id: (_d = (_c = (_b = (_a = data.shippingOption) == null ? void 0 : _a.service_zone) == null ? void 0 : _b.fulfillment_set) == null ? void 0 : _c.location) == null ? void 0 : _d.id,
12115
- shipping_option_id: (_e = data.shippingOption) == null ? void 0 : _e.id,
12116
- custom_amount: (_f = data.shippingMethod) == null ? void 0 : _f.amount
12117
- }
12118
- });
12119
- const { mutateAsync: addShippingMethod, isPending } = useDraftOrderAddShippingMethod(order.id);
12120
- const {
12121
- mutateAsync: updateShippingMethod,
12122
- isPending: isUpdatingShippingMethod
12123
- } = useDraftOrderUpdateShippingMethod(order.id);
12124
- const onSubmit = form.handleSubmit(async (values) => {
12125
- if (isEqual(values, form.formState.defaultValues)) {
12126
- setIsOpen(STACKED_FOCUS_MODAL_ID, false);
12127
- return;
12128
- }
12129
- if (data.shippingMethod) {
12130
- await updateShippingMethod(
12131
- {
12132
- method_id: data.shippingMethod.id,
12133
- shipping_option_id: values.shipping_option_id,
12134
- custom_amount: values.custom_amount ? convertNumber(values.custom_amount) : void 0
12135
- },
12136
- {
12137
- onError: (e) => {
12138
- toast.error(e.message);
12139
- },
12140
- onSuccess: () => {
12141
- setIsOpen(STACKED_FOCUS_MODAL_ID, false);
12142
- }
12143
- }
12144
- );
12145
- return;
12146
- }
12147
- await addShippingMethod(
12148
- {
12149
- shipping_option_id: values.shipping_option_id,
12150
- custom_amount: values.custom_amount ? convertNumber(values.custom_amount) : void 0
12151
- },
12152
- {
12153
- onError: (e) => {
12154
- toast.error(e.message);
12155
- },
12156
- onSuccess: () => {
12157
- setIsOpen(STACKED_FOCUS_MODAL_ID, false);
12158
- }
12159
- }
12160
- );
12161
- });
12162
- return /* @__PURE__ */ jsx(StackedFocusModal.Content, { children: /* @__PURE__ */ jsx(Form$2, { ...form, children: /* @__PURE__ */ jsxs(
12163
- KeyboundForm,
11695
+ const Illustration = () => {
11696
+ return /* @__PURE__ */ jsxs(
11697
+ "svg",
12164
11698
  {
12165
- className: "flex h-full flex-col overflow-hidden",
12166
- onSubmit,
12167
- children: [
12168
- /* @__PURE__ */ jsx(StackedFocusModal.Header, {}),
12169
- /* @__PURE__ */ jsx(StackedFocusModal.Body, { className: "flex flex-1 flex-col overflow-hidden", children: /* @__PURE__ */ jsx("div", { className: "flex flex-1 flex-col items-center overflow-y-auto", children: /* @__PURE__ */ jsxs("div", { className: "flex w-full max-w-[720px] flex-col gap-y-6 py-16 px-6", children: [
12170
- /* @__PURE__ */ jsxs("div", { children: [
12171
- /* @__PURE__ */ jsx(RouteFocusModal.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Shipping" }) }),
12172
- /* @__PURE__ */ jsx(RouteFocusModal.Description, { asChild: true, children: /* @__PURE__ */ jsx(Text, { size: "small", className: "text-ui-fg-subtle", children: "Add a shipping method for the selected shipping profile. You can see the items that will be shipped using this method in the preview below." }) })
12173
- ] }),
12174
- /* @__PURE__ */ jsx(Divider, { variant: "dashed" }),
12175
- /* @__PURE__ */ jsx(
12176
- LocationField,
12177
- {
12178
- control: form.control,
12179
- setValue: form.setValue
12180
- }
12181
- ),
12182
- /* @__PURE__ */ jsx(Divider, { variant: "dashed" }),
12183
- /* @__PURE__ */ jsx(
12184
- ShippingOptionField,
12185
- {
12186
- shippingProfileId: data.shippingProfileId,
12187
- preview,
12188
- control: form.control
12189
- }
12190
- ),
12191
- /* @__PURE__ */ jsx(Divider, { variant: "dashed" }),
12192
- /* @__PURE__ */ jsx(
12193
- CustomAmountField,
12194
- {
12195
- control: form.control,
12196
- currencyCode: order.currency_code
12197
- }
12198
- ),
12199
- /* @__PURE__ */ jsx(Divider, { variant: "dashed" }),
12200
- /* @__PURE__ */ jsx(
12201
- ItemsPreview,
12202
- {
12203
- order,
12204
- shippingProfileId: data.shippingProfileId
12205
- }
12206
- )
12207
- ] }) }) }),
12208
- /* @__PURE__ */ jsx(StackedFocusModal.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex justify-end gap-x-2", children: [
12209
- /* @__PURE__ */ jsx(StackedFocusModal.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", type: "button", children: "Cancel" }) }),
12210
- /* @__PURE__ */ jsx(
12211
- Button,
12212
- {
12213
- size: "small",
12214
- type: "submit",
12215
- isLoading: isPending || isUpdatingShippingMethod,
12216
- children: data.shippingMethod ? "Update" : "Add"
12217
- }
12218
- )
12219
- ] }) })
12220
- ]
12221
- }
12222
- ) }) });
12223
- };
12224
- const shippingMethodSchema = objectType({
12225
- location_id: stringType(),
12226
- shipping_option_id: stringType(),
12227
- custom_amount: unionType([numberType(), stringType()]).optional()
12228
- });
12229
- const ItemsPreview = ({ order, shippingProfileId }) => {
12230
- const matches = order.items.filter(
12231
- (item) => {
12232
- var _a, _b, _c;
12233
- return ((_c = (_b = (_a = item.variant) == null ? void 0 : _a.product) == null ? void 0 : _b.shipping_profile) == null ? void 0 : _c.id) === shippingProfileId;
12234
- }
12235
- );
12236
- return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-y-6", children: [
12237
- /* @__PURE__ */ jsx("div", { className: "grid grid-cols-2 items-center gap-3", children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
12238
- /* @__PURE__ */ jsx(Text, { size: "small", weight: "plus", leading: "compact", children: "Items to ship" }),
12239
- /* @__PURE__ */ jsx(Text, { size: "small", className: "text-ui-fg-subtle", children: "Items with the selected shipping profile." })
12240
- ] }) }),
12241
- /* @__PURE__ */ jsxs("div", { className: "bg-ui-bg-subtle shadow-elevation-card-rest rounded-xl", children: [
12242
- /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-3 px-4 py-2 text-ui-fg-muted", children: [
12243
- /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(Text, { size: "small", weight: "plus", children: "Item" }) }),
12244
- /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(Text, { size: "small", weight: "plus", children: "Quantity" }) })
12245
- ] }),
12246
- /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-y-1.5 px-[5px] pb-[5px]", children: matches.length > 0 ? matches == null ? void 0 : matches.map((item) => /* @__PURE__ */ jsxs(
12247
- "div",
12248
- {
12249
- className: "grid grid-cols-2 gap-3 px-4 py-2 bg-ui-bg-base shadow-elevation-card-rest rounded-lg items-center",
12250
- children: [
12251
- /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-x-3", children: [
12252
- /* @__PURE__ */ jsx(
12253
- Thumbnail,
12254
- {
12255
- thumbnail: item.thumbnail,
12256
- alt: item.product_title ?? void 0
12257
- }
12258
- ),
12259
- /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
12260
- /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-x-1", children: [
12261
- /* @__PURE__ */ jsx(Text, { size: "small", weight: "plus", leading: "compact", children: item.product_title }),
12262
- /* @__PURE__ */ jsxs(
12263
- Text,
12264
- {
12265
- size: "small",
12266
- leading: "compact",
12267
- className: "text-ui-fg-subtle",
12268
- children: [
12269
- "(",
12270
- item.variant_title,
12271
- ")"
12272
- ]
12273
- }
12274
- )
12275
- ] }),
12276
- /* @__PURE__ */ jsx(
12277
- Text,
12278
- {
12279
- size: "small",
12280
- leading: "compact",
12281
- className: "text-ui-fg-subtle",
12282
- children: item.variant_sku
12283
- }
12284
- )
12285
- ] })
12286
- ] }),
12287
- /* @__PURE__ */ jsxs(
12288
- Text,
12289
- {
12290
- size: "small",
12291
- leading: "compact",
12292
- className: "text-ui-fg-subtle",
12293
- children: [
12294
- item.quantity,
12295
- "x"
12296
- ]
12297
- }
12298
- )
12299
- ]
12300
- },
12301
- item.id
12302
- )) : /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-center gap-x-3 bg-ui-bg-base rounded-lg p-4 shadow-elevation-card-rest flex-col gap-1", children: [
12303
- /* @__PURE__ */ jsx(Text, { size: "small", weight: "plus", leading: "compact", children: "No items found" }),
12304
- /* @__PURE__ */ jsxs(Text, { size: "small", className: "text-ui-fg-subtle", children: [
12305
- 'No items found for "',
12306
- query,
12307
- '".'
12308
- ] })
12309
- ] }) })
12310
- ] })
12311
- ] });
12312
- };
12313
- const LocationField = ({ control, setValue }) => {
12314
- const locations = useComboboxData({
12315
- queryKey: ["locations"],
12316
- queryFn: async (params) => {
12317
- return await sdk.admin.stockLocation.list(params);
12318
- },
12319
- getOptions: (data) => {
12320
- return data.stock_locations.map((location) => ({
12321
- label: location.name,
12322
- value: location.id
12323
- }));
12324
- }
12325
- });
12326
- return /* @__PURE__ */ jsx(
12327
- Form$2.Field,
12328
- {
12329
- control,
12330
- name: "location_id",
12331
- render: ({ field: { onChange, ...field } }) => {
12332
- return /* @__PURE__ */ jsx(Form$2.Item, { children: /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-x-3", children: [
12333
- /* @__PURE__ */ jsxs("div", { children: [
12334
- /* @__PURE__ */ jsx(Form$2.Label, { children: "Location" }),
12335
- /* @__PURE__ */ jsx(Form$2.Hint, { children: "Choose where you want to ship the items from." })
12336
- ] }),
12337
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(
12338
- Combobox,
12339
- {
12340
- options: locations.options,
12341
- fetchNextPage: locations.fetchNextPage,
12342
- isFetchingNextPage: locations.isFetchingNextPage,
12343
- searchValue: locations.searchValue,
12344
- onSearchValueChange: locations.onSearchValueChange,
12345
- placeholder: "Select location",
12346
- onChange: (value) => {
12347
- setValue("shipping_option_id", "", {
12348
- shouldDirty: true,
12349
- shouldTouch: true
12350
- });
12351
- onChange(value);
12352
- },
12353
- ...field
12354
- }
12355
- ) })
12356
- ] }) });
12357
- }
12358
- }
12359
- );
12360
- };
12361
- const ShippingOptionField = ({
12362
- shippingProfileId,
12363
- preview,
12364
- control
12365
- }) => {
12366
- var _a;
12367
- const locationId = useWatch({ control, name: "location_id" });
12368
- const shippingOptions = useComboboxData({
12369
- queryKey: ["shipping_options", locationId, shippingProfileId],
12370
- queryFn: async (params) => {
12371
- return await sdk.admin.shippingOption.list({
12372
- ...params,
12373
- stock_location_id: locationId,
12374
- shipping_profile_id: shippingProfileId
12375
- });
12376
- },
12377
- getOptions: (data) => {
12378
- return data.shipping_options.map((option) => {
12379
- var _a2;
12380
- if ((_a2 = option.rules) == null ? void 0 : _a2.find(
12381
- (r) => r.attribute === "is_return" && r.value === "true"
12382
- )) {
12383
- return void 0;
12384
- }
12385
- return {
12386
- label: option.name,
12387
- value: option.id
12388
- };
12389
- }).filter(Boolean);
12390
- },
12391
- enabled: !!locationId && !!shippingProfileId,
12392
- defaultValue: ((_a = preview.shipping_methods[0]) == null ? void 0 : _a.shipping_option_id) || void 0
12393
- });
12394
- const tooltipContent = !locationId && !shippingProfileId ? "Choose a location and shipping profile first." : !locationId ? "Choose a location first." : "Choose a shipping profile first.";
12395
- return /* @__PURE__ */ jsx(
12396
- Form$2.Field,
12397
- {
12398
- control,
12399
- name: "shipping_option_id",
12400
- render: ({ field }) => {
12401
- return /* @__PURE__ */ jsx(Form$2.Item, { children: /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-x-3", children: [
12402
- /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
12403
- /* @__PURE__ */ jsx(Form$2.Label, { children: "Shipping option" }),
12404
- /* @__PURE__ */ jsx(Form$2.Hint, { children: "Choose the shipping option to use." })
12405
- ] }),
12406
- /* @__PURE__ */ jsx(
12407
- ConditionalTooltip,
12408
- {
12409
- content: tooltipContent,
12410
- showTooltip: !locationId || !shippingProfileId,
12411
- children: /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(
12412
- Combobox,
12413
- {
12414
- options: shippingOptions.options,
12415
- fetchNextPage: shippingOptions.fetchNextPage,
12416
- isFetchingNextPage: shippingOptions.isFetchingNextPage,
12417
- searchValue: shippingOptions.searchValue,
12418
- onSearchValueChange: shippingOptions.onSearchValueChange,
12419
- placeholder: "Select shipping option",
12420
- ...field,
12421
- disabled: !locationId || !shippingProfileId
12422
- }
12423
- ) }) })
12424
- }
12425
- )
12426
- ] }) });
12427
- }
12428
- }
12429
- );
12430
- };
12431
- const CustomAmountField = ({
12432
- control,
12433
- currencyCode
12434
- }) => {
12435
- return /* @__PURE__ */ jsx(
12436
- Form$2.Field,
12437
- {
12438
- control,
12439
- name: "custom_amount",
12440
- render: ({ field: { onChange, ...field } }) => {
12441
- return /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-x-3", children: [
12442
- /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
12443
- /* @__PURE__ */ jsx(Form$2.Label, { optional: true, children: "Custom amount" }),
12444
- /* @__PURE__ */ jsx(Form$2.Hint, { children: "Set a custom amount for the shipping option." })
12445
- ] }),
12446
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(
12447
- CurrencyInput,
12448
- {
12449
- ...field,
12450
- onValueChange: (value) => onChange(value),
12451
- symbol: getNativeSymbol(currencyCode),
12452
- code: currencyCode
12453
- }
12454
- ) })
12455
- ] });
12456
- }
12457
- }
12458
- );
12459
- };
12460
- const TransferOwnership = () => {
12461
- const { id } = useParams();
12462
- const { draft_order, isPending, isError, error } = useDraftOrder(id, {
12463
- fields: "id,customer_id,customer.*"
12464
- });
12465
- if (isError) {
12466
- throw error;
12467
- }
12468
- const isReady = !isPending && !!draft_order;
12469
- return /* @__PURE__ */ jsxs(RouteDrawer, { children: [
12470
- /* @__PURE__ */ jsxs(RouteDrawer.Header, { children: [
12471
- /* @__PURE__ */ jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Transfer Ownership" }) }),
12472
- /* @__PURE__ */ jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Transfer the ownership of this draft order to a new customer" }) })
12473
- ] }),
12474
- isReady && /* @__PURE__ */ jsx(TransferOwnershipForm, { order: draft_order })
12475
- ] });
12476
- };
12477
- const TransferOwnershipForm = ({ order }) => {
12478
- var _a, _b;
12479
- const form = useForm({
12480
- defaultValues: {
12481
- customer_id: order.customer_id || ""
12482
- },
12483
- resolver: zodResolver(schema$1)
12484
- });
12485
- const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
12486
- const { handleSuccess } = useRouteModal();
12487
- const name = [(_a = order.customer) == null ? void 0 : _a.first_name, (_b = order.customer) == null ? void 0 : _b.last_name].filter(Boolean).join(" ");
12488
- const currentCustomer = order.customer ? {
12489
- label: name ? `${name} (${order.customer.email})` : order.customer.email,
12490
- value: order.customer.id
12491
- } : null;
12492
- const onSubmit = form.handleSubmit(async (data) => {
12493
- await mutateAsync(
12494
- { customer_id: data.customer_id },
12495
- {
12496
- onSuccess: () => {
12497
- toast.success("Customer updated");
12498
- handleSuccess();
12499
- },
12500
- onError: (error) => {
12501
- toast.error(error.message);
12502
- }
12503
- }
12504
- );
12505
- });
12506
- return /* @__PURE__ */ jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxs(
12507
- KeyboundForm,
12508
- {
12509
- className: "flex flex-1 flex-col overflow-hidden",
12510
- onSubmit,
12511
- children: [
12512
- /* @__PURE__ */ jsxs(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: [
12513
- /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center bg-ui-bg-component rounded-md border", children: /* @__PURE__ */ jsx(Illustration, {}) }),
12514
- currentCustomer && /* @__PURE__ */ jsxs("div", { className: "flex flex-col space-y-3", children: [
12515
- /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
12516
- /* @__PURE__ */ jsx(Label$1, { size: "small", weight: "plus", htmlFor: "current-customer", children: "Current owner" }),
12517
- /* @__PURE__ */ jsx(Hint$1, { children: "The customer that is currently associated with this draft order." })
12518
- ] }),
12519
- /* @__PURE__ */ jsxs(Select, { disabled: true, value: currentCustomer.value, children: [
12520
- /* @__PURE__ */ jsx(Select.Trigger, { id: "current-customer", children: /* @__PURE__ */ jsx(Select.Value, {}) }),
12521
- /* @__PURE__ */ jsx(Select.Content, { children: /* @__PURE__ */ jsx(Select.Item, { value: currentCustomer.value, children: currentCustomer.label }) })
12522
- ] })
12523
- ] }),
12524
- /* @__PURE__ */ jsx(
12525
- CustomerField,
12526
- {
12527
- control: form.control,
12528
- currentCustomerId: order.customer_id
12529
- }
12530
- )
12531
- ] }),
12532
- /* @__PURE__ */ jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
12533
- /* @__PURE__ */ jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { variant: "secondary", size: "small", children: "Cancel" }) }),
12534
- /* @__PURE__ */ jsx(Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
12535
- ] }) })
12536
- ]
12537
- }
12538
- ) });
12539
- };
12540
- const CustomerField = ({ control, currentCustomerId }) => {
12541
- const customers = useComboboxData({
12542
- queryFn: async (params) => {
12543
- return await sdk.admin.customer.list({
12544
- ...params,
12545
- id: currentCustomerId ? { $nin: [currentCustomerId] } : void 0
12546
- });
12547
- },
12548
- queryKey: ["customers"],
12549
- getOptions: (data) => {
12550
- return data.customers.map((customer) => {
12551
- const name = [customer.first_name, customer.last_name].filter(Boolean).join(" ");
12552
- return {
12553
- label: name ? `${name} (${customer.email})` : customer.email,
12554
- value: customer.id
12555
- };
12556
- });
12557
- }
12558
- });
12559
- return /* @__PURE__ */ jsx(
12560
- Form$2.Field,
12561
- {
12562
- name: "customer_id",
12563
- control,
12564
- render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { className: "space-y-3", children: [
12565
- /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
12566
- /* @__PURE__ */ jsx(Form$2.Label, { children: "New customer" }),
12567
- /* @__PURE__ */ jsx(Form$2.Hint, { children: "The customer to transfer this draft order to." })
12568
- ] }),
12569
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(
12570
- Combobox,
12571
- {
12572
- options: customers.options,
12573
- fetchNextPage: customers.fetchNextPage,
12574
- isFetchingNextPage: customers.isFetchingNextPage,
12575
- searchValue: customers.searchValue,
12576
- onSearchValueChange: customers.onSearchValueChange,
12577
- placeholder: "Select customer",
12578
- ...field
12579
- }
12580
- ) }),
12581
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
12582
- ] })
12583
- }
12584
- );
12585
- };
12586
- const Illustration = () => {
12587
- return /* @__PURE__ */ jsxs(
12588
- "svg",
12589
- {
12590
- width: "280",
12591
- height: "180",
12592
- viewBox: "0 0 280 180",
12593
- fill: "none",
12594
- xmlns: "http://www.w3.org/2000/svg",
11699
+ width: "280",
11700
+ height: "180",
11701
+ viewBox: "0 0 280 180",
11702
+ fill: "none",
11703
+ xmlns: "http://www.w3.org/2000/svg",
12595
11704
  children: [
12596
11705
  /* @__PURE__ */ jsx(
12597
11706
  "rect",
@@ -12869,97 +11978,908 @@ const Illustration = () => {
12869
11978
  strokeLinecap: "round",
12870
11979
  strokeLinejoin: "round"
12871
11980
  }
12872
- ) }),
12873
- /* @__PURE__ */ jsxs("defs", { children: [
12874
- /* @__PURE__ */ jsx("clipPath", { id: "clip0_20915_38670", children: /* @__PURE__ */ jsx(
12875
- "rect",
11981
+ ) }),
11982
+ /* @__PURE__ */ jsxs("defs", { children: [
11983
+ /* @__PURE__ */ jsx("clipPath", { id: "clip0_20915_38670", children: /* @__PURE__ */ jsx(
11984
+ "rect",
11985
+ {
11986
+ width: "12",
11987
+ height: "12",
11988
+ fill: "white",
11989
+ transform: "matrix(0.865865 0.500278 -0.871576 0.490261 138.36 74.6508)"
11990
+ }
11991
+ ) }),
11992
+ /* @__PURE__ */ jsx("clipPath", { id: "clip1_20915_38670", children: /* @__PURE__ */ jsx(
11993
+ "rect",
11994
+ {
11995
+ width: "12",
11996
+ height: "12",
11997
+ fill: "white",
11998
+ transform: "matrix(0.865865 0.500278 -0.871576 0.490261 148.75 80.6541)"
11999
+ }
12000
+ ) }),
12001
+ /* @__PURE__ */ jsx("clipPath", { id: "clip2_20915_38670", children: /* @__PURE__ */ jsx(
12002
+ "rect",
12003
+ {
12004
+ width: "12",
12005
+ height: "12",
12006
+ fill: "white",
12007
+ transform: "matrix(0.865865 0.500278 -0.871576 0.490261 159.141 86.6575)"
12008
+ }
12009
+ ) }),
12010
+ /* @__PURE__ */ jsx("clipPath", { id: "clip3_20915_38670", children: /* @__PURE__ */ jsx(
12011
+ "rect",
12012
+ {
12013
+ width: "12",
12014
+ height: "12",
12015
+ fill: "white",
12016
+ transform: "matrix(0.865865 0.500278 -0.871576 0.490261 120.928 84.4561)"
12017
+ }
12018
+ ) }),
12019
+ /* @__PURE__ */ jsx("clipPath", { id: "clip4_20915_38670", children: /* @__PURE__ */ jsx(
12020
+ "rect",
12021
+ {
12022
+ width: "12",
12023
+ height: "12",
12024
+ fill: "white",
12025
+ transform: "matrix(0.865865 0.500278 -0.871576 0.490261 131.318 90.4594)"
12026
+ }
12027
+ ) }),
12028
+ /* @__PURE__ */ jsx("clipPath", { id: "clip5_20915_38670", children: /* @__PURE__ */ jsx(
12029
+ "rect",
12030
+ {
12031
+ width: "12",
12032
+ height: "12",
12033
+ fill: "white",
12034
+ transform: "matrix(0.865865 0.500278 -0.871576 0.490261 141.709 96.4627)"
12035
+ }
12036
+ ) })
12037
+ ] })
12038
+ ]
12039
+ }
12040
+ );
12041
+ };
12042
+ const schema$1 = objectType({
12043
+ customer_id: stringType().min(1)
12044
+ });
12045
+ const STACKED_FOCUS_MODAL_ID = "shipping-form";
12046
+ const Shipping = () => {
12047
+ var _a;
12048
+ const { id } = useParams();
12049
+ const { order, isPending, isError, error } = useOrder(id, {
12050
+ fields: "+items.*,+items.variant.*,+items.variant.product.*,+items.variant.product.shipping_profile.*,+currency_code"
12051
+ });
12052
+ const {
12053
+ order: preview,
12054
+ isPending: isPreviewPending,
12055
+ isError: isPreviewError,
12056
+ error: previewError
12057
+ } = useOrderPreview(id);
12058
+ useInitiateOrderEdit({ preview });
12059
+ const { onCancel } = useCancelOrderEdit({ preview });
12060
+ if (isError) {
12061
+ throw error;
12062
+ }
12063
+ if (isPreviewError) {
12064
+ throw previewError;
12065
+ }
12066
+ const orderHasItems = (((_a = order == null ? void 0 : order.items) == null ? void 0 : _a.length) || 0) > 0;
12067
+ const isReady = preview && !isPreviewPending && order && !isPending;
12068
+ return /* @__PURE__ */ jsx(RouteFocusModal, { onClose: onCancel, children: !orderHasItems ? /* @__PURE__ */ jsxs("div", { className: "flex h-full flex-col overflow-hidden ", children: [
12069
+ /* @__PURE__ */ jsx(RouteFocusModal.Header, {}),
12070
+ /* @__PURE__ */ jsx(RouteFocusModal.Body, { className: "flex flex-1 flex-col overflow-hidden", children: /* @__PURE__ */ jsx("div", { className: "flex flex-1 flex-col items-center overflow-y-auto", children: /* @__PURE__ */ jsxs("div", { className: "flex w-full max-w-[720px] flex-col gap-y-6 py-16 px-6", children: [
12071
+ /* @__PURE__ */ jsx(RouteFocusModal.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Shipping" }) }),
12072
+ /* @__PURE__ */ jsx(RouteFocusModal.Description, { asChild: true, children: /* @__PURE__ */ jsx(Text, { size: "small", className: "text-ui-fg-subtle", children: "This draft order currently has no items. Add items to the order before adding shipping." }) })
12073
+ ] }) }) }),
12074
+ /* @__PURE__ */ jsx(RouteFocusModal.Footer, { children: /* @__PURE__ */ jsx(RouteFocusModal.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", type: "button", children: "Cancel" }) }) })
12075
+ ] }) : isReady ? /* @__PURE__ */ jsx(ShippingForm, { preview, order }) : /* @__PURE__ */ jsxs("div", { children: [
12076
+ /* @__PURE__ */ jsx(RouteFocusModal.Title, { asChild: true, children: /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Edit Shipping" }) }),
12077
+ /* @__PURE__ */ jsx(RouteFocusModal.Description, { asChild: true, children: /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Loading data for the draft order, please wait..." }) })
12078
+ ] }) });
12079
+ };
12080
+ const ShippingForm = ({ preview, order }) => {
12081
+ var _a;
12082
+ const { setIsOpen } = useStackedModal();
12083
+ const [isSubmitting, setIsSubmitting] = useState(false);
12084
+ const [data, setData] = useState(null);
12085
+ const appliedShippingOptionIds = (_a = preview.shipping_methods) == null ? void 0 : _a.map((method) => method.shipping_option_id).filter(Boolean);
12086
+ const { shipping_options } = useShippingOptions(
12087
+ {
12088
+ id: appliedShippingOptionIds,
12089
+ fields: "+service_zone.*,+service_zone.fulfillment_set.*,+service_zone.fulfillment_set.location.*"
12090
+ },
12091
+ {
12092
+ enabled: appliedShippingOptionIds.length > 0
12093
+ }
12094
+ );
12095
+ const uniqueShippingProfiles = useMemo(() => {
12096
+ const profiles = /* @__PURE__ */ new Map();
12097
+ getUniqueShippingProfiles(order.items).forEach((profile) => {
12098
+ profiles.set(profile.id, profile);
12099
+ });
12100
+ shipping_options == null ? void 0 : shipping_options.forEach((option) => {
12101
+ profiles.set(option.shipping_profile_id, option.shipping_profile);
12102
+ });
12103
+ return Array.from(profiles.values());
12104
+ }, [order.items, shipping_options]);
12105
+ const { handleSuccess } = useRouteModal();
12106
+ const { mutateAsync: confirmOrderEdit } = useDraftOrderConfirmEdit(preview.id);
12107
+ const { mutateAsync: requestOrderEdit } = useDraftOrderRequestEdit(preview.id);
12108
+ const { mutateAsync: removeShippingMethod } = useDraftOrderRemoveShippingMethod(preview.id);
12109
+ const { mutateAsync: removeActionShippingMethod } = useDraftOrderRemoveActionShippingMethod(preview.id);
12110
+ const onSubmit = async () => {
12111
+ setIsSubmitting(true);
12112
+ let requestSucceeded = false;
12113
+ await requestOrderEdit(void 0, {
12114
+ onError: (e) => {
12115
+ toast.error(`Failed to request order edit: ${e.message}`);
12116
+ },
12117
+ onSuccess: () => {
12118
+ requestSucceeded = true;
12119
+ }
12120
+ });
12121
+ if (!requestSucceeded) {
12122
+ setIsSubmitting(false);
12123
+ return;
12124
+ }
12125
+ await confirmOrderEdit(void 0, {
12126
+ onError: (e) => {
12127
+ toast.error(`Failed to confirm order edit: ${e.message}`);
12128
+ },
12129
+ onSuccess: () => {
12130
+ handleSuccess();
12131
+ },
12132
+ onSettled: () => {
12133
+ setIsSubmitting(false);
12134
+ }
12135
+ });
12136
+ };
12137
+ const onKeydown = useCallback(
12138
+ (e) => {
12139
+ if (e.key === "Enter" && (e.ctrlKey || e.metaKey)) {
12140
+ if (data || isSubmitting) {
12141
+ return;
12142
+ }
12143
+ onSubmit();
12144
+ }
12145
+ },
12146
+ [data, isSubmitting, onSubmit]
12147
+ );
12148
+ useEffect(() => {
12149
+ document.addEventListener("keydown", onKeydown);
12150
+ return () => {
12151
+ document.removeEventListener("keydown", onKeydown);
12152
+ };
12153
+ }, [onKeydown]);
12154
+ return /* @__PURE__ */ jsxs("div", { className: "flex h-full flex-col overflow-hidden", children: [
12155
+ /* @__PURE__ */ jsx(RouteFocusModal.Header, {}),
12156
+ /* @__PURE__ */ jsxs(RouteFocusModal.Body, { className: "flex flex-1 flex-col overflow-hidden", children: [
12157
+ /* @__PURE__ */ jsx("div", { className: "flex flex-1 flex-col items-center overflow-y-auto", children: /* @__PURE__ */ jsxs("div", { className: "flex w-full max-w-[720px] flex-col gap-y-6 py-16 px-6", children: [
12158
+ /* @__PURE__ */ jsxs("div", { children: [
12159
+ /* @__PURE__ */ jsx(RouteFocusModal.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Shipping" }) }),
12160
+ /* @__PURE__ */ jsx(RouteFocusModal.Description, { asChild: true, children: /* @__PURE__ */ jsx(Text, { size: "small", className: "text-ui-fg-subtle", children: "Choose which shipping method(s) to use for the items in the order." }) })
12161
+ ] }),
12162
+ /* @__PURE__ */ jsx(Divider, { variant: "dashed" }),
12163
+ /* @__PURE__ */ jsx(Accordion.Root, { type: "multiple", children: /* @__PURE__ */ jsxs("div", { className: "bg-ui-bg-subtle rounded-xl shadow-elevation-card-rest", children: [
12164
+ /* @__PURE__ */ jsxs("div", { className: "px-4 py-2 flex items-center justify-between", children: [
12165
+ /* @__PURE__ */ jsx(
12166
+ Text,
12167
+ {
12168
+ size: "xsmall",
12169
+ weight: "plus",
12170
+ className: "text-ui-fg-muted",
12171
+ children: "Shipping profile"
12172
+ }
12173
+ ),
12174
+ /* @__PURE__ */ jsx(
12175
+ Text,
12176
+ {
12177
+ size: "xsmall",
12178
+ weight: "plus",
12179
+ className: "text-ui-fg-muted",
12180
+ children: "Action"
12181
+ }
12182
+ )
12183
+ ] }),
12184
+ /* @__PURE__ */ jsx("div", { className: "px-[5px] pb-[5px]", children: uniqueShippingProfiles.map((profile) => {
12185
+ var _a2, _b, _c, _d, _e, _f, _g;
12186
+ const items = getItemsWithShippingProfile(
12187
+ profile.id,
12188
+ order.items
12189
+ );
12190
+ const hasItems = items.length > 0;
12191
+ const shippingOption = shipping_options == null ? void 0 : shipping_options.find(
12192
+ (option) => option.shipping_profile_id === profile.id
12193
+ );
12194
+ const shippingMethod = preview.shipping_methods.find(
12195
+ (method) => method.shipping_option_id === (shippingOption == null ? void 0 : shippingOption.id)
12196
+ );
12197
+ const addShippingMethodAction = (_a2 = shippingMethod == null ? void 0 : shippingMethod.actions) == null ? void 0 : _a2.find(
12198
+ (action) => action.action === "SHIPPING_ADD"
12199
+ );
12200
+ return /* @__PURE__ */ jsxs(
12201
+ Accordion.Item,
12202
+ {
12203
+ value: profile.id,
12204
+ className: "bg-ui-bg-base shadow-elevation-card-rest rounded-lg",
12205
+ children: [
12206
+ /* @__PURE__ */ jsxs("div", { className: "px-3 py-2 flex items-center justify-between gap-3", children: [
12207
+ /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-x-3 w-full overflow-hidden", children: [
12208
+ /* @__PURE__ */ jsx(Accordion.Trigger, { asChild: true, children: /* @__PURE__ */ jsx(
12209
+ IconButton,
12210
+ {
12211
+ size: "2xsmall",
12212
+ variant: "transparent",
12213
+ className: "group/trigger",
12214
+ disabled: !hasItems,
12215
+ children: /* @__PURE__ */ jsx(TriangleRightMini, { className: "group-data-[state=open]/trigger:rotate-90 transition-transform" })
12216
+ }
12217
+ ) }),
12218
+ !shippingOption ? /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-x-3", children: [
12219
+ /* @__PURE__ */ jsx("div", { className: "size-7 rounded-md shadow-borders-base flex items-center justify-center", children: /* @__PURE__ */ jsx("div", { className: "size-6 rounded bg-ui-bg-component-hover flex items-center justify-center", children: /* @__PURE__ */ jsx(Shopping, { className: "text-ui-fg-subtle" }) }) }),
12220
+ /* @__PURE__ */ jsxs("div", { className: "flex flex-col flex-1", children: [
12221
+ /* @__PURE__ */ jsx(
12222
+ Text,
12223
+ {
12224
+ size: "small",
12225
+ weight: "plus",
12226
+ leading: "compact",
12227
+ children: profile.name
12228
+ }
12229
+ ),
12230
+ /* @__PURE__ */ jsxs(
12231
+ Text,
12232
+ {
12233
+ size: "small",
12234
+ leading: "compact",
12235
+ className: "text-ui-fg-subtle",
12236
+ children: [
12237
+ items.length,
12238
+ " ",
12239
+ pluralize(items.length, "items", "item")
12240
+ ]
12241
+ }
12242
+ )
12243
+ ] })
12244
+ ] }) : /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-[5px] max-sm:flex-col max-sm:items-start flex-1 w-full overflow-hidden", children: [
12245
+ /* @__PURE__ */ jsx(
12246
+ Tooltip,
12247
+ {
12248
+ content: /* @__PURE__ */ jsx("ul", { children: items.map((item) => {
12249
+ var _a3, _b2, _c2;
12250
+ return /* @__PURE__ */ jsx(
12251
+ "li",
12252
+ {
12253
+ children: `${item.quantity}x ${(_b2 = (_a3 = item.variant) == null ? void 0 : _a3.product) == null ? void 0 : _b2.title} (${(_c2 = item.variant) == null ? void 0 : _c2.title})`
12254
+ },
12255
+ item.id
12256
+ );
12257
+ }) }),
12258
+ children: /* @__PURE__ */ jsxs(
12259
+ Badge,
12260
+ {
12261
+ className: "flex items-center gap-x-[3px] overflow-hidden cursor-default",
12262
+ size: "xsmall",
12263
+ children: [
12264
+ /* @__PURE__ */ jsx(Shopping, { className: "shrink-0" }),
12265
+ /* @__PURE__ */ jsxs("span", { className: "truncate", children: [
12266
+ items.reduce(
12267
+ (acc, item) => acc + item.quantity,
12268
+ 0
12269
+ ),
12270
+ "x",
12271
+ " ",
12272
+ pluralize(items.length, "items", "item")
12273
+ ] })
12274
+ ]
12275
+ }
12276
+ )
12277
+ }
12278
+ ),
12279
+ /* @__PURE__ */ jsx(
12280
+ Tooltip,
12281
+ {
12282
+ content: (_d = (_c = (_b = shippingOption.service_zone) == null ? void 0 : _b.fulfillment_set) == null ? void 0 : _c.location) == null ? void 0 : _d.name,
12283
+ children: /* @__PURE__ */ jsxs(
12284
+ Badge,
12285
+ {
12286
+ className: "flex items-center gap-x-[3px] overflow-hidden cursor-default",
12287
+ size: "xsmall",
12288
+ children: [
12289
+ /* @__PURE__ */ jsx(Buildings, { className: "shrink-0" }),
12290
+ /* @__PURE__ */ jsx("span", { className: "truncate", children: (_g = (_f = (_e = shippingOption.service_zone) == null ? void 0 : _e.fulfillment_set) == null ? void 0 : _f.location) == null ? void 0 : _g.name })
12291
+ ]
12292
+ }
12293
+ )
12294
+ }
12295
+ ),
12296
+ /* @__PURE__ */ jsx(Tooltip, { content: shippingOption.name, children: /* @__PURE__ */ jsxs(
12297
+ Badge,
12298
+ {
12299
+ className: "flex items-center gap-x-[3px] overflow-hidden cursor-default",
12300
+ size: "xsmall",
12301
+ children: [
12302
+ /* @__PURE__ */ jsx(TruckFast, { className: "shrink-0" }),
12303
+ /* @__PURE__ */ jsx("span", { className: "truncate", children: shippingOption.name })
12304
+ ]
12305
+ }
12306
+ ) })
12307
+ ] })
12308
+ ] }),
12309
+ shippingOption ? /* @__PURE__ */ jsx(
12310
+ ActionMenu,
12311
+ {
12312
+ groups: [
12313
+ {
12314
+ actions: [
12315
+ hasItems ? {
12316
+ label: "Edit shipping option",
12317
+ icon: /* @__PURE__ */ jsx(Channels, {}),
12318
+ onClick: () => {
12319
+ setIsOpen(
12320
+ STACKED_FOCUS_MODAL_ID,
12321
+ true
12322
+ );
12323
+ setData({
12324
+ shippingProfileId: profile.id,
12325
+ shippingOption,
12326
+ shippingMethod
12327
+ });
12328
+ }
12329
+ } : void 0,
12330
+ {
12331
+ label: "Remove shipping option",
12332
+ icon: /* @__PURE__ */ jsx(Trash, {}),
12333
+ onClick: () => {
12334
+ if (shippingMethod) {
12335
+ if (addShippingMethodAction) {
12336
+ removeActionShippingMethod(
12337
+ addShippingMethodAction.id
12338
+ );
12339
+ } else {
12340
+ removeShippingMethod(
12341
+ shippingMethod.id
12342
+ );
12343
+ }
12344
+ }
12345
+ }
12346
+ }
12347
+ ].filter(Boolean)
12348
+ }
12349
+ ]
12350
+ }
12351
+ ) : /* @__PURE__ */ jsx(
12352
+ StackedModalTrigger,
12353
+ {
12354
+ shippingProfileId: profile.id,
12355
+ shippingOption,
12356
+ shippingMethod,
12357
+ setData,
12358
+ children: "Add shipping option"
12359
+ }
12360
+ )
12361
+ ] }),
12362
+ /* @__PURE__ */ jsxs(Accordion.Content, { children: [
12363
+ /* @__PURE__ */ jsx(Divider, { variant: "dashed" }),
12364
+ items.map((item, idx) => {
12365
+ var _a3, _b2, _c2, _d2, _e2;
12366
+ return /* @__PURE__ */ jsxs("div", { children: [
12367
+ /* @__PURE__ */ jsxs(
12368
+ "div",
12369
+ {
12370
+ className: "px-3 flex items-center gap-x-3",
12371
+ children: [
12372
+ /* @__PURE__ */ jsx("div", { className: "w-5 h-[56px] flex flex-col justify-center items-center", children: /* @__PURE__ */ jsx(
12373
+ Divider,
12374
+ {
12375
+ variant: "dashed",
12376
+ orientation: "vertical"
12377
+ }
12378
+ ) }),
12379
+ /* @__PURE__ */ jsxs("div", { className: "py-2 flex items-center gap-x-3", children: [
12380
+ /* @__PURE__ */ jsx("div", { className: "size-7 flex items-center justify-center tabular-nums", children: /* @__PURE__ */ jsxs(
12381
+ Text,
12382
+ {
12383
+ size: "small",
12384
+ leading: "compact",
12385
+ className: "text-ui-fg-subtle",
12386
+ children: [
12387
+ item.quantity,
12388
+ "x"
12389
+ ]
12390
+ }
12391
+ ) }),
12392
+ /* @__PURE__ */ jsx(Thumbnail, { thumbnail: item.thumbnail }),
12393
+ /* @__PURE__ */ jsxs("div", { children: [
12394
+ /* @__PURE__ */ jsxs(
12395
+ Text,
12396
+ {
12397
+ size: "small",
12398
+ leading: "compact",
12399
+ weight: "plus",
12400
+ children: [
12401
+ (_b2 = (_a3 = item.variant) == null ? void 0 : _a3.product) == null ? void 0 : _b2.title,
12402
+ " (",
12403
+ (_c2 = item.variant) == null ? void 0 : _c2.title,
12404
+ ")"
12405
+ ]
12406
+ }
12407
+ ),
12408
+ /* @__PURE__ */ jsx(
12409
+ Text,
12410
+ {
12411
+ size: "small",
12412
+ leading: "compact",
12413
+ className: "text-ui-fg-subtle",
12414
+ children: (_e2 = (_d2 = item.variant) == null ? void 0 : _d2.options) == null ? void 0 : _e2.map((option) => option.value).join(" · ")
12415
+ }
12416
+ )
12417
+ ] })
12418
+ ] })
12419
+ ]
12420
+ },
12421
+ item.id
12422
+ ),
12423
+ idx !== items.length - 1 && /* @__PURE__ */ jsx(Divider, { variant: "dashed" })
12424
+ ] }, item.id);
12425
+ })
12426
+ ] })
12427
+ ]
12428
+ },
12429
+ profile.id
12430
+ );
12431
+ }) })
12432
+ ] }) })
12433
+ ] }) }),
12434
+ /* @__PURE__ */ jsx(
12435
+ StackedFocusModal,
12436
+ {
12437
+ id: STACKED_FOCUS_MODAL_ID,
12438
+ onOpenChangeCallback: (open) => {
12439
+ if (!open) {
12440
+ setData(null);
12441
+ }
12442
+ return open;
12443
+ },
12444
+ children: data && /* @__PURE__ */ jsx(ShippingProfileForm, { data, order, preview })
12445
+ }
12446
+ )
12447
+ ] }),
12448
+ /* @__PURE__ */ jsx(RouteFocusModal.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex justify-end gap-x-2", children: [
12449
+ /* @__PURE__ */ jsx(RouteFocusModal.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", type: "button", children: "Cancel" }) }),
12450
+ /* @__PURE__ */ jsx(
12451
+ Button,
12452
+ {
12453
+ size: "small",
12454
+ type: "button",
12455
+ isLoading: isSubmitting,
12456
+ onClick: onSubmit,
12457
+ children: "Save"
12458
+ }
12459
+ )
12460
+ ] }) })
12461
+ ] });
12462
+ };
12463
+ const StackedModalTrigger = ({
12464
+ shippingProfileId,
12465
+ shippingOption,
12466
+ shippingMethod,
12467
+ setData,
12468
+ children
12469
+ }) => {
12470
+ const { setIsOpen, getIsOpen } = useStackedModal();
12471
+ const isOpen = getIsOpen(STACKED_FOCUS_MODAL_ID);
12472
+ const onToggle = () => {
12473
+ if (isOpen) {
12474
+ setIsOpen(STACKED_FOCUS_MODAL_ID, false);
12475
+ setData(null);
12476
+ } else {
12477
+ setIsOpen(STACKED_FOCUS_MODAL_ID, true);
12478
+ setData({
12479
+ shippingProfileId,
12480
+ shippingOption,
12481
+ shippingMethod
12482
+ });
12483
+ }
12484
+ };
12485
+ return /* @__PURE__ */ jsx(
12486
+ Button,
12487
+ {
12488
+ size: "small",
12489
+ variant: "secondary",
12490
+ onClick: onToggle,
12491
+ className: "text-ui-fg-primary shrink-0",
12492
+ children
12493
+ }
12494
+ );
12495
+ };
12496
+ const ShippingProfileForm = ({
12497
+ data,
12498
+ order,
12499
+ preview
12500
+ }) => {
12501
+ var _a, _b, _c, _d, _e, _f;
12502
+ const { setIsOpen } = useStackedModal();
12503
+ const form = useForm({
12504
+ resolver: zodResolver(shippingMethodSchema),
12505
+ defaultValues: {
12506
+ location_id: (_d = (_c = (_b = (_a = data.shippingOption) == null ? void 0 : _a.service_zone) == null ? void 0 : _b.fulfillment_set) == null ? void 0 : _c.location) == null ? void 0 : _d.id,
12507
+ shipping_option_id: (_e = data.shippingOption) == null ? void 0 : _e.id,
12508
+ custom_amount: (_f = data.shippingMethod) == null ? void 0 : _f.amount
12509
+ }
12510
+ });
12511
+ const { mutateAsync: addShippingMethod, isPending } = useDraftOrderAddShippingMethod(order.id);
12512
+ const {
12513
+ mutateAsync: updateShippingMethod,
12514
+ isPending: isUpdatingShippingMethod
12515
+ } = useDraftOrderUpdateShippingMethod(order.id);
12516
+ const onSubmit = form.handleSubmit(async (values) => {
12517
+ if (isEqual(values, form.formState.defaultValues)) {
12518
+ setIsOpen(STACKED_FOCUS_MODAL_ID, false);
12519
+ return;
12520
+ }
12521
+ if (data.shippingMethod) {
12522
+ await updateShippingMethod(
12523
+ {
12524
+ method_id: data.shippingMethod.id,
12525
+ shipping_option_id: values.shipping_option_id,
12526
+ custom_amount: values.custom_amount ? convertNumber(values.custom_amount) : void 0
12527
+ },
12528
+ {
12529
+ onError: (e) => {
12530
+ toast.error(e.message);
12531
+ },
12532
+ onSuccess: () => {
12533
+ setIsOpen(STACKED_FOCUS_MODAL_ID, false);
12534
+ }
12535
+ }
12536
+ );
12537
+ return;
12538
+ }
12539
+ await addShippingMethod(
12540
+ {
12541
+ shipping_option_id: values.shipping_option_id,
12542
+ custom_amount: values.custom_amount ? convertNumber(values.custom_amount) : void 0
12543
+ },
12544
+ {
12545
+ onError: (e) => {
12546
+ toast.error(e.message);
12547
+ },
12548
+ onSuccess: () => {
12549
+ setIsOpen(STACKED_FOCUS_MODAL_ID, false);
12550
+ }
12551
+ }
12552
+ );
12553
+ });
12554
+ return /* @__PURE__ */ jsx(StackedFocusModal.Content, { children: /* @__PURE__ */ jsx(Form$2, { ...form, children: /* @__PURE__ */ jsxs(
12555
+ KeyboundForm,
12556
+ {
12557
+ className: "flex h-full flex-col overflow-hidden",
12558
+ onSubmit,
12559
+ children: [
12560
+ /* @__PURE__ */ jsx(StackedFocusModal.Header, {}),
12561
+ /* @__PURE__ */ jsx(StackedFocusModal.Body, { className: "flex flex-1 flex-col overflow-hidden", children: /* @__PURE__ */ jsx("div", { className: "flex flex-1 flex-col items-center overflow-y-auto", children: /* @__PURE__ */ jsxs("div", { className: "flex w-full max-w-[720px] flex-col gap-y-6 py-16 px-6", children: [
12562
+ /* @__PURE__ */ jsxs("div", { children: [
12563
+ /* @__PURE__ */ jsx(RouteFocusModal.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Shipping" }) }),
12564
+ /* @__PURE__ */ jsx(RouteFocusModal.Description, { asChild: true, children: /* @__PURE__ */ jsx(Text, { size: "small", className: "text-ui-fg-subtle", children: "Add a shipping method for the selected shipping profile. You can see the items that will be shipped using this method in the preview below." }) })
12565
+ ] }),
12566
+ /* @__PURE__ */ jsx(Divider, { variant: "dashed" }),
12567
+ /* @__PURE__ */ jsx(
12568
+ LocationField,
12876
12569
  {
12877
- width: "12",
12878
- height: "12",
12879
- fill: "white",
12880
- transform: "matrix(0.865865 0.500278 -0.871576 0.490261 138.36 74.6508)"
12570
+ control: form.control,
12571
+ setValue: form.setValue
12881
12572
  }
12882
- ) }),
12883
- /* @__PURE__ */ jsx("clipPath", { id: "clip1_20915_38670", children: /* @__PURE__ */ jsx(
12884
- "rect",
12573
+ ),
12574
+ /* @__PURE__ */ jsx(Divider, { variant: "dashed" }),
12575
+ /* @__PURE__ */ jsx(
12576
+ ShippingOptionField,
12885
12577
  {
12886
- width: "12",
12887
- height: "12",
12888
- fill: "white",
12889
- transform: "matrix(0.865865 0.500278 -0.871576 0.490261 148.75 80.6541)"
12578
+ shippingProfileId: data.shippingProfileId,
12579
+ preview,
12580
+ control: form.control
12581
+ }
12582
+ ),
12583
+ /* @__PURE__ */ jsx(Divider, { variant: "dashed" }),
12584
+ /* @__PURE__ */ jsx(
12585
+ CustomAmountField,
12586
+ {
12587
+ control: form.control,
12588
+ currencyCode: order.currency_code
12589
+ }
12590
+ ),
12591
+ /* @__PURE__ */ jsx(Divider, { variant: "dashed" }),
12592
+ /* @__PURE__ */ jsx(
12593
+ ItemsPreview,
12594
+ {
12595
+ order,
12596
+ shippingProfileId: data.shippingProfileId
12890
12597
  }
12891
- ) }),
12892
- /* @__PURE__ */ jsx("clipPath", { id: "clip2_20915_38670", children: /* @__PURE__ */ jsx(
12893
- "rect",
12598
+ )
12599
+ ] }) }) }),
12600
+ /* @__PURE__ */ jsx(StackedFocusModal.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex justify-end gap-x-2", children: [
12601
+ /* @__PURE__ */ jsx(StackedFocusModal.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", type: "button", children: "Cancel" }) }),
12602
+ /* @__PURE__ */ jsx(
12603
+ Button,
12894
12604
  {
12895
- width: "12",
12896
- height: "12",
12897
- fill: "white",
12898
- transform: "matrix(0.865865 0.500278 -0.871576 0.490261 159.141 86.6575)"
12605
+ size: "small",
12606
+ type: "submit",
12607
+ isLoading: isPending || isUpdatingShippingMethod,
12608
+ children: data.shippingMethod ? "Update" : "Add"
12899
12609
  }
12900
- ) }),
12901
- /* @__PURE__ */ jsx("clipPath", { id: "clip3_20915_38670", children: /* @__PURE__ */ jsx(
12902
- "rect",
12610
+ )
12611
+ ] }) })
12612
+ ]
12613
+ }
12614
+ ) }) });
12615
+ };
12616
+ const shippingMethodSchema = objectType({
12617
+ location_id: stringType(),
12618
+ shipping_option_id: stringType(),
12619
+ custom_amount: unionType([numberType(), stringType()]).optional()
12620
+ });
12621
+ const ItemsPreview = ({ order, shippingProfileId }) => {
12622
+ const matches = order.items.filter(
12623
+ (item) => {
12624
+ var _a, _b, _c;
12625
+ return ((_c = (_b = (_a = item.variant) == null ? void 0 : _a.product) == null ? void 0 : _b.shipping_profile) == null ? void 0 : _c.id) === shippingProfileId;
12626
+ }
12627
+ );
12628
+ return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-y-6", children: [
12629
+ /* @__PURE__ */ jsx("div", { className: "grid grid-cols-2 items-center gap-3", children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
12630
+ /* @__PURE__ */ jsx(Text, { size: "small", weight: "plus", leading: "compact", children: "Items to ship" }),
12631
+ /* @__PURE__ */ jsx(Text, { size: "small", className: "text-ui-fg-subtle", children: "Items with the selected shipping profile." })
12632
+ ] }) }),
12633
+ /* @__PURE__ */ jsxs("div", { className: "bg-ui-bg-subtle shadow-elevation-card-rest rounded-xl", children: [
12634
+ /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-3 px-4 py-2 text-ui-fg-muted", children: [
12635
+ /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(Text, { size: "small", weight: "plus", children: "Item" }) }),
12636
+ /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(Text, { size: "small", weight: "plus", children: "Quantity" }) })
12637
+ ] }),
12638
+ /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-y-1.5 px-[5px] pb-[5px]", children: matches.length > 0 ? matches == null ? void 0 : matches.map((item) => /* @__PURE__ */ jsxs(
12639
+ "div",
12640
+ {
12641
+ className: "grid grid-cols-2 gap-3 px-4 py-2 bg-ui-bg-base shadow-elevation-card-rest rounded-lg items-center",
12642
+ children: [
12643
+ /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-x-3", children: [
12644
+ /* @__PURE__ */ jsx(
12645
+ Thumbnail,
12646
+ {
12647
+ thumbnail: item.thumbnail,
12648
+ alt: item.product_title ?? void 0
12649
+ }
12650
+ ),
12651
+ /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
12652
+ /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-x-1", children: [
12653
+ /* @__PURE__ */ jsx(Text, { size: "small", weight: "plus", leading: "compact", children: item.product_title }),
12654
+ /* @__PURE__ */ jsxs(
12655
+ Text,
12656
+ {
12657
+ size: "small",
12658
+ leading: "compact",
12659
+ className: "text-ui-fg-subtle",
12660
+ children: [
12661
+ "(",
12662
+ item.variant_title,
12663
+ ")"
12664
+ ]
12665
+ }
12666
+ )
12667
+ ] }),
12668
+ /* @__PURE__ */ jsx(
12669
+ Text,
12670
+ {
12671
+ size: "small",
12672
+ leading: "compact",
12673
+ className: "text-ui-fg-subtle",
12674
+ children: item.variant_sku
12675
+ }
12676
+ )
12677
+ ] })
12678
+ ] }),
12679
+ /* @__PURE__ */ jsxs(
12680
+ Text,
12681
+ {
12682
+ size: "small",
12683
+ leading: "compact",
12684
+ className: "text-ui-fg-subtle",
12685
+ children: [
12686
+ item.quantity,
12687
+ "x"
12688
+ ]
12689
+ }
12690
+ )
12691
+ ]
12692
+ },
12693
+ item.id
12694
+ )) : /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-center gap-x-3 bg-ui-bg-base rounded-lg p-4 shadow-elevation-card-rest flex-col gap-1", children: [
12695
+ /* @__PURE__ */ jsx(Text, { size: "small", weight: "plus", leading: "compact", children: "No items found" }),
12696
+ /* @__PURE__ */ jsxs(Text, { size: "small", className: "text-ui-fg-subtle", children: [
12697
+ 'No items found for "',
12698
+ query,
12699
+ '".'
12700
+ ] })
12701
+ ] }) })
12702
+ ] })
12703
+ ] });
12704
+ };
12705
+ const LocationField = ({ control, setValue }) => {
12706
+ const locations = useComboboxData({
12707
+ queryKey: ["locations"],
12708
+ queryFn: async (params) => {
12709
+ return await sdk.admin.stockLocation.list(params);
12710
+ },
12711
+ getOptions: (data) => {
12712
+ return data.stock_locations.map((location) => ({
12713
+ label: location.name,
12714
+ value: location.id
12715
+ }));
12716
+ }
12717
+ });
12718
+ return /* @__PURE__ */ jsx(
12719
+ Form$2.Field,
12720
+ {
12721
+ control,
12722
+ name: "location_id",
12723
+ render: ({ field: { onChange, ...field } }) => {
12724
+ return /* @__PURE__ */ jsx(Form$2.Item, { children: /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-x-3", children: [
12725
+ /* @__PURE__ */ jsxs("div", { children: [
12726
+ /* @__PURE__ */ jsx(Form$2.Label, { children: "Location" }),
12727
+ /* @__PURE__ */ jsx(Form$2.Hint, { children: "Choose where you want to ship the items from." })
12728
+ ] }),
12729
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(
12730
+ Combobox,
12903
12731
  {
12904
- width: "12",
12905
- height: "12",
12906
- fill: "white",
12907
- transform: "matrix(0.865865 0.500278 -0.871576 0.490261 120.928 84.4561)"
12732
+ options: locations.options,
12733
+ fetchNextPage: locations.fetchNextPage,
12734
+ isFetchingNextPage: locations.isFetchingNextPage,
12735
+ searchValue: locations.searchValue,
12736
+ onSearchValueChange: locations.onSearchValueChange,
12737
+ placeholder: "Select location",
12738
+ onChange: (value) => {
12739
+ setValue("shipping_option_id", "", {
12740
+ shouldDirty: true,
12741
+ shouldTouch: true
12742
+ });
12743
+ onChange(value);
12744
+ },
12745
+ ...field
12908
12746
  }
12909
- ) }),
12910
- /* @__PURE__ */ jsx("clipPath", { id: "clip4_20915_38670", children: /* @__PURE__ */ jsx(
12911
- "rect",
12747
+ ) })
12748
+ ] }) });
12749
+ }
12750
+ }
12751
+ );
12752
+ };
12753
+ const ShippingOptionField = ({
12754
+ shippingProfileId,
12755
+ preview,
12756
+ control
12757
+ }) => {
12758
+ var _a;
12759
+ const locationId = useWatch({ control, name: "location_id" });
12760
+ const shippingOptions = useComboboxData({
12761
+ queryKey: ["shipping_options", locationId, shippingProfileId],
12762
+ queryFn: async (params) => {
12763
+ return await sdk.admin.shippingOption.list({
12764
+ ...params,
12765
+ stock_location_id: locationId,
12766
+ shipping_profile_id: shippingProfileId
12767
+ });
12768
+ },
12769
+ getOptions: (data) => {
12770
+ return data.shipping_options.map((option) => {
12771
+ var _a2;
12772
+ if ((_a2 = option.rules) == null ? void 0 : _a2.find(
12773
+ (r) => r.attribute === "is_return" && r.value === "true"
12774
+ )) {
12775
+ return void 0;
12776
+ }
12777
+ return {
12778
+ label: option.name,
12779
+ value: option.id
12780
+ };
12781
+ }).filter(Boolean);
12782
+ },
12783
+ enabled: !!locationId && !!shippingProfileId,
12784
+ defaultValue: ((_a = preview.shipping_methods[0]) == null ? void 0 : _a.shipping_option_id) || void 0
12785
+ });
12786
+ const tooltipContent = !locationId && !shippingProfileId ? "Choose a location and shipping profile first." : !locationId ? "Choose a location first." : "Choose a shipping profile first.";
12787
+ return /* @__PURE__ */ jsx(
12788
+ Form$2.Field,
12789
+ {
12790
+ control,
12791
+ name: "shipping_option_id",
12792
+ render: ({ field }) => {
12793
+ return /* @__PURE__ */ jsx(Form$2.Item, { children: /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-x-3", children: [
12794
+ /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
12795
+ /* @__PURE__ */ jsx(Form$2.Label, { children: "Shipping option" }),
12796
+ /* @__PURE__ */ jsx(Form$2.Hint, { children: "Choose the shipping option to use." })
12797
+ ] }),
12798
+ /* @__PURE__ */ jsx(
12799
+ ConditionalTooltip,
12912
12800
  {
12913
- width: "12",
12914
- height: "12",
12915
- fill: "white",
12916
- transform: "matrix(0.865865 0.500278 -0.871576 0.490261 131.318 90.4594)"
12801
+ content: tooltipContent,
12802
+ showTooltip: !locationId || !shippingProfileId,
12803
+ children: /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(
12804
+ Combobox,
12805
+ {
12806
+ options: shippingOptions.options,
12807
+ fetchNextPage: shippingOptions.fetchNextPage,
12808
+ isFetchingNextPage: shippingOptions.isFetchingNextPage,
12809
+ searchValue: shippingOptions.searchValue,
12810
+ onSearchValueChange: shippingOptions.onSearchValueChange,
12811
+ placeholder: "Select shipping option",
12812
+ ...field,
12813
+ disabled: !locationId || !shippingProfileId
12814
+ }
12815
+ ) }) })
12917
12816
  }
12918
- ) }),
12919
- /* @__PURE__ */ jsx("clipPath", { id: "clip5_20915_38670", children: /* @__PURE__ */ jsx(
12920
- "rect",
12817
+ )
12818
+ ] }) });
12819
+ }
12820
+ }
12821
+ );
12822
+ };
12823
+ const CustomAmountField = ({
12824
+ control,
12825
+ currencyCode
12826
+ }) => {
12827
+ return /* @__PURE__ */ jsx(
12828
+ Form$2.Field,
12829
+ {
12830
+ control,
12831
+ name: "custom_amount",
12832
+ render: ({ field: { onChange, ...field } }) => {
12833
+ return /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-x-3", children: [
12834
+ /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
12835
+ /* @__PURE__ */ jsx(Form$2.Label, { optional: true, children: "Custom amount" }),
12836
+ /* @__PURE__ */ jsx(Form$2.Hint, { children: "Set a custom amount for the shipping option." })
12837
+ ] }),
12838
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(
12839
+ CurrencyInput,
12921
12840
  {
12922
- width: "12",
12923
- height: "12",
12924
- fill: "white",
12925
- transform: "matrix(0.865865 0.500278 -0.871576 0.490261 141.709 96.4627)"
12841
+ ...field,
12842
+ onValueChange: (value) => onChange(value),
12843
+ symbol: getNativeSymbol(currencyCode),
12844
+ code: currencyCode
12926
12845
  }
12927
12846
  ) })
12928
- ] })
12929
- ]
12847
+ ] });
12848
+ }
12930
12849
  }
12931
12850
  );
12932
12851
  };
12933
- const schema$1 = objectType({
12934
- customer_id: stringType().min(1)
12935
- });
12936
- const SalesChannel = () => {
12852
+ const BillingAddress = () => {
12937
12853
  const { id } = useParams();
12938
- const { draft_order, isPending, isError, error } = useDraftOrder(
12939
- id,
12940
- {
12941
- fields: "+sales_channel_id"
12942
- },
12943
- {
12944
- enabled: !!id
12945
- }
12946
- );
12854
+ const { order, isPending, isError, error } = useOrder(id, {
12855
+ fields: "+billing_address"
12856
+ });
12947
12857
  if (isError) {
12948
12858
  throw error;
12949
12859
  }
12950
- const ISrEADY = !!draft_order && !isPending;
12860
+ const isReady = !isPending && !!order;
12951
12861
  return /* @__PURE__ */ jsxs(RouteDrawer, { children: [
12952
12862
  /* @__PURE__ */ jsxs(RouteDrawer.Header, { children: [
12953
- /* @__PURE__ */ jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Edit Sales Channel" }) }),
12954
- /* @__PURE__ */ jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Update which sales channel the draft order is associated with" }) })
12863
+ /* @__PURE__ */ jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Edit Billing Address" }) }),
12864
+ /* @__PURE__ */ jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Edit the billing address for the draft order" }) })
12955
12865
  ] }),
12956
- ISrEADY && /* @__PURE__ */ jsx(SalesChannelForm, { order: draft_order })
12866
+ isReady && /* @__PURE__ */ jsx(BillingAddressForm, { order })
12957
12867
  ] });
12958
12868
  };
12959
- const SalesChannelForm = ({ order }) => {
12869
+ const BillingAddressForm = ({ order }) => {
12870
+ var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
12960
12871
  const form = useForm({
12961
12872
  defaultValues: {
12962
- sales_channel_id: order.sales_channel_id || ""
12873
+ first_name: ((_a = order.billing_address) == null ? void 0 : _a.first_name) ?? "",
12874
+ last_name: ((_b = order.billing_address) == null ? void 0 : _b.last_name) ?? "",
12875
+ company: ((_c = order.billing_address) == null ? void 0 : _c.company) ?? "",
12876
+ address_1: ((_d = order.billing_address) == null ? void 0 : _d.address_1) ?? "",
12877
+ address_2: ((_e = order.billing_address) == null ? void 0 : _e.address_2) ?? "",
12878
+ city: ((_f = order.billing_address) == null ? void 0 : _f.city) ?? "",
12879
+ province: ((_g = order.billing_address) == null ? void 0 : _g.province) ?? "",
12880
+ country_code: ((_h = order.billing_address) == null ? void 0 : _h.country_code) ?? "",
12881
+ postal_code: ((_i = order.billing_address) == null ? void 0 : _i.postal_code) ?? "",
12882
+ phone: ((_j = order.billing_address) == null ? void 0 : _j.phone) ?? ""
12963
12883
  },
12964
12884
  resolver: zodResolver(schema)
12965
12885
  });
@@ -12967,12 +12887,9 @@ const SalesChannelForm = ({ order }) => {
12967
12887
  const { handleSuccess } = useRouteModal();
12968
12888
  const onSubmit = form.handleSubmit(async (data) => {
12969
12889
  await mutateAsync(
12970
- {
12971
- sales_channel_id: data.sales_channel_id
12972
- },
12890
+ { billing_address: data },
12973
12891
  {
12974
12892
  onSuccess: () => {
12975
- toast.success("Sales channel updated");
12976
12893
  handleSuccess();
12977
12894
  },
12978
12895
  onError: (error) => {
@@ -12987,7 +12904,132 @@ const SalesChannelForm = ({ order }) => {
12987
12904
  className: "flex flex-1 flex-col overflow-hidden",
12988
12905
  onSubmit,
12989
12906
  children: [
12990
- /* @__PURE__ */ jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsx(SalesChannelField, { control: form.control, order }) }),
12907
+ /* @__PURE__ */ jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-y-4", children: [
12908
+ /* @__PURE__ */ jsx(
12909
+ Form$2.Field,
12910
+ {
12911
+ control: form.control,
12912
+ name: "country_code",
12913
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
12914
+ /* @__PURE__ */ jsx(Form$2.Label, { children: "Country" }),
12915
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(CountrySelect, { ...field }) }),
12916
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
12917
+ ] })
12918
+ }
12919
+ ),
12920
+ /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
12921
+ /* @__PURE__ */ jsx(
12922
+ Form$2.Field,
12923
+ {
12924
+ control: form.control,
12925
+ name: "first_name",
12926
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
12927
+ /* @__PURE__ */ jsx(Form$2.Label, { children: "First name" }),
12928
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
12929
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
12930
+ ] })
12931
+ }
12932
+ ),
12933
+ /* @__PURE__ */ jsx(
12934
+ Form$2.Field,
12935
+ {
12936
+ control: form.control,
12937
+ name: "last_name",
12938
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
12939
+ /* @__PURE__ */ jsx(Form$2.Label, { children: "Last name" }),
12940
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
12941
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
12942
+ ] })
12943
+ }
12944
+ )
12945
+ ] }),
12946
+ /* @__PURE__ */ jsx(
12947
+ Form$2.Field,
12948
+ {
12949
+ control: form.control,
12950
+ name: "company",
12951
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
12952
+ /* @__PURE__ */ jsx(Form$2.Label, { optional: true, children: "Company" }),
12953
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
12954
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
12955
+ ] })
12956
+ }
12957
+ ),
12958
+ /* @__PURE__ */ jsx(
12959
+ Form$2.Field,
12960
+ {
12961
+ control: form.control,
12962
+ name: "address_1",
12963
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
12964
+ /* @__PURE__ */ jsx(Form$2.Label, { children: "Address" }),
12965
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
12966
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
12967
+ ] })
12968
+ }
12969
+ ),
12970
+ /* @__PURE__ */ jsx(
12971
+ Form$2.Field,
12972
+ {
12973
+ control: form.control,
12974
+ name: "address_2",
12975
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
12976
+ /* @__PURE__ */ jsx(Form$2.Label, { optional: true, children: "Apartment, suite, etc." }),
12977
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
12978
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
12979
+ ] })
12980
+ }
12981
+ ),
12982
+ /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
12983
+ /* @__PURE__ */ jsx(
12984
+ Form$2.Field,
12985
+ {
12986
+ control: form.control,
12987
+ name: "postal_code",
12988
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
12989
+ /* @__PURE__ */ jsx(Form$2.Label, { children: "Postal code" }),
12990
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
12991
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
12992
+ ] })
12993
+ }
12994
+ ),
12995
+ /* @__PURE__ */ jsx(
12996
+ Form$2.Field,
12997
+ {
12998
+ control: form.control,
12999
+ name: "city",
13000
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
13001
+ /* @__PURE__ */ jsx(Form$2.Label, { children: "City" }),
13002
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
13003
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
13004
+ ] })
13005
+ }
13006
+ )
13007
+ ] }),
13008
+ /* @__PURE__ */ jsx(
13009
+ Form$2.Field,
13010
+ {
13011
+ control: form.control,
13012
+ name: "province",
13013
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
13014
+ /* @__PURE__ */ jsx(Form$2.Label, { optional: true, children: "Province / State" }),
13015
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
13016
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
13017
+ ] })
13018
+ }
13019
+ ),
13020
+ /* @__PURE__ */ jsx(
13021
+ Form$2.Field,
13022
+ {
13023
+ control: form.control,
13024
+ name: "phone",
13025
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
13026
+ /* @__PURE__ */ jsx(Form$2.Label, { optional: true, children: "Phone" }),
13027
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
13028
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
13029
+ ] })
13030
+ }
13031
+ )
13032
+ ] }) }),
12991
13033
  /* @__PURE__ */ jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex justify-end gap-2", children: [
12992
13034
  /* @__PURE__ */ jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
12993
13035
  /* @__PURE__ */ jsx(Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
@@ -12996,49 +13038,7 @@ const SalesChannelForm = ({ order }) => {
12996
13038
  }
12997
13039
  ) });
12998
13040
  };
12999
- const SalesChannelField = ({ control, order }) => {
13000
- const salesChannels = useComboboxData({
13001
- queryFn: async (params) => {
13002
- return await sdk.admin.salesChannel.list(params);
13003
- },
13004
- queryKey: ["sales-channels"],
13005
- getOptions: (data) => {
13006
- return data.sales_channels.map((salesChannel) => ({
13007
- label: salesChannel.name,
13008
- value: salesChannel.id
13009
- }));
13010
- },
13011
- defaultValue: order.sales_channel_id || void 0
13012
- });
13013
- return /* @__PURE__ */ jsx(
13014
- Form$2.Field,
13015
- {
13016
- control,
13017
- name: "sales_channel_id",
13018
- render: ({ field }) => {
13019
- return /* @__PURE__ */ jsxs(Form$2.Item, { children: [
13020
- /* @__PURE__ */ jsx(Form$2.Label, { children: "Sales Channel" }),
13021
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(
13022
- Combobox,
13023
- {
13024
- options: salesChannels.options,
13025
- fetchNextPage: salesChannels.fetchNextPage,
13026
- isFetchingNextPage: salesChannels.isFetchingNextPage,
13027
- searchValue: salesChannels.searchValue,
13028
- onSearchValueChange: salesChannels.onSearchValueChange,
13029
- placeholder: "Select sales channel",
13030
- ...field
13031
- }
13032
- ) }),
13033
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
13034
- ] });
13035
- }
13036
- }
13037
- );
13038
- };
13039
- const schema = objectType({
13040
- sales_channel_id: stringType().min(1)
13041
- });
13041
+ const schema = addressSchema;
13042
13042
  const widgetModule = { widgets: [] };
13043
13043
  const routeModule = {
13044
13044
  routes: [
@@ -13060,17 +13060,13 @@ const routeModule = {
13060
13060
  loader,
13061
13061
  children: [
13062
13062
  {
13063
- Component: BillingAddress,
13064
- path: "/draft-orders/:id/billing-address"
13063
+ Component: CustomItems,
13064
+ path: "/draft-orders/:id/custom-items"
13065
13065
  },
13066
13066
  {
13067
13067
  Component: Email,
13068
13068
  path: "/draft-orders/:id/email"
13069
13069
  },
13070
- {
13071
- Component: CustomItems,
13072
- path: "/draft-orders/:id/custom-items"
13073
- },
13074
13070
  {
13075
13071
  Component: Items,
13076
13072
  path: "/draft-orders/:id/items"
@@ -13084,20 +13080,24 @@ const routeModule = {
13084
13080
  path: "/draft-orders/:id/promotions"
13085
13081
  },
13086
13082
  {
13087
- Component: ShippingAddress,
13088
- path: "/draft-orders/:id/shipping-address"
13083
+ Component: SalesChannel,
13084
+ path: "/draft-orders/:id/sales-channel"
13089
13085
  },
13090
13086
  {
13091
- Component: Shipping,
13092
- path: "/draft-orders/:id/shipping"
13087
+ Component: ShippingAddress,
13088
+ path: "/draft-orders/:id/shipping-address"
13093
13089
  },
13094
13090
  {
13095
13091
  Component: TransferOwnership,
13096
13092
  path: "/draft-orders/:id/transfer-ownership"
13097
13093
  },
13098
13094
  {
13099
- Component: SalesChannel,
13100
- path: "/draft-orders/:id/sales-channel"
13095
+ Component: Shipping,
13096
+ path: "/draft-orders/:id/shipping"
13097
+ },
13098
+ {
13099
+ Component: BillingAddress,
13100
+ path: "/draft-orders/:id/billing-address"
13101
13101
  }
13102
13102
  ]
13103
13103
  }