@medusajs/draft-order 2.10.1-snapshot-20250828204656 → 2.10.2-preview-20250829180153

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,196 +9560,6 @@ 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;
9753
9563
  const CustomItems = () => {
9754
9564
  return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
9755
9565
  /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Header, { children: /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Custom Items" }) }) }),
@@ -9758,7 +9568,7 @@ const CustomItems = () => {
9758
9568
  };
9759
9569
  const CustomItemsForm = () => {
9760
9570
  const form = reactHookForm.useForm({
9761
- resolver: zod.zodResolver(schema$4)
9571
+ resolver: zod.zodResolver(schema$5)
9762
9572
  });
9763
9573
  return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(KeyboundForm, { className: "flex flex-1 flex-col", children: [
9764
9574
  /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, {}),
@@ -9768,7 +9578,7 @@ const CustomItemsForm = () => {
9768
9578
  ] }) })
9769
9579
  ] }) });
9770
9580
  };
9771
- const schema$4 = objectType({
9581
+ const schema$5 = objectType({
9772
9582
  email: stringType().email()
9773
9583
  });
9774
9584
  const Email = () => {
@@ -9793,7 +9603,7 @@ const EmailForm = ({ order }) => {
9793
9603
  defaultValues: {
9794
9604
  email: order.email ?? ""
9795
9605
  },
9796
- resolver: zod.zodResolver(schema$3)
9606
+ resolver: zod.zodResolver(schema$4)
9797
9607
  });
9798
9608
  const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
9799
9609
  const { handleSuccess } = useRouteModal();
@@ -9836,7 +9646,7 @@ const EmailForm = ({ order }) => {
9836
9646
  }
9837
9647
  ) });
9838
9648
  };
9839
- const schema$3 = objectType({
9649
+ const schema$4 = objectType({
9840
9650
  email: stringType().email()
9841
9651
  });
9842
9652
  const NumberInput = React.forwardRef(
@@ -10813,738 +10623,632 @@ const customItemSchema = objectType({
10813
10623
  quantity: numberType(),
10814
10624
  unit_price: unionType([numberType(), stringType()])
10815
10625
  });
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
- ]
10827
- };
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("");
10858
- const { handleSuccess } = useRouteModal();
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
10864
- },
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
- }
10885
- });
10886
- const add = async (value) => {
10887
- if (!value) {
10888
- return;
10889
- }
10890
- addPromotions(
10891
- {
10892
- promo_codes: [value]
10893
- },
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",
10894
10631
  {
10895
- onError: (e) => {
10896
- ui.toast.error(e.message);
10897
- comboboxData.onSearchValueChange("");
10898
- setComboboxValue("");
10899
- },
10900
- onSuccess: () => {
10901
- comboboxData.onSearchValueChange("");
10902
- setComboboxValue("");
10903
- }
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
+ ]
10904
10657
  }
10905
10658
  );
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;
10923
- }
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
- }
10934
- });
10935
- };
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
+ });
10936
10675
  if (isError) {
10937
10676
  throw error;
10938
10677
  }
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
- ] }) })
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 })
10985
10685
  ] });
