@medusajs/draft-order 2.10.4-preview-20251011000317 → 2.10.4-preview-20251011030926

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,6 +9573,196 @@ const ID = () => {
9573
9573
  /* @__PURE__ */ jsxRuntime.jsx(reactRouterDom.Outlet, {})
9574
9574
  ] });
9575
9575
  };
9576
+ const BillingAddress = () => {
9577
+ const { id } = reactRouterDom.useParams();
9578
+ const { order, isPending, isError, error } = useOrder(id, {
9579
+ fields: "+billing_address"
9580
+ });
9581
+ if (isError) {
9582
+ throw error;
9583
+ }
9584
+ const isReady = !isPending && !!order;
9585
+ return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
9586
+ /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
9587
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Billing Address" }) }),
9588
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit the billing address for the draft order" }) })
9589
+ ] }),
9590
+ isReady && /* @__PURE__ */ jsxRuntime.jsx(BillingAddressForm, { order })
9591
+ ] });
9592
+ };
9593
+ const BillingAddressForm = ({ order }) => {
9594
+ var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
9595
+ const form = reactHookForm.useForm({
9596
+ defaultValues: {
9597
+ first_name: ((_a = order.billing_address) == null ? void 0 : _a.first_name) ?? "",
9598
+ last_name: ((_b = order.billing_address) == null ? void 0 : _b.last_name) ?? "",
9599
+ company: ((_c = order.billing_address) == null ? void 0 : _c.company) ?? "",
9600
+ address_1: ((_d = order.billing_address) == null ? void 0 : _d.address_1) ?? "",
9601
+ address_2: ((_e = order.billing_address) == null ? void 0 : _e.address_2) ?? "",
9602
+ city: ((_f = order.billing_address) == null ? void 0 : _f.city) ?? "",
9603
+ province: ((_g = order.billing_address) == null ? void 0 : _g.province) ?? "",
9604
+ country_code: ((_h = order.billing_address) == null ? void 0 : _h.country_code) ?? "",
9605
+ postal_code: ((_i = order.billing_address) == null ? void 0 : _i.postal_code) ?? "",
9606
+ phone: ((_j = order.billing_address) == null ? void 0 : _j.phone) ?? ""
9607
+ },
9608
+ resolver: zod.zodResolver(schema$5)
9609
+ });
9610
+ const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
9611
+ const { handleSuccess } = useRouteModal();
9612
+ const onSubmit = form.handleSubmit(async (data) => {
9613
+ await mutateAsync(
9614
+ { billing_address: data },
9615
+ {
9616
+ onSuccess: () => {
9617
+ handleSuccess();
9618
+ },
9619
+ onError: (error) => {
9620
+ ui.toast.error(error.message);
9621
+ }
9622
+ }
9623
+ );
9624
+ });
9625
+ return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
9626
+ KeyboundForm,
9627
+ {
9628
+ className: "flex flex-1 flex-col overflow-hidden",
9629
+ onSubmit,
9630
+ children: [
9631
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-y-4", children: [
9632
+ /* @__PURE__ */ jsxRuntime.jsx(
9633
+ Form$2.Field,
9634
+ {
9635
+ control: form.control,
9636
+ name: "country_code",
9637
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9638
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Country" }),
9639
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(CountrySelect, { ...field }) }),
9640
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9641
+ ] })
9642
+ }
9643
+ ),
9644
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
9645
+ /* @__PURE__ */ jsxRuntime.jsx(
9646
+ Form$2.Field,
9647
+ {
9648
+ control: form.control,
9649
+ name: "first_name",
9650
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9651
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "First name" }),
9652
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9653
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9654
+ ] })
9655
+ }
9656
+ ),
9657
+ /* @__PURE__ */ jsxRuntime.jsx(
9658
+ Form$2.Field,
9659
+ {
9660
+ control: form.control,
9661
+ name: "last_name",
9662
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9663
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Last name" }),
9664
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9665
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9666
+ ] })
9667
+ }
9668
+ )
9669
+ ] }),
9670
+ /* @__PURE__ */ jsxRuntime.jsx(
9671
+ Form$2.Field,
9672
+ {
9673
+ control: form.control,
9674
+ name: "company",
9675
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9676
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Company" }),
9677
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9678
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9679
+ ] })
9680
+ }
9681
+ ),
9682
+ /* @__PURE__ */ jsxRuntime.jsx(
9683
+ Form$2.Field,
9684
+ {
9685
+ control: form.control,
9686
+ name: "address_1",
9687
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9688
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Address" }),
9689
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9690
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9691
+ ] })
9692
+ }
9693
+ ),
9694
+ /* @__PURE__ */ jsxRuntime.jsx(
9695
+ Form$2.Field,
9696
+ {
9697
+ control: form.control,
9698
+ name: "address_2",
9699
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9700
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Apartment, suite, etc." }),
9701
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9702
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9703
+ ] })
9704
+ }
9705
+ ),
9706
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
9707
+ /* @__PURE__ */ jsxRuntime.jsx(
9708
+ Form$2.Field,
9709
+ {
9710
+ control: form.control,
9711
+ name: "postal_code",
9712
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9713
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Postal code" }),
9714
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9715
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9716
+ ] })
9717
+ }
9718
+ ),
9719
+ /* @__PURE__ */ jsxRuntime.jsx(
9720
+ Form$2.Field,
9721
+ {
9722
+ control: form.control,
9723
+ name: "city",
9724
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9725
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "City" }),
9726
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9727
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9728
+ ] })
9729
+ }
9730
+ )
9731
+ ] }),
9732
+ /* @__PURE__ */ jsxRuntime.jsx(
9733
+ Form$2.Field,
9734
+ {
9735
+ control: form.control,
9736
+ name: "province",
9737
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9738
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Province / State" }),
9739
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9740
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9741
+ ] })
9742
+ }
9743
+ ),
9744
+ /* @__PURE__ */ jsxRuntime.jsx(
9745
+ Form$2.Field,
9746
+ {
9747
+ control: form.control,
9748
+ name: "phone",
9749
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9750
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Phone" }),
9751
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9752
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9753
+ ] })
9754
+ }
9755
+ )
9756
+ ] }) }),
9757
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
9758
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
9759
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
9760
+ ] }) })
9761
+ ]
9762
+ }
9763
+ ) });
9764
+ };
9765
+ const schema$5 = addressSchema;
9576
9766
  const CustomItems = () => {
9577
9767
  return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
9578
9768
  /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Header, { children: /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Custom Items" }) }) }),
@@ -9581,7 +9771,7 @@ const CustomItems = () => {
9581
9771
  };
9582
9772
  const CustomItemsForm = () => {
9583
9773
  const form = reactHookForm.useForm({
9584
- resolver: zod.zodResolver(schema$5)
9774
+ resolver: zod.zodResolver(schema$4)
9585
9775
  });
9586
9776
  return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(KeyboundForm, { className: "flex flex-1 flex-col", children: [
9587
9777
  /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, {}),
@@ -9591,7 +9781,7 @@ const CustomItemsForm = () => {
9591
9781
  ] }) })
9592
9782
  ] }) });
