@medusajs/draft-order 2.10.2-snapshot-20250907131935 → 2.10.2-snapshot-20250908120151

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -9757,6 +9757,95 @@ const BillingAddressForm = ({ order }) => {
9757
9757
  ) });
9758
9758
  };
9759
9759
  const schema$5 = addressSchema;
9760
+ const CustomItems = () => {
9761
+ return /* @__PURE__ */ jsxs(RouteDrawer, { children: [
9762
+ /* @__PURE__ */ jsx(RouteDrawer.Header, { children: /* @__PURE__ */ jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Edit Custom Items" }) }) }),
9763
+ /* @__PURE__ */ jsx(CustomItemsForm, {})
9764
+ ] });
9765
+ };
9766
+ const CustomItemsForm = () => {
9767
+ const form = useForm({
9768
+ resolver: zodResolver(schema$4)
9769
+ });
9770
+ return /* @__PURE__ */ jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxs(KeyboundForm, { className: "flex flex-1 flex-col", children: [
9771
+ /* @__PURE__ */ jsx(RouteDrawer.Body, {}),
9772
+ /* @__PURE__ */ jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex justify-end gap-2", children: [
9773
+ /* @__PURE__ */ jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
9774
+ /* @__PURE__ */ jsx(Button, { size: "small", type: "submit", children: "Save" })
9775
+ ] }) })
9776
+ ] }) });
9777
+ };
9778
+ const schema$4 = objectType({
9779
+ email: stringType().email()
9780
+ });
9781
+ const Email = () => {
9782
+ const { id } = useParams();
9783
+ const { order, isPending, isError, error } = useOrder(id, {
9784
+ fields: "+email"
9785
+ });
9786
+ if (isError) {
9787
+ throw error;
9788
+ }
9789
+ const isReady = !isPending && !!order;
9790
+ return /* @__PURE__ */ jsxs(RouteDrawer, { children: [
9791
+ /* @__PURE__ */ jsxs(RouteDrawer.Header, { children: [
9792
+ /* @__PURE__ */ jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Edit Email" }) }),
9793
+ /* @__PURE__ */ jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Edit the email for the draft order" }) })
9794
+ ] }),
9795
+ isReady && /* @__PURE__ */ jsx(EmailForm, { order })
9796
+ ] });
9797
+ };
9798
+ const EmailForm = ({ order }) => {
9799
+ const form = useForm({
9800
+ defaultValues: {
9801
+ email: order.email ?? ""
9802
+ },
9803
+ resolver: zodResolver(schema$3)
9804
+ });
9805
+ const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
9806
+ const { handleSuccess } = useRouteModal();
9807
+ const onSubmit = form.handleSubmit(async (data) => {
9808
+ await mutateAsync(
9809
+ { email: data.email },
9810
+ {
9811
+ onSuccess: () => {
9812
+ handleSuccess();
9813
+ },
9814
+ onError: (error) => {
9815
+ toast.error(error.message);
9816
+ }
9817
+ }
9818
+ );
9819
+ });
9820
+ return /* @__PURE__ */ jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxs(
9821
+ KeyboundForm,
9822
+ {
9823
+ className: "flex flex-1 flex-col overflow-hidden",
9824
+ onSubmit,
9825
+ children: [
9826
+ /* @__PURE__ */ jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsx(
9827
+ Form$2.Field,
9828
+ {
9829
+ control: form.control,
9830
+ name: "email",
9831
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
9832
+ /* @__PURE__ */ jsx(Form$2.Label, { children: "Email" }),
9833
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
9834
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
9835
+ ] })
9836
+ }
9837
+ ) }),
9838
+ /* @__PURE__ */ jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex justify-end gap-2", children: [
9839
+ /* @__PURE__ */ jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
9840
+ /* @__PURE__ */ jsx(Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
9841
+ ] }) })
9842
+ ]
9843
+ }
9844
+ ) });
9845
+ };
9846
+ const schema$3 = objectType({
9847
+ email: stringType().email()
9848
+ });
9760
9849
  const NumberInput = forwardRef(
9761
9850
  ({
9762
9851
  value,
@@ -10731,95 +10820,6 @@ const customItemSchema = objectType({
10731
10820
  quantity: numberType(),
10732
10821
  unit_price: unionType([numberType(), stringType()])
10733
10822
  });
10734
- const Email = () => {
10735
- const { id } = useParams();
10736
- const { order, isPending, isError, error } = useOrder(id, {
10737
- fields: "+email"
10738
- });
10739
- if (isError) {
10740
- throw error;
10741
- }
10742
- const isReady = !isPending && !!order;
10743
- return /* @__PURE__ */ jsxs(RouteDrawer, { children: [
10744
- /* @__PURE__ */ jsxs(RouteDrawer.Header, { children: [
10745
- /* @__PURE__ */ jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Edit Email" }) }),
10746
- /* @__PURE__ */ jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Edit the email for the draft order" }) })
10747
- ] }),
10748
- isReady && /* @__PURE__ */ jsx(EmailForm, { order })
10749
- ] });
10750
- };
10751
- const EmailForm = ({ order }) => {
10752
- const form = useForm({
10753
- defaultValues: {
10754
- email: order.email ?? ""
10755
- },
10756
- resolver: zodResolver(schema$4)
10757
- });
10758
- const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
10759
- const { handleSuccess } = useRouteModal();
10760
- const onSubmit = form.handleSubmit(async (data) => {
10761
- await mutateAsync(
10762
- { email: data.email },
10763
- {
10764
- onSuccess: () => {
10765
- handleSuccess();
10766
- },
10767
- onError: (error) => {
10768
- toast.error(error.message);
10769
- }
10770
- }
10771
- );
10772
- });
10773
- return /* @__PURE__ */ jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxs(
10774
- KeyboundForm,
10775
- {
10776
- className: "flex flex-1 flex-col overflow-hidden",
10777
- onSubmit,
10778
- children: [
10779
- /* @__PURE__ */ jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsx(
10780
- Form$2.Field,
10781
- {
10782
- control: form.control,
10783
- name: "email",
10784
- render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
10785
- /* @__PURE__ */ jsx(Form$2.Label, { children: "Email" }),
10786
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
10787
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
10788
- ] })
10789
- }
10790
- ) }),
10791
- /* @__PURE__ */ jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex justify-end gap-2", children: [
10792
- /* @__PURE__ */ jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
10793
- /* @__PURE__ */ jsx(Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
10794
- ] }) })
10795
- ]
10796
- }
10797
- ) });
10798
- };
10799
- const schema$4 = objectType({
10800
- email: stringType().email()
10801
- });
10802
- const CustomItems = () => {
10803
- return /* @__PURE__ */ jsxs(RouteDrawer, { children: [
10804
- /* @__PURE__ */ jsx(RouteDrawer.Header, { children: /* @__PURE__ */ jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Edit Custom Items" }) }) }),
10805
- /* @__PURE__ */ jsx(CustomItemsForm, {})
10806
- ] });
10807
- };
10808
- const CustomItemsForm = () => {
10809
- const form = useForm({
10810
- resolver: zodResolver(schema$3)
10811
- });
10812
- return /* @__PURE__ */ jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxs(KeyboundForm, { className: "flex flex-1 flex-col", children: [
10813
- /* @__PURE__ */ jsx(RouteDrawer.Body, {}),
10814
- /* @__PURE__ */ jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex justify-end gap-2", children: [
10815
- /* @__PURE__ */ jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
10816
- /* @__PURE__ */ jsx(Button, { size: "small", type: "submit", children: "Save" })
10817
- ] }) })
10818
- ] }) });
10819
- };
10820
- const schema$3 = objectType({
10821
- email: stringType().email()
10822
- });
10823
10823
  const InlineTip = forwardRef(
10824
10824
  ({ variant = "tip", label, className, children, ...props }, ref) => {
10825
10825
  const labelValue = label || (variant === "warning" ? "Warning" : "Tip");
@@ -11170,77 +11170,105 @@ function getHasUneditableRows(metadata) {
11170
11170
  (value) => !EDITABLE_TYPES.includes(typeof value)
11171
11171
  );
11172
11172
  }
11173
- const STACKED_FOCUS_MODAL_ID = "shipping-form";
11174
- const Shipping = () => {
11175
- var _a;
11176
- const { id } = useParams();
11177
- const { order, isPending, isError, error } = useOrder(id, {
11178
- fields: "+items.*,+items.variant.*,+items.variant.product.*,+items.variant.product.shipping_profile.*,+currency_code"
11173
+ const PROMOTION_QUERY_KEY = "promotions";
11174
+ const promotionsQueryKeys = {
11175
+ list: (query2) => [
11176
+ PROMOTION_QUERY_KEY,
11177
+ query2 ? query2 : void 0
11178
+ ],
11179
+ detail: (id, query2) => [
11180
+ PROMOTION_QUERY_KEY,
11181
+ id,
11182
+ query2 ? query2 : void 0
11183
+ ]
11184
+ };
11185
+ const usePromotions = (query2, options) => {
11186
+ const { data, ...rest } = useQuery({
11187
+ queryKey: promotionsQueryKeys.list(query2),
11188
+ queryFn: async () => sdk.admin.promotion.list(query2),
11189
+ ...options
11179
11190
  });
11191
+ return { ...data, ...rest };
11192
+ };
11193
+ const Promotions = () => {
11194
+ const { id } = useParams();
11180
11195
  const {
11181
11196
  order: preview,
11182
- isPending: isPreviewPending,
11183
11197
  isError: isPreviewError,
11184
11198
  error: previewError
11185
- } = useOrderPreview(id);
11199
+ } = useOrderPreview(id, void 0);
11186
11200
  useInitiateOrderEdit({ preview });
11187
11201
  const { onCancel } = useCancelOrderEdit({ preview });
11188
- if (isError) {
11189
- throw error;
11190
- }
11191
11202
  if (isPreviewError) {
11192
11203
  throw previewError;
11193
11204
  }
11194
- const orderHasItems = (((_a = order == null ? void 0 : order.items) == null ? void 0 : _a.length) || 0) > 0;
11195
- const isReady = preview && !isPreviewPending && order && !isPending;
11196
- return /* @__PURE__ */ jsx(RouteFocusModal, { onClose: onCancel, children: !orderHasItems ? /* @__PURE__ */ jsxs("div", { className: "flex h-full flex-col overflow-hidden ", children: [
11197
- /* @__PURE__ */ jsx(RouteFocusModal.Header, {}),
11198
- /* @__PURE__ */ jsx(RouteFocusModal.Body, { className: "flex flex-1 flex-col overflow-hidden", children: /* @__PURE__ */ jsx("div", { className: "flex flex-1 flex-col items-center overflow-y-auto", children: /* @__PURE__ */ jsxs("div", { className: "flex w-full max-w-[720px] flex-col gap-y-6 py-16 px-6", children: [
11199
- /* @__PURE__ */ jsx(RouteFocusModal.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Shipping" }) }),
11200
- /* @__PURE__ */ jsx(RouteFocusModal.Description, { asChild: true, children: /* @__PURE__ */ jsx(Text, { size: "small", className: "text-ui-fg-subtle", children: "This draft order currently has no items. Add items to the order before adding shipping." }) })
11201
- ] }) }) }),
11202
- /* @__PURE__ */ jsx(RouteFocusModal.Footer, { children: /* @__PURE__ */ jsx(RouteFocusModal.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", type: "button", children: "Cancel" }) }) })
11203
- ] }) : isReady ? /* @__PURE__ */ jsx(ShippingForm, { preview, order }) : /* @__PURE__ */ jsxs("div", { children: [
11204
- /* @__PURE__ */ jsx(RouteFocusModal.Title, { asChild: true, children: /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Edit Shipping" }) }),
11205
- /* @__PURE__ */ jsx(RouteFocusModal.Description, { asChild: true, children: /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Loading data for the draft order, please wait..." }) })
11206
- ] }) });
11205
+ const isReady = !!preview;
11206
+ return /* @__PURE__ */ jsxs(RouteDrawer, { onClose: onCancel, children: [
11207
+ /* @__PURE__ */ jsx(RouteDrawer.Header, { children: /* @__PURE__ */ jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Edit Promotions" }) }) }),
11208
+ isReady && /* @__PURE__ */ jsx(PromotionForm, { preview })
11209
+ ] });
11207
11210
  };
11208
- const ShippingForm = ({ preview, order }) => {
11209
- var _a;
11210
- const { setIsOpen } = useStackedModal();
11211
+ const PromotionForm = ({ preview }) => {
11212
+ const { items, shipping_methods } = preview;
11211
11213
  const [isSubmitting, setIsSubmitting] = useState(false);
11212
- const [data, setData] = useState(null);
11213
- const appliedShippingOptionIds = (_a = preview.shipping_methods) == null ? void 0 : _a.map((method) => method.shipping_option_id).filter(Boolean);
11214
- const { shipping_options } = useShippingOptions(
11214
+ const [comboboxValue, setComboboxValue] = useState("");
11215
+ const { handleSuccess } = useRouteModal();
11216
+ const { mutateAsync: addPromotions, isPending: isAddingPromotions } = useDraftOrderAddPromotions(preview.id);
11217
+ const promoIds = getPromotionIds(items, shipping_methods);
11218
+ const { promotions, isPending, isError, error } = usePromotions(
11215
11219
  {
11216
- id: appliedShippingOptionIds,
11217
- fields: "+service_zone.*,+service_zone.fulfillment_set.*,+service_zone.fulfillment_set.location.*"
11220
+ id: promoIds
11218
11221
  },
11219
11222
  {
11220
- enabled: appliedShippingOptionIds.length > 0
11223
+ enabled: !!promoIds.length
11221
11224
  }
11222
11225
  );
11223
- const uniqueShippingProfiles = useMemo(() => {
11224
- const profiles = /* @__PURE__ */ new Map();
11225
- getUniqueShippingProfiles(order.items).forEach((profile) => {
11226
- profiles.set(profile.id, profile);
11227
- });
11228
- shipping_options == null ? void 0 : shipping_options.forEach((option) => {
11229
- profiles.set(option.shipping_profile_id, option.shipping_profile);
11230
- });
11231
- return Array.from(profiles.values());
11232
- }, [order.items, shipping_options]);
11233
- const { handleSuccess } = useRouteModal();
11226
+ const comboboxData = useComboboxData({
11227
+ queryKey: ["promotions", "combobox", promoIds],
11228
+ queryFn: async (params) => {
11229
+ return await sdk.admin.promotion.list({
11230
+ ...params,
11231
+ id: {
11232
+ $nin: promoIds
11233
+ }
11234
+ });
11235
+ },
11236
+ getOptions: (data) => {
11237
+ return data.promotions.map((promotion) => ({
11238
+ label: promotion.code,
11239
+ value: promotion.code
11240
+ }));
11241
+ }
11242
+ });
11243
+ const add = async (value) => {
11244
+ if (!value) {
11245
+ return;
11246
+ }
11247
+ addPromotions(
11248
+ {
11249
+ promo_codes: [value]
11250
+ },
11251
+ {
11252
+ onError: (e) => {
11253
+ toast.error(e.message);
11254
+ comboboxData.onSearchValueChange("");
11255
+ setComboboxValue("");
11256
+ },
11257
+ onSuccess: () => {
11258
+ comboboxData.onSearchValueChange("");
11259
+ setComboboxValue("");
11260
+ }
11261
+ }
11262
+ );
11263
+ };
11234
11264
  const { mutateAsync: confirmOrderEdit } = useDraftOrderConfirmEdit(preview.id);
11235
- const { mutateAsync: requestOrderEdit } = useDraftOrderRequestEdit(preview.id);
11236
- const { mutateAsync: removeShippingMethod } = useDraftOrderRemoveShippingMethod(preview.id);
11237
- const { mutateAsync: removeActionShippingMethod } = useDraftOrderRemoveActionShippingMethod(preview.id);
11265
+ const { mutateAsync: requestOrderEdit } = useOrderEditRequest(preview.id);
11238
11266
  const onSubmit = async () => {
11239
11267
  setIsSubmitting(true);
11240
11268
  let requestSucceeded = false;
11241
11269
  await requestOrderEdit(void 0, {
11242
11270
  onError: (e) => {
11243
- toast.error(`Failed to request order edit: ${e.message}`);
11271
+ toast.error(e.message);
11244
11272
  },
11245
11273
  onSuccess: () => {
11246
11274
  requestSucceeded = true;
@@ -11252,7 +11280,7 @@ const ShippingForm = ({ preview, order }) => {
11252
11280
  }
11253
11281
  await confirmOrderEdit(void 0, {
11254
11282
  onError: (e) => {
11255
- toast.error(`Failed to confirm order edit: ${e.message}`);
11283
+ toast.error(e.message);
11256
11284
  },
11257
11285
  onSuccess: () => {
11258
11286
  handleSuccess();
@@ -11262,1307 +11290,1279 @@ const ShippingForm = ({ preview, order }) => {
11262
11290
  }
11263
11291
  });
11264
11292
  };
11265
- const onKeydown = useCallback(
11266
- (e) => {
11267
- if (e.key === "Enter" && (e.ctrlKey || e.metaKey)) {
11268
- if (data || isSubmitting) {
11269
- return;
11293
+ if (isError) {
11294
+ throw error;
11295
+ }
11296
+ return /* @__PURE__ */ jsxs(KeyboundForm, { className: "flex flex-1 flex-col", onSubmit, children: [
11297
+ /* @__PURE__ */ jsx(RouteDrawer.Body, { children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-4", children: [
11298
+ /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-3", children: [
11299
+ /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
11300
+ /* @__PURE__ */ jsx(Label$1, { size: "small", weight: "plus", htmlFor: "promotion-combobox", children: "Apply promotions" }),
11301
+ /* @__PURE__ */ jsx(Hint$1, { id: "promotion-combobox-hint", children: "Manage promotions that should be applied to the order." })
11302
+ ] }),
11303
+ /* @__PURE__ */ jsx(
11304
+ Combobox,
11305
+ {
11306
+ id: "promotion-combobox",
11307
+ "aria-describedby": "promotion-combobox-hint",
11308
+ isFetchingNextPage: comboboxData.isFetchingNextPage,
11309
+ fetchNextPage: comboboxData.fetchNextPage,
11310
+ options: comboboxData.options,
11311
+ onSearchValueChange: comboboxData.onSearchValueChange,
11312
+ searchValue: comboboxData.searchValue,
11313
+ disabled: comboboxData.disabled || isAddingPromotions,
11314
+ onChange: add,
11315
+ value: comboboxValue
11316
+ }
11317
+ )
11318
+ ] }),
11319
+ /* @__PURE__ */ jsx(Divider, { variant: "dashed" }),
11320
+ /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-2", children: promotions == null ? void 0 : promotions.map((promotion) => /* @__PURE__ */ jsx(
11321
+ PromotionItem,
11322
+ {
11323
+ promotion,
11324
+ orderId: preview.id,
11325
+ isLoading: isPending
11326
+ },
11327
+ promotion.id
11328
+ )) })
11329
+ ] }) }),
11330
+ /* @__PURE__ */ jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex justify-end gap-2", children: [
11331
+ /* @__PURE__ */ jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
11332
+ /* @__PURE__ */ jsx(
11333
+ Button,
11334
+ {
11335
+ size: "small",
11336
+ type: "submit",
11337
+ isLoading: isSubmitting || isAddingPromotions,
11338
+ children: "Save"
11339
+ }
11340
+ )
11341
+ ] }) })
11342
+ ] });
11343
+ };
11344
+ const PromotionItem = ({
11345
+ promotion,
11346
+ orderId,
11347
+ isLoading
11348
+ }) => {
11349
+ var _a;
11350
+ const { mutateAsync: removePromotions, isPending } = useDraftOrderRemovePromotions(orderId);
11351
+ const onRemove = async () => {
11352
+ removePromotions(
11353
+ {
11354
+ promo_codes: [promotion.code]
11355
+ },
11356
+ {
11357
+ onError: (e) => {
11358
+ toast.error(e.message);
11270
11359
  }
11271
- onSubmit();
11272
11360
  }
11273
- },
11274
- [data, isSubmitting, onSubmit]
11275
- );
11276
- useEffect(() => {
11277
- document.addEventListener("keydown", onKeydown);
11278
- return () => {
11279
- document.removeEventListener("keydown", onKeydown);
11280
- };
11281
- }, [onKeydown]);
11282
- return /* @__PURE__ */ jsxs("div", { className: "flex h-full flex-col overflow-hidden", children: [
11283
- /* @__PURE__ */ jsx(RouteFocusModal.Header, {}),
11284
- /* @__PURE__ */ jsxs(RouteFocusModal.Body, { className: "flex flex-1 flex-col overflow-hidden", children: [
11285
- /* @__PURE__ */ jsx("div", { className: "flex flex-1 flex-col items-center overflow-y-auto", children: /* @__PURE__ */ jsxs("div", { className: "flex w-full max-w-[720px] flex-col gap-y-6 py-16 px-6", children: [
11361
+ );
11362
+ };
11363
+ const displayValue = getDisplayValue(promotion);
11364
+ return /* @__PURE__ */ jsxs(
11365
+ "div",
11366
+ {
11367
+ className: clx(
11368
+ "bg-ui-bg-component shadow-elevation-card-rest flex items-center justify-between rounded-lg px-3 py-2",
11369
+ {
11370
+ "animate-pulse": isLoading
11371
+ }
11372
+ ),
11373
+ children: [
11286
11374
  /* @__PURE__ */ jsxs("div", { children: [
11287
- /* @__PURE__ */ jsx(RouteFocusModal.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Shipping" }) }),
11288
- /* @__PURE__ */ jsx(RouteFocusModal.Description, { asChild: true, children: /* @__PURE__ */ jsx(Text, { size: "small", className: "text-ui-fg-subtle", children: "Choose which shipping method(s) to use for the items in the order." }) })
11375
+ /* @__PURE__ */ jsx(Text, { size: "small", weight: "plus", leading: "compact", children: promotion.code }),
11376
+ /* @__PURE__ */ jsxs("div", { className: "text-ui-fg-subtle flex items-center gap-1.5", children: [
11377
+ displayValue && /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1.5", children: [
11378
+ /* @__PURE__ */ jsx(Text, { size: "small", leading: "compact", children: displayValue }),
11379
+ /* @__PURE__ */ jsx(Text, { size: "small", leading: "compact", children: "·" })
11380
+ ] }),
11381
+ /* @__PURE__ */ jsx(Text, { size: "small", leading: "compact", className: "capitalize", children: (_a = promotion.application_method) == null ? void 0 : _a.allocation })
11382
+ ] })
11289
11383
  ] }),
11290
- /* @__PURE__ */ jsx(Divider, { variant: "dashed" }),
11291
- /* @__PURE__ */ jsx(Accordion.Root, { type: "multiple", children: /* @__PURE__ */ jsxs("div", { className: "bg-ui-bg-subtle rounded-xl shadow-elevation-card-rest", children: [
11292
- /* @__PURE__ */ jsxs("div", { className: "px-4 py-2 flex items-center justify-between", children: [
11293
- /* @__PURE__ */ jsx(
11294
- Text,
11295
- {
11296
- size: "xsmall",
11297
- weight: "plus",
11298
- className: "text-ui-fg-muted",
11299
- children: "Shipping profile"
11300
- }
11301
- ),
11302
- /* @__PURE__ */ jsx(
11303
- Text,
11304
- {
11305
- size: "xsmall",
11306
- weight: "plus",
11307
- className: "text-ui-fg-muted",
11308
- children: "Action"
11309
- }
11310
- )
11311
- ] }),
11312
- /* @__PURE__ */ jsx("div", { className: "px-[5px] pb-[5px]", children: uniqueShippingProfiles.map((profile) => {
11313
- var _a2, _b, _c, _d, _e, _f, _g;
11314
- const items = getItemsWithShippingProfile(
11315
- profile.id,
11316
- order.items
11317
- );
11318
- const hasItems = items.length > 0;
11319
- const shippingOption = shipping_options == null ? void 0 : shipping_options.find(
11320
- (option) => option.shipping_profile_id === profile.id
11321
- );
11322
- const shippingMethod = preview.shipping_methods.find(
11323
- (method) => method.shipping_option_id === (shippingOption == null ? void 0 : shippingOption.id)
11324
- );
11325
- const addShippingMethodAction = (_a2 = shippingMethod == null ? void 0 : shippingMethod.actions) == null ? void 0 : _a2.find(
11326
- (action) => action.action === "SHIPPING_ADD"
11327
- );
11328
- return /* @__PURE__ */ jsxs(
11329
- Accordion.Item,
11330
- {
11331
- value: profile.id,
11332
- className: "bg-ui-bg-base shadow-elevation-card-rest rounded-lg",
11333
- children: [
11334
- /* @__PURE__ */ jsxs("div", { className: "px-3 py-2 flex items-center justify-between gap-3", children: [
11335
- /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-x-3 w-full overflow-hidden", children: [
11336
- /* @__PURE__ */ jsx(Accordion.Trigger, { asChild: true, children: /* @__PURE__ */ jsx(
11337
- IconButton,
11338
- {
11339
- size: "2xsmall",
11340
- variant: "transparent",
11341
- className: "group/trigger",
11342
- disabled: !hasItems,
11343
- children: /* @__PURE__ */ jsx(TriangleRightMini, { className: "group-data-[state=open]/trigger:rotate-90 transition-transform" })
11344
- }
11345
- ) }),
11346
- !shippingOption ? /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-x-3", children: [
11347
- /* @__PURE__ */ jsx("div", { className: "size-7 rounded-md shadow-borders-base flex items-center justify-center", children: /* @__PURE__ */ jsx("div", { className: "size-6 rounded bg-ui-bg-component-hover flex items-center justify-center", children: /* @__PURE__ */ jsx(Shopping, { className: "text-ui-fg-subtle" }) }) }),
11348
- /* @__PURE__ */ jsxs("div", { className: "flex flex-col flex-1", children: [
11349
- /* @__PURE__ */ jsx(
11350
- Text,
11351
- {
11352
- size: "small",
11353
- weight: "plus",
11354
- leading: "compact",
11355
- children: profile.name
11356
- }
11357
- ),
11358
- /* @__PURE__ */ jsxs(
11359
- Text,
11360
- {
11361
- size: "small",
11362
- leading: "compact",
11363
- className: "text-ui-fg-subtle",
11364
- children: [
11365
- items.length,
11366
- " ",
11367
- pluralize(items.length, "items", "item")
11368
- ]
11369
- }
11370
- )
11371
- ] })
11372
- ] }) : /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-[5px] max-sm:flex-col max-sm:items-start flex-1 w-full overflow-hidden", children: [
11373
- /* @__PURE__ */ jsx(
11374
- Tooltip,
11375
- {
11376
- content: /* @__PURE__ */ jsx("ul", { children: items.map((item) => {
11377
- var _a3, _b2, _c2;
11378
- return /* @__PURE__ */ jsx(
11379
- "li",
11380
- {
11381
- children: `${item.quantity}x ${(_b2 = (_a3 = item.variant) == null ? void 0 : _a3.product) == null ? void 0 : _b2.title} (${(_c2 = item.variant) == null ? void 0 : _c2.title})`
11382
- },
11383
- item.id
11384
- );
11385
- }) }),
11386
- children: /* @__PURE__ */ jsxs(
11387
- Badge,
11388
- {
11389
- className: "flex items-center gap-x-[3px] overflow-hidden cursor-default",
11390
- size: "xsmall",
11391
- children: [
11392
- /* @__PURE__ */ jsx(Shopping, { className: "shrink-0" }),
11393
- /* @__PURE__ */ jsxs("span", { className: "truncate", children: [
11394
- items.reduce(
11395
- (acc, item) => acc + item.quantity,
11396
- 0
11397
- ),
11398
- "x",
11399
- " ",
11400
- pluralize(items.length, "items", "item")
11401
- ] })
11402
- ]
11403
- }
11404
- )
11405
- }
11406
- ),
11407
- /* @__PURE__ */ jsx(
11408
- Tooltip,
11409
- {
11410
- content: (_d = (_c = (_b = shippingOption.service_zone) == null ? void 0 : _b.fulfillment_set) == null ? void 0 : _c.location) == null ? void 0 : _d.name,
11411
- children: /* @__PURE__ */ jsxs(
11412
- Badge,
11413
- {
11414
- className: "flex items-center gap-x-[3px] overflow-hidden cursor-default",
11415
- size: "xsmall",
11416
- children: [
11417
- /* @__PURE__ */ jsx(Buildings, { className: "shrink-0" }),
11418
- /* @__PURE__ */ jsx("span", { className: "truncate", children: (_g = (_f = (_e = shippingOption.service_zone) == null ? void 0 : _e.fulfillment_set) == null ? void 0 : _f.location) == null ? void 0 : _g.name })
11419
- ]
11420
- }
11421
- )
11422
- }
11423
- ),
11424
- /* @__PURE__ */ jsx(Tooltip, { content: shippingOption.name, children: /* @__PURE__ */ jsxs(
11425
- Badge,
11426
- {
11427
- className: "flex items-center gap-x-[3px] overflow-hidden cursor-default",
11428
- size: "xsmall",
11429
- children: [
11430
- /* @__PURE__ */ jsx(TruckFast, { className: "shrink-0" }),
11431
- /* @__PURE__ */ jsx("span", { className: "truncate", children: shippingOption.name })
11432
- ]
11433
- }
11434
- ) })
11435
- ] })
11436
- ] }),
11437
- shippingOption ? /* @__PURE__ */ jsx(
11438
- ActionMenu,
11439
- {
11440
- groups: [
11441
- {
11442
- actions: [
11443
- hasItems ? {
11444
- label: "Edit shipping option",
11445
- icon: /* @__PURE__ */ jsx(Channels, {}),
11446
- onClick: () => {
11447
- setIsOpen(
11448
- STACKED_FOCUS_MODAL_ID,
11449
- true
11450
- );
11451
- setData({
11452
- shippingProfileId: profile.id,
11453
- shippingOption,
11454
- shippingMethod
11455
- });
11456
- }
11457
- } : void 0,
11458
- {
11459
- label: "Remove shipping option",
11460
- icon: /* @__PURE__ */ jsx(Trash, {}),
11461
- onClick: () => {
11462
- if (shippingMethod) {
11463
- if (addShippingMethodAction) {
11464
- removeActionShippingMethod(
11465
- addShippingMethodAction.id
11466
- );
11467
- } else {
11468
- removeShippingMethod(
11469
- shippingMethod.id
11470
- );
11471
- }
11472
- }
11473
- }
11474
- }
11475
- ].filter(Boolean)
11476
- }
11477
- ]
11478
- }
11479
- ) : /* @__PURE__ */ jsx(
11480
- StackedModalTrigger,
11481
- {
11482
- shippingProfileId: profile.id,
11483
- shippingOption,
11484
- shippingMethod,
11485
- setData,
11486
- children: "Add shipping option"
11487
- }
11488
- )
11489
- ] }),
11490
- /* @__PURE__ */ jsxs(Accordion.Content, { children: [
11491
- /* @__PURE__ */ jsx(Divider, { variant: "dashed" }),
11492
- items.map((item, idx) => {
11493
- var _a3, _b2, _c2, _d2, _e2;
11494
- return /* @__PURE__ */ jsxs("div", { children: [
11495
- /* @__PURE__ */ jsxs(
11496
- "div",
11497
- {
11498
- className: "px-3 flex items-center gap-x-3",
11499
- children: [
11500
- /* @__PURE__ */ jsx("div", { className: "w-5 h-[56px] flex flex-col justify-center items-center", children: /* @__PURE__ */ jsx(
11501
- Divider,
11502
- {
11503
- variant: "dashed",
11504
- orientation: "vertical"
11505
- }
11506
- ) }),
11507
- /* @__PURE__ */ jsxs("div", { className: "py-2 flex items-center gap-x-3", children: [
11508
- /* @__PURE__ */ jsx("div", { className: "size-7 flex items-center justify-center tabular-nums", children: /* @__PURE__ */ jsxs(
11509
- Text,
11510
- {
11511
- size: "small",
11512
- leading: "compact",
11513
- className: "text-ui-fg-subtle",
11514
- children: [
11515
- item.quantity,
11516
- "x"
11517
- ]
11518
- }
11519
- ) }),
11520
- /* @__PURE__ */ jsx(Thumbnail, { thumbnail: item.thumbnail }),
11521
- /* @__PURE__ */ jsxs("div", { children: [
11522
- /* @__PURE__ */ jsxs(
11523
- Text,
11524
- {
11525
- size: "small",
11526
- leading: "compact",
11527
- weight: "plus",
11528
- children: [
11529
- (_b2 = (_a3 = item.variant) == null ? void 0 : _a3.product) == null ? void 0 : _b2.title,
11530
- " (",
11531
- (_c2 = item.variant) == null ? void 0 : _c2.title,
11532
- ")"
11533
- ]
11534
- }
11535
- ),
11536
- /* @__PURE__ */ jsx(
11537
- Text,
11538
- {
11539
- size: "small",
11540
- leading: "compact",
11541
- className: "text-ui-fg-subtle",
11542
- children: (_e2 = (_d2 = item.variant) == null ? void 0 : _d2.options) == null ? void 0 : _e2.map((option) => option.value).join(" · ")
11543
- }
11544
- )
11545
- ] })
11546
- ] })
11547
- ]
11548
- },
11549
- item.id
11550
- ),
11551
- idx !== items.length - 1 && /* @__PURE__ */ jsx(Divider, { variant: "dashed" })
11552
- ] }, item.id);
11553
- })
11554
- ] })
11555
- ]
11556
- },
11557
- profile.id
11558
- );
11559
- }) })
11560
- ] }) })
11561
- ] }) }),
11562
- /* @__PURE__ */ jsx(
11563
- StackedFocusModal,
11564
- {
11565
- id: STACKED_FOCUS_MODAL_ID,
11566
- onOpenChangeCallback: (open) => {
11567
- if (!open) {
11568
- setData(null);
11569
- }
11570
- return open;
11571
- },
11572
- children: data && /* @__PURE__ */ jsx(ShippingProfileForm, { data, order, preview })
11384
+ /* @__PURE__ */ jsx(
11385
+ IconButton,
11386
+ {
11387
+ size: "small",
11388
+ type: "button",
11389
+ variant: "transparent",
11390
+ onClick: onRemove,
11391
+ isLoading: isPending || isLoading,
11392
+ children: /* @__PURE__ */ jsx(XMark, {})
11393
+ }
11394
+ )
11395
+ ]
11396
+ },
11397
+ promotion.id
11398
+ );
11399
+ };
11400
+ function getDisplayValue(promotion) {
11401
+ var _a, _b, _c, _d;
11402
+ const value = (_a = promotion.application_method) == null ? void 0 : _a.value;
11403
+ if (!value) {
11404
+ return null;
11405
+ }
11406
+ if (((_b = promotion.application_method) == null ? void 0 : _b.type) === "fixed") {
11407
+ const currency = (_c = promotion.application_method) == null ? void 0 : _c.currency_code;
11408
+ if (!currency) {
11409
+ return null;
11410
+ }
11411
+ return getLocaleAmount(value, currency);
11412
+ } else if (((_d = promotion.application_method) == null ? void 0 : _d.type) === "percentage") {
11413
+ return formatPercentage(value);
11414
+ }
11415
+ return null;
11416
+ }
11417
+ const formatter = new Intl.NumberFormat([], {
11418
+ style: "percent",
11419
+ minimumFractionDigits: 2
11420
+ });
11421
+ const formatPercentage = (value, isPercentageValue = false) => {
11422
+ let val = value || 0;
11423
+ if (!isPercentageValue) {
11424
+ val = val / 100;
11425
+ }
11426
+ return formatter.format(val);
11427
+ };
11428
+ function getPromotionIds(items, shippingMethods) {
11429
+ const promotionIds = /* @__PURE__ */ new Set();
11430
+ for (const item of items) {
11431
+ if (item.adjustments) {
11432
+ for (const adjustment of item.adjustments) {
11433
+ if (adjustment.promotion_id) {
11434
+ promotionIds.add(adjustment.promotion_id);
11573
11435
  }
11574
- )
11575
- ] }),
11576
- /* @__PURE__ */ jsx(RouteFocusModal.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex justify-end gap-x-2", children: [
11577
- /* @__PURE__ */ jsx(RouteFocusModal.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", type: "button", children: "Cancel" }) }),
11578
- /* @__PURE__ */ jsx(
11579
- Button,
11580
- {
11581
- size: "small",
11582
- type: "button",
11583
- isLoading: isSubmitting,
11584
- onClick: onSubmit,
11585
- children: "Save"
11436
+ }
11437
+ }
11438
+ }
11439
+ for (const shippingMethod of shippingMethods) {
11440
+ if (shippingMethod.adjustments) {
11441
+ for (const adjustment of shippingMethod.adjustments) {
11442
+ if (adjustment.promotion_id) {
11443
+ promotionIds.add(adjustment.promotion_id);
11586
11444
  }
11587
- )
11588
- ] }) })
11589
- ] });
11590
- };
11591
- const StackedModalTrigger = ({
11592
- shippingProfileId,
11593
- shippingOption,
11594
- shippingMethod,
11595
- setData,
11596
- children
11597
- }) => {
11598
- const { setIsOpen, getIsOpen } = useStackedModal();
11599
- const isOpen = getIsOpen(STACKED_FOCUS_MODAL_ID);
11600
- const onToggle = () => {
11601
- if (isOpen) {
11602
- setIsOpen(STACKED_FOCUS_MODAL_ID, false);
11603
- setData(null);
11604
- } else {
11605
- setIsOpen(STACKED_FOCUS_MODAL_ID, true);
11606
- setData({
11607
- shippingProfileId,
11608
- shippingOption,
11609
- shippingMethod
11610
- });
11445
+ }
11611
11446
  }
11612
- };
11613
- return /* @__PURE__ */ jsx(
11614
- Button,
11447
+ }
11448
+ return Array.from(promotionIds);
11449
+ }
11450
+ const SalesChannel = () => {
11451
+ const { id } = useParams();
11452
+ const { draft_order, isPending, isError, error } = useDraftOrder(
11453
+ id,
11615
11454
  {
11616
- size: "small",
11617
- variant: "secondary",
11618
- onClick: onToggle,
11619
- className: "text-ui-fg-primary shrink-0",
11620
- children
11455
+ fields: "+sales_channel_id"
11456
+ },
11457
+ {
11458
+ enabled: !!id
11621
11459
  }
11622
11460
  );
11461
+ if (isError) {
11462
+ throw error;
11463
+ }
11464
+ const ISrEADY = !!draft_order && !isPending;
11465
+ return /* @__PURE__ */ jsxs(RouteDrawer, { children: [
11466
+ /* @__PURE__ */ jsxs(RouteDrawer.Header, { children: [
11467
+ /* @__PURE__ */ jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Edit Sales Channel" }) }),
11468
+ /* @__PURE__ */ jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Update which sales channel the draft order is associated with" }) })
11469
+ ] }),
11470
+ ISrEADY && /* @__PURE__ */ jsx(SalesChannelForm, { order: draft_order })
11471
+ ] });
11623
11472
  };
