@medusajs/draft-order 2.10.4-snapshot-20250926124023 → 2.10.4-snapshot-20250927182917

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -9573,196 +9573,6 @@ const ID = () => {
9573
9573
  /* @__PURE__ */ jsxRuntime.jsx(reactRouterDom.Outlet, {})
9574
9574
  ] });
9575
9575
  };
9576
- const BillingAddress = () => {
9577
- const { id } = reactRouterDom.useParams();
9578
- const { order, isPending, isError, error } = useOrder(id, {
9579
- fields: "+billing_address"
9580
- });
9581
- if (isError) {
9582
- throw error;
9583
- }
9584
- const isReady = !isPending && !!order;
9585
- return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
9586
- /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
9587
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Billing Address" }) }),
9588
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit the billing address for the draft order" }) })
9589
- ] }),
9590
- isReady && /* @__PURE__ */ jsxRuntime.jsx(BillingAddressForm, { order })
9591
- ] });
9592
- };
9593
- const BillingAddressForm = ({ order }) => {
9594
- var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
9595
- const form = reactHookForm.useForm({
9596
- defaultValues: {
9597
- first_name: ((_a = order.billing_address) == null ? void 0 : _a.first_name) ?? "",
9598
- last_name: ((_b = order.billing_address) == null ? void 0 : _b.last_name) ?? "",
9599
- company: ((_c = order.billing_address) == null ? void 0 : _c.company) ?? "",
9600
- address_1: ((_d = order.billing_address) == null ? void 0 : _d.address_1) ?? "",
9601
- address_2: ((_e = order.billing_address) == null ? void 0 : _e.address_2) ?? "",
9602
- city: ((_f = order.billing_address) == null ? void 0 : _f.city) ?? "",
9603
- province: ((_g = order.billing_address) == null ? void 0 : _g.province) ?? "",
9604
- country_code: ((_h = order.billing_address) == null ? void 0 : _h.country_code) ?? "",
9605
- postal_code: ((_i = order.billing_address) == null ? void 0 : _i.postal_code) ?? "",
9606
- phone: ((_j = order.billing_address) == null ? void 0 : _j.phone) ?? ""
9607
- },
9608
- resolver: zod.zodResolver(schema$5)
9609
- });
9610
- const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
9611
- const { handleSuccess } = useRouteModal();
9612
- const onSubmit = form.handleSubmit(async (data) => {
9613
- await mutateAsync(
9614
- { billing_address: data },
9615
- {
9616
- onSuccess: () => {
9617
- handleSuccess();
9618
- },
9619
- onError: (error) => {
9620
- ui.toast.error(error.message);
9621
- }
9622
- }
9623
- );
9624
- });
9625
- return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
9626
- KeyboundForm,
9627
- {
9628
- className: "flex flex-1 flex-col overflow-hidden",
9629
- onSubmit,
9630
- children: [
9631
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-y-4", children: [
9632
- /* @__PURE__ */ jsxRuntime.jsx(
9633
- Form$2.Field,
9634
- {
9635
- control: form.control,
9636
- name: "country_code",
9637
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9638
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Country" }),
9639
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(CountrySelect, { ...field }) }),
9640
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9641
- ] })
9642
- }
9643
- ),
9644
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
9645
- /* @__PURE__ */ jsxRuntime.jsx(
9646
- Form$2.Field,
9647
- {
9648
- control: form.control,
9649
- name: "first_name",
9650
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9651
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "First name" }),
9652
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9653
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9654
- ] })
9655
- }
9656
- ),
9657
- /* @__PURE__ */ jsxRuntime.jsx(
9658
- Form$2.Field,
9659
- {
9660
- control: form.control,
9661
- name: "last_name",
9662
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9663
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Last name" }),
9664
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9665
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9666
- ] })
9667
- }
9668
- )
9669
- ] }),
9670
- /* @__PURE__ */ jsxRuntime.jsx(
9671
- Form$2.Field,
9672
- {
9673
- control: form.control,
9674
- name: "company",
9675
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9676
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Company" }),
9677
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9678
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9679
- ] })
9680
- }
9681
- ),
9682
- /* @__PURE__ */ jsxRuntime.jsx(
9683
- Form$2.Field,
9684
- {
9685
- control: form.control,
9686
- name: "address_1",
9687
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9688
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Address" }),
9689
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9690
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9691
- ] })
9692
- }
9693
- ),
9694
- /* @__PURE__ */ jsxRuntime.jsx(
9695
- Form$2.Field,
9696
- {
9697
- control: form.control,
9698
- name: "address_2",
9699
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9700
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Apartment, suite, etc." }),
9701
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9702
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9703
- ] })
9704
- }
9705
- ),
9706
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
9707
- /* @__PURE__ */ jsxRuntime.jsx(
9708
- Form$2.Field,
9709
- {
9710
- control: form.control,
9711
- name: "postal_code",
9712
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9713
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Postal code" }),
9714
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9715
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9716
- ] })
9717
- }
9718
- ),
9719
- /* @__PURE__ */ jsxRuntime.jsx(
9720
- Form$2.Field,
9721
- {
9722
- control: form.control,
9723
- name: "city",
9724
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9725
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "City" }),
9726
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9727
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9728
- ] })
9729
- }
9730
- )
9731
- ] }),
9732
- /* @__PURE__ */ jsxRuntime.jsx(
9733
- Form$2.Field,
9734
- {
9735
- control: form.control,
9736
- name: "province",
9737
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9738
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Province / State" }),
9739
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9740
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9741
- ] })
9742
- }
9743
- ),
9744
- /* @__PURE__ */ jsxRuntime.jsx(
9745
- Form$2.Field,
9746
- {
9747
- control: form.control,
9748
- name: "phone",
9749
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9750
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Phone" }),
9751
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9752
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9753
- ] })
9754
- }
9755
- )
9756
- ] }) }),
9757
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
9758
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
9759
- /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
9760
- ] }) })
9761
- ]
9762
- }
9763
- ) });
9764
- };
9765
- const schema$5 = addressSchema;
9766
9576
  const CustomItems = () => {
9767
9577
  return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
9768
9578
  /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Header, { children: /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Custom Items" }) }) }),
@@ -9771,7 +9581,7 @@ const CustomItems = () => {
9771
9581
  };
9772
9582
  const CustomItemsForm = () => {
9773
9583
  const form = reactHookForm.useForm({
9774
- resolver: zod.zodResolver(schema$4)
9584
+ resolver: zod.zodResolver(schema$5)
9775
9585
  });
9776
9586
  return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(KeyboundForm, { className: "flex flex-1 flex-col", children: [
9777
9587
  /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, {}),
@@ -9781,7 +9591,7 @@ const CustomItemsForm = () => {
9781
9591
  ] }) })
9782
9592
  ] }) });
9783
9593
  };
9784
- const schema$4 = objectType({
9594
+ const schema$5 = objectType({
9785
9595
  email: stringType().email()
9786
9596
  });
9787
9597
  const NumberInput = React.forwardRef(
@@ -10758,54 +10568,10 @@ const customItemSchema = objectType({
10758
10568
  quantity: numberType(),
10759
10569
  unit_price: unionType([numberType(), stringType()])
10760
10570
  });
10761
- const InlineTip = React.forwardRef(
10762
- ({ variant = "tip", label, className, children, ...props }, ref) => {
10763
- const labelValue = label || (variant === "warning" ? "Warning" : "Tip");
10764
- return /* @__PURE__ */ jsxRuntime.jsxs(
10765
- "div",
10766
- {
10767
- ref,
10768
- className: ui.clx(
10769
- "bg-ui-bg-component txt-small text-ui-fg-subtle grid grid-cols-[4px_1fr] items-start gap-3 rounded-lg border p-3",
10770
- className
10771
- ),
10772
- ...props,
10773
- children: [
10774
- /* @__PURE__ */ jsxRuntime.jsx(
10775
- "div",
10776
- {
10777
- role: "presentation",
10778
- className: ui.clx("w-4px bg-ui-tag-neutral-icon h-full rounded-full", {
10779
- "bg-ui-tag-orange-icon": variant === "warning"
10780
- })
10781
- }
10782
- ),
10783
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-pretty", children: [
10784
- /* @__PURE__ */ jsxRuntime.jsxs("strong", { className: "txt-small-plus text-ui-fg-base", children: [
10785
- labelValue,
10786
- ":"
10787
- ] }),
10788
- " ",
10789
- children
10790
- ] })
10791
- ]
10792
- }
10793
- );
10794
- }
10795
- );
10796
- InlineTip.displayName = "InlineTip";
10797
- const MetadataFieldSchema = objectType({
10798
- key: stringType(),
10799
- disabled: booleanType().optional(),
10800
- value: anyType()
10801
- });
10802
- const MetadataSchema = objectType({
10803
- metadata: arrayType(MetadataFieldSchema)
10804
- });
10805
- const Metadata = () => {
10571
+ const BillingAddress = () => {
10806
10572
  const { id } = reactRouterDom.useParams();
10807
10573
  const { order, isPending, isError, error } = useOrder(id, {
10808
- fields: "metadata"
10574
+ fields: "+billing_address"
10809
10575
  });
10810
10576
  if (isError) {
10811
10577
  throw error;
@@ -10813,33 +10579,36 @@ const Metadata = () => {
10813
10579
  const isReady = !isPending && !!order;
10814
10580
  return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
10815
10581
  /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
10816
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Metadata" }) }),
10817
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Add metadata to the draft order." }) })
10582
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Billing Address" }) }),
10583
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit the billing address for the draft order" }) })
10818
10584
  ] }),
10819
- !isReady ? /* @__PURE__ */ jsxRuntime.jsx(PlaceholderInner, {}) : /* @__PURE__ */ jsxRuntime.jsx(MetadataForm, { orderId: id, metadata: order == null ? void 0 : order.metadata })
10585
+ isReady && /* @__PURE__ */ jsxRuntime.jsx(BillingAddressForm, { order })
10820
10586
  ] });
10821
10587
  };