9593
9783
  };
9594
- const schema$5 = objectType({
9784
+ const schema$4 = objectType({
9595
9785
  email: stringType().email()
9596
9786
  });
9597
9787
  const Email = () => {
@@ -9616,7 +9806,7 @@ const EmailForm = ({ order }) => {
9616
9806
  defaultValues: {
9617
9807
  email: order.email ?? ""
9618
9808
  },
9619
- resolver: zod.zodResolver(schema$4)
9809
+ resolver: zod.zodResolver(schema$3)
9620
9810
  });
9621
9811
  const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
9622
9812
  const { handleSuccess } = useRouteModal();
@@ -9659,7 +9849,7 @@ const EmailForm = ({ order }) => {
9659
9849
  }
9660
9850
  ) });
9661
9851
  };
9662
- const schema$4 = objectType({
9852
+ const schema$3 = objectType({
9663
9853
  email: stringType().email()
9664
9854
  });
9665
9855
  const NumberInput = React.forwardRef(
@@ -10636,148 +10826,425 @@ const customItemSchema = objectType({
10636
10826
  quantity: numberType(),
10637
10827
  unit_price: unionType([numberType(), stringType()])
10638
10828
  });
10639
- const InlineTip = React.forwardRef(
10640
- ({ variant = "tip", label, className, children, ...props }, ref) => {
10641
- const labelValue = label || (variant === "warning" ? "Warning" : "Tip");
10642
- return /* @__PURE__ */ jsxRuntime.jsxs(
10643
- "div",
10644
- {
10645
- ref,
10646
- className: ui.clx(
10647
- "bg-ui-bg-component txt-small text-ui-fg-subtle grid grid-cols-[4px_1fr] items-start gap-3 rounded-lg border p-3",
10648
- className
10649
- ),
10650
- ...props,
10651
- children: [
10652
- /* @__PURE__ */ jsxRuntime.jsx(
10653
- "div",
10654
- {
10655
- role: "presentation",
10656
- className: ui.clx("w-4px bg-ui-tag-neutral-icon h-full rounded-full", {
10657
- "bg-ui-tag-orange-icon": variant === "warning"
10658
- })
10659
- }
10660
- ),
10661
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-pretty", children: [
10662
- /* @__PURE__ */ jsxRuntime.jsxs("strong", { className: "txt-small-plus text-ui-fg-base", children: [
10663
- labelValue,
10664
- ":"
10665
- ] }),
10666
- " ",
10667
- children
10668
- ] })
10669
- ]
10670
- }
10671
- );
10672
- }
10673
- );
10674
- InlineTip.displayName = "InlineTip";
10675
- const MetadataFieldSchema = objectType({
10676
- key: stringType(),
10677
- disabled: booleanType().optional(),
10678
- value: anyType()
10679
- });
10680
- const MetadataSchema = objectType({
10681
- metadata: arrayType(MetadataFieldSchema)
10682
- });
10683
- const Metadata = () => {
10684
- const { id } = reactRouterDom.useParams();
10685
- const { order, isPending, isError, error } = useOrder(id, {
10686
- fields: "metadata"
10687
- });
10688
- if (isError) {
10689
- throw error;
10690
- }
10691
- const isReady = !isPending && !!order;
10692
- return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
10693
- /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
10694
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Metadata" }) }),
10695
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Add metadata to the draft order." }) })
10696
- ] }),
10697
- !isReady ? /* @__PURE__ */ jsxRuntime.jsx(PlaceholderInner, {}) : /* @__PURE__ */ jsxRuntime.jsx(MetadataForm, { orderId: id, metadata: order == null ? void 0 : order.metadata })
10698
- ] });
10829
+ const PROMOTION_QUERY_KEY = "promotions";
10830
+ const promotionsQueryKeys = {
10831
+ list: (query2) => [
10832
+ PROMOTION_QUERY_KEY,
10833
+ query2 ? query2 : void 0
10834
+ ],
10835
+ detail: (id, query2) => [
10836
+ PROMOTION_QUERY_KEY,
10837
+ id,
10838
+ query2 ? query2 : void 0
10839
+ ]
10699
10840
  };
