@medusajs/draft-order 2.10.2-preview-20250904000308 → 2.10.2-preview-20250904031023

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.
@@ -9560,6 +9560,196 @@ const ID = () => {
9560
9560
  /* @__PURE__ */ jsxRuntime.jsx(reactRouterDom.Outlet, {})
9561
9561
  ] });
9562
9562
  };
9563
+ const BillingAddress = () => {
9564
+ const { id } = reactRouterDom.useParams();
9565
+ const { order, isPending, isError, error } = useOrder(id, {
9566
+ fields: "+billing_address"
9567
+ });
9568
+ if (isError) {
9569
+ throw error;
9570
+ }
9571
+ const isReady = !isPending && !!order;
9572
+ return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
9573
+ /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
9574
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Billing Address" }) }),
9575
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit the billing address for the draft order" }) })
9576
+ ] }),
9577
+ isReady && /* @__PURE__ */ jsxRuntime.jsx(BillingAddressForm, { order })
9578
+ ] });
9579
+ };
9580
+ const BillingAddressForm = ({ order }) => {
9581
+ var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
9582
+ const form = reactHookForm.useForm({
9583
+ defaultValues: {
9584
+ first_name: ((_a = order.billing_address) == null ? void 0 : _a.first_name) ?? "",
9585
+ last_name: ((_b = order.billing_address) == null ? void 0 : _b.last_name) ?? "",
9586
+ company: ((_c = order.billing_address) == null ? void 0 : _c.company) ?? "",
9587
+ address_1: ((_d = order.billing_address) == null ? void 0 : _d.address_1) ?? "",
9588
+ address_2: ((_e = order.billing_address) == null ? void 0 : _e.address_2) ?? "",
9589
+ city: ((_f = order.billing_address) == null ? void 0 : _f.city) ?? "",
9590
+ province: ((_g = order.billing_address) == null ? void 0 : _g.province) ?? "",
9591
+ country_code: ((_h = order.billing_address) == null ? void 0 : _h.country_code) ?? "",
9592
+ postal_code: ((_i = order.billing_address) == null ? void 0 : _i.postal_code) ?? "",
9593
+ phone: ((_j = order.billing_address) == null ? void 0 : _j.phone) ?? ""
9594
+ },
9595
+ resolver: zod.zodResolver(schema$5)
9596
+ });
9597
+ const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
9598
+ const { handleSuccess } = useRouteModal();
9599
+ const onSubmit = form.handleSubmit(async (data) => {
9600
+ await mutateAsync(
9601
+ { billing_address: data },
9602
+ {
9603
+ onSuccess: () => {
9604
+ handleSuccess();
9605
+ },
9606
+ onError: (error) => {
9607
+ ui.toast.error(error.message);
9608
+ }
9609
+ }
9610
+ );
9611
+ });
9612
+ return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
9613
+ KeyboundForm,
9614
+ {
9615
+ className: "flex flex-1 flex-col overflow-hidden",
9616
+ onSubmit,
9617
+ children: [
9618
+ /* @__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: [
9619
+ /* @__PURE__ */ jsxRuntime.jsx(
9620
+ Form$2.Field,
9621
+ {
9622
+ control: form.control,
9623
+ name: "country_code",
9624
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9625
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Country" }),
9626
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(CountrySelect, { ...field }) }),
9627
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9628
+ ] })
9629
+ }
9630
+ ),
9631
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
9632
+ /* @__PURE__ */ jsxRuntime.jsx(
9633
+ Form$2.Field,
9634
+ {
9635
+ control: form.control,
9636
+ name: "first_name",
9637
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9638
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "First name" }),
9639
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9640
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9641
+ ] })
9642
+ }
9643
+ ),
9644
+ /* @__PURE__ */ jsxRuntime.jsx(
9645
+ Form$2.Field,
9646
+ {
9647
+ control: form.control,
9648
+ name: "last_name",
9649
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9650
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Last name" }),
9651
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9652
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9653
+ ] })
9654
+ }
9655
+ )
9656
+ ] }),
9657
+ /* @__PURE__ */ jsxRuntime.jsx(
9658
+ Form$2.Field,
9659
+ {
9660
+ control: form.control,
9661
+ name: "company",
9662
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9663
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Company" }),
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
+ /* @__PURE__ */ jsxRuntime.jsx(
9670
+ Form$2.Field,
9671
+ {
9672
+ control: form.control,
9673
+ name: "address_1",
9674
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9675
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Address" }),
9676
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9677
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9678
+ ] })
9679
+ }
9680
+ ),
9681
+ /* @__PURE__ */ jsxRuntime.jsx(
9682
+ Form$2.Field,
9683
+ {
9684
+ control: form.control,
9685
+ name: "address_2",
9686
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9687
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Apartment, suite, etc." }),
9688
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9689
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9690
+ ] })
9691
+ }
9692
+ ),
9693
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
9694
+ /* @__PURE__ */ jsxRuntime.jsx(
9695
+ Form$2.Field,
9696
+ {
9697
+ control: form.control,
9698
+ name: "postal_code",
9699
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9700
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Postal code" }),
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.jsx(
9707
+ Form$2.Field,
9708
+ {
9709
+ control: form.control,
9710
+ name: "city",
9711
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9712
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "City" }),
9713
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9714
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9715
+ ] })
9716
+ }
9717
+ )
9718
+ ] }),
9719
+ /* @__PURE__ */ jsxRuntime.jsx(
9720
+ Form$2.Field,
9721
+ {
9722
+ control: form.control,
9723
+ name: "province",
9724
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9725
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Province / State" }),
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
+ /* @__PURE__ */ jsxRuntime.jsx(
9732
+ Form$2.Field,
9733
+ {
9734
+ control: form.control,
9735
+ name: "phone",
9736
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9737
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Phone" }),
9738
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9739
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9740
+ ] })
9741
+ }
9742
+ )
9743
+ ] }) }),
9744
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
9745
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
9746
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
9747
+ ] }) })
9748
+ ]
9749
+ }
9750
+ ) });
9751
+ };
9752
+ const schema$5 = addressSchema;
9563
9753
  const CustomItems = () => {
9564
9754
  return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
9565
9755
  /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Header, { children: /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Custom Items" }) }) }),
@@ -9568,7 +9758,7 @@ const CustomItems = () => {
9568
9758
  };
9569
9759
  const CustomItemsForm = () => {
9570
9760
  const form = reactHookForm.useForm({
9571
- resolver: zod.zodResolver(schema$5)
9761
+ resolver: zod.zodResolver(schema$4)
9572
9762
  });
9573
9763
  return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(KeyboundForm, { className: "flex flex-1 flex-col", children: [
9574
9764
  /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, {}),
@@ -9578,7 +9768,7 @@ const CustomItemsForm = () => {
9578
9768
  ] }) })
9579
9769
  ] }) });
