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