@medusajs/draft-order 3.0.0-preview-20251214150138 → 3.0.0-preview-20251214210141

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.
@@ -10825,173 +10825,450 @@ const customItemSchema = objectType({
10825
10825
  quantity: numberType(),
10826
10826
  unit_price: unionType([numberType(), stringType()])
10827
10827
  });
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 = () => {
10873
- const { id } = reactRouterDom.useParams();
10874
- const { order, isPending, isError, error } = useOrder(id, {
10875
- fields: "metadata"
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
10876
10845
  });
10877
- if (isError) {
10878
- throw error;
10846
+ return { ...data, ...rest };
10847
+ };
10848
+ const Promotions = () => {
10849
+ 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;
10879
10859
  }
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 })
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 })
10887
10864
  ] });
10888
10865
  };
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 }) => {
10866
+ const PromotionForm = ({ preview }) => {
10867
+ const { items, shipping_methods } = preview;
10868
+ const [isSubmitting, setIsSubmitting] = React.useState(false);
10869
+ const [comboboxValue, setComboboxValue] = React.useState("");
10892
10870
  const { handleSuccess } = useRouteModal();
10893
- const hasUneditableRows = getHasUneditableRows(metadata);
10894
- const { mutateAsync, isPending } = useUpdateDraftOrder(orderId);
10895
- const form = reactHookForm.useForm({
10896
- defaultValues: {
10897
- metadata: getDefaultValues(metadata)
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
10898
10876
  },
10899
- resolver: zod.zodResolver(MetadataSchema)
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
+ });
10890
+ },
10891
+ getOptions: (data) => {
10892
+ return data.promotions.map((promotion) => ({
10893
+ label: promotion.code,
10894
+ value: promotion.code
10895
+ }));
10896
+ }
10900
10897
  });