10700
- const METADATA_KEY_LABEL_ID = "metadata-form-key-label";
10701
- const METADATA_VALUE_LABEL_ID = "metadata-form-value-label";
10702
- const MetadataForm = ({ orderId, metadata }) => {
10841
+ const usePromotions = (query2, options) => {
10842
+ const { data, ...rest } = reactQuery.useQuery({
10843
+ queryKey: promotionsQueryKeys.list(query2),
10844
+ queryFn: async () => sdk.admin.promotion.list(query2),
10845
+ ...options
10846
+ });
10847
+ return { ...data, ...rest };
10848
+ };
10849
+ const Promotions = () => {
10850
+ const { id } = reactRouterDom.useParams();
10851
+ const {
10852
+ order: preview,
10853
+ isError: isPreviewError,
10854
+ error: previewError
10855
+ } = useOrderPreview(id, void 0);
10856
+ useInitiateOrderEdit({ preview });
10857
+ const { onCancel } = useCancelOrderEdit({ preview });
10858
+ if (isPreviewError) {
10859
+ throw previewError;
10860
+ }
10861
+ const isReady = !!preview;
10862
+ return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { onClose: onCancel, children: [
10863
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Header, { children: /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Promotions" }) }) }),
10864
+ isReady && /* @__PURE__ */ jsxRuntime.jsx(PromotionForm, { preview })
10865
+ ] });
10866
+ };
10867
+ const PromotionForm = ({ preview }) => {
10868
+ const { items, shipping_methods } = preview;
10869
+ const [isSubmitting, setIsSubmitting] = React.useState(false);
10870
+ const [comboboxValue, setComboboxValue] = React.useState("");
10703
10871
  const { handleSuccess } = useRouteModal();
10704
- const hasUneditableRows = getHasUneditableRows(metadata);
10705
- const { mutateAsync, isPending } = useUpdateDraftOrder(orderId);
10706
- const form = reactHookForm.useForm({
10707
- defaultValues: {
10708
- metadata: getDefaultValues(metadata)
10872
+ const { mutateAsync: addPromotions, isPending: isAddingPromotions } = useDraftOrderAddPromotions(preview.id);
10873
+ const promoIds = getPromotionIds(items, shipping_methods);
10874
+ const { promotions, isPending, isError, error } = usePromotions(
10875
+ {
10876
+ id: promoIds
10709
10877
  },
10710
- resolver: zod.zodResolver(MetadataSchema)
10878
+ {
10879
+ enabled: !!promoIds.length
10880
+ }
10881
+ );
10882
+ const comboboxData = useComboboxData({
10883
+ queryKey: ["promotions", "combobox", promoIds],
10884
+ queryFn: async (params) => {
10885
+ return await sdk.admin.promotion.list({
10886
+ ...params,
10887
+ id: {
10888
+ $nin: promoIds
10889
+ }
10890
+ });
10891
+ },
10892
+ getOptions: (data) => {
10893
+ return data.promotions.map((promotion) => ({
10894
+ label: promotion.code,
10895
+ value: promotion.code
10896
+ }));
10897
+ }
10711
10898
  });
10712
- const handleSubmit = form.handleSubmit(async (data) => {
10713
- const parsedData = parseValues(data);
10714
- await mutateAsync(
10899
+ const add = async (value) => {
10900
+ if (!value) {
10901
+ return;
10902
+ }
10903
+ addPromotions(
10715
10904
  {
10716
- metadata: parsedData
10905
+ promo_codes: [value]
10717
10906
  },
10718
10907
  {
10719
- onSuccess: () => {
10720
- ui.toast.success("Metadata updated");
10721
- handleSuccess();
10908
+ onError: (e) => {
10909
+ ui.toast.error(e.message);
10910
+ comboboxData.onSearchValueChange("");
10911
+ setComboboxValue("");
10722
10912
  },
10723
- onError: (error) => {
10724
- ui.toast.error(error.message);
10913
+ onSuccess: () => {
10914
+ comboboxData.onSearchValueChange("");
10915
+ setComboboxValue("");
10725
10916
  }
10726
10917
  }
10727
10918
  );
10728
- });
10729
- const { fields, insert, remove } = reactHookForm.useFieldArray({
10730
- control: form.control,
10731
- name: "metadata"
10732
- });
10733
- function deleteRow(index) {
10734
- remove(index);
10735
- if (fields.length === 1) {
10736
- insert(0, {
10737
- key: "",
10738
- value: "",
10739
- disabled: false
10740
- });
10919
+ };
10920
+ const { mutateAsync: confirmOrderEdit } = useDraftOrderConfirmEdit(preview.id);
10921
+ const { mutateAsync: requestOrderEdit } = useOrderEditRequest(preview.id);
10922
+ const onSubmit = async () => {
10923
+ setIsSubmitting(true);
10924
+ let requestSucceeded = false;
10925
+ await requestOrderEdit(void 0, {
10926
+ onError: (e) => {
10927
+ ui.toast.error(e.message);
10928
+ },
10929
+ onSuccess: () => {
10930
+ requestSucceeded = true;
10931
+ }
10932
+ });
10933
+ if (!requestSucceeded) {
10934
+ setIsSubmitting(false);
10935
+ return;
10741
10936
  }
10742
- }
10743
- function insertRow(index, position) {
10744
- insert(index + (position === "above" ? 0 : 1), {
10745
- key: "",
10746
- value: "",
10747
- disabled: false
10937
+ await confirmOrderEdit(void 0, {
10938
+ onError: (e) => {
10939
+ ui.toast.error(e.message);
10940
+ },
10941
+ onSuccess: () => {
10942
+ handleSuccess();
10943
+ },
10944
+ onSettled: () => {
10945
+ setIsSubmitting(false);
10946
+ }
10748
10947
  });
10948
+ };
10949
+ if (isError) {
10950
+ throw error;
10749
10951
  }
10750
- return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
10751
- KeyboundForm,
10952
+ return /* @__PURE__ */ jsxRuntime.jsxs(KeyboundForm, { className: "flex flex-1 flex-col", onSubmit, children: [
10953
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-4", children: [
10954
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-3", children: [
10955
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col", children: [
10956
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Label, { size: "small", weight: "plus", htmlFor: "promotion-combobox", children: "Apply promotions" }),
10957
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Hint, { id: "promotion-combobox-hint", children: "Manage promotions that should be applied to the order." })
10958
+ ] }),
10959
+ /* @__PURE__ */ jsxRuntime.jsx(
10960
+ Combobox,
10961
+ {
10962
+ id: "promotion-combobox",
10963
+ "aria-describedby": "promotion-combobox-hint",
10964
+ isFetchingNextPage: comboboxData.isFetchingNextPage,
10965
+ fetchNextPage: comboboxData.fetchNextPage,
10966
+ options: comboboxData.options,
10967
+ onSearchValueChange: comboboxData.onSearchValueChange,
10968
+ searchValue: comboboxData.searchValue,
10969
+ disabled: comboboxData.disabled || isAddingPromotions,
10970
+ onChange: add,
10971
+ value: comboboxValue
10972
+ }
10973
+ )
10974
+ ] }),
10975
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Divider, { variant: "dashed" }),
10976
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col gap-2", children: promotions == null ? void 0 : promotions.map((promotion) => /* @__PURE__ */ jsxRuntime.jsx(
10977
+ PromotionItem,
10978
+ {
10979
+ promotion,
10980
+ orderId: preview.id,
10981
+ isLoading: isPending
10982
+ },
10983
+ promotion.id
10984
+ )) })
10985
+ ] }) }),
10986
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
10987
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
10988
+ /* @__PURE__ */ jsxRuntime.jsx(
10989
+ ui.Button,
10990
+ {
10991
+ size: "small",
10992
+ type: "submit",
10993
+ isLoading: isSubmitting || isAddingPromotions,
10994
+ children: "Save"
10995
+ }
10996
+ )
10997
+ ] }) })
10998
+ ] });
10999
+ };
11000
+ const PromotionItem = ({
11001
+ promotion,
11002
+ orderId,
11003
+ isLoading
11004
+ }) => {
11005
+ var _a;
11006
+ const { mutateAsync: removePromotions, isPending } = useDraftOrderRemovePromotions(orderId);
11007
+ const onRemove = async () => {
11008
+ removePromotions(
11009
+ {
11010
+ promo_codes: [promotion.code]
11011
+ },
11012
+ {
11013
+ onError: (e) => {
11014
+ ui.toast.error(e.message);
11015
+ }
11016
+ }
11017
+ );
11018
+ };
11019
+ const displayValue = getDisplayValue(promotion);
11020
+ return /* @__PURE__ */ jsxRuntime.jsxs(
11021
+ "div",
10752
11022
  {
10753
- onSubmit: handleSubmit,
10754
- className: "flex flex-1 flex-col overflow-hidden",
11023
+ className: ui.clx(
11024
+ "bg-ui-bg-component shadow-elevation-card-rest flex items-center justify-between rounded-lg px-3 py-2",
11025
+ {
11026
+ "animate-pulse": isLoading
11027
+ }
11028
+ ),
10755
11029
  children: [
10756
- /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Body, { className: "flex flex-1 flex-col gap-y-8 overflow-y-auto", children: [
10757
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-ui-bg-base shadow-elevation-card-rest grid grid-cols-1 divide-y rounded-lg", children: [
10758
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-ui-bg-subtle grid grid-cols-2 divide-x rounded-t-lg", children: [
10759
- /* @__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" }) }),
10760
- /* @__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" }) })
11030
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
11031
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", weight: "plus", leading: "compact", children: promotion.code }),
11032
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-ui-fg-subtle flex items-center gap-1.5", children: [
11033
+ displayValue && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1.5", children: [
11034
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", leading: "compact", children: displayValue }),
11035
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", leading: "compact", children: "·" })
10761
11036
  ] }),
10762
- fields.map((field, index) => {
10763
- const isDisabled = field.disabled || false;
10764
- let placeholder = "-";
10765
- if (typeof field.value === "object") {
10766
- placeholder = "{ ... }";
10767
- }
10768
- if (Array.isArray(field.value)) {
10769
- placeholder = "[ ... ]";
10770
- }
10771
- return /* @__PURE__ */ jsxRuntime.jsx(
10772
- ConditionalTooltip,
10773
- {
10774
- showTooltip: isDisabled,
10775
- content: "This row is disabled because it contains non-primitive data.",
10776
- children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "group/table relative", children: [
10777
- /* @__PURE__ */ jsxRuntime.jsxs(
10778
- "div",
10779
- {
10780
- className: ui.clx("grid grid-cols-2 divide-x", {
11037
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", leading: "compact", className: "capitalize", children: (_a = promotion.application_method) == null ? void 0 : _a.allocation })
11038
+ ] })
11039
+ ] }),
11040
+ /* @__PURE__ */ jsxRuntime.jsx(
11041
+ ui.IconButton,
11042
+ {
11043
+ size: "small",
11044
+ type: "button",
11045
+ variant: "transparent",
11046
+ onClick: onRemove,
11047
+ isLoading: isPending || isLoading,
11048
+ children: /* @__PURE__ */ jsxRuntime.jsx(icons.XMark, {})
11049
+ }
11050
+ )
11051
+ ]
11052
+ },
11053
+ promotion.id
11054
+ );
11055
+ };
11056
+ function getDisplayValue(promotion) {
11057
+ var _a, _b, _c, _d;
11058
+ const value = (_a = promotion.application_method) == null ? void 0 : _a.value;
11059
+ if (!value) {
11060
+ return null;
11061
+ }
11062
+ if (((_b = promotion.application_method) == null ? void 0 : _b.type) === "fixed") {
11063
+ const currency = (_c = promotion.application_method) == null ? void 0 : _c.currency_code;
11064
+ if (!currency) {
11065
+ return null;
11066
+ }
11067
+ return getLocaleAmount(value, currency);
11068
+ } else if (((_d = promotion.application_method) == null ? void 0 : _d.type) === "percentage") {
11069
+ return formatPercentage(value);
11070
+ }
11071
+ return null;
11072
+ }
11073
+ const formatter = new Intl.NumberFormat([], {
11074
+ style: "percent",
11075
+ minimumFractionDigits: 2
11076
+ });
11077
+ const formatPercentage = (value, isPercentageValue = false) => {
11078
+ let val = value || 0;
11079
+ if (!isPercentageValue) {
11080
+ val = val / 100;
11081
+ }
11082
+ return formatter.format(val);
11083
+ };
11084
+ function getPromotionIds(items, shippingMethods) {
11085
+ const promotionIds = /* @__PURE__ */ new Set();
11086
+ for (const item of items) {
11087
+ if (item.adjustments) {
11088
+ for (const adjustment of item.adjustments) {
11089
+ if (adjustment.promotion_id) {
11090
+ promotionIds.add(adjustment.promotion_id);
11091
+ }
11092
+ }
11093
+ }
11094
+ }
11095
+ for (const shippingMethod of shippingMethods) {
11096
+ if (shippingMethod.adjustments) {
11097
+ for (const adjustment of shippingMethod.adjustments) {
11098
+ if (adjustment.promotion_id) {
11099
+ promotionIds.add(adjustment.promotion_id);
11100
+ }
11101
+ }
11102
+ }
11103
+ }
11104
+ return Array.from(promotionIds);
11105
+ }
11106
+ const InlineTip = React.forwardRef(
11107
+ ({ variant = "tip", label, className, children, ...props }, ref) => {
11108
+ const labelValue = label || (variant === "warning" ? "Warning" : "Tip");
11109
+ return /* @__PURE__ */ jsxRuntime.jsxs(
11110
+ "div",
11111
+ {
11112
+ ref,
11113
+ className: ui.clx(
11114
+ "bg-ui-bg-component txt-small text-ui-fg-subtle grid grid-cols-[4px_1fr] items-start gap-3 rounded-lg border p-3",
11115
+ className
11116
+ ),
11117
+ ...props,
11118
+ children: [
11119
+ /* @__PURE__ */ jsxRuntime.jsx(
11120
+ "div",
11121
+ {
11122
+ role: "presentation",
11123
+ className: ui.clx("w-4px bg-ui-tag-neutral-icon h-full rounded-full", {
11124
+ "bg-ui-tag-orange-icon": variant === "warning"
11125
+ })
11126
+ }
11127
+ ),
11128
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-pretty", children: [
11129
+ /* @__PURE__ */ jsxRuntime.jsxs("strong", { className: "txt-small-plus text-ui-fg-base", children: [
11130
+ labelValue,
11131
+ ":"
11132
+ ] }),
11133
+ " ",
11134
+ children
11135
+ ] })
11136
+ ]
11137
+ }
11138
+ );
11139
+ }
11140
+ );
11141
+ InlineTip.displayName = "InlineTip";
11142
+ const MetadataFieldSchema = objectType({
11143
+ key: stringType(),
11144
+ disabled: booleanType().optional(),
11145
+ value: anyType()
11146
+ });
11147
+ const MetadataSchema = objectType({
11148
+ metadata: arrayType(MetadataFieldSchema)
11149
+ });
11150
+ const Metadata = () => {
11151
+ const { id } = reactRouterDom.useParams();
11152
+ const { order, isPending, isError, error } = useOrder(id, {
11153
+ fields: "metadata"
11154
+ });
11155
+ if (isError) {
11156
+ throw error;
11157
+ }
11158
+ const isReady = !isPending && !!order;
11159
+ return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
11160
+ /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
11161
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Metadata" }) }),
11162
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Add metadata to the draft order." }) })
11163
+ ] }),
11164
+ !isReady ? /* @__PURE__ */ jsxRuntime.jsx(PlaceholderInner, {}) : /* @__PURE__ */ jsxRuntime.jsx(MetadataForm, { orderId: id, metadata: order == null ? void 0 : order.metadata })
11165
+ ] });
11166
+ };
11167
+ const METADATA_KEY_LABEL_ID = "metadata-form-key-label";
11168
+ const METADATA_VALUE_LABEL_ID = "metadata-form-value-label";
11169
+ const MetadataForm = ({ orderId, metadata }) => {
11170
+ const { handleSuccess } = useRouteModal();
11171
+ const hasUneditableRows = getHasUneditableRows(metadata);
11172
+ const { mutateAsync, isPending } = useUpdateDraftOrder(orderId);
11173
+ const form = reactHookForm.useForm({
11174
+ defaultValues: {
11175
+ metadata: getDefaultValues(metadata)
11176
+ },
11177
+ resolver: zod.zodResolver(MetadataSchema)
11178
+ });
11179
+ const handleSubmit = form.handleSubmit(async (data) => {
11180
+ const parsedData = parseValues(data);
11181
+ await mutateAsync(
11182
+ {
11183
+ metadata: parsedData
11184
+ },
11185
+ {
11186
+ onSuccess: () => {
11187
+ ui.toast.success("Metadata updated");
11188
+ handleSuccess();
11189
+ },
11190
+ onError: (error) => {
11191
+ ui.toast.error(error.message);
11192
+ }
11193
+ }
11194
+ );
11195
+ });
11196
+ const { fields, insert, remove } = reactHookForm.useFieldArray({
11197
+ control: form.control,
11198
+ name: "metadata"
11199
+ });
11200
+ function deleteRow(index) {
11201
+ remove(index);
11202
+ if (fields.length === 1) {
11203
+ insert(0, {
11204
+ key: "",
11205
+ value: "",
11206
+ disabled: false
11207
+ });
11208
+ }
11209
+ }
11210
+ function insertRow(index, position) {
11211
+ insert(index + (position === "above" ? 0 : 1), {
11212
+ key: "",
11213
+ value: "",
11214
+ disabled: false
11215
+ });
11216
+ }
11217
+ return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
11218
+ KeyboundForm,
11219
+ {
11220
+ onSubmit: handleSubmit,
11221
+ className: "flex flex-1 flex-col overflow-hidden",
11222
+ children: [
11223
+ /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Body, { className: "flex flex-1 flex-col gap-y-8 overflow-y-auto", children: [
11224
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-ui-bg-base shadow-elevation-card-rest grid grid-cols-1 divide-y rounded-lg", children: [
11225
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-ui-bg-subtle grid grid-cols-2 divide-x rounded-t-lg", children: [
11226
+ /* @__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" }) }),
11227
+ /* @__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" }) })
11228
+ ] }),
11229
+ fields.map((field, index) => {
11230
+ const isDisabled = field.disabled || false;
11231
+ let placeholder = "-";
11232
+ if (typeof field.value === "object") {
11233
+ placeholder = "{ ... }";
11234
+ }
11235
+ if (Array.isArray(field.value)) {
11236
+ placeholder = "[ ... ]";
11237
+ }
11238
+ return /* @__PURE__ */ jsxRuntime.jsx(
11239
+ ConditionalTooltip,
11240
+ {
11241
+ showTooltip: isDisabled,
11242
+ content: "This row is disabled because it contains non-primitive data.",
11243
+ children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "group/table relative", children: [
11244
+ /* @__PURE__ */ jsxRuntime.jsxs(
11245
+ "div",
11246
+ {
11247
+ className: ui.clx("grid grid-cols-2 divide-x", {
10781
11248
  "overflow-hidden rounded-b-lg": index === fields.length - 1
10782
11249
  }),
10783
11250
  children: [
@@ -10944,324 +11411,47 @@ function getDefaultValues(metadata) {
10944
11411
  });
10945
11412
  }
10946
11413
  function parseValues(values) {
10947
- const metadata = values.metadata;
10948
- const isEmpty = !metadata.length || metadata.length === 1 && !metadata[0].key && !metadata[0].value;
10949
- if (isEmpty) {
10950
- return null;
10951
- }
10952
- const update = {};
10953
- metadata.forEach((field) => {
10954
- let key = field.key;
10955
- let value = field.value;
10956
- const disabled = field.disabled;
10957
- if (!key || !value) {
10958
- return;
10959
- }
10960
- if (disabled) {
10961
- update[key] = value;
10962
- return;
10963
- }
10964
- key = key.trim();
10965
- value = value.trim();
10966
- if (value === "true") {
10967
- update[key] = true;
10968
- } else if (value === "false") {
10969
- update[key] = false;
10970
- } else {
10971
- const parsedNumber = parseFloat(value);
10972
- if (!isNaN(parsedNumber)) {
10973
- update[key] = parsedNumber;
10974
- } else {
10975
- update[key] = value;
10976
- }
10977
- }
10978
- });
10979
- return update;
10980
- }
10981
- function getHasUneditableRows(metadata) {
10982
- if (!metadata) {
10983
- return false;
10984
- }
10985
- return Object.values(metadata).some(
10986
- (value) => !EDITABLE_TYPES.includes(typeof value)
10987
- );
10988
- }
10989
- const PROMOTION_QUERY_KEY = "promotions";
10990
- const promotionsQueryKeys = {
10991
- list: (query2) => [
10992
- PROMOTION_QUERY_KEY,
10993
- query2 ? query2 : void 0
10994
- ],
10995
- detail: (id, query2) => [
10996
- PROMOTION_QUERY_KEY,
10997
- id,
10998
- query2 ? query2 : void 0
10999
- ]
11000
- };
11001
- const usePromotions = (query2, options) => {
11002
- const { data, ...rest } = reactQuery.useQuery({
11003
- queryKey: promotionsQueryKeys.list(query2),
11004
- queryFn: async () => sdk.admin.promotion.list(query2),
11005
- ...options
11006
- });
11007
- return { ...data, ...rest };
11008
- };
11009
- const Promotions = () => {
11010
- const { id } = reactRouterDom.useParams();
11011
- const {
11012
- order: preview,
11013
- isError: isPreviewError,
11014
- error: previewError
11015
- } = useOrderPreview(id, void 0);
11016
- useInitiateOrderEdit({ preview });
11017
- const { onCancel } = useCancelOrderEdit({ preview });
11018
- if (isPreviewError) {
11019
- throw previewError;
11020
- }
11021
- const isReady = !!preview;
11022
- return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { onClose: onCancel, children: [
11023
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Header, { children: /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Promotions" }) }) }),
11024
- isReady && /* @__PURE__ */ jsxRuntime.jsx(PromotionForm, { preview })
11025
- ] });
11026
- };
11027
- const PromotionForm = ({ preview }) => {
11028
- const { items, shipping_methods } = preview;
11029
- const [isSubmitting, setIsSubmitting] = React.useState(false);
11030
- const [comboboxValue, setComboboxValue] = React.useState("");
11031
- const { handleSuccess } = useRouteModal();
11032
- const { mutateAsync: addPromotions, isPending: isAddingPromotions } = useDraftOrderAddPromotions(preview.id);
11033
- const promoIds = getPromotionIds(items, shipping_methods);
11034
- const { promotions, isPending, isError, error } = usePromotions(
11035
- {
11036
- id: promoIds
11037
- },
11038
- {
11039
- enabled: !!promoIds.length
11040
- }
11041
- );
11042
- const comboboxData = useComboboxData({
11043
- queryKey: ["promotions", "combobox", promoIds],
11044
- queryFn: async (params) => {
11045
- return await sdk.admin.promotion.list({
11046
- ...params,
11047
- id: {
11048
- $nin: promoIds
11049
- }
11050
- });
11051
- },
11052
- getOptions: (data) => {
11053
- return data.promotions.map((promotion) => ({
11054
- label: promotion.code,
11055
- value: promotion.code
11056
- }));
11057
- }
11058
- });
11059
- const add = async (value) => {
11060
- if (!value) {
11061
- return;
11062
- }
11063
- addPromotions(
11064
- {
11065
- promo_codes: [value]
11066
- },
11067
- {
11068
- onError: (e) => {
11069
- ui.toast.error(e.message);
11070
- comboboxData.onSearchValueChange("");
11071
- setComboboxValue("");
11072
- },
11073
- onSuccess: () => {
11074
- comboboxData.onSearchValueChange("");
11075
- setComboboxValue("");
11076
- }
11077
- }
11078
- );
11079
- };
11080
- const { mutateAsync: confirmOrderEdit } = useDraftOrderConfirmEdit(preview.id);
11081
- const { mutateAsync: requestOrderEdit } = useOrderEditRequest(preview.id);
11082
- const onSubmit = async () => {
11083
- setIsSubmitting(true);
11084
- let requestSucceeded = false;
11085
- await requestOrderEdit(void 0, {
11086
- onError: (e) => {
11087
- ui.toast.error(e.message);
11088
- },
11089
- onSuccess: () => {
11090
- requestSucceeded = true;
11091
- }
11092
- });
11093
- if (!requestSucceeded) {
11094
- setIsSubmitting(false);
11095
- return;
11096
- }
11097
- await confirmOrderEdit(void 0, {
11098
- onError: (e) => {
11099
- ui.toast.error(e.message);
11100
- },
11101
- onSuccess: () => {
11102
- handleSuccess();
11103
- },
11104
- onSettled: () => {
11105
- setIsSubmitting(false);
11106
- }
11107
- });
11108
- };
11109
- if (isError) {
11110
- throw error;
11111
- }
11112
- return /* @__PURE__ */ jsxRuntime.jsxs(KeyboundForm, { className: "flex flex-1 flex-col", onSubmit, children: [
11113
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-4", children: [
11114
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-3", children: [
11115
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col", children: [
11116
- /* @__PURE__ */ jsxRuntime.jsx(ui.Label, { size: "small", weight: "plus", htmlFor: "promotion-combobox", children: "Apply promotions" }),
11117
- /* @__PURE__ */ jsxRuntime.jsx(ui.Hint, { id: "promotion-combobox-hint", children: "Manage promotions that should be applied to the order." })
11118
- ] }),
11119
- /* @__PURE__ */ jsxRuntime.jsx(
11120
- Combobox,
11121
- {
11122
- id: "promotion-combobox",
11123
- "aria-describedby": "promotion-combobox-hint",
11124
- isFetchingNextPage: comboboxData.isFetchingNextPage,
11125
- fetchNextPage: comboboxData.fetchNextPage,
11126
- options: comboboxData.options,
11127
- onSearchValueChange: comboboxData.onSearchValueChange,
11128
- searchValue: comboboxData.searchValue,
11129
- disabled: comboboxData.disabled || isAddingPromotions,
11130
- onChange: add,
11131
- value: comboboxValue
11132
- }
11133
- )
11134
- ] }),
11135
- /* @__PURE__ */ jsxRuntime.jsx(ui.Divider, { variant: "dashed" }),
11136
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col gap-2", children: promotions == null ? void 0 : promotions.map((promotion) => /* @__PURE__ */ jsxRuntime.jsx(
11137
- PromotionItem,
11138
- {
11139
- promotion,
11140
- orderId: preview.id,
11141
- isLoading: isPending
11142
- },
11143
- promotion.id
11144
- )) })
11145
- ] }) }),
11146
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
11147
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
11148
- /* @__PURE__ */ jsxRuntime.jsx(
11149
- ui.Button,
11150
- {
11151
- size: "small",
11152
- type: "submit",
11153
- isLoading: isSubmitting || isAddingPromotions,
11154
- children: "Save"
11155
- }
11156
- )
11157
- ] }) })
11158
- ] });
11159
- };
11160
- const PromotionItem = ({
11161
- promotion,
11162
- orderId,
11163
- isLoading
11164
- }) => {
11165
- var _a;
11166
- const { mutateAsync: removePromotions, isPending } = useDraftOrderRemovePromotions(orderId);
11167
- const onRemove = async () => {
11168
- removePromotions(
11169
- {
11170
- promo_codes: [promotion.code]
11171
- },
11172
- {
11173
- onError: (e) => {
11174
- ui.toast.error(e.message);
11175
- }
11176
- }
11177
- );
11178
- };
11179
- const displayValue = getDisplayValue(promotion);
11180
- return /* @__PURE__ */ jsxRuntime.jsxs(
11181
- "div",
11182
- {
11183
- className: ui.clx(
11184
- "bg-ui-bg-component shadow-elevation-card-rest flex items-center justify-between rounded-lg px-3 py-2",
11185
- {
11186
- "animate-pulse": isLoading
11187
- }
11188
- ),
11189
- children: [
11190
- /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
11191
- /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", weight: "plus", leading: "compact", children: promotion.code }),
11192
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-ui-fg-subtle flex items-center gap-1.5", children: [
11193
- displayValue && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1.5", children: [
11194
- /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", leading: "compact", children: displayValue }),
11195
- /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", leading: "compact", children: "·" })
11196
- ] }),
11197
- /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", leading: "compact", className: "capitalize", children: (_a = promotion.application_method) == null ? void 0 : _a.allocation })
11198
- ] })
11199
- ] }),
11200
- /* @__PURE__ */ jsxRuntime.jsx(
11201
- ui.IconButton,
11202
- {
11203
- size: "small",
11204
- type: "button",
11205
- variant: "transparent",
11206
- onClick: onRemove,
11207
- isLoading: isPending || isLoading,
11208
- children: /* @__PURE__ */ jsxRuntime.jsx(icons.XMark, {})
11209
- }
11210
- )
11211
- ]
11212
- },
11213
- promotion.id
11214
- );
11215
- };
11216
- function getDisplayValue(promotion) {
11217
- var _a, _b, _c, _d;
11218
- const value = (_a = promotion.application_method) == null ? void 0 : _a.value;
11219
- if (!value) {
11220
- return null;
11221
- }
11222
- if (((_b = promotion.application_method) == null ? void 0 : _b.type) === "fixed") {
11223
- const currency = (_c = promotion.application_method) == null ? void 0 : _c.currency_code;
11224
- if (!currency) {
11225
- return null;
11226
- }
11227
- return getLocaleAmount(value, currency);
11228
- } else if (((_d = promotion.application_method) == null ? void 0 : _d.type) === "percentage") {
11229
- return formatPercentage(value);
11230
- }
11231
- return null;
11232
- }
11233
- const formatter = new Intl.NumberFormat([], {
11234
- style: "percent",
11235
- minimumFractionDigits: 2
11236
- });
11237
- const formatPercentage = (value, isPercentageValue = false) => {
11238
- let val = value || 0;
11239
- if (!isPercentageValue) {
11240
- val = val / 100;
11241
- }
11242
- return formatter.format(val);
11243
- };
11244
- function getPromotionIds(items, shippingMethods) {
11245
- const promotionIds = /* @__PURE__ */ new Set();
11246
- for (const item of items) {
11247
- if (item.adjustments) {
11248
- for (const adjustment of item.adjustments) {
11249
- if (adjustment.promotion_id) {
11250
- promotionIds.add(adjustment.promotion_id);
11251
- }
11252
- }
11253
- }
11414
+ const metadata = values.metadata;
11415
+ const isEmpty = !metadata.length || metadata.length === 1 && !metadata[0].key && !metadata[0].value;
11416
+ if (isEmpty) {
11417
+ return null;
11254
11418
  }
11255
- for (const shippingMethod of shippingMethods) {
11256
- if (shippingMethod.adjustments) {
11257
- for (const adjustment of shippingMethod.adjustments) {
11258
- if (adjustment.promotion_id) {
11259
- promotionIds.add(adjustment.promotion_id);
11260
- }
11419
+ const update = {};
11420
+ metadata.forEach((field) => {
11421
+ let key = field.key;
11422
+ let value = field.value;
11423
+ const disabled = field.disabled;
11424
+ if (!key || !value) {
11425
+ return;
11426
+ }
11427
+ if (disabled) {
11428
+ update[key] = value;
11429
+ return;
11430
+ }
11431
+ key = key.trim();
11432
+ value = value.trim();
11433
+ if (value === "true") {
11434
+ update[key] = true;
11435
+ } else if (value === "false") {
11436
+ update[key] = false;
11437
+ } else {
11438
+ const parsedNumber = parseFloat(value);
11439
+ if (!isNaN(parsedNumber)) {
11440
+ update[key] = parsedNumber;
11441
+ } else {
11442
+ update[key] = value;
11261
11443
  }
11262
11444
  }
11445
+ });
11446
+ return update;
11447
+ }
11448
+ function getHasUneditableRows(metadata) {
11449
+ if (!metadata) {
11450
+ return false;
11263
11451
  }
11264
- return Array.from(promotionIds);
11452
+ return Object.values(metadata).some(
11453
+ (value) => !EDITABLE_TYPES.includes(typeof value)
11454
+ );
11265
11455
  }
11266
11456
  const SalesChannel = () => {
11267
11457
  const { id } = reactRouterDom.useParams();
@@ -11291,7 +11481,7 @@ const SalesChannelForm = ({ order }) => {
11291
11481
  defaultValues: {
11292
11482
  sales_channel_id: order.sales_channel_id || ""
11293
11483
  },
11294
- resolver: zod.zodResolver(schema$3)
11484
+ resolver: zod.zodResolver(schema$2)
11295
11485
  });
11296
11486
  const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
11297
11487
  const { handleSuccess } = useRouteModal();
@@ -11366,7 +11556,7 @@ const SalesChannelField = ({ control, order }) => {
11366
11556
  }
11367
11557
  );
11368
11558
  };
11369
- const schema$3 = objectType({
11559
+ const schema$2 = objectType({
11370
11560
  sales_channel_id: stringType().min(1)
11371
11561
  });
11372
11562
  const STACKED_FOCUS_MODAL_ID = "shipping-form";
@@ -12208,7 +12398,7 @@ const ShippingAddressForm = ({ order }) => {
12208
12398
  postal_code: ((_i = order.shipping_address) == null ? void 0 : _i.postal_code) ?? "",
12209
12399
  phone: ((_j = order.shipping_address) == null ? void 0 : _j.phone) ?? ""
12210
12400
  },
12211
- resolver: zod.zodResolver(schema$2)
12401
+ resolver: zod.zodResolver(schema$1)
12212
12402
  });
12213
12403
  const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
12214
12404
  const { handleSuccess } = useRouteModal();
@@ -12378,7 +12568,7 @@ const ShippingAddressForm = ({ order }) => {
12378
12568
  }
12379
12569
  ) });