10822
- const METADATA_KEY_LABEL_ID = "metadata-form-key-label";
10823
- const METADATA_VALUE_LABEL_ID = "metadata-form-value-label";
10824
- const MetadataForm = ({ orderId, metadata }) => {
10825
- const { handleSuccess } = useRouteModal();
10826
- const hasUneditableRows = getHasUneditableRows(metadata);
10827
- const { mutateAsync, isPending } = useUpdateDraftOrder(orderId);
10588
+ const BillingAddressForm = ({ order }) => {
10589
+ var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
10828
10590
  const form = reactHookForm.useForm({
10829
10591
  defaultValues: {
10830
- metadata: getDefaultValues(metadata)
10831
- },
10832
- resolver: zod.zodResolver(MetadataSchema)
10592
+ first_name: ((_a = order.billing_address) == null ? void 0 : _a.first_name) ?? "",
10593
+ last_name: ((_b = order.billing_address) == null ? void 0 : _b.last_name) ?? "",
10594
+ company: ((_c = order.billing_address) == null ? void 0 : _c.company) ?? "",
10595
+ address_1: ((_d = order.billing_address) == null ? void 0 : _d.address_1) ?? "",
10596
+ address_2: ((_e = order.billing_address) == null ? void 0 : _e.address_2) ?? "",
10597
+ city: ((_f = order.billing_address) == null ? void 0 : _f.city) ?? "",
10598
+ province: ((_g = order.billing_address) == null ? void 0 : _g.province) ?? "",
10599
+ country_code: ((_h = order.billing_address) == null ? void 0 : _h.country_code) ?? "",
10600
+ postal_code: ((_i = order.billing_address) == null ? void 0 : _i.postal_code) ?? "",
10601
+ phone: ((_j = order.billing_address) == null ? void 0 : _j.phone) ?? ""
10602
+ },
10603
+ resolver: zod.zodResolver(schema$4)
10833
10604
  });
10834
- const handleSubmit = form.handleSubmit(async (data) => {
10835
- const parsedData = parseValues(data);
10605
+ const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
10606
+ const { handleSuccess } = useRouteModal();
10607
+ const onSubmit = form.handleSubmit(async (data) => {
10836
10608
  await mutateAsync(
10837
- {
10838
- metadata: parsedData
10839
- },
10609
+ { billing_address: data },
10840
10610
  {
10841
10611
  onSuccess: () => {
10842
- ui.toast.success("Metadata updated");
10843
10612
  handleSuccess();
10844
10613
  },
10845
10614
  onError: (error) => {
@@ -10848,543 +10617,1151 @@ const MetadataForm = ({ orderId, metadata }) => {
10848
10617
  }
10849
10618
  );
10850
10619
  });
10851
- const { fields, insert, remove } = reactHookForm.useFieldArray({
10852
- control: form.control,
10853
- name: "metadata"
10854
- });
10855
- function deleteRow(index) {
10856
- remove(index);
10857
- if (fields.length === 1) {
10858
- insert(0, {
10859
- key: "",
10860
- value: "",
10861
- disabled: false
10862
- });
10863
- }
10864
- }
10865
- function insertRow(index, position) {
10866
- insert(index + (position === "above" ? 0 : 1), {
10867
- key: "",
10868
- value: "",
10869
- disabled: false
10870
- });
10871
- }
10872
10620
  return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
10873
10621
  KeyboundForm,
10874
10622
  {
10875
- onSubmit: handleSubmit,
10876
10623
  className: "flex flex-1 flex-col overflow-hidden",
10624
+ onSubmit,
10877
10625
  children: [
10878
- /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Body, { className: "flex flex-1 flex-col gap-y-8 overflow-y-auto", children: [
10879
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-ui-bg-base shadow-elevation-card-rest grid grid-cols-1 divide-y rounded-lg", children: [
10880
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-ui-bg-subtle grid grid-cols-2 divide-x rounded-t-lg", children: [
10881
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "txt-compact-small-plus text-ui-fg-subtle px-2 py-1.5", children: /* @__PURE__ */ jsxRuntime.jsx("label", { id: METADATA_KEY_LABEL_ID, children: "Key" }) }),
10882
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "txt-compact-small-plus text-ui-fg-subtle px-2 py-1.5", children: /* @__PURE__ */ jsxRuntime.jsx("label", { id: METADATA_VALUE_LABEL_ID, children: "Value" }) })
10883
- ] }),
10884
- fields.map((field, index) => {
10885
- const isDisabled = field.disabled || false;
10886
- let placeholder = "-";
10887
- if (typeof field.value === "object") {
10888
- placeholder = "{ ... }";
10626
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-y-4", children: [
10627
+ /* @__PURE__ */ jsxRuntime.jsx(
10628
+ Form$2.Field,
10629
+ {
10630
+ control: form.control,
10631
+ name: "country_code",
10632
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
10633
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Country" }),
10634
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(CountrySelect, { ...field }) }),
10635
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
10636
+ ] })
10637
+ }
10638
+ ),
10639
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
10640
+ /* @__PURE__ */ jsxRuntime.jsx(
10641
+ Form$2.Field,
10642
+ {
10643
+ control: form.control,
10644
+ name: "first_name",
10645
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
10646
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "First name" }),
10647
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
10648
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
10649
+ ] })
10889
10650
  }
10890
- if (Array.isArray(field.value)) {
10891
- placeholder = "[ ... ]";
10651
+ ),
10652
+ /* @__PURE__ */ jsxRuntime.jsx(
10653
+ Form$2.Field,
10654
+ {
10655
+ control: form.control,
10656
+ name: "last_name",
10657
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
10658
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Last name" }),
10659
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
10660
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
10661
+ ] })
10892
10662
  }
10893
- return /* @__PURE__ */ jsxRuntime.jsx(
10894
- ConditionalTooltip,
10895
- {
10896
- showTooltip: isDisabled,
10897
- content: "This row is disabled because it contains non-primitive data.",
10898
- children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "group/table relative", children: [
10899
- /* @__PURE__ */ jsxRuntime.jsxs(
10900
- "div",
10901
- {
10902
- className: ui.clx("grid grid-cols-2 divide-x", {
10903
- "overflow-hidden rounded-b-lg": index === fields.length - 1
10904
- }),
10905
- children: [
10906
- /* @__PURE__ */ jsxRuntime.jsx(
10907
- Form$2.Field,
10908
- {
10909
- control: form.control,
10910
- name: `metadata.${index}.key`,
10911
- render: ({ field: field2 }) => {
10912
- return /* @__PURE__ */ jsxRuntime.jsx(Form$2.Item, { children: /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
10913
- GridInput,
10914
- {
10915
- "aria-labelledby": METADATA_KEY_LABEL_ID,
10916
- ...field2,
10917
- disabled: isDisabled,
10918
- placeholder: "Key"
10919
- }
10920
- ) }) });
10921
- }
10922
- }
10923
- ),
10924
- /* @__PURE__ */ jsxRuntime.jsx(
10925
- Form$2.Field,
10926
- {
10927
- control: form.control,
10928
- name: `metadata.${index}.value`,
10929
- render: ({ field: { value, ...field2 } }) => {
10930
- return /* @__PURE__ */ jsxRuntime.jsx(Form$2.Item, { children: /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
10931
- GridInput,
10932
- {
10933
- "aria-labelledby": METADATA_VALUE_LABEL_ID,
10934
- ...field2,
10935
- value: isDisabled ? placeholder : value,
10936
- disabled: isDisabled,
10937
- placeholder: "Value"
10938
- }
10939
- ) }) });
10940
- }
10941
- }
10942
- )
10943
- ]
10944
- }
10945
- ),
10946
- /* @__PURE__ */ jsxRuntime.jsxs(ui.DropdownMenu, { children: [
10947
- /* @__PURE__ */ jsxRuntime.jsx(
10948
- ui.DropdownMenu.Trigger,
10949
- {
10950
- className: ui.clx(
10951
- "invisible absolute inset-y-0 -right-2.5 my-auto group-hover/table:visible data-[state='open']:visible",
10952
- {
10953
- hidden: isDisabled
10954
- }
10955
- ),
10956
- disabled: isDisabled,
10957
- asChild: true,
10958
- children: /* @__PURE__ */ jsxRuntime.jsx(ui.IconButton, { size: "2xsmall", children: /* @__PURE__ */ jsxRuntime.jsx(icons.EllipsisVertical, {}) })
10959
- }
10960
- ),
10961
- /* @__PURE__ */ jsxRuntime.jsxs(ui.DropdownMenu.Content, { children: [
10962
- /* @__PURE__ */ jsxRuntime.jsxs(
10963
- ui.DropdownMenu.Item,
10964
- {
10965
- className: "gap-x-2",
10966
- onClick: () => insertRow(index, "above"),
10967
- children: [
10968
- /* @__PURE__ */ jsxRuntime.jsx(icons.ArrowUpMini, { className: "text-ui-fg-subtle" }),
10969
- "Insert row above"
10970
- ]
10971
- }
10972
- ),
10973
- /* @__PURE__ */ jsxRuntime.jsxs(
10974
- ui.DropdownMenu.Item,
10975
- {
10976
- className: "gap-x-2",
10977
- onClick: () => insertRow(index, "below"),
10978
- children: [
10979
- /* @__PURE__ */ jsxRuntime.jsx(icons.ArrowDownMini, { className: "text-ui-fg-subtle" }),
10980
- "Insert row below"
10981
- ]
10982
- }
10983
- ),
10984
- /* @__PURE__ */ jsxRuntime.jsx(ui.DropdownMenu.Separator, {}),
10985
- /* @__PURE__ */ jsxRuntime.jsxs(
10986
- ui.DropdownMenu.Item,
10987
- {
10988
- className: "gap-x-2",
10989
- onClick: () => deleteRow(index),
10990
- children: [
10991
- /* @__PURE__ */ jsxRuntime.jsx(icons.Trash, { className: "text-ui-fg-subtle" }),
10992
- "Delete row"
10993
- ]
10994
- }
10995
- )
10996
- ] })
10997
- ] })
10998
- ] })
10999
- },
11000
- field.id
11001
- );
11002
- })
10663
+ )
11003
10664
  ] }),
