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

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.
@@ -346,7 +346,7 @@ const DataTableAction = ({
346
346
  return /* @__PURE__ */ jsx(Button, { ...buttonProps, onClick: props.onClick, children: label });
347
347
  };
348
348
  const sdk = new Medusa({
349
- baseUrl: "/",
349
+ baseUrl: __BACKEND_URL__ || "/",
350
350
  auth: {
351
351
  type: "session"
352
352
  }
@@ -10799,27 +10799,6 @@ const EmailForm = ({ order }) => {
10799
10799
  const schema$4 = objectType({
10800
10800
  email: stringType().email()
10801
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
10802
  const InlineTip = forwardRef(
10824
10803
  ({ variant = "tip", label, className, children, ...props }, ref) => {
10825
10804
  const labelValue = label || (variant === "warning" ? "Warning" : "Tip");
@@ -11170,1399 +11149,1217 @@ function getHasUneditableRows(metadata) {
11170
11149
  (value) => !EDITABLE_TYPES.includes(typeof value)
11171
11150
  );
11172
11151
  }
11173
- const STACKED_FOCUS_MODAL_ID = "shipping-form";
11174
- const Shipping = () => {
11175
- var _a;
11152
+ const CustomItems = () => {
11153
+ return /* @__PURE__ */ jsxs(RouteDrawer, { children: [
11154
+ /* @__PURE__ */ jsx(RouteDrawer.Header, { children: /* @__PURE__ */ jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Edit Custom Items" }) }) }),
11155
+ /* @__PURE__ */ jsx(CustomItemsForm, {})
11156
+ ] });
11157
+ };
11158
+ const CustomItemsForm = () => {
11159
+ const form = useForm({
11160
+ resolver: zodResolver(schema$3)
11161
+ });
11162
+ return /* @__PURE__ */ jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxs(KeyboundForm, { className: "flex flex-1 flex-col", children: [
11163
+ /* @__PURE__ */ jsx(RouteDrawer.Body, {}),
11164
+ /* @__PURE__ */ jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex justify-end gap-2", children: [
11165
+ /* @__PURE__ */ jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
11166
+ /* @__PURE__ */ jsx(Button, { size: "small", type: "submit", children: "Save" })
11167
+ ] }) })
11168
+ ] }) });
11169
+ };
11170
+ const schema$3 = objectType({
11171
+ email: stringType().email()
11172
+ });
11173
+ const SalesChannel = () => {
11176
11174
  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"
11175
+ const { draft_order, isPending, isError, error } = useDraftOrder(
11176
+ id,
11177
+ {
11178
+ fields: "+sales_channel_id"
11179
+ },
11180
+ {
11181
+ enabled: !!id
11182
+ }
11183
+ );
11184
+ if (isError) {
11185
+ throw error;
11186
+ }
11187
+ const ISrEADY = !!draft_order && !isPending;
11188
+ return /* @__PURE__ */ jsxs(RouteDrawer, { children: [
11189
+ /* @__PURE__ */ jsxs(RouteDrawer.Header, { children: [
11190
+ /* @__PURE__ */ jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Edit Sales Channel" }) }),
11191
+ /* @__PURE__ */ jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Update which sales channel the draft order is associated with" }) })
11192
+ ] }),
11193
+ ISrEADY && /* @__PURE__ */ jsx(SalesChannelForm, { order: draft_order })
11194
+ ] });
11195
+ };
11196
+ const SalesChannelForm = ({ order }) => {
11197
+ const form = useForm({
11198
+ defaultValues: {
11199
+ sales_channel_id: order.sales_channel_id || ""
11200
+ },
11201
+ resolver: zodResolver(schema$2)
11202
+ });
11203
+ const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
11204
+ const { handleSuccess } = useRouteModal();
11205
+ const onSubmit = form.handleSubmit(async (data) => {
11206
+ await mutateAsync(
11207
+ {
11208
+ sales_channel_id: data.sales_channel_id
11209
+ },
11210
+ {
11211
+ onSuccess: () => {
11212
+ toast.success("Sales channel updated");
11213
+ handleSuccess();
11214
+ },
11215
+ onError: (error) => {
11216
+ toast.error(error.message);
11217
+ }
11218
+ }
11219
+ );
11220
+ });
11221
+ return /* @__PURE__ */ jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxs(
11222
+ KeyboundForm,
11223
+ {
11224
+ className: "flex flex-1 flex-col overflow-hidden",
11225
+ onSubmit,
11226
+ children: [
11227
+ /* @__PURE__ */ jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsx(SalesChannelField, { control: form.control, order }) }),
11228
+ /* @__PURE__ */ jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex justify-end gap-2", children: [
11229
+ /* @__PURE__ */ jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
11230
+ /* @__PURE__ */ jsx(Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
11231
+ ] }) })
11232
+ ]
11233
+ }
11234
+ ) });
11235
+ };
11236
+ const SalesChannelField = ({ control, order }) => {
11237
+ const salesChannels = useComboboxData({
11238
+ queryFn: async (params) => {
11239
+ return await sdk.admin.salesChannel.list(params);
11240
+ },
11241
+ queryKey: ["sales-channels"],
11242
+ getOptions: (data) => {
11243
+ return data.sales_channels.map((salesChannel) => ({
11244
+ label: salesChannel.name,
11245
+ value: salesChannel.id
11246
+ }));
11247
+ },
11248
+ defaultValue: order.sales_channel_id || void 0
11249
+ });
11250
+ return /* @__PURE__ */ jsx(
11251
+ Form$2.Field,
11252
+ {
11253
+ control,
11254
+ name: "sales_channel_id",
11255
+ render: ({ field }) => {
11256
+ return /* @__PURE__ */ jsxs(Form$2.Item, { children: [
11257
+ /* @__PURE__ */ jsx(Form$2.Label, { children: "Sales Channel" }),
11258
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(
11259
+ Combobox,
11260
+ {
11261
+ options: salesChannels.options,
11262
+ fetchNextPage: salesChannels.fetchNextPage,
11263
+ isFetchingNextPage: salesChannels.isFetchingNextPage,
11264
+ searchValue: salesChannels.searchValue,
11265
+ onSearchValueChange: salesChannels.onSearchValueChange,
11266
+ placeholder: "Select sales channel",
11267
+ ...field
11268
+ }
11269
+ ) }),
11270
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
11271
+ ] });
11272
+ }
11273
+ }
11274
+ );
11275
+ };
11276
+ const schema$2 = objectType({
11277
+ sales_channel_id: stringType().min(1)
11278
+ });
11279
+ const PROMOTION_QUERY_KEY = "promotions";
11280
+ const promotionsQueryKeys = {
11281
+ list: (query2) => [
11282
+ PROMOTION_QUERY_KEY,
11283
+ query2 ? query2 : void 0
11284
+ ],
11285
+ detail: (id, query2) => [
11286
+ PROMOTION_QUERY_KEY,
11287
+ id,
11288
+ query2 ? query2 : void 0
11289
+ ]
11290
+ };
11291
+ const usePromotions = (query2, options) => {
11292
+ const { data, ...rest } = useQuery({
11293
+ queryKey: promotionsQueryKeys.list(query2),
11294
+ queryFn: async () => sdk.admin.promotion.list(query2),
11295
+ ...options
11179
11296
  });
11297
+ return { ...data, ...rest };
11298
+ };
11299
+ const Promotions = () => {
11300
+ const { id } = useParams();
11180
11301
  const {
11181
11302
  order: preview,
11182
- isPending: isPreviewPending,
11183
11303
  isError: isPreviewError,
11184
11304
  error: previewError
11185
- } = useOrderPreview(id);
11305
+ } = useOrderPreview(id, void 0);
11186
11306
  useInitiateOrderEdit({ preview });