9580
9770
  };
9581
- const schema$5 = objectType({
9771
+ const schema$4 = objectType({
9582
9772
  email: stringType().email()
9583
9773
  });
9584
9774
  const Email = () => {
@@ -9603,7 +9793,7 @@ const EmailForm = ({ order }) => {
9603
9793
  defaultValues: {
9604
9794
  email: order.email ?? ""
9605
9795
  },
9606
- resolver: zod.zodResolver(schema$4)
9796
+ resolver: zod.zodResolver(schema$3)
9607
9797
  });
9608
9798
  const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
9609
9799
  const { handleSuccess } = useRouteModal();
@@ -9646,7 +9836,7 @@ const EmailForm = ({ order }) => {
9646
9836
  }
9647
9837
  ) });
9648
9838
  };
9649
- const schema$4 = objectType({
9839
+ const schema$3 = objectType({
9650
9840
  email: stringType().email()
9651
9841
  });
9652
9842
  const NumberInput = React.forwardRef(
@@ -10623,148 +10813,425 @@ const customItemSchema = objectType({
10623
10813
  quantity: numberType(),
10624
10814
  unit_price: unionType([numberType(), stringType()])
10625
10815
  });
10626
- const InlineTip = React.forwardRef(
10627
- ({ variant = "tip", label, className, children, ...props }, ref) => {
10628
- const labelValue = label || (variant === "warning" ? "Warning" : "Tip");
10629
- return /* @__PURE__ */ jsxRuntime.jsxs(
10630
- "div",
10631
- {
10632
- ref,
10633
- className: ui.clx(
10634
- "bg-ui-bg-component txt-small text-ui-fg-subtle grid grid-cols-[4px_1fr] items-start gap-3 rounded-lg border p-3",
10635
- className
10636
- ),
10637
- ...props,
10638
- children: [
10639
- /* @__PURE__ */ jsxRuntime.jsx(
10640
- "div",
10641
- {
10642
- role: "presentation",
10643
- className: ui.clx("w-4px bg-ui-tag-neutral-icon h-full rounded-full", {
10644
- "bg-ui-tag-orange-icon": variant === "warning"
10645
- })
10646
- }
10647
- ),
10648
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-pretty", children: [
10649
- /* @__PURE__ */ jsxRuntime.jsxs("strong", { className: "txt-small-plus text-ui-fg-base", children: [
10650
- labelValue,
10651
- ":"
10652
- ] }),
10653
- " ",
10654
- children
10655
- ] })
10656
- ]
10657
- }
10658
- );
10659
- }
10660
- );
10661
- InlineTip.displayName = "InlineTip";
10662
- const MetadataFieldSchema = objectType({
10663
- key: stringType(),
10664
- disabled: booleanType().optional(),
10665
- value: anyType()
10666
- });
10667
- const MetadataSchema = objectType({
10668
- metadata: arrayType(MetadataFieldSchema)
10669
- });
10670
- const Metadata = () => {
10671
- const { id } = reactRouterDom.useParams();
10672
- const { order, isPending, isError, error } = useOrder(id, {
10673
- fields: "metadata"
10674
- });
10675
- if (isError) {
10676
- throw error;
10677
- }
10678
- const isReady = !isPending && !!order;
10679
- return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
10680
- /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
10681
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Metadata" }) }),
10682
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Add metadata to the draft order." }) })
10683
- ] }),
10684
- !isReady ? /* @__PURE__ */ jsxRuntime.jsx(PlaceholderInner, {}) : /* @__PURE__ */ jsxRuntime.jsx(MetadataForm, { orderId: id, metadata: order == null ? void 0 : order.metadata })
10685
- ] });
10816
+ const PROMOTION_QUERY_KEY = "promotions";
10817
+ const promotionsQueryKeys = {
10818
+ list: (query2) => [
10819
+ PROMOTION_QUERY_KEY,
10820
+ query2 ? query2 : void 0
10821
+ ],
10822
+ detail: (id, query2) => [
10823
+ PROMOTION_QUERY_KEY,
10824
+ id,
10825
+ query2 ? query2 : void 0
10826
+ ]
10686
10827
  };