11004
- hasUneditableRows && /* @__PURE__ */ jsxRuntime.jsx(InlineTip, { variant: "warning", label: "Some rows are disabled", children: "This object contains non-primitive metadata, such as arrays or objects, that can't be edited here. To edit the disabled rows, use the API directly." })
11005
- ] }),
11006
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
11007
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", type: "button", children: "Cancel" }) }),
11008
- /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
11009
- ] }) })
11010
- ]
11011
- }
11012
- ) });
11013
- };
11014
- const GridInput = React.forwardRef(({ className, ...props }, ref) => {
11015
- return /* @__PURE__ */ jsxRuntime.jsx(
11016
- "input",
11017
- {
11018
- ref,
11019
- ...props,
11020
- autoComplete: "off",
11021
- className: ui.clx(
11022
- "txt-compact-small text-ui-fg-base placeholder:text-ui-fg-muted disabled:text-ui-fg-disabled disabled:bg-ui-bg-base bg-transparent px-2 py-1.5 outline-none",
11023
- className
11024
- )
11025
- }
11026
- );
11027
- });
11028
- GridInput.displayName = "MetadataForm.GridInput";
11029
- const PlaceholderInner = () => {
11030
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-1 flex-col overflow-hidden", children: [
11031
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Skeleton, { className: "h-[148ox] w-full rounded-lg" }) }),
11032
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
11033
- /* @__PURE__ */ jsxRuntime.jsx(ui.Skeleton, { className: "h-7 w-12 rounded-md" }),
11034
- /* @__PURE__ */ jsxRuntime.jsx(ui.Skeleton, { className: "h-7 w-12 rounded-md" })
11035
- ] }) })
11036
- ] });
11037
- };
11038
- const EDITABLE_TYPES = ["string", "number", "boolean"];
11039
- function getDefaultValues(metadata) {
11040
- if (!metadata || !Object.keys(metadata).length) {
11041
- return [
11042
- {
11043
- key: "",
11044
- value: "",
11045
- disabled: false
11046
- }
11047
- ];
11048
- }
11049
- return Object.entries(metadata).map(([key, value]) => {
11050
- if (!EDITABLE_TYPES.includes(typeof value)) {
11051
- return {
11052
- key,
11053
- value,
11054
- disabled: true
11055
- };
11056
- }
11057
- let stringValue = value;
11058
- if (typeof value !== "string") {
11059
- stringValue = JSON.stringify(value);
11060
- }
11061
- return {
11062
- key,
11063
- value: stringValue,
11064
- original_key: key
11065
- };
11066
- });
11067
- }
11068
- function parseValues(values) {
11069
- const metadata = values.metadata;
11070
- const isEmpty = !metadata.length || metadata.length === 1 && !metadata[0].key && !metadata[0].value;
11071
- if (isEmpty) {
11072
- return null;
11073
- }
11074
- const update = {};
11075
- metadata.forEach((field) => {
11076
- let key = field.key;
11077
- let value = field.value;
11078
- const disabled = field.disabled;
11079
- if (!key || !value) {
11080
- return;
11081
- }
11082
- if (disabled) {
11083
- update[key] = value;
11084
- return;
11085
- }
11086
- key = key.trim();
11087
- value = value.trim();
11088
- if (value === "true") {
11089
- update[key] = true;
11090
- } else if (value === "false") {
11091
- update[key] = false;
11092
- } else {
11093
- const parsedNumber = parseFloat(value);
11094
- if (!isNaN(parsedNumber)) {
11095
- update[key] = parsedNumber;
11096
- } else {
11097
- update[key] = value;
11098
- }
10665
+ /* @__PURE__ */ jsxRuntime.jsx(
10666
+ Form$2.Field,
10667
+ {
10668
+ control: form.control,
10669
+ name: "company",
10670
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
10671
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Company" }),
10672
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
10673
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
10674
+ ] })
10675
+ }
10676
+ ),
10677
+ /* @__PURE__ */ jsxRuntime.jsx(
10678
+ Form$2.Field,
10679
+ {
10680
+ control: form.control,
10681
+ name: "address_1",
10682
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
10683
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Address" }),
10684
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
10685
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
10686
+ ] })
10687
+ }
10688
+ ),
10689
+ /* @__PURE__ */ jsxRuntime.jsx(
10690
+ Form$2.Field,
10691
+ {
10692
+ control: form.control,
10693
+ name: "address_2",
10694
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
10695
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Apartment, suite, etc." }),
10696
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
10697
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
10698
+ ] })
10699
+ }
10700
+ ),
10701
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
10702
+ /* @__PURE__ */ jsxRuntime.jsx(
10703
+ Form$2.Field,
10704
+ {
10705
+ control: form.control,
10706
+ name: "postal_code",
10707
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
10708
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Postal code" }),
10709
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
10710
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
10711
+ ] })
10712
+ }
10713
+ ),
10714
+ /* @__PURE__ */ jsxRuntime.jsx(
10715
+ Form$2.Field,
10716
+ {
10717
+ control: form.control,
10718
+ name: "city",
10719
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
10720
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "City" }),
10721
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
10722
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
10723
+ ] })
10724
+ }
10725
+ )
10726
+ ] }),
10727
+ /* @__PURE__ */ jsxRuntime.jsx(
10728
+ Form$2.Field,
10729
+ {
10730
+ control: form.control,
10731
+ name: "province",
10732
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
10733
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Province / State" }),
10734
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
10735
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
10736
+ ] })
10737
+ }
10738
+ ),
10739
+ /* @__PURE__ */ jsxRuntime.jsx(
10740
+ Form$2.Field,
10741
+ {
10742
+ control: form.control,
10743
+ name: "phone",
10744
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
10745
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Phone" }),
10746
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
10747
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
10748
+ ] })
10749
+ }
10750
+ )
10751
+ ] }) }),
10752
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
10753
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
10754
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
10755
+ ] }) })
10756
+ ]
11099
10757
  }
11100
- });
11101
- return update;
11102
- }
11103
- function getHasUneditableRows(metadata) {
11104
- if (!metadata) {
11105
- return false;
11106
- }
11107
- return Object.values(metadata).some(
11108
- (value) => !EDITABLE_TYPES.includes(typeof value)
11109
- );
11110
- }
11111
- const PROMOTION_QUERY_KEY = "promotions";
11112
- const promotionsQueryKeys = {
11113
- list: (query2) => [
11114
- PROMOTION_QUERY_KEY,
11115
- query2 ? query2 : void 0
11116
- ],
11117
- detail: (id, query2) => [
11118
- PROMOTION_QUERY_KEY,
11119
- id,
11120
- query2 ? query2 : void 0
11121
- ]
11122
- };
11123
- const usePromotions = (query2, options) => {
11124
- const { data, ...rest } = reactQuery.useQuery({
11125
- queryKey: promotionsQueryKeys.list(query2),
11126
- queryFn: async () => sdk.admin.promotion.list(query2),
11127
- ...options
11128
- });
11129
- return { ...data, ...rest };
10758
+ ) });
11130
10759
  };
11131
- const Promotions = () => {
10760
+ const schema$4 = addressSchema;
10761
+ const Email = () => {
11132
10762
  const { id } = reactRouterDom.useParams();
11133
- const {
11134
- order: preview,
11135
- isError: isPreviewError,
11136
- error: previewError
11137
- } = useOrderPreview(id, void 0);
11138
- useInitiateOrderEdit({ preview });
11139
- const { onCancel } = useCancelOrderEdit({ preview });
11140
- if (isPreviewError) {
11141
- throw previewError;
10763
+ const { order, isPending, isError, error } = useOrder(id, {
10764
+ fields: "+email"
10765
+ });
10766
+ if (isError) {
10767
+ throw error;
11142
10768
  }
11143
- const isReady = !!preview;
11144
- return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { onClose: onCancel, children: [
11145
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Header, { children: /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Promotions" }) }) }),
11146
- isReady && /* @__PURE__ */ jsxRuntime.jsx(PromotionForm, { preview })
10769
+ const isReady = !isPending && !!order;
10770
+ return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
10771
+ /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
10772
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Email" }) }),
10773
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit the email for the draft order" }) })
10774
+ ] }),
10775
+ isReady && /* @__PURE__ */ jsxRuntime.jsx(EmailForm, { order })
11147
10776
  ] });
11148
10777
  };
11149
- const PromotionForm = ({ preview }) => {
11150
- const { items, shipping_methods } = preview;
11151
- const [isSubmitting, setIsSubmitting] = React.useState(false);
11152
- const [comboboxValue, setComboboxValue] = React.useState("");
11153
- const { handleSuccess } = useRouteModal();
11154
- const { mutateAsync: addPromotions, isPending: isAddingPromotions } = useDraftOrderAddPromotions(preview.id);
11155
- const promoIds = getPromotionIds(items, shipping_methods);
11156
- const { promotions, isPending, isError, error } = usePromotions(
11157
- {
11158
- id: promoIds
11159
- },
11160
- {
11161
- enabled: !!promoIds.length
11162
- }
11163
- );
11164
- const comboboxData = useComboboxData({
11165
- queryKey: ["promotions", "combobox", promoIds],
11166
- queryFn: async (params) => {
11167
- return await sdk.admin.promotion.list({
11168
- ...params,
11169
- id: {
11170
- $nin: promoIds
11171
- }
11172
- });
10778
+ const EmailForm = ({ order }) => {
10779
+ const form = reactHookForm.useForm({
10780
+ defaultValues: {
10781
+ email: order.email ?? ""
11173
10782
  },
11174
- getOptions: (data) => {
11175
- return data.promotions.map((promotion) => ({
11176
- label: promotion.code,
11177
- value: promotion.code
11178
- }));
11179
- }
10783
+ resolver: zod.zodResolver(schema$3)
11180
10784
  });
11181
- const add = async (value) => {
11182
- if (!value) {
11183
- return;
11184
- }
11185
- addPromotions(
11186
- {
11187
- promo_codes: [value]
11188
- },
10785
+ const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
10786
+ const { handleSuccess } = useRouteModal();
10787
+ const onSubmit = form.handleSubmit(async (data) => {
10788
+ await mutateAsync(
10789
+ { email: data.email },
11189
10790
  {
11190
- onError: (e) => {
11191
- ui.toast.error(e.message);
11192
- comboboxData.onSearchValueChange("");
11193
- setComboboxValue("");
11194
- },
11195
10791
  onSuccess: () => {
11196
- comboboxData.onSearchValueChange("");
11197
- setComboboxValue("");
10792
+ handleSuccess();
10793
+ },
10794
+ onError: (error) => {
10795
+ ui.toast.error(error.message);
11198
10796
  }
11199
10797
  }
11200
10798
  );
11201
- };
11202
- const { mutateAsync: confirmOrderEdit } = useDraftOrderConfirmEdit(preview.id);
11203
- const { mutateAsync: requestOrderEdit } = useOrderEditRequest(preview.id);
11204
- const onSubmit = async () => {
11205
- setIsSubmitting(true);
11206
- let requestSucceeded = false;
11207
- await requestOrderEdit(void 0, {
11208
- onError: (e) => {
11209
- ui.toast.error(e.message);
11210
- },
11211
- onSuccess: () => {
11212
- requestSucceeded = true;
11213
- }
11214
- });
11215
- if (!requestSucceeded) {
11216
- setIsSubmitting(false);
11217
- return;
10799
+ });
10800
+ return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
10801
+ KeyboundForm,
10802
+ {
10803
+ className: "flex flex-1 flex-col overflow-hidden",
10804
+ onSubmit,
10805
+ children: [
10806
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsx(
10807
+ Form$2.Field,
10808
+ {
10809
+ control: form.control,
10810
+ name: "email",
10811
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
10812
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Email" }),
10813
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
10814
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
10815
+ ] })
10816
+ }
10817
+ ) }),
10818
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
10819
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
10820
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
10821
+ ] }) })
10822
+ ]
11218
10823
  }
11219
- await confirmOrderEdit(void 0, {
11220
- onError: (e) => {
11221
- ui.toast.error(e.message);
11222
- },
11223
- onSuccess: () => {
11224
- handleSuccess();
11225
- },
11226
- onSettled: () => {
11227
- setIsSubmitting(false);
10824
+ ) });
10825
+ };
10826
+ const schema$3 = objectType({
10827
+ email: stringType().email()
10828
+ });
10829
+ const InlineTip = React.forwardRef(
10830
+ ({ variant = "tip", label, className, children, ...props }, ref) => {
10831
+ const labelValue = label || (variant === "warning" ? "Warning" : "Tip");
10832
+ return /* @__PURE__ */ jsxRuntime.jsxs(
10833
+ "div",
10834
+ {
10835
+ ref,
10836
+ className: ui.clx(
10837
+ "bg-ui-bg-component txt-small text-ui-fg-subtle grid grid-cols-[4px_1fr] items-start gap-3 rounded-lg border p-3",
10838
+ className
10839
+ ),
10840
+ ...props,
10841
+ children: [
10842
+ /* @__PURE__ */ jsxRuntime.jsx(
10843
+ "div",
10844
+ {
10845
+ role: "presentation",
10846
+ className: ui.clx("w-4px bg-ui-tag-neutral-icon h-full rounded-full", {
10847
+ "bg-ui-tag-orange-icon": variant === "warning"
10848
+ })
10849
+ }
10850
+ ),
10851
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-pretty", children: [
10852
+ /* @__PURE__ */ jsxRuntime.jsxs("strong", { className: "txt-small-plus text-ui-fg-base", children: [
10853
+ labelValue,
10854
+ ":"
10855
+ ] }),
10856
+ " ",
10857
+ children
10858
+ ] })
10859
+ ]
11228
10860
  }