11187
11307
  const { onCancel } = useCancelOrderEdit({ preview });
11188
- if (isError) {
11189
- throw error;
11190
- }
11191
11308
  if (isPreviewError) {
11192
11309
  throw previewError;
11193
11310
  }
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
- ] }) });
11311
+ const isReady = !!preview;
11312
+ return /* @__PURE__ */ jsxs(RouteDrawer, { onClose: onCancel, children: [
11313
+ /* @__PURE__ */ jsx(RouteDrawer.Header, { children: /* @__PURE__ */ jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Edit Promotions" }) }) }),
11314
+ isReady && /* @__PURE__ */ jsx(PromotionForm, { preview })
11315
+ ] });
11207
11316
  };
11208
- const ShippingForm = ({ preview, order }) => {
11209
- var _a;
11210
- const { setIsOpen } = useStackedModal();
11317
+ const PromotionForm = ({ preview }) => {
11318
+ const { items, shipping_methods } = preview;
11211
11319
  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(
11320
+ const [comboboxValue, setComboboxValue] = useState("");
11321
+ const { handleSuccess } = useRouteModal();
11322
+ const { mutateAsync: addPromotions, isPending: isAddingPromotions } = useDraftOrderAddPromotions(preview.id);
11323
+ const promoIds = getPromotionIds(items, shipping_methods);
11324
+ const { promotions, isPending, isError, error } = usePromotions(
11215
11325
  {
11216
- id: appliedShippingOptionIds,
11217
- fields: "+service_zone.*,+service_zone.fulfillment_set.*,+service_zone.fulfillment_set.location.*"
11326
+ id: promoIds
11218
11327
  },
11219
11328
  {
11220
- enabled: appliedShippingOptionIds.length > 0
11329
+ enabled: !!promoIds.length
11221
11330
  }
11222
11331
  );
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();
11234
- 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);
11238
- const onSubmit = async () => {
11239
- setIsSubmitting(true);
11240
- let requestSucceeded = false;
11241
- await requestOrderEdit(void 0, {
11242
- onError: (e) => {
11243
- toast.error(`Failed to request order edit: ${e.message}`);
11244
- },
11245
- onSuccess: () => {
11246
- requestSucceeded = true;
11247
- }
11248
- });
11249
- if (!requestSucceeded) {
11250
- setIsSubmitting(false);
11251
- return;
11252
- }
11253
- await confirmOrderEdit(void 0, {
11254
- onError: (e) => {
11255
- toast.error(`Failed to confirm order edit: ${e.message}`);
11256
- },
11257
- onSuccess: () => {
11258
- handleSuccess();
11259
- },
11260
- onSettled: () => {
11261
- setIsSubmitting(false);
11262
- }
11263
- });
11332
+ const comboboxData = useComboboxData({
11333
+ queryKey: ["promotions", "combobox", promoIds],
11334
+ queryFn: async (params) => {
11335
+ return await sdk.admin.promotion.list({
11336
+ ...params,
11337
+ id: {
11338
+ $nin: promoIds
11339
+ }
11340
+ });
11341
+ },
11342
+ getOptions: (data) => {
11343
+ return data.promotions.map((promotion) => ({
11344
+ label: promotion.code,
11345
+ value: promotion.code
11346
+ }));
11347
+ }
11348
+ });
11349
+ const add = async (value) => {
11350
+ if (!value) {
11351
+ return;
11352
+ }
11353
+ addPromotions(
11354
+ {
11355
+ promo_codes: [value]
11356
+ },
11357
+ {
11358
+ onError: (e) => {
11359
+ toast.error(e.message);
11360
+ comboboxData.onSearchValueChange("");
11361
+ setComboboxValue("");
11362
+ },
11363
+ onSuccess: () => {
11364
+ comboboxData.onSearchValueChange("");
11365
+ setComboboxValue("");
11366
+ }
11367
+ }
11368
+ );
11264
11369
  };
11265
- const onKeydown = useCallback(
11266
- (e) => {
11267
- if (e.key === "Enter" && (e.ctrlKey || e.metaKey)) {
11268
- if (data || isSubmitting) {
11269
- return;
11370
+ const { mutateAsync: confirmOrderEdit } = useDraftOrderConfirmEdit(preview.id);
11371
+ const { mutateAsync: requestOrderEdit } = useOrderEditRequest(preview.id);
11372
+ const onSubmit = async () => {
11373
+ setIsSubmitting(true);
11374
+ let requestSucceeded = false;
11375
+ await requestOrderEdit(void 0, {
11376
+ onError: (e) => {
11377
+ toast.error(e.message);
11378
+ },
11379
+ onSuccess: () => {
11380
+ requestSucceeded = true;
11381
+ }
11382
+ });
11383
+ if (!requestSucceeded) {
11384
+ setIsSubmitting(false);
11385
+ return;
11386
+ }
11387
+ await confirmOrderEdit(void 0, {
11388
+ onError: (e) => {
11389
+ toast.error(e.message);
11390
+ },
11391
+ onSuccess: () => {
11392
+ handleSuccess();
11393
+ },
11394
+ onSettled: () => {
11395
+ setIsSubmitting(false);
11396
+ }
11397
+ });
11398
+ };
11399
+ if (isError) {
11400
+ throw error;
11401
+ }
11402
+ return /* @__PURE__ */ jsxs(KeyboundForm, { className: "flex flex-1 flex-col", onSubmit, children: [
11403
+ /* @__PURE__ */ jsx(RouteDrawer.Body, { children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-4", children: [
11404
+ /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-3", children: [
11405
+ /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
11406
+ /* @__PURE__ */ jsx(Label$1, { size: "small", weight: "plus", htmlFor: "promotion-combobox", children: "Apply promotions" }),
11407
+ /* @__PURE__ */ jsx(Hint$1, { id: "promotion-combobox-hint", children: "Manage promotions that should be applied to the order." })
11408
+ ] }),
11409
+ /* @__PURE__ */ jsx(
11410
+ Combobox,
11411
+ {
11412
+ id: "promotion-combobox",
11413
+ "aria-describedby": "promotion-combobox-hint",
11414
+ isFetchingNextPage: comboboxData.isFetchingNextPage,
11415
+ fetchNextPage: comboboxData.fetchNextPage,
11416
+ options: comboboxData.options,
11417
+ onSearchValueChange: comboboxData.onSearchValueChange,
11418
+ searchValue: comboboxData.searchValue,
11419
+ disabled: comboboxData.disabled || isAddingPromotions,
11420
+ onChange: add,
11421
+ value: comboboxValue
11422
+ }
11423
+ )
11424
+ ] }),
11425
+ /* @__PURE__ */ jsx(Divider, { variant: "dashed" }),
11426
+ /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-2", children: promotions == null ? void 0 : promotions.map((promotion) => /* @__PURE__ */ jsx(
11427
+ PromotionItem,
11428
+ {
11429
+ promotion,
11430
+ orderId: preview.id,
11431
+ isLoading: isPending
11432
+ },
11433
+ promotion.id
11434
+ )) })
11435
+ ] }) }),
11436
+ /* @__PURE__ */ jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex justify-end gap-2", children: [
11437
+ /* @__PURE__ */ jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
11438
+ /* @__PURE__ */ jsx(
11439
+ Button,
11440
+ {
11441
+ size: "small",
11442
+ type: "submit",
11443
+ isLoading: isSubmitting || isAddingPromotions,
11444
+ children: "Save"
11445
+ }
11446
+ )
11447
+ ] }) })
11448
+ ] });
11449
+ };
11450
+ const PromotionItem = ({
11451
+ promotion,
11452
+ orderId,
11453
+ isLoading
11454
+ }) => {
11455
+ var _a;
11456
+ const { mutateAsync: removePromotions, isPending } = useDraftOrderRemovePromotions(orderId);
11457
+ const onRemove = async () => {
11458
+ removePromotions(
11459
+ {
11460
+ promo_codes: [promotion.code]
11461
+ },
11462
+ {
11463
+ onError: (e) => {
11464
+ toast.error(e.message);
11270
11465
  }
11271
- onSubmit();
11272
11466
  }
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: [
11467
+ );
11468
+ };
11469
+ const displayValue = getDisplayValue(promotion);
11470
+ return /* @__PURE__ */ jsxs(
11471
+ "div",
11472
+ {
11473
+ className: clx(
11474
+ "bg-ui-bg-component shadow-elevation-card-rest flex items-center justify-between rounded-lg px-3 py-2",
11475
+ {
11476
+ "animate-pulse": isLoading
11477
+ }
11478
+ ),
11479
+ children: [
11286
11480
  /* @__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." }) })
11481
+ /* @__PURE__ */ jsx(Text, { size: "small", weight: "plus", leading: "compact", children: promotion.code }),
11482
+ /* @__PURE__ */ jsxs("div", { className: "text-ui-fg-subtle flex items-center gap-1.5", children: [
11483
+ displayValue && /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1.5", children: [
11484
+ /* @__PURE__ */ jsx(Text, { size: "small", leading: "compact", children: displayValue }),
11485
+ /* @__PURE__ */ jsx(Text, { size: "small", leading: "compact", children: "·" })
11486
+ ] }),
11487
+ /* @__PURE__ */ jsx(Text, { size: "small", leading: "compact", className: "capitalize", children: (_a = promotion.application_method) == null ? void 0 : _a.allocation })
11488
+ ] })
11289
11489
  ] }),
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 })
11573
- }
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"
11586
- }
11587
- )
11588
- ] }) })
11589
- ] });
11490
+ /* @__PURE__ */ jsx(
11491
+ IconButton,
11492
+ {
11493
+ size: "small",
11494
+ type: "button",
11495
+ variant: "transparent",
11496
+ onClick: onRemove,
11497
+ isLoading: isPending || isLoading,
11498
+ children: /* @__PURE__ */ jsx(XMark, {})
11499
+ }
11500
+ )
11501
+ ]
11502
+ },
11503
+ promotion.id
11504
+ );
11590
11505
  };
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
- });
11611
- }
11612
- };
11613
- return /* @__PURE__ */ jsx(
11614
- Button,
11615
- {
11616
- size: "small",
11617
- variant: "secondary",
11618
- onClick: onToggle,
11619
- className: "text-ui-fg-primary shrink-0",
11620
- children
11506
+ function getDisplayValue(promotion) {
11507
+ var _a, _b, _c, _d;
11508
+ const value = (_a = promotion.application_method) == null ? void 0 : _a.value;
11509
+ if (!value) {
11510
+ return null;
11511
+ }
11512
+ if (((_b = promotion.application_method) == null ? void 0 : _b.type) === "fixed") {
11513
+ const currency = (_c = promotion.application_method) == null ? void 0 : _c.currency_code;
11514
+ if (!currency) {
11515
+ return null;
11621
11516
  }
11622
- );
11517
+ return getLocaleAmount(value, currency);
11518
+ } else if (((_d = promotion.application_method) == null ? void 0 : _d.type) === "percentage") {
11519
+ return formatPercentage(value);
11520
+ }
11521
+ return null;
11522
+ }
11523
+ const formatter = new Intl.NumberFormat([], {
11524
+ style: "percent",
11525
+ minimumFractionDigits: 2
11526
+ });
11527
+ const formatPercentage = (value, isPercentageValue = false) => {
11528
+ let val = value || 0;
11529
+ if (!isPercentageValue) {
11530
+ val = val / 100;
11531
+ }
11532
+ return formatter.format(val);
11623
11533
  };
11624
- const ShippingProfileForm = ({
11625
- data,
11626
- order,
11627
- preview
11628
- }) => {
11629
- var _a, _b, _c, _d, _e, _f;
11630
- const { setIsOpen } = useStackedModal();
11631
- const form = useForm({
11632
- resolver: zodResolver(shippingMethodSchema),
11633
- 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
11534
+ function getPromotionIds(items, shippingMethods) {
11535
+ const promotionIds = /* @__PURE__ */ new Set();
11536
+ for (const item of items) {
11537
+ if (item.adjustments) {
11538
+ for (const adjustment of item.adjustments) {
11539
+ if (adjustment.promotion_id) {
11540
+ promotionIds.add(adjustment.promotion_id);
11541
+ }
11542
+ }
11543
+ }
11544
+ }
11545
+ for (const shippingMethod of shippingMethods) {
11546
+ if (shippingMethod.adjustments) {
11547
+ for (const adjustment of shippingMethod.adjustments) {
11548
+ if (adjustment.promotion_id) {
11549
+ promotionIds.add(adjustment.promotion_id);
11550
+ }
11551
+ }
11637
11552
  }
11553
+ }
11554
+ return Array.from(promotionIds);
11555
+ }
11556
+ const STACKED_FOCUS_MODAL_ID = "shipping-form";
11557
+ const Shipping = () => {
11558
+ var _a;
11559
+ const { id } = useParams();
11560
+ const { order, isPending, isError, error } = useOrder(id, {
11561
+ fields: "+items.*,+items.variant.*,+items.variant.product.*,+items.variant.product.shipping_profile.*,+currency_code"
11638
11562
  });
11639
- const { mutateAsync: addShippingMethod, isPending } = useDraftOrderAddShippingMethod(order.id);
11640
11563
  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;
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
11648
11604
  }
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
- );
11605
+ );
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);
11665
11634
  return;
11666
11635
  }