10901
- const handleSubmit = form.handleSubmit(async (data) => {
10902
- const parsedData = parseValues(data);
10903
- await mutateAsync(
10898
+ const add = async (value) => {
10899
+ if (!value) {
10900
+ return;
10901
+ }
10902
+ addPromotions(
10904
10903
  {
10905
- metadata: parsedData
10904
+ promo_codes: [value]
10906
10905
  },
10907
10906
  {
10908
- onSuccess: () => {
10909
- ui.toast.success("Metadata updated");
10910
- handleSuccess();
10907
+ onError: (e) => {
10908
+ ui.toast.error(e.message);
10909
+ comboboxData.onSearchValueChange("");
10910
+ setComboboxValue("");
10911
10911
  },
10912
- onError: (error) => {
10913
- ui.toast.error(error.message);
10912
+ onSuccess: () => {
10913
+ comboboxData.onSearchValueChange("");
10914
+ setComboboxValue("");
10914
10915
  }
10915
10916
  }
10916
10917
  );
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
- });
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;
10930
10935
  }
10931
- }
10932
- function insertRow(index, position) {
10933
- insert(index + (position === "above" ? 0 : 1), {
10934
- key: "",
10935
- value: "",
10936
- disabled: false
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
+ }
10937
10946
  });
10947
+ };
10948
+ if (isError) {
10949
+ throw error;
10938
10950
  }
10939
- return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
10940
- KeyboundForm,
10941
- {
10942
- onSubmit: handleSubmit,
10943
- className: "flex flex-1 flex-col overflow-hidden",
10944
- children: [
10945
- /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Body, { className: "flex flex-1 flex-col gap-y-8 overflow-y-auto", children: [
10946
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-ui-bg-base shadow-elevation-card-rest grid grid-cols-1 divide-y rounded-lg", children: [
10947
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-ui-bg-subtle grid grid-cols-2 divide-x rounded-t-lg", children: [
10948
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "txt-compact-small-plus text-ui-fg-subtle px-2 py-1.5", children: /* @__PURE__ */ jsxRuntime.jsx("label", { id: METADATA_KEY_LABEL_ID, children: "Key" }) }),
10949
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "txt-compact-small-plus text-ui-fg-subtle px-2 py-1.5", children: /* @__PURE__ */ jsxRuntime.jsx("label", { id: METADATA_VALUE_LABEL_ID, children: "Value" }) })
10950
- ] }),
10951
- fields.map((field, index) => {
10952
- const isDisabled = field.disabled || false;
10953
- let placeholder = "-";
10954
- if (typeof field.value === "object") {
10955
- placeholder = "{ ... }";
10956
- }
10957
- if (Array.isArray(field.value)) {
10958
- placeholder = "[ ... ]";
10959
- }
10960
- return /* @__PURE__ */ jsxRuntime.jsx(
10961
- ConditionalTooltip,
10962
- {
10963
- showTooltip: isDisabled,
10964
- content: "This row is disabled because it contains non-primitive data.",
10965
- children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "group/table relative", children: [
10966
- /* @__PURE__ */ jsxRuntime.jsxs(
10967
- "div",
10968
- {
10969
- className: ui.clx("grid grid-cols-2 divide-x", {
10970
- "overflow-hidden rounded-b-lg": index === fields.length - 1
10971
- }),
10972
- children: [
10973
- /* @__PURE__ */ jsxRuntime.jsx(
10974
- Form$2.Field,
10975
- {
10976
- control: form.control,
10977
- name: `metadata.${index}.key`,
10978
- render: ({ field: field2 }) => {
10979
- return /* @__PURE__ */ jsxRuntime.jsx(Form$2.Item, { children: /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
10980
- GridInput,
10981
- {
10982
- "aria-labelledby": METADATA_KEY_LABEL_ID,
10983
- ...field2,
10984
- disabled: isDisabled,
10985
- placeholder: "Key"
10986
- }
10987
- ) }) });
10988
- }
10989
- }
10990
- ),
10991
- /* @__PURE__ */ jsxRuntime.jsx(
10992
- Form$2.Field,
10993
- {
10994
- control: form.control,
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
11214
+ });
11215
+ }
11216
+ return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
11217
+ KeyboundForm,
11218
+ {
11219
+ onSubmit: handleSubmit,
11220
+ className: "flex flex-1 flex-col overflow-hidden",
11221
+ children: [
11222
+ /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Body, { className: "flex flex-1 flex-col gap-y-8 overflow-y-auto", children: [
11223
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-ui-bg-base shadow-elevation-card-rest grid grid-cols-1 divide-y rounded-lg", children: [
11224
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-ui-bg-subtle grid grid-cols-2 divide-x rounded-t-lg", children: [
11225
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "txt-compact-small-plus text-ui-fg-subtle px-2 py-1.5", children: /* @__PURE__ */ jsxRuntime.jsx("label", { id: METADATA_KEY_LABEL_ID, children: "Key" }) }),
11226
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "txt-compact-small-plus text-ui-fg-subtle px-2 py-1.5", children: /* @__PURE__ */ jsxRuntime.jsx("label", { id: METADATA_VALUE_LABEL_ID, children: "Value" }) })
11227
+ ] }),
11228
+ fields.map((field, index) => {
11229
+ const isDisabled = field.disabled || false;
11230
+ let placeholder = "-";
11231
+ if (typeof field.value === "object") {
11232
+ placeholder = "{ ... }";
11233
+ }
11234
+ if (Array.isArray(field.value)) {
11235
+ placeholder = "[ ... ]";
11236
+ }
11237
+ return /* @__PURE__ */ jsxRuntime.jsx(
11238
+ ConditionalTooltip,
11239
+ {
11240
+ showTooltip: isDisabled,
11241
+ content: "This row is disabled because it contains non-primitive data.",
11242
+ children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "group/table relative", children: [
11243
+ /* @__PURE__ */ jsxRuntime.jsxs(
11244
+ "div",
11245
+ {
11246
+ className: ui.clx("grid grid-cols-2 divide-x", {
11247
+ "overflow-hidden rounded-b-lg": index === fields.length - 1
11248
+ }),
11249
+ children: [
11250
+ /* @__PURE__ */ jsxRuntime.jsx(
11251
+ Form$2.Field,
11252
+ {
11253
+ control: form.control,
11254
+ name: `metadata.${index}.key`,
11255
+ render: ({ field: field2 }) => {
11256
+ return /* @__PURE__ */ jsxRuntime.jsx(Form$2.Item, { children: /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
11257
+ GridInput,
11258
+ {
11259
+ "aria-labelledby": METADATA_KEY_LABEL_ID,
11260
+ ...field2,
11261
+ disabled: isDisabled,
11262
+ placeholder: "Key"
11263
+ }
11264
+ ) }) });
11265
+ }
11266
+ }
11267
+ ),
11268
+ /* @__PURE__ */ jsxRuntime.jsx(
11269
+ Form$2.Field,
11270
+ {
11271
+ control: form.control,
10995
11272
  name: `metadata.${index}.value`,
10996
11273
  render: ({ field: { value, ...field2 } }) => {
10997
11274
  return /* @__PURE__ */ jsxRuntime.jsx(Form$2.Item, { children: /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
@@ -11175,283 +11452,112 @@ function getHasUneditableRows(metadata) {
11175
11452
  (value) => !EDITABLE_TYPES.includes(typeof value)
11176
11453
  );
11177
11454
  }
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 = () => {
11455
+ const SalesChannel = () => {
11199
11456
  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(
11457
+ const { draft_order, isPending, isError, error } = useDraftOrder(
11458
+ id,
11224
11459
  {
11225
- id: promoIds
11460
+ fields: "+sales_channel_id"
11226
11461
  },
11227
11462
  {
11228
- enabled: !!promoIds.length
11463
+ enabled: !!id
11229
11464
  }
11230
11465
  );
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
11466
  if (isError) {
11299
11467
  throw error;
11300
11468
  }
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);
11469
+ const ISrEADY = !!draft_order && !isPending;
11470
+ return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
11471
+ /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
11472
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Sales Channel" }) }),
11473
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Update which sales channel the draft order is associated with" }) })
11474
+ ] }),
11475
+ ISrEADY && /* @__PURE__ */ jsxRuntime.jsx(SalesChannelForm, { order: draft_order })
11476
+ ] });
11432
11477
  };
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);
11478
+ const SalesChannelForm = ({ order }) => {
11479
+ const form = reactHookForm.useForm({
11480
+ defaultValues: {
11481
+ sales_channel_id: order.sales_channel_id || ""
11482
+ },
11483
+ resolver: zod.zodResolver(schema$2)
11484
+ });
11485
+ const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
11486
+ const { handleSuccess } = useRouteModal();
11487
+ const onSubmit = form.handleSubmit(async (data) => {
11488
+ await mutateAsync(
11489
+ {
11490
+ sales_channel_id: data.sales_channel_id
11491
+ },
11492
+ {
11493
+ onSuccess: () => {
11494
+ ui.toast.success("Sales channel updated");
11495
+ handleSuccess();
11496
+ },
11497
+ onError: (error) => {
11498
+ ui.toast.error(error.message);
11440
11499
  }
11441
11500
  }
11501
+ );
11502
+ });
11503
+ return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
11504
+ KeyboundForm,
11505
+ {
11506
+ className: "flex flex-1 flex-col overflow-hidden",
11507
+ onSubmit,
11508
+ children: [
11509
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsx(SalesChannelField, { control: form.control, order }) }),
11510
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
11511
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
11512
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
11513
+ ] }) })
11514
+ ]
11442
11515
  }
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
- }
11516
+ ) });
11517
+ };
11518
+ const SalesChannelField = ({ control, order }) => {
11519
+ const salesChannels = useComboboxData({
11520
+ queryFn: async (params) => {
11521
+ return await sdk.admin.salesChannel.list(params);
11522
+ },
11523
+ queryKey: ["sales-channels"],
11524
+ getOptions: (data) => {
11525
+ return data.sales_channels.map((salesChannel) => ({
11526
+ label: salesChannel.name,
11527
+ value: salesChannel.id
11528
+ }));
11529
+ },
11530
+ defaultValue: order.sales_channel_id || void 0
11531
+ });
11532
+ return /* @__PURE__ */ jsxRuntime.jsx(
11533
+ Form$2.Field,
11534
+ {
11535
+ control,
11536
+ name: "sales_channel_id",
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
+ ] });
11450
11554
  }