11229
- });
11230
- };
10861
+ );
10862
+ }
10863
+ );
10864
+ InlineTip.displayName = "InlineTip";
10865
+ const MetadataFieldSchema = objectType({
10866
+ key: stringType(),
10867
+ disabled: booleanType().optional(),
10868
+ value: anyType()
10869
+ });
10870
+ const MetadataSchema = objectType({
10871
+ metadata: arrayType(MetadataFieldSchema)
10872
+ });
10873
+ const Metadata = () => {
10874
+ const { id } = reactRouterDom.useParams();
10875
+ const { order, isPending, isError, error } = useOrder(id, {
10876
+ fields: "metadata"
10877
+ });
11231
10878
  if (isError) {
11232
10879
  throw error;
11233
10880
  }
11234
- return /* @__PURE__ */ jsxRuntime.jsxs(KeyboundForm, { className: "flex flex-1 flex-col", onSubmit, children: [
11235
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-4", children: [
11236
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-3", children: [
11237
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col", children: [
11238
- /* @__PURE__ */ jsxRuntime.jsx(ui.Label, { size: "small", weight: "plus", htmlFor: "promotion-combobox", children: "Apply promotions" }),
11239
- /* @__PURE__ */ jsxRuntime.jsx(ui.Hint, { id: "promotion-combobox-hint", children: "Manage promotions that should be applied to the order." })
11240
- ] }),
11241
- /* @__PURE__ */ jsxRuntime.jsx(
11242
- Combobox,
11243
- {
11244
- id: "promotion-combobox",
11245
- "aria-describedby": "promotion-combobox-hint",
11246
- isFetchingNextPage: comboboxData.isFetchingNextPage,
11247
- fetchNextPage: comboboxData.fetchNextPage,
11248
- options: comboboxData.options,
11249
- onSearchValueChange: comboboxData.onSearchValueChange,
11250
- searchValue: comboboxData.searchValue,
11251
- disabled: comboboxData.disabled || isAddingPromotions,
11252
- onChange: add,
11253
- value: comboboxValue
11254
- }
11255
- )
11256
- ] }),
11257
- /* @__PURE__ */ jsxRuntime.jsx(ui.Divider, { variant: "dashed" }),
11258
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col gap-2", children: promotions == null ? void 0 : promotions.map((promotion) => /* @__PURE__ */ jsxRuntime.jsx(
11259
- PromotionItem,
11260
- {
11261
- promotion,
11262
- orderId: preview.id,
11263
- isLoading: isPending
11264
- },
11265
- promotion.id
11266
- )) })
11267
- ] }) }),
11268
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
11269
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
11270
- /* @__PURE__ */ jsxRuntime.jsx(
11271
- ui.Button,
11272
- {
11273
- size: "small",
11274
- type: "submit",
11275
- isLoading: isSubmitting || isAddingPromotions,
11276
- children: "Save"
11277
- }
11278
- )
11279
- ] }) })
10881
+ const isReady = !isPending && !!order;
10882
+ return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
10883
+ /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
10884
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Metadata" }) }),
10885
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Add metadata to the draft order." }) })
10886
+ ] }),
10887
+ !isReady ? /* @__PURE__ */ jsxRuntime.jsx(PlaceholderInner, {}) : /* @__PURE__ */ jsxRuntime.jsx(MetadataForm, { orderId: id, metadata: order == null ? void 0 : order.metadata })
11280
10888
  ] });
11281
10889
  };