10687
- const METADATA_KEY_LABEL_ID = "metadata-form-key-label";
10688
- const METADATA_VALUE_LABEL_ID = "metadata-form-value-label";
10689
- const MetadataForm = ({ orderId, metadata }) => {
10828
+ const usePromotions = (query2, options) => {
10829
+ const { data, ...rest } = reactQuery.useQuery({
10830
+ queryKey: promotionsQueryKeys.list(query2),
10831
+ queryFn: async () => sdk.admin.promotion.list(query2),
10832
+ ...options
10833
+ });
10834
+ return { ...data, ...rest };
10835
+ };
10836
+ const Promotions = () => {
10837
+ const { id } = reactRouterDom.useParams();
10838
+ const {
10839
+ order: preview,
10840
+ isError: isPreviewError,
10841
+ error: previewError
10842
+ } = useOrderPreview(id, void 0);
10843
+ useInitiateOrderEdit({ preview });
10844
+ const { onCancel } = useCancelOrderEdit({ preview });
10845
+ if (isPreviewError) {
10846
+ throw previewError;
10847
+ }
10848
+ const isReady = !!preview;
10849
+ return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { onClose: onCancel, children: [
10850
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Header, { children: /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Promotions" }) }) }),
10851
+ isReady && /* @__PURE__ */ jsxRuntime.jsx(PromotionForm, { preview })
10852
+ ] });
10853
+ };
10854
+ const PromotionForm = ({ preview }) => {
10855
+ const { items, shipping_methods } = preview;
10856
+ const [isSubmitting, setIsSubmitting] = React.useState(false);
10857
+ const [comboboxValue, setComboboxValue] = React.useState("");
10690
10858
  const { handleSuccess } = useRouteModal();
10691
- const hasUneditableRows = getHasUneditableRows(metadata);
10692
- const { mutateAsync, isPending } = useUpdateDraftOrder(orderId);
10693
- const form = reactHookForm.useForm({
10694
- defaultValues: {
10695
- metadata: getDefaultValues(metadata)
10859
+ const { mutateAsync: addPromotions, isPending: isAddingPromotions } = useDraftOrderAddPromotions(preview.id);
10860
+ const promoCodes = getPromotionCodes(items, shipping_methods);
10861
+ const { promotions, isPending, isError, error } = usePromotions(
10862
+ {
10863
+ code: promoCodes
10696
10864
  },
10697
- resolver: zod.zodResolver(MetadataSchema)
10865
+ {
10866
+ enabled: !!promoCodes.length
10867
+ }
10868
+ );
10869
+ const comboboxData = useComboboxData({
10870
+ queryKey: ["promotions", "combobox", promoCodes],
10871
+ queryFn: async (params) => {
10872
+ return await sdk.admin.promotion.list({
10873
+ ...params,
10874
+ code: {
10875
+ $nin: promoCodes
10876
+ }
10877
+ });
10878
+ },
10879
+ getOptions: (data) => {
10880
+ return data.promotions.map((promotion) => ({
10881
+ label: promotion.code,
10882
+ value: promotion.code
10883
+ }));
10884
+ }
10698
10885
  });
10699
- const handleSubmit = form.handleSubmit(async (data) => {
10700
- const parsedData = parseValues(data);
10701
- await mutateAsync(
10886
+ const add = async (value) => {
10887
+ if (!value) {
10888
+ return;
10889
+ }
10890
+ addPromotions(
10702
10891
  {
10703
- metadata: parsedData
10892
+ promo_codes: [value]
10704
10893
  },
10705
10894
  {
10706
- onSuccess: () => {
10707
- ui.toast.success("Metadata updated");
10708
- handleSuccess();
10895
+ onError: (e) => {
10896
+ ui.toast.error(e.message);
10897
+ comboboxData.onSearchValueChange("");
10898
+ setComboboxValue("");
10709
10899
  },
10710
- onError: (error) => {
10711
- ui.toast.error(error.message);
10900
+ onSuccess: () => {
10901
+ comboboxData.onSearchValueChange("");
10902
+ setComboboxValue("");
10712
10903
  }
10713
10904
  }
10714
10905
  );
10715
- });
10716
- const { fields, insert, remove } = reactHookForm.useFieldArray({
10717
- control: form.control,
10718
- name: "metadata"
10719
- });
10720
- function deleteRow(index) {
10721
- remove(index);
10722
- if (fields.length === 1) {
10723
- insert(0, {
10724
- key: "",
10725
- value: "",
10726
- disabled: false
10727
- });
10906
+ };
10907
+ const { mutateAsync: confirmOrderEdit } = useDraftOrderConfirmEdit(preview.id);
10908
+ const { mutateAsync: requestOrderEdit } = useOrderEditRequest(preview.id);
10909
+ const onSubmit = async () => {
10910
+ setIsSubmitting(true);
10911
+ let requestSucceeded = false;
10912
+ await requestOrderEdit(void 0, {
10913
+ onError: (e) => {
10914
+ ui.toast.error(e.message);
10915
+ },
10916
+ onSuccess: () => {
10917
+ requestSucceeded = true;
10918
+ }
10919
+ });
10920
+ if (!requestSucceeded) {
10921
+ setIsSubmitting(false);
10922
+ return;
10728
10923
  }
10729
- }
10730
- function insertRow(index, position) {
10731
- insert(index + (position === "above" ? 0 : 1), {
10732
- key: "",
10733
- value: "",
10734
- disabled: false
10924
+ await confirmOrderEdit(void 0, {
10925
+ onError: (e) => {
10926
+ ui.toast.error(e.message);
10927
+ },
10928
+ onSuccess: () => {
10929
+ handleSuccess();
10930
+ },
10931
+ onSettled: () => {
10932
+ setIsSubmitting(false);
10933
+ }
10735
10934
  });
10935
+ };
10936
+ if (isError) {
10937
+ throw error;
10736
10938
  }
10737
- return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
10738
- KeyboundForm,
10939
+ return /* @__PURE__ */ jsxRuntime.jsxs(KeyboundForm, { className: "flex flex-1 flex-col", onSubmit, children: [
10940
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-4", children: [
10941
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-3", children: [
10942
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col", children: [
10943
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Label, { size: "small", weight: "plus", htmlFor: "promotion-combobox", children: "Apply promotions" }),
10944
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Hint, { id: "promotion-combobox-hint", children: "Manage promotions that should be applied to the order." })
10945
+ ] }),
10946
+ /* @__PURE__ */ jsxRuntime.jsx(
10947
+ Combobox,
10948
+ {
10949
+ id: "promotion-combobox",
10950
+ "aria-describedby": "promotion-combobox-hint",
10951
+ isFetchingNextPage: comboboxData.isFetchingNextPage,
10952
+ fetchNextPage: comboboxData.fetchNextPage,
10953
+ options: comboboxData.options,
10954
+ onSearchValueChange: comboboxData.onSearchValueChange,
10955
+ searchValue: comboboxData.searchValue,
10956
+ disabled: comboboxData.disabled || isAddingPromotions,
10957
+ onChange: add,
10958
+ value: comboboxValue
10959
+ }
10960
+ )
10961
+ ] }),
10962
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Divider, { variant: "dashed" }),
10963
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col gap-2", children: promotions == null ? void 0 : promotions.map((promotion) => /* @__PURE__ */ jsxRuntime.jsx(
10964
+ PromotionItem,
10965
+ {
10966
+ promotion,
10967
+ orderId: preview.id,
10968
+ isLoading: isPending
10969
+ },
10970
+ promotion.id
10971
+ )) })
10972
+ ] }) }),
10973
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
10974
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
10975
+ /* @__PURE__ */ jsxRuntime.jsx(
10976
+ ui.Button,
10977
+ {
10978
+ size: "small",
10979
+ type: "submit",
10980
+ isLoading: isSubmitting || isAddingPromotions,
10981
+ children: "Save"
10982
+ }
10983
+ )
10984
+ ] }) })
10985
+ ] });
10986
+ };
10987
+ const PromotionItem = ({
10988
+ promotion,
10989
+ orderId,
10990
+ isLoading
10991
+ }) => {
10992
+ var _a;
10993
+ const { mutateAsync: removePromotions, isPending } = useDraftOrderRemovePromotions(orderId);
10994
+ const onRemove = async () => {
10995
+ removePromotions(
10996
+ {
10997
+ promo_codes: [promotion.code]
10998
+ },
10999
+ {
11000
+ onError: (e) => {
11001
+ ui.toast.error(e.message);
11002
+ }
11003
+ }
11004
+ );
11005
+ };
11006
+ const displayValue = getDisplayValue(promotion);
11007
+ return /* @__PURE__ */ jsxRuntime.jsxs(
11008
+ "div",
10739
11009
  {
10740
- onSubmit: handleSubmit,
10741
- className: "flex flex-1 flex-col overflow-hidden",
11010
+ className: ui.clx(
11011
+ "px-3 py-2 rounded-lg bg-ui-bg-component shadow-elevation-card-rest flex items-center justify-between",
11012
+ {
11013
+ "animate-pulse": isLoading
11014
+ }
11015
+ ),
10742
11016
  children: [
10743
- /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Body, { className: "flex flex-1 flex-col gap-y-8 overflow-y-auto", children: [
10744
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-ui-bg-base shadow-elevation-card-rest grid grid-cols-1 divide-y rounded-lg", children: [
10745
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-ui-bg-subtle grid grid-cols-2 divide-x rounded-t-lg", children: [
10746
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "txt-compact-small-plus text-ui-fg-subtle px-2 py-1.5", children: /* @__PURE__ */ jsxRuntime.jsx("label", { id: METADATA_KEY_LABEL_ID, children: "Key" }) }),
10747
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "txt-compact-small-plus text-ui-fg-subtle px-2 py-1.5", children: /* @__PURE__ */ jsxRuntime.jsx("label", { id: METADATA_VALUE_LABEL_ID, children: "Value" }) })
11017
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
11018
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", weight: "plus", leading: "compact", children: promotion.code }),
11019
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1.5 text-ui-fg-subtle", children: [
11020
+ displayValue && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1.5", children: [
11021
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", leading: "compact", children: displayValue }),
11022
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", leading: "compact", children: "·" })
10748
11023
  ] }),
