@medusajs/draft-order 2.10.4-preview-20250925060158 → 2.10.4-preview-20250925120212

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -9573,27 +9573,196 @@ const ID = () => {
9573
9573
  /* @__PURE__ */ jsxRuntime.jsx(reactRouterDom.Outlet, {})
9574
9574
  ] });
9575
9575
  };
9576
- const CustomItems = () => {
9576
+ const BillingAddress = () => {
9577
+ const { id } = reactRouterDom.useParams();
9578
+ const { order, isPending, isError, error } = useOrder(id, {
9579
+ fields: "+billing_address"
9580
+ });
9581
+ if (isError) {
9582
+ throw error;
9583
+ }
9584
+ const isReady = !isPending && !!order;
9577
9585
  return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
9578
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Header, { children: /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Custom Items" }) }) }),
9579
- /* @__PURE__ */ jsxRuntime.jsx(CustomItemsForm, {})
9586
+ /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
9587
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Billing Address" }) }),
9588
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit the billing address for the draft order" }) })
9589
+ ] }),
9590
+ isReady && /* @__PURE__ */ jsxRuntime.jsx(BillingAddressForm, { order })
9580
9591
  ] });
9581
9592
  };
9582
- const CustomItemsForm = () => {
9593
+ const BillingAddressForm = ({ order }) => {
9594
+ var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
9583
9595
  const form = reactHookForm.useForm({
9596
+ defaultValues: {
9597
+ first_name: ((_a = order.billing_address) == null ? void 0 : _a.first_name) ?? "",
9598
+ last_name: ((_b = order.billing_address) == null ? void 0 : _b.last_name) ?? "",
9599
+ company: ((_c = order.billing_address) == null ? void 0 : _c.company) ?? "",
9600
+ address_1: ((_d = order.billing_address) == null ? void 0 : _d.address_1) ?? "",
9601
+ address_2: ((_e = order.billing_address) == null ? void 0 : _e.address_2) ?? "",
9602
+ city: ((_f = order.billing_address) == null ? void 0 : _f.city) ?? "",
9603
+ province: ((_g = order.billing_address) == null ? void 0 : _g.province) ?? "",
9604
+ country_code: ((_h = order.billing_address) == null ? void 0 : _h.country_code) ?? "",
9605
+ postal_code: ((_i = order.billing_address) == null ? void 0 : _i.postal_code) ?? "",
9606
+ phone: ((_j = order.billing_address) == null ? void 0 : _j.phone) ?? ""
9607
+ },
9584
9608
  resolver: zod.zodResolver(schema$5)
9585
9609
  });
9586
- return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(KeyboundForm, { className: "flex flex-1 flex-col", children: [
9587
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, {}),
9588
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
9589
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
9590
- /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", children: "Save" })
9591
- ] }) })
9592
- ] }) });
9610
+ const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
9611
+ const { handleSuccess } = useRouteModal();
9612
+ const onSubmit = form.handleSubmit(async (data) => {
9613
+ await mutateAsync(
9614
+ { billing_address: data },
9615
+ {
9616
+ onSuccess: () => {
9617
+ handleSuccess();
9618
+ },
9619
+ onError: (error) => {
9620
+ ui.toast.error(error.message);
9621
+ }
9622
+ }
9623
+ );
9624
+ });
9625
+ return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
9626
+ KeyboundForm,
9627
+ {
9628
+ className: "flex flex-1 flex-col overflow-hidden",
9629
+ onSubmit,
9630
+ children: [
9631
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-y-4", children: [
9632
+ /* @__PURE__ */ jsxRuntime.jsx(
9633
+ Form$2.Field,
9634
+ {
9635
+ control: form.control,
9636
+ name: "country_code",
9637
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9638
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Country" }),
9639
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(CountrySelect, { ...field }) }),
9640
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9641
+ ] })
9642
+ }
9643
+ ),
9644
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
9645
+ /* @__PURE__ */ jsxRuntime.jsx(
9646
+ Form$2.Field,
9647
+ {
9648
+ control: form.control,
9649
+ name: "first_name",
9650
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9651
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "First name" }),
9652
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9653
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9654
+ ] })
9655
+ }
9656
+ ),
9657
+ /* @__PURE__ */ jsxRuntime.jsx(
9658
+ Form$2.Field,
9659
+ {
9660
+ control: form.control,
9661
+ name: "last_name",
9662
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9663
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Last name" }),
9664
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9665
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9666
+ ] })
9667
+ }
9668
+ )
9669
+ ] }),
9670
+ /* @__PURE__ */ jsxRuntime.jsx(
9671
+ Form$2.Field,
9672
+ {
9673
+ control: form.control,
9674
+ name: "company",
9675
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9676
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Company" }),
9677
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9678
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9679
+ ] })
9680
+ }
9681
+ ),
9682
+ /* @__PURE__ */ jsxRuntime.jsx(
9683
+ Form$2.Field,
9684
+ {
9685
+ control: form.control,
9686
+ name: "address_1",
9687
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9688
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Address" }),
9689
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9690
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9691
+ ] })
9692
+ }
9693
+ ),
9694
+ /* @__PURE__ */ jsxRuntime.jsx(
9695
+ Form$2.Field,
9696
+ {
9697
+ control: form.control,
9698
+ name: "address_2",
9699
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9700
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Apartment, suite, etc." }),
9701
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9702
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9703
+ ] })
9704
+ }
9705
+ ),
9706
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
9707
+ /* @__PURE__ */ jsxRuntime.jsx(
9708
+ Form$2.Field,
9709
+ {
9710
+ control: form.control,
9711
+ name: "postal_code",
9712
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9713
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Postal code" }),
9714
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9715
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9716
+ ] })
9717
+ }
9718
+ ),
9719
+ /* @__PURE__ */ jsxRuntime.jsx(
9720
+ Form$2.Field,
9721
+ {
9722
+ control: form.control,
9723
+ name: "city",
9724
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9725
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "City" }),
9726
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9727
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9728
+ ] })
9729
+ }
9730
+ )
9731
+ ] }),
9732
+ /* @__PURE__ */ jsxRuntime.jsx(
9733
+ Form$2.Field,
9734
+ {
9735
+ control: form.control,
9736
+ name: "province",
9737
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9738
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Province / State" }),
9739
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9740
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9741
+ ] })
9742
+ }
9743
+ ),
9744
+ /* @__PURE__ */ jsxRuntime.jsx(
9745
+ Form$2.Field,
9746
+ {
9747
+ control: form.control,
9748
+ name: "phone",
9749
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9750
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Phone" }),
9751
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9752
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9753
+ ] })
9754
+ }
9755
+ )
9756
+ ] }) }),
9757
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
9758
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
9759
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
9760
+ ] }) })
9761
+ ]
9762
+ }
9763
+ ) });
9593
9764
  };