12380
12570
  };
12381
- const schema$2 = addressSchema;
12571
+ const schema$1 = addressSchema;
12382
12572
  const TransferOwnership = () => {
12383
12573
  const { id } = reactRouterDom.useParams();
12384
12574
  const { draft_order, isPending, isError, error } = useDraftOrder(id, {
@@ -12402,7 +12592,7 @@ const TransferOwnershipForm = ({ order }) => {
12402
12592
  defaultValues: {
12403
12593
  customer_id: order.customer_id || ""
12404
12594
  },
12405
- resolver: zod.zodResolver(schema$1)
12595
+ resolver: zod.zodResolver(schema)
12406
12596
  });
12407
12597
  const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
12408
12598
  const { handleSuccess } = useRouteModal();
@@ -12852,199 +13042,9 @@ const Illustration = () => {
12852
13042
  }
12853
13043
  );
12854
13044
  };
12855
- const schema$1 = objectType({
13045
+ const schema = objectType({
12856
13046
  customer_id: stringType().min(1)
12857
13047
  });
12858
- const BillingAddress = () => {
12859
- const { id } = reactRouterDom.useParams();
12860
- const { order, isPending, isError, error } = useOrder(id, {
12861
- fields: "+billing_address"
12862
- });
12863
- if (isError) {
12864
- throw error;
12865
- }
12866
- const isReady = !isPending && !!order;
12867
- return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
12868
- /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
12869
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Billing Address" }) }),
12870
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit the billing address for the draft order" }) })
12871
- ] }),
12872
- isReady && /* @__PURE__ */ jsxRuntime.jsx(BillingAddressForm, { order })
12873
- ] });
12874
- };
12875
- const BillingAddressForm = ({ order }) => {
12876
- var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
12877
- const form = reactHookForm.useForm({
12878
- defaultValues: {
12879
- first_name: ((_a = order.billing_address) == null ? void 0 : _a.first_name) ?? "",
12880
- last_name: ((_b = order.billing_address) == null ? void 0 : _b.last_name) ?? "",
12881
- company: ((_c = order.billing_address) == null ? void 0 : _c.company) ?? "",
12882
- address_1: ((_d = order.billing_address) == null ? void 0 : _d.address_1) ?? "",
12883
- address_2: ((_e = order.billing_address) == null ? void 0 : _e.address_2) ?? "",
12884
- city: ((_f = order.billing_address) == null ? void 0 : _f.city) ?? "",
12885
- province: ((_g = order.billing_address) == null ? void 0 : _g.province) ?? "",
12886
- country_code: ((_h = order.billing_address) == null ? void 0 : _h.country_code) ?? "",
12887
- postal_code: ((_i = order.billing_address) == null ? void 0 : _i.postal_code) ?? "",
12888
- phone: ((_j = order.billing_address) == null ? void 0 : _j.phone) ?? ""
12889
- },
12890
- resolver: zod.zodResolver(schema)
12891
- });
12892
- const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
12893
- const { handleSuccess } = useRouteModal();
12894
- const onSubmit = form.handleSubmit(async (data) => {
12895
- await mutateAsync(
12896
- { billing_address: data },
12897
- {
12898
- onSuccess: () => {
12899
- handleSuccess();
12900
- },
12901
- onError: (error) => {
12902
- ui.toast.error(error.message);
12903
- }
12904
- }
12905
- );
12906
- });
12907
- return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
12908
- KeyboundForm,
12909
- {
12910
- className: "flex flex-1 flex-col overflow-hidden",
12911
- onSubmit,
12912
- children: [
12913
- /* @__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: [
12914
- /* @__PURE__ */ jsxRuntime.jsx(
12915
- Form$2.Field,
12916
- {
12917
- control: form.control,
12918
- name: "country_code",
12919
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12920
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Country" }),
12921
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(CountrySelect, { ...field }) }),
12922
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12923
- ] })
12924
- }
12925
- ),
12926
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
12927
- /* @__PURE__ */ jsxRuntime.jsx(
12928
- Form$2.Field,
12929
- {
12930
- control: form.control,
12931
- name: "first_name",
12932
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12933
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "First name" }),
12934
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12935
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12936
- ] })
12937
- }
12938
- ),
12939
- /* @__PURE__ */ jsxRuntime.jsx(
12940
- Form$2.Field,
12941
- {
12942
- control: form.control,
12943
- name: "last_name",
12944
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12945
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Last name" }),
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
- ] }),
12952
- /* @__PURE__ */ jsxRuntime.jsx(
12953
- Form$2.Field,
12954
- {
12955
- control: form.control,
12956
- name: "company",
12957
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12958
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Company" }),
12959
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12960
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12961
- ] })
12962
- }
12963
- ),
12964
- /* @__PURE__ */ jsxRuntime.jsx(
12965
- Form$2.Field,
12966
- {
12967
- control: form.control,
12968
- name: "address_1",
12969
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12970
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Address" }),
12971
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12972
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12973
- ] })
12974
- }
12975
- ),
12976
- /* @__PURE__ */ jsxRuntime.jsx(
12977
- Form$2.Field,
12978
- {
12979
- control: form.control,
12980
- name: "address_2",
12981
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12982
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Apartment, suite, etc." }),
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.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
12989
- /* @__PURE__ */ jsxRuntime.jsx(
12990
- Form$2.Field,
12991
- {
12992
- control: form.control,
12993
- name: "postal_code",
12994
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12995
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Postal code" }),
12996
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12997
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12998
- ] })
12999
- }
13000
- ),
13001
- /* @__PURE__ */ jsxRuntime.jsx(
13002
- Form$2.Field,
13003
- {
13004
- control: form.control,
13005
- name: "city",
13006
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
13007
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "City" }),
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
- ] }),
13014
- /* @__PURE__ */ jsxRuntime.jsx(
13015
- Form$2.Field,
13016
- {
13017
- control: form.control,
13018
- name: "province",
13019
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
13020
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Province / State" }),
13021
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
13022
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
13023
- ] })
13024
- }
13025
- ),
13026
- /* @__PURE__ */ jsxRuntime.jsx(
13027
- Form$2.Field,
13028
- {
13029
- control: form.control,
13030
- name: "phone",
13031
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
13032
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Phone" }),
13033
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
13034
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
13035
- ] })
13036
- }
13037
- )
13038
- ] }) }),
13039
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
13040
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
13041
- /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
13042
- ] }) })
13043
- ]
13044
- }
13045
- ) });
13046
- };
13047
- const schema = addressSchema;
13048
13048
  const widgetModule = { widgets: [] };