11282
- const PromotionItem = ({
11283
- promotion,
11284
- orderId,
11285
- isLoading
11286
- }) => {
11287
- var _a;
11288
- const { mutateAsync: removePromotions, isPending } = useDraftOrderRemovePromotions(orderId);
11289
- const onRemove = async () => {
11290
- removePromotions(
10890
+ const METADATA_KEY_LABEL_ID = "metadata-form-key-label";
10891
+ const METADATA_VALUE_LABEL_ID = "metadata-form-value-label";
10892
+ const MetadataForm = ({ orderId, metadata }) => {
10893
+ const { handleSuccess } = useRouteModal();
10894
+ const hasUneditableRows = getHasUneditableRows(metadata);
10895
+ const { mutateAsync, isPending } = useUpdateDraftOrder(orderId);
10896
+ const form = reactHookForm.useForm({
10897
+ defaultValues: {
10898
+ metadata: getDefaultValues(metadata)
10899
+ },
10900
+ resolver: zod.zodResolver(MetadataSchema)
10901
+ });
10902
+ const handleSubmit = form.handleSubmit(async (data) => {
10903
+ const parsedData = parseValues(data);
10904
+ await mutateAsync(
11291
10905
  {
11292
- promo_codes: [promotion.code]
10906
+ metadata: parsedData
11293
10907
  },
11294
10908
  {
11295
- onError: (e) => {
11296
- ui.toast.error(e.message);
10909
+ onSuccess: () => {
10910
+ ui.toast.success("Metadata updated");
10911
+ handleSuccess();
10912
+ },
10913
+ onError: (error) => {
10914
+ ui.toast.error(error.message);
11297
10915
  }
11298
10916
  }
11299
10917
  );
11300
- };
11301
- const displayValue = getDisplayValue(promotion);
11302
- return /* @__PURE__ */ jsxRuntime.jsxs(
11303
- "div",
10918
+ });
10919
+ const { fields, insert, remove } = reactHookForm.useFieldArray({
10920
+ control: form.control,
10921
+ name: "metadata"
10922
+ });
10923
+ function deleteRow(index) {
10924
+ remove(index);
10925
+ if (fields.length === 1) {
10926
+ insert(0, {
10927
+ key: "",
10928
+ value: "",
10929
+ disabled: false
10930
+ });
10931
+ }
10932
+ }
10933
+ function insertRow(index, position) {
10934
+ insert(index + (position === "above" ? 0 : 1), {
10935
+ key: "",
10936
+ value: "",
10937
+ disabled: false
10938
+ });
10939
+ }
10940
+ return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
10941
+ KeyboundForm,
11304
10942
  {
11305
- className: ui.clx(
11306
- "bg-ui-bg-component shadow-elevation-card-rest flex items-center justify-between rounded-lg px-3 py-2",
11307
- {
11308
- "animate-pulse": isLoading
11309
- }
11310
- ),
10943
+ onSubmit: handleSubmit,
10944
+ className: "flex flex-1 flex-col overflow-hidden",
11311
10945
  children: [
11312
- /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
11313
- /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", weight: "plus", leading: "compact", children: promotion.code }),
11314
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-ui-fg-subtle flex items-center gap-1.5", children: [
11315
- displayValue && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1.5", children: [
11316
- /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", leading: "compact", children: displayValue }),
11317
- /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", leading: "compact", children: "·" })
10946
+ /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Body, { className: "flex flex-1 flex-col gap-y-8 overflow-y-auto", children: [
10947
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-ui-bg-base shadow-elevation-card-rest grid grid-cols-1 divide-y rounded-lg", children: [
10948
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-ui-bg-subtle grid grid-cols-2 divide-x rounded-t-lg", children: [
10949
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "txt-compact-small-plus text-ui-fg-subtle px-2 py-1.5", children: /* @__PURE__ */ jsxRuntime.jsx("label", { id: METADATA_KEY_LABEL_ID, children: "Key" }) }),
10950
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "txt-compact-small-plus text-ui-fg-subtle px-2 py-1.5", children: /* @__PURE__ */ jsxRuntime.jsx("label", { id: METADATA_VALUE_LABEL_ID, children: "Value" }) })
11318
10951
  ] }),
11319
- /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", leading: "compact", className: "capitalize", children: (_a = promotion.application_method) == null ? void 0 : _a.allocation })
11320
- ] })
11321
- ] }),
11322
- /* @__PURE__ */ jsxRuntime.jsx(
11323
- ui.IconButton,
11324
- {
11325
- size: "small",
11326
- type: "button",
11327
- variant: "transparent",
11328
- onClick: onRemove,
11329
- isLoading: isPending || isLoading,
11330
- children: /* @__PURE__ */ jsxRuntime.jsx(icons.XMark, {})
11331
- }
11332
- )
11333
- ]
11334
- },
11335
- promotion.id
11336
- );
11337
- };
11338
- function getDisplayValue(promotion) {
11339
- var _a, _b, _c, _d;
11340
- const value = (_a = promotion.application_method) == null ? void 0 : _a.value;
11341
- if (!value) {
10952
+ fields.map((field, index) => {
10953
+ const isDisabled = field.disabled || false;
10954
+ let placeholder = "-";
10955
+ if (typeof field.value === "object") {
10956
+ placeholder = "{ ... }";
10957
+ }
10958
+ if (Array.isArray(field.value)) {
10959
+ placeholder = "[ ... ]";
10960
+ }
10961
+ return /* @__PURE__ */ jsxRuntime.jsx(
10962
+ ConditionalTooltip,
10963
+ {
10964
+ showTooltip: isDisabled,
10965
+ content: "This row is disabled because it contains non-primitive data.",
10966
+ children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "group/table relative", children: [
10967
+ /* @__PURE__ */ jsxRuntime.jsxs(
10968
+ "div",
10969
+ {
10970
+ className: ui.clx("grid grid-cols-2 divide-x", {
10971
+ "overflow-hidden rounded-b-lg": index === fields.length - 1
10972
+ }),
10973
+ children: [
10974
+ /* @__PURE__ */ jsxRuntime.jsx(
10975
+ Form$2.Field,
10976
+ {
10977
+ control: form.control,
10978
+ name: `metadata.${index}.key`,
10979
+ render: ({ field: field2 }) => {
10980
+ return /* @__PURE__ */ jsxRuntime.jsx(Form$2.Item, { children: /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
10981
+ GridInput,
10982
+ {
10983
+ "aria-labelledby": METADATA_KEY_LABEL_ID,
10984
+ ...field2,
10985
+ disabled: isDisabled,
10986
+ placeholder: "Key"
10987
+ }
10988
+ ) }) });
10989
+ }
10990
+ }
10991
+ ),
10992
+ /* @__PURE__ */ jsxRuntime.jsx(
10993
+ Form$2.Field,
10994
+ {
10995
+ control: form.control,
10996
+ name: `metadata.${index}.value`,
10997
+ render: ({ field: { value, ...field2 } }) => {
10998
+ return /* @__PURE__ */ jsxRuntime.jsx(Form$2.Item, { children: /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
10999
+ GridInput,
11000
+ {
11001
+ "aria-labelledby": METADATA_VALUE_LABEL_ID,
11002
+ ...field2,
11003
+ value: isDisabled ? placeholder : value,
11004
+ disabled: isDisabled,
11005
+ placeholder: "Value"
11006
+ }
11007
+ ) }) });
11008
+ }
11009
+ }
11010
+ )
11011
+ ]
11012
+ }
11013
+ ),
11014
+ /* @__PURE__ */ jsxRuntime.jsxs(ui.DropdownMenu, { children: [
11015
+ /* @__PURE__ */ jsxRuntime.jsx(
11016
+ ui.DropdownMenu.Trigger,
11017
+ {
11018
+ className: ui.clx(
11019
+ "invisible absolute inset-y-0 -right-2.5 my-auto group-hover/table:visible data-[state='open']:visible",
11020
+ {
11021
+ hidden: isDisabled
11022
+ }
11023
+ ),
11024
+ disabled: isDisabled,
11025
+ asChild: true,
11026
+ children: /* @__PURE__ */ jsxRuntime.jsx(ui.IconButton, { size: "2xsmall", children: /* @__PURE__ */ jsxRuntime.jsx(icons.EllipsisVertical, {}) })
11027
+ }
11028
+ ),
11029
+ /* @__PURE__ */ jsxRuntime.jsxs(ui.DropdownMenu.Content, { children: [
11030
+ /* @__PURE__ */ jsxRuntime.jsxs(
11031
+ ui.DropdownMenu.Item,
11032
+ {
11033
+ className: "gap-x-2",
11034
+ onClick: () => insertRow(index, "above"),
11035
+ children: [
11036
+ /* @__PURE__ */ jsxRuntime.jsx(icons.ArrowUpMini, { className: "text-ui-fg-subtle" }),
11037
+ "Insert row above"
11038
+ ]
11039
+ }
11040
+ ),
11041
+ /* @__PURE__ */ jsxRuntime.jsxs(
11042
+ ui.DropdownMenu.Item,
11043
+ {
11044
+ className: "gap-x-2",
11045
+ onClick: () => insertRow(index, "below"),
11046
+ children: [
11047
+ /* @__PURE__ */ jsxRuntime.jsx(icons.ArrowDownMini, { className: "text-ui-fg-subtle" }),
11048
+ "Insert row below"
11049
+ ]
11050
+ }
11051
+ ),
11052
+ /* @__PURE__ */ jsxRuntime.jsx(ui.DropdownMenu.Separator, {}),
11053
+ /* @__PURE__ */ jsxRuntime.jsxs(
11054
+ ui.DropdownMenu.Item,
11055
+ {
11056
+ className: "gap-x-2",
11057
+ onClick: () => deleteRow(index),
11058
+ children: [
11059
+ /* @__PURE__ */ jsxRuntime.jsx(icons.Trash, { className: "text-ui-fg-subtle" }),
11060
+ "Delete row"
11061
+ ]
11062
+ }
11063
+ )
11064
+ ] })
11065
+ ] })
11066
+ ] })
11067
+ },
11068
+ field.id
11069
+ );
11070
+ })
11071
+ ] }),
11072
+ hasUneditableRows && /* @__PURE__ */ jsxRuntime.jsx(InlineTip, { variant: "warning", label: "Some rows are disabled", children: "This object contains non-primitive metadata, such as arrays or objects, that can't be edited here. To edit the disabled rows, use the API directly." })
11073
+ ] }),
11074
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
11075
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", type: "button", children: "Cancel" }) }),
11076
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
11077
+ ] }) })
11078
+ ]
11079
+ }
11080
+ ) });
11081
+ };
11082
+ const GridInput = React.forwardRef(({ className, ...props }, ref) => {
11083
+ return /* @__PURE__ */ jsxRuntime.jsx(
11084
+ "input",
11085
+ {
11086
+ ref,
11087
+ ...props,
11088
+ autoComplete: "off",
11089
+ className: ui.clx(
11090
+ "txt-compact-small text-ui-fg-base placeholder:text-ui-fg-muted disabled:text-ui-fg-disabled disabled:bg-ui-bg-base bg-transparent px-2 py-1.5 outline-none",
11091
+ className
11092
+ )
11093
+ }
11094
+ );
11095
+ });
11096
+ GridInput.displayName = "MetadataForm.GridInput";
11097
+ const PlaceholderInner = () => {
11098
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-1 flex-col overflow-hidden", children: [
11099
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Skeleton, { className: "h-[148ox] w-full rounded-lg" }) }),
11100
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
11101
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Skeleton, { className: "h-7 w-12 rounded-md" }),
11102
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Skeleton, { className: "h-7 w-12 rounded-md" })
11103
+ ] }) })
11104
+ ] });
11105
+ };
11106
+ const EDITABLE_TYPES = ["string", "number", "boolean"];
11107
+ function getDefaultValues(metadata) {
11108
+ if (!metadata || !Object.keys(metadata).length) {
11109
+ return [
11110
+ {
11111
+ key: "",
11112
+ value: "",
11113
+ disabled: false
11114
+ }
11115
+ ];
11116
+ }
11117
+ return Object.entries(metadata).map(([key, value]) => {
11118
+ if (!EDITABLE_TYPES.includes(typeof value)) {
11119
+ return {
11120
+ key,
11121
+ value,
11122
+ disabled: true
11123
+ };
11124
+ }
11125
+ let stringValue = value;
11126
+ if (typeof value !== "string") {
11127
+ stringValue = JSON.stringify(value);
11128
+ }
11129
+ return {
11130
+ key,
11131
+ value: stringValue,
11132
+ original_key: key
11133
+ };
11134
+ });
11135
+ }
11136
+ function parseValues(values) {
11137
+ const metadata = values.metadata;
11138
+ const isEmpty = !metadata.length || metadata.length === 1 && !metadata[0].key && !metadata[0].value;
11139
+ if (isEmpty) {
11342
11140
  return null;
11343
11141
  }
11344
- if (((_b = promotion.application_method) == null ? void 0 : _b.type) === "fixed") {
11345
- const currency = (_c = promotion.application_method) == null ? void 0 : _c.currency_code;
11346
- if (!currency) {
11347
- return null;
11142
+ const update = {};
11143
+ metadata.forEach((field) => {
11144
+ let key = field.key;
11145
+ let value = field.value;
11146
+ const disabled = field.disabled;
11147
+ if (!key || !value) {
11148
+ return;
11149
+ }
11150
+ if (disabled) {
11151
+ update[key] = value;
11152
+ return;
11153
+ }
11154
+ key = key.trim();
11155
+ value = value.trim();
11156
+ if (value === "true") {
11157
+ update[key] = true;
11158
+ } else if (value === "false") {
11159
+ update[key] = false;
11160
+ } else {
11161
+ const parsedNumber = parseFloat(value);
11162
+ if (!isNaN(parsedNumber)) {
11163
+ update[key] = parsedNumber;
11164
+ } else {
11165
+ update[key] = value;
11166
+ }
11167
+ }
11168
+ });
11169
+ return update;
11170
+ }
11171
+ function getHasUneditableRows(metadata) {
11172
+ if (!metadata) {
11173
+ return false;
11174
+ }
11175
+ return Object.values(metadata).some(
11176
+ (value) => !EDITABLE_TYPES.includes(typeof value)
11177
+ );
11178
+ }
11179
+ const PROMOTION_QUERY_KEY = "promotions";
11180
+ const promotionsQueryKeys = {
11181
+ list: (query2) => [
11182
+ PROMOTION_QUERY_KEY,
11183
+ query2 ? query2 : void 0
11184
+ ],
11185
+ detail: (id, query2) => [
11186
+ PROMOTION_QUERY_KEY,
11187
+ id,
11188
+ query2 ? query2 : void 0
11189
+ ]
11190
+ };
11191
+ const usePromotions = (query2, options) => {
11192
+ const { data, ...rest } = reactQuery.useQuery({
11193
+ queryKey: promotionsQueryKeys.list(query2),
11194
+ queryFn: async () => sdk.admin.promotion.list(query2),
11195
+ ...options
11196
+ });
11197
+ return { ...data, ...rest };
11198
+ };
11199
+ const Promotions = () => {
11200
+ const { id } = reactRouterDom.useParams();
11201
+ const {
11202
+ order: preview,
11203
+ isError: isPreviewError,
11204
+ error: previewError
11205
+ } = useOrderPreview(id, void 0);
11206
+ useInitiateOrderEdit({ preview });
11207
+ const { onCancel } = useCancelOrderEdit({ preview });
11208
+ if (isPreviewError) {
11209
+ throw previewError;
11210
+ }
11211
+ const isReady = !!preview;
11212
+ return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { onClose: onCancel, children: [
11213
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Header, { children: /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Promotions" }) }) }),
11214
+ isReady && /* @__PURE__ */ jsxRuntime.jsx(PromotionForm, { preview })
11215
+ ] });
11216
+ };
11217
+ const PromotionForm = ({ preview }) => {
11218
+ const { items, shipping_methods } = preview;
11219
+ const [isSubmitting, setIsSubmitting] = React.useState(false);
11220
+ const [comboboxValue, setComboboxValue] = React.useState("");
11221
+ const { handleSuccess } = useRouteModal();
11222
+ const { mutateAsync: addPromotions, isPending: isAddingPromotions } = useDraftOrderAddPromotions(preview.id);
11223
+ const promoIds = getPromotionIds(items, shipping_methods);
11224
+ const { promotions, isPending, isError, error } = usePromotions(
11225
+ {
11226
+ id: promoIds
11227
+ },
11228
+ {
11229
+ enabled: !!promoIds.length
11230
+ }
11231
+ );
11232
+ const comboboxData = useComboboxData({
11233
+ queryKey: ["promotions", "combobox", promoIds],
11234
+ queryFn: async (params) => {
11235
+ return await sdk.admin.promotion.list({
11236
+ ...params,
11237
+ id: {
11238
+ $nin: promoIds
11239
+ }
11240
+ });
11241
+ },
11242
+ getOptions: (data) => {
11243
+ return data.promotions.map((promotion) => ({
11244
+ label: promotion.code,
11245
+ value: promotion.code
11246
+ }));
11247
+ }
11248
+ });
11249
+ const add = async (value) => {
11250
+ if (!value) {
11251
+ return;
11252
+ }
11253
+ addPromotions(
11254
+ {
11255
+ promo_codes: [value]
11256
+ },
11257
+ {
11258
+ onError: (e) => {
11259
+ ui.toast.error(e.message);
11260
+ comboboxData.onSearchValueChange("");
11261
+ setComboboxValue("");
11262
+ },
11263
+ onSuccess: () => {
11264
+ comboboxData.onSearchValueChange("");
11265
+ setComboboxValue("");
11266
+ }
11267
+ }
11268
+ );
11269
+ };
11270
+ const { mutateAsync: confirmOrderEdit } = useDraftOrderConfirmEdit(preview.id);
11271
+ const { mutateAsync: requestOrderEdit } = useOrderEditRequest(preview.id);
11272
+ const onSubmit = async () => {
11273
+ setIsSubmitting(true);
11274
+ let requestSucceeded = false;
11275
+ await requestOrderEdit(void 0, {
11276
+ onError: (e) => {
11277
+ ui.toast.error(e.message);
11278
+ },
11279
+ onSuccess: () => {
11280
+ requestSucceeded = true;
11281
+ }
11282
+ });
11283
+ if (!requestSucceeded) {
11284
+ setIsSubmitting(false);
11285
+ return;
11286
+ }
11287
+ await confirmOrderEdit(void 0, {
11288
+ onError: (e) => {
11289
+ ui.toast.error(e.message);
11290
+ },
11291
+ onSuccess: () => {
11292
+ handleSuccess();
11293
+ },
11294
+ onSettled: () => {
11295
+ setIsSubmitting(false);
11296
+ }
11297
+ });
11298
+ };
11299
+ if (isError) {
11300
+ throw error;
11301
+ }
11302
+ return /* @__PURE__ */ jsxRuntime.jsxs(KeyboundForm, { className: "flex flex-1 flex-col", onSubmit, children: [
11303
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-4", children: [
11304
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-3", children: [
11305
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col", children: [
11306
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Label, { size: "small", weight: "plus", htmlFor: "promotion-combobox", children: "Apply promotions" }),
11307
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Hint, { id: "promotion-combobox-hint", children: "Manage promotions that should be applied to the order." })
11308
+ ] }),
11309
+ /* @__PURE__ */ jsxRuntime.jsx(
11310
+ Combobox,
11311
+ {
11312
+ id: "promotion-combobox",
11313
+ "aria-describedby": "promotion-combobox-hint",
11314
+ isFetchingNextPage: comboboxData.isFetchingNextPage,
11315
+ fetchNextPage: comboboxData.fetchNextPage,
11316
+ options: comboboxData.options,
11317
+ onSearchValueChange: comboboxData.onSearchValueChange,
11318
+ searchValue: comboboxData.searchValue,
11319
+ disabled: comboboxData.disabled || isAddingPromotions,
11320
+ onChange: add,
11321
+ value: comboboxValue
11322
+ }
11323
+ )
11324
+ ] }),
11325
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Divider, { variant: "dashed" }),
11326
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col gap-2", children: promotions == null ? void 0 : promotions.map((promotion) => /* @__PURE__ */ jsxRuntime.jsx(
11327
+ PromotionItem,
11328
+ {
11329
+ promotion,
11330
+ orderId: preview.id,
11331
+ isLoading: isPending
11332
+ },
11333
+ promotion.id
11334
+ )) })
11335
+ ] }) }),
11336
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
11337
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
11338
+ /* @__PURE__ */ jsxRuntime.jsx(
11339
+ ui.Button,
11340
+ {
11341
+ size: "small",
11342
+ type: "submit",
11343
+ isLoading: isSubmitting || isAddingPromotions,
11344
+ children: "Save"
11345
+ }
11346
+ )
11347
+ ] }) })
11348
+ ] });
11349
+ };
11350
+ const PromotionItem = ({
11351
+ promotion,
11352
+ orderId,
11353
+ isLoading
11354
+ }) => {
11355
+ var _a;
11356
+ const { mutateAsync: removePromotions, isPending } = useDraftOrderRemovePromotions(orderId);
11357
+ const onRemove = async () => {
11358
+ removePromotions(
11359
+ {
11360
+ promo_codes: [promotion.code]
11361
+ },
11362
+ {
11363
+ onError: (e) => {
11364
+ ui.toast.error(e.message);
11365
+ }
11366
+ }
11367
+ );
11368
+ };
11369
+ const displayValue = getDisplayValue(promotion);
11370
+ return /* @__PURE__ */ jsxRuntime.jsxs(
11371
+ "div",
11372
+ {
11373
+ className: ui.clx(
11374
+ "bg-ui-bg-component shadow-elevation-card-rest flex items-center justify-between rounded-lg px-3 py-2",
11375
+ {
11376
+ "animate-pulse": isLoading
11377
+ }
11378
+ ),
11379
+ children: [
11380
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
11381
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", weight: "plus", leading: "compact", children: promotion.code }),
11382
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-ui-fg-subtle flex items-center gap-1.5", children: [
11383
+ displayValue && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1.5", children: [
11384
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", leading: "compact", children: displayValue }),
11385
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", leading: "compact", children: "·" })
11386
+ ] }),
11387
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", leading: "compact", className: "capitalize", children: (_a = promotion.application_method) == null ? void 0 : _a.allocation })
11388
+ ] })
11389
+ ] }),
11390
+ /* @__PURE__ */ jsxRuntime.jsx(
11391
+ ui.IconButton,
11392
+ {
11393
+ size: "small",
11394
+ type: "button",
11395
+ variant: "transparent",
11396
+ onClick: onRemove,
11397
+ isLoading: isPending || isLoading,
11398
+ children: /* @__PURE__ */ jsxRuntime.jsx(icons.XMark, {})
11399
+ }
11400
+ )
11401
+ ]
11402
+ },
11403
+ promotion.id
11404
+ );
11405
+ };
11406
+ function getDisplayValue(promotion) {
11407
+ var _a, _b, _c, _d;
11408
+ const value = (_a = promotion.application_method) == null ? void 0 : _a.value;
11409
+ if (!value) {
11410
+ return null;
11411
+ }
11412
+ if (((_b = promotion.application_method) == null ? void 0 : _b.type) === "fixed") {
11413
+ const currency = (_c = promotion.application_method) == null ? void 0 : _c.currency_code;
11414
+ if (!currency) {
11415
+ return null;
11416
+ }
11417
+ return getLocaleAmount(value, currency);
11418
+ } else if (((_d = promotion.application_method) == null ? void 0 : _d.type) === "percentage") {
11419
+ return formatPercentage(value);
11420
+ }
11421
+ return null;
11422
+ }
11423
+ const formatter = new Intl.NumberFormat([], {
11424
+ style: "percent",
11425
+ minimumFractionDigits: 2
11426
+ });
11427
+ const formatPercentage = (value, isPercentageValue = false) => {
11428
+ let val = value || 0;
11429
+ if (!isPercentageValue) {
11430
+ val = val / 100;
11431
+ }
11432
+ return formatter.format(val);
11433
+ };
11434
+ function getPromotionIds(items, shippingMethods) {
11435
+ const promotionIds = /* @__PURE__ */ new Set();
11436
+ for (const item of items) {
11437
+ if (item.adjustments) {
11438
+ for (const adjustment of item.adjustments) {
11439
+ if (adjustment.promotion_id) {
11440
+ promotionIds.add(adjustment.promotion_id);
11441
+ }
11442
+ }
11443
+ }
11444
+ }
11445
+ for (const shippingMethod of shippingMethods) {
11446
+ if (shippingMethod.adjustments) {
11447
+ for (const adjustment of shippingMethod.adjustments) {
11448
+ if (adjustment.promotion_id) {
11449
+ promotionIds.add(adjustment.promotion_id);
11450
+ }
11451
+ }
11452
+ }
11453
+ }
11454
+ return Array.from(promotionIds);
11455
+ }
11456
+ const SalesChannel = () => {
11457
+ const { id } = reactRouterDom.useParams();
11458
+ const { draft_order, isPending, isError, error } = useDraftOrder(
11459
+ id,
11460
+ {
11461
+ fields: "+sales_channel_id"
11462
+ },
11463
+ {
11464
+ enabled: !!id
11465
+ }
11466
+ );
11467
+ if (isError) {
11468
+ throw error;
11469
+ }
11470
+ const ISrEADY = !!draft_order && !isPending;
11471
+ return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
11472
+ /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
11473
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Sales Channel" }) }),
11474
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Update which sales channel the draft order is associated with" }) })
11475
+ ] }),
11476
+ ISrEADY && /* @__PURE__ */ jsxRuntime.jsx(SalesChannelForm, { order: draft_order })
11477
+ ] });
11478
+ };
11479
+ const SalesChannelForm = ({ order }) => {
11480
+ const form = reactHookForm.useForm({
11481
+ defaultValues: {
11482
+ sales_channel_id: order.sales_channel_id || ""
11483
+ },
11484
+ resolver: zod.zodResolver(schema$2)
11485
+ });
11486
+ const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
11487
+ const { handleSuccess } = useRouteModal();
11488
+ const onSubmit = form.handleSubmit(async (data) => {
11489
+ await mutateAsync(
11490
+ {
11491
+ sales_channel_id: data.sales_channel_id
11492
+ },
11493
+ {
11494
+ onSuccess: () => {
11495
+ ui.toast.success("Sales channel updated");
11496
+ handleSuccess();
11497
+ },
11498
+ onError: (error) => {
11499
+ ui.toast.error(error.message);
11500
+ }
11501
+ }
11502
+ );
11503
+ });
11504
+ return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
11505
+ KeyboundForm,
11506
+ {
11507
+ className: "flex flex-1 flex-col overflow-hidden",
11508
+ onSubmit,
11509
+ children: [
11510
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsx(SalesChannelField, { control: form.control, order }) }),
11511
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
11512
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
11513
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
11514
+ ] }) })
11515
+ ]
11516
+ }
11517
+ ) });
11518
+ };
11519
+ const SalesChannelField = ({ control, order }) => {
11520
+ const salesChannels = useComboboxData({
11521
+ queryFn: async (params) => {
11522
+ return await sdk.admin.salesChannel.list(params);
11523
+ },
11524
+ queryKey: ["sales-channels"],
11525
+ getOptions: (data) => {
11526
+ return data.sales_channels.map((salesChannel) => ({
11527
+ label: salesChannel.name,
11528
+ value: salesChannel.id
11529
+ }));
11530
+ },
11531
+ defaultValue: order.sales_channel_id || void 0
11532
+ });
11533
+ return /* @__PURE__ */ jsxRuntime.jsx(
11534
+ Form$2.Field,
11535
+ {
11536
+ control,
11537
+ name: "sales_channel_id",
11538
+ render: ({ field }) => {
11539
+ return /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11540
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Sales Channel" }),
11541
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
11542
+ Combobox,
11543
+ {
11544
+ options: salesChannels.options,
11545
+ fetchNextPage: salesChannels.fetchNextPage,
11546
+ isFetchingNextPage: salesChannels.isFetchingNextPage,
11547
+ searchValue: salesChannels.searchValue,
11548
+ onSearchValueChange: salesChannels.onSearchValueChange,
11549
+ placeholder: "Select sales channel",
11550
+ ...field
11551
+ }
11552
+ ) }),
11553
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11554
+ ] });
11555
+ }
11556
+ }
11557
+ );
11558
+ };
11559
+ const schema$2 = objectType({
11560
+ sales_channel_id: stringType().min(1)
11561
+ });
11562
+ const ShippingAddress = () => {
11563
+ const { id } = reactRouterDom.useParams();
11564
+ const { order, isPending, isError, error } = useOrder(id, {
11565
+ fields: "+shipping_address"
11566
+ });
11567
+ if (isError) {
11568
+ throw error;
11569
+ }
11570
+ const isReady = !isPending && !!order;
11571
+ return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
11572
+ /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
11573
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Shipping Address" }) }),
11574
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit the shipping address for the draft order" }) })
11575
+ ] }),
11576
+ isReady && /* @__PURE__ */ jsxRuntime.jsx(ShippingAddressForm, { order })
11577
+ ] });
11578
+ };
11579
+ const ShippingAddressForm = ({ order }) => {
11580
+ var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
11581
+ const form = reactHookForm.useForm({
11582
+ defaultValues: {
11583
+ first_name: ((_a = order.shipping_address) == null ? void 0 : _a.first_name) ?? "",
11584
+ last_name: ((_b = order.shipping_address) == null ? void 0 : _b.last_name) ?? "",
11585
+ company: ((_c = order.shipping_address) == null ? void 0 : _c.company) ?? "",
11586
+ address_1: ((_d = order.shipping_address) == null ? void 0 : _d.address_1) ?? "",
11587
+ address_2: ((_e = order.shipping_address) == null ? void 0 : _e.address_2) ?? "",
11588
+ city: ((_f = order.shipping_address) == null ? void 0 : _f.city) ?? "",
11589
+ province: ((_g = order.shipping_address) == null ? void 0 : _g.province) ?? "",
11590
+ country_code: ((_h = order.shipping_address) == null ? void 0 : _h.country_code) ?? "",
11591
+ postal_code: ((_i = order.shipping_address) == null ? void 0 : _i.postal_code) ?? "",
11592
+ phone: ((_j = order.shipping_address) == null ? void 0 : _j.phone) ?? ""
11593
+ },
11594
+ resolver: zod.zodResolver(schema$1)
11595
+ });
11596
+ const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
11597
+ const { handleSuccess } = useRouteModal();
11598
+ const onSubmit = form.handleSubmit(async (data) => {
11599
+ await mutateAsync(
11600
+ {
11601
+ shipping_address: {
11602
+ first_name: data.first_name,
11603
+ last_name: data.last_name,
11604
+ company: data.company,
11605
+ address_1: data.address_1,
11606
+ address_2: data.address_2,
11607
+ city: data.city,
11608
+ province: data.province,
11609
+ country_code: data.country_code,
11610
+ postal_code: data.postal_code,
11611
+ phone: data.phone
11612
+ }
11613
+ },
11614
+ {
11615
+ onSuccess: () => {
11616
+ handleSuccess();
11617
+ },
11618
+ onError: (error) => {
11619
+ ui.toast.error(error.message);
11620
+ }
11621
+ }
11622
+ );
11623
+ });
11624
+ return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
11625
+ KeyboundForm,
11626
+ {
11627
+ className: "flex flex-1 flex-col overflow-hidden",
11628
+ onSubmit,
11629
+ children: [
11630
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-y-4", children: [
11631
+ /* @__PURE__ */ jsxRuntime.jsx(
11632
+ Form$2.Field,
11633
+ {
11634
+ control: form.control,
11635
+ name: "country_code",
11636
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11637
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Country" }),
11638
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(CountrySelect, { ...field }) }),
11639
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11640
+ ] })
11641
+ }
11642
+ ),
11643
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
11644
+ /* @__PURE__ */ jsxRuntime.jsx(
11645
+ Form$2.Field,
11646
+ {
11647
+ control: form.control,
11648
+ name: "first_name",
11649
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11650
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "First name" }),
11651
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11652
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11653
+ ] })
11654
+ }
11655
+ ),
11656
+ /* @__PURE__ */ jsxRuntime.jsx(
11657
+ Form$2.Field,
11658
+ {
11659
+ control: form.control,
11660
+ name: "last_name",
11661
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11662
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Last name" }),
11663
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11664
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11665
+ ] })
11666
+ }
11667
+ )
11668
+ ] }),
11669
+ /* @__PURE__ */ jsxRuntime.jsx(
11670
+ Form$2.Field,
11671
+ {
11672
+ control: form.control,
11673
+ name: "company",
11674
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11675
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Company" }),
11676
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11677
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11678
+ ] })
11679
+ }
11680
+ ),
11681
+ /* @__PURE__ */ jsxRuntime.jsx(
11682
+ Form$2.Field,
11683
+ {
11684
+ control: form.control,
11685
+ name: "address_1",
11686
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11687
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Address" }),
11688
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11689
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11690
+ ] })
11691
+ }
11692
+ ),
11693
+ /* @__PURE__ */ jsxRuntime.jsx(
11694
+ Form$2.Field,
11695
+ {
11696
+ control: form.control,
11697
+ name: "address_2",
11698
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11699
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Apartment, suite, etc." }),
11700
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11701
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11702
+ ] })
11703
+ }
11704
+ ),
11705
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
11706
+ /* @__PURE__ */ jsxRuntime.jsx(
11707
+ Form$2.Field,
11708
+ {
11709
+ control: form.control,
11710
+ name: "postal_code",
11711
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11712
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Postal code" }),
11713
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11714
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11715
+ ] })
11716
+ }
11717
+ ),
11718
+ /* @__PURE__ */ jsxRuntime.jsx(
11719
+ Form$2.Field,
11720
+ {
11721
+ control: form.control,
11722
+ name: "city",
11723
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11724
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "City" }),
11725
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11726
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11727
+ ] })
11728
+ }
11729
+ )
11730
+ ] }),
11731
+ /* @__PURE__ */ jsxRuntime.jsx(
11732
+ Form$2.Field,
11733
+ {
11734
+ control: form.control,
11735
+ name: "province",
11736
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11737
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Province / State" }),
11738
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11739
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11740
+ ] })
11741
+ }
11742
+ ),
11743
+ /* @__PURE__ */ jsxRuntime.jsx(
11744
+ Form$2.Field,
11745
+ {
11746
+ control: form.control,
11747
+ name: "phone",
11748
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11749
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Phone" }),
11750
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11751
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11752
+ ] })
11753
+ }
11754
+ )
11755
+ ] }) }),
11756
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
11757
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
11758
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
11759
+ ] }) })
11760
+ ]
11348
11761
  }