11624
- const ShippingProfileForm = ({
11625
- data,
11626
- order,
11627
- preview
11628
- }) => {
11629
- var _a, _b, _c, _d, _e, _f;
11630
- const { setIsOpen } = useStackedModal();
11473
+ const SalesChannelForm = ({ order }) => {
11631
11474
  const form = useForm({
11632
- resolver: zodResolver(shippingMethodSchema),
11633
11475
  defaultValues: {
11634
- 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,
11635
- shipping_option_id: (_e = data.shippingOption) == null ? void 0 : _e.id,
11636
- custom_amount: (_f = data.shippingMethod) == null ? void 0 : _f.amount
11637
- }
11638
- });
11639
- const { mutateAsync: addShippingMethod, isPending } = useDraftOrderAddShippingMethod(order.id);
11640
- const {
11641
- mutateAsync: updateShippingMethod,
11642
- isPending: isUpdatingShippingMethod
11643
- } = useDraftOrderUpdateShippingMethod(order.id);
11644
- const onSubmit = form.handleSubmit(async (values) => {
11645
- if (isEqual(values, form.formState.defaultValues)) {
11646
- setIsOpen(STACKED_FOCUS_MODAL_ID, false);
11647
- return;
11648
- }
11649
- if (data.shippingMethod) {
11650
- await updateShippingMethod(
11651
- {
11652
- method_id: data.shippingMethod.id,
11653
- shipping_option_id: values.shipping_option_id,
11654
- custom_amount: values.custom_amount ? convertNumber(values.custom_amount) : void 0
11655
- },
11656
- {
11657
- onError: (e) => {
11658
- toast.error(e.message);
11659
- },
11660
- onSuccess: () => {
11661
- setIsOpen(STACKED_FOCUS_MODAL_ID, false);
11662
- }
11663
- }
11664
- );
11665
- return;
11666
- }
11667
- await addShippingMethod(
11476
+ sales_channel_id: order.sales_channel_id || ""
11477
+ },
11478
+ resolver: zodResolver(schema$2)
11479
+ });
11480
+ const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
11481
+ const { handleSuccess } = useRouteModal();
11482
+ const onSubmit = form.handleSubmit(async (data) => {
11483
+ await mutateAsync(
11668
11484
  {
11669
- shipping_option_id: values.shipping_option_id,
11670
- custom_amount: values.custom_amount ? convertNumber(values.custom_amount) : void 0
11485
+ sales_channel_id: data.sales_channel_id
11671
11486
  },
11672
11487
  {
11673
- onError: (e) => {
11674
- toast.error(e.message);
11675
- },
11676
11488
  onSuccess: () => {
11677
- setIsOpen(STACKED_FOCUS_MODAL_ID, false);
11489
+ toast.success("Sales channel updated");
11490
+ handleSuccess();
11491
+ },
11492
+ onError: (error) => {
11493
+ toast.error(error.message);
11678
11494
  }
11679
11495
  }
11680
11496
  );
11681
11497
  });
11682
- return /* @__PURE__ */ jsx(StackedFocusModal.Content, { children: /* @__PURE__ */ jsx(Form$2, { ...form, children: /* @__PURE__ */ jsxs(
11498
+ return /* @__PURE__ */ jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxs(
11683
11499
  KeyboundForm,
11684
11500
  {
11685
- className: "flex h-full flex-col overflow-hidden",
11501
+ className: "flex flex-1 flex-col overflow-hidden",
11686
11502
  onSubmit,
11687
11503
  children: [
11688
- /* @__PURE__ */ jsx(StackedFocusModal.Header, {}),
11689
- /* @__PURE__ */ jsx(StackedFocusModal.Body, { className: "flex flex-1 flex-col overflow-hidden", children: /* @__PURE__ */ jsx("div", { className: "flex flex-1 flex-col items-center overflow-y-auto", children: /* @__PURE__ */ jsxs("div", { className: "flex w-full max-w-[720px] flex-col gap-y-6 py-16 px-6", children: [
11690
- /* @__PURE__ */ jsxs("div", { children: [
11691
- /* @__PURE__ */ jsx(RouteFocusModal.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Shipping" }) }),
11692
- /* @__PURE__ */ jsx(RouteFocusModal.Description, { asChild: true, children: /* @__PURE__ */ jsx(Text, { size: "small", className: "text-ui-fg-subtle", children: "Add a shipping method for the selected shipping profile. You can see the items that will be shipped using this method in the preview below." }) })
11693
- ] }),
11694
- /* @__PURE__ */ jsx(Divider, { variant: "dashed" }),
11695
- /* @__PURE__ */ jsx(
11696
- LocationField,
11697
- {
11698
- control: form.control,
11699
- setValue: form.setValue
11700
- }
11701
- ),
11702
- /* @__PURE__ */ jsx(Divider, { variant: "dashed" }),
11703
- /* @__PURE__ */ jsx(
11704
- ShippingOptionField,
11705
- {
11706
- shippingProfileId: data.shippingProfileId,
11707
- preview,
11708
- control: form.control
11709
- }
11710
- ),
11711
- /* @__PURE__ */ jsx(Divider, { variant: "dashed" }),
11712
- /* @__PURE__ */ jsx(
11713
- CustomAmountField,
11714
- {
11715
- control: form.control,
11716
- currencyCode: order.currency_code
11717
- }
11718
- ),
11719
- /* @__PURE__ */ jsx(Divider, { variant: "dashed" }),
11720
- /* @__PURE__ */ jsx(
11721
- ItemsPreview,
11722
- {
11723
- order,
11724
- shippingProfileId: data.shippingProfileId
11725
- }
11726
- )
11727
- ] }) }) }),
11728
- /* @__PURE__ */ jsx(StackedFocusModal.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex justify-end gap-x-2", children: [
11729
- /* @__PURE__ */ jsx(StackedFocusModal.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", type: "button", children: "Cancel" }) }),
11730
- /* @__PURE__ */ jsx(
11731
- Button,
11732
- {
11733
- size: "small",
11734
- type: "submit",
11735
- isLoading: isPending || isUpdatingShippingMethod,
11736
- children: data.shippingMethod ? "Update" : "Add"
11737
- }
11738
- )
11504
+ /* @__PURE__ */ jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsx(SalesChannelField, { control: form.control, order }) }),
11505
+ /* @__PURE__ */ jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex justify-end gap-2", children: [
11506
+ /* @__PURE__ */ jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
11507
+ /* @__PURE__ */ jsx(Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
11739
11508
  ] }) })
11740
11509
  ]
11741
11510
  }
11742
- ) }) });
11511
+ ) });
11743
11512
  };
