@medusajs/draft-order 2.10.4-preview-20250927210155 → 2.10.4-preview-20250928000328

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.
@@ -9757,27 +9757,6 @@ const BillingAddressForm = ({ order }) => {
9757
9757
  ) });
9758
9758
  };
9759
9759
  const schema$5 = addressSchema;
9760
- const CustomItems = () => {
9761
- return /* @__PURE__ */ jsxs(RouteDrawer, { children: [
9762
- /* @__PURE__ */ jsx(RouteDrawer.Header, { children: /* @__PURE__ */ jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Edit Custom Items" }) }) }),
9763
- /* @__PURE__ */ jsx(CustomItemsForm, {})
9764
- ] });
9765
- };
9766
- const CustomItemsForm = () => {
9767
- const form = useForm({
9768
- resolver: zodResolver(schema$4)
9769
- });
9770
- return /* @__PURE__ */ jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxs(KeyboundForm, { className: "flex flex-1 flex-col", children: [
9771
- /* @__PURE__ */ jsx(RouteDrawer.Body, {}),
9772
- /* @__PURE__ */ jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex justify-end gap-2", children: [
9773
- /* @__PURE__ */ jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
9774
- /* @__PURE__ */ jsx(Button, { size: "small", type: "submit", children: "Save" })
9775
- ] }) })
9776
- ] }) });
9777
- };
9778
- const schema$4 = objectType({
9779
- email: stringType().email()
9780
- });
9781
9760
  const Email = () => {
9782
9761
  const { id } = useParams();
9783
9762
  const { order, isPending, isError, error } = useOrder(id, {
@@ -9800,7 +9779,7 @@ const EmailForm = ({ order }) => {
9800
9779
  defaultValues: {
9801
9780
  email: order.email ?? ""
9802
9781
  },
9803
- resolver: zodResolver(schema$3)
9782
+ resolver: zodResolver(schema$4)
9804
9783
  });
9805
9784
  const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
9806
9785
  const { handleSuccess } = useRouteModal();
@@ -9843,7 +9822,7 @@ const EmailForm = ({ order }) => {
9843
9822
  }
9844
9823
  ) });
9845
9824
  };