10986
10686
  };
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(
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 }) => {
10690
+ 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)
10696
+ },
10697
+ resolver: zod.zodResolver(MetadataSchema)
10698
+ });
10699
+ const handleSubmit = form.handleSubmit(async (data) => {
10700
+ const parsedData = parseValues(data);
10701
+ await mutateAsync(
10996
10702
  {
10997
- promo_codes: [promotion.code]
10703
+ metadata: parsedData
10998
10704
  },
10999
10705
  {
11000
- onError: (e) => {
11001
- ui.toast.error(e.message);
10706
+ onSuccess: () => {
10707
+ ui.toast.success("Metadata updated");
10708
+ handleSuccess();
10709
+ },
10710
+ onError: (error) => {
10711
+ ui.toast.error(error.message);
11002
10712
  }
11003
10713
  }
11004
10714
  );
11005
- };
11006
- const displayValue = getDisplayValue(promotion);
11007
- return /* @__PURE__ */ jsxRuntime.jsxs(
11008
- "div",
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
+ });
10728
+ }
10729
+ }
10730
+ function insertRow(index, position) {
10731
+ insert(index + (position === "above" ? 0 : 1), {
10732
+ key: "",
10733
+ value: "",
10734
+ disabled: false
10735
+ });
10736
+ }
10737
+ return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
10738
+ KeyboundForm,
11009
10739
  {
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
- ),
10740
+ onSubmit: handleSubmit,
10741
+ className: "flex flex-1 flex-col overflow-hidden",
11016
10742
  children: [
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: "·" })
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" }) })
11023
10748
  ] }),
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;
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", {
10768
+ "overflow-hidden rounded-b-lg": index === fields.length - 1
10769
+ }),
10770
+ children: [
10771
+ /* @__PURE__ */ jsxRuntime.jsx(
10772
+ Form$2.Field,
10773
+ {
10774
+ control: form.control,
10775
+ name: `metadata.${index}.key`,
10776
+ render: ({ field: field2 }) => {
10777
+ return /* @__PURE__ */ jsxRuntime.jsx(Form$2.Item, { children: /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
10778
+ GridInput,
10779
+ {
10780
+ "aria-labelledby": METADATA_KEY_LABEL_ID,
10781
+ ...field2,
10782
+ disabled: isDisabled,
10783
+ placeholder: "Key"
10784
+ }
10785
+ ) }) });
10786
+ }
10787
+ }
10788
+ ),
10789
+ /* @__PURE__ */ jsxRuntime.jsx(
10790
+ Form$2.Field,
10791
+ {
10792
+ control: form.control,
10793
+ name: `metadata.${index}.value`,
10794
+ render: ({ field: { value, ...field2 } }) => {
10795
+ return /* @__PURE__ */ jsxRuntime.jsx(Form$2.Item, { children: /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
10796
+ GridInput,
10797
+ {
10798
+ "aria-labelledby": METADATA_VALUE_LABEL_ID,
10799
+ ...field2,
10800
+ value: isDisabled ? placeholder : value,
10801
+ disabled: isDisabled,
10802
+ placeholder: "Value"
10803
+ }
10804
+ ) }) });
10805
+ }
10806
+ }
10807
+ )
10808
+ ]
10809
+ }
10810
+ ),
10811
+ /* @__PURE__ */ jsxRuntime.jsxs(ui.DropdownMenu, { children: [
10812
+ /* @__PURE__ */ jsxRuntime.jsx(
10813
+ ui.DropdownMenu.Trigger,
10814
+ {
10815
+ className: ui.clx(
10816
+ "invisible absolute inset-y-0 -right-2.5 my-auto group-hover/table:visible data-[state='open']:visible",
10817
+ {
10818
+ hidden: isDisabled
10819
+ }
10820
+ ),
10821
+ disabled: isDisabled,
10822
+ asChild: true,
10823
+ children: /* @__PURE__ */ jsxRuntime.jsx(ui.IconButton, { size: "2xsmall", children: /* @__PURE__ */ jsxRuntime.jsx(icons.EllipsisVertical, {}) })
10824
+ }
10825
+ ),
10826
+ /* @__PURE__ */ jsxRuntime.jsxs(ui.DropdownMenu.Content, { children: [
10827
+ /* @__PURE__ */ jsxRuntime.jsxs(
10828
+ ui.DropdownMenu.Item,
10829
+ {
10830
+ className: "gap-x-2",
10831
+ onClick: () => insertRow(index, "above"),
10832
+ children: [
10833
+ /* @__PURE__ */ jsxRuntime.jsx(icons.ArrowUpMini, { className: "text-ui-fg-subtle" }),
10834
+ "Insert row above"
10835
+ ]
10836
+ }
10837
+ ),
10838
+ /* @__PURE__ */ jsxRuntime.jsxs(
10839
+ ui.DropdownMenu.Item,
10840
+ {
10841
+ className: "gap-x-2",
10842
+ onClick: () => insertRow(index, "below"),
10843
+ children: [
10844
+ /* @__PURE__ */ jsxRuntime.jsx(icons.ArrowDownMini, { className: "text-ui-fg-subtle" }),
10845
+ "Insert row below"
10846
+ ]
10847
+ }
10848
+ ),
10849
+ /* @__PURE__ */ jsxRuntime.jsx(ui.DropdownMenu.Separator, {}),
10850
+ /* @__PURE__ */ jsxRuntime.jsxs(
10851
+ ui.DropdownMenu.Item,
10852
+ {
10853
+ className: "gap-x-2",
10854
+ onClick: () => deleteRow(index),
10855
+ children: [
10856
+ /* @__PURE__ */ jsxRuntime.jsx(icons.Trash, { className: "text-ui-fg-subtle" }),
10857
+ "Delete row"
10858
+ ]
10859
+ }
10860
+ )
10861
+ ] })
10862
+ ] })
10863
+ ] })
10864
+ },
10865
+ field.id
10866
+ );
10867
+ })
10868
+ ] }),
10869
+ hasUneditableRows && /* @__PURE__ */ jsxRuntime.jsx(InlineTip, { variant: "warning", label: "Some rows are disabled", children: "This object contains non-primitive metadata, such as arrays or objects, that can't be edited here. To edit the disabled rows, use the API directly." })
10870
+ ] }),
10871
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
10872
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", type: "button", children: "Cancel" }) }),
10873
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
10874
+ ] }) })
10875
+ ]
11053
10876
  }
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
10877
+ ) });
10878
+ };
10879
+ const GridInput = React.forwardRef(({ className, ...props }, ref) => {
10880
+ return /* @__PURE__ */ jsxRuntime.jsx(
10881
+ "input",
10882
+ {
10883
+ ref,
10884
+ ...props,
10885
+ autoComplete: "off",
10886
+ className: ui.clx(
10887
+ "txt-compact-small text-ui-fg-base placeholder:text-ui-fg-muted disabled:text-ui-fg-disabled disabled:bg-ui-bg-base bg-transparent px-2 py-1.5 outline-none",
10888
+ className
10889
+ )
10890
+ }
10891
+ );
11063
10892
  });
11064
- const formatPercentage = (value, isPercentageValue = false) => {
11065
- let val = value || 0;
11066
- if (!isPercentageValue) {
11067
- val = val / 100;
11068
- }
11069
- return formatter.format(val);
10893
+ GridInput.displayName = "MetadataForm.GridInput";
10894
+ const PlaceholderInner = () => {
10895
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-1 flex-col overflow-hidden", children: [
10896
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Skeleton, { className: "h-[148ox] w-full rounded-lg" }) }),
10897
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
10898
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Skeleton, { className: "h-7 w-12 rounded-md" }),
10899
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Skeleton, { className: "h-7 w-12 rounded-md" })
10900
+ ] }) })
10901
+ ] });
11070
10902
  };
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
- }
10903
+ const EDITABLE_TYPES = ["string", "number", "boolean"];
10904
+ function getDefaultValues(metadata) {
10905
+ if (!metadata || !Object.keys(metadata).length) {
10906
+ return [
10907
+ {
10908
+ key: "",
10909
+ value: "",
10910
+ disabled: false
11079
10911
  }
10912
+ ];
10913
+ }
10914
+ return Object.entries(metadata).map(([key, value]) => {
10915
+ if (!EDITABLE_TYPES.includes(typeof value)) {
10916
+ return {
10917
+ key,
10918
+ value,
10919
+ disabled: true
10920
+ };
10921
+ }
10922
+ let stringValue = value;
10923
+ if (typeof value !== "string") {
10924
+ stringValue = JSON.stringify(value);
11080
10925
  }
10926
+ return {
10927
+ key,
10928
+ value: stringValue,
10929
+ original_key: key
10930
+ };
10931
+ });
10932
+ }
10933
+ 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;
11081
10938
  }
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
- }
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;
11088
10963
  }
11089
10964
  }
10965
+ });
10966
+ return update;
10967
+ }
10968
+ function getHasUneditableRows(metadata) {
10969
+ if (!metadata) {
10970
+ return false;
11090
10971
  }
11091
- return Array.from(codes);
10972
+ return Object.values(metadata).some(
10973
+ (value) => !EDITABLE_TYPES.includes(typeof value)
10974
+ );
11092
10975
  }