11744
- const shippingMethodSchema = objectType({
11745
- location_id: stringType(),
11746
- shipping_option_id: stringType(),
11747
- custom_amount: unionType([numberType(), stringType()]).optional()
11513
+ const SalesChannelField = ({ control, order }) => {
11514
+ const salesChannels = useComboboxData({
11515
+ queryFn: async (params) => {
11516
+ return await sdk.admin.salesChannel.list(params);
11517
+ },
11518
+ queryKey: ["sales-channels"],
11519
+ getOptions: (data) => {
11520
+ return data.sales_channels.map((salesChannel) => ({
11521
+ label: salesChannel.name,
11522
+ value: salesChannel.id
11523
+ }));
11524
+ },
11525
+ defaultValue: order.sales_channel_id || void 0
11526
+ });
11527
+ return /* @__PURE__ */ jsx(
11528
+ Form$2.Field,
11529
+ {
11530
+ control,
11531
+ name: "sales_channel_id",
11532
+ render: ({ field }) => {
11533
+ return /* @__PURE__ */ jsxs(Form$2.Item, { children: [
11534
+ /* @__PURE__ */ jsx(Form$2.Label, { children: "Sales Channel" }),
11535
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(
11536
+ Combobox,
11537
+ {
11538
+ options: salesChannels.options,
11539
+ fetchNextPage: salesChannels.fetchNextPage,
11540
+ isFetchingNextPage: salesChannels.isFetchingNextPage,
11541
+ searchValue: salesChannels.searchValue,
11542
+ onSearchValueChange: salesChannels.onSearchValueChange,
11543
+ placeholder: "Select sales channel",
11544
+ ...field
11545
+ }
11546
+ ) }),
11547
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
11548
+ ] });
11549
+ }
11550
+ }
11551
+ );
11552
+ };
11553
+ const schema$2 = objectType({
11554
+ sales_channel_id: stringType().min(1)
11748
11555
  });