9846
- const schema$3 = objectType({
9825
+ const schema$4 = objectType({
9847
9826
  email: stringType().email()
9848
9827
  });
9849
9828
  const NumberInput = forwardRef(
@@ -10820,392 +10799,136 @@ const customItemSchema = objectType({
10820
10799
  quantity: numberType(),
10821
10800
  unit_price: unionType([numberType(), stringType()])
10822
10801
  });
10823
- const PROMOTION_QUERY_KEY = "promotions";
10824
- const promotionsQueryKeys = {
10825
- list: (query2) => [
10826
- PROMOTION_QUERY_KEY,
10827
- query2 ? query2 : void 0
10828
- ],
10829
- detail: (id, query2) => [
10830
- PROMOTION_QUERY_KEY,
10831
- id,
10832
- query2 ? query2 : void 0
10833
- ]
10802
+ const CustomItems = () => {
10803
+ return /* @__PURE__ */ jsxs(RouteDrawer, { children: [
10804
+ /* @__PURE__ */ jsx(RouteDrawer.Header, { children: /* @__PURE__ */ jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Edit Custom Items" }) }) }),
10805
+ /* @__PURE__ */ jsx(CustomItemsForm, {})
10806
+ ] });
10834
10807
  };
10835
- const usePromotions = (query2, options) => {
10836
- const { data, ...rest } = useQuery({
10837
- queryKey: promotionsQueryKeys.list(query2),
10838
- queryFn: async () => sdk.admin.promotion.list(query2),
10839
- ...options
10808
+ const CustomItemsForm = () => {
10809
+ const form = useForm({
10810
+ resolver: zodResolver(schema$3)
10840
10811
  });
10841
- return { ...data, ...rest };
10812
+ return /* @__PURE__ */ jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxs(KeyboundForm, { className: "flex flex-1 flex-col", children: [
10813
+ /* @__PURE__ */ jsx(RouteDrawer.Body, {}),
10814
+ /* @__PURE__ */ jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex justify-end gap-2", children: [
10815
+ /* @__PURE__ */ jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
10816
+ /* @__PURE__ */ jsx(Button, { size: "small", type: "submit", children: "Save" })
10817
+ ] }) })
10818
+ ] }) });
10842
10819
  };
10843
- const Promotions = () => {
10820
+ const schema$3 = objectType({
10821
+ email: stringType().email()
10822
+ });
10823
+ const InlineTip = forwardRef(
10824
+ ({ variant = "tip", label, className, children, ...props }, ref) => {
10825
+ const labelValue = label || (variant === "warning" ? "Warning" : "Tip");
10826
+ return /* @__PURE__ */ jsxs(
10827
+ "div",
10828
+ {
10829
+ ref,
10830
+ className: clx(
10831
+ "bg-ui-bg-component txt-small text-ui-fg-subtle grid grid-cols-[4px_1fr] items-start gap-3 rounded-lg border p-3",
10832
+ className
10833
+ ),
10834
+ ...props,
10835
+ children: [
10836
+ /* @__PURE__ */ jsx(
10837
+ "div",
10838
+ {
10839
+ role: "presentation",
10840
+ className: clx("w-4px bg-ui-tag-neutral-icon h-full rounded-full", {
10841
+ "bg-ui-tag-orange-icon": variant === "warning"
10842
+ })
10843
+ }
10844
+ ),
10845
+ /* @__PURE__ */ jsxs("div", { className: "text-pretty", children: [
10846
+ /* @__PURE__ */ jsxs("strong", { className: "txt-small-plus text-ui-fg-base", children: [
10847
+ labelValue,
10848
+ ":"
10849
+ ] }),
10850
+ " ",
10851
+ children
10852
+ ] })
10853
+ ]
10854
+ }
10855
+ );
10856
+ }
10857
+ );
10858
+ InlineTip.displayName = "InlineTip";
10859
+ const MetadataFieldSchema = objectType({
10860
+ key: stringType(),
10861
+ disabled: booleanType().optional(),
10862
+ value: anyType()
10863
+ });
10864
+ const MetadataSchema = objectType({
10865
+ metadata: arrayType(MetadataFieldSchema)
10866
+ });
10867
+ const Metadata = () => {
10844
10868
  const { id } = useParams();
10845
- const {
10846
- order: preview,
10847
- isError: isPreviewError,
10848
- error: previewError
10849
- } = useOrderPreview(id, void 0);
10850
- useInitiateOrderEdit({ preview });
10851
- const { onCancel } = useCancelOrderEdit({ preview });
10852
- if (isPreviewError) {
10853
- throw previewError;
10869
+ const { order, isPending, isError, error } = useOrder(id, {
10870
+ fields: "metadata"
10871
+ });
10872
+ if (isError) {
10873
+ throw error;
10854
10874
  }
10855
- const isReady = !!preview;
10856
- return /* @__PURE__ */ jsxs(RouteDrawer, { onClose: onCancel, children: [
10857
- /* @__PURE__ */ jsx(RouteDrawer.Header, { children: /* @__PURE__ */ jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Edit Promotions" }) }) }),
10858
- isReady && /* @__PURE__ */ jsx(PromotionForm, { preview })
10875
+ const isReady = !isPending && !!order;
10876
+ return /* @__PURE__ */ jsxs(RouteDrawer, { children: [
10877
+ /* @__PURE__ */ jsxs(RouteDrawer.Header, { children: [
10878
+ /* @__PURE__ */ jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Metadata" }) }),
10879
+ /* @__PURE__ */ jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Add metadata to the draft order." }) })
10880
+ ] }),
10881
+ !isReady ? /* @__PURE__ */ jsx(PlaceholderInner, {}) : /* @__PURE__ */ jsx(MetadataForm, { orderId: id, metadata: order == null ? void 0 : order.metadata })
10859
10882
  ] });
10860
10883
  };
10861
- const PromotionForm = ({ preview }) => {
10862
- const { items, shipping_methods } = preview;
10863
- const [isSubmitting, setIsSubmitting] = useState(false);
10864
- const [comboboxValue, setComboboxValue] = useState("");
10884
+ const METADATA_KEY_LABEL_ID = "metadata-form-key-label";
10885
+ const METADATA_VALUE_LABEL_ID = "metadata-form-value-label";
10886
+ const MetadataForm = ({ orderId, metadata }) => {
10865
10887
  const { handleSuccess } = useRouteModal();
10866
- const { mutateAsync: addPromotions, isPending: isAddingPromotions } = useDraftOrderAddPromotions(preview.id);
10867
- const promoIds = getPromotionIds(items, shipping_methods);
10868
- const { promotions, isPending, isError, error } = usePromotions(
10869
- {
10870
- id: promoIds
10871
- },
10872
- {
10873
- enabled: !!promoIds.length
10874
- }
10875
- );
10876
- const comboboxData = useComboboxData({
10877
- queryKey: ["promotions", "combobox", promoIds],
10878
- queryFn: async (params) => {
10879
- return await sdk.admin.promotion.list({
10880
- ...params,
10881
- id: {
10882
- $nin: promoIds
10883
- }
10884
- });
10888
+ const hasUneditableRows = getHasUneditableRows(metadata);
10889
+ const { mutateAsync, isPending } = useUpdateDraftOrder(orderId);
10890
+ const form = useForm({
10891
+ defaultValues: {
10892
+ metadata: getDefaultValues(metadata)
10885
10893
  },
10886
- getOptions: (data) => {
10887
- return data.promotions.map((promotion) => ({
10888
- label: promotion.code,
10889
- value: promotion.code
10890
- }));
10891
- }
10894
+ resolver: zodResolver(MetadataSchema)
10892
10895
  });
10893
- const add = async (value) => {
10894
- if (!value) {
10895
- return;
10896
- }
10897
- addPromotions(
10896
+ const handleSubmit = form.handleSubmit(async (data) => {
10897
+ const parsedData = parseValues(data);
10898
+ await mutateAsync(
10898
10899
  {
10899
- promo_codes: [value]
10900
+ metadata: parsedData
10900
10901
  },
10901
10902
  {
10902
- onError: (e) => {
10903
- toast.error(e.message);
10904
- comboboxData.onSearchValueChange("");
10905
- setComboboxValue("");
10906
- },
10907
10903
  onSuccess: () => {
10908
- comboboxData.onSearchValueChange("");
10909
- setComboboxValue("");
10904
+ toast.success("Metadata updated");
10905
+ handleSuccess();
10906
+ },
10907
+ onError: (error) => {
10908
+ toast.error(error.message);
10910
10909
  }
10911
10910
  }
10912
10911
  );
10913
- };
10914
- const { mutateAsync: confirmOrderEdit } = useDraftOrderConfirmEdit(preview.id);
10915
- const { mutateAsync: requestOrderEdit } = useOrderEditRequest(preview.id);
10916
- const onSubmit = async () => {
10917
- setIsSubmitting(true);
10918
- let requestSucceeded = false;
10919
- await requestOrderEdit(void 0, {
10920
- onError: (e) => {
10921
- toast.error(e.message);
10922
- },
10923
- onSuccess: () => {
10924
- requestSucceeded = true;
10925
- }
10926
- });
10927
- if (!requestSucceeded) {
10928
- setIsSubmitting(false);
10929
- return;
10912
+ });
10913
+ const { fields, insert, remove } = useFieldArray({
10914
+ control: form.control,
10915
+ name: "metadata"
10916
+ });
10917
+ function deleteRow(index) {
10918
+ remove(index);
10919
+ if (fields.length === 1) {
10920
+ insert(0, {
10921
+ key: "",
10922
+ value: "",
10923
+ disabled: false
10924
+ });
10930
10925
  }
10931
- await confirmOrderEdit(void 0, {
10932
- onError: (e) => {
10933
- toast.error(e.message);
10934
- },
10935
- onSuccess: () => {
10936
- handleSuccess();
10937
- },
10938
- onSettled: () => {
10939
- setIsSubmitting(false);
10940
- }
10941
- });
10942
- };
10943
- if (isError) {
10944
- throw error;
10945
- }
10946
- return /* @__PURE__ */ jsxs(KeyboundForm, { className: "flex flex-1 flex-col", onSubmit, children: [
10947
- /* @__PURE__ */ jsx(RouteDrawer.Body, { children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-4", children: [
10948
- /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-3", children: [
10949
- /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
10950
- /* @__PURE__ */ jsx(Label$1, { size: "small", weight: "plus", htmlFor: "promotion-combobox", children: "Apply promotions" }),
10951
- /* @__PURE__ */ jsx(Hint$1, { id: "promotion-combobox-hint", children: "Manage promotions that should be applied to the order." })
10952
- ] }),
10953
- /* @__PURE__ */ jsx(
10954
- Combobox,
10955
- {
10956
- id: "promotion-combobox",
10957
- "aria-describedby": "promotion-combobox-hint",
10958
- isFetchingNextPage: comboboxData.isFetchingNextPage,
10959
- fetchNextPage: comboboxData.fetchNextPage,
10960
- options: comboboxData.options,
10961
- onSearchValueChange: comboboxData.onSearchValueChange,
10962
- searchValue: comboboxData.searchValue,
10963
- disabled: comboboxData.disabled || isAddingPromotions,
10964
- onChange: add,
10965
- value: comboboxValue
10966
- }
10967
- )
10968
- ] }),
10969
- /* @__PURE__ */ jsx(Divider, { variant: "dashed" }),
10970
- /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-2", children: promotions == null ? void 0 : promotions.map((promotion) => /* @__PURE__ */ jsx(
10971
- PromotionItem,
10972
- {
10973
- promotion,
10974
- orderId: preview.id,
10975
- isLoading: isPending
10976
- },
10977
- promotion.id
10978
- )) })
10979
- ] }) }),
10980
- /* @__PURE__ */ jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex justify-end gap-2", children: [
10981
- /* @__PURE__ */ jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
10982
- /* @__PURE__ */ jsx(
10983
- Button,
10984
- {
10985
- size: "small",
10986
- type: "submit",
10987
- isLoading: isSubmitting || isAddingPromotions,
10988
- children: "Save"
10989
- }
10990
- )
10991
- ] }) })
10992
- ] });
10993
- };
10994
- const PromotionItem = ({
10995
- promotion,
10996
- orderId,
10997
- isLoading
10998
- }) => {
10999
- var _a;
11000
- const { mutateAsync: removePromotions, isPending } = useDraftOrderRemovePromotions(orderId);
11001
- const onRemove = async () => {
11002
- removePromotions(
11003
- {
11004
- promo_codes: [promotion.code]
11005
- },
11006
- {
11007
- onError: (e) => {
11008
- toast.error(e.message);
11009
- }
11010
- }
11011
- );
11012
- };
11013
- const displayValue = getDisplayValue(promotion);
11014
- return /* @__PURE__ */ jsxs(
11015
- "div",
11016
- {
11017
- className: clx(
11018
- "bg-ui-bg-component shadow-elevation-card-rest flex items-center justify-between rounded-lg px-3 py-2",
11019
- {
11020
- "animate-pulse": isLoading
11021
- }
11022
- ),
11023
- children: [
11024
- /* @__PURE__ */ jsxs("div", { children: [
11025
- /* @__PURE__ */ jsx(Text, { size: "small", weight: "plus", leading: "compact", children: promotion.code }),
11026
- /* @__PURE__ */ jsxs("div", { className: "text-ui-fg-subtle flex items-center gap-1.5", children: [
11027
- displayValue && /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1.5", children: [
11028
- /* @__PURE__ */ jsx(Text, { size: "small", leading: "compact", children: displayValue }),
11029
- /* @__PURE__ */ jsx(Text, { size: "small", leading: "compact", children: "·" })
11030
- ] }),
11031
- /* @__PURE__ */ jsx(Text, { size: "small", leading: "compact", className: "capitalize", children: (_a = promotion.application_method) == null ? void 0 : _a.allocation })
11032
- ] })
11033
- ] }),
11034
- /* @__PURE__ */ jsx(
11035
- IconButton,
11036
- {
11037
- size: "small",
11038
- type: "button",
11039
- variant: "transparent",
11040
- onClick: onRemove,
11041
- isLoading: isPending || isLoading,
11042
- children: /* @__PURE__ */ jsx(XMark, {})
11043
- }
11044
- )
11045
- ]
11046
- },
11047
- promotion.id
11048
- );
11049
- };
11050
- function getDisplayValue(promotion) {
11051
- var _a, _b, _c, _d;
11052
- const value = (_a = promotion.application_method) == null ? void 0 : _a.value;
11053
- if (!value) {
11054
- return null;
11055
- }
11056
- if (((_b = promotion.application_method) == null ? void 0 : _b.type) === "fixed") {
11057
- const currency = (_c = promotion.application_method) == null ? void 0 : _c.currency_code;
11058
- if (!currency) {
11059
- return null;
11060
- }
11061
- return getLocaleAmount(value, currency);
11062
- } else if (((_d = promotion.application_method) == null ? void 0 : _d.type) === "percentage") {
11063
- return formatPercentage(value);
11064
- }
11065
- return null;
11066
- }
11067
- const formatter = new Intl.NumberFormat([], {
11068
- style: "percent",
11069
- minimumFractionDigits: 2
11070
- });
11071
- const formatPercentage = (value, isPercentageValue = false) => {
11072
- let val = value || 0;
11073
- if (!isPercentageValue) {
11074
- val = val / 100;
11075
- }
11076
- return formatter.format(val);
11077
- };
11078
- function getPromotionIds(items, shippingMethods) {
11079
- const promotionIds = /* @__PURE__ */ new Set();
11080
- for (const item of items) {
11081
- if (item.adjustments) {
11082
- for (const adjustment of item.adjustments) {
11083
- if (adjustment.promotion_id) {
11084
- promotionIds.add(adjustment.promotion_id);
11085
- }
11086
- }
11087
- }
11088
- }
11089
- for (const shippingMethod of shippingMethods) {
11090
- if (shippingMethod.adjustments) {
11091
- for (const adjustment of shippingMethod.adjustments) {
11092
- if (adjustment.promotion_id) {
11093
- promotionIds.add(adjustment.promotion_id);
11094
- }
11095
- }
11096
- }
11097
- }
11098
- return Array.from(promotionIds);
11099
- }
11100
- const InlineTip = forwardRef(
11101
- ({ variant = "tip", label, className, children, ...props }, ref) => {
11102
- const labelValue = label || (variant === "warning" ? "Warning" : "Tip");
11103
- return /* @__PURE__ */ jsxs(
11104
- "div",
11105
- {
11106
- ref,
11107
- className: clx(
11108
- "bg-ui-bg-component txt-small text-ui-fg-subtle grid grid-cols-[4px_1fr] items-start gap-3 rounded-lg border p-3",
11109
- className
11110
- ),
11111
- ...props,
11112
- children: [
11113
- /* @__PURE__ */ jsx(
11114
- "div",
11115
- {
11116
- role: "presentation",
11117
- className: clx("w-4px bg-ui-tag-neutral-icon h-full rounded-full", {
11118
- "bg-ui-tag-orange-icon": variant === "warning"
11119
- })
11120
- }
11121
- ),
11122
- /* @__PURE__ */ jsxs("div", { className: "text-pretty", children: [
11123
- /* @__PURE__ */ jsxs("strong", { className: "txt-small-plus text-ui-fg-base", children: [
11124
- labelValue,
11125
- ":"
11126
- ] }),
11127
- " ",
11128
- children
11129
- ] })
11130
- ]
11131
- }
11132
- );
11133
- }
11134
- );
11135
- InlineTip.displayName = "InlineTip";
11136
- const MetadataFieldSchema = objectType({
11137
- key: stringType(),
11138
- disabled: booleanType().optional(),
11139
- value: anyType()
11140
- });
11141
- const MetadataSchema = objectType({
11142
- metadata: arrayType(MetadataFieldSchema)
11143
- });
11144
- const Metadata = () => {
11145
- const { id } = useParams();
11146
- const { order, isPending, isError, error } = useOrder(id, {
11147
- fields: "metadata"
11148
- });
11149
- if (isError) {
11150
- throw error;
11151
- }
11152
- const isReady = !isPending && !!order;
11153
- return /* @__PURE__ */ jsxs(RouteDrawer, { children: [
11154
- /* @__PURE__ */ jsxs(RouteDrawer.Header, { children: [
11155
- /* @__PURE__ */ jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Metadata" }) }),
11156
- /* @__PURE__ */ jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Add metadata to the draft order." }) })
11157
- ] }),
11158
- !isReady ? /* @__PURE__ */ jsx(PlaceholderInner, {}) : /* @__PURE__ */ jsx(MetadataForm, { orderId: id, metadata: order == null ? void 0 : order.metadata })
11159
- ] });
11160
- };
11161
- const METADATA_KEY_LABEL_ID = "metadata-form-key-label";
11162
- const METADATA_VALUE_LABEL_ID = "metadata-form-value-label";
11163
- const MetadataForm = ({ orderId, metadata }) => {
11164
- const { handleSuccess } = useRouteModal();
11165
- const hasUneditableRows = getHasUneditableRows(metadata);
11166
- const { mutateAsync, isPending } = useUpdateDraftOrder(orderId);
11167
- const form = useForm({
11168
- defaultValues: {
11169
- metadata: getDefaultValues(metadata)
11170
- },
11171
- resolver: zodResolver(MetadataSchema)
11172
- });
11173
- const handleSubmit = form.handleSubmit(async (data) => {
11174
- const parsedData = parseValues(data);
11175
- await mutateAsync(
11176
- {
11177
- metadata: parsedData
11178
- },
11179
- {
11180
- onSuccess: () => {
11181
- toast.success("Metadata updated");
11182
- handleSuccess();
11183
- },
11184
- onError: (error) => {
11185
- toast.error(error.message);
11186
- }
11187
- }
11188
- );
11189
- });
11190
- const { fields, insert, remove } = useFieldArray({
11191
- control: form.control,
11192
- name: "metadata"
11193
- });
11194
- function deleteRow(index) {
11195
- remove(index);
11196
- if (fields.length === 1) {
11197
- insert(0, {
11198
- key: "",
11199
- value: "",
11200
- disabled: false
11201
- });
11202
- }
11203
- }
11204
- function insertRow(index, position) {
11205
- insert(index + (position === "above" ? 0 : 1), {
11206
- key: "",
11207
- value: "",
11208
- disabled: false
10926
+ }
10927
+ function insertRow(index, position) {
10928
+ insert(index + (position === "above" ? 0 : 1), {
10929
+ key: "",
10930
+ value: "",
10931
+ disabled: false
11209
10932
  });
11210
10933
  }
11211
10934
  return /* @__PURE__ */ jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxs(
@@ -11447,833 +11170,431 @@ function getHasUneditableRows(metadata) {
11447
11170
  (value) => !EDITABLE_TYPES.includes(typeof value)
11448
11171
  );
11449
11172
  }
11450
- const SalesChannel = () => {
11451
- const { id } = useParams();
11452
- const { draft_order, isPending, isError, error } = useDraftOrder(
11453
- id,
11454
- {
11455
- fields: "+sales_channel_id"
11456
- },
11457
- {
11458
- enabled: !!id
11459
- }
11460
- );
11461
- if (isError) {
11462
- throw error;
11173
+ const PROMOTION_QUERY_KEY = "promotions";
11174
+ const promotionsQueryKeys = {
11175
+ list: (query2) => [
11176
+ PROMOTION_QUERY_KEY,
11177
+ query2 ? query2 : void 0
11178
+ ],
11179
+ detail: (id, query2) => [
11180
+ PROMOTION_QUERY_KEY,
11181
+ id,
11182
+ query2 ? query2 : void 0
11183
+ ]
11184
+ };
11185
+ const usePromotions = (query2, options) => {
11186
+ const { data, ...rest } = useQuery({
11187
+ queryKey: promotionsQueryKeys.list(query2),
11188
+ queryFn: async () => sdk.admin.promotion.list(query2),
11189
+ ...options
11190
+ });
11191
+ return { ...data, ...rest };
11192
+ };
11193
+ const Promotions = () => {
11194
+ const { id } = useParams();
11195
+ const {
11196
+ order: preview,
11197
+ isError: isPreviewError,
11198
+ error: previewError
11199
+ } = useOrderPreview(id, void 0);
11200
+ useInitiateOrderEdit({ preview });
11201
+ const { onCancel } = useCancelOrderEdit({ preview });
11202
+ if (isPreviewError) {
11203
+ throw previewError;
11463
11204
  }
11464
- const ISrEADY = !!draft_order && !isPending;
11465
- return /* @__PURE__ */ jsxs(RouteDrawer, { children: [
11466
- /* @__PURE__ */ jsxs(RouteDrawer.Header, { children: [
11467
- /* @__PURE__ */ jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Edit Sales Channel" }) }),
11468
- /* @__PURE__ */ jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Update which sales channel the draft order is associated with" }) })
11469
- ] }),
11470
- ISrEADY && /* @__PURE__ */ jsx(SalesChannelForm, { order: draft_order })
11205
+ const isReady = !!preview;
11206
+ return /* @__PURE__ */ jsxs(RouteDrawer, { onClose: onCancel, children: [
11207
+ /* @__PURE__ */ jsx(RouteDrawer.Header, { children: /* @__PURE__ */ jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Edit Promotions" }) }) }),
11208
+ isReady && /* @__PURE__ */ jsx(PromotionForm, { preview })
11471
11209
  ] });
11472
11210
  };
11473
- const SalesChannelForm = ({ order }) => {
11474
- const form = useForm({
11475
- defaultValues: {
11476
- sales_channel_id: order.sales_channel_id || ""
11477
- },
11478
- resolver: zodResolver(schema$2)
11479
- });
11480
- const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
11211
+ const PromotionForm = ({ preview }) => {
11212
+ const { items, shipping_methods } = preview;
11213
+ const [isSubmitting, setIsSubmitting] = useState(false);
11214
+ const [comboboxValue, setComboboxValue] = useState("");
11481
11215
  const { handleSuccess } = useRouteModal();
11482
- const onSubmit = form.handleSubmit(async (data) => {
11483
- await mutateAsync(
11484
- {
11485
- sales_channel_id: data.sales_channel_id
11486
- },
11487
- {
11488
- onSuccess: () => {
11489
- toast.success("Sales channel updated");
11490
- handleSuccess();
11491
- },
11492
- onError: (error) => {
11493
- toast.error(error.message);
11494
- }
11495
- }
11496
- );
11497
- });
11498
- return /* @__PURE__ */ jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxs(
11499
- KeyboundForm,
11216
+ const { mutateAsync: addPromotions, isPending: isAddingPromotions } = useDraftOrderAddPromotions(preview.id);
11217
+ const promoIds = getPromotionIds(items, shipping_methods);
11218
+ const { promotions, isPending, isError, error } = usePromotions(
11500
11219
  {
11501
- className: "flex flex-1 flex-col overflow-hidden",
11502
- onSubmit,
11503
- children: [
11504
- /* @__PURE__ */ jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsx(SalesChannelField, { control: form.control, order }) }),
11505
- /* @__PURE__ */ jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex justify-end gap-2", children: [
11506
- /* @__PURE__ */ jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
11507
- /* @__PURE__ */ jsx(Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
11508
- ] }) })
11509
- ]
11220
+ id: promoIds
11221
+ },
11222
+ {
11223
+ enabled: !!promoIds.length
11510
11224
  }
11511
- ) });
11512
- };
11513
- const SalesChannelField = ({ control, order }) => {
11514
- const salesChannels = useComboboxData({
11225
+ );
11226
+ const comboboxData = useComboboxData({
11227
+ queryKey: ["promotions", "combobox", promoIds],
11515
11228
  queryFn: async (params) => {
11516
- return await sdk.admin.salesChannel.list(params);
11229
+ return await sdk.admin.promotion.list({
11230
+ ...params,
11231
+ id: {
11232
+ $nin: promoIds
11233
+ }
11234
+ });
11517
11235
  },
11518
- queryKey: ["sales-channels"],
11519
11236
  getOptions: (data) => {
11520
- return data.sales_channels.map((salesChannel) => ({
11521
- label: salesChannel.name,
11522
- value: salesChannel.id
11237
+ return data.promotions.map((promotion) => ({
11238
+ label: promotion.code,
11239
+ value: promotion.code
11523
11240
  }));
11524
- },
11525
- defaultValue: order.sales_channel_id || void 0
11526
- });
11527
- return /* @__PURE__ */ jsx(
11528
- Form$2.Field,
11529
- {
11530
- control,
11531
- name: "sales_channel_id",
11532
- render: ({ field }) => {
11533
- return /* @__PURE__ */ jsxs(Form$2.Item, { children: [
11534
- /* @__PURE__ */ jsx(Form$2.Label, { children: "Sales Channel" }),
11535
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(
11536
- Combobox,
11537
- {
11538
- options: salesChannels.options,
11539
- fetchNextPage: salesChannels.fetchNextPage,
11540
- isFetchingNextPage: salesChannels.isFetchingNextPage,
11541
- searchValue: salesChannels.searchValue,
11542
- onSearchValueChange: salesChannels.onSearchValueChange,
11543
- placeholder: "Select sales channel",
11544
- ...field
11545
- }
11546
- ) }),
11547
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
11548
- ] });
11549
- }
11550
11241
  }
11551
- );
11552
- };
11553
- const schema$2 = objectType({
11554
- sales_channel_id: stringType().min(1)
11555
- });
11556
- const ShippingAddress = () => {
11557
- const { id } = useParams();
11558
- const { order, isPending, isError, error } = useOrder(id, {
11559
- fields: "+shipping_address"
11560
- });
11561
- if (isError) {
11562
- throw error;
11563
- }
11564
- const isReady = !isPending && !!order;
11565
- return /* @__PURE__ */ jsxs(RouteDrawer, { children: [
11566
- /* @__PURE__ */ jsxs(RouteDrawer.Header, { children: [
11567
- /* @__PURE__ */ jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Edit Shipping Address" }) }),
11568
- /* @__PURE__ */ jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Edit the shipping address for the draft order" }) })
11569
- ] }),
11570
- isReady && /* @__PURE__ */ jsx(ShippingAddressForm, { order })
11571
- ] });
11572
- };
11573
- const ShippingAddressForm = ({ order }) => {
11574
- var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
11575
- const form = useForm({
11576
- defaultValues: {
11577
- first_name: ((_a = order.shipping_address) == null ? void 0 : _a.first_name) ?? "",
11578
- last_name: ((_b = order.shipping_address) == null ? void 0 : _b.last_name) ?? "",
11579
- company: ((_c = order.shipping_address) == null ? void 0 : _c.company) ?? "",
11580
- address_1: ((_d = order.shipping_address) == null ? void 0 : _d.address_1) ?? "",
11581
- address_2: ((_e = order.shipping_address) == null ? void 0 : _e.address_2) ?? "",
11582
- city: ((_f = order.shipping_address) == null ? void 0 : _f.city) ?? "",
11583
- province: ((_g = order.shipping_address) == null ? void 0 : _g.province) ?? "",
11584
- country_code: ((_h = order.shipping_address) == null ? void 0 : _h.country_code) ?? "",
11585
- postal_code: ((_i = order.shipping_address) == null ? void 0 : _i.postal_code) ?? "",
11586
- phone: ((_j = order.shipping_address) == null ? void 0 : _j.phone) ?? ""
11587
- },
11588
- resolver: zodResolver(schema$1)
11589
11242
  });
11590
- const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
11591
- const { handleSuccess } = useRouteModal();
11592
- const onSubmit = form.handleSubmit(async (data) => {
11593
- await mutateAsync(
11243
+ const add = async (value) => {
11244
+ if (!value) {
11245
+ return;
11246
+ }
11247
+ addPromotions(
11594
11248
  {
11595
- shipping_address: {
11596
- first_name: data.first_name,
11597
- last_name: data.last_name,
11598
- company: data.company,
11599
- address_1: data.address_1,
11600
- address_2: data.address_2,
11601
- city: data.city,
11602
- province: data.province,
11603
- country_code: data.country_code,
11604
- postal_code: data.postal_code,
11605
- phone: data.phone
11606
- }
11249
+ promo_codes: [value]
11607
11250
  },
11608
11251
  {
11609
- onSuccess: () => {
11610
- handleSuccess();
11252
+ onError: (e) => {
11253
+ toast.error(e.message);
11254
+ comboboxData.onSearchValueChange("");
11255
+ setComboboxValue("");
11611
11256
  },
11612
- onError: (error) => {
11613
- toast.error(error.message);
11257
+ onSuccess: () => {
11258
+ comboboxData.onSearchValueChange("");
11259
+ setComboboxValue("");
11614
11260
  }
11615
11261
  }
11616
11262
  );
11617
- });
11618
- return /* @__PURE__ */ jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxs(
11619
- KeyboundForm,
11620
- {
11621
- className: "flex flex-1 flex-col overflow-hidden",
11622
- onSubmit,
11623
- children: [
11624
- /* @__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: [
11625
- /* @__PURE__ */ jsx(
11626
- Form$2.Field,
11627
- {
11628
- control: form.control,
11629
- name: "country_code",
11630
- render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
11631
- /* @__PURE__ */ jsx(Form$2.Label, { children: "Country" }),
11632
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(CountrySelect, { ...field }) }),
11633
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
11634
- ] })
11635
- }
11636
- ),
11637
- /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
11638
- /* @__PURE__ */ jsx(
11639
- Form$2.Field,
11640
- {
11641
- control: form.control,
11642
- name: "first_name",
11643
- render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
11644
- /* @__PURE__ */ jsx(Form$2.Label, { children: "First name" }),
11645
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
11646
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
11647
- ] })
11648
- }
11649
- ),
11650
- /* @__PURE__ */ jsx(
11651
- Form$2.Field,
11652
- {
11653
- control: form.control,
11654
- name: "last_name",
11655
- render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
11656
- /* @__PURE__ */ jsx(Form$2.Label, { children: "Last name" }),
11657
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
11658
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
11659
- ] })
11660
- }
11661
- )
11662
- ] }),
11663
- /* @__PURE__ */ jsx(
11664
- Form$2.Field,
11665
- {
11666
- control: form.control,
11667
- name: "company",
11668
- render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
11669
- /* @__PURE__ */ jsx(Form$2.Label, { optional: true, children: "Company" }),
11670
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
11671
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
11672
- ] })
11673
- }
11674
- ),
11675
- /* @__PURE__ */ jsx(
11676
- Form$2.Field,
11677
- {
11678
- control: form.control,
11679
- name: "address_1",
11680
- render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
11681
- /* @__PURE__ */ jsx(Form$2.Label, { children: "Address" }),
11682
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
11683
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
11684
- ] })
11685
- }
11686
- ),
11687
- /* @__PURE__ */ jsx(
11688
- Form$2.Field,
11689
- {
11690
- control: form.control,
11691
- name: "address_2",
11692
- render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
11693
- /* @__PURE__ */ jsx(Form$2.Label, { optional: true, children: "Apartment, suite, etc." }),
11694
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
11695
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
11696
- ] })
11697
- }
11698
- ),
11699
- /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
11700
- /* @__PURE__ */ jsx(
11701
- Form$2.Field,
11702
- {
11703
- control: form.control,
11704
- name: "postal_code",
11705
- render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
11706
- /* @__PURE__ */ jsx(Form$2.Label, { children: "Postal code" }),
11707
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
11708
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
11709
- ] })
11710
- }
11711
- ),
11712
- /* @__PURE__ */ jsx(
11713
- Form$2.Field,
11714
- {
11715
- control: form.control,
11716
- name: "city",
11717
- render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
11718
- /* @__PURE__ */ jsx(Form$2.Label, { children: "City" }),
11719
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
11720
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
11721
- ] })
11722
- }
11723
- )
11724
- ] }),
11725
- /* @__PURE__ */ jsx(
11726
- Form$2.Field,
11727
- {
11728
- control: form.control,
11729
- name: "province",
11730
- render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
11731
- /* @__PURE__ */ jsx(Form$2.Label, { optional: true, children: "Province / State" }),
11732
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
11733
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
11734
- ] })
11735
- }
11736
- ),
11737
- /* @__PURE__ */ jsx(
11738
- Form$2.Field,
11739
- {
11740
- control: form.control,
11741
- name: "phone",
11742
- render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
11743
- /* @__PURE__ */ jsx(Form$2.Label, { optional: true, children: "Phone" }),
11744
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
11745
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
11746
- ] })
11747
- }
11748
- )
11749
- ] }) }),
11750
- /* @__PURE__ */ jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex justify-end gap-2", children: [
11751
- /* @__PURE__ */ jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
11752
- /* @__PURE__ */ jsx(Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
11753
- ] }) })
11754
- ]
11263
+ };
11264
+ const { mutateAsync: confirmOrderEdit } = useDraftOrderConfirmEdit(preview.id);
11265
+ const { mutateAsync: requestOrderEdit } = useOrderEditRequest(preview.id);
11266
+ const onSubmit = async () => {
11267
+ setIsSubmitting(true);
11268
+ let requestSucceeded = false;
11269
+ await requestOrderEdit(void 0, {
11270
+ onError: (e) => {
11271
+ toast.error(e.message);
11272
+ },
11273
+ onSuccess: () => {
11274
+ requestSucceeded = true;
11275
+ }
11276
+ });
11277
+ if (!requestSucceeded) {
11278
+ setIsSubmitting(false);
11279
+ return;
11755
11280
  }
11756
- ) });
11757
- };
11758
- const schema$1 = addressSchema;
11759
- const TransferOwnership = () => {
11760
- const { id } = useParams();
11761
- const { draft_order, isPending, isError, error } = useDraftOrder(id, {
11762
- fields: "id,customer_id,customer.*"
11763
- });
11281
+ await confirmOrderEdit(void 0, {
11282
+ onError: (e) => {
11283
+ toast.error(e.message);
11284
+ },
11285
+ onSuccess: () => {
11286
+ handleSuccess();
11287
+ },
11288
+ onSettled: () => {
11289
+ setIsSubmitting(false);
11290
+ }
11291
+ });
11292
+ };
11764
11293
  if (isError) {
11765
11294
  throw error;
11766
11295
  }