11093
- const SalesChannel = () => {
11094
- const { id } = reactRouterDom.useParams();
11095
- const { draft_order, isPending, isError, error } = useDraftOrder(
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,
11096
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(
11097
11022
  {
11098
- fields: "+sales_channel_id"
11023
+ code: promoCodes
11099
11024
  },
11100
11025
  {
11101
- enabled: !!id
11026
+ enabled: !!promoCodes.length
11102
11027
  }
11103
11028
  );
11104
- if (isError) {
11105
- throw error;
11106
- }
11107
- const ISrEADY = !!draft_order && !isPending;
11108
- return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
11109
- /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
11110
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Sales Channel" }) }),
11111
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Update which sales channel the draft order is associated with" }) })
11112
- ] }),
11113
- ISrEADY && /* @__PURE__ */ jsxRuntime.jsx(SalesChannelForm, { order: draft_order })
11114
- ] });
11115
- };
11116
- const SalesChannelForm = ({ order }) => {
11117
- const form = reactHookForm.useForm({
11118
- defaultValues: {
11119
- sales_channel_id: order.sales_channel_id || ""
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
+ });
11120
11038
  },
11121
- resolver: zod.zodResolver(schema$2)
11039
+ getOptions: (data) => {
11040
+ return data.promotions.map((promotion) => ({
11041
+ label: promotion.code,
11042
+ value: promotion.code
11043
+ }));
11044
+ }
11122
11045
  });
11123
- const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
11124
- const { handleSuccess } = useRouteModal();
11125
- const onSubmit = form.handleSubmit(async (data) => {
11126
- await mutateAsync(
11046
+ const add = async (value) => {
11047
+ if (!value) {
11048
+ return;
11049
+ }
11050
+ addPromotions(
11127
11051
  {
11128
- sales_channel_id: data.sales_channel_id
11052
+ promo_codes: [value]
11129
11053
  },
11130
11054
  {
11131
- onSuccess: () => {
11132
- ui.toast.success("Sales channel updated");
11133
- handleSuccess();
11055
+ onError: (e) => {
11056
+ ui.toast.error(e.message);
11057
+ comboboxData.onSearchValueChange("");
11058
+ setComboboxValue("");
11134
11059
  },
11135
- onError: (error) => {
11136
- ui.toast.error(error.message);
11060
+ onSuccess: () => {
11061
+ comboboxData.onSearchValueChange("");
11062
+ setComboboxValue("");
11137
11063
  }
11138
11064
  }
11139
11065
  );
11140
- });
11141
- return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
11142
- KeyboundForm,
11143
- {
11144
- className: "flex flex-1 flex-col overflow-hidden",
11145
- onSubmit,
11146
- children: [
11147
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsx(SalesChannelField, { control: form.control, order }) }),
11148
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
11149
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
11150
- /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
11151
- ] }) })
11152
- ]
11153
- }
11154
- ) });
11155
- };
11156
- const SalesChannelField = ({ control, order }) => {
11157
- const salesChannels = useComboboxData({
11158
- queryFn: async (params) => {
11159
- return await sdk.admin.salesChannel.list(params);
11160
- },
11161
- queryKey: ["sales-channels"],
11162
- getOptions: (data) => {
11163
- return data.sales_channels.map((salesChannel) => ({
11164
- label: salesChannel.name,
11165
- value: salesChannel.id
11166
- }));
11167
- },
11168
- defaultValue: order.sales_channel_id || void 0
11169
- });
11170
- return /* @__PURE__ */ jsxRuntime.jsx(
11171
- Form$2.Field,
11172
- {
11173
- control,
11174
- name: "sales_channel_id",
11175
- render: ({ field }) => {
11176
- return /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11177
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Sales Channel" }),
11178
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
11179
- Combobox,
11180
- {
11181
- options: salesChannels.options,
11182
- fetchNextPage: salesChannels.fetchNextPage,
11183
- isFetchingNextPage: salesChannels.isFetchingNextPage,
11184
- searchValue: salesChannels.searchValue,
11185
- onSearchValueChange: salesChannels.onSearchValueChange,
11186
- placeholder: "Select sales channel",
11187
- ...field
11188
- }
11189
- ) }),
11190
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11191
- ] });
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;
11192
11078
  }
11079
+ });
11080
+ if (!requestSucceeded) {
11081
+ setIsSubmitting(false);
11082
+ return;
11193
11083
  }
11194
- );
11195
- };
11196
- const schema$2 = objectType({
11197
- sales_channel_id: stringType().min(1)
11198
- });
11199
- const InlineTip = React.forwardRef(
11200
- ({ variant = "tip", label, className, children, ...props }, ref) => {
11201
- const labelValue = label || (variant === "warning" ? "Warning" : "Tip");
11202
- return /* @__PURE__ */ jsxRuntime.jsxs(
11203
- "div",
11204
- {
11205
- ref,
11206
- className: ui.clx(
11207
- "bg-ui-bg-component txt-small text-ui-fg-subtle grid grid-cols-[4px_1fr] items-start gap-3 rounded-lg border p-3",
11208
- className
11209
- ),
11210
- ...props,
11211
- children: [
11212
- /* @__PURE__ */ jsxRuntime.jsx(
11213
- "div",
11214
- {
11215
- role: "presentation",
11216
- className: ui.clx("w-4px bg-ui-tag-neutral-icon h-full rounded-full", {
11217
- "bg-ui-tag-orange-icon": variant === "warning"
11218
- })
11219
- }
11220
- ),
11221
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-pretty", children: [
11222
- /* @__PURE__ */ jsxRuntime.jsxs("strong", { className: "txt-small-plus text-ui-fg-base", children: [
11223
- labelValue,
11224
- ":"
11225
- ] }),
11226
- " ",
11227
- children
11228
- ] })
11229
- ]
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);
11230
11093
  }
11231
- );
11232
- }
11233
- );
11234
- InlineTip.displayName = "InlineTip";
11235
- const MetadataFieldSchema = objectType({
11236
- key: stringType(),
11237
- disabled: booleanType().optional(),
11238
- value: anyType()
11239
- });
11240
- const MetadataSchema = objectType({
11241
- metadata: arrayType(MetadataFieldSchema)
11242
- });
11243
- const Metadata = () => {
11244
- const { id } = reactRouterDom.useParams();
11245
- const { order, isPending, isError, error } = useOrder(id, {
11246
- fields: "metadata"
11247
- });
11094
+ });
11095
+ };
11248
11096
  if (isError) {
11249
11097
  throw error;
11250
11098
  }