11749
- const ItemsPreview = ({ order, shippingProfileId }) => {
11750
- const matches = order.items.filter(
11751
- (item) => {
11752
- var _a, _b, _c;
11753
- return ((_c = (_b = (_a = item.variant) == null ? void 0 : _a.product) == null ? void 0 : _b.shipping_profile) == null ? void 0 : _c.id) === shippingProfileId;
11556
+ const STACKED_FOCUS_MODAL_ID = "shipping-form";
11557
+ const Shipping = () => {
11558
+ var _a;
11559
+ const { id } = useParams();
11560
+ const { order, isPending, isError, error } = useOrder(id, {
11561
+ fields: "+items.*,+items.variant.*,+items.variant.product.*,+items.variant.product.shipping_profile.*,+currency_code"
11562
+ });
11563
+ const {
11564
+ order: preview,
11565
+ isPending: isPreviewPending,
11566
+ isError: isPreviewError,
11567
+ error: previewError
11568
+ } = useOrderPreview(id);
11569
+ useInitiateOrderEdit({ preview });
11570
+ const { onCancel } = useCancelOrderEdit({ preview });
11571
+ if (isError) {
11572
+ throw error;
11573
+ }
11574
+ if (isPreviewError) {
11575
+ throw previewError;
11576
+ }
11577
+ const orderHasItems = (((_a = order == null ? void 0 : order.items) == null ? void 0 : _a.length) || 0) > 0;
11578
+ const isReady = preview && !isPreviewPending && order && !isPending;
11579
+ return /* @__PURE__ */ jsx(RouteFocusModal, { onClose: onCancel, children: !orderHasItems ? /* @__PURE__ */ jsxs("div", { className: "flex h-full flex-col overflow-hidden ", children: [
11580
+ /* @__PURE__ */ jsx(RouteFocusModal.Header, {}),
11581
+ /* @__PURE__ */ jsx(RouteFocusModal.Body, { className: "flex flex-1 flex-col overflow-hidden", children: /* @__PURE__ */ jsx("div", { className: "flex flex-1 flex-col items-center overflow-y-auto", children: /* @__PURE__ */ jsxs("div", { className: "flex w-full max-w-[720px] flex-col gap-y-6 py-16 px-6", children: [
11582
+ /* @__PURE__ */ jsx(RouteFocusModal.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Shipping" }) }),
11583
+ /* @__PURE__ */ jsx(RouteFocusModal.Description, { asChild: true, children: /* @__PURE__ */ jsx(Text, { size: "small", className: "text-ui-fg-subtle", children: "This draft order currently has no items. Add items to the order before adding shipping." }) })
11584
+ ] }) }) }),
11585
+ /* @__PURE__ */ jsx(RouteFocusModal.Footer, { children: /* @__PURE__ */ jsx(RouteFocusModal.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", type: "button", children: "Cancel" }) }) })
11586
+ ] }) : isReady ? /* @__PURE__ */ jsx(ShippingForm, { preview, order }) : /* @__PURE__ */ jsxs("div", { children: [
11587
+ /* @__PURE__ */ jsx(RouteFocusModal.Title, { asChild: true, children: /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Edit Shipping" }) }),
11588
+ /* @__PURE__ */ jsx(RouteFocusModal.Description, { asChild: true, children: /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Loading data for the draft order, please wait..." }) })
11589
+ ] }) });
11590
+ };
11591
+ const ShippingForm = ({ preview, order }) => {
11592
+ var _a;
11593
+ const { setIsOpen } = useStackedModal();
11594
+ const [isSubmitting, setIsSubmitting] = useState(false);
11595
+ const [data, setData] = useState(null);
11596
+ const appliedShippingOptionIds = (_a = preview.shipping_methods) == null ? void 0 : _a.map((method) => method.shipping_option_id).filter(Boolean);
11597
+ const { shipping_options } = useShippingOptions(
11598
+ {
11599
+ id: appliedShippingOptionIds,
11600
+ fields: "+service_zone.*,+service_zone.fulfillment_set.*,+service_zone.fulfillment_set.location.*"
11601
+ },
11602
+ {
11603
+ enabled: appliedShippingOptionIds.length > 0
11754
11604
  }
11755
11605
  );
11756
- return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-y-6", children: [
11757
- /* @__PURE__ */ jsx("div", { className: "grid grid-cols-2 items-center gap-3", children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
11758
- /* @__PURE__ */ jsx(Text, { size: "small", weight: "plus", leading: "compact", children: "Items to ship" }),
11759
- /* @__PURE__ */ jsx(Text, { size: "small", className: "text-ui-fg-subtle", children: "Items with the selected shipping profile." })
11760
- ] }) }),
11761
- /* @__PURE__ */ jsxs("div", { className: "bg-ui-bg-subtle shadow-elevation-card-rest rounded-xl", children: [
11762
- /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-3 px-4 py-2 text-ui-fg-muted", children: [
11763
- /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(Text, { size: "small", weight: "plus", children: "Item" }) }),
11764
- /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(Text, { size: "small", weight: "plus", children: "Quantity" }) })
11765
- ] }),
11766
- /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-y-1.5 px-[5px] pb-[5px]", children: matches.length > 0 ? matches == null ? void 0 : matches.map((item) => /* @__PURE__ */ jsxs(
11767
- "div",
11768
- {
11769
- className: "grid grid-cols-2 gap-3 px-4 py-2 bg-ui-bg-base shadow-elevation-card-rest rounded-lg items-center",
11770
- children: [
11771
- /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-x-3", children: [
11772
- /* @__PURE__ */ jsx(
11773
- Thumbnail,
11774
- {
11775
- thumbnail: item.thumbnail,
11776
- alt: item.product_title ?? void 0
11777
- }
11778
- ),
11779
- /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
11780
- /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-x-1", children: [
11781
- /* @__PURE__ */ jsx(Text, { size: "small", weight: "plus", leading: "compact", children: item.product_title }),
11782
- /* @__PURE__ */ jsxs(
11783
- Text,
11784
- {
11785
- size: "small",
11786
- leading: "compact",
11787
- className: "text-ui-fg-subtle",
11788
- children: [
11789
- "(",
11790
- item.variant_title,
11791
- ")"
11792
- ]
11793
- }
11794
- )
11795
- ] }),
11796
- /* @__PURE__ */ jsx(
11797
- Text,
11798
- {
11799
- size: "small",
11800
- leading: "compact",
11801
- className: "text-ui-fg-subtle",
11802
- children: item.variant_sku
11803
- }
11804
- )
11805
- ] })
11806
- ] }),
11807
- /* @__PURE__ */ jsxs(
11606
+ const uniqueShippingProfiles = useMemo(() => {
11607
+ const profiles = /* @__PURE__ */ new Map();
11608
+ getUniqueShippingProfiles(order.items).forEach((profile) => {
11609
+ profiles.set(profile.id, profile);
11610
+ });
11611
+ shipping_options == null ? void 0 : shipping_options.forEach((option) => {
11612
+ profiles.set(option.shipping_profile_id, option.shipping_profile);
11613
+ });
11614
+ return Array.from(profiles.values());
11615
+ }, [order.items, shipping_options]);
11616
+ const { handleSuccess } = useRouteModal();
11617
+ const { mutateAsync: confirmOrderEdit } = useDraftOrderConfirmEdit(preview.id);
11618
+ const { mutateAsync: requestOrderEdit } = useDraftOrderRequestEdit(preview.id);
11619
+ const { mutateAsync: removeShippingMethod } = useDraftOrderRemoveShippingMethod(preview.id);
11620
+ const { mutateAsync: removeActionShippingMethod } = useDraftOrderRemoveActionShippingMethod(preview.id);
11621
+ const onSubmit = async () => {
11622
+ setIsSubmitting(true);
11623
+ let requestSucceeded = false;
11624
+ await requestOrderEdit(void 0, {
11625
+ onError: (e) => {
11626
+ toast.error(`Failed to request order edit: ${e.message}`);
11627
+ },
11628
+ onSuccess: () => {
11629
+ requestSucceeded = true;
11630
+ }
11631
+ });
11632
+ if (!requestSucceeded) {
11633
+ setIsSubmitting(false);
11634
+ return;
11635
+ }
11636
+ await confirmOrderEdit(void 0, {
11637
+ onError: (e) => {
11638
+ toast.error(`Failed to confirm order edit: ${e.message}`);
11639
+ },
11640
+ onSuccess: () => {
11641
+ handleSuccess();
11642
+ },
11643
+ onSettled: () => {
11644
+ setIsSubmitting(false);
11645
+ }
11646
+ });
11647
+ };
11648
+ const onKeydown = useCallback(
11649
+ (e) => {
11650
+ if (e.key === "Enter" && (e.ctrlKey || e.metaKey)) {
11651
+ if (data || isSubmitting) {
11652
+ return;
11653
+ }
11654
+ onSubmit();
11655
+ }
11656
+ },
11657
+ [data, isSubmitting, onSubmit]
11658
+ );
11659
+ useEffect(() => {
11660
+ document.addEventListener("keydown", onKeydown);
11661
+ return () => {
11662
+ document.removeEventListener("keydown", onKeydown);
11663
+ };
11664
+ }, [onKeydown]);
11665
+ return /* @__PURE__ */ jsxs("div", { className: "flex h-full flex-col overflow-hidden", children: [
11666
+ /* @__PURE__ */ jsx(RouteFocusModal.Header, {}),
11667
+ /* @__PURE__ */ jsxs(RouteFocusModal.Body, { className: "flex flex-1 flex-col overflow-hidden", children: [
11668
+ /* @__PURE__ */ jsx("div", { className: "flex flex-1 flex-col items-center overflow-y-auto", children: /* @__PURE__ */ jsxs("div", { className: "flex w-full max-w-[720px] flex-col gap-y-6 py-16 px-6", children: [
11669
+ /* @__PURE__ */ jsxs("div", { children: [
11670
+ /* @__PURE__ */ jsx(RouteFocusModal.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Shipping" }) }),
11671
+ /* @__PURE__ */ jsx(RouteFocusModal.Description, { asChild: true, children: /* @__PURE__ */ jsx(Text, { size: "small", className: "text-ui-fg-subtle", children: "Choose which shipping method(s) to use for the items in the order." }) })
11672
+ ] }),
11673
+ /* @__PURE__ */ jsx(Divider, { variant: "dashed" }),
11674
+ /* @__PURE__ */ jsx(Accordion.Root, { type: "multiple", children: /* @__PURE__ */ jsxs("div", { className: "bg-ui-bg-subtle rounded-xl shadow-elevation-card-rest", children: [
11675
+ /* @__PURE__ */ jsxs("div", { className: "px-4 py-2 flex items-center justify-between", children: [
11676
+ /* @__PURE__ */ jsx(
11808
11677
  Text,
11809
11678
  {
11810
- size: "small",
11811
- leading: "compact",
11812
- className: "text-ui-fg-subtle",
11679
+ size: "xsmall",
11680
+ weight: "plus",
11681
+ className: "text-ui-fg-muted",
11682
+ children: "Shipping profile"
11683
+ }
11684
+ ),
11685
+ /* @__PURE__ */ jsx(
11686
+ Text,
11687
+ {
11688
+ size: "xsmall",
11689
+ weight: "plus",
11690
+ className: "text-ui-fg-muted",
11691
+ children: "Action"
11692
+ }
11693
+ )
11694
+ ] }),
11695
+ /* @__PURE__ */ jsx("div", { className: "px-[5px] pb-[5px]", children: uniqueShippingProfiles.map((profile) => {
11696
+ var _a2, _b, _c, _d, _e, _f, _g;
11697
+ const items = getItemsWithShippingProfile(
11698
+ profile.id,
11699
+ order.items
11700
+ );
11701
+ const hasItems = items.length > 0;
11702
+ const shippingOption = shipping_options == null ? void 0 : shipping_options.find(
11703
+ (option) => option.shipping_profile_id === profile.id
11704
+ );
11705
+ const shippingMethod = preview.shipping_methods.find(
11706
+ (method) => method.shipping_option_id === (shippingOption == null ? void 0 : shippingOption.id)
11707
+ );
11708
+ const addShippingMethodAction = (_a2 = shippingMethod == null ? void 0 : shippingMethod.actions) == null ? void 0 : _a2.find(
11709
+ (action) => action.action === "SHIPPING_ADD"
11710
+ );
11711
+ return /* @__PURE__ */ jsxs(
11712
+ Accordion.Item,
11713
+ {
11714
+ value: profile.id,
11715
+ className: "bg-ui-bg-base shadow-elevation-card-rest rounded-lg",
11813
11716
  children: [
11814
- item.quantity,
11815
- "x"
11717
+ /* @__PURE__ */ jsxs("div", { className: "px-3 py-2 flex items-center justify-between gap-3", children: [
11718
+ /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-x-3 w-full overflow-hidden", children: [
11719
+ /* @__PURE__ */ jsx(Accordion.Trigger, { asChild: true, children: /* @__PURE__ */ jsx(
11720
+ IconButton,
11721
+ {
11722
+ size: "2xsmall",
11723
+ variant: "transparent",
11724
+ className: "group/trigger",
11725
+ disabled: !hasItems,
11726
+ children: /* @__PURE__ */ jsx(TriangleRightMini, { className: "group-data-[state=open]/trigger:rotate-90 transition-transform" })
11727
+ }
11728
+ ) }),
11729
+ !shippingOption ? /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-x-3", children: [
11730
+ /* @__PURE__ */ jsx("div", { className: "size-7 rounded-md shadow-borders-base flex items-center justify-center", children: /* @__PURE__ */ jsx("div", { className: "size-6 rounded bg-ui-bg-component-hover flex items-center justify-center", children: /* @__PURE__ */ jsx(Shopping, { className: "text-ui-fg-subtle" }) }) }),
11731
+ /* @__PURE__ */ jsxs("div", { className: "flex flex-col flex-1", children: [
11732
+ /* @__PURE__ */ jsx(
11733
+ Text,
11734
+ {
11735
+ size: "small",
11736
+ weight: "plus",
11737
+ leading: "compact",
11738
+ children: profile.name
11739
+ }
11740
+ ),
11741
+ /* @__PURE__ */ jsxs(
11742
+ Text,
11743
+ {
11744
+ size: "small",
11745
+ leading: "compact",
11746
+ className: "text-ui-fg-subtle",
11747
+ children: [
11748
+ items.length,
11749
+ " ",
11750
+ pluralize(items.length, "items", "item")
11751
+ ]
11752
+ }
11753
+ )
11754
+ ] })
11755
+ ] }) : /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-[5px] max-sm:flex-col max-sm:items-start flex-1 w-full overflow-hidden", children: [
11756
+ /* @__PURE__ */ jsx(
11757
+ Tooltip,
11758
+ {
11759
+ content: /* @__PURE__ */ jsx("ul", { children: items.map((item) => {
11760
+ var _a3, _b2, _c2;
11761
+ return /* @__PURE__ */ jsx(
11762
+ "li",
11763
+ {
11764
+ children: `${item.quantity}x ${(_b2 = (_a3 = item.variant) == null ? void 0 : _a3.product) == null ? void 0 : _b2.title} (${(_c2 = item.variant) == null ? void 0 : _c2.title})`
11765
+ },
11766
+ item.id
11767
+ );
11768
+ }) }),
11769
+ children: /* @__PURE__ */ jsxs(
11770
+ Badge,
11771
+ {
11772
+ className: "flex items-center gap-x-[3px] overflow-hidden cursor-default",
11773
+ size: "xsmall",
11774
+ children: [
11775
+ /* @__PURE__ */ jsx(Shopping, { className: "shrink-0" }),
11776
+ /* @__PURE__ */ jsxs("span", { className: "truncate", children: [
11777
+ items.reduce(
11778
+ (acc, item) => acc + item.quantity,
11779
+ 0
11780
+ ),
11781
+ "x",
11782
+ " ",
11783
+ pluralize(items.length, "items", "item")
11784
+ ] })
11785
+ ]
11786
+ }
11787
+ )
11788
+ }
11789
+ ),
11790
+ /* @__PURE__ */ jsx(
11791
+ Tooltip,
11792
+ {
11793
+ content: (_d = (_c = (_b = shippingOption.service_zone) == null ? void 0 : _b.fulfillment_set) == null ? void 0 : _c.location) == null ? void 0 : _d.name,
11794
+ children: /* @__PURE__ */ jsxs(
11795
+ Badge,
11796
+ {
11797
+ className: "flex items-center gap-x-[3px] overflow-hidden cursor-default",
11798
+ size: "xsmall",
11799
+ children: [
11800
+ /* @__PURE__ */ jsx(Buildings, { className: "shrink-0" }),
11801
+ /* @__PURE__ */ jsx("span", { className: "truncate", children: (_g = (_f = (_e = shippingOption.service_zone) == null ? void 0 : _e.fulfillment_set) == null ? void 0 : _f.location) == null ? void 0 : _g.name })
11802
+ ]
11803
+ }
11804
+ )
11805
+ }
11806
+ ),
11807
+ /* @__PURE__ */ jsx(Tooltip, { content: shippingOption.name, children: /* @__PURE__ */ jsxs(
11808
+ Badge,
11809
+ {
11810
+ className: "flex items-center gap-x-[3px] overflow-hidden cursor-default",
11811
+ size: "xsmall",
11812
+ children: [
11813
+ /* @__PURE__ */ jsx(TruckFast, { className: "shrink-0" }),
11814
+ /* @__PURE__ */ jsx("span", { className: "truncate", children: shippingOption.name })
11815
+ ]
11816
+ }
11817
+ ) })
11818
+ ] })
11819
+ ] }),
11820
+ shippingOption ? /* @__PURE__ */ jsx(
11821
+ ActionMenu,
11822
+ {
11823
+ groups: [
11824
+ {
11825
+ actions: [
11826
+ hasItems ? {
11827
+ label: "Edit shipping option",
11828
+ icon: /* @__PURE__ */ jsx(Channels, {}),
11829
+ onClick: () => {
11830
+ setIsOpen(
11831
+ STACKED_FOCUS_MODAL_ID,
11832
+ true
11833
+ );
11834
+ setData({
11835
+ shippingProfileId: profile.id,
11836
+ shippingOption,
11837
+ shippingMethod
11838
+ });
11839
+ }
11840
+ } : void 0,
11841
+ {
11842
+ label: "Remove shipping option",
11843
+ icon: /* @__PURE__ */ jsx(Trash, {}),
11844
+ onClick: () => {
11845
+ if (shippingMethod) {
11846
+ if (addShippingMethodAction) {
11847
+ removeActionShippingMethod(
11848
+ addShippingMethodAction.id
11849
+ );
11850
+ } else {
11851
+ removeShippingMethod(
11852
+ shippingMethod.id
11853
+ );
11854
+ }
11855
+ }
11856
+ }
11857
+ }
11858
+ ].filter(Boolean)
11859
+ }
11860
+ ]
11861
+ }
11862
+ ) : /* @__PURE__ */ jsx(
11863
+ StackedModalTrigger,
11864
+ {
11865
+ shippingProfileId: profile.id,
11866
+ shippingOption,
11867
+ shippingMethod,
11868
+ setData,
11869
+ children: "Add shipping option"
11870
+ }
11871
+ )
11872
+ ] }),
11873
+ /* @__PURE__ */ jsxs(Accordion.Content, { children: [
11874
+ /* @__PURE__ */ jsx(Divider, { variant: "dashed" }),
11875
+ items.map((item, idx) => {
11876
+ var _a3, _b2, _c2, _d2, _e2;
11877
+ return /* @__PURE__ */ jsxs("div", { children: [
11878
+ /* @__PURE__ */ jsxs(
11879
+ "div",
11880
+ {
11881
+ className: "px-3 flex items-center gap-x-3",
11882
+ children: [
11883
+ /* @__PURE__ */ jsx("div", { className: "w-5 h-[56px] flex flex-col justify-center items-center", children: /* @__PURE__ */ jsx(
11884
+ Divider,
11885
+ {
11886
+ variant: "dashed",
11887
+ orientation: "vertical"
11888
+ }
11889
+ ) }),
11890
+ /* @__PURE__ */ jsxs("div", { className: "py-2 flex items-center gap-x-3", children: [
11891
+ /* @__PURE__ */ jsx("div", { className: "size-7 flex items-center justify-center tabular-nums", children: /* @__PURE__ */ jsxs(
11892
+ Text,
11893
+ {
11894
+ size: "small",
11895
+ leading: "compact",
11896
+ className: "text-ui-fg-subtle",
11897
+ children: [
11898
+ item.quantity,
11899
+ "x"
11900
+ ]
11901
+ }
11902
+ ) }),
11903
+ /* @__PURE__ */ jsx(Thumbnail, { thumbnail: item.thumbnail }),
11904
+ /* @__PURE__ */ jsxs("div", { children: [
11905
+ /* @__PURE__ */ jsxs(
11906
+ Text,
11907
+ {
11908
+ size: "small",
11909
+ leading: "compact",
11910
+ weight: "plus",
11911
+ children: [
11912
+ (_b2 = (_a3 = item.variant) == null ? void 0 : _a3.product) == null ? void 0 : _b2.title,
11913
+ " (",
11914
+ (_c2 = item.variant) == null ? void 0 : _c2.title,
11915
+ ")"
11916
+ ]
11917
+ }
11918
+ ),
11919
+ /* @__PURE__ */ jsx(
11920
+ Text,
11921
+ {
11922
+ size: "small",
11923
+ leading: "compact",
11924
+ className: "text-ui-fg-subtle",
11925
+ children: (_e2 = (_d2 = item.variant) == null ? void 0 : _d2.options) == null ? void 0 : _e2.map((option) => option.value).join(" · ")
11926
+ }
11927
+ )
11928
+ ] })
11929
+ ] })
11930
+ ]
11931
+ },
11932
+ item.id
11933
+ ),
11934
+ idx !== items.length - 1 && /* @__PURE__ */ jsx(Divider, { variant: "dashed" })
11935
+ ] }, item.id);
11936
+ })
11937
+ ] })
11816
11938
  ]
11817
- }
11818
- )
11819
- ]
11820
- },
11821
- item.id
11822
- )) : /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-center gap-x-3 bg-ui-bg-base rounded-lg p-4 shadow-elevation-card-rest flex-col gap-1", children: [
11823
- /* @__PURE__ */ jsx(Text, { size: "small", weight: "plus", leading: "compact", children: "No items found" }),
11824
- /* @__PURE__ */ jsxs(Text, { size: "small", className: "text-ui-fg-subtle", children: [
11825
- 'No items found for "',
11826
- query,
11827
- '".'
11828
- ] })
11829
- ] }) })
11830
- ] })
11831
- ] });
11832
- };
11833
- const LocationField = ({ control, setValue }) => {
11834
- const locations = useComboboxData({
11835
- queryKey: ["locations"],
11836
- queryFn: async (params) => {
11837
- return await sdk.admin.stockLocation.list(params);
11838
- },
11839
- getOptions: (data) => {
11840
- return data.stock_locations.map((location) => ({
11841
- label: location.name,
11842
- value: location.id
11843
- }));
11844
- }
11845
- });
11846
- return /* @__PURE__ */ jsx(
11847
- Form$2.Field,
11848
- {
11849
- control,
11850
- name: "location_id",
11851
- render: ({ field: { onChange, ...field } }) => {
11852
- return /* @__PURE__ */ jsx(Form$2.Item, { children: /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-x-3", children: [
11853
- /* @__PURE__ */ jsxs("div", { children: [
11854
- /* @__PURE__ */ jsx(Form$2.Label, { children: "Location" }),
11855
- /* @__PURE__ */ jsx(Form$2.Hint, { children: "Choose where you want to ship the items from." })
11856
- ] }),
11857
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(
11858
- Combobox,
11859
- {
11860
- options: locations.options,
11861
- fetchNextPage: locations.fetchNextPage,
11862
- isFetchingNextPage: locations.isFetchingNextPage,
11863
- searchValue: locations.searchValue,
11864
- onSearchValueChange: locations.onSearchValueChange,
11865
- placeholder: "Select location",
11866
- onChange: (value) => {
11867
- setValue("shipping_option_id", "", {
11868
- shouldDirty: true,
11869
- shouldTouch: true
11870
- });
11871
- onChange(value);
11872
11939
  },
11873
- ...field
11940
+ profile.id
11941
+ );
11942
+ }) })
11943
+ ] }) })
11944
+ ] }) }),
11945
+ /* @__PURE__ */ jsx(
11946
+ StackedFocusModal,
11947
+ {
11948
+ id: STACKED_FOCUS_MODAL_ID,
11949
+ onOpenChangeCallback: (open) => {
11950
+ if (!open) {
11951
+ setData(null);
11874
11952
  }
11875
- ) })
11876
- ] }) });
11877
- }
11878
- }
11879
- );
11880
- };
11881
- const ShippingOptionField = ({
11882
- shippingProfileId,
11883
- preview,
11884
- control
11885
- }) => {
11886
- var _a;
11887
- const locationId = useWatch({ control, name: "location_id" });
11888
- const shippingOptions = useComboboxData({
11889
- queryKey: ["shipping_options", locationId, shippingProfileId],
11890
- queryFn: async (params) => {
11891
- return await sdk.admin.shippingOption.list({
11892
- ...params,
11893
- stock_location_id: locationId,
11894
- shipping_profile_id: shippingProfileId
11895
- });
11896
- },
11897
- getOptions: (data) => {
11898
- return data.shipping_options.map((option) => {
11899
- var _a2;
11900
- if ((_a2 = option.rules) == null ? void 0 : _a2.find(
11901
- (r) => r.attribute === "is_return" && r.value === "true"
11902
- )) {
11903
- return void 0;
11953
+ return open;
11954
+ },
11955
+ children: data && /* @__PURE__ */ jsx(ShippingProfileForm, { data, order, preview })
11904
11956
  }
11905
- return {
11906
- label: option.name,
11907
- value: option.id
11908
- };
11909
- }).filter(Boolean);
11910
- },
11911
- enabled: !!locationId && !!shippingProfileId,
11912
- defaultValue: ((_a = preview.shipping_methods[0]) == null ? void 0 : _a.shipping_option_id) || void 0
11913
- });
11914
- const tooltipContent = !locationId && !shippingProfileId ? "Choose a location and shipping profile first." : !locationId ? "Choose a location first." : "Choose a shipping profile first.";
11915
- return /* @__PURE__ */ jsx(
11916
- Form$2.Field,
11917
- {
11918
- control,
11919
- name: "shipping_option_id",
11920
- render: ({ field }) => {
11921
- return /* @__PURE__ */ jsx(Form$2.Item, { children: /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-x-3", children: [
11922
- /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
11923
- /* @__PURE__ */ jsx(Form$2.Label, { children: "Shipping option" }),
11924
- /* @__PURE__ */ jsx(Form$2.Hint, { children: "Choose the shipping option to use." })
11925
- ] }),
11926
- /* @__PURE__ */ jsx(
11927
- ConditionalTooltip,
11928
- {
11929
- content: tooltipContent,
11930
- showTooltip: !locationId || !shippingProfileId,
11931
- children: /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(
11932
- Combobox,
11933
- {
11934
- options: shippingOptions.options,
11935
- fetchNextPage: shippingOptions.fetchNextPage,
11936
- isFetchingNextPage: shippingOptions.isFetchingNextPage,
11937
- searchValue: shippingOptions.searchValue,
11938
- onSearchValueChange: shippingOptions.onSearchValueChange,
11939
- placeholder: "Select shipping option",
11940
- ...field,
11941
- disabled: !locationId || !shippingProfileId
11942
- }
11943
- ) }) })
11944
- }
11945
- )
11946
- ] }) });
11947
- }
11948
- }
11949
- );
11950
- };
11951
- const CustomAmountField = ({
11952
- control,
11953
- currencyCode
11954
- }) => {
11955
- return /* @__PURE__ */ jsx(
11956
- Form$2.Field,
11957
- {
11958
- control,
11959
- name: "custom_amount",
11960
- render: ({ field: { onChange, ...field } }) => {
11961
- return /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-x-3", children: [
11962
- /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
11963
- /* @__PURE__ */ jsx(Form$2.Label, { optional: true, children: "Custom amount" }),
11964
- /* @__PURE__ */ jsx(Form$2.Hint, { children: "Set a custom amount for the shipping option." })
11965
- ] }),
11966
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(
11967
- CurrencyInput,
11968
- {
11969
- ...field,
11970
- onValueChange: (value) => onChange(value),
11971
- symbol: getNativeSymbol(currencyCode),
11972
- code: currencyCode
11973
- }
11974
- ) })
11975
- ] });
11976
- }
11977
- }
11978
- );
11979
- };
11980
- const SalesChannel = () => {
11981
- const { id } = useParams();
11982
- const { draft_order, isPending, isError, error } = useDraftOrder(
11983
- id,
11984
- {
11985
- fields: "+sales_channel_id"
11986
- },
11987
- {
11988
- enabled: !!id
11989
- }
11990
- );
11991
- if (isError) {
11992
- throw error;
11993
- }
11994
- const ISrEADY = !!draft_order && !isPending;
11995
- return /* @__PURE__ */ jsxs(RouteDrawer, { children: [
11996
- /* @__PURE__ */ jsxs(RouteDrawer.Header, { children: [
11997
- /* @__PURE__ */ jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Edit Sales Channel" }) }),
11998
- /* @__PURE__ */ jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Update which sales channel the draft order is associated with" }) })
11957
+ )
11999
11958
  ] }),
12000
- ISrEADY && /* @__PURE__ */ jsx(SalesChannelForm, { order: draft_order })
11959
+ /* @__PURE__ */ jsx(RouteFocusModal.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex justify-end gap-x-2", children: [
11960
+ /* @__PURE__ */ jsx(RouteFocusModal.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", type: "button", children: "Cancel" }) }),
11961
+ /* @__PURE__ */ jsx(
11962
+ Button,
11963
+ {
11964
+ size: "small",
11965
+ type: "button",
11966
+ isLoading: isSubmitting,
11967
+ onClick: onSubmit,
11968
+ children: "Save"
11969
+ }
11970
+ )
11971
+ ] }) })
12001
11972
  ] });