9594
- const schema$5 = objectType({
9595
- email: stringType().email()
9596
- });
9765
+ const schema$5 = addressSchema;
9597
9766
  const Email = () => {
9598
9767
  const { id } = reactRouterDom.useParams();
9599
9768
  const { order, isPending, isError, error } = useOrder(id, {
@@ -10636,10 +10805,54 @@ const customItemSchema = objectType({
10636
10805
  quantity: numberType(),
10637
10806
  unit_price: unionType([numberType(), stringType()])
10638
10807
  });
10639
- const BillingAddress = () => {
10808
+ const InlineTip = React.forwardRef(
10809
+ ({ variant = "tip", label, className, children, ...props }, ref) => {
10810
+ const labelValue = label || (variant === "warning" ? "Warning" : "Tip");
10811
+ return /* @__PURE__ */ jsxRuntime.jsxs(
10812
+ "div",
10813
+ {
10814
+ ref,
10815
+ className: ui.clx(
10816
+ "bg-ui-bg-component txt-small text-ui-fg-subtle grid grid-cols-[4px_1fr] items-start gap-3 rounded-lg border p-3",
10817
+ className
10818
+ ),
10819
+ ...props,
10820
+ children: [
10821
+ /* @__PURE__ */ jsxRuntime.jsx(
10822
+ "div",
10823
+ {
10824
+ role: "presentation",
10825
+ className: ui.clx("w-4px bg-ui-tag-neutral-icon h-full rounded-full", {
10826
+ "bg-ui-tag-orange-icon": variant === "warning"
10827
+ })
10828
+ }
10829
+ ),
10830
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-pretty", children: [
10831
+ /* @__PURE__ */ jsxRuntime.jsxs("strong", { className: "txt-small-plus text-ui-fg-base", children: [
10832
+ labelValue,
10833
+ ":"
10834
+ ] }),
10835
+ " ",
10836
+ children
10837
+ ] })
10838
+ ]
10839
+ }
10840
+ );
10841
+ }
10842
+ );
10843
+ InlineTip.displayName = "InlineTip";
10844
+ const MetadataFieldSchema = objectType({
10845
+ key: stringType(),
10846
+ disabled: booleanType().optional(),
10847
+ value: anyType()
10848
+ });
10849
+ const MetadataSchema = objectType({
10850
+ metadata: arrayType(MetadataFieldSchema)
10851
+ });
10852
+ const Metadata = () => {
10640
10853
  const { id } = reactRouterDom.useParams();
10641
10854
  const { order, isPending, isError, error } = useOrder(id, {
10642
- fields: "+billing_address"
10855
+ fields: "metadata"
10643
10856
  });
10644
10857
  if (isError) {
10645
10858
  throw error;
@@ -10647,244 +10860,10 @@ const BillingAddress = () => {
10647
10860
  const isReady = !isPending && !!order;
10648
10861
  return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
10649
10862
  /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
10650
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Billing Address" }) }),
10651
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit the billing address for the draft order" }) })
10863
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Metadata" }) }),
10864
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Add metadata to the draft order." }) })
10652
10865
  ] }),
10653
- isReady && /* @__PURE__ */ jsxRuntime.jsx(BillingAddressForm, { order })
10654
- ] });
10655
- };
10656
- const BillingAddressForm = ({ order }) => {
10657
- var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
10658
- const form = reactHookForm.useForm({
10659
- defaultValues: {
10660
- first_name: ((_a = order.billing_address) == null ? void 0 : _a.first_name) ?? "",
10661
- last_name: ((_b = order.billing_address) == null ? void 0 : _b.last_name) ?? "",
10662
- company: ((_c = order.billing_address) == null ? void 0 : _c.company) ?? "",
10663
- address_1: ((_d = order.billing_address) == null ? void 0 : _d.address_1) ?? "",
10664
- address_2: ((_e = order.billing_address) == null ? void 0 : _e.address_2) ?? "",
10665
- city: ((_f = order.billing_address) == null ? void 0 : _f.city) ?? "",
10666
- province: ((_g = order.billing_address) == null ? void 0 : _g.province) ?? "",
10667
- country_code: ((_h = order.billing_address) == null ? void 0 : _h.country_code) ?? "",
10668
- postal_code: ((_i = order.billing_address) == null ? void 0 : _i.postal_code) ?? "",
10669
- phone: ((_j = order.billing_address) == null ? void 0 : _j.phone) ?? ""
10670
- },
10671
- resolver: zod.zodResolver(schema$3)
10672
- });
10673
- const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
10674
- const { handleSuccess } = useRouteModal();
10675
- const onSubmit = form.handleSubmit(async (data) => {
10676
- await mutateAsync(
10677
- { billing_address: data },
10678
- {
10679
- onSuccess: () => {
10680
- handleSuccess();
10681
- },
10682
- onError: (error) => {
10683
- ui.toast.error(error.message);
10684
- }
10685
- }
10686
- );
10687
- });
10688
- return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
10689
- KeyboundForm,
10690
- {
10691
- className: "flex flex-1 flex-col overflow-hidden",
10692
- onSubmit,
10693
- children: [
10694
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-y-4", children: [
10695
- /* @__PURE__ */ jsxRuntime.jsx(
10696
- Form$2.Field,
10697
- {
10698
- control: form.control,
10699
- name: "country_code",
10700
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
10701
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Country" }),
10702
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(CountrySelect, { ...field }) }),
10703
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
10704
- ] })
10705
- }
10706
- ),
10707
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
10708
- /* @__PURE__ */ jsxRuntime.jsx(
10709
- Form$2.Field,
10710
- {
10711
- control: form.control,
10712
- name: "first_name",
10713
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
10714
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "First name" }),
10715
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
10716
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
10717
- ] })
10718
- }
10719
- ),
10720
- /* @__PURE__ */ jsxRuntime.jsx(
10721
- Form$2.Field,
10722
- {
10723
- control: form.control,
10724
- name: "last_name",
10725
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
10726
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Last name" }),
10727
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
10728
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
10729
- ] })
10730
- }
10731
- )
10732
- ] }),
10733
- /* @__PURE__ */ jsxRuntime.jsx(
10734
- Form$2.Field,
10735
- {
10736
- control: form.control,
10737
- name: "company",
10738
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
10739
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Company" }),
10740
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
10741
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
10742
- ] })
10743
- }
10744
- ),
10745
- /* @__PURE__ */ jsxRuntime.jsx(
10746
- Form$2.Field,
10747
- {
10748
- control: form.control,
10749
- name: "address_1",
10750
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
10751
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Address" }),
10752
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
10753
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
10754
- ] })
10755
- }
10756
- ),
10757
- /* @__PURE__ */ jsxRuntime.jsx(
10758
- Form$2.Field,
10759
- {
10760
- control: form.control,
10761
- name: "address_2",
10762
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
10763
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Apartment, suite, etc." }),
10764
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
10765
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
10766
- ] })
10767
- }
10768
- ),
10769
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
10770
- /* @__PURE__ */ jsxRuntime.jsx(
10771
- Form$2.Field,
10772
- {
10773
- control: form.control,
10774
- name: "postal_code",
10775
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
10776
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Postal code" }),
10777
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
10778
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
10779
- ] })
10780
- }
10781
- ),
10782
- /* @__PURE__ */ jsxRuntime.jsx(
10783
- Form$2.Field,
10784
- {
10785
- control: form.control,
10786
- name: "city",
10787
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
10788
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "City" }),
10789
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
10790
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
10791
- ] })
10792
- }
10793
- )
10794
- ] }),
10795
- /* @__PURE__ */ jsxRuntime.jsx(
10796
- Form$2.Field,
10797
- {
10798
- control: form.control,
10799
- name: "province",
10800
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
10801
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Province / State" }),
10802
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
10803
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
10804
- ] })
10805
- }
10806
- ),
10807
- /* @__PURE__ */ jsxRuntime.jsx(
10808
- Form$2.Field,
10809
- {
10810
- control: form.control,
10811
- name: "phone",
10812
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
10813
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Phone" }),
10814
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
10815
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
10816
- ] })
10817
- }
10818
- )
10819
- ] }) }),
10820
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
10821
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
10822
- /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
10823
- ] }) })
10824
- ]
10825
- }
10826
- ) });
10827
- };
10828
- const schema$3 = addressSchema;
10829
- const InlineTip = React.forwardRef(
10830
- ({ variant = "tip", label, className, children, ...props }, ref) => {
10831
- const labelValue = label || (variant === "warning" ? "Warning" : "Tip");
10832
- return /* @__PURE__ */ jsxRuntime.jsxs(
10833
- "div",
10834
- {
10835
- ref,
10836
- className: ui.clx(
10837
- "bg-ui-bg-component txt-small text-ui-fg-subtle grid grid-cols-[4px_1fr] items-start gap-3 rounded-lg border p-3",
10838
- className
10839
- ),
10840
- ...props,
10841
- children: [
10842
- /* @__PURE__ */ jsxRuntime.jsx(
10843
- "div",
10844
- {
10845
- role: "presentation",
10846
- className: ui.clx("w-4px bg-ui-tag-neutral-icon h-full rounded-full", {
10847
- "bg-ui-tag-orange-icon": variant === "warning"
10848
- })
10849
- }
10850
- ),
10851
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-pretty", children: [
10852
- /* @__PURE__ */ jsxRuntime.jsxs("strong", { className: "txt-small-plus text-ui-fg-base", children: [
10853
- labelValue,
10854
- ":"
10855
- ] }),
10856
- " ",
10857
- children
10858
- ] })
10859
- ]
10860
- }
10861
- );
10862
- }
10863
- );
10864
- InlineTip.displayName = "InlineTip";
10865
- const MetadataFieldSchema = objectType({
10866
- key: stringType(),
10867
- disabled: booleanType().optional(),
10868
- value: anyType()
10869
- });
10870
- const MetadataSchema = objectType({
10871
- metadata: arrayType(MetadataFieldSchema)
10872
- });
10873
- const Metadata = () => {
10874
- const { id } = reactRouterDom.useParams();
10875
- const { order, isPending, isError, error } = useOrder(id, {
10876
- fields: "metadata"
10877
- });
10878
- if (isError) {
10879
- throw error;
10880
- }
10881
- const isReady = !isPending && !!order;
10882
- return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
10883
- /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
10884
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Metadata" }) }),
10885
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Add metadata to the draft order." }) })
10886
- ] }),
10887
- !isReady ? /* @__PURE__ */ jsxRuntime.jsx(PlaceholderInner, {}) : /* @__PURE__ */ jsxRuntime.jsx(MetadataForm, { orderId: id, metadata: order == null ? void 0 : order.metadata })
10866
+ !isReady ? /* @__PURE__ */ jsxRuntime.jsx(PlaceholderInner, {}) : /* @__PURE__ */ jsxRuntime.jsx(MetadataForm, { orderId: id, metadata: order == null ? void 0 : order.metadata })
10888
10867
  ] });
