@medusajs/draft-order 2.10.2-preview-20250910060149 → 2.10.2-preview-20250910090158

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