@medusajs/draft-order 2.11.4-preview-20251123090130 → 2.11.4-preview-20251123120138

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.
@@ -9762,27 +9762,6 @@ const BillingAddressForm = ({ order }) => {
9762
9762
  ) });
9763
9763
  };
9764
9764
  const schema$5 = addressSchema;
9765
- const CustomItems = () => {
9766
- return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
9767
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Header, { children: /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Custom Items" }) }) }),
9768
- /* @__PURE__ */ jsxRuntime.jsx(CustomItemsForm, {})
9769
- ] });
9770
- };
9771
- const CustomItemsForm = () => {
9772
- const form = reactHookForm.useForm({
9773
- resolver: zod.zodResolver(schema$4)
9774
- });
9775
- return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(KeyboundForm, { className: "flex flex-1 flex-col", children: [
9776
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, {}),
9777
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
9778
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
9779
- /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", children: "Save" })
9780
- ] }) })
9781
- ] }) });
9782
- };
9783
- const schema$4 = objectType({
9784
- email: stringType().email()
9785
- });
9786
9765
  const Email = () => {
9787
9766
  const { id } = reactRouterDom.useParams();
9788
9767
  const { order, isPending, isError, error } = useOrder(id, {
@@ -9805,7 +9784,7 @@ const EmailForm = ({ order }) => {
9805
9784
  defaultValues: {
9806
9785
  email: order.email ?? ""
9807
9786
  },
9808
- resolver: zod.zodResolver(schema$3)
9787
+ resolver: zod.zodResolver(schema$4)
9809
9788
  });
9810
9789
  const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
9811
9790
  const { handleSuccess } = useRouteModal();
@@ -9848,6 +9827,27 @@ const EmailForm = ({ order }) => {
9848
9827
  }
9849
9828
  ) });
9850
9829
  };
9830
+ const schema$4 = objectType({
9831
+ email: stringType().email()
9832
+ });
9833
+ const CustomItems = () => {
9834
+ return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
9835
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Header, { children: /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Custom Items" }) }) }),
9836
+ /* @__PURE__ */ jsxRuntime.jsx(CustomItemsForm, {})
9837
+ ] });
9838
+ };
9839
+ const CustomItemsForm = () => {
9840
+ const form = reactHookForm.useForm({
9841
+ resolver: zod.zodResolver(schema$3)
9842
+ });
9843
+ return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(KeyboundForm, { className: "flex flex-1 flex-col", children: [
9844
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, {}),
9845
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
9846
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
9847
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", children: "Save" })
9848
+ ] }) })
9849
+ ] }) });
9850
+ };
9851
9851
  const schema$3 = objectType({
9852
9852
  email: stringType().email()
9853
9853
  });
@@ -10825,392 +10825,115 @@ const customItemSchema = objectType({
10825
10825
  quantity: numberType(),
10826
10826
  unit_price: unionType([numberType(), stringType()])
10827
10827
  });
10828
- const PROMOTION_QUERY_KEY = "promotions";
10829
- const promotionsQueryKeys = {
10830
- list: (query2) => [
10831
- PROMOTION_QUERY_KEY,
10832
- query2 ? query2 : void 0
10833
- ],
10834
- detail: (id, query2) => [
10835
- PROMOTION_QUERY_KEY,
10836
- id,
10837
- query2 ? query2 : void 0
10838
- ]
10839
- };
10840
- const usePromotions = (query2, options) => {
10841
- const { data, ...rest } = reactQuery.useQuery({
10842
- queryKey: promotionsQueryKeys.list(query2),
10843
- queryFn: async () => sdk.admin.promotion.list(query2),
10844
- ...options
10845
- });
10846
- return { ...data, ...rest };
10847
- };
10848
- const Promotions = () => {
10828
+ const InlineTip = React.forwardRef(
10829
+ ({ variant = "tip", label, className, children, ...props }, ref) => {
10830
+ const labelValue = label || (variant === "warning" ? "Warning" : "Tip");
10831
+ return /* @__PURE__ */ jsxRuntime.jsxs(
10832
+ "div",
10833
+ {
10834
+ ref,
10835
+ className: ui.clx(
10836
+ "bg-ui-bg-component txt-small text-ui-fg-subtle grid grid-cols-[4px_1fr] items-start gap-3 rounded-lg border p-3",
10837
+ className
10838
+ ),
10839
+ ...props,
10840
+ children: [
10841
+ /* @__PURE__ */ jsxRuntime.jsx(
10842
+ "div",
10843
+ {
10844
+ role: "presentation",
10845
+ className: ui.clx("w-4px bg-ui-tag-neutral-icon h-full rounded-full", {
10846
+ "bg-ui-tag-orange-icon": variant === "warning"
10847
+ })
10848
+ }
10849
+ ),
10850
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-pretty", children: [
10851
+ /* @__PURE__ */ jsxRuntime.jsxs("strong", { className: "txt-small-plus text-ui-fg-base", children: [
10852
+ labelValue,
10853
+ ":"
10854
+ ] }),
10855
+ " ",
10856
+ children
10857
+ ] })
10858
+ ]
10859
+ }
10860
+ );
10861
+ }
10862
+ );
10863
+ InlineTip.displayName = "InlineTip";
10864
+ const MetadataFieldSchema = objectType({
10865
+ key: stringType(),
10866
+ disabled: booleanType().optional(),
10867
+ value: anyType()
10868
+ });
10869
+ const MetadataSchema = objectType({
10870
+ metadata: arrayType(MetadataFieldSchema)
10871
+ });
10872
+ const Metadata = () => {
10849
10873
  const { id } = reactRouterDom.useParams();
10850
- const {
10851
- order: preview,
10852
- isError: isPreviewError,
10853
- error: previewError
10854
- } = useOrderPreview(id, void 0);
10855
- useInitiateOrderEdit({ preview });
10856
- const { onCancel } = useCancelOrderEdit({ preview });
10857
- if (isPreviewError) {
10858
- throw previewError;
10874
+ const { order, isPending, isError, error } = useOrder(id, {
10875
+ fields: "metadata"
10876
+ });
10877
+ if (isError) {
10878
+ throw error;
10859
10879
  }
10860
- const isReady = !!preview;
10861
- return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { onClose: onCancel, children: [
10862
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Header, { children: /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Promotions" }) }) }),
10863
- isReady && /* @__PURE__ */ jsxRuntime.jsx(PromotionForm, { preview })
10880
+ const isReady = !isPending && !!order;
10881
+ return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
10882
+ /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
10883
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Metadata" }) }),
10884
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Add metadata to the draft order." }) })
10885
+ ] }),
10886
+ !isReady ? /* @__PURE__ */ jsxRuntime.jsx(PlaceholderInner, {}) : /* @__PURE__ */ jsxRuntime.jsx(MetadataForm, { orderId: id, metadata: order == null ? void 0 : order.metadata })
10864
10887
  ] });