11767
- const isReady = !isPending && !!draft_order;
11768
- return /* @__PURE__ */ jsxs(RouteDrawer, { children: [
11769
- /* @__PURE__ */ jsxs(RouteDrawer.Header, { children: [
11770
- /* @__PURE__ */ jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Transfer Ownership" }) }),
11771
- /* @__PURE__ */ jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Transfer the ownership of this draft order to a new customer" }) })
11772
- ] }),
11773
- isReady && /* @__PURE__ */ jsx(TransferOwnershipForm, { order: draft_order })
11296
+ return /* @__PURE__ */ jsxs(KeyboundForm, { className: "flex flex-1 flex-col", onSubmit, children: [
11297
+ /* @__PURE__ */ jsx(RouteDrawer.Body, { children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-4", children: [
11298
+ /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-3", children: [
11299
+ /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
11300
+ /* @__PURE__ */ jsx(Label$1, { size: "small", weight: "plus", htmlFor: "promotion-combobox", children: "Apply promotions" }),
11301
+ /* @__PURE__ */ jsx(Hint$1, { id: "promotion-combobox-hint", children: "Manage promotions that should be applied to the order." })
11302
+ ] }),
11303
+ /* @__PURE__ */ jsx(
11304
+ Combobox,
11305
+ {
11306
+ id: "promotion-combobox",
11307
+ "aria-describedby": "promotion-combobox-hint",
11308
+ isFetchingNextPage: comboboxData.isFetchingNextPage,
11309
+ fetchNextPage: comboboxData.fetchNextPage,
11310
+ options: comboboxData.options,
11311
+ onSearchValueChange: comboboxData.onSearchValueChange,
11312
+ searchValue: comboboxData.searchValue,
11313
+ disabled: comboboxData.disabled || isAddingPromotions,
11314
+ onChange: add,
11315
+ value: comboboxValue
11316
+ }
11317
+ )
11318
+ ] }),
11319
+ /* @__PURE__ */ jsx(Divider, { variant: "dashed" }),
11320
+ /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-2", children: promotions == null ? void 0 : promotions.map((promotion) => /* @__PURE__ */ jsx(
11321
+ PromotionItem,
11322
+ {
11323
+ promotion,
11324
+ orderId: preview.id,
11325
+ isLoading: isPending
11326
+ },
11327
+ promotion.id
11328
+ )) })
11329
+ ] }) }),
11330
+ /* @__PURE__ */ jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex justify-end gap-2", children: [
11331
+ /* @__PURE__ */ jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
11332
+ /* @__PURE__ */ jsx(
11333
+ Button,
11334
+ {
11335
+ size: "small",
11336
+ type: "submit",
11337
+ isLoading: isSubmitting || isAddingPromotions,
11338
+ children: "Save"
11339
+ }
11340
+ )
11341
+ ] }) })
11774
11342
  ] });
11775
11343
  };
11776
- const TransferOwnershipForm = ({ order }) => {
11777
- var _a, _b;
11778
- const form = useForm({
11779
- defaultValues: {
11780
- customer_id: order.customer_id || ""
11781
- },
11782
- resolver: zodResolver(schema)
11783
- });
11784
- const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
11785
- const { handleSuccess } = useRouteModal();
11786
- const name = [(_a = order.customer) == null ? void 0 : _a.first_name, (_b = order.customer) == null ? void 0 : _b.last_name].filter(Boolean).join(" ");
11787
- const currentCustomer = order.customer ? {
11788
- label: name ? `${name} (${order.customer.email})` : order.customer.email,
11789
- value: order.customer.id
11790
- } : null;
11791
- const onSubmit = form.handleSubmit(async (data) => {
11792
- await mutateAsync(
11793
- { customer_id: data.customer_id },
11344
+ const PromotionItem = ({
11345
+ promotion,
11346
+ orderId,
11347
+ isLoading
11348
+ }) => {
11349
+ var _a;
11350
+ const { mutateAsync: removePromotions, isPending } = useDraftOrderRemovePromotions(orderId);
11351
+ const onRemove = async () => {
11352
+ removePromotions(
11794
11353
  {
11795
- onSuccess: () => {
11796
- toast.success("Customer updated");
11797
- handleSuccess();
11798
- },
11799
- onError: (error) => {
11800
- toast.error(error.message);
11354
+ promo_codes: [promotion.code]
11355
+ },
11356
+ {
11357
+ onError: (e) => {
11358
+ toast.error(e.message);
11801
11359
  }
11802
11360
  }
11803
11361
  );
11804
- });
11805
- return /* @__PURE__ */ jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxs(
11806
- KeyboundForm,
11362
+ };
11363
+ const displayValue = getDisplayValue(promotion);
11364
+ return /* @__PURE__ */ jsxs(
11365
+ "div",
11807
11366
  {
11808
- className: "flex flex-1 flex-col overflow-hidden",
11809
- onSubmit,
11367
+ className: clx(
11368
+ "bg-ui-bg-component shadow-elevation-card-rest flex items-center justify-between rounded-lg px-3 py-2",
11369
+ {
11370
+ "animate-pulse": isLoading
11371
+ }
11372
+ ),
11810
11373
  children: [
11811
- /* @__PURE__ */ jsxs(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: [
11812
- /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center bg-ui-bg-component rounded-md border", children: /* @__PURE__ */ jsx(Illustration, {}) }),
11813
- currentCustomer && /* @__PURE__ */ jsxs("div", { className: "flex flex-col space-y-3", children: [
11814
- /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
11815
- /* @__PURE__ */ jsx(Label$1, { size: "small", weight: "plus", htmlFor: "current-customer", children: "Current owner" }),
11816
- /* @__PURE__ */ jsx(Hint$1, { children: "The customer that is currently associated with this draft order." })
11374
+ /* @__PURE__ */ jsxs("div", { children: [
11375
+ /* @__PURE__ */ jsx(Text, { size: "small", weight: "plus", leading: "compact", children: promotion.code }),
11376
+ /* @__PURE__ */ jsxs("div", { className: "text-ui-fg-subtle flex items-center gap-1.5", children: [
11377
+ displayValue && /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1.5", children: [
11378
+ /* @__PURE__ */ jsx(Text, { size: "small", leading: "compact", children: displayValue }),
11379
+ /* @__PURE__ */ jsx(Text, { size: "small", leading: "compact", children: "·" })
11817
11380
  ] }),
11818
- /* @__PURE__ */ jsxs(Select, { disabled: true, value: currentCustomer.value, children: [
11819
- /* @__PURE__ */ jsx(Select.Trigger, { id: "current-customer", children: /* @__PURE__ */ jsx(Select.Value, {}) }),
11820
- /* @__PURE__ */ jsx(Select.Content, { children: /* @__PURE__ */ jsx(Select.Item, { value: currentCustomer.value, children: currentCustomer.label }) })
11821
- ] })
11822
- ] }),
11823
- /* @__PURE__ */ jsx(
11824
- CustomerField,
11825
- {
11826
- control: form.control,
11827
- currentCustomerId: order.customer_id
11828
- }
11829
- )
11381
+ /* @__PURE__ */ jsx(Text, { size: "small", leading: "compact", className: "capitalize", children: (_a = promotion.application_method) == null ? void 0 : _a.allocation })
11382
+ ] })
11830
11383
  ] }),
11831
- /* @__PURE__ */ jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
11832
- /* @__PURE__ */ jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { variant: "secondary", size: "small", children: "Cancel" }) }),
11384
+ /* @__PURE__ */ jsx(
11385
+ IconButton,
11386
+ {
11387
+ size: "small",
11388
+ type: "button",
11389
+ variant: "transparent",
11390
+ onClick: onRemove,
11391
+ isLoading: isPending || isLoading,
11392
+ children: /* @__PURE__ */ jsx(XMark, {})
11393
+ }
11394
+ )
11395
+ ]
11396
+ },
11397
+ promotion.id
11398
+ );
11399
+ };
11400
+ function getDisplayValue(promotion) {
11401
+ var _a, _b, _c, _d;
11402
+ const value = (_a = promotion.application_method) == null ? void 0 : _a.value;
11403
+ if (!value) {
11404
+ return null;
11405
+ }
11406
+ if (((_b = promotion.application_method) == null ? void 0 : _b.type) === "fixed") {
11407
+ const currency = (_c = promotion.application_method) == null ? void 0 : _c.currency_code;
11408
+ if (!currency) {
11409
+ return null;
11410
+ }
11411
+ return getLocaleAmount(value, currency);
11412
+ } else if (((_d = promotion.application_method) == null ? void 0 : _d.type) === "percentage") {
11413
+ return formatPercentage(value);
11414
+ }
11415
+ return null;
11416
+ }
11417
+ const formatter = new Intl.NumberFormat([], {
11418
+ style: "percent",
11419
+ minimumFractionDigits: 2
11420
+ });
11421
+ const formatPercentage = (value, isPercentageValue = false) => {
11422
+ let val = value || 0;
11423
+ if (!isPercentageValue) {
11424
+ val = val / 100;
11425
+ }
11426
+ return formatter.format(val);
11427
+ };
11428
+ function getPromotionIds(items, shippingMethods) {
11429
+ const promotionIds = /* @__PURE__ */ new Set();
11430
+ for (const item of items) {
11431
+ if (item.adjustments) {
11432
+ for (const adjustment of item.adjustments) {
11433
+ if (adjustment.promotion_id) {
11434
+ promotionIds.add(adjustment.promotion_id);
11435
+ }
11436
+ }
11437
+ }
11438
+ }
11439
+ for (const shippingMethod of shippingMethods) {
11440
+ if (shippingMethod.adjustments) {
11441
+ for (const adjustment of shippingMethod.adjustments) {
11442
+ if (adjustment.promotion_id) {
11443
+ promotionIds.add(adjustment.promotion_id);
11444
+ }
11445
+ }
11446
+ }
11447
+ }
11448
+ return Array.from(promotionIds);
11449
+ }
11450
+ const SalesChannel = () => {
11451
+ const { id } = useParams();
11452
+ const { draft_order, isPending, isError, error } = useDraftOrder(
11453
+ id,
11454
+ {
11455
+ fields: "+sales_channel_id"
11456
+ },
11457
+ {
11458
+ enabled: !!id
11459
+ }
11460
+ );
11461
+ if (isError) {
11462
+ throw error;
11463
+ }
11464
+ const ISrEADY = !!draft_order && !isPending;
11465
+ return /* @__PURE__ */ jsxs(RouteDrawer, { children: [
11466
+ /* @__PURE__ */ jsxs(RouteDrawer.Header, { children: [
11467
+ /* @__PURE__ */ jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Edit Sales Channel" }) }),
11468
+ /* @__PURE__ */ jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Update which sales channel the draft order is associated with" }) })
11469
+ ] }),
11470
+ ISrEADY && /* @__PURE__ */ jsx(SalesChannelForm, { order: draft_order })
11471
+ ] });
11472
+ };
11473
+ const SalesChannelForm = ({ order }) => {
11474
+ const form = useForm({
11475
+ defaultValues: {
11476
+ sales_channel_id: order.sales_channel_id || ""
11477
+ },
11478
+ resolver: zodResolver(schema$2)
11479
+ });
11480
+ const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
11481
+ const { handleSuccess } = useRouteModal();
11482
+ const onSubmit = form.handleSubmit(async (data) => {
11483
+ await mutateAsync(
11484
+ {
11485
+ sales_channel_id: data.sales_channel_id
11486
+ },
11487
+ {
11488
+ onSuccess: () => {
11489
+ toast.success("Sales channel updated");
11490
+ handleSuccess();
11491
+ },
11492
+ onError: (error) => {
11493
+ toast.error(error.message);
11494
+ }
11495
+ }
11496
+ );
11497
+ });
11498
+ return /* @__PURE__ */ jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxs(
11499
+ KeyboundForm,
11500
+ {
11501
+ className: "flex flex-1 flex-col overflow-hidden",
11502
+ onSubmit,
11503
+ children: [
11504
+ /* @__PURE__ */ jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsx(SalesChannelField, { control: form.control, order }) }),
11505
+ /* @__PURE__ */ jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex justify-end gap-2", children: [
11506
+ /* @__PURE__ */ jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
11833
11507
  /* @__PURE__ */ jsx(Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
11834
11508
  ] }) })
11835
11509
  ]
11836
11510
  }
11837
11511
  ) });
11838
11512
  };
11839
- const CustomerField = ({ control, currentCustomerId }) => {
11840
- const customers = useComboboxData({
11513
+ const SalesChannelField = ({ control, order }) => {
11514
+ const salesChannels = useComboboxData({
11841
11515
  queryFn: async (params) => {
11842
- return await sdk.admin.customer.list({
11843
- ...params,
11844
- id: currentCustomerId ? { $nin: [currentCustomerId] } : void 0
11845
- });
11516
+ return await sdk.admin.salesChannel.list(params);
11846
11517
  },
11847
- queryKey: ["customers"],
11518
+ queryKey: ["sales-channels"],
11848
11519
  getOptions: (data) => {
11849
- return data.customers.map((customer) => {
11850
- const name = [customer.first_name, customer.last_name].filter(Boolean).join(" ");
11851
- return {
11852
- label: name ? `${name} (${customer.email})` : customer.email,
11853
- value: customer.id
11854
- };
11855
- });
11856
- }
11520
+ return data.sales_channels.map((salesChannel) => ({
11521
+ label: salesChannel.name,
11522
+ value: salesChannel.id
11523
+ }));
11524
+ },
11525
+ defaultValue: order.sales_channel_id || void 0
11857
11526
  });
11858
11527
  return /* @__PURE__ */ jsx(
11859
11528
  Form$2.Field,
11860
11529
  {
11861
- name: "customer_id",
11862
11530
  control,
11863
- render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { className: "space-y-3", children: [
11864
- /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
11865
- /* @__PURE__ */ jsx(Form$2.Label, { children: "New customer" }),
11866
- /* @__PURE__ */ jsx(Form$2.Hint, { children: "The customer to transfer this draft order to." })
11867
- ] }),
11868
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(
11869
- Combobox,
11870
- {
11871
- options: customers.options,
11872
- fetchNextPage: customers.fetchNextPage,
11873
- isFetchingNextPage: customers.isFetchingNextPage,
11874
- searchValue: customers.searchValue,
11875
- onSearchValueChange: customers.onSearchValueChange,
11876
- placeholder: "Select customer",
11877
- ...field
11878
- }
11879
- ) }),
11880
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
11881
- ] })
11531
+ name: "sales_channel_id",
11532
+ render: ({ field }) => {
11533
+ return /* @__PURE__ */ jsxs(Form$2.Item, { children: [
11534
+ /* @__PURE__ */ jsx(Form$2.Label, { children: "Sales Channel" }),
11535
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(
11536
+ Combobox,
11537
+ {
11538
+ options: salesChannels.options,
11539
+ fetchNextPage: salesChannels.fetchNextPage,
11540
+ isFetchingNextPage: salesChannels.isFetchingNextPage,
11541
+ searchValue: salesChannels.searchValue,
11542
+ onSearchValueChange: salesChannels.onSearchValueChange,
11543
+ placeholder: "Select sales channel",
11544
+ ...field
11545
+ }
11546
+ ) }),
11547
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
11548
+ ] });
11549
+ }
11882
11550
  }