12002
11973
  };
12003
- const SalesChannelForm = ({ order }) => {
12004
- const form = useForm({
12005
- defaultValues: {
12006
- sales_channel_id: order.sales_channel_id || ""
12007
- },
12008
- resolver: zodResolver(schema$2)
12009
- });
12010
- const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
12011
- const { handleSuccess } = useRouteModal();
12012
- const onSubmit = form.handleSubmit(async (data) => {
12013
- await mutateAsync(
12014
- {
12015
- sales_channel_id: data.sales_channel_id
12016
- },
12017
- {
12018
- onSuccess: () => {
12019
- toast.success("Sales channel updated");
12020
- handleSuccess();
12021
- },
12022
- onError: (error) => {
12023
- toast.error(error.message);
12024
- }
12025
- }
12026
- );
12027
- });
12028
- return /* @__PURE__ */ jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxs(
12029
- KeyboundForm,
12030
- {
12031
- className: "flex flex-1 flex-col overflow-hidden",
12032
- onSubmit,
12033
- children: [
12034
- /* @__PURE__ */ jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsx(SalesChannelField, { control: form.control, order }) }),
12035
- /* @__PURE__ */ jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex justify-end gap-2", children: [
12036
- /* @__PURE__ */ jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
12037
- /* @__PURE__ */ jsx(Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
12038
- ] }) })
12039
- ]
11974
+ const StackedModalTrigger = ({
11975
+ shippingProfileId,
11976
+ shippingOption,
11977
+ shippingMethod,
11978
+ setData,
11979
+ children
11980
+ }) => {
11981
+ const { setIsOpen, getIsOpen } = useStackedModal();
11982
+ const isOpen = getIsOpen(STACKED_FOCUS_MODAL_ID);
11983
+ const onToggle = () => {
11984
+ if (isOpen) {
11985
+ setIsOpen(STACKED_FOCUS_MODAL_ID, false);
11986
+ setData(null);
11987
+ } else {
11988
+ setIsOpen(STACKED_FOCUS_MODAL_ID, true);
11989
+ setData({
11990
+ shippingProfileId,
11991
+ shippingOption,
11992
+ shippingMethod
11993
+ });
12040
11994
  }
12041
- ) });
12042
- };
12043
- const SalesChannelField = ({ control, order }) => {
12044
- const salesChannels = useComboboxData({
12045
- queryFn: async (params) => {
12046
- return await sdk.admin.salesChannel.list(params);
12047
- },
12048
- queryKey: ["sales-channels"],
12049
- getOptions: (data) => {
12050
- return data.sales_channels.map((salesChannel) => ({
12051
- label: salesChannel.name,
12052
- value: salesChannel.id
12053
- }));
12054
- },
12055
- defaultValue: order.sales_channel_id || void 0
12056
- });
11995
+ };
12057
11996
  return /* @__PURE__ */ jsx(
12058
- Form$2.Field,
11997
+ Button,
12059
11998
  {
12060
- control,
12061
- name: "sales_channel_id",
12062
- render: ({ field }) => {
12063
- return /* @__PURE__ */ jsxs(Form$2.Item, { children: [
12064
- /* @__PURE__ */ jsx(Form$2.Label, { children: "Sales Channel" }),
12065
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(
12066
- Combobox,
12067
- {
12068
- options: salesChannels.options,
12069
- fetchNextPage: salesChannels.fetchNextPage,
12070
- isFetchingNextPage: salesChannels.isFetchingNextPage,
12071
- searchValue: salesChannels.searchValue,
12072
- onSearchValueChange: salesChannels.onSearchValueChange,
12073
- placeholder: "Select sales channel",
12074
- ...field
12075
- }
12076
- ) }),
12077
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
12078
- ] });
12079
- }
11999
+ size: "small",
12000
+ variant: "secondary",
12001
+ onClick: onToggle,
12002
+ className: "text-ui-fg-primary shrink-0",
12003
+ children
12080
12004
  }