11251
- const isReady = !isPending && !!order;
11252
- return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
11253
- /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
11254
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Metadata" }) }),
11255
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Add metadata to the draft order." }) })
11256
- ] }),
11257
- !isReady ? /* @__PURE__ */ jsxRuntime.jsx(PlaceholderInner, {}) : /* @__PURE__ */ jsxRuntime.jsx(MetadataForm, { orderId: id, metadata: order == null ? void 0 : order.metadata })
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
+ ] }) })
11258
11145
  ] });
11259
11146
  };
11260
- const METADATA_KEY_LABEL_ID = "metadata-form-key-label";
11261
- const METADATA_VALUE_LABEL_ID = "metadata-form-value-label";
11262
- const MetadataForm = ({ orderId, metadata }) => {
11263
- const { handleSuccess } = useRouteModal();
11264
- const hasUneditableRows = getHasUneditableRows(metadata);
11265
- const { mutateAsync, isPending } = useUpdateDraftOrder(orderId);
11266
- const form = reactHookForm.useForm({
11267
- defaultValues: {
11268
- metadata: getDefaultValues(metadata)
11269
- },
11270
- resolver: zod.zodResolver(MetadataSchema)
11271
- });
11272
- const handleSubmit = form.handleSubmit(async (data) => {
11273
- const parsedData = parseValues(data);
11274
- await mutateAsync(
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(
11275
11156
  {
11276
- metadata: parsedData
11157
+ promo_codes: [promotion.code]
11277
11158
  },
11278
11159
  {
11279
- onSuccess: () => {
11280
- ui.toast.success("Metadata updated");
11281
- handleSuccess();
11282
- },
11283
- onError: (error) => {
11284
- ui.toast.error(error.message);
11160
+ onError: (e) => {
11161
+ ui.toast.error(e.message);
11285
11162
  }
11286
11163
  }
11287
11164
  );
11288
- });
11289
- const { fields, insert, remove } = reactHookForm.useFieldArray({
11290
- control: form.control,
11291
- name: "metadata"
11292
- });
11293
- function deleteRow(index) {
11294
- remove(index);
11295
- if (fields.length === 1) {
11296
- insert(0, {
11297
- key: "",
11298
- value: "",
11299
- disabled: false
11300
- });
11301
- }
11302
- }
11303
- function insertRow(index, position) {
11304
- insert(index + (position === "above" ? 0 : 1), {
11305
- key: "",
11306
- value: "",
11307
- disabled: false
11308
- });
11309
- }
11310
- return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
11311
- KeyboundForm,
11165
+ };
11166
+ const displayValue = getDisplayValue(promotion);
11167
+ return /* @__PURE__ */ jsxRuntime.jsxs(
11168
+ "div",
11312
11169
  {
11313
- onSubmit: handleSubmit,
11314
- className: "flex flex-1 flex-col overflow-hidden",
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
+ ),
11315
11176
  children: [
11316
- /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Body, { className: "flex flex-1 flex-col gap-y-8 overflow-y-auto", children: [
11317
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-ui-bg-base shadow-elevation-card-rest grid grid-cols-1 divide-y rounded-lg", children: [
11318
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-ui-bg-subtle grid grid-cols-2 divide-x rounded-t-lg", children: [
11319
- /* @__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" }) }),
11320
- /* @__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" }) })
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: "·" })
11321
11183
  ] }),
11322
- fields.map((field, index) => {
11323
- const isDisabled = field.disabled || false;
11324
- let placeholder = "-";
11325
- if (typeof field.value === "object") {
11326
- placeholder = "{ ... }";
11327
- }
11328
- if (Array.isArray(field.value)) {
11329
- placeholder = "[ ... ]";
11330
- }
11331
- return /* @__PURE__ */ jsxRuntime.jsx(
11332
- ConditionalTooltip,
11333
- {
11334
- showTooltip: isDisabled,
11335
- content: "This row is disabled because it contains non-primitive data.",
11336
- children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "group/table relative", children: [
11337
- /* @__PURE__ */ jsxRuntime.jsxs(
11338
- "div",
11339
- {
11340
- className: ui.clx("grid grid-cols-2 divide-x", {
11341
- "overflow-hidden rounded-b-lg": index === fields.length - 1
11342
- }),
11343
- children: [
11344
- /* @__PURE__ */ jsxRuntime.jsx(
11345
- Form$2.Field,
11346
- {
11347
- control: form.control,
11348
- name: `metadata.${index}.key`,
11349
- render: ({ field: field2 }) => {
11350
- return /* @__PURE__ */ jsxRuntime.jsx(Form$2.Item, { children: /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
11351
- GridInput,
11352
- {
11353
- "aria-labelledby": METADATA_KEY_LABEL_ID,
11354
- ...field2,
11355
- disabled: isDisabled,
11356
- placeholder: "Key"
11357
- }
11358
- ) }) });
11359
- }
11360
- }
11361
- ),
11362
- /* @__PURE__ */ jsxRuntime.jsx(
11363
- Form$2.Field,
11364
- {
11365
- control: form.control,
11366
- name: `metadata.${index}.value`,
11367
- render: ({ field: { value, ...field2 } }) => {
11368
- return /* @__PURE__ */ jsxRuntime.jsx(Form$2.Item, { children: /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
11369
- GridInput,
11370
- {
11371
- "aria-labelledby": METADATA_VALUE_LABEL_ID,
11372
- ...field2,
11373
- value: isDisabled ? placeholder : value,
11374
- disabled: isDisabled,
11375
- placeholder: "Value"
11376
- }
11377
- ) }) });
11378
- }
11379
- }
11380
- )
11381
- ]
11382
- }
11383
- ),
11384
- /* @__PURE__ */ jsxRuntime.jsxs(ui.DropdownMenu, { children: [
11385
- /* @__PURE__ */ jsxRuntime.jsx(
11386
- ui.DropdownMenu.Trigger,
11387
- {
11388
- className: ui.clx(
11389
- "invisible absolute inset-y-0 -right-2.5 my-auto group-hover/table:visible data-[state='open']:visible",
11390
- {
11391
- hidden: isDisabled
11392
- }
11393
- ),
11394
- disabled: isDisabled,
11395
- asChild: true,
11396
- children: /* @__PURE__ */ jsxRuntime.jsx(ui.IconButton, { size: "2xsmall", children: /* @__PURE__ */ jsxRuntime.jsx(icons.EllipsisVertical, {}) })
11397
- }
11398
- ),
11399
- /* @__PURE__ */ jsxRuntime.jsxs(ui.DropdownMenu.Content, { children: [
11400
- /* @__PURE__ */ jsxRuntime.jsxs(
11401
- ui.DropdownMenu.Item,
11402
- {
11403
- className: "gap-x-2",
11404
- onClick: () => insertRow(index, "above"),
11405
- children: [
11406
- /* @__PURE__ */ jsxRuntime.jsx(icons.ArrowUpMini, { className: "text-ui-fg-subtle" }),
11407
- "Insert row above"
11408
- ]
11409
- }
11410
- ),
11411
- /* @__PURE__ */ jsxRuntime.jsxs(
11412
- ui.DropdownMenu.Item,
11413
- {
11414
- className: "gap-x-2",
11415
- onClick: () => insertRow(index, "below"),
11416
- children: [
11417
- /* @__PURE__ */ jsxRuntime.jsx(icons.ArrowDownMini, { className: "text-ui-fg-subtle" }),
11418
- "Insert row below"
11419
- ]
11420
- }
11421
- ),
11422
- /* @__PURE__ */ jsxRuntime.jsx(ui.DropdownMenu.Separator, {}),
11423
- /* @__PURE__ */ jsxRuntime.jsxs(
11424
- ui.DropdownMenu.Item,
11425
- {
11426
- className: "gap-x-2",
11427
- onClick: () => deleteRow(index),
11428
- children: [
11429
- /* @__PURE__ */ jsxRuntime.jsx(icons.Trash, { className: "text-ui-fg-subtle" }),
11430
- "Delete row"
11431
- ]
11432
- }
11433
- )
11434
- ] })
11435
- ] })
11436
- ] })
11437
- },
11438
- field.id
11439
- );
11440
- })
11441
- ] }),
11442
- hasUneditableRows && /* @__PURE__ */ jsxRuntime.jsx(InlineTip, { variant: "warning", label: "Some rows are disabled", children: "This object contains non-primitive metadata, such as arrays or objects, that can't be edited here. To edit the disabled rows, use the API directly." })
11184
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", leading: "compact", className: "capitalize", children: (_a = promotion.application_method) == null ? void 0 : _a.allocation })
11185
+ ] })
11443
11186
  ] }),