11667
- await addShippingMethod(
11668
- {
11669
- shipping_option_id: values.shipping_option_id,
11670
- custom_amount: values.custom_amount ? convertNumber(values.custom_amount) : void 0
11636
+ await confirmOrderEdit(void 0, {
11637
+ onError: (e) => {
11638
+ toast.error(`Failed to confirm order edit: ${e.message}`);
11671
11639
  },
11672
- {
11673
- onError: (e) => {
11674
- toast.error(e.message);
11675
- },
11676
- onSuccess: () => {
11677
- setIsOpen(STACKED_FOCUS_MODAL_ID, false);
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;
11678
11653
  }
11654
+ onSubmit();
11679
11655
  }
11680
- );
11681
- });
11682
- return /* @__PURE__ */ jsx(StackedFocusModal.Content, { children: /* @__PURE__ */ jsx(Form$2, { ...form, children: /* @__PURE__ */ jsxs(
11683
- KeyboundForm,
11684
- {
11685
- className: "flex h-full flex-col overflow-hidden",
11686
- onSubmit,
11687
- 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." }) })
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(
11677
+ Text,
11678
+ {
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
+ )
11693
11694
  ] }),
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
- )
11739
- ] }) })
11740
- ]
11741
- }
11742
- ) }) });
11743
- };
11744
- const shippingMethodSchema = objectType({
11745
- location_id: stringType(),
11746
- shipping_option_id: stringType(),
11747
- custom_amount: unionType([numberType(), stringType()]).optional()
11748
- });
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;
11754
- }
11755
- );
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(
11808
- Text,
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,
11809
11713
  {
11810
- size: "small",
11811
- leading: "compact",
11812
- className: "text-ui-fg-subtle",
11714
+ value: profile.id,
11715
+ className: "bg-ui-bg-base shadow-elevation-card-rest rounded-lg",
11813
11716
  children: [
11814
- item.quantity,
11815
- "x"
11816
- ]
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
- },
11873
- ...field
11874
- }
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;
11904
- }
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" }) })
11999
- ] }),
12000
- ISrEADY && /* @__PURE__ */ jsx(SalesChannelForm, { order: draft_order })
12001
- ] });
12002
- };
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
- ]
12040
- }
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
- });
12057
- return /* @__PURE__ */ jsx(
12058
- Form$2.Field,
12059
- {
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
- }
12080
- }
12081
- );
12082
- };
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;
12105
- const form = useForm({
12106
- 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)
12119
- });
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
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
+ ] })
11938
+ ]
11939
+ },
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);
11952
+ }
11953
+ return open;
11954
+ },
11955
+ children: data && /* @__PURE__ */ jsx(ShippingProfileForm, { data, order, preview })
12136
11956
  }