11451
11555
  }
11452
- }
11453
- return Array.from(promotionIds);
11454
- }
11556
+ );
11557
+ };
11558
+ const schema$2 = objectType({
11559
+ sales_channel_id: stringType().min(1)
11560
+ });
11455
11561
  const STACKED_FOCUS_MODAL_ID = "shipping-form";
11456
11562
  const Shipping = () => {
11457
11563
  var _a;
@@ -12170,404 +12276,95 @@ const ShippingOptionField = ({
12170
12276
  const shippingOptions = useComboboxData({
12171
12277
  queryKey: ["shipping_options", locationId, shippingProfileId],
12172
12278
  queryFn: async (params) => {
12173
- return await sdk.admin.shippingOption.list({
12174
- ...params,
12175
- stock_location_id: locationId,
12176
- shipping_profile_id: shippingProfileId
12177
- });
12178
- },
12179
- getOptions: (data) => {
12180
- return data.shipping_options.map((option) => {
12181
- var _a2;
12182
- if ((_a2 = option.rules) == null ? void 0 : _a2.find(
12183
- (r) => r.attribute === "is_return" && r.value === "true"
12184
- )) {
12185
- return void 0;
12186
- }
12187
- return {
12188
- label: option.name,
12189
- value: option.id
12190
- };
12191
- }).filter(Boolean);
12192
- },
12193
- enabled: !!locationId && !!shippingProfileId,
12194
- defaultValue: ((_a = preview.shipping_methods[0]) == null ? void 0 : _a.shipping_option_id) || void 0
12195
- });
12196
- const tooltipContent = !locationId && !shippingProfileId ? "Choose a location and shipping profile first." : !locationId ? "Choose a location first." : "Choose a shipping profile first.";
12197
- return /* @__PURE__ */ jsxRuntime.jsx(
12198
- Form$2.Field,
12199
- {
12200
- control,
12201
- name: "shipping_option_id",
12202
- render: ({ field }) => {
12203
- return /* @__PURE__ */ jsxRuntime.jsx(Form$2.Item, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-x-3", children: [
12204
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col", children: [
12205
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Shipping option" }),
12206
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Hint, { children: "Choose the shipping option to use." })
12207
- ] }),
12208
- /* @__PURE__ */ jsxRuntime.jsx(
12209
- ConditionalTooltip,
12210
- {
12211
- content: tooltipContent,
12212
- showTooltip: !locationId || !shippingProfileId,
12213
- children: /* @__PURE__ */ jsxRuntime.jsx("div", { children: /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
12214
- Combobox,
12215
- {
12216
- options: shippingOptions.options,
12217
- fetchNextPage: shippingOptions.fetchNextPage,
12218
- isFetchingNextPage: shippingOptions.isFetchingNextPage,
12219
- searchValue: shippingOptions.searchValue,
12220
- onSearchValueChange: shippingOptions.onSearchValueChange,
12221
- placeholder: "Select shipping option",
12222
- ...field,
12223
- disabled: !locationId || !shippingProfileId
12224
- }
12225
- ) }) })
12226
- }
12227
- )
12228
- ] }) });
12229
- }
12230
- }
12231
- );
12232
- };
12233
- const CustomAmountField = ({
12234
- control,
12235
- currencyCode
12236
- }) => {
12237
- return /* @__PURE__ */ jsxRuntime.jsx(
12238
- Form$2.Field,
12239
- {
12240
- control,
12241
- name: "custom_amount",
12242
- render: ({ field: { onChange, ...field } }) => {
12243
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-x-3", children: [
12244
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col", children: [
12245
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Custom amount" }),
12246
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Hint, { children: "Set a custom amount for the shipping option." })
12247
- ] }),
12248
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
12249
- ui.CurrencyInput,
12250
- {
12251
- ...field,
12252
- onValueChange: (value) => onChange(value),
12253
- symbol: getNativeSymbol(currencyCode),
12254
- code: currencyCode
12255
- }
12256
- ) })
12257
- ] });
12258
- }
12259
- }
12260
- );
12261
- };
12262
- const SalesChannel = () => {
12263
- const { id } = reactRouterDom.useParams();
12264
- const { draft_order, isPending, isError, error } = useDraftOrder(
12265
- id,
12266
- {
12267
- fields: "+sales_channel_id"
12268
- },
12269
- {
12270
- enabled: !!id
12271
- }
12272
- );
12273
- if (isError) {
12274
- throw error;
12275
- }
12276
- const ISrEADY = !!draft_order && !isPending;
12277
- return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
12278
- /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
12279
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Sales Channel" }) }),
12280
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Update which sales channel the draft order is associated with" }) })
12281
- ] }),
12282
- ISrEADY && /* @__PURE__ */ jsxRuntime.jsx(SalesChannelForm, { order: draft_order })
12283
- ] });
12284
- };
12285
- const SalesChannelForm = ({ order }) => {
12286
- const form = reactHookForm.useForm({
12287
- defaultValues: {
12288
- sales_channel_id: order.sales_channel_id || ""
12289
- },
12290
- resolver: zod.zodResolver(schema$2)
12291
- });
12292
- const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
12293
- const { handleSuccess } = useRouteModal();
12294
- const onSubmit = form.handleSubmit(async (data) => {
12295
- await mutateAsync(
12296
- {
12297
- sales_channel_id: data.sales_channel_id
12298
- },
12299
- {
12300
- onSuccess: () => {
12301
- ui.toast.success("Sales channel updated");
12302
- handleSuccess();
12303
- },
12304
- onError: (error) => {
12305
- ui.toast.error(error.message);
12306
- }
12307
- }
12308
- );
12309
- });
12310
- return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
12311
- KeyboundForm,
12312
- {
12313
- className: "flex flex-1 flex-col overflow-hidden",
12314
- onSubmit,
12315
- children: [
12316
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsx(SalesChannelField, { control: form.control, order }) }),
12317
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
12318
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
12319
- /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
12320
- ] }) })
12321
- ]
12322
- }
12323
- ) });
12324
- };
12325
- const SalesChannelField = ({ control, order }) => {
12326
- const salesChannels = useComboboxData({
12327
- queryFn: async (params) => {
12328
- return await sdk.admin.salesChannel.list(params);
12279
+ return await sdk.admin.shippingOption.list({
12280
+ ...params,
12281
+ stock_location_id: locationId,
12282
+ shipping_profile_id: shippingProfileId
12283
+ });
12329
12284
  },
12330
- queryKey: ["sales-channels"],
12331
12285
  getOptions: (data) => {
12332
- return data.sales_channels.map((salesChannel) => ({
12333
- label: salesChannel.name,
12334
- value: salesChannel.id
12335
- }));
12286
+ return data.shipping_options.map((option) => {
12287
+ var _a2;
12288
+ if ((_a2 = option.rules) == null ? void 0 : _a2.find(
12289
+ (r) => r.attribute === "is_return" && r.value === "true"
12290
+ )) {
12291
+ return void 0;
12292
+ }
12293
+ return {
12294
+ label: option.name,
12295
+ value: option.id
12296
+ };
12297
+ }).filter(Boolean);
12336
12298
  },
12337
- defaultValue: order.sales_channel_id || void 0
12299
+ enabled: !!locationId && !!shippingProfileId,
12300
+ defaultValue: ((_a = preview.shipping_methods[0]) == null ? void 0 : _a.shipping_option_id) || void 0
12338
12301
  });
12302
+ const tooltipContent = !locationId && !shippingProfileId ? "Choose a location and shipping profile first." : !locationId ? "Choose a location first." : "Choose a shipping profile first.";
12339
12303
  return /* @__PURE__ */ jsxRuntime.jsx(
12340
12304
  Form$2.Field,
12341
12305
  {
12342
12306
  control,
12343
- name: "sales_channel_id",
12307
+ name: "shipping_option_id",
12344
12308
  render: ({ field }) => {
12345
- return /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12346
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Sales Channel" }),
12347
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
12348
- Combobox,
12309
+ return /* @__PURE__ */ jsxRuntime.jsx(Form$2.Item, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-x-3", children: [
12310
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col", children: [
12311
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Shipping option" }),
12312
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Hint, { children: "Choose the shipping option to use." })
12313
+ ] }),
12314
+ /* @__PURE__ */ jsxRuntime.jsx(
12315
+ ConditionalTooltip,
12349
12316
  {
12350
- options: salesChannels.options,
12351
- fetchNextPage: salesChannels.fetchNextPage,
12352
- isFetchingNextPage: salesChannels.isFetchingNextPage,
12353
- searchValue: salesChannels.searchValue,
12354
- onSearchValueChange: salesChannels.onSearchValueChange,
12355
- placeholder: "Select sales channel",
12356
- ...field
12317
+ content: tooltipContent,
12318
+ showTooltip: !locationId || !shippingProfileId,
12319
+ children: /* @__PURE__ */ jsxRuntime.jsx("div", { children: /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
12320
+ Combobox,
12321
+ {
12322
+ options: shippingOptions.options,
12323
+ fetchNextPage: shippingOptions.fetchNextPage,
12324
+ isFetchingNextPage: shippingOptions.isFetchingNextPage,
12325
+ searchValue: shippingOptions.searchValue,
12326
+ onSearchValueChange: shippingOptions.onSearchValueChange,
12327
+ placeholder: "Select shipping option",
12328
+ ...field,
12329
+ disabled: !locationId || !shippingProfileId
12330
+ }
12331
+ ) }) })
12357
12332
  }