10749
- fields.map((field, index) => {
10750
- const isDisabled = field.disabled || false;
10751
- let placeholder = "-";
10752
- if (typeof field.value === "object") {
10753
- placeholder = "{ ... }";
10754
- }
10755
- if (Array.isArray(field.value)) {
10756
- placeholder = "[ ... ]";
10757
- }
10758
- return /* @__PURE__ */ jsxRuntime.jsx(
10759
- ConditionalTooltip,
10760
- {
10761
- showTooltip: isDisabled,
10762
- content: "This row is disabled because it contains non-primitive data.",
10763
- children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "group/table relative", children: [
10764
- /* @__PURE__ */ jsxRuntime.jsxs(
10765
- "div",
10766
- {
10767
- className: ui.clx("grid grid-cols-2 divide-x", {
11024
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", leading: "compact", className: "capitalize", children: (_a = promotion.application_method) == null ? void 0 : _a.allocation })
11025
+ ] })
11026
+ ] }),
11027
+ /* @__PURE__ */ jsxRuntime.jsx(
11028
+ ui.IconButton,
11029
+ {
11030
+ size: "small",
11031
+ type: "button",
11032
+ variant: "transparent",
11033
+ onClick: onRemove,
11034
+ isLoading: isPending || isLoading,
11035
+ children: /* @__PURE__ */ jsxRuntime.jsx(icons.XMark, {})
11036
+ }
11037
+ )
11038
+ ]
11039
+ },
11040
+ promotion.id
11041
+ );
11042
+ };
11043
+ function getDisplayValue(promotion) {
11044
+ var _a, _b, _c, _d;
11045
+ const value = (_a = promotion.application_method) == null ? void 0 : _a.value;
11046
+ if (!value) {
11047
+ return null;
11048
+ }
11049
+ if (((_b = promotion.application_method) == null ? void 0 : _b.type) === "fixed") {
11050
+ const currency = (_c = promotion.application_method) == null ? void 0 : _c.currency_code;
11051
+ if (!currency) {
11052
+ return null;
11053
+ }
11054
+ return getLocaleAmount(value, currency);
11055
+ } else if (((_d = promotion.application_method) == null ? void 0 : _d.type) === "percentage") {
11056
+ return formatPercentage(value);
11057
+ }
11058
+ return null;
11059
+ }
11060
+ const formatter = new Intl.NumberFormat([], {
11061
+ style: "percent",
11062
+ minimumFractionDigits: 2
11063
+ });
11064
+ const formatPercentage = (value, isPercentageValue = false) => {
11065
+ let val = value || 0;
11066
+ if (!isPercentageValue) {
11067
+ val = val / 100;
11068
+ }
11069
+ return formatter.format(val);
11070
+ };
11071
+ function getPromotionCodes(items, shippingMethods) {
11072
+ const codes = /* @__PURE__ */ new Set();
11073
+ for (const item of items) {
11074
+ if (item.adjustments) {
11075
+ for (const adjustment of item.adjustments) {
11076
+ if (adjustment.code) {
11077
+ codes.add(adjustment.code);
11078
+ }
11079
+ }
11080
+ }
11081
+ }
11082
+ for (const shippingMethod of shippingMethods) {
11083
+ if (shippingMethod.adjustments) {
11084
+ for (const adjustment of shippingMethod.adjustments) {
11085
+ if (adjustment.code) {
11086
+ codes.add(adjustment.code);
11087
+ }
11088
+ }
11089
+ }
11090
+ }
11091
+ return Array.from(codes);
11092
+ }
11093
+ const InlineTip = React.forwardRef(
11094
+ ({ variant = "tip", label, className, children, ...props }, ref) => {
11095
+ const labelValue = label || (variant === "warning" ? "Warning" : "Tip");
11096
+ return /* @__PURE__ */ jsxRuntime.jsxs(
11097
+ "div",
11098
+ {
11099
+ ref,
11100
+ className: ui.clx(
11101
+ "bg-ui-bg-component txt-small text-ui-fg-subtle grid grid-cols-[4px_1fr] items-start gap-3 rounded-lg border p-3",
11102
+ className
11103
+ ),
11104
+ ...props,
11105
+ children: [
11106
+ /* @__PURE__ */ jsxRuntime.jsx(
11107
+ "div",
11108
+ {
11109
+ role: "presentation",
11110
+ className: ui.clx("w-4px bg-ui-tag-neutral-icon h-full rounded-full", {
11111
+ "bg-ui-tag-orange-icon": variant === "warning"
11112
+ })
11113
+ }
11114
+ ),
11115
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-pretty", children: [
11116
+ /* @__PURE__ */ jsxRuntime.jsxs("strong", { className: "txt-small-plus text-ui-fg-base", children: [
11117
+ labelValue,
11118
+ ":"
11119
+ ] }),
11120
+ " ",
11121
+ children
11122
+ ] })
11123
+ ]
11124
+ }
11125
+ );
11126
+ }
11127
+ );
11128
+ InlineTip.displayName = "InlineTip";
11129
+ const MetadataFieldSchema = objectType({
11130
+ key: stringType(),
11131
+ disabled: booleanType().optional(),
11132
+ value: anyType()
11133
+ });
11134
+ const MetadataSchema = objectType({
11135
+ metadata: arrayType(MetadataFieldSchema)
11136
+ });
11137
+ const Metadata = () => {
11138
+ const { id } = reactRouterDom.useParams();
11139
+ const { order, isPending, isError, error } = useOrder(id, {
11140
+ fields: "metadata"
11141
+ });
11142
+ if (isError) {
11143
+ throw error;
11144
+ }
11145
+ const isReady = !isPending && !!order;
11146
+ return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
11147
+ /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
11148
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Metadata" }) }),
11149
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Add metadata to the draft order." }) })
11150
+ ] }),
11151
+ !isReady ? /* @__PURE__ */ jsxRuntime.jsx(PlaceholderInner, {}) : /* @__PURE__ */ jsxRuntime.jsx(MetadataForm, { orderId: id, metadata: order == null ? void 0 : order.metadata })
11152
+ ] });
11153
+ };
11154
+ const METADATA_KEY_LABEL_ID = "metadata-form-key-label";
11155
+ const METADATA_VALUE_LABEL_ID = "metadata-form-value-label";
11156
+ const MetadataForm = ({ orderId, metadata }) => {
11157
+ const { handleSuccess } = useRouteModal();
11158
+ const hasUneditableRows = getHasUneditableRows(metadata);
11159
+ const { mutateAsync, isPending } = useUpdateDraftOrder(orderId);
11160
+ const form = reactHookForm.useForm({
11161
+ defaultValues: {
11162
+ metadata: getDefaultValues(metadata)
11163
+ },
11164
+ resolver: zod.zodResolver(MetadataSchema)
11165
+ });
11166
+ const handleSubmit = form.handleSubmit(async (data) => {
11167
+ const parsedData = parseValues(data);
11168
+ await mutateAsync(
11169
+ {
11170
+ metadata: parsedData
11171
+ },
11172
+ {
11173
+ onSuccess: () => {
11174
+ ui.toast.success("Metadata updated");
11175
+ handleSuccess();
11176
+ },
11177
+ onError: (error) => {
11178
+ ui.toast.error(error.message);
11179
+ }
11180
+ }
11181
+ );
11182
+ });
11183
+ const { fields, insert, remove } = reactHookForm.useFieldArray({
11184
+ control: form.control,
11185
+ name: "metadata"
11186
+ });
11187
+ function deleteRow(index) {
11188
+ remove(index);
11189
+ if (fields.length === 1) {
11190
+ insert(0, {
11191
+ key: "",
11192
+ value: "",
11193
+ disabled: false
11194
+ });
11195
+ }
11196
+ }
11197
+ function insertRow(index, position) {
11198
+ insert(index + (position === "above" ? 0 : 1), {
11199
+ key: "",
11200
+ value: "",
11201
+ disabled: false
11202
+ });
11203
+ }
11204
+ return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
11205
+ KeyboundForm,
11206
+ {
11207
+ onSubmit: handleSubmit,
11208
+ className: "flex flex-1 flex-col overflow-hidden",
11209
+ children: [
11210
+ /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Body, { className: "flex flex-1 flex-col gap-y-8 overflow-y-auto", children: [
11211
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-ui-bg-base shadow-elevation-card-rest grid grid-cols-1 divide-y rounded-lg", children: [
11212
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-ui-bg-subtle grid grid-cols-2 divide-x rounded-t-lg", children: [
11213
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "txt-compact-small-plus text-ui-fg-subtle px-2 py-1.5", children: /* @__PURE__ */ jsxRuntime.jsx("label", { id: METADATA_KEY_LABEL_ID, children: "Key" }) }),
11214
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "txt-compact-small-plus text-ui-fg-subtle px-2 py-1.5", children: /* @__PURE__ */ jsxRuntime.jsx("label", { id: METADATA_VALUE_LABEL_ID, children: "Value" }) })
11215
+ ] }),
11216
+ fields.map((field, index) => {
11217
+ const isDisabled = field.disabled || false;
11218
+ let placeholder = "-";
11219
+ if (typeof field.value === "object") {
11220
+ placeholder = "{ ... }";
11221
+ }
11222
+ if (Array.isArray(field.value)) {
11223
+ placeholder = "[ ... ]";
11224
+ }
11225
+ return /* @__PURE__ */ jsxRuntime.jsx(
11226
+ ConditionalTooltip,
11227
+ {
11228
+ showTooltip: isDisabled,
11229
+ content: "This row is disabled because it contains non-primitive data.",
11230
+ children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "group/table relative", children: [
11231
+ /* @__PURE__ */ jsxRuntime.jsxs(
11232
+ "div",
11233
+ {
11234
+ className: ui.clx("grid grid-cols-2 divide-x", {
10768
11235
  "overflow-hidden rounded-b-lg": index === fields.length - 1
10769
11236
  }),
10770
11237
  children: [
@@ -10931,324 +11398,47 @@ function getDefaultValues(metadata) {
10931
11398
  });
10932
11399
  }
10933
11400
  function parseValues(values) {
10934
- const metadata = values.metadata;
10935
- const isEmpty = !metadata.length || metadata.length === 1 && !metadata[0].key && !metadata[0].value;
10936
- if (isEmpty) {
10937
- return null;
10938
- }
10939
- const update = {};
10940
- metadata.forEach((field) => {
10941
- let key = field.key;
10942
- let value = field.value;
10943
- const disabled = field.disabled;
10944
- if (!key || !value) {
10945
- return;
10946
- }
10947
- if (disabled) {
10948
- update[key] = value;
10949
- return;
10950
- }
10951
- key = key.trim();
10952
- value = value.trim();
10953
- if (value === "true") {
10954
- update[key] = true;
10955
- } else if (value === "false") {
10956
- update[key] = false;
10957
- } else {
10958
- const parsedNumber = parseFloat(value);
10959
- if (!isNaN(parsedNumber)) {
10960
- update[key] = parsedNumber;
10961
- } else {
10962
- update[key] = value;
10963
- }
10964
- }
10965
- });
10966
- return update;
10967
- }
10968
- function getHasUneditableRows(metadata) {
10969
- if (!metadata) {
10970
- return false;
10971
- }
10972
- return Object.values(metadata).some(
10973
- (value) => !EDITABLE_TYPES.includes(typeof value)
10974
- );
10975
- }
10976
- const PROMOTION_QUERY_KEY = "promotions";
10977
- const promotionsQueryKeys = {
10978
- list: (query2) => [
10979
- PROMOTION_QUERY_KEY,
10980
- query2 ? query2 : void 0
10981
- ],
10982
- detail: (id, query2) => [
10983
- PROMOTION_QUERY_KEY,
10984
- id,
10985
- query2 ? query2 : void 0
10986
- ]
10987
- };
10988
- const usePromotions = (query2, options) => {
10989
- const { data, ...rest } = reactQuery.useQuery({
10990
- queryKey: promotionsQueryKeys.list(query2),
10991
- queryFn: async () => sdk.admin.promotion.list(query2),
10992
- ...options
10993
- });
10994
- return { ...data, ...rest };
10995
- };
10996
- const Promotions = () => {
10997
- const { id } = reactRouterDom.useParams();
10998
- const {
10999
- order: preview,
11000
- isError: isPreviewError,
11001
- error: previewError
11002
- } = useOrderPreview(id, void 0);
11003
- useInitiateOrderEdit({ preview });
11004
- const { onCancel } = useCancelOrderEdit({ preview });
11005
- if (isPreviewError) {
11006
- throw previewError;
11007
- }
11008
- const isReady = !!preview;
11009
- return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { onClose: onCancel, children: [
11010
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Header, { children: /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Promotions" }) }) }),
11011
- isReady && /* @__PURE__ */ jsxRuntime.jsx(PromotionForm, { preview })
11012
- ] });
11013
- };
11014
- const PromotionForm = ({ preview }) => {
11015
- const { items, shipping_methods } = preview;
11016
- const [isSubmitting, setIsSubmitting] = React.useState(false);
11017
- const [comboboxValue, setComboboxValue] = React.useState("");
11018
- const { handleSuccess } = useRouteModal();
11019
- const { mutateAsync: addPromotions, isPending: isAddingPromotions } = useDraftOrderAddPromotions(preview.id);
11020
- const promoCodes = getPromotionCodes(items, shipping_methods);
11021
- const { promotions, isPending, isError, error } = usePromotions(
11022
- {
11023
- code: promoCodes
11024
- },
11025
- {
11026
- enabled: !!promoCodes.length
11027
- }
11028
- );
11029
- const comboboxData = useComboboxData({
11030
- queryKey: ["promotions", "combobox", promoCodes],
11031
- queryFn: async (params) => {
11032
- return await sdk.admin.promotion.list({
11033
- ...params,
11034
- code: {
11035
- $nin: promoCodes
11036
- }
11037
- });
11038
- },
11039
- getOptions: (data) => {
11040
- return data.promotions.map((promotion) => ({
11041
- label: promotion.code,
11042
- value: promotion.code
11043
- }));
11044
- }
11045
- });
11046
- const add = async (value) => {
11047
- if (!value) {
11048
- return;
11049
- }
11050
- addPromotions(
11051
- {
11052
- promo_codes: [value]
11053
- },
11054
- {
11055
- onError: (e) => {
11056
- ui.toast.error(e.message);
11057
- comboboxData.onSearchValueChange("");
11058
- setComboboxValue("");
11059
- },
11060
- onSuccess: () => {
11061
- comboboxData.onSearchValueChange("");
11062
- setComboboxValue("");
11063
- }
11064
- }
11065
- );
11066
- };
11067
- const { mutateAsync: confirmOrderEdit } = useDraftOrderConfirmEdit(preview.id);
11068
- const { mutateAsync: requestOrderEdit } = useOrderEditRequest(preview.id);
11069
- const onSubmit = async () => {
11070
- setIsSubmitting(true);
11071
- let requestSucceeded = false;
11072
- await requestOrderEdit(void 0, {
11073
- onError: (e) => {
11074
- ui.toast.error(e.message);
11075
- },
11076
- onSuccess: () => {
11077
- requestSucceeded = true;
11078
- }
11079
- });
11080
- if (!requestSucceeded) {
11081
- setIsSubmitting(false);
11082
- return;
11083
- }
11084
- await confirmOrderEdit(void 0, {
11085
- onError: (e) => {
11086
- ui.toast.error(e.message);
11087
- },
11088
- onSuccess: () => {
11089
- handleSuccess();
11090
- },
11091
- onSettled: () => {
11092
- setIsSubmitting(false);
11093
- }
11094
- });
11095
- };
11096
- if (isError) {
11097
- throw error;
11098
- }
11099
- return /* @__PURE__ */ jsxRuntime.jsxs(KeyboundForm, { className: "flex flex-1 flex-col", onSubmit, children: [
11100
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-4", children: [
11101
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-3", children: [
11102
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col", children: [
11103
- /* @__PURE__ */ jsxRuntime.jsx(ui.Label, { size: "small", weight: "plus", htmlFor: "promotion-combobox", children: "Apply promotions" }),
11104
- /* @__PURE__ */ jsxRuntime.jsx(ui.Hint, { id: "promotion-combobox-hint", children: "Manage promotions that should be applied to the order." })
11105
- ] }),
11106
- /* @__PURE__ */ jsxRuntime.jsx(
11107
- Combobox,
11108
- {
11109
- id: "promotion-combobox",
11110
- "aria-describedby": "promotion-combobox-hint",
11111
- isFetchingNextPage: comboboxData.isFetchingNextPage,
11112
- fetchNextPage: comboboxData.fetchNextPage,
11113
- options: comboboxData.options,
11114
- onSearchValueChange: comboboxData.onSearchValueChange,
11115
- searchValue: comboboxData.searchValue,
11116
- disabled: comboboxData.disabled || isAddingPromotions,
11117
- onChange: add,
11118
- value: comboboxValue
11119
- }
11120
- )
11121
- ] }),
11122
- /* @__PURE__ */ jsxRuntime.jsx(ui.Divider, { variant: "dashed" }),
11123
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col gap-2", children: promotions == null ? void 0 : promotions.map((promotion) => /* @__PURE__ */ jsxRuntime.jsx(
11124
- PromotionItem,
11125
- {
11126
- promotion,
11127
- orderId: preview.id,
11128
- isLoading: isPending
11129
- },
11130
- promotion.id
11131
- )) })
11132
- ] }) }),
11133
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
11134
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
11135
- /* @__PURE__ */ jsxRuntime.jsx(
11136
- ui.Button,
11137
- {
11138
- size: "small",
11139
- type: "submit",
11140
- isLoading: isSubmitting || isAddingPromotions,
11141
- children: "Save"
11142
- }
11143
- )
11144
- ] }) })
11145
- ] });
11146
- };
11147
- const PromotionItem = ({
11148
- promotion,
11149
- orderId,
11150
- isLoading
11151
- }) => {
11152
- var _a;
11153
- const { mutateAsync: removePromotions, isPending } = useDraftOrderRemovePromotions(orderId);
11154
- const onRemove = async () => {
11155
- removePromotions(
11156
- {
11157
- promo_codes: [promotion.code]
11158
- },
11159
- {
11160
- onError: (e) => {
11161
- ui.toast.error(e.message);
11162
- }
11163
- }
11164
- );
11165
- };
11166
- const displayValue = getDisplayValue(promotion);
11167
- return /* @__PURE__ */ jsxRuntime.jsxs(
11168
- "div",
11169
- {
11170
- className: ui.clx(
11171
- "px-3 py-2 rounded-lg bg-ui-bg-component shadow-elevation-card-rest flex items-center justify-between",
11172
- {
11173
- "animate-pulse": isLoading
11174
- }
11175
- ),
11176
- children: [
11177
- /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
11178
- /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", weight: "plus", leading: "compact", children: promotion.code }),
11179
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1.5 text-ui-fg-subtle", children: [
11180
- displayValue && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1.5", children: [
11181
- /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", leading: "compact", children: displayValue }),
11182
- /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", leading: "compact", children: "·" })
11183
- ] }),
11184
- /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", leading: "compact", className: "capitalize", children: (_a = promotion.application_method) == null ? void 0 : _a.allocation })
11185
- ] })
11186
- ] }),
11187
- /* @__PURE__ */ jsxRuntime.jsx(
11188
- ui.IconButton,
11189
- {
11190
- size: "small",
11191
- type: "button",
11192
- variant: "transparent",
11193
- onClick: onRemove,
11194
- isLoading: isPending || isLoading,
11195
- children: /* @__PURE__ */ jsxRuntime.jsx(icons.XMark, {})
11196
- }
11197
- )
11198
- ]
11199
- },
11200
- promotion.id
11201
- );
11202
- };
11203
- function getDisplayValue(promotion) {
11204
- var _a, _b, _c, _d;
11205
- const value = (_a = promotion.application_method) == null ? void 0 : _a.value;
11206
- if (!value) {
11207
- return null;
11208
- }
11209
- if (((_b = promotion.application_method) == null ? void 0 : _b.type) === "fixed") {
11210
- const currency = (_c = promotion.application_method) == null ? void 0 : _c.currency_code;
11211
- if (!currency) {
11212
- return null;
11213
- }
11214
- return getLocaleAmount(value, currency);
11215
- } else if (((_d = promotion.application_method) == null ? void 0 : _d.type) === "percentage") {
11216
- return formatPercentage(value);
11217
- }
11218
- return null;
11219
- }
11220
- const formatter = new Intl.NumberFormat([], {
11221
- style: "percent",
11222
- minimumFractionDigits: 2
11223
- });
11224
- const formatPercentage = (value, isPercentageValue = false) => {
11225
- let val = value || 0;
11226
- if (!isPercentageValue) {
11227
- val = val / 100;
11228
- }
11229
- return formatter.format(val);
11230
- };
11231
- function getPromotionCodes(items, shippingMethods) {
11232
- const codes = /* @__PURE__ */ new Set();
11233
- for (const item of items) {
11234
- if (item.adjustments) {
11235
- for (const adjustment of item.adjustments) {
11236
- if (adjustment.code) {
11237
- codes.add(adjustment.code);
11238
- }
11239
- }
11240
- }
11401
+ const metadata = values.metadata;
11402
+ const isEmpty = !metadata.length || metadata.length === 1 && !metadata[0].key && !metadata[0].value;
11403
+ if (isEmpty) {
11404
+ return null;
11241
11405
  }
11242
- for (const shippingMethod of shippingMethods) {
11243
- if (shippingMethod.adjustments) {
11244
- for (const adjustment of shippingMethod.adjustments) {
11245
- if (adjustment.code) {
11246
- codes.add(adjustment.code);
11247
- }
11406
+ const update = {};
11407
+ metadata.forEach((field) => {
11408
+ let key = field.key;
11409
+ let value = field.value;
11410
+ const disabled = field.disabled;
11411
+ if (!key || !value) {
11412
+ return;
11413
+ }
11414
+ if (disabled) {
11415
+ update[key] = value;
11416
+ return;
11417
+ }
11418
+ key = key.trim();
11419
+ value = value.trim();
11420
+ if (value === "true") {
11421
+ update[key] = true;
11422
+ } else if (value === "false") {
11423
+ update[key] = false;
11424
+ } else {
11425
+ const parsedNumber = parseFloat(value);
11426
+ if (!isNaN(parsedNumber)) {
11427
+ update[key] = parsedNumber;
11428
+ } else {
11429
+ update[key] = value;
11248
11430
  }
11249
11431
  }
11432
+ });
11433
+ return update;
11434
+ }
11435
+ function getHasUneditableRows(metadata) {
11436
+ if (!metadata) {
11437
+ return false;
11250
11438
  }
11251
- return Array.from(codes);
11439
+ return Object.values(metadata).some(
11440
+ (value) => !EDITABLE_TYPES.includes(typeof value)
11441
+ );
11252
11442
  }
11253
11443
  const SalesChannel = () => {
11254
11444
  const { id } = reactRouterDom.useParams();
@@ -11278,7 +11468,7 @@ const SalesChannelForm = ({ order }) => {
11278
11468
  defaultValues: {
11279
11469
  sales_channel_id: order.sales_channel_id || ""
11280
11470
  },
11281
- resolver: zod.zodResolver(schema$3)
11471
+ resolver: zod.zodResolver(schema$2)
11282
11472
  });
11283
11473
  const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
11284
11474
  const { handleSuccess } = useRouteModal();
@@ -11353,7 +11543,7 @@ const SalesChannelField = ({ control, order }) => {
11353
11543
  }
11354
11544
  );
11355
11545
  };
11356
- const schema$3 = objectType({
11546
+ const schema$2 = objectType({
11357
11547
  sales_channel_id: stringType().min(1)
11358
11548
  });
11359
11549
  const STACKED_FOCUS_MODAL_ID = "shipping-form";
@@ -12195,7 +12385,7 @@ const ShippingAddressForm = ({ order }) => {
12195
12385
  postal_code: ((_i = order.shipping_address) == null ? void 0 : _i.postal_code) ?? "",
12196
12386
  phone: ((_j = order.shipping_address) == null ? void 0 : _j.phone) ?? ""
12197
12387
  },
12198
- resolver: zod.zodResolver(schema$2)
12388
+ resolver: zod.zodResolver(schema$1)
12199
12389
  });
12200
12390
  const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
12201
12391
  const { handleSuccess } = useRouteModal();
@@ -12365,7 +12555,7 @@ const ShippingAddressForm = ({ order }) => {
12365
12555
  }
12366
12556
  ) });
