@medusajs/draft-order 2.11.1-snapshot-20251022143349 → 2.11.1-snapshot-20251025141132

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