12137
- },
12138
- {
12139
- onSuccess: () => {
12140
- handleSuccess();
12141
- },
12142
- onError: (error) => {
12143
- toast.error(error.message);
11957
+ )
11958
+ ] }),
11959
+ /* @__PURE__ */ jsx(RouteFocusModal.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex justify-end gap-x-2", children: [
11960
+ /* @__PURE__ */ jsx(RouteFocusModal.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", type: "button", children: "Cancel" }) }),
11961
+ /* @__PURE__ */ jsx(
11962
+ Button,
11963
+ {
11964
+ size: "small",
11965
+ type: "button",
11966
+ isLoading: isSubmitting,
11967
+ onClick: onSubmit,
11968
+ children: "Save"
12144
11969
  }
12145
- }
12146
- );
12147
- });
12148
- return /* @__PURE__ */ jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxs(
12149
- KeyboundForm,
12150
- {
12151
- className: "flex flex-1 flex-col overflow-hidden",
12152
- onSubmit,
12153
- 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
- )
12192
- ] }),
12193
- /* @__PURE__ */ jsx(
12194
- Form$2.Field,
12195
- {
12196
- 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
- ] })
12203
- }
12204
- ),
12205
- /* @__PURE__ */ jsx(
12206
- Form$2.Field,
12207
- {
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
- ] })
12215
- }
12216
- ),
12217
- /* @__PURE__ */ jsx(
12218
- Form$2.Field,
12219
- {
12220
- 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
- ] })
12227
- }
12228
- ),
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
- ] }),
12255
- /* @__PURE__ */ jsx(
12256
- Form$2.Field,
12257
- {
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
- ] })
12265
- }
12266
- ),
12267
- /* @__PURE__ */ jsx(
12268
- Form$2.Field,
12269
- {
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
- ] })
12277
- }
12278
- )
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
- ] }) })
12284
- ]
12285
- }
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 };
12308
- };
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 })
11970
+ )
11971
+ ] }) })
12325
11972
  ] });