12367
12557
  };
12368
- const schema$2 = addressSchema;
12558
+ const schema$1 = addressSchema;
12369
12559
  const TransferOwnership = () => {
12370
12560
  const { id } = reactRouterDom.useParams();
12371
12561
  const { draft_order, isPending, isError, error } = useDraftOrder(id, {
@@ -12389,7 +12579,7 @@ const TransferOwnershipForm = ({ order }) => {
12389
12579
  defaultValues: {
12390
12580
  customer_id: order.customer_id || ""
12391
12581
  },
12392
- resolver: zod.zodResolver(schema$1)
12582
+ resolver: zod.zodResolver(schema)
12393
12583
  });
12394
12584
  const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
12395
12585
  const { handleSuccess } = useRouteModal();
@@ -12839,199 +13029,9 @@ const Illustration = () => {
12839
13029
  }
12840
13030
  );
12841
13031
  };
12842
- const schema$1 = objectType({
13032
+ const schema = objectType({
12843
13033
  customer_id: stringType().min(1)
12844
13034
  });
12845
- const BillingAddress = () => {
12846
- const { id } = reactRouterDom.useParams();
12847
- const { order, isPending, isError, error } = useOrder(id, {
12848
- fields: "+billing_address"
12849
- });
12850
- if (isError) {
12851
- throw error;
12852
- }
12853
- const isReady = !isPending && !!order;
12854
- return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
12855
- /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
12856
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Billing Address" }) }),
12857
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit the billing address for the draft order" }) })
12858
- ] }),
12859
- isReady && /* @__PURE__ */ jsxRuntime.jsx(BillingAddressForm, { order })
12860
- ] });
12861
- };
12862
- const BillingAddressForm = ({ order }) => {
12863
- var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
12864
- const form = reactHookForm.useForm({
12865
- defaultValues: {
12866
- first_name: ((_a = order.billing_address) == null ? void 0 : _a.first_name) ?? "",
12867
- last_name: ((_b = order.billing_address) == null ? void 0 : _b.last_name) ?? "",
12868
- company: ((_c = order.billing_address) == null ? void 0 : _c.company) ?? "",
12869
- address_1: ((_d = order.billing_address) == null ? void 0 : _d.address_1) ?? "",
12870
- address_2: ((_e = order.billing_address) == null ? void 0 : _e.address_2) ?? "",
12871
- city: ((_f = order.billing_address) == null ? void 0 : _f.city) ?? "",
12872
- province: ((_g = order.billing_address) == null ? void 0 : _g.province) ?? "",
12873
- country_code: ((_h = order.billing_address) == null ? void 0 : _h.country_code) ?? "",
12874
- postal_code: ((_i = order.billing_address) == null ? void 0 : _i.postal_code) ?? "",
12875
- phone: ((_j = order.billing_address) == null ? void 0 : _j.phone) ?? ""
12876
- },
12877
- resolver: zod.zodResolver(schema)
12878
- });
12879
- const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
12880
- const { handleSuccess } = useRouteModal();
12881
- const onSubmit = form.handleSubmit(async (data) => {
12882
- await mutateAsync(
12883
- { billing_address: data },
12884
- {
12885
- onSuccess: () => {
12886
- handleSuccess();
12887
- },
12888
- onError: (error) => {
12889
- ui.toast.error(error.message);
12890
- }
12891
- }
12892
- );
12893
- });
12894
- return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
12895
- KeyboundForm,
12896
- {
12897
- className: "flex flex-1 flex-col overflow-hidden",
12898
- onSubmit,
12899
- children: [
12900
- /* @__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: [
12901
- /* @__PURE__ */ jsxRuntime.jsx(
12902
- Form$2.Field,
12903
- {
12904
- control: form.control,
12905
- name: "country_code",
12906
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12907
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Country" }),
12908
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(CountrySelect, { ...field }) }),
12909
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12910
- ] })
12911
- }
12912
- ),
12913
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
12914
- /* @__PURE__ */ jsxRuntime.jsx(
12915
- Form$2.Field,
12916
- {
12917
- control: form.control,
12918
- name: "first_name",
12919
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12920
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "First name" }),
12921
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12922
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12923
- ] })
12924
- }
12925
- ),
12926
- /* @__PURE__ */ jsxRuntime.jsx(
12927
- Form$2.Field,
12928
- {
12929
- control: form.control,
12930
- name: "last_name",
12931
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12932
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Last name" }),
12933
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12934
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12935
- ] })
12936
- }
12937
- )
12938
- ] }),
12939
- /* @__PURE__ */ jsxRuntime.jsx(
12940
- Form$2.Field,
12941
- {
12942
- control: form.control,
12943
- name: "company",
12944
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12945
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Company" }),
12946
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12947
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12948
- ] })
12949
- }
12950
- ),
12951
- /* @__PURE__ */ jsxRuntime.jsx(
12952
- Form$2.Field,
12953
- {
12954
- control: form.control,
12955
- name: "address_1",
12956
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12957
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Address" }),
12958
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12959
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12960
- ] })
12961
- }
12962
- ),
12963
- /* @__PURE__ */ jsxRuntime.jsx(
12964
- Form$2.Field,
12965
- {
12966
- control: form.control,
12967
- name: "address_2",
12968
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12969
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Apartment, suite, etc." }),
12970
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12971
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12972
- ] })
12973
- }
12974
- ),
12975
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
12976
- /* @__PURE__ */ jsxRuntime.jsx(
12977
- Form$2.Field,
12978
- {
12979
- control: form.control,
12980
- name: "postal_code",
12981
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12982
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Postal code" }),
12983
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12984
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12985
- ] })
12986
- }
12987
- ),
12988
- /* @__PURE__ */ jsxRuntime.jsx(
12989
- Form$2.Field,
12990
- {
12991
- control: form.control,
12992
- name: "city",
12993
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12994
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "City" }),
12995
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12996
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12997
- ] })
12998
- }
12999
- )
13000
- ] }),
13001
- /* @__PURE__ */ jsxRuntime.jsx(
13002
- Form$2.Field,
13003
- {
13004
- control: form.control,
13005
- name: "province",
13006
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
13007
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Province / State" }),
13008
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
13009
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
13010
- ] })
13011
- }
13012
- ),
13013
- /* @__PURE__ */ jsxRuntime.jsx(
13014
- Form$2.Field,
13015
- {
13016
- control: form.control,
13017
- name: "phone",
13018
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
13019
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Phone" }),
13020
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
13021
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
13022
- ] })
13023
- }
13024
- )
13025
- ] }) }),
13026
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
13027
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
13028
- /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
13029
- ] }) })
13030
- ]
13031
- }
13032
- ) });
13033
- };
13034
- const schema = addressSchema;
13035
13035
  const widgetModule = { widgets: [] };