11349
- return getLocaleAmount(value, currency);
11350
- } else if (((_d = promotion.application_method) == null ? void 0 : _d.type) === "percentage") {
11351
- return formatPercentage(value);
11352
- }
11353
- return null;
11354
- }
11355
- const formatter = new Intl.NumberFormat([], {
11356
- style: "percent",
11357
- minimumFractionDigits: 2
11358
- });
11359
- const formatPercentage = (value, isPercentageValue = false) => {
11360
- let val = value || 0;
11361
- if (!isPercentageValue) {
11362
- val = val / 100;
11363
- }
11364
- return formatter.format(val);
11762
+ ) });
11365
11763
  };
11366
- function getPromotionIds(items, shippingMethods) {
11367
- const promotionIds = /* @__PURE__ */ new Set();
11368
- for (const item of items) {
11369
- if (item.adjustments) {
11370
- for (const adjustment of item.adjustments) {
11371
- if (adjustment.promotion_id) {
11372
- promotionIds.add(adjustment.promotion_id);
11373
- }
11374
- }
11375
- }
11376
- }
11377
- for (const shippingMethod of shippingMethods) {
11378
- if (shippingMethod.adjustments) {
11379
- for (const adjustment of shippingMethod.adjustments) {
11380
- if (adjustment.promotion_id) {
11381
- promotionIds.add(adjustment.promotion_id);
11382
- }
11383
- }
11384
- }
11385
- }
11386
- return Array.from(promotionIds);
11387
- }
11764
+ const schema$1 = addressSchema;
11388
11765
  const STACKED_FOCUS_MODAL_ID = "shipping-form";