12326
11973
  };
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
12337
- },
11974
+ const StackedModalTrigger = ({
11975
+ shippingProfileId,
11976
+ shippingOption,
11977
+ shippingMethod,
11978
+ setData,
11979
+ children
11980
+ }) => {
11981
+ const { setIsOpen, getIsOpen } = useStackedModal();
11982
+ const isOpen = getIsOpen(STACKED_FOCUS_MODAL_ID);
11983
+ const onToggle = () => {
11984
+ if (isOpen) {
11985
+ setIsOpen(STACKED_FOCUS_MODAL_ID, false);
11986
+ setData(null);
11987
+ } else {
11988
+ setIsOpen(STACKED_FOCUS_MODAL_ID, true);
11989
+ setData({
11990
+ shippingProfileId,
11991
+ shippingOption,
11992
+ shippingMethod
11993
+ });
11994
+ }
11995
+ };
11996
+ return /* @__PURE__ */ jsx(
11997
+ Button,
12338
11998
  {
12339
- enabled: !!promoIds.length
11999
+ size: "small",
12000
+ variant: "secondary",
12001
+ onClick: onToggle,
12002
+ className: "text-ui-fg-primary shrink-0",
12003
+ children
12340
12004
  }
12341
12005
  );
12342
- const comboboxData = useComboboxData({
12343
- queryKey: ["promotions", "combobox", promoIds],
12344
- queryFn: async (params) => {
12345
- return await sdk.admin.promotion.list({
12346
- ...params,
12347
- id: {
12348
- $nin: promoIds
12349
- }
12350
- });
12351
- },
12352
- getOptions: (data) => {
12353
- return data.promotions.map((promotion) => ({
12354
- label: promotion.code,
12355
- value: promotion.code
12356
- }));
12006
+ };
12007
+ const ShippingProfileForm = ({
12008
+ data,
12009
+ order,
12010
+ preview
12011
+ }) => {
12012
+ var _a, _b, _c, _d, _e, _f;
12013
+ const { setIsOpen } = useStackedModal();
12014
+ const form = useForm({
12015
+ resolver: zodResolver(shippingMethodSchema),
12016
+ defaultValues: {
12017
+ location_id: (_d = (_c = (_b = (_a = data.shippingOption) == null ? void 0 : _a.service_zone) == null ? void 0 : _b.fulfillment_set) == null ? void 0 : _c.location) == null ? void 0 : _d.id,
12018
+ shipping_option_id: (_e = data.shippingOption) == null ? void 0 : _e.id,
12019
+ custom_amount: (_f = data.shippingMethod) == null ? void 0 : _f.amount
12357
12020
  }
12358
12021
  });
12359
- const add = async (value) => {
12360
- if (!value) {
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);
12361
12030
  return;
12362
12031
  }
12363
- addPromotions(
12032
+ if (data.shippingMethod) {
12033
+ await updateShippingMethod(
12034
+ {
12035
+ method_id: data.shippingMethod.id,
12036
+ shipping_option_id: values.shipping_option_id,
12037
+ custom_amount: values.custom_amount ? convertNumber(values.custom_amount) : void 0
12038
+ },
12039
+ {
12040
+ onError: (e) => {
12041
+ toast.error(e.message);
12042
+ },
12043
+ onSuccess: () => {
12044
+ setIsOpen(STACKED_FOCUS_MODAL_ID, false);
12045
+ }
12046
+ }
12047
+ );
12048
+ return;
12049
+ }
12050
+ await addShippingMethod(
12364
12051
  {
12365
- promo_codes: [value]
12052
+ shipping_option_id: values.shipping_option_id,
12053
+ custom_amount: values.custom_amount ? convertNumber(values.custom_amount) : void 0
12366
12054
  },
12367
12055
  {
12368
12056
  onError: (e) => {
12369
12057
  toast.error(e.message);
12370
- comboboxData.onSearchValueChange("");
12371
- setComboboxValue("");
12372
12058
  },
12373
12059
  onSuccess: () => {
12374
- comboboxData.onSearchValueChange("");
12375
- setComboboxValue("");
12060
+ setIsOpen(STACKED_FOCUS_MODAL_ID, false);
12376
12061
  }
12377
12062
  }
12378
12063
  );
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;
12064
+ });
12065
+ return /* @__PURE__ */ jsx(StackedFocusModal.Content, { children: /* @__PURE__ */ jsx(Form$2, { ...form, children: /* @__PURE__ */ jsxs(
12066
+ KeyboundForm,
12067
+ {
12068
+ className: "flex h-full flex-col overflow-hidden",
12069
+ onSubmit,
12070
+ children: [
12071
+ /* @__PURE__ */ jsx(StackedFocusModal.Header, {}),
12072
+ /* @__PURE__ */ jsx(StackedFocusModal.Body, { className: "flex flex-1 flex-col overflow-hidden", children: /* @__PURE__ */ jsx("div", { className: "flex flex-1 flex-col items-center overflow-y-auto", children: /* @__PURE__ */ jsxs("div", { className: "flex w-full max-w-[720px] flex-col gap-y-6 py-16 px-6", children: [
12073
+ /* @__PURE__ */ jsxs("div", { children: [
12074
+ /* @__PURE__ */ jsx(RouteFocusModal.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Shipping" }) }),
12075
+ /* @__PURE__ */ jsx(RouteFocusModal.Description, { asChild: true, children: /* @__PURE__ */ jsx(Text, { size: "small", className: "text-ui-fg-subtle", children: "Add a shipping method for the selected shipping profile. You can see the items that will be shipped using this method in the preview below." }) })
12076
+ ] }),
12077
+ /* @__PURE__ */ jsx(Divider, { variant: "dashed" }),
12078
+ /* @__PURE__ */ jsx(
12079
+ LocationField,
12080
+ {
12081
+ control: form.control,
12082
+ setValue: form.setValue
12083
+ }
12084
+ ),
12085
+ /* @__PURE__ */ jsx(Divider, { variant: "dashed" }),
12086
+ /* @__PURE__ */ jsx(
12087
+ ShippingOptionField,
12088
+ {
12089
+ shippingProfileId: data.shippingProfileId,
12090
+ preview,
12091
+ control: form.control
12092
+ }
12093
+ ),
12094
+ /* @__PURE__ */ jsx(Divider, { variant: "dashed" }),
12095
+ /* @__PURE__ */ jsx(
12096
+ CustomAmountField,
12097
+ {
12098
+ control: form.control,
12099
+ currencyCode: order.currency_code
12100
+ }
12101
+ ),
12102
+ /* @__PURE__ */ jsx(Divider, { variant: "dashed" }),
12103
+ /* @__PURE__ */ jsx(
12104
+ ItemsPreview,
12105
+ {
12106
+ order,
12107
+ shippingProfileId: data.shippingProfileId
12108
+ }
12109
+ )
12110
+ ] }) }) }),
12111
+ /* @__PURE__ */ jsx(StackedFocusModal.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex justify-end gap-x-2", children: [
12112
+ /* @__PURE__ */ jsx(StackedFocusModal.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", type: "button", children: "Cancel" }) }),
12113
+ /* @__PURE__ */ jsx(
12114
+ Button,
12115
+ {
12116
+ size: "small",
12117
+ type: "submit",
12118
+ isLoading: isPending || isUpdatingShippingMethod,
12119
+ children: data.shippingMethod ? "Update" : "Add"
12120
+ }
12121
+ )
12122
+ ] }) })
12123
+ ]
12396
12124
  }
12397
- await confirmOrderEdit(void 0, {
12398
- onError: (e) => {
12399
- toast.error(e.message);
12400
- },
12401
- onSuccess: () => {
12402
- handleSuccess();
12403
- },
12404
- onSettled: () => {
12405
- setIsSubmitting(false);
12406
- }
12407
- });
12408
- };
12409
- if (isError) {
12410
- throw error;
12411
- }
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
- )
12125
+ ) }) });
12126
+ };
12127
+ const shippingMethodSchema = objectType({
12128
+ location_id: stringType(),
12129
+ shipping_option_id: stringType(),
12130
+ custom_amount: unionType([numberType(), stringType()]).optional()
12131
+ });
12132
+ const ItemsPreview = ({ order, shippingProfileId }) => {
12133
+ const matches = order.items.filter(
12134
+ (item) => {
12135
+ var _a, _b, _c;
12136
+ return ((_c = (_b = (_a = item.variant) == null ? void 0 : _a.product) == null ? void 0 : _b.shipping_profile) == null ? void 0 : _c.id) === shippingProfileId;
12137
+ }
12138
+ );
12139
+ return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-y-6", children: [
12140
+ /* @__PURE__ */ jsx("div", { className: "grid grid-cols-2 items-center gap-3", children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
12141
+ /* @__PURE__ */ jsx(Text, { size: "small", weight: "plus", leading: "compact", children: "Items to ship" }),
12142
+ /* @__PURE__ */ jsx(Text, { size: "small", className: "text-ui-fg-subtle", children: "Items with the selected shipping profile." })
12143
+ ] }) }),
12144
+ /* @__PURE__ */ jsxs("div", { className: "bg-ui-bg-subtle shadow-elevation-card-rest rounded-xl", children: [
12145
+ /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-3 px-4 py-2 text-ui-fg-muted", children: [
12146
+ /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(Text, { size: "small", weight: "plus", children: "Item" }) }),
12147
+ /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(Text, { size: "small", weight: "plus", children: "Quantity" }) })
12434
12148
  ] }),
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,
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",
12438
12151
  {
12439
- promotion,
12440
- orderId: preview.id,
12441
- isLoading: isPending
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
+ ]
12442
12203
  },
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
- ] }) })
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
+ ] })
12458
12214
  ] });