11883
11551
  );
11884
11552
  };
11885
- const Illustration = () => {
11886
- return /* @__PURE__ */ jsxs(
11887
- "svg",
11888
- {
11889
- width: "280",
11890
- height: "180",
11891
- viewBox: "0 0 280 180",
11892
- fill: "none",
11893
- xmlns: "http://www.w3.org/2000/svg",
11894
- children: [
11895
- /* @__PURE__ */ jsx(
11896
- "rect",
11897
- {
11898
- x: "0.00428286",
11899
- y: "-0.742904",
11900
- width: "33.5",
11901
- height: "65.5",
11902
- rx: "6.75",
11903
- transform: "matrix(0.865865 0.500278 -0.871576 0.490261 189.756 88.438)",
11904
- fill: "#D4D4D8",
11905
- stroke: "#52525B",
11906
- strokeWidth: "1.5"
11907
- }
11908
- ),
11909
- /* @__PURE__ */ jsx(
11910
- "rect",
11911
- {
11912
- x: "0.00428286",
11913
- y: "-0.742904",
11914
- width: "33.5",
11915
- height: "65.5",
11916
- rx: "6.75",
11917
- transform: "matrix(0.865865 0.500278 -0.871576 0.490261 189.756 85.4381)",
11918
- fill: "white",
11919
- stroke: "#52525B",
11920
- strokeWidth: "1.5"
11921
- }
11922
- ),
11923
- /* @__PURE__ */ jsx(
11924
- "path",
11925
- {
11926
- d: "M180.579 107.142L179.126 107.959",
11927
- stroke: "#52525B",
11928
- strokeWidth: "1.5",
11929
- strokeLinecap: "round",
11930
- strokeLinejoin: "round"
11931
- }
11932
- ),
11933
- /* @__PURE__ */ jsx(
11934
- "path",
11935
- {
11936
- opacity: "0.88",
11937
- d: "M182.305 109.546L180.257 109.534",
11938
- stroke: "#52525B",
11939
- strokeWidth: "1.5",
11940
- strokeLinecap: "round",
11941
- strokeLinejoin: "round"
11942
- }
11943
- ),
11944
- /* @__PURE__ */ jsx(
11945
- "path",
11946
- {
11947
- opacity: "0.75",
11948
- d: "M180.551 111.93L179.108 111.096",
11949
- stroke: "#52525B",
11950
- strokeWidth: "1.5",
11951
- strokeLinecap: "round",
11952
- strokeLinejoin: "round"
11953
- }
11954
- ),
11955
- /* @__PURE__ */ jsx(
11956
- "path",
11957
- {
11958
- opacity: "0.63",
11959
- d: "M176.347 112.897L176.354 111.73",
11960
- stroke: "#52525B",
11961
- strokeWidth: "1.5",
11962
- strokeLinecap: "round",
11963
- strokeLinejoin: "round"
11964
- }
11965
- ),
11966
- /* @__PURE__ */ jsx(
11967
- "path",
11968
- {
11969
- opacity: "0.5",
11970
- d: "M172.153 111.881L173.606 111.064",
11971
- stroke: "#52525B",
11972
- strokeWidth: "1.5",
11973
- strokeLinecap: "round",
11974
- strokeLinejoin: "round"
11975
- }
11976
- ),
11977
- /* @__PURE__ */ jsx(
11978
- "path",
11979
- {
11980
- opacity: "0.38",
11981
- d: "M170.428 109.478L172.476 109.489",
11982
- stroke: "#52525B",
11983
- strokeWidth: "1.5",
11984
- strokeLinecap: "round",
11985
- strokeLinejoin: "round"
11986
- }
11987
- ),
11988
- /* @__PURE__ */ jsx(
11989
- "path",
11990
- {
11991
- opacity: "0.25",
11992
- d: "M172.181 107.094L173.624 107.928",
11993
- stroke: "#52525B",
11994
- strokeWidth: "1.5",
11995
- strokeLinecap: "round",
11996
- strokeLinejoin: "round"
11997
- }
11998
- ),
11999
- /* @__PURE__ */ jsx(
12000
- "path",
12001
- {
12002
- opacity: "0.13",
12003
- d: "M176.386 106.126L176.379 107.294",
12004
- stroke: "#52525B",
12005
- strokeWidth: "1.5",
12006
- strokeLinecap: "round",
12007
- strokeLinejoin: "round"
12008
- }
12009
- ),
12010
- /* @__PURE__ */ jsx(
12011
- "rect",
12012
- {
12013
- width: "12",
12014
- height: "3",
12015
- rx: "1.5",
12016
- transform: "matrix(0.865865 0.500278 -0.871576 0.490261 196.447 92.2925)",
12017
- fill: "#D4D4D8"
12018
- }
12019
- ),
12020
- /* @__PURE__ */ jsx(
12021
- "rect",
12022
- {
12023
- x: "0.00428286",
12024
- y: "-0.742904",
12025
- width: "33.5",
12026
- height: "65.5",
12027
- rx: "6.75",
12028
- transform: "matrix(0.865865 0.500278 -0.871576 0.490261 117.023 46.4147)",
12029
- fill: "#D4D4D8",
12030
- stroke: "#52525B",
12031
- strokeWidth: "1.5"
12032
- }
12033
- ),
12034
- /* @__PURE__ */ jsx(
12035
- "rect",
12036
- {
12037
- x: "0.00428286",
12038
- y: "-0.742904",
12039
- width: "33.5",
12040
- height: "65.5",
12041
- rx: "6.75",
12042
- transform: "matrix(0.865865 0.500278 -0.871576 0.490261 117.023 43.4147)",
12043
- fill: "white",
12044
- stroke: "#52525B",
12045
- strokeWidth: "1.5"
12046
- }
12047
- ),
12048
- /* @__PURE__ */ jsx(
12049
- "rect",
12050
- {
12051
- width: "12",
12052
- height: "3",
12053
- rx: "1.5",
12054
- transform: "matrix(0.865865 0.500278 -0.871576 0.490261 123.714 50.2691)",
12055
- fill: "#D4D4D8"
12056
- }
12057
- ),
12058
- /* @__PURE__ */ jsx(
12059
- "rect",
12060
- {
12061
- width: "17",
12062
- height: "3",
12063
- rx: "1.5",
12064
- transform: "matrix(0.865865 0.500278 -0.871576 0.490261 97.5557 66.958)",
12065
- fill: "#D4D4D8"
12066
- }
12067
- ),
12068
- /* @__PURE__ */ jsx(
12069
- "rect",
12070
- {
12071
- width: "12",
12072
- height: "3",
12073
- rx: "1.5",
12074
- transform: "matrix(0.865865 0.500278 -0.871576 0.490261 93.1978 69.4093)",
12075
- fill: "#D4D4D8"
12076
- }
12077
- ),
12078
- /* @__PURE__ */ jsx(
12079
- "path",
12080
- {
12081
- d: "M92.3603 63.9563C90.9277 63.1286 88.59 63.1152 87.148 63.9263C85.7059 64.7374 85.6983 66.0702 87.1308 66.8979C88.5634 67.7256 90.9011 67.7391 92.3432 66.928C93.7852 66.1168 93.7929 64.784 92.3603 63.9563ZM88.4382 66.1625C87.7221 65.7488 87.726 65.0822 88.4468 64.6767C89.1676 64.2713 90.3369 64.278 91.0529 64.6917C91.769 65.1055 91.7652 65.7721 91.0444 66.1775C90.3236 66.583 89.1543 66.5762 88.4382 66.1625Z",
12082
- fill: "#A1A1AA"
12083
- }
12084
- ),
12085
- /* @__PURE__ */ jsx(
12086
- "rect",
12087
- {
12088
- width: "17",
12089
- height: "3",
12090
- rx: "1.5",
12091
- transform: "matrix(0.865865 0.500278 -0.871576 0.490261 109.758 60.0944)",
12092
- fill: "#A1A1AA"
12093
- }
12094
- ),
12095
- /* @__PURE__ */ jsx(
12096
- "rect",
12097
- {
12098
- width: "12",
12099
- height: "3",
12100
- rx: "1.5",
12101
- transform: "matrix(0.865865 0.500278 -0.871576 0.490261 105.4 62.5457)",
12102
- fill: "#A1A1AA"
12103
- }
12104
- ),
12105
- /* @__PURE__ */ jsx(
12106
- "path",
12107
- {
12108
- d: "M104.562 57.0927C103.13 56.265 100.792 56.2515 99.3501 57.0626C97.9081 57.8738 97.9004 59.2065 99.333 60.0343C100.766 60.862 103.103 60.8754 104.545 60.0643C105.987 59.2532 105.995 57.9204 104.562 57.0927ZM103.858 58.8972L100.815 59.1265C100.683 59.1367 100.55 59.1134 100.449 59.063C100.44 59.0585 100.432 59.0545 100.425 59.05C100.339 59.0005 100.29 58.9336 100.291 58.8637L100.294 58.1201C100.294 57.9752 100.501 57.8585 100.756 57.86C101.01 57.8615 101.217 57.98 101.216 58.1256L101.214 58.5669L103.732 58.3769C103.984 58.3578 104.217 58.4584 104.251 58.603C104.286 58.7468 104.11 58.8788 103.858 58.8977L103.858 58.8972Z",
12109
- fill: "#52525B"
12110
- }
12111
- ),
12112
- /* @__PURE__ */ jsx("g", { clipPath: "url(#clip0_20915_38670)", children: /* @__PURE__ */ jsx(
12113
- "path",
12114
- {
12115
- d: "M133.106 81.8022L140.49 81.8447L140.515 77.6349",
12116
- stroke: "#A1A1AA",
12117
- strokeWidth: "1.5",
12118
- strokeLinecap: "round",
12119
- strokeLinejoin: "round"
12120
- }
12121
- ) }),
12122
- /* @__PURE__ */ jsx("g", { clipPath: "url(#clip1_20915_38670)", children: /* @__PURE__ */ jsx(
12123
- "path",
12124
- {
12125
- d: "M143.496 87.8055L150.881 87.8481L150.905 83.6383",
12126
- stroke: "#A1A1AA",
12127
- strokeWidth: "1.5",
12128
- strokeLinecap: "round",
12129
- strokeLinejoin: "round"
12130
- }
12131
- ) }),
12132
- /* @__PURE__ */ jsx("g", { clipPath: "url(#clip2_20915_38670)", children: /* @__PURE__ */ jsx(
12133
- "path",
12134
- {
12135
- d: "M153.887 93.8088L161.271 93.8514L161.295 89.6416",
12136
- stroke: "#A1A1AA",
12137
- strokeWidth: "1.5",
12138
- strokeLinecap: "round",
12139
- strokeLinejoin: "round"
12140
- }
12141
- ) }),
12142
- /* @__PURE__ */ jsx("g", { clipPath: "url(#clip3_20915_38670)", children: /* @__PURE__ */ jsx(
12143
- "path",
12144
- {
12145
- d: "M126.114 89.1912L118.729 89.1486L118.705 93.3584",
12146
- stroke: "#A1A1AA",
12147
- strokeWidth: "1.5",
12148
- strokeLinecap: "round",
12149
- strokeLinejoin: "round"
12150
- }
12151
- ) }),
12152
- /* @__PURE__ */ jsx("g", { clipPath: "url(#clip4_20915_38670)", children: /* @__PURE__ */ jsx(
12153
- "path",
12154
- {
12155
- d: "M136.504 95.1945L129.12 95.1519L129.095 99.3617",
12156
- stroke: "#A1A1AA",
12157
- strokeWidth: "1.5",
12158
- strokeLinecap: "round",
12159
- strokeLinejoin: "round"
12160
- }
12161
- ) }),
12162
- /* @__PURE__ */ jsx("g", { clipPath: "url(#clip5_20915_38670)", children: /* @__PURE__ */ jsx(
12163
- "path",
12164
- {
12165
- d: "M146.894 101.198L139.51 101.155L139.486 105.365",
12166
- stroke: "#A1A1AA",
12167
- strokeWidth: "1.5",
12168
- strokeLinecap: "round",
12169
- strokeLinejoin: "round"
12170
- }
12171
- ) }),
12172
- /* @__PURE__ */ jsxs("defs", { children: [
12173
- /* @__PURE__ */ jsx("clipPath", { id: "clip0_20915_38670", children: /* @__PURE__ */ jsx(
12174
- "rect",
12175
- {
12176
- width: "12",
12177
- height: "12",
12178
- fill: "white",
12179
- transform: "matrix(0.865865 0.500278 -0.871576 0.490261 138.36 74.6508)"
12180
- }
12181
- ) }),
12182
- /* @__PURE__ */ jsx("clipPath", { id: "clip1_20915_38670", children: /* @__PURE__ */ jsx(
12183
- "rect",
12184
- {
12185
- width: "12",
12186
- height: "12",
12187
- fill: "white",
12188
- transform: "matrix(0.865865 0.500278 -0.871576 0.490261 148.75 80.6541)"
12189
- }
12190
- ) }),
12191
- /* @__PURE__ */ jsx("clipPath", { id: "clip2_20915_38670", children: /* @__PURE__ */ jsx(
12192
- "rect",
12193
- {
12194
- width: "12",
12195
- height: "12",
12196
- fill: "white",
12197
- transform: "matrix(0.865865 0.500278 -0.871576 0.490261 159.141 86.6575)"
12198
- }
12199
- ) }),
12200
- /* @__PURE__ */ jsx("clipPath", { id: "clip3_20915_38670", children: /* @__PURE__ */ jsx(
12201
- "rect",
12202
- {
12203
- width: "12",
12204
- height: "12",
12205
- fill: "white",
12206
- transform: "matrix(0.865865 0.500278 -0.871576 0.490261 120.928 84.4561)"
12207
- }
12208
- ) }),
12209
- /* @__PURE__ */ jsx("clipPath", { id: "clip4_20915_38670", children: /* @__PURE__ */ jsx(
12210
- "rect",
12211
- {
12212
- width: "12",
12213
- height: "12",
12214
- fill: "white",
12215
- transform: "matrix(0.865865 0.500278 -0.871576 0.490261 131.318 90.4594)"
12216
- }
12217
- ) }),
12218
- /* @__PURE__ */ jsx("clipPath", { id: "clip5_20915_38670", children: /* @__PURE__ */ jsx(
12219
- "rect",
12220
- {
12221
- width: "12",
12222
- height: "12",
12223
- fill: "white",
12224
- transform: "matrix(0.865865 0.500278 -0.871576 0.490261 141.709 96.4627)"
12225
- }
12226
- ) })
12227
- ] })
12228
- ]
12229
- }
12230
- );
12231
- };
12232
- const schema = objectType({
12233
- customer_id: stringType().min(1)
12234
- });
12235
- const STACKED_FOCUS_MODAL_ID = "shipping-form";
12236
- const Shipping = () => {
12237
- var _a;
12238
- const { id } = useParams();
12239
- const { order, isPending, isError, error } = useOrder(id, {
12240
- fields: "+items.*,+items.variant.*,+items.variant.product.*,+items.variant.product.shipping_profile.*,+currency_code"
12241
- });
12242
- const {
12243
- order: preview,
12244
- isPending: isPreviewPending,
12245
- isError: isPreviewError,
12246
- error: previewError
12247
- } = useOrderPreview(id);
12248
- useInitiateOrderEdit({ preview });
12249
- const { onCancel } = useCancelOrderEdit({ preview });
12250
- if (isError) {
12251
- throw error;
12252
- }
12253
- if (isPreviewError) {
12254
- throw previewError;
12255
- }
12256
- const orderHasItems = (((_a = order == null ? void 0 : order.items) == null ? void 0 : _a.length) || 0) > 0;
12257
- const isReady = preview && !isPreviewPending && order && !isPending;
12258
- return /* @__PURE__ */ jsx(RouteFocusModal, { onClose: onCancel, children: !orderHasItems ? /* @__PURE__ */ jsxs("div", { className: "flex h-full flex-col overflow-hidden ", children: [
12259
- /* @__PURE__ */ jsx(RouteFocusModal.Header, {}),
12260
- /* @__PURE__ */ jsx(RouteFocusModal.Body, { className: "flex flex-1 flex-col overflow-hidden", children: /* @__PURE__ */ jsx("div", { className: "flex flex-1 flex-col items-center overflow-y-auto", children: /* @__PURE__ */ jsxs("div", { className: "flex w-full max-w-[720px] flex-col gap-y-6 py-16 px-6", children: [
12261
- /* @__PURE__ */ jsx(RouteFocusModal.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Shipping" }) }),
12262
- /* @__PURE__ */ jsx(RouteFocusModal.Description, { asChild: true, children: /* @__PURE__ */ jsx(Text, { size: "small", className: "text-ui-fg-subtle", children: "This draft order currently has no items. Add items to the order before adding shipping." }) })
12263
- ] }) }) }),
12264
- /* @__PURE__ */ jsx(RouteFocusModal.Footer, { children: /* @__PURE__ */ jsx(RouteFocusModal.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", type: "button", children: "Cancel" }) }) })
12265
- ] }) : isReady ? /* @__PURE__ */ jsx(ShippingForm, { preview, order }) : /* @__PURE__ */ jsxs("div", { children: [
12266
- /* @__PURE__ */ jsx(RouteFocusModal.Title, { asChild: true, children: /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Edit Shipping" }) }),
12267
- /* @__PURE__ */ jsx(RouteFocusModal.Description, { asChild: true, children: /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Loading data for the draft order, please wait..." }) })
12268
- ] }) });
12269
- };
12270
- const ShippingForm = ({ preview, order }) => {
12271
- var _a;
12272
- const { setIsOpen } = useStackedModal();
12273
- const [isSubmitting, setIsSubmitting] = useState(false);
12274
- const [data, setData] = useState(null);
12275
- const appliedShippingOptionIds = (_a = preview.shipping_methods) == null ? void 0 : _a.map((method) => method.shipping_option_id).filter(Boolean);
12276
- const { shipping_options } = useShippingOptions(
11553
+ const schema$2 = objectType({
11554
+ sales_channel_id: stringType().min(1)
11555
+ });
11556
+ const STACKED_FOCUS_MODAL_ID = "shipping-form";
11557
+ const Shipping = () => {
11558
+ var _a;
11559
+ const { id } = useParams();
11560
+ const { order, isPending, isError, error } = useOrder(id, {
11561
+ fields: "+items.*,+items.variant.*,+items.variant.product.*,+items.variant.product.shipping_profile.*,+currency_code"
11562
+ });
11563
+ const {
11564
+ order: preview,
11565
+ isPending: isPreviewPending,
11566
+ isError: isPreviewError,
11567
+ error: previewError
11568
+ } = useOrderPreview(id);
11569
+ useInitiateOrderEdit({ preview });
11570
+ const { onCancel } = useCancelOrderEdit({ preview });
11571
+ if (isError) {
11572
+ throw error;
11573
+ }
11574
+ if (isPreviewError) {
11575
+ throw previewError;
11576
+ }
11577
+ const orderHasItems = (((_a = order == null ? void 0 : order.items) == null ? void 0 : _a.length) || 0) > 0;
11578
+ const isReady = preview && !isPreviewPending && order && !isPending;
11579
+ return /* @__PURE__ */ jsx(RouteFocusModal, { onClose: onCancel, children: !orderHasItems ? /* @__PURE__ */ jsxs("div", { className: "flex h-full flex-col overflow-hidden ", children: [
11580
+ /* @__PURE__ */ jsx(RouteFocusModal.Header, {}),
11581
+ /* @__PURE__ */ jsx(RouteFocusModal.Body, { className: "flex flex-1 flex-col overflow-hidden", children: /* @__PURE__ */ jsx("div", { className: "flex flex-1 flex-col items-center overflow-y-auto", children: /* @__PURE__ */ jsxs("div", { className: "flex w-full max-w-[720px] flex-col gap-y-6 py-16 px-6", children: [
11582
+ /* @__PURE__ */ jsx(RouteFocusModal.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Shipping" }) }),
11583
+ /* @__PURE__ */ jsx(RouteFocusModal.Description, { asChild: true, children: /* @__PURE__ */ jsx(Text, { size: "small", className: "text-ui-fg-subtle", children: "This draft order currently has no items. Add items to the order before adding shipping." }) })
11584
+ ] }) }) }),
11585
+ /* @__PURE__ */ jsx(RouteFocusModal.Footer, { children: /* @__PURE__ */ jsx(RouteFocusModal.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", type: "button", children: "Cancel" }) }) })
11586
+ ] }) : isReady ? /* @__PURE__ */ jsx(ShippingForm, { preview, order }) : /* @__PURE__ */ jsxs("div", { children: [
11587
+ /* @__PURE__ */ jsx(RouteFocusModal.Title, { asChild: true, children: /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Edit Shipping" }) }),
11588
+ /* @__PURE__ */ jsx(RouteFocusModal.Description, { asChild: true, children: /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Loading data for the draft order, please wait..." }) })
11589
+ ] }) });
11590
+ };
11591
+ const ShippingForm = ({ preview, order }) => {
11592
+ var _a;
11593
+ const { setIsOpen } = useStackedModal();
11594
+ const [isSubmitting, setIsSubmitting] = useState(false);
11595
+ const [data, setData] = useState(null);
11596
+ const appliedShippingOptionIds = (_a = preview.shipping_methods) == null ? void 0 : _a.map((method) => method.shipping_option_id).filter(Boolean);
11597
+ const { shipping_options } = useShippingOptions(
12277
11598
  {
12278
11599
  id: appliedShippingOptionIds,
12279
11600
  fields: "+service_zone.*,+service_zone.fulfillment_set.*,+service_zone.fulfillment_set.location.*"
@@ -12620,425 +11941,1104 @@ const ShippingForm = ({ preview, order }) => {
12620
11941
  );
12621
11942
  }) })
12622
11943
  ] }) })
12623
- ] }) }),
12624
- /* @__PURE__ */ jsx(
12625
- StackedFocusModal,
11944
+ ] }) }),
11945
+ /* @__PURE__ */ jsx(
11946
+ StackedFocusModal,
11947
+ {
11948
+ id: STACKED_FOCUS_MODAL_ID,
11949
+ onOpenChangeCallback: (open) => {
11950
+ if (!open) {
11951
+ setData(null);
11952
+ }
11953
+ return open;
11954
+ },
11955
+ children: data && /* @__PURE__ */ jsx(ShippingProfileForm, { data, order, preview })
11956
+ }
11957
+ )
11958
+ ] }),
11959
+ /* @__PURE__ */ jsx(RouteFocusModal.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex justify-end gap-x-2", children: [
11960
+ /* @__PURE__ */ jsx(RouteFocusModal.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", type: "button", children: "Cancel" }) }),
11961
+ /* @__PURE__ */ jsx(
11962
+ Button,
11963
+ {
11964
+ size: "small",
11965
+ type: "button",
11966
+ isLoading: isSubmitting,
11967
+ onClick: onSubmit,
11968
+ children: "Save"
11969
+ }
11970
+ )
11971
+ ] }) })
11972
+ ] });
11973
+ };
11974
+ const StackedModalTrigger = ({
11975
+ shippingProfileId,
11976
+ shippingOption,
11977
+ shippingMethod,
11978
+ setData,
11979
+ children
11980
+ }) => {
11981
+ const { setIsOpen, getIsOpen } = useStackedModal();
11982
+ const isOpen = getIsOpen(STACKED_FOCUS_MODAL_ID);
11983
+ const onToggle = () => {
11984
+ if (isOpen) {
11985
+ setIsOpen(STACKED_FOCUS_MODAL_ID, false);
11986
+ setData(null);
11987
+ } else {
11988
+ setIsOpen(STACKED_FOCUS_MODAL_ID, true);
11989
+ setData({
11990
+ shippingProfileId,
11991
+ shippingOption,
11992
+ shippingMethod
11993
+ });
11994
+ }
11995
+ };
11996
+ return /* @__PURE__ */ jsx(
11997
+ Button,
11998
+ {
11999
+ size: "small",
12000
+ variant: "secondary",
12001
+ onClick: onToggle,
12002
+ className: "text-ui-fg-primary shrink-0",
12003
+ children
12004
+ }
12005
+ );
12006
+ };
12007
+ const ShippingProfileForm = ({
12008
+ data,
12009
+ order,
12010
+ preview
12011
+ }) => {
12012
+ var _a, _b, _c, _d, _e, _f;
12013
+ const { setIsOpen } = useStackedModal();
12014
+ const form = useForm({
12015
+ resolver: zodResolver(shippingMethodSchema),
12016
+ defaultValues: {
12017
+ location_id: (_d = (_c = (_b = (_a = data.shippingOption) == null ? void 0 : _a.service_zone) == null ? void 0 : _b.fulfillment_set) == null ? void 0 : _c.location) == null ? void 0 : _d.id,
12018
+ shipping_option_id: (_e = data.shippingOption) == null ? void 0 : _e.id,
12019
+ custom_amount: (_f = data.shippingMethod) == null ? void 0 : _f.amount
12020
+ }
12021
+ });
12022
+ const { mutateAsync: addShippingMethod, isPending } = useDraftOrderAddShippingMethod(order.id);
12023
+ const {
12024
+ mutateAsync: updateShippingMethod,
12025
+ isPending: isUpdatingShippingMethod
12026
+ } = useDraftOrderUpdateShippingMethod(order.id);
12027
+ const onSubmit = form.handleSubmit(async (values) => {
12028
+ if (isEqual(values, form.formState.defaultValues)) {
12029
+ setIsOpen(STACKED_FOCUS_MODAL_ID, false);
12030
+ return;
12031
+ }
12032
+ if (data.shippingMethod) {
12033
+ await updateShippingMethod(
12034
+ {
12035
+ method_id: data.shippingMethod.id,
12036
+ shipping_option_id: values.shipping_option_id,
12037
+ custom_amount: values.custom_amount ? convertNumber(values.custom_amount) : void 0
12038
+ },
12039
+ {
12040
+ onError: (e) => {
12041
+ toast.error(e.message);
12042
+ },
12043
+ onSuccess: () => {
12044
+ setIsOpen(STACKED_FOCUS_MODAL_ID, false);
12045
+ }
12046
+ }
12047
+ );
12048
+ return;
12049
+ }
12050
+ await addShippingMethod(
12051
+ {
12052
+ shipping_option_id: values.shipping_option_id,
12053
+ custom_amount: values.custom_amount ? convertNumber(values.custom_amount) : void 0
12054
+ },
12055
+ {
12056
+ onError: (e) => {
12057
+ toast.error(e.message);
12058
+ },
12059
+ onSuccess: () => {
12060
+ setIsOpen(STACKED_FOCUS_MODAL_ID, false);
12061
+ }
12062
+ }
12063
+ );
12064
+ });
12065
+ return /* @__PURE__ */ jsx(StackedFocusModal.Content, { children: /* @__PURE__ */ jsx(Form$2, { ...form, children: /* @__PURE__ */ jsxs(
12066
+ KeyboundForm,
12067
+ {
12068
+ className: "flex h-full flex-col overflow-hidden",
12069
+ onSubmit,
12070
+ children: [
12071
+ /* @__PURE__ */ jsx(StackedFocusModal.Header, {}),
12072
+ /* @__PURE__ */ jsx(StackedFocusModal.Body, { className: "flex flex-1 flex-col overflow-hidden", children: /* @__PURE__ */ jsx("div", { className: "flex flex-1 flex-col items-center overflow-y-auto", children: /* @__PURE__ */ jsxs("div", { className: "flex w-full max-w-[720px] flex-col gap-y-6 py-16 px-6", children: [
12073
+ /* @__PURE__ */ jsxs("div", { children: [
12074
+ /* @__PURE__ */ jsx(RouteFocusModal.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Shipping" }) }),
12075
+ /* @__PURE__ */ jsx(RouteFocusModal.Description, { asChild: true, children: /* @__PURE__ */ jsx(Text, { size: "small", className: "text-ui-fg-subtle", children: "Add a shipping method for the selected shipping profile. You can see the items that will be shipped using this method in the preview below." }) })
12076
+ ] }),
12077
+ /* @__PURE__ */ jsx(Divider, { variant: "dashed" }),
12078
+ /* @__PURE__ */ jsx(
12079
+ LocationField,
12080
+ {
12081
+ control: form.control,
12082
+ setValue: form.setValue
12083
+ }
12084
+ ),
12085
+ /* @__PURE__ */ jsx(Divider, { variant: "dashed" }),
12086
+ /* @__PURE__ */ jsx(
12087
+ ShippingOptionField,
12088
+ {
12089
+ shippingProfileId: data.shippingProfileId,
12090
+ preview,
12091
+ control: form.control
12092
+ }
12093
+ ),
12094
+ /* @__PURE__ */ jsx(Divider, { variant: "dashed" }),
12095
+ /* @__PURE__ */ jsx(
12096
+ CustomAmountField,
12097
+ {
12098
+ control: form.control,
12099
+ currencyCode: order.currency_code
12100
+ }
12101
+ ),
12102
+ /* @__PURE__ */ jsx(Divider, { variant: "dashed" }),
12103
+ /* @__PURE__ */ jsx(
12104
+ ItemsPreview,
12105
+ {
12106
+ order,
12107
+ shippingProfileId: data.shippingProfileId
12108
+ }
12109
+ )
12110
+ ] }) }) }),
12111
+ /* @__PURE__ */ jsx(StackedFocusModal.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex justify-end gap-x-2", children: [
12112
+ /* @__PURE__ */ jsx(StackedFocusModal.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", type: "button", children: "Cancel" }) }),
12113
+ /* @__PURE__ */ jsx(
12114
+ Button,
12115
+ {
12116
+ size: "small",
12117
+ type: "submit",
12118
+ isLoading: isPending || isUpdatingShippingMethod,
12119
+ children: data.shippingMethod ? "Update" : "Add"
12120
+ }
12121
+ )
12122
+ ] }) })
12123
+ ]
12124
+ }
12125
+ ) }) });
12126
+ };
12127
+ const shippingMethodSchema = objectType({
12128
+ location_id: stringType(),
12129
+ shipping_option_id: stringType(),
12130
+ custom_amount: unionType([numberType(), stringType()]).optional()
12131
+ });
12132
+ const ItemsPreview = ({ order, shippingProfileId }) => {
12133
+ const matches = order.items.filter(
12134
+ (item) => {
12135
+ var _a, _b, _c;
12136
+ return ((_c = (_b = (_a = item.variant) == null ? void 0 : _a.product) == null ? void 0 : _b.shipping_profile) == null ? void 0 : _c.id) === shippingProfileId;
12137
+ }
12138
+ );
12139
+ return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-y-6", children: [
12140
+ /* @__PURE__ */ jsx("div", { className: "grid grid-cols-2 items-center gap-3", children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
12141
+ /* @__PURE__ */ jsx(Text, { size: "small", weight: "plus", leading: "compact", children: "Items to ship" }),
12142
+ /* @__PURE__ */ jsx(Text, { size: "small", className: "text-ui-fg-subtle", children: "Items with the selected shipping profile." })
12143
+ ] }) }),
12144
+ /* @__PURE__ */ jsxs("div", { className: "bg-ui-bg-subtle shadow-elevation-card-rest rounded-xl", children: [
12145
+ /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-3 px-4 py-2 text-ui-fg-muted", children: [
12146
+ /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(Text, { size: "small", weight: "plus", children: "Item" }) }),
12147
+ /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(Text, { size: "small", weight: "plus", children: "Quantity" }) })
12148
+ ] }),
12149
+ /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-y-1.5 px-[5px] pb-[5px]", children: matches.length > 0 ? matches == null ? void 0 : matches.map((item) => /* @__PURE__ */ jsxs(
12150
+ "div",
12626
12151
  {
12627
- id: STACKED_FOCUS_MODAL_ID,
12628
- onOpenChangeCallback: (open) => {
12629
- if (!open) {
12630
- setData(null);
12152
+ className: "grid grid-cols-2 gap-3 px-4 py-2 bg-ui-bg-base shadow-elevation-card-rest rounded-lg items-center",
12153
+ children: [
12154
+ /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-x-3", children: [
12155
+ /* @__PURE__ */ jsx(
12156
+ Thumbnail,
12157
+ {
12158
+ thumbnail: item.thumbnail,
12159
+ alt: item.product_title ?? void 0
12160
+ }
12161
+ ),
12162
+ /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
12163
+ /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-x-1", children: [
12164
+ /* @__PURE__ */ jsx(Text, { size: "small", weight: "plus", leading: "compact", children: item.product_title }),
12165
+ /* @__PURE__ */ jsxs(
12166
+ Text,
12167
+ {
12168
+ size: "small",
12169
+ leading: "compact",
12170
+ className: "text-ui-fg-subtle",
12171
+ children: [
12172
+ "(",
12173
+ item.variant_title,
12174
+ ")"
12175
+ ]
12176
+ }
12177
+ )
12178
+ ] }),
12179
+ /* @__PURE__ */ jsx(
12180
+ Text,
12181
+ {
12182
+ size: "small",
12183
+ leading: "compact",
12184
+ className: "text-ui-fg-subtle",
12185
+ children: item.variant_sku
12186
+ }
12187
+ )
12188
+ ] })
12189
+ ] }),
12190
+ /* @__PURE__ */ jsxs(
12191
+ Text,
12192
+ {
12193
+ size: "small",
12194
+ leading: "compact",
12195
+ className: "text-ui-fg-subtle",
12196
+ children: [
12197
+ item.quantity,
12198
+ "x"
12199
+ ]
12200
+ }
12201
+ )
12202
+ ]
12203
+ },
12204
+ item.id
12205
+ )) : /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-center gap-x-3 bg-ui-bg-base rounded-lg p-4 shadow-elevation-card-rest flex-col gap-1", children: [
12206
+ /* @__PURE__ */ jsx(Text, { size: "small", weight: "plus", leading: "compact", children: "No items found" }),
12207
+ /* @__PURE__ */ jsxs(Text, { size: "small", className: "text-ui-fg-subtle", children: [
12208
+ 'No items found for "',
12209
+ query,
12210
+ '".'
12211
+ ] })
12212
+ ] }) })
12213
+ ] })
12214
+ ] });
12215
+ };
12216
+ const LocationField = ({ control, setValue }) => {
12217
+ const locations = useComboboxData({
12218
+ queryKey: ["locations"],
12219
+ queryFn: async (params) => {
12220
+ return await sdk.admin.stockLocation.list(params);
12221
+ },
12222
+ getOptions: (data) => {
12223
+ return data.stock_locations.map((location) => ({
12224
+ label: location.name,
12225
+ value: location.id
12226
+ }));
12227
+ }
12228
+ });
12229
+ return /* @__PURE__ */ jsx(
12230
+ Form$2.Field,
12231
+ {
12232
+ control,
12233
+ name: "location_id",
12234
+ render: ({ field: { onChange, ...field } }) => {
12235
+ return /* @__PURE__ */ jsx(Form$2.Item, { children: /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-x-3", children: [
12236
+ /* @__PURE__ */ jsxs("div", { children: [
12237
+ /* @__PURE__ */ jsx(Form$2.Label, { children: "Location" }),
12238
+ /* @__PURE__ */ jsx(Form$2.Hint, { children: "Choose where you want to ship the items from." })
12239
+ ] }),
12240
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(
12241
+ Combobox,
12242
+ {
12243
+ options: locations.options,
12244
+ fetchNextPage: locations.fetchNextPage,
12245
+ isFetchingNextPage: locations.isFetchingNextPage,
12246
+ searchValue: locations.searchValue,
12247
+ onSearchValueChange: locations.onSearchValueChange,
12248
+ placeholder: "Select location",
12249
+ onChange: (value) => {
12250
+ setValue("shipping_option_id", "", {
12251
+ shouldDirty: true,
12252
+ shouldTouch: true
12253
+ });
12254
+ onChange(value);
12255
+ },
12256
+ ...field
12631
12257
  }
12632
- return open;
12633
- },
12634
- children: data && /* @__PURE__ */ jsx(ShippingProfileForm, { data, order, preview })
12635
- }
12636
- )
12637
- ] }),
12638
- /* @__PURE__ */ jsx(RouteFocusModal.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex justify-end gap-x-2", children: [
12639
- /* @__PURE__ */ jsx(RouteFocusModal.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", type: "button", children: "Cancel" }) }),
12640
- /* @__PURE__ */ jsx(
12641
- Button,
12642
- {
12643
- size: "small",
12644
- type: "button",
12645
- isLoading: isSubmitting,
12646
- onClick: onSubmit,
12647
- children: "Save"
12258
+ ) })
12259
+ ] }) });
12260
+ }
12261
+ }
12262
+ );
12263
+ };
12264
+ const ShippingOptionField = ({
12265
+ shippingProfileId,
12266
+ preview,
12267
+ control
12268
+ }) => {
12269
+ var _a;
12270
+ const locationId = useWatch({ control, name: "location_id" });
12271
+ const shippingOptions = useComboboxData({
12272
+ queryKey: ["shipping_options", locationId, shippingProfileId],
12273
+ queryFn: async (params) => {
12274
+ return await sdk.admin.shippingOption.list({
12275
+ ...params,
12276
+ stock_location_id: locationId,
12277
+ shipping_profile_id: shippingProfileId
12278
+ });
12279
+ },
12280
+ getOptions: (data) => {
12281
+ return data.shipping_options.map((option) => {
12282
+ var _a2;
12283
+ if ((_a2 = option.rules) == null ? void 0 : _a2.find(
12284
+ (r) => r.attribute === "is_return" && r.value === "true"
12285
+ )) {
12286
+ return void 0;
12648
12287
  }
12649
- )
12650
- ] }) })
12651
- ] });
12288
+ return {
12289
+ label: option.name,
12290
+ value: option.id
12291
+ };
12292
+ }).filter(Boolean);
12293
+ },
12294
+ enabled: !!locationId && !!shippingProfileId,
12295
+ defaultValue: ((_a = preview.shipping_methods[0]) == null ? void 0 : _a.shipping_option_id) || void 0
12296
+ });
12297
+ const tooltipContent = !locationId && !shippingProfileId ? "Choose a location and shipping profile first." : !locationId ? "Choose a location first." : "Choose a shipping profile first.";
12298
+ return /* @__PURE__ */ jsx(
12299
+ Form$2.Field,
12300
+ {
12301
+ control,
12302
+ name: "shipping_option_id",
12303
+ render: ({ field }) => {
12304
+ return /* @__PURE__ */ jsx(Form$2.Item, { children: /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-x-3", children: [
12305
+ /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
12306
+ /* @__PURE__ */ jsx(Form$2.Label, { children: "Shipping option" }),
12307
+ /* @__PURE__ */ jsx(Form$2.Hint, { children: "Choose the shipping option to use." })
12308
+ ] }),
12309
+ /* @__PURE__ */ jsx(
12310
+ ConditionalTooltip,
12311
+ {
12312
+ content: tooltipContent,
12313
+ showTooltip: !locationId || !shippingProfileId,
12314
+ children: /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(
12315
+ Combobox,
12316
+ {
12317
+ options: shippingOptions.options,
12318
+ fetchNextPage: shippingOptions.fetchNextPage,
12319
+ isFetchingNextPage: shippingOptions.isFetchingNextPage,
12320
+ searchValue: shippingOptions.searchValue,
12321
+ onSearchValueChange: shippingOptions.onSearchValueChange,
12322
+ placeholder: "Select shipping option",
12323
+ ...field,
12324
+ disabled: !locationId || !shippingProfileId
12325
+ }
12326
+ ) }) })
12327
+ }
12328
+ )
12329
+ ] }) });
12330
+ }
12331
+ }
12332
+ );
12652
12333
  };