11444
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
11445
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", type: "button", children: "Cancel" }) }),
11446
- /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
11447
- ] }) })
11448
- ]
11449
- }
11450
- ) });
11451
- };
11452
- const GridInput = React.forwardRef(({ className, ...props }, ref) => {
11453
- return /* @__PURE__ */ jsxRuntime.jsx(
11454
- "input",
11455
- {
11456
- ref,
11457
- ...props,
11458
- autoComplete: "off",
11459
- className: ui.clx(
11460
- "txt-compact-small text-ui-fg-base placeholder:text-ui-fg-muted disabled:text-ui-fg-disabled disabled:bg-ui-bg-base bg-transparent px-2 py-1.5 outline-none",
11461
- className
11462
- )
11463
- }
11464
- );
11465
- });
11466
- GridInput.displayName = "MetadataForm.GridInput";
11467
- const PlaceholderInner = () => {
11468
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-1 flex-col overflow-hidden", children: [
11469
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Skeleton, { className: "h-[148ox] w-full rounded-lg" }) }),
11470
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
11471
- /* @__PURE__ */ jsxRuntime.jsx(ui.Skeleton, { className: "h-7 w-12 rounded-md" }),
11472
- /* @__PURE__ */ jsxRuntime.jsx(ui.Skeleton, { className: "h-7 w-12 rounded-md" })
11473
- ] }) })
11474
- ] });
11475
- };
11476
- const EDITABLE_TYPES = ["string", "number", "boolean"];
11477
- function getDefaultValues(metadata) {
11478
- if (!metadata || !Object.keys(metadata).length) {
11479
- return [
11480
- {
11481
- key: "",
11482
- value: "",
11483
- disabled: false
11484
- }
11485
- ];
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;
11486
11208
  }
11487
- return Object.entries(metadata).map(([key, value]) => {
11488
- if (!EDITABLE_TYPES.includes(typeof value)) {
11489
- return {
11490
- key,
11491
- value,
11492
- disabled: true
11493
- };
11494
- }
11495
- let stringValue = value;
11496
- if (typeof value !== "string") {
11497
- stringValue = JSON.stringify(value);
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;
11498
11213
  }
11499
- return {
11500
- key,
11501
- value: stringValue,
11502
- original_key: key
11503
- };
11504
- });
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;
11505
11219
  }
11506
- function parseValues(values) {
11507
- const metadata = values.metadata;
11508
- const isEmpty = !metadata.length || metadata.length === 1 && !metadata[0].key && !metadata[0].value;
11509
- if (isEmpty) {
11510
- return null;
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;
11511
11228
  }
11512
- const update = {};
11513
- metadata.forEach((field) => {
11514
- let key = field.key;
11515
- let value = field.value;
11516
- const disabled = field.disabled;
11517
- if (!key || !value) {
11518
- return;
11519
- }
11520
- if (disabled) {
11521
- update[key] = value;
11522
- return;
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
+ }
11523
11240
  }
11524
- key = key.trim();
11525
- value = value.trim();
11526
- if (value === "true") {
11527
- update[key] = true;
11528
- } else if (value === "false") {
11529
- update[key] = false;
11530
- } else {
11531
- const parsedNumber = parseFloat(value);
11532
- if (!isNaN(parsedNumber)) {
11533
- update[key] = parsedNumber;
11534
- } else {
11535
- update[key] = value;
11241
+ }
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
+ }
11536
11248
  }
11537
11249
  }
11538
- });
11539
- return update;
11540
- }
11541
- function getHasUneditableRows(metadata) {
11542
- if (!metadata) {
11543
- return false;
11544
11250
  }
11545
- return Object.values(metadata).some(
11546
- (value) => !EDITABLE_TYPES.includes(typeof value)
11547
- );
11251
+ return Array.from(codes);
11548
11252
  }
