@medusajs/draft-order 3.0.0-preview-20251202150141 → 3.0.0-preview-20251202180144

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