12653
- const StackedModalTrigger = ({
12654
- shippingProfileId,
12655
- shippingOption,
12656
- shippingMethod,
12657
- setData,
12658
- children
12334
+ const CustomAmountField = ({
12335
+ control,
12336
+ currencyCode
12659
12337
  }) => {
12660
- const { setIsOpen, getIsOpen } = useStackedModal();
12661
- const isOpen = getIsOpen(STACKED_FOCUS_MODAL_ID);
12662
- const onToggle = () => {
12663
- if (isOpen) {
12664
- setIsOpen(STACKED_FOCUS_MODAL_ID, false);
12665
- setData(null);
12666
- } else {
12667
- setIsOpen(STACKED_FOCUS_MODAL_ID, true);
12668
- setData({
12669
- shippingProfileId,
12670
- shippingOption,
12671
- shippingMethod
12672
- });
12673
- }
12674
- };
12675
12338
  return /* @__PURE__ */ jsx(
12676
- Button,
12339
+ Form$2.Field,
12677
12340
  {
12678
- size: "small",
12679
- variant: "secondary",
12680
- onClick: onToggle,
12681
- className: "text-ui-fg-primary shrink-0",
12682
- children
12341
+ control,
12342
+ name: "custom_amount",
12343
+ render: ({ field: { onChange, ...field } }) => {
12344
+ return /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-x-3", children: [
12345
+ /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
12346
+ /* @__PURE__ */ jsx(Form$2.Label, { optional: true, children: "Custom amount" }),
12347
+ /* @__PURE__ */ jsx(Form$2.Hint, { children: "Set a custom amount for the shipping option." })
12348
+ ] }),
12349
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(
12350
+ CurrencyInput,
12351
+ {
12352
+ ...field,
12353
+ onValueChange: (value) => onChange(value),
12354
+ symbol: getNativeSymbol(currencyCode),
12355
+ code: currencyCode
12356
+ }
12357
+ ) })
12358
+ ] });
12359
+ }
12683
12360
  }