11549
11253
  const STACKED_FOCUS_MODAL_ID = "shipping-form";
11550
11254
  const Shipping = () => {
@@ -12385,7 +12089,7 @@ const ShippingAddressForm = ({ order }) => {
12385
12089
  postal_code: ((_i = order.shipping_address) == null ? void 0 : _i.postal_code) ?? "",
12386
12090
  phone: ((_j = order.shipping_address) == null ? void 0 : _j.phone) ?? ""
12387
12091
  },
12388
- resolver: zod.zodResolver(schema$1)
12092
+ resolver: zod.zodResolver(schema$3)
12389
12093
  });
12390
12094
  const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
12391
12095
  const { handleSuccess } = useRouteModal();
@@ -12555,7 +12259,7 @@ const ShippingAddressForm = ({ order }) => {
12555
12259
  }
12556
12260
  ) });
12557
12261
  };
12558
- const schema$1 = addressSchema;
12262
+ const schema$3 = addressSchema;
12559
12263
  const TransferOwnership = () => {
12560
12264
  const { id } = reactRouterDom.useParams();
12561
12265
  const { draft_order, isPending, isError, error } = useDraftOrder(id, {
@@ -12579,7 +12283,7 @@ const TransferOwnershipForm = ({ order }) => {
12579
12283
  defaultValues: {
12580
12284
  customer_id: order.customer_id || ""
12581
12285
  },
12582
- resolver: zod.zodResolver(schema)
12286
+ resolver: zod.zodResolver(schema$2)
12583
12287
  });
12584
12288
  const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
12585
12289
  const { handleSuccess } = useRouteModal();
@@ -12973,64 +12677,360 @@ const Illustration = () => {
12973
12677
  /* @__PURE__ */ jsxRuntime.jsx("clipPath", { id: "clip0_20915_38670", children: /* @__PURE__ */ jsxRuntime.jsx(
12974
12678
  "rect",
12975
12679
  {
12976
- width: "12",
12977
- height: "12",
12978
- fill: "white",
12979
- transform: "matrix(0.865865 0.500278 -0.871576 0.490261 138.36 74.6508)"
12680
+ width: "12",
12681
+ height: "12",
12682
+ fill: "white",
12683
+ transform: "matrix(0.865865 0.500278 -0.871576 0.490261 138.36 74.6508)"
12684
+ }
12685
+ ) }),
12686
+ /* @__PURE__ */ jsxRuntime.jsx("clipPath", { id: "clip1_20915_38670", children: /* @__PURE__ */ jsxRuntime.jsx(
12687
+ "rect",
12688
+ {
12689
+ width: "12",
12690
+ height: "12",
12691
+ fill: "white",
12692
+ transform: "matrix(0.865865 0.500278 -0.871576 0.490261 148.75 80.6541)"
12693
+ }
12694
+ ) }),
12695
+ /* @__PURE__ */ jsxRuntime.jsx("clipPath", { id: "clip2_20915_38670", children: /* @__PURE__ */ jsxRuntime.jsx(
12696
+ "rect",
12697
+ {
12698
+ width: "12",
12699
+ height: "12",
12700
+ fill: "white",
12701
+ transform: "matrix(0.865865 0.500278 -0.871576 0.490261 159.141 86.6575)"
12702
+ }
12703
+ ) }),
12704
+ /* @__PURE__ */ jsxRuntime.jsx("clipPath", { id: "clip3_20915_38670", children: /* @__PURE__ */ jsxRuntime.jsx(
12705
+ "rect",
12706
+ {
12707
+ width: "12",
12708
+ height: "12",
12709
+ fill: "white",
12710
+ transform: "matrix(0.865865 0.500278 -0.871576 0.490261 120.928 84.4561)"
12711
+ }
12712
+ ) }),
12713
+ /* @__PURE__ */ jsxRuntime.jsx("clipPath", { id: "clip4_20915_38670", children: /* @__PURE__ */ jsxRuntime.jsx(
12714
+ "rect",
12715
+ {
12716
+ width: "12",
12717
+ height: "12",
12718
+ fill: "white",
12719
+ transform: "matrix(0.865865 0.500278 -0.871576 0.490261 131.318 90.4594)"
12720
+ }
12721
+ ) }),
12722
+ /* @__PURE__ */ jsxRuntime.jsx("clipPath", { id: "clip5_20915_38670", children: /* @__PURE__ */ jsxRuntime.jsx(
12723
+ "rect",
12724
+ {
12725
+ width: "12",
12726
+ height: "12",
12727
+ fill: "white",
12728
+ transform: "matrix(0.865865 0.500278 -0.871576 0.490261 141.709 96.4627)"
12729
+ }
12730
+ ) })
12731
+ ] })
12732
+ ]
12733
+ }
12734
+ );
12735
+ };
12736
+ const schema$2 = objectType({
12737
+ customer_id: stringType().min(1)
12738
+ });
12739
+ const BillingAddress = () => {
12740
+ const { id } = reactRouterDom.useParams();
12741
+ const { order, isPending, isError, error } = useOrder(id, {
12742
+ fields: "+billing_address"
12743
+ });
12744
+ if (isError) {
12745
+ throw error;
12746
+ }
12747
+ const isReady = !isPending && !!order;
12748
+ return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
12749
+ /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
12750
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Billing Address" }) }),
12751
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit the billing address for the draft order" }) })
12752
+ ] }),
12753
+ isReady && /* @__PURE__ */ jsxRuntime.jsx(BillingAddressForm, { order })
12754
+ ] });
12755
+ };
12756
+ const BillingAddressForm = ({ order }) => {
12757
+ var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
12758
+ const form = reactHookForm.useForm({
12759
+ defaultValues: {
12760
+ first_name: ((_a = order.billing_address) == null ? void 0 : _a.first_name) ?? "",
12761
+ last_name: ((_b = order.billing_address) == null ? void 0 : _b.last_name) ?? "",
12762
+ company: ((_c = order.billing_address) == null ? void 0 : _c.company) ?? "",
12763
+ address_1: ((_d = order.billing_address) == null ? void 0 : _d.address_1) ?? "",
12764
+ address_2: ((_e = order.billing_address) == null ? void 0 : _e.address_2) ?? "",
12765
+ city: ((_f = order.billing_address) == null ? void 0 : _f.city) ?? "",
12766
+ province: ((_g = order.billing_address) == null ? void 0 : _g.province) ?? "",
12767
+ country_code: ((_h = order.billing_address) == null ? void 0 : _h.country_code) ?? "",
12768
+ postal_code: ((_i = order.billing_address) == null ? void 0 : _i.postal_code) ?? "",
12769
+ phone: ((_j = order.billing_address) == null ? void 0 : _j.phone) ?? ""
12770
+ },
12771
+ resolver: zod.zodResolver(schema$1)
12772
+ });
12773
+ const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
12774
+ const { handleSuccess } = useRouteModal();
12775
+ const onSubmit = form.handleSubmit(async (data) => {
12776
+ await mutateAsync(
12777
+ { billing_address: data },
12778
+ {
12779
+ onSuccess: () => {
12780
+ handleSuccess();
12781
+ },
12782
+ onError: (error) => {
12783
+ ui.toast.error(error.message);
12784
+ }
12785
+ }
12786
+ );
12787
+ });
12788
+ return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
12789
+ KeyboundForm,
12790
+ {
12791
+ className: "flex flex-1 flex-col overflow-hidden",
12792
+ onSubmit,
12793
+ children: [
12794
+ /* @__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: [
12795
+ /* @__PURE__ */ jsxRuntime.jsx(
12796
+ Form$2.Field,
12797
+ {
12798
+ control: form.control,
12799
+ name: "country_code",
12800
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12801
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Country" }),
12802
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(CountrySelect, { ...field }) }),
12803
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12804
+ ] })
12805
+ }
12806
+ ),
12807
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
12808
+ /* @__PURE__ */ jsxRuntime.jsx(
12809
+ Form$2.Field,
12810
+ {
12811
+ control: form.control,
12812
+ name: "first_name",
12813
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12814
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "First name" }),
12815
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12816
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12817
+ ] })
12818
+ }
12819
+ ),
12820
+ /* @__PURE__ */ jsxRuntime.jsx(
12821
+ Form$2.Field,
12822
+ {
12823
+ control: form.control,
12824
+ name: "last_name",
12825
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12826
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Last name" }),
12827
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12828
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12829
+ ] })
12830
+ }
12831
+ )
12832
+ ] }),
12833
+ /* @__PURE__ */ jsxRuntime.jsx(
12834
+ Form$2.Field,
12835
+ {
12836
+ control: form.control,
12837
+ name: "company",
12838
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12839
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Company" }),
12840
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12841
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12842
+ ] })
12980
12843
  }