10865
10888
  };
10866
- const PromotionForm = ({ preview }) => {
10867
- const { items, shipping_methods } = preview;
10868
- const [isSubmitting, setIsSubmitting] = React.useState(false);
10869
- const [comboboxValue, setComboboxValue] = React.useState("");
10889
+ const METADATA_KEY_LABEL_ID = "metadata-form-key-label";
10890
+ const METADATA_VALUE_LABEL_ID = "metadata-form-value-label";
10891
+ const MetadataForm = ({ orderId, metadata }) => {
10870
10892
  const { handleSuccess } = useRouteModal();
10871
- const { mutateAsync: addPromotions, isPending: isAddingPromotions } = useDraftOrderAddPromotions(preview.id);
10872
- const promoIds = getPromotionIds(items, shipping_methods);
10873
- const { promotions, isPending, isError, error } = usePromotions(
10874
- {
10875
- id: promoIds
10876
- },
10877
- {
10878
- enabled: !!promoIds.length
10879
- }
10880
- );
10881
- const comboboxData = useComboboxData({
10882
- queryKey: ["promotions", "combobox", promoIds],
10883
- queryFn: async (params) => {
10884
- return await sdk.admin.promotion.list({
10885
- ...params,
10886
- id: {
10887
- $nin: promoIds
10888
- }
10889
- });
10893
+ const hasUneditableRows = getHasUneditableRows(metadata);
10894
+ const { mutateAsync, isPending } = useUpdateDraftOrder(orderId);
10895
+ const form = reactHookForm.useForm({
10896
+ defaultValues: {
10897
+ metadata: getDefaultValues(metadata)
10890
10898
  },
10891
- getOptions: (data) => {
10892
- return data.promotions.map((promotion) => ({
10893
- label: promotion.code,
10894
- value: promotion.code
10895
- }));
10896
- }
10899
+ resolver: zod.zodResolver(MetadataSchema)
10897
10900
  });
10898
- const add = async (value) => {
10899
- if (!value) {
10900
- return;
10901
- }
10902
- addPromotions(
10901
+ const handleSubmit = form.handleSubmit(async (data) => {
10902
+ const parsedData = parseValues(data);
10903
+ await mutateAsync(
10903
10904
  {
10904
- promo_codes: [value]
10905
+ metadata: parsedData
10905
10906
  },
10906
10907
  {
10907
- onError: (e) => {
10908
- ui.toast.error(e.message);
10909
- comboboxData.onSearchValueChange("");
10910
- setComboboxValue("");
10911
- },
10912
10908
  onSuccess: () => {
10913
- comboboxData.onSearchValueChange("");
10914
- setComboboxValue("");
10909
+ ui.toast.success("Metadata updated");
10910
+ handleSuccess();
10911
+ },
10912
+ onError: (error) => {
10913
+ ui.toast.error(error.message);
10915
10914
  }
10916
10915
  }
10917
10916
  );
10918
- };
10919
- const { mutateAsync: confirmOrderEdit } = useDraftOrderConfirmEdit(preview.id);
10920
- const { mutateAsync: requestOrderEdit } = useOrderEditRequest(preview.id);
10921
- const onSubmit = async () => {
10922
- setIsSubmitting(true);
10923
- let requestSucceeded = false;
10924
- await requestOrderEdit(void 0, {
10925
- onError: (e) => {
10926
- ui.toast.error(e.message);
10927
- },
10928
- onSuccess: () => {
10929
- requestSucceeded = true;
10930
- }
10931
- });
10932
- if (!requestSucceeded) {
10933
- setIsSubmitting(false);
10934
- return;
10917
+ });
10918
+ const { fields, insert, remove } = reactHookForm.useFieldArray({
10919
+ control: form.control,
10920
+ name: "metadata"
10921
+ });
10922
+ function deleteRow(index) {
10923
+ remove(index);
10924
+ if (fields.length === 1) {
10925
+ insert(0, {
10926
+ key: "",
10927
+ value: "",
10928
+ disabled: false
10929
+ });
10935
10930
  }
10936
- await confirmOrderEdit(void 0, {
10937
- onError: (e) => {
10938
- ui.toast.error(e.message);
10939
- },
10940
- onSuccess: () => {
10941
- handleSuccess();
10942
- },
10943
- onSettled: () => {
10944
- setIsSubmitting(false);
10945
- }
10946
- });
10947
- };
10948
- if (isError) {
10949
- throw error;
10950
- }
10951
- return /* @__PURE__ */ jsxRuntime.jsxs(KeyboundForm, { className: "flex flex-1 flex-col", onSubmit, children: [
10952
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-4", children: [
10953
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-3", children: [
10954
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col", children: [
10955
- /* @__PURE__ */ jsxRuntime.jsx(ui.Label, { size: "small", weight: "plus", htmlFor: "promotion-combobox", children: "Apply promotions" }),
10956
- /* @__PURE__ */ jsxRuntime.jsx(ui.Hint, { id: "promotion-combobox-hint", children: "Manage promotions that should be applied to the order." })
10957
- ] }),
10958
- /* @__PURE__ */ jsxRuntime.jsx(
10959
- Combobox,
10960
- {
10961
- id: "promotion-combobox",
10962
- "aria-describedby": "promotion-combobox-hint",
10963
- isFetchingNextPage: comboboxData.isFetchingNextPage,
10964
- fetchNextPage: comboboxData.fetchNextPage,
10965
- options: comboboxData.options,
10966
- onSearchValueChange: comboboxData.onSearchValueChange,
10967
- searchValue: comboboxData.searchValue,
10968
- disabled: comboboxData.disabled || isAddingPromotions,
10969
- onChange: add,
10970
- value: comboboxValue
10971
- }
10972
- )
10973
- ] }),
10974
- /* @__PURE__ */ jsxRuntime.jsx(ui.Divider, { variant: "dashed" }),
10975
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col gap-2", children: promotions == null ? void 0 : promotions.map((promotion) => /* @__PURE__ */ jsxRuntime.jsx(
10976
- PromotionItem,
10977
- {
10978
- promotion,
10979
- orderId: preview.id,
10980
- isLoading: isPending
10981
- },
10982
- promotion.id
10983
- )) })
10984
- ] }) }),
10985
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
10986
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
10987
- /* @__PURE__ */ jsxRuntime.jsx(
10988
- ui.Button,
10989
- {
10990
- size: "small",
10991
- type: "submit",
10992
- isLoading: isSubmitting || isAddingPromotions,
10993
- children: "Save"
10994
- }
10995
- )
10996
- ] }) })
10997
- ] });
10998
- };
10999
- const PromotionItem = ({
11000
- promotion,
11001
- orderId,
11002
- isLoading
11003
- }) => {
11004
- var _a;
11005
- const { mutateAsync: removePromotions, isPending } = useDraftOrderRemovePromotions(orderId);
11006
- const onRemove = async () => {
11007
- removePromotions(
11008
- {
11009
- promo_codes: [promotion.code]
11010
- },
11011
- {
11012
- onError: (e) => {
11013
- ui.toast.error(e.message);
11014
- }
11015
- }
11016
- );
11017
- };
11018
- const displayValue = getDisplayValue(promotion);
11019
- return /* @__PURE__ */ jsxRuntime.jsxs(
11020
- "div",
11021
- {
11022
- className: ui.clx(
11023
- "bg-ui-bg-component shadow-elevation-card-rest flex items-center justify-between rounded-lg px-3 py-2",
11024
- {
11025
- "animate-pulse": isLoading
11026
- }
11027
- ),
11028
- children: [
11029
- /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
11030
- /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", weight: "plus", leading: "compact", children: promotion.code }),
11031
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-ui-fg-subtle flex items-center gap-1.5", children: [
11032
- displayValue && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1.5", children: [
11033
- /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", leading: "compact", children: displayValue }),
11034
- /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", leading: "compact", children: "·" })
11035
- ] }),
11036
- /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", leading: "compact", className: "capitalize", children: (_a = promotion.application_method) == null ? void 0 : _a.allocation })
11037
- ] })
11038
- ] }),
11039
- /* @__PURE__ */ jsxRuntime.jsx(
11040
- ui.IconButton,
11041
- {
11042
- size: "small",
11043
- type: "button",
11044
- variant: "transparent",
11045
- onClick: onRemove,
11046
- isLoading: isPending || isLoading,
11047
- children: /* @__PURE__ */ jsxRuntime.jsx(icons.XMark, {})
11048
- }
11049
- )
11050
- ]
11051
- },
11052
- promotion.id
11053
- );
11054
- };
11055
- function getDisplayValue(promotion) {
11056
- var _a, _b, _c, _d;
11057
- const value = (_a = promotion.application_method) == null ? void 0 : _a.value;
11058
- if (!value) {
11059
- return null;
11060
- }
11061
- if (((_b = promotion.application_method) == null ? void 0 : _b.type) === "fixed") {
11062
- const currency = (_c = promotion.application_method) == null ? void 0 : _c.currency_code;
11063
- if (!currency) {
11064
- return null;
11065
- }
11066
- return getLocaleAmount(value, currency);
11067
- } else if (((_d = promotion.application_method) == null ? void 0 : _d.type) === "percentage") {
11068
- return formatPercentage(value);
11069
- }
11070
- return null;
11071
- }
11072
- const formatter = new Intl.NumberFormat([], {
11073
- style: "percent",
11074
- minimumFractionDigits: 2
11075
- });
11076
- const formatPercentage = (value, isPercentageValue = false) => {
11077
- let val = value || 0;
11078
- if (!isPercentageValue) {
11079
- val = val / 100;
11080
- }
11081
- return formatter.format(val);
11082
- };
11083
- function getPromotionIds(items, shippingMethods) {
11084
- const promotionIds = /* @__PURE__ */ new Set();
11085
- for (const item of items) {
11086
- if (item.adjustments) {
11087
- for (const adjustment of item.adjustments) {
11088
- if (adjustment.promotion_id) {
11089
- promotionIds.add(adjustment.promotion_id);
11090
- }
11091
- }
11092
- }
11093
- }
11094
- for (const shippingMethod of shippingMethods) {
11095
- if (shippingMethod.adjustments) {
11096
- for (const adjustment of shippingMethod.adjustments) {
11097
- if (adjustment.promotion_id) {
11098
- promotionIds.add(adjustment.promotion_id);
11099
- }
11100
- }
11101
- }
11102
- }
11103
- return Array.from(promotionIds);
11104
- }
11105
- const InlineTip = React.forwardRef(
11106
- ({ variant = "tip", label, className, children, ...props }, ref) => {
11107
- const labelValue = label || (variant === "warning" ? "Warning" : "Tip");
11108
- return /* @__PURE__ */ jsxRuntime.jsxs(
11109
- "div",
11110
- {
11111
- ref,
11112
- className: ui.clx(
11113
- "bg-ui-bg-component txt-small text-ui-fg-subtle grid grid-cols-[4px_1fr] items-start gap-3 rounded-lg border p-3",
11114
- className
11115
- ),
11116
- ...props,
11117
- children: [
11118
- /* @__PURE__ */ jsxRuntime.jsx(
11119
- "div",
11120
- {
11121
- role: "presentation",
11122
- className: ui.clx("w-4px bg-ui-tag-neutral-icon h-full rounded-full", {
11123
- "bg-ui-tag-orange-icon": variant === "warning"
11124
- })
11125
- }
11126
- ),
11127
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-pretty", children: [
11128
- /* @__PURE__ */ jsxRuntime.jsxs("strong", { className: "txt-small-plus text-ui-fg-base", children: [
11129
- labelValue,
11130
- ":"
11131
- ] }),
11132
- " ",
11133
- children
11134
- ] })
11135
- ]
11136
- }
11137
- );
11138
- }
11139
- );
11140
- InlineTip.displayName = "InlineTip";
11141
- const MetadataFieldSchema = objectType({
11142
- key: stringType(),
11143
- disabled: booleanType().optional(),
11144
- value: anyType()
11145
- });
11146
- const MetadataSchema = objectType({
11147
- metadata: arrayType(MetadataFieldSchema)
11148
- });
11149
- const Metadata = () => {
11150
- const { id } = reactRouterDom.useParams();
11151
- const { order, isPending, isError, error } = useOrder(id, {
11152
- fields: "metadata"
11153
- });
11154
- if (isError) {
11155
- throw error;
11156
- }
11157
- const isReady = !isPending && !!order;
11158
- return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
11159
- /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
11160
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Metadata" }) }),
11161
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Add metadata to the draft order." }) })
11162
- ] }),
11163
- !isReady ? /* @__PURE__ */ jsxRuntime.jsx(PlaceholderInner, {}) : /* @__PURE__ */ jsxRuntime.jsx(MetadataForm, { orderId: id, metadata: order == null ? void 0 : order.metadata })
11164
- ] });
11165
- };
11166
- const METADATA_KEY_LABEL_ID = "metadata-form-key-label";
11167
- const METADATA_VALUE_LABEL_ID = "metadata-form-value-label";
11168
- const MetadataForm = ({ orderId, metadata }) => {
11169
- const { handleSuccess } = useRouteModal();
11170
- const hasUneditableRows = getHasUneditableRows(metadata);
11171
- const { mutateAsync, isPending } = useUpdateDraftOrder(orderId);
11172
- const form = reactHookForm.useForm({
11173
- defaultValues: {
11174
- metadata: getDefaultValues(metadata)
11175
- },
11176
- resolver: zod.zodResolver(MetadataSchema)
11177
- });
11178
- const handleSubmit = form.handleSubmit(async (data) => {
11179
- const parsedData = parseValues(data);
11180
- await mutateAsync(
11181
- {
11182
- metadata: parsedData
11183
- },
11184
- {
11185
- onSuccess: () => {
11186
- ui.toast.success("Metadata updated");
11187
- handleSuccess();
11188
- },
11189
- onError: (error) => {
11190
- ui.toast.error(error.message);
11191
- }
11192
- }
11193
- );
11194
- });
11195
- const { fields, insert, remove } = reactHookForm.useFieldArray({
11196
- control: form.control,
11197
- name: "metadata"
11198
- });
11199
- function deleteRow(index) {
11200
- remove(index);
11201
- if (fields.length === 1) {
11202
- insert(0, {
11203
- key: "",
11204
- value: "",
11205
- disabled: false
11206
- });
11207
- }
11208
- }
11209
- function insertRow(index, position) {
11210
- insert(index + (position === "above" ? 0 : 1), {
11211
- key: "",
11212
- value: "",
11213
- disabled: false
10931
+ }
10932
+ function insertRow(index, position) {
10933
+ insert(index + (position === "above" ? 0 : 1), {
10934
+ key: "",
10935
+ value: "",
10936
+ disabled: false
11214
10937
  });
11215
10938
  }
11216
10939
  return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
@@ -11452,9 +11175,286 @@ function getHasUneditableRows(metadata) {
11452
11175
  (value) => !EDITABLE_TYPES.includes(typeof value)
11453
11176
  );
11454
11177
  }
11455
- const SalesChannel = () => {
11456
- const { id } = reactRouterDom.useParams();
11457
- const { draft_order, isPending, isError, error } = useDraftOrder(
11178
+ const PROMOTION_QUERY_KEY = "promotions";
11179
+ const promotionsQueryKeys = {
11180
+ list: (query2) => [
11181
+ PROMOTION_QUERY_KEY,
11182
+ query2 ? query2 : void 0
11183
+ ],
11184
+ detail: (id, query2) => [
11185
+ PROMOTION_QUERY_KEY,
11186
+ id,
11187
+ query2 ? query2 : void 0
11188
+ ]
11189
+ };
11190
+ const usePromotions = (query2, options) => {
11191
+ const { data, ...rest } = reactQuery.useQuery({
11192
+ queryKey: promotionsQueryKeys.list(query2),
11193
+ queryFn: async () => sdk.admin.promotion.list(query2),
11194
+ ...options
11195
+ });
11196
+ return { ...data, ...rest };
11197
+ };
11198
+ const Promotions = () => {
11199
+ const { id } = reactRouterDom.useParams();
11200
+ const {
11201
+ order: preview,
11202
+ isError: isPreviewError,
11203
+ error: previewError
11204
+ } = useOrderPreview(id, void 0);
11205
+ useInitiateOrderEdit({ preview });
11206
+ const { onCancel } = useCancelOrderEdit({ preview });
11207
+ if (isPreviewError) {
11208
+ throw previewError;
11209
+ }
11210
+ const isReady = !!preview;
11211
+ return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { onClose: onCancel, children: [
11212
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Header, { children: /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Promotions" }) }) }),
11213
+ isReady && /* @__PURE__ */ jsxRuntime.jsx(PromotionForm, { preview })
11214
+ ] });
11215
+ };
11216
+ const PromotionForm = ({ preview }) => {
11217
+ const { items, shipping_methods } = preview;
11218
+ const [isSubmitting, setIsSubmitting] = React.useState(false);
11219
+ const [comboboxValue, setComboboxValue] = React.useState("");
11220
+ const { handleSuccess } = useRouteModal();
11221
+ const { mutateAsync: addPromotions, isPending: isAddingPromotions } = useDraftOrderAddPromotions(preview.id);
11222
+ const promoIds = getPromotionIds(items, shipping_methods);
11223
+ const { promotions, isPending, isError, error } = usePromotions(
11224
+ {
11225
+ id: promoIds
11226
+ },
11227
+ {
11228
+ enabled: !!promoIds.length
11229
+ }
11230
+ );
11231
+ const comboboxData = useComboboxData({
11232
+ queryKey: ["promotions", "combobox", promoIds],
11233
+ queryFn: async (params) => {
11234
+ return await sdk.admin.promotion.list({
11235
+ ...params,
11236
+ id: {
11237
+ $nin: promoIds
11238
+ }
11239
+ });
11240
+ },
11241
+ getOptions: (data) => {
11242
+ return data.promotions.map((promotion) => ({
11243
+ label: promotion.code,
11244
+ value: promotion.code
11245
+ }));
11246
+ }
11247
+ });
11248
+ const add = async (value) => {
11249
+ if (!value) {
11250
+ return;
11251
+ }
11252
+ addPromotions(
11253
+ {
11254
+ promo_codes: [value]
11255
+ },
11256
+ {
11257
+ onError: (e) => {
11258
+ ui.toast.error(e.message);
11259
+ comboboxData.onSearchValueChange("");
11260
+ setComboboxValue("");
11261
+ },
11262
+ onSuccess: () => {
11263
+ comboboxData.onSearchValueChange("");
11264
+ setComboboxValue("");
11265
+ }
11266
+ }
11267
+ );
11268
+ };
11269
+ const { mutateAsync: confirmOrderEdit } = useDraftOrderConfirmEdit(preview.id);
11270
+ const { mutateAsync: requestOrderEdit } = useOrderEditRequest(preview.id);
11271
+ const onSubmit = async () => {
11272
+ setIsSubmitting(true);
11273
+ let requestSucceeded = false;
11274
+ await requestOrderEdit(void 0, {
11275
+ onError: (e) => {
11276
+ ui.toast.error(e.message);
11277
+ },
11278
+ onSuccess: () => {
11279
+ requestSucceeded = true;
11280
+ }
11281
+ });
11282
+ if (!requestSucceeded) {
11283
+ setIsSubmitting(false);
11284
+ return;
11285
+ }
11286
+ await confirmOrderEdit(void 0, {
11287
+ onError: (e) => {
11288
+ ui.toast.error(e.message);
11289
+ },
11290
+ onSuccess: () => {
11291
+ handleSuccess();
11292
+ },
11293
+ onSettled: () => {
11294
+ setIsSubmitting(false);
11295
+ }
11296
+ });
11297
+ };
11298
+ if (isError) {
11299
+ throw error;
11300
+ }
11301
+ return /* @__PURE__ */ jsxRuntime.jsxs(KeyboundForm, { className: "flex flex-1 flex-col", onSubmit, children: [
11302
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-4", children: [
11303
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-3", children: [
11304
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col", children: [
11305
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Label, { size: "small", weight: "plus", htmlFor: "promotion-combobox", children: "Apply promotions" }),
11306
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Hint, { id: "promotion-combobox-hint", children: "Manage promotions that should be applied to the order." })
11307
+ ] }),
11308
+ /* @__PURE__ */ jsxRuntime.jsx(
11309
+ Combobox,
11310
+ {
11311
+ id: "promotion-combobox",
11312
+ "aria-describedby": "promotion-combobox-hint",
11313
+ isFetchingNextPage: comboboxData.isFetchingNextPage,
11314
+ fetchNextPage: comboboxData.fetchNextPage,
11315
+ options: comboboxData.options,
11316
+ onSearchValueChange: comboboxData.onSearchValueChange,
11317
+ searchValue: comboboxData.searchValue,
11318
+ disabled: comboboxData.disabled || isAddingPromotions,
11319
+ onChange: add,
11320
+ value: comboboxValue
11321
+ }
11322
+ )
11323
+ ] }),
11324
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Divider, { variant: "dashed" }),
11325
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col gap-2", children: promotions == null ? void 0 : promotions.map((promotion) => /* @__PURE__ */ jsxRuntime.jsx(
11326
+ PromotionItem,
11327
+ {
11328
+ promotion,
11329
+ orderId: preview.id,
11330
+ isLoading: isPending
11331
+ },
11332
+ promotion.id
11333
+ )) })
11334
+ ] }) }),
11335
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
11336
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
11337
+ /* @__PURE__ */ jsxRuntime.jsx(
11338
+ ui.Button,
11339
+ {
11340
+ size: "small",
11341
+ type: "submit",
11342
+ isLoading: isSubmitting || isAddingPromotions,
11343
+ children: "Save"
11344
+ }
11345
+ )
11346
+ ] }) })
11347
+ ] });
11348
+ };
11349
+ const PromotionItem = ({
11350
+ promotion,
11351
+ orderId,
11352
+ isLoading
11353
+ }) => {
11354
+ var _a;
11355
+ const { mutateAsync: removePromotions, isPending } = useDraftOrderRemovePromotions(orderId);
11356
+ const onRemove = async () => {
11357
+ removePromotions(
11358
+ {
11359
+ promo_codes: [promotion.code]
11360
+ },
11361
+ {
11362
+ onError: (e) => {
11363
+ ui.toast.error(e.message);
11364
+ }
11365
+ }
11366
+ );
11367
+ };
11368
+ const displayValue = getDisplayValue(promotion);
11369
+ return /* @__PURE__ */ jsxRuntime.jsxs(
11370
+ "div",
11371
+ {
11372
+ className: ui.clx(
11373
+ "bg-ui-bg-component shadow-elevation-card-rest flex items-center justify-between rounded-lg px-3 py-2",
11374
+ {
11375
+ "animate-pulse": isLoading
11376
+ }
11377
+ ),
11378
+ children: [
11379
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
11380
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", weight: "plus", leading: "compact", children: promotion.code }),
11381
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-ui-fg-subtle flex items-center gap-1.5", children: [
11382
+ displayValue && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1.5", children: [
11383
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", leading: "compact", children: displayValue }),
11384
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", leading: "compact", children: "·" })
11385
+ ] }),
11386
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", leading: "compact", className: "capitalize", children: (_a = promotion.application_method) == null ? void 0 : _a.allocation })
11387
+ ] })
11388
+ ] }),
11389
+ /* @__PURE__ */ jsxRuntime.jsx(
11390
+ ui.IconButton,
11391
+ {
11392
+ size: "small",
11393
+ type: "button",
11394
+ variant: "transparent",
11395
+ onClick: onRemove,
11396
+ isLoading: isPending || isLoading,
11397
+ children: /* @__PURE__ */ jsxRuntime.jsx(icons.XMark, {})
11398
+ }
11399
+ )
11400
+ ]
11401
+ },
11402
+ promotion.id
11403
+ );
11404
+ };
11405
+ function getDisplayValue(promotion) {
11406
+ var _a, _b, _c, _d;
11407
+ const value = (_a = promotion.application_method) == null ? void 0 : _a.value;
11408
+ if (!value) {
11409
+ return null;
11410
+ }
11411
+ if (((_b = promotion.application_method) == null ? void 0 : _b.type) === "fixed") {
11412
+ const currency = (_c = promotion.application_method) == null ? void 0 : _c.currency_code;
11413
+ if (!currency) {
11414
+ return null;
11415
+ }
11416
+ return getLocaleAmount(value, currency);
11417
+ } else if (((_d = promotion.application_method) == null ? void 0 : _d.type) === "percentage") {
11418
+ return formatPercentage(value);
11419
+ }
11420
+ return null;
11421
+ }
11422
+ const formatter = new Intl.NumberFormat([], {
11423
+ style: "percent",
11424
+ minimumFractionDigits: 2
11425
+ });
11426
+ const formatPercentage = (value, isPercentageValue = false) => {
11427
+ let val = value || 0;
11428
+ if (!isPercentageValue) {
11429
+ val = val / 100;
11430
+ }
11431
+ return formatter.format(val);
11432
+ };
11433
+ function getPromotionIds(items, shippingMethods) {
11434
+ const promotionIds = /* @__PURE__ */ new Set();
11435
+ for (const item of items) {
11436
+ if (item.adjustments) {
11437
+ for (const adjustment of item.adjustments) {
11438
+ if (adjustment.promotion_id) {
11439
+ promotionIds.add(adjustment.promotion_id);
11440
+ }
11441
+ }
11442
+ }
11443
+ }
11444
+ for (const shippingMethod of shippingMethods) {
11445
+ if (shippingMethod.adjustments) {
11446
+ for (const adjustment of shippingMethod.adjustments) {
11447
+ if (adjustment.promotion_id) {
11448
+ promotionIds.add(adjustment.promotion_id);
11449
+ }
11450
+ }
11451
+ }
11452
+ }
11453
+ return Array.from(promotionIds);
11454
+ }
11455
+ const SalesChannel = () => {
11456
+ const { id } = reactRouterDom.useParams();
11457
+ const { draft_order, isPending, isError, error } = useDraftOrder(
11458
11458
  id,
11459
11459
  {
11460
11460
  fields: "+sales_channel_id"
@@ -11535,232 +11535,29 @@ const SalesChannelField = ({ control, order }) => {
11535
11535
  control,
11536
11536
  name: "sales_channel_id",
11537
11537
  render: ({ field }) => {
11538
- return /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11539
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Sales Channel" }),
11540
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
11541
- Combobox,
11542
- {
11543
- options: salesChannels.options,
11544
- fetchNextPage: salesChannels.fetchNextPage,
11545
- isFetchingNextPage: salesChannels.isFetchingNextPage,
11546
- searchValue: salesChannels.searchValue,
11547
- onSearchValueChange: salesChannels.onSearchValueChange,
11548
- placeholder: "Select sales channel",
11549
- ...field
11550
- }
11551
- ) }),
11552
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11553
- ] });
11554
- }
11555
- }
11556
- );
11557
- };
11558
- const schema$2 = objectType({
11559
- sales_channel_id: stringType().min(1)
11560
- });
11561
- const ShippingAddress = () => {
11562
- const { id } = reactRouterDom.useParams();
11563
- const { order, isPending, isError, error } = useOrder(id, {
11564
- fields: "+shipping_address"
11565
- });
11566
- if (isError) {
11567
- throw error;
11568
- }
11569
- const isReady = !isPending && !!order;
11570
- return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
11571
- /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
11572
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Shipping Address" }) }),
11573
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit the shipping address for the draft order" }) })
11574
- ] }),
11575
- isReady && /* @__PURE__ */ jsxRuntime.jsx(ShippingAddressForm, { order })
11576
- ] });
11577
- };
11578
- const ShippingAddressForm = ({ order }) => {
11579
- var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
11580
- const form = reactHookForm.useForm({
11581
- defaultValues: {
11582
- first_name: ((_a = order.shipping_address) == null ? void 0 : _a.first_name) ?? "",
11583
- last_name: ((_b = order.shipping_address) == null ? void 0 : _b.last_name) ?? "",
11584
- company: ((_c = order.shipping_address) == null ? void 0 : _c.company) ?? "",
11585
- address_1: ((_d = order.shipping_address) == null ? void 0 : _d.address_1) ?? "",
11586
- address_2: ((_e = order.shipping_address) == null ? void 0 : _e.address_2) ?? "",
11587
- city: ((_f = order.shipping_address) == null ? void 0 : _f.city) ?? "",
11588
- province: ((_g = order.shipping_address) == null ? void 0 : _g.province) ?? "",
11589
- country_code: ((_h = order.shipping_address) == null ? void 0 : _h.country_code) ?? "",
11590
- postal_code: ((_i = order.shipping_address) == null ? void 0 : _i.postal_code) ?? "",
11591
- phone: ((_j = order.shipping_address) == null ? void 0 : _j.phone) ?? ""
11592
- },
11593
- resolver: zod.zodResolver(schema$1)
11594
- });
11595
- const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
11596
- const { handleSuccess } = useRouteModal();
11597
- const onSubmit = form.handleSubmit(async (data) => {
11598
- await mutateAsync(
11599
- {
11600
- shipping_address: {
11601
- first_name: data.first_name,
11602
- last_name: data.last_name,
11603
- company: data.company,
11604
- address_1: data.address_1,
11605
- address_2: data.address_2,
11606
- city: data.city,
11607
- province: data.province,
11608
- country_code: data.country_code,
11609
- postal_code: data.postal_code,
11610
- phone: data.phone
11611
- }
11612
- },
11613
- {
11614
- onSuccess: () => {
11615
- handleSuccess();
11616
- },
11617
- onError: (error) => {
11618
- ui.toast.error(error.message);
11619
- }
11620
- }
11621
- );
11622
- });
11623
- return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
11624
- KeyboundForm,
11625
- {
11626
- className: "flex flex-1 flex-col overflow-hidden",
11627
- onSubmit,
11628
- children: [
11629
- /* @__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: [
11630
- /* @__PURE__ */ jsxRuntime.jsx(
11631
- Form$2.Field,
11632
- {
11633
- control: form.control,
11634
- name: "country_code",
11635
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11636
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Country" }),
11637
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(CountrySelect, { ...field }) }),
11638
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11639
- ] })
11640
- }
11641
- ),
11642
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
11643
- /* @__PURE__ */ jsxRuntime.jsx(
11644
- Form$2.Field,
11645
- {
11646
- control: form.control,
11647
- name: "first_name",
11648
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11649
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "First name" }),
11650
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11651
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11652
- ] })
11653
- }
11654
- ),
11655
- /* @__PURE__ */ jsxRuntime.jsx(
11656
- Form$2.Field,
11657
- {
11658
- control: form.control,
11659
- name: "last_name",
11660
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11661
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Last name" }),
11662
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11663
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11664
- ] })
11665
- }
11666
- )
11667
- ] }),
11668
- /* @__PURE__ */ jsxRuntime.jsx(
11669
- Form$2.Field,
11670
- {
11671
- control: form.control,
11672
- name: "company",
11673
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11674
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Company" }),
11675
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11676
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11677
- ] })
11678
- }
11679
- ),
11680
- /* @__PURE__ */ jsxRuntime.jsx(
11681
- Form$2.Field,
11682
- {
11683
- control: form.control,
11684
- name: "address_1",
11685
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11686
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Address" }),
11687
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11688
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11689
- ] })
11690
- }
11691
- ),
11692
- /* @__PURE__ */ jsxRuntime.jsx(
11693
- Form$2.Field,
11694
- {
11695
- control: form.control,
11696
- name: "address_2",
11697
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11698
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Apartment, suite, etc." }),
11699
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11700
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11701
- ] })
11702
- }
11703
- ),
11704
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
11705
- /* @__PURE__ */ jsxRuntime.jsx(
11706
- Form$2.Field,
11707
- {
11708
- control: form.control,
11709
- name: "postal_code",
11710
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11711
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Postal code" }),
11712
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11713
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11714
- ] })
11715
- }
11716
- ),
11717
- /* @__PURE__ */ jsxRuntime.jsx(
11718
- Form$2.Field,
11719
- {
11720
- control: form.control,
11721
- name: "city",
11722
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11723
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "City" }),
11724
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11725
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11726
- ] })
11727
- }
11728
- )
11729
- ] }),
11730
- /* @__PURE__ */ jsxRuntime.jsx(
11731
- Form$2.Field,
11732
- {
11733
- control: form.control,
11734
- name: "province",
11735
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11736
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Province / State" }),
11737
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11738
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11739
- ] })
11740
- }
11741
- ),
11742
- /* @__PURE__ */ jsxRuntime.jsx(
11743
- Form$2.Field,
11744
- {
11745
- control: form.control,
11746
- name: "phone",
11747
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11748
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Phone" }),
11749
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11750
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11751
- ] })
11538
+ return /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11539
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Sales Channel" }),
11540
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
11541
+ Combobox,
11542
+ {
11543
+ options: salesChannels.options,
11544
+ fetchNextPage: salesChannels.fetchNextPage,
11545
+ isFetchingNextPage: salesChannels.isFetchingNextPage,
11546
+ searchValue: salesChannels.searchValue,
11547
+ onSearchValueChange: salesChannels.onSearchValueChange,
11548
+ placeholder: "Select sales channel",
11549
+ ...field
11752
11550
  }