12684
12361
  );
12685
12362
  };
12686
- const ShippingProfileForm = ({
12687
- data,
12688
- order,
12689
- preview
12690
- }) => {
12691
- var _a, _b, _c, _d, _e, _f;
12692
- const { setIsOpen } = useStackedModal();
12363
+ const ShippingAddress = () => {
12364
+ const { id } = useParams();
12365
+ const { order, isPending, isError, error } = useOrder(id, {
12366
+ fields: "+shipping_address"
12367
+ });
12368
+ if (isError) {
12369
+ throw error;
12370
+ }
12371
+ const isReady = !isPending && !!order;
12372
+ return /* @__PURE__ */ jsxs(RouteDrawer, { children: [
12373
+ /* @__PURE__ */ jsxs(RouteDrawer.Header, { children: [
12374
+ /* @__PURE__ */ jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Edit Shipping Address" }) }),
12375
+ /* @__PURE__ */ jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Edit the shipping address for the draft order" }) })
12376
+ ] }),
12377
+ isReady && /* @__PURE__ */ jsx(ShippingAddressForm, { order })
12378
+ ] });
12379
+ };
12380
+ const ShippingAddressForm = ({ order }) => {
12381
+ var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
12382
+ const form = useForm({
12383
+ defaultValues: {
12384
+ first_name: ((_a = order.shipping_address) == null ? void 0 : _a.first_name) ?? "",
12385
+ last_name: ((_b = order.shipping_address) == null ? void 0 : _b.last_name) ?? "",
12386
+ company: ((_c = order.shipping_address) == null ? void 0 : _c.company) ?? "",
12387
+ address_1: ((_d = order.shipping_address) == null ? void 0 : _d.address_1) ?? "",
12388
+ address_2: ((_e = order.shipping_address) == null ? void 0 : _e.address_2) ?? "",
12389
+ city: ((_f = order.shipping_address) == null ? void 0 : _f.city) ?? "",
12390
+ province: ((_g = order.shipping_address) == null ? void 0 : _g.province) ?? "",
12391
+ country_code: ((_h = order.shipping_address) == null ? void 0 : _h.country_code) ?? "",
12392
+ postal_code: ((_i = order.shipping_address) == null ? void 0 : _i.postal_code) ?? "",
12393
+ phone: ((_j = order.shipping_address) == null ? void 0 : _j.phone) ?? ""
12394
+ },
12395
+ resolver: zodResolver(schema$1)
12396
+ });
12397
+ const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
12398
+ const { handleSuccess } = useRouteModal();
12399
+ const onSubmit = form.handleSubmit(async (data) => {
12400
+ await mutateAsync(
12401
+ {
12402
+ shipping_address: {
12403
+ first_name: data.first_name,
12404
+ last_name: data.last_name,
12405
+ company: data.company,
12406
+ address_1: data.address_1,
12407
+ address_2: data.address_2,
12408
+ city: data.city,
12409
+ province: data.province,
12410
+ country_code: data.country_code,
12411
+ postal_code: data.postal_code,
12412
+ phone: data.phone
12413
+ }
12414
+ },
12415
+ {
12416
+ onSuccess: () => {
12417
+ handleSuccess();
12418
+ },
12419
+ onError: (error) => {
12420
+ toast.error(error.message);
12421
+ }
12422
+ }
12423
+ );
12424
+ });
12425
+ return /* @__PURE__ */ jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxs(
12426
+ KeyboundForm,
12427
+ {
12428
+ className: "flex flex-1 flex-col overflow-hidden",
12429
+ onSubmit,
12430
+ children: [
12431
+ /* @__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: [
12432
+ /* @__PURE__ */ jsx(
12433
+ Form$2.Field,
12434
+ {
12435
+ control: form.control,
12436
+ name: "country_code",
12437
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
12438
+ /* @__PURE__ */ jsx(Form$2.Label, { children: "Country" }),
12439
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(CountrySelect, { ...field }) }),
12440
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
12441
+ ] })
12442
+ }
12443
+ ),
12444
+ /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
12445
+ /* @__PURE__ */ jsx(
12446
+ Form$2.Field,
12447
+ {
12448
+ control: form.control,
12449
+ name: "first_name",
12450
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
12451
+ /* @__PURE__ */ jsx(Form$2.Label, { children: "First name" }),
12452
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
12453
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
12454
+ ] })
12455
+ }
12456
+ ),
12457
+ /* @__PURE__ */ jsx(
12458
+ Form$2.Field,
12459
+ {
12460
+ control: form.control,
12461
+ name: "last_name",
12462
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
12463
+ /* @__PURE__ */ jsx(Form$2.Label, { children: "Last name" }),
12464
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
12465
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
12466
+ ] })
12467
+ }
12468
+ )
12469
+ ] }),
12470
+ /* @__PURE__ */ jsx(
12471
+ Form$2.Field,
12472
+ {
12473
+ control: form.control,
12474
+ name: "company",
12475
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
12476
+ /* @__PURE__ */ jsx(Form$2.Label, { optional: true, children: "Company" }),
12477
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
12478
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
12479
+ ] })
12480
+ }
12481
+ ),
12482
+ /* @__PURE__ */ jsx(
12483
+ Form$2.Field,
12484
+ {
12485
+ control: form.control,
12486
+ name: "address_1",
12487
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
12488
+ /* @__PURE__ */ jsx(Form$2.Label, { children: "Address" }),
12489
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
12490
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
12491
+ ] })
12492
+ }
12493
+ ),
12494
+ /* @__PURE__ */ jsx(
12495
+ Form$2.Field,
12496
+ {
12497
+ control: form.control,
12498
+ name: "address_2",
12499
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
12500
+ /* @__PURE__ */ jsx(Form$2.Label, { optional: true, children: "Apartment, suite, etc." }),
12501
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
12502
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
12503
+ ] })
12504
+ }
12505
+ ),
12506
+ /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
12507
+ /* @__PURE__ */ jsx(
12508
+ Form$2.Field,
12509
+ {
12510
+ control: form.control,
12511
+ name: "postal_code",
12512
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
12513
+ /* @__PURE__ */ jsx(Form$2.Label, { children: "Postal code" }),
12514
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
12515
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
12516
+ ] })
12517
+ }
12518
+ ),
12519
+ /* @__PURE__ */ jsx(
12520
+ Form$2.Field,
12521
+ {
12522
+ control: form.control,
12523
+ name: "city",
12524
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
12525
+ /* @__PURE__ */ jsx(Form$2.Label, { children: "City" }),
12526
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
12527
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
12528
+ ] })
12529
+ }
12530
+ )
12531
+ ] }),
12532
+ /* @__PURE__ */ jsx(
12533
+ Form$2.Field,
12534
+ {
12535
+ control: form.control,
12536
+ name: "province",
12537
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
12538
+ /* @__PURE__ */ jsx(Form$2.Label, { optional: true, children: "Province / State" }),
12539
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
12540
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
12541
+ ] })
12542
+ }
12543
+ ),
12544
+ /* @__PURE__ */ jsx(
12545
+ Form$2.Field,
12546
+ {
12547
+ control: form.control,
12548
+ name: "phone",
12549
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
12550
+ /* @__PURE__ */ jsx(Form$2.Label, { optional: true, children: "Phone" }),
12551
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
12552
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
12553
+ ] })
12554
+ }
12555
+ )
12556
+ ] }) }),
12557
+ /* @__PURE__ */ jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex justify-end gap-2", children: [
12558
+ /* @__PURE__ */ jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
12559
+ /* @__PURE__ */ jsx(Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
12560
+ ] }) })
12561
+ ]
12562
+ }
12563
+ ) });
12564
+ };
12565
+ const schema$1 = addressSchema;
12566
+ const TransferOwnership = () => {
12567
+ const { id } = useParams();
12568
+ const { draft_order, isPending, isError, error } = useDraftOrder(id, {
12569
+ fields: "id,customer_id,customer.*"
12570
+ });
12571
+ if (isError) {
12572
+ throw error;
12573
+ }
12574
+ const isReady = !isPending && !!draft_order;
12575
+ return /* @__PURE__ */ jsxs(RouteDrawer, { children: [
12576
+ /* @__PURE__ */ jsxs(RouteDrawer.Header, { children: [
12577
+ /* @__PURE__ */ jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Transfer Ownership" }) }),
12578
+ /* @__PURE__ */ jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Transfer the ownership of this draft order to a new customer" }) })
12579
+ ] }),
12580
+ isReady && /* @__PURE__ */ jsx(TransferOwnershipForm, { order: draft_order })
12581
+ ] });
12582
+ };
12583
+ const TransferOwnershipForm = ({ order }) => {
12584
+ var _a, _b;
12693
12585
  const form = useForm({
12694
- resolver: zodResolver(shippingMethodSchema),
12695
12586
  defaultValues: {
12696
- location_id: (_d = (_c = (_b = (_a = data.shippingOption) == null ? void 0 : _a.service_zone) == null ? void 0 : _b.fulfillment_set) == null ? void 0 : _c.location) == null ? void 0 : _d.id,
12697
- shipping_option_id: (_e = data.shippingOption) == null ? void 0 : _e.id,
12698
- custom_amount: (_f = data.shippingMethod) == null ? void 0 : _f.amount
12699
- }
12587
+ customer_id: order.customer_id || ""
12588
+ },
12589
+ resolver: zodResolver(schema)
12700
12590
  });