12081
12005
  );
12082
12006
  };
12083
- const schema$2 = objectType({
12084
- sales_channel_id: stringType().min(1)
12085
- });
12086
- const ShippingAddress = () => {
12087
- const { id } = useParams();
12088
- const { order, isPending, isError, error } = useOrder(id, {
12089
- fields: "+shipping_address"
12090
- });
12091
- if (isError) {
12092
- throw error;
12093
- }
12094
- const isReady = !isPending && !!order;
12095
- return /* @__PURE__ */ jsxs(RouteDrawer, { children: [
12096
- /* @__PURE__ */ jsxs(RouteDrawer.Header, { children: [
12097
- /* @__PURE__ */ jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Edit Shipping Address" }) }),
12098
- /* @__PURE__ */ jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Edit the shipping address for the draft order" }) })
12099
- ] }),
12100
- isReady && /* @__PURE__ */ jsx(ShippingAddressForm, { order })
12101
- ] });
12102
- };
12103
- const ShippingAddressForm = ({ order }) => {
12104
- var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
12007
+ const ShippingProfileForm = ({
12008
+ data,
12009
+ order,
12010
+ preview
12011
+ }) => {
12012
+ var _a, _b, _c, _d, _e, _f;
12013
+ const { setIsOpen } = useStackedModal();
12105
12014
  const form = useForm({
12015
+ resolver: zodResolver(shippingMethodSchema),
12106
12016
  defaultValues: {
12107
- first_name: ((_a = order.shipping_address) == null ? void 0 : _a.first_name) ?? "",
12108
- last_name: ((_b = order.shipping_address) == null ? void 0 : _b.last_name) ?? "",
12109
- company: ((_c = order.shipping_address) == null ? void 0 : _c.company) ?? "",
12110
- address_1: ((_d = order.shipping_address) == null ? void 0 : _d.address_1) ?? "",
12111
- address_2: ((_e = order.shipping_address) == null ? void 0 : _e.address_2) ?? "",
12112
- city: ((_f = order.shipping_address) == null ? void 0 : _f.city) ?? "",
12113
- province: ((_g = order.shipping_address) == null ? void 0 : _g.province) ?? "",
12114
- country_code: ((_h = order.shipping_address) == null ? void 0 : _h.country_code) ?? "",
12115
- postal_code: ((_i = order.shipping_address) == null ? void 0 : _i.postal_code) ?? "",
12116
- phone: ((_j = order.shipping_address) == null ? void 0 : _j.phone) ?? ""
12117
- },
12118
- resolver: zodResolver(schema$1)
12017
+ location_id: (_d = (_c = (_b = (_a = data.shippingOption) == null ? void 0 : _a.service_zone) == null ? void 0 : _b.fulfillment_set) == null ? void 0 : _c.location) == null ? void 0 : _d.id,
12018
+ shipping_option_id: (_e = data.shippingOption) == null ? void 0 : _e.id,
12019
+ custom_amount: (_f = data.shippingMethod) == null ? void 0 : _f.amount
12020
+ }
12119
12021
  });
12120
- const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
12121
- const { handleSuccess } = useRouteModal();
12122
- const onSubmit = form.handleSubmit(async (data) => {
12123
- await mutateAsync(
12124
- {
12125
- shipping_address: {
12126
- first_name: data.first_name,
12127
- last_name: data.last_name,
12128
- company: data.company,
12129
- address_1: data.address_1,
12130
- address_2: data.address_2,
12131
- city: data.city,
12132
- province: data.province,
12133
- country_code: data.country_code,
12134
- postal_code: data.postal_code,
12135
- phone: data.phone
12022
+ const { mutateAsync: addShippingMethod, isPending } = useDraftOrderAddShippingMethod(order.id);
12023
+ const {
12024
+ mutateAsync: updateShippingMethod,
12025
+ isPending: isUpdatingShippingMethod
12026
+ } = useDraftOrderUpdateShippingMethod(order.id);
12027
+ const onSubmit = form.handleSubmit(async (values) => {
12028
+ if (isEqual(values, form.formState.defaultValues)) {
12029
+ setIsOpen(STACKED_FOCUS_MODAL_ID, false);
12030
+ return;
12031
+ }
12032
+ if (data.shippingMethod) {
12033
+ await updateShippingMethod(
12034
+ {
12035
+ method_id: data.shippingMethod.id,
12036
+ shipping_option_id: values.shipping_option_id,
12037
+ custom_amount: values.custom_amount ? convertNumber(values.custom_amount) : void 0
12038
+ },
12039
+ {
12040
+ onError: (e) => {
12041
+ toast.error(e.message);
12042
+ },
12043
+ onSuccess: () => {
12044
+ setIsOpen(STACKED_FOCUS_MODAL_ID, false);
12045
+ }
12136
12046
  }
12047
+ );
12048
+ return;
12049
+ }
12050
+ await addShippingMethod(
12051
+ {
12052
+ shipping_option_id: values.shipping_option_id,
12053
+ custom_amount: values.custom_amount ? convertNumber(values.custom_amount) : void 0
12137
12054
  },
12138
12055
  {
12139
- onSuccess: () => {
12140
- handleSuccess();
12056
+ onError: (e) => {
12057
+ toast.error(e.message);
12141
12058
  },
12142
- onError: (error) => {
12143
- toast.error(error.message);
12059
+ onSuccess: () => {
12060
+ setIsOpen(STACKED_FOCUS_MODAL_ID, false);
12144
12061
  }
12145
12062
  }
12146
12063
  );
12147
12064
  });
12148
- return /* @__PURE__ */ jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxs(
12065
+ return /* @__PURE__ */ jsx(StackedFocusModal.Content, { children: /* @__PURE__ */ jsx(Form$2, { ...form, children: /* @__PURE__ */ jsxs(
12149
12066
  KeyboundForm,
12150
12067
  {
12151
- className: "flex flex-1 flex-col overflow-hidden",
12068
+ className: "flex h-full flex-col overflow-hidden",
12152
12069
  onSubmit,
12153
12070
  children: [
12154
- /* @__PURE__ */ jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-y-4", children: [
12155
- /* @__PURE__ */ jsx(
12156
- Form$2.Field,
12157
- {
12158
- control: form.control,
12159
- name: "country_code",
12160
- render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
12161
- /* @__PURE__ */ jsx(Form$2.Label, { children: "Country" }),
12162
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(CountrySelect, { ...field }) }),
12163
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
12164
- ] })
12165
- }
12166
- ),
12167
- /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
12168
- /* @__PURE__ */ jsx(
12169
- Form$2.Field,
12170
- {
12171
- control: form.control,
12172
- name: "first_name",
12173
- render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
12174
- /* @__PURE__ */ jsx(Form$2.Label, { children: "First name" }),
12175
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
12176
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
12177
- ] })
12178
- }
12179
- ),
12180
- /* @__PURE__ */ jsx(
12181
- Form$2.Field,
12182
- {
12183
- control: form.control,
12184
- name: "last_name",
12185
- render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
12186
- /* @__PURE__ */ jsx(Form$2.Label, { children: "Last name" }),
12187
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
12188
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
12189
- ] })
12190
- }
12191
- )
12071
+ /* @__PURE__ */ jsx(StackedFocusModal.Header, {}),
12072
+ /* @__PURE__ */ jsx(StackedFocusModal.Body, { className: "flex flex-1 flex-col overflow-hidden", children: /* @__PURE__ */ jsx("div", { className: "flex flex-1 flex-col items-center overflow-y-auto", children: /* @__PURE__ */ jsxs("div", { className: "flex w-full max-w-[720px] flex-col gap-y-6 py-16 px-6", children: [
12073
+ /* @__PURE__ */ jsxs("div", { children: [
12074
+ /* @__PURE__ */ jsx(RouteFocusModal.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Shipping" }) }),
12075
+ /* @__PURE__ */ jsx(RouteFocusModal.Description, { asChild: true, children: /* @__PURE__ */ jsx(Text, { size: "small", className: "text-ui-fg-subtle", children: "Add a shipping method for the selected shipping profile. You can see the items that will be shipped using this method in the preview below." }) })
12192
12076
  ] }),
12077
+ /* @__PURE__ */ jsx(Divider, { variant: "dashed" }),
12193
12078
  /* @__PURE__ */ jsx(
12194
- Form$2.Field,
12079
+ LocationField,
12195
12080
  {
12196
12081
  control: form.control,
12197
- name: "company",
12198
- render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
12199
- /* @__PURE__ */ jsx(Form$2.Label, { optional: true, children: "Company" }),
12200
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
12201
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
12202
- ] })
12082
+ setValue: form.setValue
12203
12083
  }
12204
12084
  ),
12085
+ /* @__PURE__ */ jsx(Divider, { variant: "dashed" }),
12205
12086
  /* @__PURE__ */ jsx(
12206
- Form$2.Field,
12087
+ ShippingOptionField,
12207
12088
  {
12208
- control: form.control,
12209
- name: "address_1",
12210
- render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
12211
- /* @__PURE__ */ jsx(Form$2.Label, { children: "Address" }),
12212
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
12213
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
12214
- ] })
12089
+ shippingProfileId: data.shippingProfileId,
12090
+ preview,
12091
+ control: form.control
12215
12092
  }
12216
12093
  ),
12094
+ /* @__PURE__ */ jsx(Divider, { variant: "dashed" }),
12217
12095
  /* @__PURE__ */ jsx(
12218
- Form$2.Field,
12096
+ CustomAmountField,
12219
12097
  {
12220
12098
  control: form.control,
12221
- name: "address_2",
12222
- render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
12223
- /* @__PURE__ */ jsx(Form$2.Label, { optional: true, children: "Apartment, suite, etc." }),
12224
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
12225
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
12226
- ] })
12099
+ currencyCode: order.currency_code
12227
12100
  }
12228
12101
  ),
12229
- /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
12230
- /* @__PURE__ */ jsx(
12231
- Form$2.Field,
12232
- {
12233
- control: form.control,
12234
- name: "postal_code",
12235
- render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
12236
- /* @__PURE__ */ jsx(Form$2.Label, { children: "Postal code" }),
12237
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
12238
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
12239
- ] })
12240
- }
12241
- ),
12242
- /* @__PURE__ */ jsx(
12243
- Form$2.Field,
12244
- {
12245
- control: form.control,
12246
- name: "city",
12247
- render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
12248
- /* @__PURE__ */ jsx(Form$2.Label, { children: "City" }),
12249
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
12250
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
12251
- ] })
12252
- }
12253
- )
12254
- ] }),
12102
+ /* @__PURE__ */ jsx(Divider, { variant: "dashed" }),
12255
12103
  /* @__PURE__ */ jsx(
12256
- Form$2.Field,
12104
+ ItemsPreview,
12257
12105
  {
12258
- control: form.control,
12259
- name: "province",
12260
- render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
12261
- /* @__PURE__ */ jsx(Form$2.Label, { optional: true, children: "Province / State" }),
12262
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
12263
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
12264
- ] })
12106
+ order,
12107
+ shippingProfileId: data.shippingProfileId
12265
12108
  }