13036
13036
  const routeModule = {
13037
13037
  routes: [
@@ -13052,6 +13052,10 @@ const routeModule = {
13052
13052
  handle,
13053
13053
  loader,
13054
13054
  children: [
13055
+ {
13056
+ Component: BillingAddress,
13057
+ path: "/draft-orders/:id/billing-address"
13058
+ },
13055
13059
  {
13056
13060
  Component: CustomItems,
13057
13061
  path: "/draft-orders/:id/custom-items"
@@ -13064,14 +13068,14 @@ const routeModule = {
13064
13068
  Component: Items,
13065
13069
  path: "/draft-orders/:id/items"
13066
13070
  },
13067
- {
13068
- Component: Metadata,
13069
- path: "/draft-orders/:id/metadata"
13070
- },
13071
13071
  {
13072
13072
  Component: Promotions,
13073
13073
  path: "/draft-orders/:id/promotions"
13074
13074
  },
13075
+ {
13076
+ Component: Metadata,
13077
+ path: "/draft-orders/:id/metadata"
13078
+ },
13075
13079
  {
13076
13080
  Component: SalesChannel,
13077
13081
  path: "/draft-orders/:id/sales-channel"
@@ -13087,10 +13091,6 @@ const routeModule = {
13087
13091
  {
13088
13092
  Component: TransferOwnership,
13089
13093
  path: "/draft-orders/:id/transfer-ownership"
13090
- },
13091
- {
13092
- Component: BillingAddress,
13093
- path: "/draft-orders/:id/billing-address"
13094
13094
  }
13095
13095
  ]
13096
13096
  }