13049
13049
  const routeModule = {
13050
13050
  routes: [
@@ -13065,6 +13065,10 @@ const routeModule = {
13065
13065
  handle,
13066
13066
  loader,
13067
13067
  children: [
13068
+ {
13069
+ Component: BillingAddress,
13070
+ path: "/draft-orders/:id/billing-address"
13071
+ },
13068
13072
  {
13069
13073
  Component: CustomItems,
13070
13074
  path: "/draft-orders/:id/custom-items"
@@ -13077,14 +13081,14 @@ const routeModule = {
13077
13081
  Component: Items,
13078
13082
  path: "/draft-orders/:id/items"
13079
13083
  },
13080
- {
13081
- Component: Metadata,
13082
- path: "/draft-orders/:id/metadata"
13083
- },
13084
13084
  {
13085
13085
  Component: Promotions,
13086
13086
  path: "/draft-orders/:id/promotions"
13087
13087
  },
13088
+ {
13089
+ Component: Metadata,
13090
+ path: "/draft-orders/:id/metadata"
13091
+ },
13088
13092
  {
13089
13093
  Component: SalesChannel,
13090
13094
  path: "/draft-orders/:id/sales-channel"
@@ -13100,10 +13104,6 @@ const routeModule = {
13100
13104
  {
13101
13105
  Component: TransferOwnership,
13102
13106
  path: "/draft-orders/:id/transfer-ownership"
13103
- },
13104
- {
13105
- Component: BillingAddress,
13106
- path: "/draft-orders/:id/billing-address"
13107
13107
  }
13108
13108
  ]
13109
13109
  }