10889
10868
  };
10890
10869
  const METADATA_KEY_LABEL_ID = "metadata-form-key-label";
@@ -11176,283 +11155,27 @@ function getHasUneditableRows(metadata) {
11176
11155
  (value) => !EDITABLE_TYPES.includes(typeof value)
11177
11156
  );
11178
11157
  }
11179
- const PROMOTION_QUERY_KEY = "promotions";
11180
- const promotionsQueryKeys = {
11181
- list: (query2) => [
11182
- PROMOTION_QUERY_KEY,
11183
- query2 ? query2 : void 0
11184
- ],
11185
- detail: (id, query2) => [
11186
- PROMOTION_QUERY_KEY,
11187
- id,
11188
- query2 ? query2 : void 0
11189
- ]
11158
+ const CustomItems = () => {
11159
+ return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
11160
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Header, { children: /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Custom Items" }) }) }),
11161
+ /* @__PURE__ */ jsxRuntime.jsx(CustomItemsForm, {})
11162
+ ] });
11190
11163
  };
11191
- const usePromotions = (query2, options) => {
11192
- const { data, ...rest } = reactQuery.useQuery({
11193
- queryKey: promotionsQueryKeys.list(query2),
11194
- queryFn: async () => sdk.admin.promotion.list(query2),
11195
- ...options
11164
+ const CustomItemsForm = () => {
11165
+ const form = reactHookForm.useForm({
11166
+ resolver: zod.zodResolver(schema$3)
11196
11167
  });
11197
- return { ...data, ...rest };
11198
- };
11199
- const Promotions = () => {
11200
- const { id } = reactRouterDom.useParams();
11201
- const {
11202
- order: preview,
11203
- isError: isPreviewError,
11204
- error: previewError
11205
- } = useOrderPreview(id, void 0);
11206
- useInitiateOrderEdit({ preview });
11207
- const { onCancel } = useCancelOrderEdit({ preview });
11208
- if (isPreviewError) {
11209
- throw previewError;
11210
- }
11211
- const isReady = !!preview;
11212
- return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { onClose: onCancel, children: [
11213
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Header, { children: /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Promotions" }) }) }),
11214
- isReady && /* @__PURE__ */ jsxRuntime.jsx(PromotionForm, { preview })
11215
- ] });
11216
- };
11217
- const PromotionForm = ({ preview }) => {
11218
- const { items, shipping_methods } = preview;
11219
- const [isSubmitting, setIsSubmitting] = React.useState(false);
11220
- const [comboboxValue, setComboboxValue] = React.useState("");
11221
- const { handleSuccess } = useRouteModal();
11222
- const { mutateAsync: addPromotions, isPending: isAddingPromotions } = useDraftOrderAddPromotions(preview.id);
11223
- const promoIds = getPromotionIds(items, shipping_methods);
11224
- const { promotions, isPending, isError, error } = usePromotions(
11225
- {
11226
- id: promoIds
11227
- },
11228
- {
11229
- enabled: !!promoIds.length
11230
- }
11231
- );
11232
- const comboboxData = useComboboxData({
11233
- queryKey: ["promotions", "combobox", promoIds],
11234
- queryFn: async (params) => {
11235
- return await sdk.admin.promotion.list({
11236
- ...params,
11237
- id: {
11238
- $nin: promoIds
11239
- }
11240
- });
11241
- },
11242
- getOptions: (data) => {
11243
- return data.promotions.map((promotion) => ({
11244
- label: promotion.code,
11245
- value: promotion.code
11246
- }));
11247
- }
11248
- });
11249
- const add = async (value) => {
11250
- if (!value) {
11251
- return;
11252
- }
11253
- addPromotions(
11254
- {
11255
- promo_codes: [value]
11256
- },
11257
- {
11258
- onError: (e) => {
11259
- ui.toast.error(e.message);
11260
- comboboxData.onSearchValueChange("");
11261
- setComboboxValue("");
11262
- },
11263
- onSuccess: () => {
11264
- comboboxData.onSearchValueChange("");
11265
- setComboboxValue("");
11266
- }
11267
- }
11268
- );
11269
- };
11270
- const { mutateAsync: confirmOrderEdit } = useDraftOrderConfirmEdit(preview.id);
11271
- const { mutateAsync: requestOrderEdit } = useOrderEditRequest(preview.id);
11272
- const onSubmit = async () => {
11273
- setIsSubmitting(true);
11274
- let requestSucceeded = false;
11275
- await requestOrderEdit(void 0, {
11276
- onError: (e) => {
11277
- ui.toast.error(e.message);
11278
- },
11279
- onSuccess: () => {
11280
- requestSucceeded = true;
11281
- }
11282
- });
11283
- if (!requestSucceeded) {
11284
- setIsSubmitting(false);
11285
- return;
11286
- }
11287
- await confirmOrderEdit(void 0, {
11288
- onError: (e) => {
11289
- ui.toast.error(e.message);
11290
- },
11291
- onSuccess: () => {
11292
- handleSuccess();
11293
- },
11294
- onSettled: () => {
11295
- setIsSubmitting(false);
11296
- }
11297
- });
11298
- };
11299
- if (isError) {
11300
- throw error;
11301
- }
11302
- return /* @__PURE__ */ jsxRuntime.jsxs(KeyboundForm, { className: "flex flex-1 flex-col", onSubmit, children: [
11303
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-4", children: [
11304
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-3", children: [
11305
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col", children: [
11306
- /* @__PURE__ */ jsxRuntime.jsx(ui.Label, { size: "small", weight: "plus", htmlFor: "promotion-combobox", children: "Apply promotions" }),
11307
- /* @__PURE__ */ jsxRuntime.jsx(ui.Hint, { id: "promotion-combobox-hint", children: "Manage promotions that should be applied to the order." })
11308
- ] }),
11309
- /* @__PURE__ */ jsxRuntime.jsx(
11310
- Combobox,
11311
- {
11312
- id: "promotion-combobox",
11313
- "aria-describedby": "promotion-combobox-hint",
11314
- isFetchingNextPage: comboboxData.isFetchingNextPage,
11315
- fetchNextPage: comboboxData.fetchNextPage,
11316
- options: comboboxData.options,
11317
- onSearchValueChange: comboboxData.onSearchValueChange,
11318
- searchValue: comboboxData.searchValue,
11319
- disabled: comboboxData.disabled || isAddingPromotions,
11320
- onChange: add,
11321
- value: comboboxValue
11322
- }
11323
- )
11324
- ] }),
11325
- /* @__PURE__ */ jsxRuntime.jsx(ui.Divider, { variant: "dashed" }),
11326
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col gap-2", children: promotions == null ? void 0 : promotions.map((promotion) => /* @__PURE__ */ jsxRuntime.jsx(
11327
- PromotionItem,
11328
- {
11329
- promotion,
11330
- orderId: preview.id,
11331
- isLoading: isPending
11332
- },
11333
- promotion.id
11334
- )) })
11335
- ] }) }),
11168
+ return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(KeyboundForm, { className: "flex flex-1 flex-col", children: [
11169
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, {}),
11336
11170
  /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
11337
11171
  /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
11338
- /* @__PURE__ */ jsxRuntime.jsx(
11339
- ui.Button,
11340
- {
11341
- size: "small",
11342
- type: "submit",
11343
- isLoading: isSubmitting || isAddingPromotions,
11344
- children: "Save"
11345
- }
11346
- )
11172
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", children: "Save" })
11347
11173
  ] }) })