11753
- )
11754
- ] }) }),
11755
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
11756
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
11757
- /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
11758
- ] }) })
11759
- ]
11551
+ ) }),
11552
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11553
+ ] });
11554
+ }
11760
11555
  }
11761
- ) });
11556
+ );
11762
11557
  };
11763
- const schema$1 = addressSchema;
11558
+ const schema$2 = objectType({
11559
+ sales_channel_id: stringType().min(1)
11560
+ });
11764
11561
  const STACKED_FOCUS_MODAL_ID = "shipping-form";
11765
11562
  const Shipping = () => {
11766
11563
  var _a;
@@ -12591,7 +12388,7 @@ const TransferOwnershipForm = ({ order }) => {
12591
12388
  defaultValues: {
12592
12389
  customer_id: order.customer_id || ""
12593
12390
  },
12594
- resolver: zod.zodResolver(schema)
12391
+ resolver: zod.zodResolver(schema$1)
12595
12392
  });
12596
12393
  const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
12597
12394
  const { handleSuccess } = useRouteModal();
@@ -13041,9 +12838,212 @@ const Illustration = () => {
13041
12838
  }
13042
12839
  );
13043
12840
  };
13044
- const schema = objectType({
12841
+ const schema$1 = objectType({
13045
12842
  customer_id: stringType().min(1)
13046
12843
  });
12844
+ const ShippingAddress = () => {
12845
+ const { id } = reactRouterDom.useParams();
12846
+ const { order, isPending, isError, error } = useOrder(id, {
12847
+ fields: "+shipping_address"
12848
+ });
12849
+ if (isError) {
12850
+ throw error;
12851
+ }
12852
+ const isReady = !isPending && !!order;
12853
+ return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
12854
+ /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
12855
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Shipping Address" }) }),
12856
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit the shipping address for the draft order" }) })
12857
+ ] }),
12858
+ isReady && /* @__PURE__ */ jsxRuntime.jsx(ShippingAddressForm, { order })
12859
+ ] });
12860
+ };
12861
+ const ShippingAddressForm = ({ order }) => {
12862
+ var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
12863
+ const form = reactHookForm.useForm({
12864
+ defaultValues: {
12865
+ first_name: ((_a = order.shipping_address) == null ? void 0 : _a.first_name) ?? "",
12866
+ last_name: ((_b = order.shipping_address) == null ? void 0 : _b.last_name) ?? "",
12867
+ company: ((_c = order.shipping_address) == null ? void 0 : _c.company) ?? "",
12868
+ address_1: ((_d = order.shipping_address) == null ? void 0 : _d.address_1) ?? "",
12869
+ address_2: ((_e = order.shipping_address) == null ? void 0 : _e.address_2) ?? "",
12870
+ city: ((_f = order.shipping_address) == null ? void 0 : _f.city) ?? "",
12871
+ province: ((_g = order.shipping_address) == null ? void 0 : _g.province) ?? "",
12872
+ country_code: ((_h = order.shipping_address) == null ? void 0 : _h.country_code) ?? "",
12873
+ postal_code: ((_i = order.shipping_address) == null ? void 0 : _i.postal_code) ?? "",
12874
+ phone: ((_j = order.shipping_address) == null ? void 0 : _j.phone) ?? ""
12875
+ },
12876
+ resolver: zod.zodResolver(schema)
12877
+ });
12878
+ const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
12879
+ const { handleSuccess } = useRouteModal();
12880
+ const onSubmit = form.handleSubmit(async (data) => {
12881
+ await mutateAsync(
12882
+ {
12883
+ shipping_address: {
12884
+ first_name: data.first_name,
12885
+ last_name: data.last_name,
12886
+ company: data.company,
12887
+ address_1: data.address_1,
12888
+ address_2: data.address_2,
12889
+ city: data.city,
12890
+ province: data.province,
12891
+ country_code: data.country_code,
12892
+ postal_code: data.postal_code,
12893
+ phone: data.phone
12894
+ }
12895
+ },
12896
+ {
12897
+ onSuccess: () => {
12898
+ handleSuccess();
12899
+ },
12900
+ onError: (error) => {
12901
+ ui.toast.error(error.message);
12902
+ }
12903
+ }
12904
+ );
12905
+ });
12906
+ return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
12907
+ KeyboundForm,
12908
+ {
12909
+ className: "flex flex-1 flex-col overflow-hidden",
12910
+ onSubmit,
12911
+ children: [
12912
+ /* @__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: [
12913
+ /* @__PURE__ */ jsxRuntime.jsx(
12914
+ Form$2.Field,
12915
+ {
12916
+ control: form.control,
12917
+ name: "country_code",
12918
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12919
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Country" }),
12920
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(CountrySelect, { ...field }) }),
12921
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12922
+ ] })
12923
+ }
12924
+ ),
12925
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
12926
+ /* @__PURE__ */ jsxRuntime.jsx(
12927
+ Form$2.Field,
12928
+ {
12929
+ control: form.control,
12930
+ name: "first_name",
12931
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12932
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "First name" }),
12933
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12934
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12935
+ ] })
12936
+ }
12937
+ ),
12938
+ /* @__PURE__ */ jsxRuntime.jsx(
12939
+ Form$2.Field,
12940
+ {
12941
+ control: form.control,
12942
+ name: "last_name",
12943
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12944
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Last name" }),
12945
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12946
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12947
+ ] })
12948
+ }
12949
+ )
12950
+ ] }),
12951
+ /* @__PURE__ */ jsxRuntime.jsx(
12952
+ Form$2.Field,
12953
+ {
12954
+ control: form.control,
12955
+ name: "company",
12956
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12957
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Company" }),
12958
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12959
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12960
+ ] })
12961
+ }
12962
+ ),
12963
+ /* @__PURE__ */ jsxRuntime.jsx(
12964
+ Form$2.Field,
12965
+ {
12966
+ control: form.control,
12967
+ name: "address_1",
12968
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12969
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Address" }),
12970
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12971
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12972
+ ] })
12973
+ }
12974
+ ),
12975
+ /* @__PURE__ */ jsxRuntime.jsx(
12976
+ Form$2.Field,
12977
+ {
12978
+ control: form.control,
12979
+ name: "address_2",
12980
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12981
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Apartment, suite, etc." }),
12982
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12983
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12984
+ ] })
12985
+ }
12986
+ ),
12987
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
12988
+ /* @__PURE__ */ jsxRuntime.jsx(
12989
+ Form$2.Field,
12990
+ {
12991
+ control: form.control,
12992
+ name: "postal_code",
12993
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12994
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Postal code" }),
12995
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12996
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12997
+ ] })
12998
+ }
12999
+ ),
13000
+ /* @__PURE__ */ jsxRuntime.jsx(
13001
+ Form$2.Field,
13002
+ {
13003
+ control: form.control,
13004
+ name: "city",
13005
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
13006
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "City" }),
13007
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
13008
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
13009
+ ] })
13010
+ }
13011
+ )
13012
+ ] }),
13013
+ /* @__PURE__ */ jsxRuntime.jsx(
13014
+ Form$2.Field,
13015
+ {
13016
+ control: form.control,
13017
+ name: "province",
13018
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
13019
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Province / State" }),
13020
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
13021
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
13022
+ ] })
13023
+ }
13024
+ ),
13025
+ /* @__PURE__ */ jsxRuntime.jsx(
13026
+ Form$2.Field,
13027
+ {
13028
+ control: form.control,
13029
+ name: "phone",
13030
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
13031
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Phone" }),
13032
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
13033
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
13034
+ ] })
13035
+ }
13036
+ )
13037
+ ] }) }),
13038
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
13039
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
13040
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
13041
+ ] }) })
13042
+ ]
13043
+ }
13044
+ ) });
13045
+ };
13046
+ const schema = addressSchema;
13047
13047
  const widgetModule = { widgets: [] };