12459
12215
  };
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(
12469
- {
12470
- promo_codes: [promotion.code]
12471
- },
12472
- {
12473
- onError: (e) => {
12474
- toast.error(e.message);
12475
- }
12476
- }
12477
- );
12478
- };
12479
- const displayValue = getDisplayValue(promotion);
12480
- return /* @__PURE__ */ jsxs(
12481
- "div",
12482
- {
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
- ),
12489
- 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
- )
12511
- ]
12216
+ const LocationField = ({ control, setValue }) => {
12217
+ const locations = useComboboxData({
12218
+ queryKey: ["locations"],
12219
+ queryFn: async (params) => {
12220
+ return await sdk.admin.stockLocation.list(params);
12512
12221
  },
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;
12222
+ getOptions: (data) => {
12223
+ return data.stock_locations.map((location) => ({
12224
+ label: location.name,
12225
+ value: location.id
12226
+ }));
12526
12227
  }
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);
12228
+ });
12229
+ return /* @__PURE__ */ jsx(
12230
+ Form$2.Field,
12231
+ {
12232
+ control,
12233
+ name: "location_id",
12234
+ render: ({ field: { onChange, ...field } }) => {
12235
+ return /* @__PURE__ */ jsx(Form$2.Item, { children: /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-x-3", children: [
12236
+ /* @__PURE__ */ jsxs("div", { children: [
12237
+ /* @__PURE__ */ jsx(Form$2.Label, { children: "Location" }),
12238
+ /* @__PURE__ */ jsx(Form$2.Hint, { children: "Choose where you want to ship the items from." })
12239
+ ] }),
12240
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(
12241
+ Combobox,
12242
+ {
12243
+ options: locations.options,
12244
+ fetchNextPage: locations.fetchNextPage,
12245
+ isFetchingNextPage: locations.isFetchingNextPage,
12246
+ searchValue: locations.searchValue,
12247
+ onSearchValueChange: locations.onSearchValueChange,
12248
+ placeholder: "Select location",
12249
+ onChange: (value) => {
12250
+ setValue("shipping_option_id", "", {
12251
+ shouldDirty: true,
12252
+ shouldTouch: true
12253
+ });
12254
+ onChange(value);
12255
+ },
12256
+ ...field
12257
+ }
12258
+ ) })
12259
+ ] }) });
12260
+ }
12261
+ }
12262
+ );
12543
12263
  };
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);
12264
+ const ShippingOptionField = ({
12265
+ shippingProfileId,
12266
+ preview,
12267
+ control
12268
+ }) => {
12269
+ var _a;
12270
+ const locationId = useWatch({ control, name: "location_id" });
12271
+ const shippingOptions = useComboboxData({
12272
+ queryKey: ["shipping_options", locationId, shippingProfileId],
12273
+ queryFn: async (params) => {
12274
+ return await sdk.admin.shippingOption.list({
12275
+ ...params,
12276
+ stock_location_id: locationId,
12277
+ shipping_profile_id: shippingProfileId
12278
+ });
12279
+ },
12280
+ getOptions: (data) => {
12281
+ return data.shipping_options.map((option) => {
12282
+ var _a2;
12283
+ if ((_a2 = option.rules) == null ? void 0 : _a2.find(
12284
+ (r) => r.attribute === "is_return" && r.value === "true"
12285
+ )) {
12286
+ return void 0;
12551
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
+ ] }) });
12552
12330
  }
12553
12331
  }
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
- }
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
+ ] });
12561
12359
  }