11348
- ] });
11349
- };
11350
- const PromotionItem = ({
11351
- promotion,
11352
- orderId,
11353
- isLoading
11354
- }) => {
11355
- var _a;
11356
- const { mutateAsync: removePromotions, isPending } = useDraftOrderRemovePromotions(orderId);
11357
- const onRemove = async () => {
11358
- removePromotions(
11359
- {
11360
- promo_codes: [promotion.code]
11361
- },
11362
- {
11363
- onError: (e) => {
11364
- ui.toast.error(e.message);
11365
- }
11366
- }
11367
- );
11368
- };
11369
- const displayValue = getDisplayValue(promotion);
11370
- return /* @__PURE__ */ jsxRuntime.jsxs(
11371
- "div",
11372
- {
11373
- className: ui.clx(
11374
- "bg-ui-bg-component shadow-elevation-card-rest flex items-center justify-between rounded-lg px-3 py-2",
11375
- {
11376
- "animate-pulse": isLoading
11377
- }
11378
- ),
11379
- children: [
11380
- /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
11381
- /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", weight: "plus", leading: "compact", children: promotion.code }),
11382
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-ui-fg-subtle flex items-center gap-1.5", children: [
11383
- displayValue && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1.5", children: [
11384
- /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", leading: "compact", children: displayValue }),
11385
- /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", leading: "compact", children: "·" })
11386
- ] }),
11387
- /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", leading: "compact", className: "capitalize", children: (_a = promotion.application_method) == null ? void 0 : _a.allocation })
11388
- ] })
11389
- ] }),
11390
- /* @__PURE__ */ jsxRuntime.jsx(
11391
- ui.IconButton,
11392
- {
11393
- size: "small",
11394
- type: "button",
11395
- variant: "transparent",
11396
- onClick: onRemove,
11397
- isLoading: isPending || isLoading,
11398
- children: /* @__PURE__ */ jsxRuntime.jsx(icons.XMark, {})
11399
- }
11400
- )
11401
- ]
11402
- },
11403
- promotion.id
11404
- );
11174
+ ] }) });
11405
11175
  };