12358
- ) }),
12359
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12360
- ] });
12333
+ )
12334
+ ] }) });
12361
12335
  }
12362
12336
  }
12363
12337
  );
12364
12338
  };
12365
- const schema$2 = objectType({
12366
- sales_channel_id: stringType().min(1)
12367
- });
12368
- const ShippingAddress = () => {
12369
- const { id } = reactRouterDom.useParams();
12370
- const { order, isPending, isError, error } = useOrder(id, {
12371
- fields: "+shipping_address"
12372
- });
12373
- if (isError) {
12374
- throw error;
12375
- }
12376
- const isReady = !isPending && !!order;
12377
- return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
12378
- /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
12379
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Shipping Address" }) }),
12380
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit the shipping address for the draft order" }) })
12381
- ] }),
12382
- isReady && /* @__PURE__ */ jsxRuntime.jsx(ShippingAddressForm, { order })
12383
- ] });
12384
- };
12385
- const ShippingAddressForm = ({ order }) => {
12386
- var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
12387
- const form = reactHookForm.useForm({
12388
- defaultValues: {
12389
- first_name: ((_a = order.shipping_address) == null ? void 0 : _a.first_name) ?? "",
12390
- last_name: ((_b = order.shipping_address) == null ? void 0 : _b.last_name) ?? "",
12391
- company: ((_c = order.shipping_address) == null ? void 0 : _c.company) ?? "",
12392
- address_1: ((_d = order.shipping_address) == null ? void 0 : _d.address_1) ?? "",
12393
- address_2: ((_e = order.shipping_address) == null ? void 0 : _e.address_2) ?? "",
12394
- city: ((_f = order.shipping_address) == null ? void 0 : _f.city) ?? "",
12395
- province: ((_g = order.shipping_address) == null ? void 0 : _g.province) ?? "",
12396
- country_code: ((_h = order.shipping_address) == null ? void 0 : _h.country_code) ?? "",
12397
- postal_code: ((_i = order.shipping_address) == null ? void 0 : _i.postal_code) ?? "",
12398
- phone: ((_j = order.shipping_address) == null ? void 0 : _j.phone) ?? ""
12399
- },
12400
- resolver: zod.zodResolver(schema$1)
12401
- });
12402
- const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
12403
- const { handleSuccess } = useRouteModal();
12404
- const onSubmit = form.handleSubmit(async (data) => {
12405
- await mutateAsync(
12406
- {
12407
- shipping_address: {
12408
- first_name: data.first_name,
12409
- last_name: data.last_name,
12410
- company: data.company,
12411
- address_1: data.address_1,
12412
- address_2: data.address_2,
12413
- city: data.city,
12414
- province: data.province,
12415
- country_code: data.country_code,
12416
- postal_code: data.postal_code,
12417
- phone: data.phone
12418
- }
12419
- },
12420
- {
12421
- onSuccess: () => {
12422
- handleSuccess();
12423
- },
12424
- onError: (error) => {
12425
- ui.toast.error(error.message);
12426
- }
12427
- }
12428
- );
12429
- });
12430
- return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
12431
- KeyboundForm,
12432
- {
12433
- className: "flex flex-1 flex-col overflow-hidden",
12434
- onSubmit,
12435
- children: [
12436
- /* @__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: [
12437
- /* @__PURE__ */ jsxRuntime.jsx(
12438
- Form$2.Field,
12439
- {
12440
- control: form.control,
12441
- name: "country_code",
12442
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12443
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Country" }),
12444
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(CountrySelect, { ...field }) }),
12445
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12446
- ] })
12447
- }
12448
- ),
12449
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
12450
- /* @__PURE__ */ jsxRuntime.jsx(
12451
- Form$2.Field,
12452
- {
12453
- control: form.control,
12454
- name: "first_name",
12455
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12456
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "First name" }),
12457
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12458
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12459
- ] })
12460
- }
12461
- ),
12462
- /* @__PURE__ */ jsxRuntime.jsx(
12463
- Form$2.Field,
12464
- {
12465
- control: form.control,
12466
- name: "last_name",
12467
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12468
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Last name" }),
12469
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12470
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12471
- ] })
12472
- }
12473
- )
12474
- ] }),
12475
- /* @__PURE__ */ jsxRuntime.jsx(
12476
- Form$2.Field,
12477
- {
12478
- control: form.control,
12479
- name: "company",
12480
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12481
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Company" }),
12482
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12483
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12484
- ] })
12485
- }
12486
- ),
12487
- /* @__PURE__ */ jsxRuntime.jsx(
12488
- Form$2.Field,
12489
- {
12490
- control: form.control,
12491
- name: "address_1",
12492
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12493
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Address" }),
12494
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12495
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12496
- ] })
12497
- }
12498
- ),
12499
- /* @__PURE__ */ jsxRuntime.jsx(
12500
- Form$2.Field,
12501
- {
12502
- control: form.control,
12503
- name: "address_2",
12504
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12505
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Apartment, suite, etc." }),
12506
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12507
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12508
- ] })
12509
- }
12510
- ),
12511
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
12512
- /* @__PURE__ */ jsxRuntime.jsx(
12513
- Form$2.Field,
12514
- {
12515
- control: form.control,
12516
- name: "postal_code",
12517
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12518
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Postal code" }),
12519
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12520
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12521
- ] })
12522
- }
12523
- ),
12524
- /* @__PURE__ */ jsxRuntime.jsx(
12525
- Form$2.Field,
12526
- {
12527
- control: form.control,
12528
- name: "city",
12529
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12530
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "City" }),
12531
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12532
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12533
- ] })
12534
- }
12535
- )
12536
- ] }),
12537
- /* @__PURE__ */ jsxRuntime.jsx(
12538
- Form$2.Field,
12539
- {
12540
- control: form.control,
12541
- name: "province",
12542
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12543
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Province / State" }),
12544
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12545
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12546
- ] })
12547
- }
12548
- ),
12549
- /* @__PURE__ */ jsxRuntime.jsx(
12550
- Form$2.Field,
12339
+ const CustomAmountField = ({
12340
+ control,
12341
+ currencyCode
12342
+ }) => {
12343
+ return /* @__PURE__ */ jsxRuntime.jsx(
12344
+ Form$2.Field,
12345
+ {
12346
+ control,
12347
+ name: "custom_amount",
12348
+ render: ({ field: { onChange, ...field } }) => {
12349
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-x-3", children: [
12350
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col", children: [
12351
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Custom amount" }),
12352
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Hint, { children: "Set a custom amount for the shipping option." })
12353
+ ] }),
12354
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
12355
+ ui.CurrencyInput,
12551
12356
  {
12552
- control: form.control,
12553
- name: "phone",
12554
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12555
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Phone" }),
12556
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12557
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12558
- ] })
12357
+ ...field,
12358
+ onValueChange: (value) => onChange(value),
12359
+ symbol: getNativeSymbol(currencyCode),
12360
+ code: currencyCode
12559
12361
  }