12562
12360
  }
12563
- }
12564
- return Array.from(promotionIds);
12565
- }
12361
+ );
12362
+ };
12566
12363
  const TransferOwnership = () => {
12567
12364
  const { id } = useParams();
12568
12365
  const { draft_order, isPending, isError, error } = useDraftOrder(id, {
@@ -12586,7 +12383,7 @@ const TransferOwnershipForm = ({ order }) => {
12586
12383
  defaultValues: {
12587
12384
  customer_id: order.customer_id || ""
12588
12385
  },
12589
- resolver: zodResolver(schema)
12386
+ resolver: zodResolver(schema$1)
12590
12387
  });
12591
12388
  const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
12592
12389
  const { handleSuccess } = useRouteModal();
@@ -13036,9 +12833,212 @@ const Illustration = () => {
13036
12833
  }
13037
12834
  );
13038
12835
  };
13039
- const schema = objectType({
12836
+ const schema$1 = objectType({
13040
12837
  customer_id: stringType().min(1)
13041
12838
  });
12839
+ const ShippingAddress = () => {
12840
+ const { id } = useParams();
12841
+ const { order, isPending, isError, error } = useOrder(id, {
12842
+ fields: "+shipping_address"
12843
+ });
12844
+ if (isError) {
12845
+ throw error;
12846
+ }
12847
+ const isReady = !isPending && !!order;
12848
+ return /* @__PURE__ */ jsxs(RouteDrawer, { children: [
12849
+ /* @__PURE__ */ jsxs(RouteDrawer.Header, { children: [
12850
+ /* @__PURE__ */ jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Edit Shipping Address" }) }),
12851
+ /* @__PURE__ */ jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Edit the shipping address for the draft order" }) })
12852
+ ] }),
12853
+ isReady && /* @__PURE__ */ jsx(ShippingAddressForm, { order })
12854
+ ] });
12855
+ };
12856
+ const ShippingAddressForm = ({ order }) => {
12857
+ var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
12858
+ const form = useForm({
12859
+ defaultValues: {
12860
+ first_name: ((_a = order.shipping_address) == null ? void 0 : _a.first_name) ?? "",
12861
+ last_name: ((_b = order.shipping_address) == null ? void 0 : _b.last_name) ?? "",
12862
+ company: ((_c = order.shipping_address) == null ? void 0 : _c.company) ?? "",
12863
+ address_1: ((_d = order.shipping_address) == null ? void 0 : _d.address_1) ?? "",
12864
+ address_2: ((_e = order.shipping_address) == null ? void 0 : _e.address_2) ?? "",
12865
+ city: ((_f = order.shipping_address) == null ? void 0 : _f.city) ?? "",
12866
+ province: ((_g = order.shipping_address) == null ? void 0 : _g.province) ?? "",
12867
+ country_code: ((_h = order.shipping_address) == null ? void 0 : _h.country_code) ?? "",
12868
+ postal_code: ((_i = order.shipping_address) == null ? void 0 : _i.postal_code) ?? "",
12869
+ phone: ((_j = order.shipping_address) == null ? void 0 : _j.phone) ?? ""
12870
+ },
12871
+ resolver: zodResolver(schema)
12872
+ });
12873
+ const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
12874
+ const { handleSuccess } = useRouteModal();
12875
+ const onSubmit = form.handleSubmit(async (data) => {
12876
+ await mutateAsync(
12877
+ {
12878
+ shipping_address: {
12879
+ first_name: data.first_name,
12880
+ last_name: data.last_name,
12881
+ company: data.company,
12882
+ address_1: data.address_1,
12883
+ address_2: data.address_2,
12884
+ city: data.city,
12885
+ province: data.province,
12886
+ country_code: data.country_code,
12887
+ postal_code: data.postal_code,
12888
+ phone: data.phone
12889
+ }
12890
+ },
12891
+ {
12892
+ onSuccess: () => {
12893
+ handleSuccess();
12894
+ },
12895
+ onError: (error) => {
12896
+ toast.error(error.message);
12897
+ }
12898
+ }
12899
+ );
12900
+ });
12901
+ return /* @__PURE__ */ jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxs(
12902
+ KeyboundForm,
12903
+ {
12904
+ className: "flex flex-1 flex-col overflow-hidden",
12905
+ onSubmit,
12906
+ children: [
12907
+ /* @__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: [
12908
+ /* @__PURE__ */ jsx(
12909
+ Form$2.Field,
12910
+ {
12911
+ control: form.control,
12912
+ name: "country_code",
12913
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
12914
+ /* @__PURE__ */ jsx(Form$2.Label, { children: "Country" }),
12915
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(CountrySelect, { ...field }) }),
12916
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
12917
+ ] })
12918
+ }
12919
+ ),
12920
+ /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
12921
+ /* @__PURE__ */ jsx(
12922
+ Form$2.Field,
12923
+ {
12924
+ control: form.control,
12925
+ name: "first_name",
12926
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
12927
+ /* @__PURE__ */ jsx(Form$2.Label, { children: "First name" }),
12928
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
12929
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
12930
+ ] })
12931
+ }
12932
+ ),
12933
+ /* @__PURE__ */ jsx(
12934
+ Form$2.Field,
12935
+ {
12936
+ control: form.control,
12937
+ name: "last_name",
12938
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
12939
+ /* @__PURE__ */ jsx(Form$2.Label, { children: "Last name" }),
12940
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
12941
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
12942
+ ] })
12943
+ }
12944
+ )
12945
+ ] }),
12946
+ /* @__PURE__ */ jsx(
12947
+ Form$2.Field,
12948
+ {
12949
+ control: form.control,
12950
+ name: "company",
12951
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
12952
+ /* @__PURE__ */ jsx(Form$2.Label, { optional: true, children: "Company" }),
12953
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
12954
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
12955
+ ] })
12956
+ }
12957
+ ),
12958
+ /* @__PURE__ */ jsx(
12959
+ Form$2.Field,
12960
+ {
12961
+ control: form.control,
12962
+ name: "address_1",
12963
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
12964
+ /* @__PURE__ */ jsx(Form$2.Label, { children: "Address" }),
12965
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
12966
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
12967
+ ] })
12968
+ }
12969
+ ),
12970
+ /* @__PURE__ */ jsx(
12971
+ Form$2.Field,
12972
+ {
12973
+ control: form.control,
12974
+ name: "address_2",
12975
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
12976
+ /* @__PURE__ */ jsx(Form$2.Label, { optional: true, children: "Apartment, suite, etc." }),
12977
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
12978
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
12979
+ ] })
12980
+ }
12981
+ ),
12982
+ /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
12983
+ /* @__PURE__ */ jsx(
12984
+ Form$2.Field,
12985
+ {
12986
+ control: form.control,
12987
+ name: "postal_code",
12988
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
12989
+ /* @__PURE__ */ jsx(Form$2.Label, { children: "Postal code" }),
12990
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
12991
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
12992
+ ] })
12993
+ }
12994
+ ),
12995
+ /* @__PURE__ */ jsx(
12996
+ Form$2.Field,
12997
+ {
12998
+ control: form.control,
12999
+ name: "city",
13000
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
13001
+ /* @__PURE__ */ jsx(Form$2.Label, { children: "City" }),
13002
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
13003
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
13004
+ ] })
13005
+ }
13006
+ )
13007
+ ] }),
13008
+ /* @__PURE__ */ jsx(
13009
+ Form$2.Field,
13010
+ {
13011
+ control: form.control,
13012
+ name: "province",
13013
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
13014
+ /* @__PURE__ */ jsx(Form$2.Label, { optional: true, children: "Province / State" }),
13015
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
13016
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
13017
+ ] })
13018
+ }
13019
+ ),
13020
+ /* @__PURE__ */ jsx(
13021
+ Form$2.Field,
13022
+ {
13023
+ control: form.control,
13024
+ name: "phone",
13025
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
13026
+ /* @__PURE__ */ jsx(Form$2.Label, { optional: true, children: "Phone" }),
13027
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
13028
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
13029
+ ] })
13030
+ }
13031
+ )
13032
+ ] }) }),
13033
+ /* @__PURE__ */ jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex justify-end gap-2", children: [
13034
+ /* @__PURE__ */ jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
13035
+ /* @__PURE__ */ jsx(Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
13036
+ ] }) })
13037
+ ]
13038
+ }
13039
+ ) });
13040
+ };
13041
+ const schema = addressSchema;
13042
13042
  const widgetModule = { widgets: [] };