11406
- function getDisplayValue(promotion) {
11407
- var _a, _b, _c, _d;
11408
- const value = (_a = promotion.application_method) == null ? void 0 : _a.value;
11409
- if (!value) {
11410
- return null;
11411
- }
11412
- if (((_b = promotion.application_method) == null ? void 0 : _b.type) === "fixed") {
11413
- const currency = (_c = promotion.application_method) == null ? void 0 : _c.currency_code;
11414
- if (!currency) {
11415
- return null;
11416
- }
11417
- return getLocaleAmount(value, currency);
11418
- } else if (((_d = promotion.application_method) == null ? void 0 : _d.type) === "percentage") {
11419
- return formatPercentage(value);
11420
- }
11421
- return null;
11422
- }
11423
- const formatter = new Intl.NumberFormat([], {
11424
- style: "percent",
11425
- minimumFractionDigits: 2
11176
+ const schema$3 = objectType({
11177
+ email: stringType().email()
11426
11178
  });
11427
- const formatPercentage = (value, isPercentageValue = false) => {
11428
- let val = value || 0;
11429
- if (!isPercentageValue) {
11430
- val = val / 100;
11431
- }
11432
- return formatter.format(val);
11433
- };
11434
- function getPromotionIds(items, shippingMethods) {
11435
- const promotionIds = /* @__PURE__ */ new Set();
11436
- for (const item of items) {
11437
- if (item.adjustments) {
11438
- for (const adjustment of item.adjustments) {
11439
- if (adjustment.promotion_id) {
11440
- promotionIds.add(adjustment.promotion_id);
11441
- }
11442
- }
11443
- }
11444
- }
11445
- for (const shippingMethod of shippingMethods) {
11446
- if (shippingMethod.adjustments) {
11447
- for (const adjustment of shippingMethod.adjustments) {
11448
- if (adjustment.promotion_id) {
11449
- promotionIds.add(adjustment.promotion_id);
11450
- }
11451
- }
11452
- }
11453
- }
11454
- return Array.from(promotionIds);
11455
- }
11456
11179
  const SalesChannel = () => {
11457
11180
  const { id } = reactRouterDom.useParams();
11458
11181
  const { draft_order, isPending, isError, error } = useDraftOrder(
@@ -13045,9 +12768,286 @@ const Illustration = () => {
13045
12768
  const schema = objectType({
13046
12769
  customer_id: stringType().min(1)
13047
12770
  });
13048
- const widgetModule = { widgets: [] };
13049
- const routeModule = {
13050
- routes: [
12771
+ const PROMOTION_QUERY_KEY = "promotions";
12772
+ const promotionsQueryKeys = {
12773
+ list: (query2) => [
12774
+ PROMOTION_QUERY_KEY,
12775
+ query2 ? query2 : void 0
12776
+ ],
12777
+ detail: (id, query2) => [
12778
+ PROMOTION_QUERY_KEY,
12779
+ id,
12780
+ query2 ? query2 : void 0
12781
+ ]
12782
+ };
12783
+ const usePromotions = (query2, options) => {
12784
+ const { data, ...rest } = reactQuery.useQuery({
12785
+ queryKey: promotionsQueryKeys.list(query2),
12786
+ queryFn: async () => sdk.admin.promotion.list(query2),
12787
+ ...options
12788
+ });
12789
+ return { ...data, ...rest };
12790
+ };
12791
+ const Promotions = () => {
12792
+ const { id } = reactRouterDom.useParams();
12793
+ const {
12794
+ order: preview,
12795
+ isError: isPreviewError,
12796
+ error: previewError
12797
+ } = useOrderPreview(id, void 0);
12798
+ useInitiateOrderEdit({ preview });
12799
+ const { onCancel } = useCancelOrderEdit({ preview });
12800
+ if (isPreviewError) {
12801
+ throw previewError;
12802
+ }
12803
+ const isReady = !!preview;
12804
+ return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { onClose: onCancel, children: [
12805
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Header, { children: /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Promotions" }) }) }),
12806
+ isReady && /* @__PURE__ */ jsxRuntime.jsx(PromotionForm, { preview })
12807
+ ] });
12808
+ };
12809
+ const PromotionForm = ({ preview }) => {
12810
+ const { items, shipping_methods } = preview;
12811
+ const [isSubmitting, setIsSubmitting] = React.useState(false);
12812
+ const [comboboxValue, setComboboxValue] = React.useState("");
12813
+ const { handleSuccess } = useRouteModal();
12814
+ const { mutateAsync: addPromotions, isPending: isAddingPromotions } = useDraftOrderAddPromotions(preview.id);
12815
+ const promoIds = getPromotionIds(items, shipping_methods);
12816
+ const { promotions, isPending, isError, error } = usePromotions(
12817
+ {
12818
+ id: promoIds
12819
+ },
12820
+ {
12821
+ enabled: !!promoIds.length
12822
+ }
12823
+ );
12824
+ const comboboxData = useComboboxData({
12825
+ queryKey: ["promotions", "combobox", promoIds],
12826
+ queryFn: async (params) => {
12827
+ return await sdk.admin.promotion.list({
12828
+ ...params,
12829
+ id: {
12830
+ $nin: promoIds
12831
+ }
12832
+ });
12833
+ },
12834
+ getOptions: (data) => {
12835
+ return data.promotions.map((promotion) => ({
12836
+ label: promotion.code,
12837
+ value: promotion.code
12838
+ }));
12839
+ }
12840
+ });
12841
+ const add = async (value) => {
12842
+ if (!value) {
12843
+ return;
12844
+ }
12845
+ addPromotions(
12846
+ {
12847
+ promo_codes: [value]
12848
+ },
12849
+ {
12850
+ onError: (e) => {
12851
+ ui.toast.error(e.message);
12852
+ comboboxData.onSearchValueChange("");
12853
+ setComboboxValue("");
12854
+ },
12855
+ onSuccess: () => {
12856
+ comboboxData.onSearchValueChange("");
12857
+ setComboboxValue("");
12858
+ }
12859
+ }
12860
+ );
12861
+ };
12862
+ const { mutateAsync: confirmOrderEdit } = useDraftOrderConfirmEdit(preview.id);
12863
+ const { mutateAsync: requestOrderEdit } = useOrderEditRequest(preview.id);
12864
+ const onSubmit = async () => {
12865
+ setIsSubmitting(true);
12866
+ let requestSucceeded = false;
12867
+ await requestOrderEdit(void 0, {
12868
+ onError: (e) => {
12869
+ ui.toast.error(e.message);
12870
+ },
12871
+ onSuccess: () => {
12872
+ requestSucceeded = true;
12873
+ }
12874
+ });
12875
+ if (!requestSucceeded) {
12876
+ setIsSubmitting(false);
12877
+ return;
12878
+ }
12879
+ await confirmOrderEdit(void 0, {
12880
+ onError: (e) => {
12881
+ ui.toast.error(e.message);
12882
+ },
12883
+ onSuccess: () => {
12884
+ handleSuccess();
12885
+ },
12886
+ onSettled: () => {
12887
+ setIsSubmitting(false);
12888
+ }
12889
+ });
12890
+ };
12891
+ if (isError) {
12892
+ throw error;
12893
+ }
12894
+ return /* @__PURE__ */ jsxRuntime.jsxs(KeyboundForm, { className: "flex flex-1 flex-col", onSubmit, children: [
12895
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-4", children: [
12896
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-3", children: [
12897
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col", children: [
12898
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Label, { size: "small", weight: "plus", htmlFor: "promotion-combobox", children: "Apply promotions" }),
12899
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Hint, { id: "promotion-combobox-hint", children: "Manage promotions that should be applied to the order." })
12900
+ ] }),
12901
+ /* @__PURE__ */ jsxRuntime.jsx(
12902
+ Combobox,
12903
+ {
12904
+ id: "promotion-combobox",
12905
+ "aria-describedby": "promotion-combobox-hint",
12906
+ isFetchingNextPage: comboboxData.isFetchingNextPage,
12907
+ fetchNextPage: comboboxData.fetchNextPage,
12908
+ options: comboboxData.options,
12909
+ onSearchValueChange: comboboxData.onSearchValueChange,
12910
+ searchValue: comboboxData.searchValue,
12911
+ disabled: comboboxData.disabled || isAddingPromotions,
12912
+ onChange: add,
12913
+ value: comboboxValue
12914
+ }
12915
+ )
12916
+ ] }),
12917
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Divider, { variant: "dashed" }),
12918
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col gap-2", children: promotions == null ? void 0 : promotions.map((promotion) => /* @__PURE__ */ jsxRuntime.jsx(
12919
+ PromotionItem,
12920
+ {
12921
+ promotion,
12922
+ orderId: preview.id,
12923
+ isLoading: isPending
12924
+ },
12925
+ promotion.id
12926
+ )) })
12927
+ ] }) }),
12928
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
12929
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
12930
+ /* @__PURE__ */ jsxRuntime.jsx(
12931
+ ui.Button,
12932
+ {
12933
+ size: "small",
12934
+ type: "submit",
12935
+ isLoading: isSubmitting || isAddingPromotions,
12936
+ children: "Save"
12937
+ }
12938
+ )
12939
+ ] }) })
12940
+ ] });
12941
+ };
12942
+ const PromotionItem = ({
12943
+ promotion,
12944
+ orderId,
12945
+ isLoading
12946
+ }) => {
12947
+ var _a;
12948
+ const { mutateAsync: removePromotions, isPending } = useDraftOrderRemovePromotions(orderId);
12949
+ const onRemove = async () => {
12950
+ removePromotions(
12951
+ {
12952
+ promo_codes: [promotion.code]
12953
+ },
12954
+ {
12955
+ onError: (e) => {
12956
+ ui.toast.error(e.message);
12957
+ }
12958
+ }
12959
+ );
12960
+ };
12961
+ const displayValue = getDisplayValue(promotion);
12962
+ return /* @__PURE__ */ jsxRuntime.jsxs(
12963
+ "div",
12964
+ {
12965
+ className: ui.clx(
12966
+ "bg-ui-bg-component shadow-elevation-card-rest flex items-center justify-between rounded-lg px-3 py-2",
12967
+ {
12968
+ "animate-pulse": isLoading
12969
+ }
12970
+ ),
12971
+ children: [
12972
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
12973
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", weight: "plus", leading: "compact", children: promotion.code }),
12974
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-ui-fg-subtle flex items-center gap-1.5", children: [
12975
+ displayValue && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1.5", children: [
12976
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", leading: "compact", children: displayValue }),
12977
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", leading: "compact", children: "·" })
12978
+ ] }),
12979
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", leading: "compact", className: "capitalize", children: (_a = promotion.application_method) == null ? void 0 : _a.allocation })
12980
+ ] })
12981
+ ] }),
12982
+ /* @__PURE__ */ jsxRuntime.jsx(
12983
+ ui.IconButton,
12984
+ {
12985
+ size: "small",
12986
+ type: "button",
12987
+ variant: "transparent",
12988
+ onClick: onRemove,
12989
+ isLoading: isPending || isLoading,
12990
+ children: /* @__PURE__ */ jsxRuntime.jsx(icons.XMark, {})
12991
+ }
12992
+ )
12993
+ ]
12994
+ },
12995
+ promotion.id
12996
+ );
12997
+ };
12998
+ function getDisplayValue(promotion) {
12999
+ var _a, _b, _c, _d;
13000
+ const value = (_a = promotion.application_method) == null ? void 0 : _a.value;
13001
+ if (!value) {
13002
+ return null;
13003
+ }
13004
+ if (((_b = promotion.application_method) == null ? void 0 : _b.type) === "fixed") {
13005
+ const currency = (_c = promotion.application_method) == null ? void 0 : _c.currency_code;
13006
+ if (!currency) {
13007
+ return null;
13008
+ }
13009
+ return getLocaleAmount(value, currency);
13010
+ } else if (((_d = promotion.application_method) == null ? void 0 : _d.type) === "percentage") {
13011
+ return formatPercentage(value);
13012
+ }
13013
+ return null;
13014
+ }
13015
+ const formatter = new Intl.NumberFormat([], {
13016
+ style: "percent",
13017
+ minimumFractionDigits: 2
13018
+ });
13019
+ const formatPercentage = (value, isPercentageValue = false) => {
13020
+ let val = value || 0;
13021
+ if (!isPercentageValue) {
13022
+ val = val / 100;
13023
+ }
13024
+ return formatter.format(val);
13025
+ };
13026
+ function getPromotionIds(items, shippingMethods) {
13027
+ const promotionIds = /* @__PURE__ */ new Set();
13028
+ for (const item of items) {
13029
+ if (item.adjustments) {
13030
+ for (const adjustment of item.adjustments) {
13031
+ if (adjustment.promotion_id) {
13032
+ promotionIds.add(adjustment.promotion_id);
13033
+ }
13034
+ }
13035
+ }
13036
+ }
13037
+ for (const shippingMethod of shippingMethods) {
13038
+ if (shippingMethod.adjustments) {
13039
+ for (const adjustment of shippingMethod.adjustments) {
13040
+ if (adjustment.promotion_id) {
13041
+ promotionIds.add(adjustment.promotion_id);
13042
+ }
13043
+ }
13044
+ }
13045
+ }
13046
+ return Array.from(promotionIds);
13047
+ }
13048
+ const widgetModule = { widgets: [] };
13049
+ const routeModule = {
13050
+ routes: [
13051
13051
  {
13052
13052
  Component: List,
13053
13053
  path: "/draft-orders",
@@ -13066,8 +13066,8 @@ const routeModule = {
13066
13066
  loader,
13067
13067
  children: [
13068
13068
  {
13069
- Component: CustomItems,
13070
- path: "/draft-orders/:id/custom-items"
13069
+ Component: BillingAddress,
13070
+ path: "/draft-orders/:id/billing-address"
13071
13071
  },
13072
13072
  {
13073
13073
  Component: Email,
@@ -13077,17 +13077,13 @@ const routeModule = {
13077
13077
  Component: Items,
13078
13078
  path: "/draft-orders/:id/items"
13079
13079
  },
13080
- {
13081
- Component: BillingAddress,
13082
- path: "/draft-orders/:id/billing-address"
13083
- },
13084
13080
  {
13085
13081
  Component: Metadata,
13086
13082
  path: "/draft-orders/:id/metadata"
13087
13083
  },
13088
13084
  {
13089
- Component: Promotions,
13090
- path: "/draft-orders/:id/promotions"
13085
+ Component: CustomItems,
13086
+ path: "/draft-orders/:id/custom-items"
13091
13087
  },
13092
13088
  {
13093
13089
  Component: SalesChannel,
@@ -13104,6 +13100,10 @@ const routeModule = {
13104
13100
  {
13105
13101
  Component: TransferOwnership,
13106
13102
  path: "/draft-orders/:id/transfer-ownership"
13103
+ },
13104
+ {
13105
+ Component: Promotions,
13106
+ path: "/draft-orders/:id/promotions"
13107
13107
  }
13108
13108
  ]
13109
13109
  }