12981
- ) }),
12982
- /* @__PURE__ */ jsxRuntime.jsx("clipPath", { id: "clip1_20915_38670", children: /* @__PURE__ */ jsxRuntime.jsx(
12983
- "rect",
12844
+ ),
12845
+ /* @__PURE__ */ jsxRuntime.jsx(
12846
+ Form$2.Field,
12984
12847
  {
12985
- width: "12",
12986
- height: "12",
12987
- fill: "white",
12988
- transform: "matrix(0.865865 0.500278 -0.871576 0.490261 148.75 80.6541)"
12848
+ control: form.control,
12849
+ name: "address_1",
12850
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12851
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Address" }),
12852
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12853
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12854
+ ] })
12989
12855
  }
12990
- ) }),
12991
- /* @__PURE__ */ jsxRuntime.jsx("clipPath", { id: "clip2_20915_38670", children: /* @__PURE__ */ jsxRuntime.jsx(
12992
- "rect",
12856
+ ),
12857
+ /* @__PURE__ */ jsxRuntime.jsx(
12858
+ Form$2.Field,
12993
12859
  {
12994
- width: "12",
12995
- height: "12",
12996
- fill: "white",
12997
- transform: "matrix(0.865865 0.500278 -0.871576 0.490261 159.141 86.6575)"
12860
+ control: form.control,
12861
+ name: "address_2",
12862
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12863
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Apartment, suite, etc." }),
12864
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12865
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12866
+ ] })
12998
12867
  }
12999
- ) }),
13000
- /* @__PURE__ */ jsxRuntime.jsx("clipPath", { id: "clip3_20915_38670", children: /* @__PURE__ */ jsxRuntime.jsx(
13001
- "rect",
12868
+ ),
12869
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
12870
+ /* @__PURE__ */ jsxRuntime.jsx(
12871
+ Form$2.Field,
12872
+ {
12873
+ control: form.control,
12874
+ name: "postal_code",
12875
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12876
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Postal code" }),
12877
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12878
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12879
+ ] })
12880
+ }
12881
+ ),
12882
+ /* @__PURE__ */ jsxRuntime.jsx(
12883
+ Form$2.Field,
12884
+ {
12885
+ control: form.control,
12886
+ name: "city",
12887
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12888
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "City" }),
12889
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12890
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12891
+ ] })
12892
+ }
12893
+ )
12894
+ ] }),
12895
+ /* @__PURE__ */ jsxRuntime.jsx(
12896
+ Form$2.Field,
13002
12897
  {
13003
- width: "12",
13004
- height: "12",
13005
- fill: "white",
13006
- transform: "matrix(0.865865 0.500278 -0.871576 0.490261 120.928 84.4561)"
12898
+ control: form.control,
12899
+ name: "province",
12900
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12901
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Province / State" }),
12902
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12903
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12904
+ ] })
13007
12905
  }
13008
- ) }),
13009
- /* @__PURE__ */ jsxRuntime.jsx("clipPath", { id: "clip4_20915_38670", children: /* @__PURE__ */ jsxRuntime.jsx(
13010
- "rect",
12906
+ ),
12907
+ /* @__PURE__ */ jsxRuntime.jsx(
12908
+ Form$2.Field,
13011
12909
  {
13012
- width: "12",
13013
- height: "12",
13014
- fill: "white",
13015
- transform: "matrix(0.865865 0.500278 -0.871576 0.490261 131.318 90.4594)"
12910
+ control: form.control,
12911
+ name: "phone",
12912
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12913
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Phone" }),
12914
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12915
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12916
+ ] })
13016
12917
  }