12560
- )
12561
- ] }) }),
12562
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
12563
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
12564
- /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
12565
- ] }) })
12566
- ]
12362
+ ) })
12363
+ ] });
12364
+ }
12567
12365
  }
12568
- ) });
12366
+ );
12569
12367
  };
12570
- const schema$1 = addressSchema;
12571
12368
  const TransferOwnership = () => {
12572
12369
  const { id } = reactRouterDom.useParams();
12573
12370
  const { draft_order, isPending, isError, error } = useDraftOrder(id, {
@@ -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: [
@@ -13080,29 +13080,29 @@ const routeModule = {
13080
13080
  Component: Items,
13081
13081
  path: "/draft-orders/:id/items"
13082
13082
  },
13083
- {
13084
- Component: Metadata,
13085
- path: "/draft-orders/:id/metadata"
13086
- },
13087
13083
  {
13088
13084
  Component: Promotions,
13089
13085
  path: "/draft-orders/:id/promotions"
13090
13086
  },
13091
13087
  {
13092
- Component: Shipping,
13093
- path: "/draft-orders/:id/shipping"
13088
+ Component: Metadata,
13089
+ path: "/draft-orders/:id/metadata"
13094
13090
  },
13095
13091
  {
13096
13092
  Component: SalesChannel,
13097
13093
  path: "/draft-orders/:id/sales-channel"
13098
13094
  },
13099
13095
  {
13100
- Component: ShippingAddress,
13101
- path: "/draft-orders/:id/shipping-address"
13096
+ Component: Shipping,
13097
+ path: "/draft-orders/:id/shipping"
13102
13098
  },
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
  }