13043
13043
  const routeModule = {
13044
13044
  routes: [
@@ -13071,33 +13071,33 @@ const routeModule = {
13071
13071
  Component: Email,
13072
13072
  path: "/draft-orders/:id/email"
13073
13073
  },
13074
- {
13075
- Component: CustomItems,
13076
- path: "/draft-orders/:id/custom-items"
13077
- },
13078
13074
  {
13079
13075
  Component: Metadata,
13080
13076
  path: "/draft-orders/:id/metadata"
13081
13077
  },
13082
13078
  {
13083
- Component: Shipping,
13084
- path: "/draft-orders/:id/shipping"
13079
+ Component: CustomItems,
13080
+ path: "/draft-orders/:id/custom-items"
13085
13081
  },
13086
13082
  {
13087
13083
  Component: SalesChannel,
13088
13084
  path: "/draft-orders/:id/sales-channel"
13089
13085
  },
13090
- {
13091
- Component: ShippingAddress,
13092
- path: "/draft-orders/:id/shipping-address"
13093
- },
13094
13086
  {
13095
13087
  Component: Promotions,
13096
13088
  path: "/draft-orders/:id/promotions"
13097
13089
  },
13090
+ {
13091
+ Component: Shipping,
13092
+ path: "/draft-orders/:id/shipping"
13093
+ },
13098
13094
  {
13099
13095
  Component: TransferOwnership,
13100
13096
  path: "/draft-orders/:id/transfer-ownership"
13097
+ },
13098
+ {
13099
+ Component: ShippingAddress,
13100
+ path: "/draft-orders/:id/shipping-address"
13101
13101
  }
13102
13102
  ]
13103
13103
  }