@medusajs/draft-order 2.11.3 → 2.11.4-preview-20251105180136

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