12266
- ),
12109
+ )
12110
+ ] }) }) }),
12111
+ /* @__PURE__ */ jsx(StackedFocusModal.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex justify-end gap-x-2", children: [
12112
+ /* @__PURE__ */ jsx(StackedFocusModal.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", type: "button", children: "Cancel" }) }),
12267
12113
  /* @__PURE__ */ jsx(
12268
- Form$2.Field,
12114
+ Button,
12269
12115
  {
12270
- control: form.control,
12271
- name: "phone",
12272
- render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
12273
- /* @__PURE__ */ jsx(Form$2.Label, { optional: true, children: "Phone" }),
12274
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
12275
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
12276
- ] })
12116
+ size: "small",
12117
+ type: "submit",
12118
+ isLoading: isPending || isUpdatingShippingMethod,
12119
+ children: data.shippingMethod ? "Update" : "Add"
12277
12120
  }
12278
12121
  )
12279
- ] }) }),
12280
- /* @__PURE__ */ jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex justify-end gap-2", children: [
12281
- /* @__PURE__ */ jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
12282
- /* @__PURE__ */ jsx(Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
12283
12122
  ] }) })
12284
12123
  ]
12285
12124
  }
12286
- ) });
12287
- };
12288
- const schema$1 = addressSchema;
12289
- const PROMOTION_QUERY_KEY = "promotions";
12290
- const promotionsQueryKeys = {
12291
- list: (query2) => [
12292
- PROMOTION_QUERY_KEY,
12293
- query2 ? query2 : void 0
12294
- ],
12295
- detail: (id, query2) => [
12296
- PROMOTION_QUERY_KEY,
12297
- id,
12298
- query2 ? query2 : void 0
12299
- ]
12300
- };
12301
- const usePromotions = (query2, options) => {
12302
- const { data, ...rest } = useQuery({
12303
- queryKey: promotionsQueryKeys.list(query2),
12304
- queryFn: async () => sdk.admin.promotion.list(query2),
12305
- ...options
12306
- });
12307
- return { ...data, ...rest };
12125
+ ) }) });
12308
12126
  };
12309
- const Promotions = () => {
12310
- const { id } = useParams();
12311
- const {
12312
- order: preview,
12313
- isError: isPreviewError,
12314
- error: previewError
12315
- } = useOrderPreview(id, void 0);
12316
- useInitiateOrderEdit({ preview });
12317
- const { onCancel } = useCancelOrderEdit({ preview });
12318
- if (isPreviewError) {
12319
- throw previewError;
12320
- }
12321
- const isReady = !!preview;
12322
- return /* @__PURE__ */ jsxs(RouteDrawer, { onClose: onCancel, children: [
12323
- /* @__PURE__ */ jsx(RouteDrawer.Header, { children: /* @__PURE__ */ jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Edit Promotions" }) }) }),
12324
- isReady && /* @__PURE__ */ jsx(PromotionForm, { preview })
12127
+ const shippingMethodSchema = objectType({
12128
+ location_id: stringType(),
12129
+ shipping_option_id: stringType(),
12130
+ custom_amount: unionType([numberType(), stringType()]).optional()
12131
+ });
12132
+ const ItemsPreview = ({ order, shippingProfileId }) => {
12133
+ const matches = order.items.filter(
12134
+ (item) => {
12135
+ var _a, _b, _c;
12136
+ return ((_c = (_b = (_a = item.variant) == null ? void 0 : _a.product) == null ? void 0 : _b.shipping_profile) == null ? void 0 : _c.id) === shippingProfileId;
12137
+ }
12138
+ );
12139
+ return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-y-6", children: [
12140
+ /* @__PURE__ */ jsx("div", { className: "grid grid-cols-2 items-center gap-3", children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
12141
+ /* @__PURE__ */ jsx(Text, { size: "small", weight: "plus", leading: "compact", children: "Items to ship" }),
12142
+ /* @__PURE__ */ jsx(Text, { size: "small", className: "text-ui-fg-subtle", children: "Items with the selected shipping profile." })
12143
+ ] }) }),
12144
+ /* @__PURE__ */ jsxs("div", { className: "bg-ui-bg-subtle shadow-elevation-card-rest rounded-xl", children: [
12145
+ /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-3 px-4 py-2 text-ui-fg-muted", children: [
12146
+ /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(Text, { size: "small", weight: "plus", children: "Item" }) }),
12147
+ /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(Text, { size: "small", weight: "plus", children: "Quantity" }) })
12148
+ ] }),
12149
+ /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-y-1.5 px-[5px] pb-[5px]", children: matches.length > 0 ? matches == null ? void 0 : matches.map((item) => /* @__PURE__ */ jsxs(
12150
+ "div",
12151
+ {
12152
+ className: "grid grid-cols-2 gap-3 px-4 py-2 bg-ui-bg-base shadow-elevation-card-rest rounded-lg items-center",
12153
+ children: [
12154
+ /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-x-3", children: [
12155
+ /* @__PURE__ */ jsx(
12156
+ Thumbnail,
12157
+ {
12158
+ thumbnail: item.thumbnail,
12159
+ alt: item.product_title ?? void 0
12160
+ }
12161
+ ),
12162
+ /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
12163
+ /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-x-1", children: [
12164
+ /* @__PURE__ */ jsx(Text, { size: "small", weight: "plus", leading: "compact", children: item.product_title }),
12165
+ /* @__PURE__ */ jsxs(
12166
+ Text,
12167
+ {
12168
+ size: "small",
12169
+ leading: "compact",
12170
+ className: "text-ui-fg-subtle",
12171
+ children: [
12172
+ "(",
12173
+ item.variant_title,
12174
+ ")"
12175
+ ]
12176
+ }
12177
+ )
12178
+ ] }),
12179
+ /* @__PURE__ */ jsx(
12180
+ Text,
12181
+ {
12182
+ size: "small",
12183
+ leading: "compact",
12184
+ className: "text-ui-fg-subtle",
12185
+ children: item.variant_sku
12186
+ }
12187
+ )
12188
+ ] })
12189
+ ] }),
12190
+ /* @__PURE__ */ jsxs(
12191
+ Text,
12192
+ {
12193
+ size: "small",
12194
+ leading: "compact",
12195
+ className: "text-ui-fg-subtle",
12196
+ children: [
12197
+ item.quantity,
12198
+ "x"
12199
+ ]
12200
+ }
12201
+ )
12202
+ ]
12203
+ },
12204
+ item.id
12205
+ )) : /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-center gap-x-3 bg-ui-bg-base rounded-lg p-4 shadow-elevation-card-rest flex-col gap-1", children: [
12206
+ /* @__PURE__ */ jsx(Text, { size: "small", weight: "plus", leading: "compact", children: "No items found" }),
12207
+ /* @__PURE__ */ jsxs(Text, { size: "small", className: "text-ui-fg-subtle", children: [
12208
+ 'No items found for "',
12209
+ query,
12210
+ '".'
12211
+ ] })
12212
+ ] }) })
12213
+ ] })
12325
12214
  ] });
12326
12215
  };
12327
- const PromotionForm = ({ preview }) => {
12328
- const { items, shipping_methods } = preview;
12329
- const [isSubmitting, setIsSubmitting] = useState(false);
12330
- const [comboboxValue, setComboboxValue] = useState("");
12331
- const { handleSuccess } = useRouteModal();
12332
- const { mutateAsync: addPromotions, isPending: isAddingPromotions } = useDraftOrderAddPromotions(preview.id);
12333
- const promoIds = getPromotionIds(items, shipping_methods);
12334
- const { promotions, isPending, isError, error } = usePromotions(
12335
- {
12336
- id: promoIds
12216
+ const LocationField = ({ control, setValue }) => {
12217
+ const locations = useComboboxData({
12218
+ queryKey: ["locations"],
12219
+ queryFn: async (params) => {
12220
+ return await sdk.admin.stockLocation.list(params);
12337
12221
  },
12222
+ getOptions: (data) => {
12223
+ return data.stock_locations.map((location) => ({
12224
+ label: location.name,
12225
+ value: location.id
12226
+ }));
12227
+ }
12228
+ });
12229
+ return /* @__PURE__ */ jsx(
12230
+ Form$2.Field,
12338
12231
  {
12339
- enabled: !!promoIds.length
12232
+ control,
12233
+ name: "location_id",
12234
+ render: ({ field: { onChange, ...field } }) => {
12235
+ return /* @__PURE__ */ jsx(Form$2.Item, { children: /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-x-3", children: [
12236
+ /* @__PURE__ */ jsxs("div", { children: [
12237
+ /* @__PURE__ */ jsx(Form$2.Label, { children: "Location" }),
12238
+ /* @__PURE__ */ jsx(Form$2.Hint, { children: "Choose where you want to ship the items from." })
12239
+ ] }),
12240
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(
12241
+ Combobox,
12242
+ {
12243
+ options: locations.options,
12244
+ fetchNextPage: locations.fetchNextPage,
12245
+ isFetchingNextPage: locations.isFetchingNextPage,
12246
+ searchValue: locations.searchValue,
12247
+ onSearchValueChange: locations.onSearchValueChange,
12248
+ placeholder: "Select location",
12249
+ onChange: (value) => {
12250
+ setValue("shipping_option_id", "", {
12251
+ shouldDirty: true,
12252
+ shouldTouch: true
12253
+ });
12254
+ onChange(value);
12255
+ },
12256
+ ...field
12257
+ }
12258
+ ) })
12259
+ ] }) });
12260
+ }
12340
12261
  }
12341
12262
  );
12342
- const comboboxData = useComboboxData({
12343
- queryKey: ["promotions", "combobox", promoIds],
12263
+ };
12264
+ const ShippingOptionField = ({
12265
+ shippingProfileId,
12266
+ preview,
12267
+ control
12268
+ }) => {
12269
+ var _a;
12270
+ const locationId = useWatch({ control, name: "location_id" });
12271
+ const shippingOptions = useComboboxData({
12272
+ queryKey: ["shipping_options", locationId, shippingProfileId],
12344
12273
  queryFn: async (params) => {
12345
- return await sdk.admin.promotion.list({
12274
+ return await sdk.admin.shippingOption.list({
12346
12275
  ...params,
12347
- id: {
12348
- $nin: promoIds
12349
- }
12276
+ stock_location_id: locationId,
12277
+ shipping_profile_id: shippingProfileId
12350
12278
  });
12351
12279
  },
12352
12280
  getOptions: (data) => {
12353
- return data.promotions.map((promotion) => ({
12354
- label: promotion.code,
12355
- value: promotion.code
12356
- }));
12357
- }
12358
- });
12359
- const add = async (value) => {
12360
- if (!value) {
12361
- return;
12362
- }
12363
- addPromotions(
12364
- {
12365
- promo_codes: [value]
12366
- },
12367
- {
12368
- onError: (e) => {
12369
- toast.error(e.message);
12370
- comboboxData.onSearchValueChange("");
12371
- setComboboxValue("");
12372
- },
12373
- onSuccess: () => {
12374
- comboboxData.onSearchValueChange("");
12375
- setComboboxValue("");
12281
+ return data.shipping_options.map((option) => {
12282
+ var _a2;
12283
+ if ((_a2 = option.rules) == null ? void 0 : _a2.find(
12284
+ (r) => r.attribute === "is_return" && r.value === "true"
12285
+ )) {
12286
+ return void 0;
12376
12287
  }
12288
+ return {
12289
+ label: option.name,
12290
+ value: option.id
12291
+ };
12292
+ }).filter(Boolean);
12293
+ },
12294
+ enabled: !!locationId && !!shippingProfileId,
12295
+ defaultValue: ((_a = preview.shipping_methods[0]) == null ? void 0 : _a.shipping_option_id) || void 0
12296
+ });
12297
+ const tooltipContent = !locationId && !shippingProfileId ? "Choose a location and shipping profile first." : !locationId ? "Choose a location first." : "Choose a shipping profile first.";
12298
+ return /* @__PURE__ */ jsx(
12299
+ Form$2.Field,
12300
+ {
12301
+ control,
12302
+ name: "shipping_option_id",
12303
+ render: ({ field }) => {
12304
+ return /* @__PURE__ */ jsx(Form$2.Item, { children: /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-x-3", children: [
12305
+ /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
12306
+ /* @__PURE__ */ jsx(Form$2.Label, { children: "Shipping option" }),
12307
+ /* @__PURE__ */ jsx(Form$2.Hint, { children: "Choose the shipping option to use." })
12308
+ ] }),
12309
+ /* @__PURE__ */ jsx(
12310
+ ConditionalTooltip,
12311
+ {
12312
+ content: tooltipContent,
12313
+ showTooltip: !locationId || !shippingProfileId,
12314
+ children: /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(
12315
+ Combobox,
12316
+ {
12317
+ options: shippingOptions.options,
12318
+ fetchNextPage: shippingOptions.fetchNextPage,
12319
+ isFetchingNextPage: shippingOptions.isFetchingNextPage,
12320
+ searchValue: shippingOptions.searchValue,
12321
+ onSearchValueChange: shippingOptions.onSearchValueChange,
12322
+ placeholder: "Select shipping option",
12323
+ ...field,
12324
+ disabled: !locationId || !shippingProfileId
12325
+ }
12326
+ ) }) })
12327
+ }
12328
+ )
12329
+ ] }) });
12377
12330
  }
12378
- );
12379
- };
12380
- const { mutateAsync: confirmOrderEdit } = useDraftOrderConfirmEdit(preview.id);
12381
- const { mutateAsync: requestOrderEdit } = useOrderEditRequest(preview.id);
12382
- const onSubmit = async () => {
12383
- setIsSubmitting(true);
12384
- let requestSucceeded = false;
12385
- await requestOrderEdit(void 0, {
12386
- onError: (e) => {
12387
- toast.error(e.message);
12388
- },
12389
- onSuccess: () => {
12390
- requestSucceeded = true;
12391
- }
12392
- });
12393
- if (!requestSucceeded) {
12394
- setIsSubmitting(false);
12395
- return;
12396
12331
  }
12397
- await confirmOrderEdit(void 0, {
12398
- onError: (e) => {
12399
- toast.error(e.message);
12400
- },
12401
- onSuccess: () => {
12402
- handleSuccess();
12403
- },
12404
- onSettled: () => {
12405
- setIsSubmitting(false);
12332
+ );
12333
+ };
12334
+ const CustomAmountField = ({
12335
+ control,
12336
+ currencyCode
12337
+ }) => {
12338
+ return /* @__PURE__ */ jsx(
12339
+ Form$2.Field,
12340
+ {
12341
+ control,
12342
+ name: "custom_amount",
12343
+ render: ({ field: { onChange, ...field } }) => {
12344
+ return /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-x-3", children: [
12345
+ /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
12346
+ /* @__PURE__ */ jsx(Form$2.Label, { optional: true, children: "Custom amount" }),
12347
+ /* @__PURE__ */ jsx(Form$2.Hint, { children: "Set a custom amount for the shipping option." })
12348
+ ] }),
12349
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(
12350
+ CurrencyInput,
12351
+ {
12352
+ ...field,
12353
+ onValueChange: (value) => onChange(value),
12354
+ symbol: getNativeSymbol(currencyCode),
12355
+ code: currencyCode
12356
+ }
12357
+ ) })
12358
+ ] });
12406
12359
  }