13048
13048
  const routeModule = {
13049
13049
  routes: [
@@ -13068,33 +13068,29 @@ const routeModule = {
13068
13068
  Component: BillingAddress,
13069
13069
  path: "/draft-orders/:id/billing-address"
13070
13070
  },
13071
- {
13072
- Component: CustomItems,
13073
- path: "/draft-orders/:id/custom-items"
13074
- },
13075
13071
  {
13076
13072
  Component: Email,
13077
13073
  path: "/draft-orders/:id/email"
13078
13074
  },
13079
13075
  {
13080
- Component: Items,
13081
- path: "/draft-orders/:id/items"
13076
+ Component: CustomItems,
13077
+ path: "/draft-orders/:id/custom-items"
13082
13078
  },
13083
13079
  {
13084
- Component: Promotions,
13085
- path: "/draft-orders/:id/promotions"
13080
+ Component: Items,
13081
+ path: "/draft-orders/:id/items"
13086
13082
  },
13087
13083
  {
13088
13084
  Component: Metadata,
13089
13085
  path: "/draft-orders/:id/metadata"
13090
13086
  },
13091
13087
  {
13092
- Component: SalesChannel,
13093
- path: "/draft-orders/:id/sales-channel"
13088
+ Component: Promotions,
13089
+ path: "/draft-orders/:id/promotions"
13094
13090
  },
13095
13091
  {
13096
- Component: ShippingAddress,
13097
- path: "/draft-orders/:id/shipping-address"
13092
+ Component: SalesChannel,
13093
+ path: "/draft-orders/:id/sales-channel"
13098
13094
  },
13099
13095
  {
13100
13096
  Component: Shipping,
@@ -13103,6 +13099,10 @@ const routeModule = {
13103
13099
  {
13104
13100
  Component: TransferOwnership,
13105
13101
  path: "/draft-orders/:id/transfer-ownership"
13102
+ },
13103
+ {
13104
+ Component: ShippingAddress,
13105
+ path: "/draft-orders/:id/shipping-address"
13106
13106
  }
13107
13107
  ]
13108
13108
  }