11389
11766
  const Shipping = () => {
11390
11767
  var _a;
@@ -12154,247 +12531,44 @@ const ShippingOptionField = ({
12154
12531
  placeholder: "Select shipping option",
12155
12532
  ...field,
12156
12533
  disabled: !locationId || !shippingProfileId
12157
- }
12158
- ) }) })
12159
- }
12160
- )
12161
- ] }) });
12162
- }
12163
- }
12164
- );
12165
- };
12166
- const CustomAmountField = ({
12167
- control,
12168
- currencyCode
12169
- }) => {
12170
- return /* @__PURE__ */ jsxRuntime.jsx(
12171
- Form$2.Field,
12172
- {
12173
- control,
12174
- name: "custom_amount",
12175
- render: ({ field: { onChange, ...field } }) => {
12176
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-x-3", children: [
12177
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col", children: [
12178
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Custom amount" }),
12179
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Hint, { children: "Set a custom amount for the shipping option." })
12180
- ] }),
12181
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
12182
- ui.CurrencyInput,
12183
- {
12184
- ...field,
12185
- onValueChange: (value) => onChange(value),
12186
- symbol: getNativeSymbol(currencyCode),
12187
- code: currencyCode
12188
- }
12189
- ) })
12190
- ] });
12191
- }
12192
- }
12193
- );
12194
- };
12195
- const ShippingAddress = () => {
12196
- const { id } = reactRouterDom.useParams();
12197
- const { order, isPending, isError, error } = useOrder(id, {
12198
- fields: "+shipping_address"
12199
- });
12200
- if (isError) {
12201
- throw error;
12202
- }
12203
- const isReady = !isPending && !!order;
12204
- return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
12205
- /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
12206
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Shipping Address" }) }),
12207
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit the shipping address for the draft order" }) })
12208
- ] }),
12209
- isReady && /* @__PURE__ */ jsxRuntime.jsx(ShippingAddressForm, { order })
12210
- ] });
12211
- };
12212
- const ShippingAddressForm = ({ order }) => {
12213
- var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
12214
- const form = reactHookForm.useForm({
12215
- defaultValues: {
12216
- first_name: ((_a = order.shipping_address) == null ? void 0 : _a.first_name) ?? "",
12217
- last_name: ((_b = order.shipping_address) == null ? void 0 : _b.last_name) ?? "",
12218
- company: ((_c = order.shipping_address) == null ? void 0 : _c.company) ?? "",
12219
- address_1: ((_d = order.shipping_address) == null ? void 0 : _d.address_1) ?? "",
12220
- address_2: ((_e = order.shipping_address) == null ? void 0 : _e.address_2) ?? "",
12221
- city: ((_f = order.shipping_address) == null ? void 0 : _f.city) ?? "",
12222
- province: ((_g = order.shipping_address) == null ? void 0 : _g.province) ?? "",
12223
- country_code: ((_h = order.shipping_address) == null ? void 0 : _h.country_code) ?? "",
12224
- postal_code: ((_i = order.shipping_address) == null ? void 0 : _i.postal_code) ?? "",
12225
- phone: ((_j = order.shipping_address) == null ? void 0 : _j.phone) ?? ""
12226
- },
12227
- resolver: zod.zodResolver(schema$3)
12228
- });
12229
- const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
12230
- const { handleSuccess } = useRouteModal();
12231
- const onSubmit = form.handleSubmit(async (data) => {
12232
- await mutateAsync(
12233
- {
12234
- shipping_address: {
12235
- first_name: data.first_name,
12236
- last_name: data.last_name,
12237
- company: data.company,
12238
- address_1: data.address_1,
12239
- address_2: data.address_2,
12240
- city: data.city,
12241
- province: data.province,
12242
- country_code: data.country_code,
12243
- postal_code: data.postal_code,
12244
- phone: data.phone
12245
- }
12246
- },
12247
- {
12248
- onSuccess: () => {
12249
- handleSuccess();
12250
- },
12251
- onError: (error) => {
12252
- ui.toast.error(error.message);
12253
- }
12254
- }
12255
- );
12256
- });
12257
- return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
12258
- KeyboundForm,
12259
- {
12260
- className: "flex flex-1 flex-col overflow-hidden",
12261
- onSubmit,
12262
- children: [
12263
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-y-4", children: [
12264
- /* @__PURE__ */ jsxRuntime.jsx(
12265
- Form$2.Field,
12266
- {
12267
- control: form.control,
12268
- name: "country_code",
12269
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12270
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Country" }),
12271
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(CountrySelect, { ...field }) }),
12272
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12273
- ] })
12274
- }
12275
- ),
12276
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
12277
- /* @__PURE__ */ jsxRuntime.jsx(
12278
- Form$2.Field,
12279
- {
12280
- control: form.control,
12281
- name: "first_name",
12282
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12283
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "First name" }),
12284
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12285
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12286
- ] })
12287
- }
12288
- ),
12289
- /* @__PURE__ */ jsxRuntime.jsx(
12290
- Form$2.Field,
12291
- {
12292
- control: form.control,
12293
- name: "last_name",
12294
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12295
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Last name" }),
12296
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12297
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12298
- ] })
12299
- }
12300
- )
12301
- ] }),
12302
- /* @__PURE__ */ jsxRuntime.jsx(
12303
- Form$2.Field,
12304
- {
12305
- control: form.control,
12306
- name: "company",
12307
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12308
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Company" }),
12309
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12310
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12311
- ] })
12312
- }
12313
- ),
12314
- /* @__PURE__ */ jsxRuntime.jsx(
12315
- Form$2.Field,
12316
- {
12317
- control: form.control,
12318
- name: "address_1",
12319
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12320
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Address" }),
12321
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12322
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12323
- ] })
12324
- }
12325
- ),
12326
- /* @__PURE__ */ jsxRuntime.jsx(
12327
- Form$2.Field,
12328
- {
12329
- control: form.control,
12330
- name: "address_2",
12331
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12332
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Apartment, suite, etc." }),
12333
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12334
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12335
- ] })
12336
- }
12337
- ),
12338
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
12339
- /* @__PURE__ */ jsxRuntime.jsx(
12340
- Form$2.Field,
12341
- {
12342
- control: form.control,
12343
- name: "postal_code",
12344
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12345
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Postal code" }),
12346
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12347
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12348
- ] })
12349
- }
12350
- ),
12351
- /* @__PURE__ */ jsxRuntime.jsx(
12352
- Form$2.Field,
12353
- {
12354
- control: form.control,
12355
- name: "city",
12356
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12357
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "City" }),
12358
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12359
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12360
- ] })
12361
- }
12362
- )
12363
- ] }),
12364
- /* @__PURE__ */ jsxRuntime.jsx(
12365
- Form$2.Field,
12366
- {
12367
- control: form.control,
12368
- name: "province",
12369
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12370
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Province / State" }),
12371
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12372
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12373
- ] })
12534
+ }
12535
+ ) }) })
12374
12536
  }