12407
- });
12408
- };
12360
+ }
12361
+ );
12362
+ };
12363
+ const ShippingAddress = () => {
12364
+ const { id } = useParams();
12365
+ const { order, isPending, isError, error } = useOrder(id, {
12366
+ fields: "+shipping_address"
12367
+ });
12409
12368
  if (isError) {
12410
12369
  throw error;
12411
12370
  }
12412
- return /* @__PURE__ */ jsxs(KeyboundForm, { className: "flex flex-1 flex-col", onSubmit, children: [
12413
- /* @__PURE__ */ jsx(RouteDrawer.Body, { children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-4", children: [
12414
- /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-3", children: [
12415
- /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
12416
- /* @__PURE__ */ jsx(Label$1, { size: "small", weight: "plus", htmlFor: "promotion-combobox", children: "Apply promotions" }),
12417
- /* @__PURE__ */ jsx(Hint$1, { id: "promotion-combobox-hint", children: "Manage promotions that should be applied to the order." })
12418
- ] }),
12419
- /* @__PURE__ */ jsx(
12420
- Combobox,
12421
- {
12422
- id: "promotion-combobox",
12423
- "aria-describedby": "promotion-combobox-hint",
12424
- isFetchingNextPage: comboboxData.isFetchingNextPage,
12425
- fetchNextPage: comboboxData.fetchNextPage,
12426
- options: comboboxData.options,
12427
- onSearchValueChange: comboboxData.onSearchValueChange,
12428
- searchValue: comboboxData.searchValue,
12429
- disabled: comboboxData.disabled || isAddingPromotions,
12430
- onChange: add,
12431
- value: comboboxValue
12432
- }
12433
- )
12434
- ] }),
12435
- /* @__PURE__ */ jsx(Divider, { variant: "dashed" }),
12436
- /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-2", children: promotions == null ? void 0 : promotions.map((promotion) => /* @__PURE__ */ jsx(
12437
- PromotionItem,
12438
- {
12439
- promotion,
12440
- orderId: preview.id,
12441
- isLoading: isPending
12442
- },
12443
- promotion.id
12444
- )) })
12445
- ] }) }),
12446
- /* @__PURE__ */ jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex justify-end gap-2", children: [
12447
- /* @__PURE__ */ jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
12448
- /* @__PURE__ */ jsx(
12449
- Button,
12450
- {
12451
- size: "small",
12452
- type: "submit",
12453
- isLoading: isSubmitting || isAddingPromotions,
12454
- children: "Save"
12455
- }
12456
- )
12457
- ] }) })
12371
+ const isReady = !isPending && !!order;
12372
+ return /* @__PURE__ */ jsxs(RouteDrawer, { children: [
12373
+ /* @__PURE__ */ jsxs(RouteDrawer.Header, { children: [
12374
+ /* @__PURE__ */ jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Edit Shipping Address" }) }),
12375
+ /* @__PURE__ */ jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Edit the shipping address for the draft order" }) })
12376
+ ] }),
12377
+ isReady && /* @__PURE__ */ jsx(ShippingAddressForm, { order })
12458
12378
  ] });
12459
12379
  };
12460
- const PromotionItem = ({
12461
- promotion,
12462
- orderId,
12463
- isLoading
12464
- }) => {
12465
- var _a;
12466
- const { mutateAsync: removePromotions, isPending } = useDraftOrderRemovePromotions(orderId);
12467
- const onRemove = async () => {
12468
- removePromotions(
12380
+ const ShippingAddressForm = ({ order }) => {
12381
+ var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
12382
+ const form = useForm({
12383
+ defaultValues: {
12384
+ first_name: ((_a = order.shipping_address) == null ? void 0 : _a.first_name) ?? "",
12385
+ last_name: ((_b = order.shipping_address) == null ? void 0 : _b.last_name) ?? "",
12386
+ company: ((_c = order.shipping_address) == null ? void 0 : _c.company) ?? "",
12387
+ address_1: ((_d = order.shipping_address) == null ? void 0 : _d.address_1) ?? "",
12388
+ address_2: ((_e = order.shipping_address) == null ? void 0 : _e.address_2) ?? "",
12389
+ city: ((_f = order.shipping_address) == null ? void 0 : _f.city) ?? "",
12390
+ province: ((_g = order.shipping_address) == null ? void 0 : _g.province) ?? "",
12391
+ country_code: ((_h = order.shipping_address) == null ? void 0 : _h.country_code) ?? "",
12392
+ postal_code: ((_i = order.shipping_address) == null ? void 0 : _i.postal_code) ?? "",
12393
+ phone: ((_j = order.shipping_address) == null ? void 0 : _j.phone) ?? ""
12394
+ },
12395
+ resolver: zodResolver(schema$1)
12396
+ });
12397
+ const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
12398
+ const { handleSuccess } = useRouteModal();
12399
+ const onSubmit = form.handleSubmit(async (data) => {
12400
+ await mutateAsync(
12469
12401
  {
12470
- promo_codes: [promotion.code]
12402
+ shipping_address: {
12403
+ first_name: data.first_name,
12404
+ last_name: data.last_name,
12405
+ company: data.company,
12406
+ address_1: data.address_1,
12407
+ address_2: data.address_2,
12408
+ city: data.city,
12409
+ province: data.province,
12410
+ country_code: data.country_code,
12411
+ postal_code: data.postal_code,
12412
+ phone: data.phone
12413
+ }
12471
12414
  },
12472
12415
  {
12473
- onError: (e) => {
12474
- toast.error(e.message);
12416
+ onSuccess: () => {
12417
+ handleSuccess();
12418
+ },
12419
+ onError: (error) => {
12420
+ toast.error(error.message);
12475
12421
  }
12476
12422
  }
12477
12423
  );
12478
- };
12479
- const displayValue = getDisplayValue(promotion);
12480
- return /* @__PURE__ */ jsxs(
12481
- "div",
12424
+ });
12425
+ return /* @__PURE__ */ jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxs(
12426
+ KeyboundForm,
12482
12427
  {
12483
- className: clx(
12484
- "bg-ui-bg-component shadow-elevation-card-rest flex items-center justify-between rounded-lg px-3 py-2",
12485
- {
12486
- "animate-pulse": isLoading
12487
- }
12488
- ),
12428
+ className: "flex flex-1 flex-col overflow-hidden",
12429
+ onSubmit,
12489
12430
  children: [
12490
- /* @__PURE__ */ jsxs("div", { children: [
12491
- /* @__PURE__ */ jsx(Text, { size: "small", weight: "plus", leading: "compact", children: promotion.code }),
12492
- /* @__PURE__ */ jsxs("div", { className: "text-ui-fg-subtle flex items-center gap-1.5", children: [
12493
- displayValue && /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1.5", children: [
12494
- /* @__PURE__ */ jsx(Text, { size: "small", leading: "compact", children: displayValue }),
12495
- /* @__PURE__ */ jsx(Text, { size: "small", leading: "compact", children: "·" })
12496
- ] }),
12497
- /* @__PURE__ */ jsx(Text, { size: "small", leading: "compact", className: "capitalize", children: (_a = promotion.application_method) == null ? void 0 : _a.allocation })
12498
- ] })
12499
- ] }),
12500
- /* @__PURE__ */ jsx(
12501
- IconButton,
12502
- {
12503
- size: "small",
12504
- type: "button",
12505
- variant: "transparent",
12506
- onClick: onRemove,
12507
- isLoading: isPending || isLoading,
12508
- children: /* @__PURE__ */ jsx(XMark, {})
12509
- }
12510
- )
12431
+ /* @__PURE__ */ jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-y-4", children: [
12432
+ /* @__PURE__ */ jsx(
12433
+ Form$2.Field,
12434
+ {
12435
+ control: form.control,
12436
+ name: "country_code",
12437
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
12438
+ /* @__PURE__ */ jsx(Form$2.Label, { children: "Country" }),
12439
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(CountrySelect, { ...field }) }),
12440
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
12441
+ ] })
12442
+ }
12443
+ ),
12444
+ /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
12445
+ /* @__PURE__ */ jsx(
12446
+ Form$2.Field,
12447
+ {
12448
+ control: form.control,
12449
+ name: "first_name",
12450
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
12451
+ /* @__PURE__ */ jsx(Form$2.Label, { children: "First name" }),
12452
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
12453
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
12454
+ ] })
12455
+ }
12456
+ ),
12457
+ /* @__PURE__ */ jsx(
12458
+ Form$2.Field,
12459
+ {
12460
+ control: form.control,
12461
+ name: "last_name",
12462
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
12463
+ /* @__PURE__ */ jsx(Form$2.Label, { children: "Last name" }),
12464
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
12465
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
12466
+ ] })
12467
+ }
12468
+ )
12469
+ ] }),
12470
+ /* @__PURE__ */ jsx(
12471
+ Form$2.Field,
12472
+ {
12473
+ control: form.control,
12474
+ name: "company",
12475
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
12476
+ /* @__PURE__ */ jsx(Form$2.Label, { optional: true, children: "Company" }),
12477
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
12478
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
12479
+ ] })
12480
+ }
12481
+ ),
12482
+ /* @__PURE__ */ jsx(
12483
+ Form$2.Field,
12484
+ {
12485
+ control: form.control,
12486
+ name: "address_1",
12487
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
12488
+ /* @__PURE__ */ jsx(Form$2.Label, { children: "Address" }),
12489
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
12490
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
12491
+ ] })
12492
+ }
12493
+ ),
12494
+ /* @__PURE__ */ jsx(
12495
+ Form$2.Field,
12496
+ {
12497
+ control: form.control,
12498
+ name: "address_2",
12499
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
12500
+ /* @__PURE__ */ jsx(Form$2.Label, { optional: true, children: "Apartment, suite, etc." }),
12501
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
12502
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
12503
+ ] })
12504
+ }
12505
+ ),
12506
+ /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
12507
+ /* @__PURE__ */ jsx(
12508
+ Form$2.Field,
12509
+ {
12510
+ control: form.control,
12511
+ name: "postal_code",
12512
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
12513
+ /* @__PURE__ */ jsx(Form$2.Label, { children: "Postal code" }),
12514
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
12515
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
12516
+ ] })
12517
+ }
12518
+ ),
12519
+ /* @__PURE__ */ jsx(
12520
+ Form$2.Field,
12521
+ {
12522
+ control: form.control,
12523
+ name: "city",
12524
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
12525
+ /* @__PURE__ */ jsx(Form$2.Label, { children: "City" }),
12526
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
12527
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
12528
+ ] })
12529
+ }
12530
+ )
12531
+ ] }),
12532
+ /* @__PURE__ */ jsx(
12533
+ Form$2.Field,
12534
+ {
12535
+ control: form.control,
12536
+ name: "province",
12537
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
12538
+ /* @__PURE__ */ jsx(Form$2.Label, { optional: true, children: "Province / State" }),
12539
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
12540
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
12541
+ ] })
12542
+ }
12543
+ ),
12544
+ /* @__PURE__ */ jsx(
12545
+ Form$2.Field,
12546
+ {
12547
+ control: form.control,
12548
+ name: "phone",
12549
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
12550
+ /* @__PURE__ */ jsx(Form$2.Label, { optional: true, children: "Phone" }),
12551
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
12552
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
12553
+ ] })
12554
+ }
12555
+ )
12556
+ ] }) }),
12557
+ /* @__PURE__ */ jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex justify-end gap-2", children: [
12558
+ /* @__PURE__ */ jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
12559
+ /* @__PURE__ */ jsx(Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
12560
+ ] }) })
12511
12561
  ]
12512
- },
12513
- promotion.id
12514
- );
12515
- };
12516
- function getDisplayValue(promotion) {
12517
- var _a, _b, _c, _d;
12518
- const value = (_a = promotion.application_method) == null ? void 0 : _a.value;
12519
- if (!value) {
12520
- return null;
12521
- }
12522
- if (((_b = promotion.application_method) == null ? void 0 : _b.type) === "fixed") {
12523
- const currency = (_c = promotion.application_method) == null ? void 0 : _c.currency_code;
12524
- if (!currency) {
12525
- return null;
12526
12562
  }
12527
- return getLocaleAmount(value, currency);
12528
- } else if (((_d = promotion.application_method) == null ? void 0 : _d.type) === "percentage") {
12529
- return formatPercentage(value);
12530
- }
12531
- return null;
12532
- }
12533
- const formatter = new Intl.NumberFormat([], {
12534
- style: "percent",
12535
- minimumFractionDigits: 2
12536
- });
12537
- const formatPercentage = (value, isPercentageValue = false) => {
12538
- let val = value || 0;
12539
- if (!isPercentageValue) {
12540
- val = val / 100;
12541
- }
12542
- return formatter.format(val);
12563
+ ) });
12543
12564
  };
12544
- function getPromotionIds(items, shippingMethods) {
12545
- const promotionIds = /* @__PURE__ */ new Set();
12546
- for (const item of items) {
12547
- if (item.adjustments) {
12548
- for (const adjustment of item.adjustments) {
12549
- if (adjustment.promotion_id) {
12550
- promotionIds.add(adjustment.promotion_id);
12551
- }
12552
- }
12553
- }
12554
- }
12555
- for (const shippingMethod of shippingMethods) {
12556
- if (shippingMethod.adjustments) {
12557
- for (const adjustment of shippingMethod.adjustments) {
12558
- if (adjustment.promotion_id) {
12559
- promotionIds.add(adjustment.promotion_id);
12560
- }
12561
- }
12562
- }
12563
- }
12564
- return Array.from(promotionIds);
12565
- }
12565
+ const schema$1 = addressSchema;
12566
12566
  const TransferOwnership = () => {
12567
12567
  const { id } = useParams();
12568
12568
  const { draft_order, isPending, isError, error } = useDraftOrder(id, {
@@ -13064,36 +13064,36 @@ const routeModule = {
13064
13064
  path: "/draft-orders/:id/billing-address"
13065
13065
  },
13066
13066
  {
13067
- Component: Items,
13068
- path: "/draft-orders/:id/items"
13067
+ Component: CustomItems,
13068
+ path: "/draft-orders/:id/custom-items"
13069
13069
  },
13070
13070
  {
13071
13071
  Component: Email,
13072
13072
  path: "/draft-orders/:id/email"
13073
13073
  },
13074
13074
  {
13075
- Component: CustomItems,
13076
- path: "/draft-orders/:id/custom-items"
13075
+ Component: Items,
13076
+ path: "/draft-orders/:id/items"
13077
13077
  },
13078
13078
  {
13079
13079
  Component: Metadata,
13080
13080
  path: "/draft-orders/:id/metadata"
13081
13081
  },
13082
13082
  {
13083
- Component: Shipping,
13084
- path: "/draft-orders/:id/shipping"
13083
+ Component: Promotions,
13084
+ path: "/draft-orders/:id/promotions"
13085
13085
  },
13086
13086
  {
13087
13087
  Component: SalesChannel,
13088
13088
  path: "/draft-orders/:id/sales-channel"
13089
13089
  },
13090
13090
  {
13091
- Component: ShippingAddress,
13092
- path: "/draft-orders/:id/shipping-address"
13091
+ Component: Shipping,
13092
+ path: "/draft-orders/:id/shipping"
13093
13093
  },
13094
13094
  {
13095
- Component: Promotions,
13096
- path: "/draft-orders/:id/promotions"
13095
+ Component: ShippingAddress,
13096
+ path: "/draft-orders/:id/shipping-address"
13097
13097
  },
13098
13098
  {
13099
13099
  Component: TransferOwnership,