12701
- const { mutateAsync: addShippingMethod, isPending } = useDraftOrderAddShippingMethod(order.id);
12702
- const {
12703
- mutateAsync: updateShippingMethod,
12704
- isPending: isUpdatingShippingMethod
12705
- } = useDraftOrderUpdateShippingMethod(order.id);
12706
- const onSubmit = form.handleSubmit(async (values) => {
12707
- if (isEqual(values, form.formState.defaultValues)) {
12708
- setIsOpen(STACKED_FOCUS_MODAL_ID, false);
12709
- return;
12710
- }
12711
- if (data.shippingMethod) {
12712
- await updateShippingMethod(
12713
- {
12714
- method_id: data.shippingMethod.id,
12715
- shipping_option_id: values.shipping_option_id,
12716
- custom_amount: values.custom_amount ? convertNumber(values.custom_amount) : void 0
12717
- },
12718
- {
12719
- onError: (e) => {
12720
- toast.error(e.message);
12721
- },
12722
- onSuccess: () => {
12723
- setIsOpen(STACKED_FOCUS_MODAL_ID, false);
12724
- }
12725
- }
12726
- );
12727
- return;
12728
- }
12729
- await addShippingMethod(
12730
- {
12731
- shipping_option_id: values.shipping_option_id,
12732
- custom_amount: values.custom_amount ? convertNumber(values.custom_amount) : void 0
12733
- },
12591
+ const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
12592
+ const { handleSuccess } = useRouteModal();
12593
+ const name = [(_a = order.customer) == null ? void 0 : _a.first_name, (_b = order.customer) == null ? void 0 : _b.last_name].filter(Boolean).join(" ");
12594
+ const currentCustomer = order.customer ? {
12595
+ label: name ? `${name} (${order.customer.email})` : order.customer.email,
12596
+ value: order.customer.id
12597
+ } : null;
12598
+ const onSubmit = form.handleSubmit(async (data) => {
12599
+ await mutateAsync(
12600
+ { customer_id: data.customer_id },
12734
12601
  {
12735
- onError: (e) => {
12736
- toast.error(e.message);
12737
- },
12738
12602
  onSuccess: () => {
12739
- setIsOpen(STACKED_FOCUS_MODAL_ID, false);
12603
+ toast.success("Customer updated");
12604
+ handleSuccess();
12605
+ },
12606
+ onError: (error) => {
12607
+ toast.error(error.message);
12740
12608
  }
12741
12609
  }
12742
12610
  );
12743
12611
  });
12744
- return /* @__PURE__ */ jsx(StackedFocusModal.Content, { children: /* @__PURE__ */ jsx(Form$2, { ...form, children: /* @__PURE__ */ jsxs(
12612
+ return /* @__PURE__ */ jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxs(
12745
12613
  KeyboundForm,
12746
12614
  {
12747
- className: "flex h-full flex-col overflow-hidden",
12615
+ className: "flex flex-1 flex-col overflow-hidden",
12748
12616
  onSubmit,
12749
12617
  children: [
12750
- /* @__PURE__ */ jsx(StackedFocusModal.Header, {}),
12751
- /* @__PURE__ */ jsx(StackedFocusModal.Body, { className: "flex flex-1 flex-col overflow-hidden", children: /* @__PURE__ */ jsx("div", { className: "flex flex-1 flex-col items-center overflow-y-auto", children: /* @__PURE__ */ jsxs("div", { className: "flex w-full max-w-[720px] flex-col gap-y-6 py-16 px-6", children: [
12752
- /* @__PURE__ */ jsxs("div", { children: [
12753
- /* @__PURE__ */ jsx(RouteFocusModal.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Shipping" }) }),
12754
- /* @__PURE__ */ jsx(RouteFocusModal.Description, { asChild: true, children: /* @__PURE__ */ jsx(Text, { size: "small", className: "text-ui-fg-subtle", children: "Add a shipping method for the selected shipping profile. You can see the items that will be shipped using this method in the preview below." }) })
12618
+ /* @__PURE__ */ jsxs(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: [
12619
+ /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center bg-ui-bg-component rounded-md border", children: /* @__PURE__ */ jsx(Illustration, {}) }),
12620
+ currentCustomer && /* @__PURE__ */ jsxs("div", { className: "flex flex-col space-y-3", children: [
12621
+ /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
12622
+ /* @__PURE__ */ jsx(Label$1, { size: "small", weight: "plus", htmlFor: "current-customer", children: "Current owner" }),
12623
+ /* @__PURE__ */ jsx(Hint$1, { children: "The customer that is currently associated with this draft order." })
12624
+ ] }),
12625
+ /* @__PURE__ */ jsxs(Select, { disabled: true, value: currentCustomer.value, children: [
12626
+ /* @__PURE__ */ jsx(Select.Trigger, { id: "current-customer", children: /* @__PURE__ */ jsx(Select.Value, {}) }),
12627
+ /* @__PURE__ */ jsx(Select.Content, { children: /* @__PURE__ */ jsx(Select.Item, { value: currentCustomer.value, children: currentCustomer.label }) })
12628
+ ] })
12755
12629
  ] }),
12756
- /* @__PURE__ */ jsx(Divider, { variant: "dashed" }),
12757
- /* @__PURE__ */ jsx(
12758
- LocationField,
12759
- {
12760
- control: form.control,
12761
- setValue: form.setValue
12762
- }
12763
- ),
12764
- /* @__PURE__ */ jsx(Divider, { variant: "dashed" }),
12765
- /* @__PURE__ */ jsx(
12766
- ShippingOptionField,
12767
- {
12768
- shippingProfileId: data.shippingProfileId,
12769
- preview,
12770
- control: form.control
12771
- }
12772
- ),
12773
- /* @__PURE__ */ jsx(Divider, { variant: "dashed" }),
12774
12630
  /* @__PURE__ */ jsx(
12775
- CustomAmountField,
12631
+ CustomerField,
12776
12632
  {
12777
12633
  control: form.control,
12778
- currencyCode: order.currency_code
12779
- }
12780
- ),
12781
- /* @__PURE__ */ jsx(Divider, { variant: "dashed" }),
12782
- /* @__PURE__ */ jsx(
12783
- ItemsPreview,
12784
- {
12785
- order,
12786
- shippingProfileId: data.shippingProfileId
12787
- }
12788
- )
12789
- ] }) }) }),
12790
- /* @__PURE__ */ jsx(StackedFocusModal.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex justify-end gap-x-2", children: [
12791
- /* @__PURE__ */ jsx(StackedFocusModal.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", type: "button", children: "Cancel" }) }),
12792
- /* @__PURE__ */ jsx(
12793
- Button,
12794
- {
12795
- size: "small",
12796
- type: "submit",
12797
- isLoading: isPending || isUpdatingShippingMethod,
12798
- children: data.shippingMethod ? "Update" : "Add"
12634
+ currentCustomerId: order.customer_id
12799
12635
  }
12800
12636
  )
12637
+ ] }),
12638
+ /* @__PURE__ */ jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
12639
+ /* @__PURE__ */ jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { variant: "secondary", size: "small", children: "Cancel" }) }),
12640
+ /* @__PURE__ */ jsx(Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
12801
12641
  ] }) })
12802
12642
  ]
12803
12643
  }
12804
- ) }) });
12805
- };
12806
- const shippingMethodSchema = objectType({
12807
- location_id: stringType(),
12808
- shipping_option_id: stringType(),
12809
- custom_amount: unionType([numberType(), stringType()]).optional()
12810
- });
12811
- const ItemsPreview = ({ order, shippingProfileId }) => {
12812
- const matches = order.items.filter(
12813
- (item) => {
12814
- var _a, _b, _c;
12815
- return ((_c = (_b = (_a = item.variant) == null ? void 0 : _a.product) == null ? void 0 : _b.shipping_profile) == null ? void 0 : _c.id) === shippingProfileId;
12816
- }
12817
- );
12818
- return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-y-6", children: [
12819
- /* @__PURE__ */ jsx("div", { className: "grid grid-cols-2 items-center gap-3", children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
12820
- /* @__PURE__ */ jsx(Text, { size: "small", weight: "plus", leading: "compact", children: "Items to ship" }),
12821
- /* @__PURE__ */ jsx(Text, { size: "small", className: "text-ui-fg-subtle", children: "Items with the selected shipping profile." })
12822
- ] }) }),
12823
- /* @__PURE__ */ jsxs("div", { className: "bg-ui-bg-subtle shadow-elevation-card-rest rounded-xl", children: [
12824
- /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-3 px-4 py-2 text-ui-fg-muted", children: [
12825
- /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(Text, { size: "small", weight: "plus", children: "Item" }) }),
12826
- /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(Text, { size: "small", weight: "plus", children: "Quantity" }) })
12827
- ] }),
12828
- /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-y-1.5 px-[5px] pb-[5px]", children: matches.length > 0 ? matches == null ? void 0 : matches.map((item) => /* @__PURE__ */ jsxs(
12829
- "div",
12830
- {
12831
- className: "grid grid-cols-2 gap-3 px-4 py-2 bg-ui-bg-base shadow-elevation-card-rest rounded-lg items-center",
12832
- children: [
12833
- /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-x-3", children: [
12834
- /* @__PURE__ */ jsx(
12835
- Thumbnail,
12836
- {
12837
- thumbnail: item.thumbnail,
12838
- alt: item.product_title ?? void 0
12839
- }
12840
- ),
12841
- /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
12842
- /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-x-1", children: [
12843
- /* @__PURE__ */ jsx(Text, { size: "small", weight: "plus", leading: "compact", children: item.product_title }),
12844
- /* @__PURE__ */ jsxs(
12845
- Text,
12846
- {
12847
- size: "small",
12848
- leading: "compact",
12849
- className: "text-ui-fg-subtle",
12850
- children: [
12851
- "(",
12852
- item.variant_title,
12853
- ")"
12854
- ]
12855
- }
12856
- )
12857
- ] }),
12858
- /* @__PURE__ */ jsx(
12859
- Text,
12860
- {
12861
- size: "small",
12862
- leading: "compact",
12863
- className: "text-ui-fg-subtle",
12864
- children: item.variant_sku
12865
- }
12866
- )
12867
- ] })
12868
- ] }),
12869
- /* @__PURE__ */ jsxs(
12870
- Text,
12871
- {
12872
- size: "small",
12873
- leading: "compact",
12874
- className: "text-ui-fg-subtle",
12875
- children: [
12876
- item.quantity,
12877
- "x"
12878
- ]
12879
- }
12880
- )
12881
- ]
12882
- },
12883
- item.id
12884
- )) : /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-center gap-x-3 bg-ui-bg-base rounded-lg p-4 shadow-elevation-card-rest flex-col gap-1", children: [
12885
- /* @__PURE__ */ jsx(Text, { size: "small", weight: "plus", leading: "compact", children: "No items found" }),
12886
- /* @__PURE__ */ jsxs(Text, { size: "small", className: "text-ui-fg-subtle", children: [
12887
- 'No items found for "',
12888
- query,
12889
- '".'
12890
- ] })
12891
- ] }) })
12892
- ] })
12893
- ] });
12644
+ ) });
12894
12645
  };