13017
- ) }),
13018
- /* @__PURE__ */ jsxRuntime.jsx("clipPath", { id: "clip5_20915_38670", children: /* @__PURE__ */ jsxRuntime.jsx(
13019
- "rect",
12918
+ )
12919
+ ] }) }),
12920
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
12921
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
12922
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
12923
+ ] }) })
12924
+ ]
12925
+ }
12926
+ ) });
12927
+ };
12928
+ const schema$1 = addressSchema;
12929
+ const SalesChannel = () => {
12930
+ const { id } = reactRouterDom.useParams();
12931
+ const { draft_order, isPending, isError, error } = useDraftOrder(
12932
+ id,
12933
+ {
12934
+ fields: "+sales_channel_id"
12935
+ },
12936
+ {
12937
+ enabled: !!id
12938
+ }
12939
+ );
12940
+ if (isError) {
12941
+ throw error;
12942
+ }
12943
+ const ISrEADY = !!draft_order && !isPending;
12944
+ return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
12945
+ /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
12946
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Sales Channel" }) }),
12947
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Update which sales channel the draft order is associated with" }) })
12948
+ ] }),
12949
+ ISrEADY && /* @__PURE__ */ jsxRuntime.jsx(SalesChannelForm, { order: draft_order })
12950
+ ] });
12951
+ };
12952
+ const SalesChannelForm = ({ order }) => {
12953
+ const form = reactHookForm.useForm({
12954
+ defaultValues: {
12955
+ sales_channel_id: order.sales_channel_id || ""
12956
+ },
12957
+ resolver: zod.zodResolver(schema)
12958
+ });
12959
+ const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
12960
+ const { handleSuccess } = useRouteModal();
12961
+ const onSubmit = form.handleSubmit(async (data) => {
12962
+ await mutateAsync(
12963
+ {
12964
+ sales_channel_id: data.sales_channel_id
12965
+ },
12966
+ {
12967
+ onSuccess: () => {
12968
+ ui.toast.success("Sales channel updated");
12969
+ handleSuccess();
12970
+ },
12971
+ onError: (error) => {
12972
+ ui.toast.error(error.message);
12973
+ }
12974
+ }
12975
+ );
12976
+ });
12977
+ return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
12978
+ KeyboundForm,
12979
+ {
12980
+ className: "flex flex-1 flex-col overflow-hidden",
12981
+ onSubmit,
12982
+ children: [
12983
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsx(SalesChannelField, { control: form.control, order }) }),
12984
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
12985
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
12986
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
12987
+ ] }) })
12988
+ ]
12989
+ }
12990
+ ) });
12991
+ };
12992
+ const SalesChannelField = ({ control, order }) => {
12993
+ const salesChannels = useComboboxData({
12994
+ queryFn: async (params) => {
12995
+ return await sdk.admin.salesChannel.list(params);
12996
+ },
12997
+ queryKey: ["sales-channels"],
12998
+ getOptions: (data) => {
12999
+ return data.sales_channels.map((salesChannel) => ({
13000
+ label: salesChannel.name,
13001
+ value: salesChannel.id
13002
+ }));
13003
+ },
13004
+ defaultValue: order.sales_channel_id || void 0
13005
+ });
13006
+ return /* @__PURE__ */ jsxRuntime.jsx(
13007
+ Form$2.Field,
13008
+ {
13009
+ control,
13010
+ name: "sales_channel_id",
13011
+ render: ({ field }) => {
13012
+ return /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
13013
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Sales Channel" }),
13014
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
13015
+ Combobox,
13020
13016
  {
13021
- width: "12",
13022
- height: "12",
13023
- fill: "white",
13024
- transform: "matrix(0.865865 0.500278 -0.871576 0.490261 141.709 96.4627)"
13017
+ options: salesChannels.options,
13018
+ fetchNextPage: salesChannels.fetchNextPage,
13019
+ isFetchingNextPage: salesChannels.isFetchingNextPage,
13020
+ searchValue: salesChannels.searchValue,
13021
+ onSearchValueChange: salesChannels.onSearchValueChange,
13022
+ placeholder: "Select sales channel",
13023
+ ...field
13025
13024
  }
13026
- ) })
13027
- ] })
13028
- ]
13025
+ ) }),
13026
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
13027
+ ] });
13028
+ }
13029
13029
  }
13030
13030
  );
13031
13031
  };
13032
13032
  const schema = objectType({
13033
- customer_id: stringType().min(1)
13033
+ sales_channel_id: stringType().min(1)
13034
13034
  });
13035
13035
  const widgetModule = { widgets: [] };
13036
13036
  const routeModule = {
@@ -13052,10 +13052,6 @@ const routeModule = {
13052
13052
  handle,
13053
13053
  loader,
13054
13054
  children: [
13055
- {
13056
- Component: BillingAddress,
13057
- path: "/draft-orders/:id/billing-address"
13058
- },
13059
13055
  {
13060
13056
  Component: CustomItems,
13061
13057
  path: "/draft-orders/:id/custom-items"
@@ -13068,18 +13064,14 @@ const routeModule = {
13068
13064
  Component: Items,
13069
13065
  path: "/draft-orders/:id/items"
13070
13066
  },
13071
- {
13072
- Component: Promotions,
13073
- path: "/draft-orders/:id/promotions"
13074
- },
13075
- {
13076
- Component: SalesChannel,
13077
- path: "/draft-orders/:id/sales-channel"
13078
- },
13079
13067
  {
13080
13068
  Component: Metadata,
13081
13069
  path: "/draft-orders/:id/metadata"
13082
13070
  },
13071
+ {
13072
+ Component: Promotions,
13073
+ path: "/draft-orders/:id/promotions"
13074
+ },
13083
13075
  {
13084
13076
  Component: Shipping,
13085
13077
  path: "/draft-orders/:id/shipping"
@@ -13091,6 +13083,14 @@ const routeModule = {
13091
13083
  {
13092
13084
  Component: TransferOwnership,
13093
13085
  path: "/draft-orders/:id/transfer-ownership"
13086
+ },
13087
+ {
13088
+ Component: BillingAddress,
13089
+ path: "/draft-orders/:id/billing-address"
13090
+ },
13091
+ {
13092
+ Component: SalesChannel,
13093
+ path: "/draft-orders/:id/sales-channel"
13094
13094
  }
13095
13095
  ]
13096
13096
  }