12375
- ),
12376
- /* @__PURE__ */ jsxRuntime.jsx(
12377
- Form$2.Field,
12537
+ )
12538
+ ] }) });
12539
+ }
12540
+ }
12541
+ );
12542
+ };
12543
+ const CustomAmountField = ({
12544
+ control,
12545
+ currencyCode
12546
+ }) => {
12547
+ return /* @__PURE__ */ jsxRuntime.jsx(
12548
+ Form$2.Field,
12549
+ {
12550
+ control,
12551
+ name: "custom_amount",
12552
+ render: ({ field: { onChange, ...field } }) => {
12553
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-x-3", children: [
12554
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col", children: [
12555
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Custom amount" }),
12556
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Hint, { children: "Set a custom amount for the shipping option." })
12557
+ ] }),
12558
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
12559
+ ui.CurrencyInput,
12378
12560
  {
12379
- control: form.control,
12380
- name: "phone",
12381
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12382
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Phone" }),
12383
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12384
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12385
- ] })
12561
+ ...field,
12562
+ onValueChange: (value) => onChange(value),
12563
+ symbol: getNativeSymbol(currencyCode),
12564
+ code: currencyCode
12386
12565
  }
12387
- )
12388
- ] }) }),
12389
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
12390
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
12391
- /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
12392
- ] }) })
12393
- ]
12566
+ ) })
12567
+ ] });
12568
+ }
12394
12569
  }
12395
- ) });
12570
+ );
12396
12571
  };
12397
- const schema$3 = addressSchema;
12398
12572
  const TransferOwnership = () => {
12399
12573
  const { id } = reactRouterDom.useParams();
12400
12574
  const { draft_order, isPending, isError, error } = useDraftOrder(id, {
@@ -12418,7 +12592,7 @@ const TransferOwnershipForm = ({ order }) => {
12418
12592
  defaultValues: {
12419
12593
  customer_id: order.customer_id || ""
12420
12594
  },
12421
- resolver: zod.zodResolver(schema$2)
12595
+ resolver: zod.zodResolver(schema)
12422
12596
  });
12423
12597
  const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
12424
12598
  const { handleSuccess } = useRouteModal();
@@ -12868,182 +13042,8 @@ const Illustration = () => {
12868
13042
  }
12869
13043
  );
12870
13044
  };
12871
- const schema$2 = objectType({
12872
- customer_id: stringType().min(1)
12873
- });
12874
- const Email = () => {
12875
- const { id } = reactRouterDom.useParams();
12876
- const { order, isPending, isError, error } = useOrder(id, {
12877
- fields: "+email"
12878
- });
12879
- if (isError) {
12880
- throw error;
12881
- }
12882
- const isReady = !isPending && !!order;
12883
- return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
12884
- /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
12885
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Email" }) }),
12886
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit the email for the draft order" }) })
12887
- ] }),
12888
- isReady && /* @__PURE__ */ jsxRuntime.jsx(EmailForm, { order })
12889
- ] });
12890
- };
12891
- const EmailForm = ({ order }) => {
12892
- const form = reactHookForm.useForm({
12893
- defaultValues: {
12894
- email: order.email ?? ""
12895
- },
12896
- resolver: zod.zodResolver(schema$1)
12897
- });
12898
- const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
12899
- const { handleSuccess } = useRouteModal();
12900
- const onSubmit = form.handleSubmit(async (data) => {
12901
- await mutateAsync(
12902
- { email: data.email },
12903
- {
12904
- onSuccess: () => {
12905
- handleSuccess();
12906
- },
12907
- onError: (error) => {
12908
- ui.toast.error(error.message);
12909
- }
12910
- }
12911
- );
12912
- });
12913
- return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
12914
- KeyboundForm,
12915
- {
12916
- className: "flex flex-1 flex-col overflow-hidden",
12917
- onSubmit,
12918
- children: [
12919
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsx(
12920
- Form$2.Field,
12921
- {
12922
- control: form.control,
12923
- name: "email",
12924
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12925
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Email" }),
12926
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12927
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12928
- ] })
12929
- }
12930
- ) }),
12931
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
12932
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
12933
- /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
12934
- ] }) })
12935
- ]
12936
- }
12937
- ) });
12938
- };
12939
- const schema$1 = objectType({
12940
- email: stringType().email()
12941
- });
12942
- const SalesChannel = () => {
12943
- const { id } = reactRouterDom.useParams();
12944
- const { draft_order, isPending, isError, error } = useDraftOrder(
12945
- id,
12946
- {
12947
- fields: "+sales_channel_id"
12948
- },
12949
- {
12950
- enabled: !!id
12951
- }
12952
- );
12953
- if (isError) {
12954
- throw error;
12955
- }
12956
- const ISrEADY = !!draft_order && !isPending;
12957
- return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
12958
- /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
12959
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Sales Channel" }) }),
12960
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Update which sales channel the draft order is associated with" }) })
12961
- ] }),
12962
- ISrEADY && /* @__PURE__ */ jsxRuntime.jsx(SalesChannelForm, { order: draft_order })
12963
- ] });
12964
- };
12965
- const SalesChannelForm = ({ order }) => {
12966
- const form = reactHookForm.useForm({
12967
- defaultValues: {
12968
- sales_channel_id: order.sales_channel_id || ""
12969
- },
12970
- resolver: zod.zodResolver(schema)
12971
- });
12972
- const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
12973
- const { handleSuccess } = useRouteModal();
12974
- const onSubmit = form.handleSubmit(async (data) => {
12975
- await mutateAsync(
12976
- {
12977
- sales_channel_id: data.sales_channel_id
12978
- },
12979
- {
12980
- onSuccess: () => {
12981
- ui.toast.success("Sales channel updated");
12982
- handleSuccess();
12983
- },
12984
- onError: (error) => {
12985
- ui.toast.error(error.message);
12986
- }
12987
- }
12988
- );
12989
- });
12990
- return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
12991
- KeyboundForm,
12992
- {
12993
- className: "flex flex-1 flex-col overflow-hidden",
12994
- onSubmit,
12995
- children: [
12996
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsx(SalesChannelField, { control: form.control, order }) }),
12997
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
12998
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
12999
- /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
13000
- ] }) })
13001
- ]
13002
- }
13003
- ) });
13004
- };
13005
- const SalesChannelField = ({ control, order }) => {
13006
- const salesChannels = useComboboxData({
13007
- queryFn: async (params) => {
13008
- return await sdk.admin.salesChannel.list(params);
13009
- },
13010
- queryKey: ["sales-channels"],
13011
- getOptions: (data) => {
13012
- return data.sales_channels.map((salesChannel) => ({
13013
- label: salesChannel.name,
13014
- value: salesChannel.id
13015
- }));
13016
- },
13017
- defaultValue: order.sales_channel_id || void 0
13018
- });
13019
- return /* @__PURE__ */ jsxRuntime.jsx(
13020
- Form$2.Field,
13021
- {
13022
- control,
13023
- name: "sales_channel_id",
13024
- render: ({ field }) => {
13025
- return /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
13026
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Sales Channel" }),
13027
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
13028
- Combobox,
13029
- {
13030
- options: salesChannels.options,
13031
- fetchNextPage: salesChannels.fetchNextPage,
13032
- isFetchingNextPage: salesChannels.isFetchingNextPage,
13033
- searchValue: salesChannels.searchValue,
13034
- onSearchValueChange: salesChannels.onSearchValueChange,
13035
- placeholder: "Select sales channel",
13036
- ...field
13037
- }
13038
- ) }),
13039
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
13040
- ] });
13041
- }
13042
- }
13043
- );
13044
- };
13045
13045
  const schema = objectType({
13046
- sales_channel_id: stringType().min(1)
13046
+ customer_id: stringType().min(1)
13047
13047
  });
13048
13048
  const widgetModule = { widgets: [] };
13049
13049
  const routeModule = {
@@ -13065,10 +13065,6 @@ const routeModule = {
13065
13065
  handle,
13066
13066
  loader,
13067
13067
  children: [
13068
- {
13069
- Component: BillingAddress,
13070
- path: "/draft-orders/:id/billing-address"
13071
- },
13072
13068
  {
13073
13069
  Component: CustomItems,
13074
13070
  path: "/draft-orders/:id/custom-items"
@@ -13077,6 +13073,14 @@ const routeModule = {
13077
13073
  Component: Items,
13078
13074
  path: "/draft-orders/:id/items"
13079
13075
  },
13076
+ {
13077
+ Component: BillingAddress,
13078
+ path: "/draft-orders/:id/billing-address"
13079
+ },
13080
+ {
13081
+ Component: Email,
13082
+ path: "/draft-orders/:id/email"
13083
+ },
13080
13084
  {
13081
13085
  Component: Metadata,
13082
13086
  path: "/draft-orders/:id/metadata"
@@ -13086,24 +13090,20 @@ const routeModule = {
13086
13090
  path: "/draft-orders/:id/promotions"
13087
13091
  },
13088
13092
  {
13089
- Component: Shipping,
13090
- path: "/draft-orders/:id/shipping"
13093
+ Component: SalesChannel,
13094
+ path: "/draft-orders/:id/sales-channel"
13091
13095
  },
13092
13096
  {
13093
13097
  Component: ShippingAddress,
13094
13098
  path: "/draft-orders/:id/shipping-address"
13095
13099
  },
13096
13100
  {
13097
- Component: TransferOwnership,
13098
- path: "/draft-orders/:id/transfer-ownership"
13099
- },
13100
- {
13101
- Component: Email,
13102
- path: "/draft-orders/:id/email"
13101
+ Component: Shipping,
13102
+ path: "/draft-orders/:id/shipping"
13103
13103
  },
13104
13104
  {
13105
- Component: SalesChannel,
13106
- path: "/draft-orders/:id/sales-channel"
13105
+ Component: TransferOwnership,
13106
+ path: "/draft-orders/:id/transfer-ownership"
13107
13107
  }
13108
13108
  ]
13109
13109
  }