12895
- const LocationField = ({ control, setValue }) => {
12896
- const locations = useComboboxData({
12897
- queryKey: ["locations"],
12646
+ const CustomerField = ({ control, currentCustomerId }) => {
12647
+ const customers = useComboboxData({
12898
12648
  queryFn: async (params) => {
12899
- return await sdk.admin.stockLocation.list(params);
12649
+ return await sdk.admin.customer.list({
12650
+ ...params,
12651
+ id: currentCustomerId ? { $nin: [currentCustomerId] } : void 0
12652
+ });
12900
12653
  },
12901
- getOptions: (data) => {
12902
- return data.stock_locations.map((location) => ({
12903
- label: location.name,
12904
- value: location.id
12905
- }));
12654
+ queryKey: ["customers"],
12655
+ getOptions: (data) => {
12656
+ return data.customers.map((customer) => {
12657
+ const name = [customer.first_name, customer.last_name].filter(Boolean).join(" ");
12658
+ return {
12659
+ label: name ? `${name} (${customer.email})` : customer.email,
12660
+ value: customer.id
12661
+ };
12662
+ });
12906
12663
  }
12907
12664
  });
12908
12665
  return /* @__PURE__ */ jsx(
12909
12666
  Form$2.Field,
12910
12667
  {
12668
+ name: "customer_id",
12911
12669
  control,
12912
- name: "location_id",
12913
- render: ({ field: { onChange, ...field } }) => {
12914
- return /* @__PURE__ */ jsx(Form$2.Item, { children: /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-x-3", children: [
12915
- /* @__PURE__ */ jsxs("div", { children: [
12916
- /* @__PURE__ */ jsx(Form$2.Label, { children: "Location" }),
12917
- /* @__PURE__ */ jsx(Form$2.Hint, { children: "Choose where you want to ship the items from." })
12918
- ] }),
12919
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(
12920
- Combobox,
12670
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { className: "space-y-3", children: [
12671
+ /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
12672
+ /* @__PURE__ */ jsx(Form$2.Label, { children: "New customer" }),
12673
+ /* @__PURE__ */ jsx(Form$2.Hint, { children: "The customer to transfer this draft order to." })
12674
+ ] }),
12675
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(
12676
+ Combobox,
12677
+ {
12678
+ options: customers.options,
12679
+ fetchNextPage: customers.fetchNextPage,
12680
+ isFetchingNextPage: customers.isFetchingNextPage,
12681
+ searchValue: customers.searchValue,
12682
+ onSearchValueChange: customers.onSearchValueChange,
12683
+ placeholder: "Select customer",
12684
+ ...field
12685
+ }
12686
+ ) }),
12687
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
12688
+ ] })
12689
+ }
12690
+ );
12691
+ };
12692
+ const Illustration = () => {
12693
+ return /* @__PURE__ */ jsxs(
12694
+ "svg",
12695
+ {
12696
+ width: "280",
12697
+ height: "180",
12698
+ viewBox: "0 0 280 180",
12699
+ fill: "none",
12700
+ xmlns: "http://www.w3.org/2000/svg",
12701
+ children: [
12702
+ /* @__PURE__ */ jsx(
12703
+ "rect",
12704
+ {
12705
+ x: "0.00428286",
12706
+ y: "-0.742904",
12707
+ width: "33.5",
12708
+ height: "65.5",
12709
+ rx: "6.75",
12710
+ transform: "matrix(0.865865 0.500278 -0.871576 0.490261 189.756 88.438)",
12711
+ fill: "#D4D4D8",
12712
+ stroke: "#52525B",
12713
+ strokeWidth: "1.5"
12714
+ }
12715
+ ),
12716
+ /* @__PURE__ */ jsx(
12717
+ "rect",
12718
+ {
12719
+ x: "0.00428286",
12720
+ y: "-0.742904",
12721
+ width: "33.5",
12722
+ height: "65.5",
12723
+ rx: "6.75",
12724
+ transform: "matrix(0.865865 0.500278 -0.871576 0.490261 189.756 85.4381)",
12725
+ fill: "white",
12726
+ stroke: "#52525B",
12727
+ strokeWidth: "1.5"
12728
+ }
12729
+ ),
12730
+ /* @__PURE__ */ jsx(
12731
+ "path",
12732
+ {
12733
+ d: "M180.579 107.142L179.126 107.959",
12734
+ stroke: "#52525B",
12735
+ strokeWidth: "1.5",
12736
+ strokeLinecap: "round",
12737
+ strokeLinejoin: "round"
12738
+ }
12739
+ ),
12740
+ /* @__PURE__ */ jsx(
12741
+ "path",
12742
+ {
12743
+ opacity: "0.88",
12744
+ d: "M182.305 109.546L180.257 109.534",
12745
+ stroke: "#52525B",
12746
+ strokeWidth: "1.5",
12747
+ strokeLinecap: "round",
12748
+ strokeLinejoin: "round"
12749
+ }
12750
+ ),
12751
+ /* @__PURE__ */ jsx(
12752
+ "path",
12753
+ {
12754
+ opacity: "0.75",
12755
+ d: "M180.551 111.93L179.108 111.096",
12756
+ stroke: "#52525B",
12757
+ strokeWidth: "1.5",
12758
+ strokeLinecap: "round",
12759
+ strokeLinejoin: "round"
12760
+ }
12761
+ ),
12762
+ /* @__PURE__ */ jsx(
12763
+ "path",
12764
+ {
12765
+ opacity: "0.63",
12766
+ d: "M176.347 112.897L176.354 111.73",
12767
+ stroke: "#52525B",
12768
+ strokeWidth: "1.5",
12769
+ strokeLinecap: "round",
12770
+ strokeLinejoin: "round"
12771
+ }
12772
+ ),
12773
+ /* @__PURE__ */ jsx(
12774
+ "path",
12775
+ {
12776
+ opacity: "0.5",
12777
+ d: "M172.153 111.881L173.606 111.064",
12778
+ stroke: "#52525B",
12779
+ strokeWidth: "1.5",
12780
+ strokeLinecap: "round",
12781
+ strokeLinejoin: "round"
12782
+ }
12783
+ ),
12784
+ /* @__PURE__ */ jsx(
12785
+ "path",
12786
+ {
12787
+ opacity: "0.38",
12788
+ d: "M170.428 109.478L172.476 109.489",
12789
+ stroke: "#52525B",
12790
+ strokeWidth: "1.5",
12791
+ strokeLinecap: "round",
12792
+ strokeLinejoin: "round"
12793
+ }
12794
+ ),
12795
+ /* @__PURE__ */ jsx(
12796
+ "path",
12797
+ {
12798
+ opacity: "0.25",
12799
+ d: "M172.181 107.094L173.624 107.928",
12800
+ stroke: "#52525B",
12801
+ strokeWidth: "1.5",
12802
+ strokeLinecap: "round",
12803
+ strokeLinejoin: "round"
12804
+ }
12805
+ ),
12806
+ /* @__PURE__ */ jsx(
12807
+ "path",
12808
+ {
12809
+ opacity: "0.13",
12810
+ d: "M176.386 106.126L176.379 107.294",
12811
+ stroke: "#52525B",
12812
+ strokeWidth: "1.5",
12813
+ strokeLinecap: "round",
12814
+ strokeLinejoin: "round"
12815
+ }
12816
+ ),
12817
+ /* @__PURE__ */ jsx(
12818
+ "rect",
12819
+ {
12820
+ width: "12",
12821
+ height: "3",
12822
+ rx: "1.5",
12823
+ transform: "matrix(0.865865 0.500278 -0.871576 0.490261 196.447 92.2925)",
12824
+ fill: "#D4D4D8"
12825
+ }
12826
+ ),
12827
+ /* @__PURE__ */ jsx(
12828
+ "rect",
12829
+ {
12830
+ x: "0.00428286",
12831
+ y: "-0.742904",
12832
+ width: "33.5",
12833
+ height: "65.5",
12834
+ rx: "6.75",
12835
+ transform: "matrix(0.865865 0.500278 -0.871576 0.490261 117.023 46.4147)",
12836
+ fill: "#D4D4D8",
12837
+ stroke: "#52525B",
12838
+ strokeWidth: "1.5"
12839
+ }
12840
+ ),
12841
+ /* @__PURE__ */ jsx(
12842
+ "rect",
12843
+ {
12844
+ x: "0.00428286",
12845
+ y: "-0.742904",
12846
+ width: "33.5",
12847
+ height: "65.5",
12848
+ rx: "6.75",
12849
+ transform: "matrix(0.865865 0.500278 -0.871576 0.490261 117.023 43.4147)",
12850
+ fill: "white",
12851
+ stroke: "#52525B",
12852
+ strokeWidth: "1.5"
12853
+ }
12854
+ ),
12855
+ /* @__PURE__ */ jsx(
12856
+ "rect",
12857
+ {
12858
+ width: "12",
12859
+ height: "3",
12860
+ rx: "1.5",
12861
+ transform: "matrix(0.865865 0.500278 -0.871576 0.490261 123.714 50.2691)",
12862
+ fill: "#D4D4D8"
12863
+ }
12864
+ ),
12865
+ /* @__PURE__ */ jsx(
12866
+ "rect",
12867
+ {
12868
+ width: "17",
12869
+ height: "3",
12870
+ rx: "1.5",
12871
+ transform: "matrix(0.865865 0.500278 -0.871576 0.490261 97.5557 66.958)",
12872
+ fill: "#D4D4D8"
12873
+ }
12874
+ ),
12875
+ /* @__PURE__ */ jsx(
12876
+ "rect",
12877
+ {
12878
+ width: "12",
12879
+ height: "3",
12880
+ rx: "1.5",
12881
+ transform: "matrix(0.865865 0.500278 -0.871576 0.490261 93.1978 69.4093)",
12882
+ fill: "#D4D4D8"
12883
+ }
12884
+ ),
12885
+ /* @__PURE__ */ jsx(
12886
+ "path",
12887
+ {
12888
+ d: "M92.3603 63.9563C90.9277 63.1286 88.59 63.1152 87.148 63.9263C85.7059 64.7374 85.6983 66.0702 87.1308 66.8979C88.5634 67.7256 90.9011 67.7391 92.3432 66.928C93.7852 66.1168 93.7929 64.784 92.3603 63.9563ZM88.4382 66.1625C87.7221 65.7488 87.726 65.0822 88.4468 64.6767C89.1676 64.2713 90.3369 64.278 91.0529 64.6917C91.769 65.1055 91.7652 65.7721 91.0444 66.1775C90.3236 66.583 89.1543 66.5762 88.4382 66.1625Z",
12889
+ fill: "#A1A1AA"
12890
+ }
12891
+ ),
12892
+ /* @__PURE__ */ jsx(
12893
+ "rect",
12894
+ {
12895
+ width: "17",
12896
+ height: "3",
12897
+ rx: "1.5",
12898
+ transform: "matrix(0.865865 0.500278 -0.871576 0.490261 109.758 60.0944)",
12899
+ fill: "#A1A1AA"
12900
+ }
12901
+ ),
12902
+ /* @__PURE__ */ jsx(
12903
+ "rect",
12904
+ {
12905
+ width: "12",
12906
+ height: "3",
12907
+ rx: "1.5",
12908
+ transform: "matrix(0.865865 0.500278 -0.871576 0.490261 105.4 62.5457)",
12909
+ fill: "#A1A1AA"
12910
+ }
12911
+ ),
12912
+ /* @__PURE__ */ jsx(
12913
+ "path",
12914
+ {
12915
+ d: "M104.562 57.0927C103.13 56.265 100.792 56.2515 99.3501 57.0626C97.9081 57.8738 97.9004 59.2065 99.333 60.0343C100.766 60.862 103.103 60.8754 104.545 60.0643C105.987 59.2532 105.995 57.9204 104.562 57.0927ZM103.858 58.8972L100.815 59.1265C100.683 59.1367 100.55 59.1134 100.449 59.063C100.44 59.0585 100.432 59.0545 100.425 59.05C100.339 59.0005 100.29 58.9336 100.291 58.8637L100.294 58.1201C100.294 57.9752 100.501 57.8585 100.756 57.86C101.01 57.8615 101.217 57.98 101.216 58.1256L101.214 58.5669L103.732 58.3769C103.984 58.3578 104.217 58.4584 104.251 58.603C104.286 58.7468 104.11 58.8788 103.858 58.8977L103.858 58.8972Z",
12916
+ fill: "#52525B"
12917
+ }
12918
+ ),
12919
+ /* @__PURE__ */ jsx("g", { clipPath: "url(#clip0_20915_38670)", children: /* @__PURE__ */ jsx(
12920
+ "path",
12921
+ {
12922
+ d: "M133.106 81.8022L140.49 81.8447L140.515 77.6349",
12923
+ stroke: "#A1A1AA",
12924
+ strokeWidth: "1.5",
12925
+ strokeLinecap: "round",
12926
+ strokeLinejoin: "round"
12927
+ }
12928
+ ) }),
12929
+ /* @__PURE__ */ jsx("g", { clipPath: "url(#clip1_20915_38670)", children: /* @__PURE__ */ jsx(
12930
+ "path",
12931
+ {
12932
+ d: "M143.496 87.8055L150.881 87.8481L150.905 83.6383",
12933
+ stroke: "#A1A1AA",
12934
+ strokeWidth: "1.5",
12935
+ strokeLinecap: "round",
12936
+ strokeLinejoin: "round"
12937
+ }
12938
+ ) }),
12939
+ /* @__PURE__ */ jsx("g", { clipPath: "url(#clip2_20915_38670)", children: /* @__PURE__ */ jsx(
12940
+ "path",
12941
+ {
12942
+ d: "M153.887 93.8088L161.271 93.8514L161.295 89.6416",
12943
+ stroke: "#A1A1AA",
12944
+ strokeWidth: "1.5",
12945
+ strokeLinecap: "round",
12946
+ strokeLinejoin: "round"
12947
+ }
12948
+ ) }),
12949
+ /* @__PURE__ */ jsx("g", { clipPath: "url(#clip3_20915_38670)", children: /* @__PURE__ */ jsx(
12950
+ "path",
12951
+ {
12952
+ d: "M126.114 89.1912L118.729 89.1486L118.705 93.3584",
12953
+ stroke: "#A1A1AA",
12954
+ strokeWidth: "1.5",
12955
+ strokeLinecap: "round",
12956
+ strokeLinejoin: "round"
12957
+ }
12958
+ ) }),
12959
+ /* @__PURE__ */ jsx("g", { clipPath: "url(#clip4_20915_38670)", children: /* @__PURE__ */ jsx(
12960
+ "path",
12961
+ {
12962
+ d: "M136.504 95.1945L129.12 95.1519L129.095 99.3617",
12963
+ stroke: "#A1A1AA",
12964
+ strokeWidth: "1.5",
12965
+ strokeLinecap: "round",
12966
+ strokeLinejoin: "round"
12967
+ }
12968
+ ) }),
12969
+ /* @__PURE__ */ jsx("g", { clipPath: "url(#clip5_20915_38670)", children: /* @__PURE__ */ jsx(
12970
+ "path",
12971
+ {
12972
+ d: "M146.894 101.198L139.51 101.155L139.486 105.365",
12973
+ stroke: "#A1A1AA",
12974
+ strokeWidth: "1.5",
12975
+ strokeLinecap: "round",
12976
+ strokeLinejoin: "round"
12977
+ }
12978
+ ) }),
12979
+ /* @__PURE__ */ jsxs("defs", { children: [
12980
+ /* @__PURE__ */ jsx("clipPath", { id: "clip0_20915_38670", children: /* @__PURE__ */ jsx(
12981
+ "rect",
12921
12982
  {
12922
- options: locations.options,
12923
- fetchNextPage: locations.fetchNextPage,
12924
- isFetchingNextPage: locations.isFetchingNextPage,
12925
- searchValue: locations.searchValue,
12926
- onSearchValueChange: locations.onSearchValueChange,
12927
- placeholder: "Select location",
12928
- onChange: (value) => {
12929
- setValue("shipping_option_id", "", {
12930
- shouldDirty: true,
12931
- shouldTouch: true
12932
- });
12933
- onChange(value);
12934
- },
12935
- ...field
12983
+ width: "12",
12984
+ height: "12",
12985
+ fill: "white",
12986
+ transform: "matrix(0.865865 0.500278 -0.871576 0.490261 138.36 74.6508)"
12936
12987
  }
12937
- ) })
12938
- ] }) });
12939
- }
12940
- }
12941
- );
12942
- };
12943
- const ShippingOptionField = ({
12944
- shippingProfileId,
12945
- preview,
12946
- control
12947
- }) => {
12948
- var _a;
12949
- const locationId = useWatch({ control, name: "location_id" });
12950
- const shippingOptions = useComboboxData({
12951
- queryKey: ["shipping_options", locationId, shippingProfileId],
12952
- queryFn: async (params) => {
12953
- return await sdk.admin.shippingOption.list({
12954
- ...params,
12955
- stock_location_id: locationId,
12956
- shipping_profile_id: shippingProfileId
12957
- });
12958
- },
12959
- getOptions: (data) => {
12960
- return data.shipping_options.map((option) => {
12961
- var _a2;
12962
- if ((_a2 = option.rules) == null ? void 0 : _a2.find(
12963
- (r) => r.attribute === "is_return" && r.value === "true"
12964
- )) {
12965
- return void 0;
12966
- }
12967
- return {
12968
- label: option.name,
12969
- value: option.id
12970
- };
12971
- }).filter(Boolean);
12972
- },
12973
- enabled: !!locationId && !!shippingProfileId,
12974
- defaultValue: ((_a = preview.shipping_methods[0]) == null ? void 0 : _a.shipping_option_id) || void 0
12975
- });
12976
- const tooltipContent = !locationId && !shippingProfileId ? "Choose a location and shipping profile first." : !locationId ? "Choose a location first." : "Choose a shipping profile first.";
12977
- return /* @__PURE__ */ jsx(
12978
- Form$2.Field,
12979
- {
12980
- control,
12981
- name: "shipping_option_id",
12982
- render: ({ field }) => {
12983
- return /* @__PURE__ */ jsx(Form$2.Item, { children: /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-x-3", children: [
12984
- /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
12985
- /* @__PURE__ */ jsx(Form$2.Label, { children: "Shipping option" }),
12986
- /* @__PURE__ */ jsx(Form$2.Hint, { children: "Choose the shipping option to use." })
12987
- ] }),
12988
- /* @__PURE__ */ jsx(
12989
- ConditionalTooltip,
12988
+ ) }),
12989
+ /* @__PURE__ */ jsx("clipPath", { id: "clip1_20915_38670", children: /* @__PURE__ */ jsx(
12990
+ "rect",
12990
12991
  {
12991
- content: tooltipContent,
12992
- showTooltip: !locationId || !shippingProfileId,
12993
- children: /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(
12994
- Combobox,
12995
- {
12996
- options: shippingOptions.options,
12997
- fetchNextPage: shippingOptions.fetchNextPage,
12998
- isFetchingNextPage: shippingOptions.isFetchingNextPage,
12999
- searchValue: shippingOptions.searchValue,
13000
- onSearchValueChange: shippingOptions.onSearchValueChange,
13001
- placeholder: "Select shipping option",
13002
- ...field,
13003
- disabled: !locationId || !shippingProfileId
13004
- }
13005
- ) }) })
12992
+ width: "12",
12993
+ height: "12",
12994
+ fill: "white",
12995
+ transform: "matrix(0.865865 0.500278 -0.871576 0.490261 148.75 80.6541)"
13006
12996
  }
13007
- )
13008
- ] }) });
13009
- }
13010
- }
13011
- );
13012
- };
13013
- const CustomAmountField = ({
13014
- control,
13015
- currencyCode
13016
- }) => {
13017
- return /* @__PURE__ */ jsx(
13018
- Form$2.Field,
13019
- {
13020
- control,
13021
- name: "custom_amount",
13022
- render: ({ field: { onChange, ...field } }) => {
13023
- return /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-x-3", children: [
13024
- /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
13025
- /* @__PURE__ */ jsx(Form$2.Label, { optional: true, children: "Custom amount" }),
13026
- /* @__PURE__ */ jsx(Form$2.Hint, { children: "Set a custom amount for the shipping option." })
13027
- ] }),
13028
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(
13029
- CurrencyInput,
12997
+ ) }),
12998
+ /* @__PURE__ */ jsx("clipPath", { id: "clip2_20915_38670", children: /* @__PURE__ */ jsx(
12999
+ "rect",
13030
13000
  {
13031
- ...field,
13032
- onValueChange: (value) => onChange(value),
13033
- symbol: getNativeSymbol(currencyCode),
13034
- code: currencyCode
13001
+ width: "12",
13002
+ height: "12",
13003
+ fill: "white",
13004
+ transform: "matrix(0.865865 0.500278 -0.871576 0.490261 159.141 86.6575)"
13005
+ }
13006
+ ) }),
13007
+ /* @__PURE__ */ jsx("clipPath", { id: "clip3_20915_38670", children: /* @__PURE__ */ jsx(
13008
+ "rect",
13009
+ {
13010
+ width: "12",
13011
+ height: "12",
13012
+ fill: "white",
13013
+ transform: "matrix(0.865865 0.500278 -0.871576 0.490261 120.928 84.4561)"
13014
+ }
13015
+ ) }),
13016
+ /* @__PURE__ */ jsx("clipPath", { id: "clip4_20915_38670", children: /* @__PURE__ */ jsx(
13017
+ "rect",
13018
+ {
13019
+ width: "12",
13020
+ height: "12",
13021
+ fill: "white",
13022
+ transform: "matrix(0.865865 0.500278 -0.871576 0.490261 131.318 90.4594)"
13023
+ }
13024
+ ) }),
13025
+ /* @__PURE__ */ jsx("clipPath", { id: "clip5_20915_38670", children: /* @__PURE__ */ jsx(
13026
+ "rect",
13027
+ {
13028
+ width: "12",
13029
+ height: "12",
13030
+ fill: "white",
13031
+ transform: "matrix(0.865865 0.500278 -0.871576 0.490261 141.709 96.4627)"
13035
13032
  }
13036
13033
  ) })
13037
- ] });
13038
- }
13034
+ ] })
13035
+ ]
13039
13036
  }
13040
13037
  );
13041
13038
  };
13039
+ const schema = objectType({
13040
+ customer_id: stringType().min(1)
13041
+ });
13042
13042
  const widgetModule = { widgets: [] };
13043
13043
  const routeModule = {
13044
13044
  routes: [
@@ -13063,10 +13063,6 @@ const routeModule = {
13063
13063
  Component: BillingAddress,
13064
13064
  path: "/draft-orders/:id/billing-address"
13065
13065
  },
13066
- {
13067
- Component: CustomItems,
13068
- path: "/draft-orders/:id/custom-items"
13069
- },
13070
13066
  {
13071
13067
  Component: Email,
13072
13068
  path: "/draft-orders/:id/email"
@@ -13076,17 +13072,25 @@ const routeModule = {
13076
13072
  path: "/draft-orders/:id/items"
13077
13073
  },
13078
13074
  {
13079
- Component: Promotions,
13080
- path: "/draft-orders/:id/promotions"
13075
+ Component: CustomItems,
13076
+ path: "/draft-orders/:id/custom-items"
13081
13077
  },
13082
13078
  {
13083
13079
  Component: Metadata,
13084
13080
  path: "/draft-orders/:id/metadata"
13085
13081
  },
13082
+ {
13083
+ Component: Promotions,
13084
+ path: "/draft-orders/:id/promotions"
13085
+ },
13086
13086
  {
13087
13087
  Component: SalesChannel,
13088
13088
  path: "/draft-orders/:id/sales-channel"
13089
13089
  },
13090
+ {
13091
+ Component: Shipping,
13092
+ path: "/draft-orders/:id/shipping"
13093
+ },
13090
13094
  {
13091
13095
  Component: ShippingAddress,
13092
13096
  path: "/draft-orders/:id/shipping-address"
@@ -13094,10 +13098,6 @@ const routeModule = {
13094
13098
  {
13095
13099
  Component: TransferOwnership,
13096
13100
  path: "/draft-orders/:id/transfer-ownership"
13097
- },
13098
- {
13099
- Component: Shipping,
13100
- path: "/draft-orders/:id/shipping"
13101
13101
  }
13102
13102
  ]
13103
13103
  }