@medusajs/draft-order 2.11.4-preview-20251117090222 → 2.11.4-preview-20251117150141

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.
@@ -9783,74 +9783,6 @@ const CustomItemsForm = () => {
9783
9783
  const schema$4 = objectType({
9784
9784
  email: stringType().email()
9785
9785
  });
9786
- const Email = () => {
9787
- const { id } = reactRouterDom.useParams();
9788
- const { order, isPending, isError, error } = useOrder(id, {
9789
- fields: "+email"
9790
- });
9791
- if (isError) {
9792
- throw error;
9793
- }
9794
- const isReady = !isPending && !!order;
9795
- return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
9796
- /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
9797
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Email" }) }),
9798
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit the email for the draft order" }) })
9799
- ] }),
9800
- isReady && /* @__PURE__ */ jsxRuntime.jsx(EmailForm, { order })
9801
- ] });
9802
- };
9803
- const EmailForm = ({ order }) => {
9804
- const form = reactHookForm.useForm({
9805
- defaultValues: {
9806
- email: order.email ?? ""
9807
- },
9808
- resolver: zod.zodResolver(schema$3)
9809
- });
9810
- const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
9811
- const { handleSuccess } = useRouteModal();
9812
- const onSubmit = form.handleSubmit(async (data) => {
9813
- await mutateAsync(
9814
- { email: data.email },
9815
- {
9816
- onSuccess: () => {
9817
- handleSuccess();
9818
- },
9819
- onError: (error) => {
9820
- ui.toast.error(error.message);
9821
- }
9822
- }
9823
- );
9824
- });
9825
- return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
9826
- KeyboundForm,
9827
- {
9828
- className: "flex flex-1 flex-col overflow-hidden",
9829
- onSubmit,
9830
- children: [
9831
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsx(
9832
- Form$2.Field,
9833
- {
9834
- control: form.control,
9835
- name: "email",
9836
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9837
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Email" }),
9838
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9839
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9840
- ] })
9841
- }
9842
- ) }),
9843
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
9844
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
9845
- /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
9846
- ] }) })
9847
- ]
9848
- }
9849
- ) });
9850
- };
9851
- const schema$3 = objectType({
9852
- email: stringType().email()
9853
- });
9854
9786
  const NumberInput = React.forwardRef(
9855
9787
  ({
9856
9788
  value,
@@ -10825,121 +10757,539 @@ const customItemSchema = objectType({
10825
10757
  quantity: numberType(),
10826
10758
  unit_price: unionType([numberType(), stringType()])
10827
10759
  });
10828
- const PROMOTION_QUERY_KEY = "promotions";
10829
- const promotionsQueryKeys = {
10830
- list: (query2) => [
10831
- PROMOTION_QUERY_KEY,
10832
- query2 ? query2 : void 0
10833
- ],
10834
- detail: (id, query2) => [
10835
- PROMOTION_QUERY_KEY,
10836
- id,
10837
- query2 ? query2 : void 0
10838
- ]
10839
- };
10840
- const usePromotions = (query2, options) => {
10841
- const { data, ...rest } = reactQuery.useQuery({
10842
- queryKey: promotionsQueryKeys.list(query2),
10843
- queryFn: async () => sdk.admin.promotion.list(query2),
10844
- ...options
10845
- });
10846
- return { ...data, ...rest };
10847
- };
10848
- const Promotions = () => {
10760
+ const InlineTip = React.forwardRef(
10761
+ ({ variant = "tip", label, className, children, ...props }, ref) => {
10762
+ const labelValue = label || (variant === "warning" ? "Warning" : "Tip");
10763
+ return /* @__PURE__ */ jsxRuntime.jsxs(
10764
+ "div",
10765
+ {
10766
+ ref,
10767
+ className: ui.clx(
10768
+ "bg-ui-bg-component txt-small text-ui-fg-subtle grid grid-cols-[4px_1fr] items-start gap-3 rounded-lg border p-3",
10769
+ className
10770
+ ),
10771
+ ...props,
10772
+ children: [
10773
+ /* @__PURE__ */ jsxRuntime.jsx(
10774
+ "div",
10775
+ {
10776
+ role: "presentation",
10777
+ className: ui.clx("w-4px bg-ui-tag-neutral-icon h-full rounded-full", {
10778
+ "bg-ui-tag-orange-icon": variant === "warning"
10779
+ })
10780
+ }
10781
+ ),
10782
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-pretty", children: [
10783
+ /* @__PURE__ */ jsxRuntime.jsxs("strong", { className: "txt-small-plus text-ui-fg-base", children: [
10784
+ labelValue,
10785
+ ":"
10786
+ ] }),
10787
+ " ",
10788
+ children
10789
+ ] })
10790
+ ]
10791
+ }
10792
+ );
10793
+ }
10794
+ );
10795
+ InlineTip.displayName = "InlineTip";
10796
+ const MetadataFieldSchema = objectType({
10797
+ key: stringType(),
10798
+ disabled: booleanType().optional(),
10799
+ value: anyType()
10800
+ });
10801
+ const MetadataSchema = objectType({
10802
+ metadata: arrayType(MetadataFieldSchema)
10803
+ });
10804
+ const Metadata = () => {
10849
10805
  const { id } = reactRouterDom.useParams();
10850
- const {
10851
- order: preview,
10852
- isError: isPreviewError,
10853
- error: previewError
10854
- } = useOrderPreview(id, void 0);
10855
- useInitiateOrderEdit({ preview });
10856
- const { onCancel } = useCancelOrderEdit({ preview });
10857
- if (isPreviewError) {
10858
- throw previewError;
10806
+ const { order, isPending, isError, error } = useOrder(id, {
10807
+ fields: "metadata"
10808
+ });
10809
+ if (isError) {
10810
+ throw error;
10859
10811
  }
10860
- const isReady = !!preview;
10861
- return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { onClose: onCancel, children: [
10862
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Header, { children: /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Promotions" }) }) }),
10863
- isReady && /* @__PURE__ */ jsxRuntime.jsx(PromotionForm, { preview })
10812
+ const isReady = !isPending && !!order;
10813
+ return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
10814
+ /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
10815
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Metadata" }) }),
10816
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Add metadata to the draft order." }) })
10817
+ ] }),
10818
+ !isReady ? /* @__PURE__ */ jsxRuntime.jsx(PlaceholderInner, {}) : /* @__PURE__ */ jsxRuntime.jsx(MetadataForm, { orderId: id, metadata: order == null ? void 0 : order.metadata })
10864
10819
  ] });
10865
10820
  };
10866
- const PromotionForm = ({ preview }) => {
10867
- const { items, shipping_methods } = preview;
10868
- const [isSubmitting, setIsSubmitting] = React.useState(false);
10869
- const [comboboxValue, setComboboxValue] = React.useState("");
10821
+ const METADATA_KEY_LABEL_ID = "metadata-form-key-label";
10822
+ const METADATA_VALUE_LABEL_ID = "metadata-form-value-label";
10823
+ const MetadataForm = ({ orderId, metadata }) => {
10870
10824
  const { handleSuccess } = useRouteModal();
10871
- const { mutateAsync: addPromotions, isPending: isAddingPromotions } = useDraftOrderAddPromotions(preview.id);
10872
- const promoIds = getPromotionIds(items, shipping_methods);
10873
- const { promotions, isPending, isError, error } = usePromotions(
10874
- {
10875
- id: promoIds
10876
- },
10877
- {
10878
- enabled: !!promoIds.length
10879
- }
10880
- );
10881
- const comboboxData = useComboboxData({
10882
- queryKey: ["promotions", "combobox", promoIds],
10883
- queryFn: async (params) => {
10884
- return await sdk.admin.promotion.list({
10885
- ...params,
10886
- id: {
10887
- $nin: promoIds
10888
- }
10889
- });
10825
+ const hasUneditableRows = getHasUneditableRows(metadata);
10826
+ const { mutateAsync, isPending } = useUpdateDraftOrder(orderId);
10827
+ const form = reactHookForm.useForm({
10828
+ defaultValues: {
10829
+ metadata: getDefaultValues(metadata)
10890
10830
  },
10891
- getOptions: (data) => {
10892
- return data.promotions.map((promotion) => ({
10893
- label: promotion.code,
10894
- value: promotion.code
10895
- }));
10896
- }
10831
+ resolver: zod.zodResolver(MetadataSchema)
10897
10832
  });
10898
- const add = async (value) => {
10899
- if (!value) {
10900
- return;
10901
- }
10902
- addPromotions(
10833
+ const handleSubmit = form.handleSubmit(async (data) => {
10834
+ const parsedData = parseValues(data);
10835
+ await mutateAsync(
10903
10836
  {
10904
- promo_codes: [value]
10837
+ metadata: parsedData
10905
10838
  },
10906
10839
  {
10907
- onError: (e) => {
10908
- ui.toast.error(e.message);
10909
- comboboxData.onSearchValueChange("");
10910
- setComboboxValue("");
10911
- },
10912
10840
  onSuccess: () => {
10913
- comboboxData.onSearchValueChange("");
10914
- setComboboxValue("");
10841
+ ui.toast.success("Metadata updated");
10842
+ handleSuccess();
10843
+ },
10844
+ onError: (error) => {
10845
+ ui.toast.error(error.message);
10915
10846
  }
10916
10847
  }
10917
10848
  );
10918
- };
10919
- const { mutateAsync: confirmOrderEdit } = useDraftOrderConfirmEdit(preview.id);
10920
- const { mutateAsync: requestOrderEdit } = useOrderEditRequest(preview.id);
10921
- const onSubmit = async () => {
10922
- setIsSubmitting(true);
10923
- let requestSucceeded = false;
10924
- await requestOrderEdit(void 0, {
10925
- onError: (e) => {
10926
- ui.toast.error(e.message);
10927
- },
10928
- onSuccess: () => {
10929
- requestSucceeded = true;
10930
- }
10931
- });
10932
- if (!requestSucceeded) {
10933
- setIsSubmitting(false);
10934
- return;
10849
+ });
10850
+ const { fields, insert, remove } = reactHookForm.useFieldArray({
10851
+ control: form.control,
10852
+ name: "metadata"
10853
+ });
10854
+ function deleteRow(index) {
10855
+ remove(index);
10856
+ if (fields.length === 1) {
10857
+ insert(0, {
10858
+ key: "",
10859
+ value: "",
10860
+ disabled: false
10861
+ });
10935
10862
  }
10936
- await confirmOrderEdit(void 0, {
10937
- onError: (e) => {
10938
- ui.toast.error(e.message);
10939
- },
10940
- onSuccess: () => {
10941
- handleSuccess();
10942
- },
10863
+ }
10864
+ function insertRow(index, position) {
10865
+ insert(index + (position === "above" ? 0 : 1), {
10866
+ key: "",
10867
+ value: "",
10868
+ disabled: false
10869
+ });
10870
+ }
10871
+ return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
10872
+ KeyboundForm,
10873
+ {
10874
+ onSubmit: handleSubmit,
10875
+ className: "flex flex-1 flex-col overflow-hidden",
10876
+ children: [
10877
+ /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Body, { className: "flex flex-1 flex-col gap-y-8 overflow-y-auto", children: [
10878
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-ui-bg-base shadow-elevation-card-rest grid grid-cols-1 divide-y rounded-lg", children: [
10879
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-ui-bg-subtle grid grid-cols-2 divide-x rounded-t-lg", children: [
10880
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "txt-compact-small-plus text-ui-fg-subtle px-2 py-1.5", children: /* @__PURE__ */ jsxRuntime.jsx("label", { id: METADATA_KEY_LABEL_ID, children: "Key" }) }),
10881
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "txt-compact-small-plus text-ui-fg-subtle px-2 py-1.5", children: /* @__PURE__ */ jsxRuntime.jsx("label", { id: METADATA_VALUE_LABEL_ID, children: "Value" }) })
10882
+ ] }),
10883
+ fields.map((field, index) => {
10884
+ const isDisabled = field.disabled || false;
10885
+ let placeholder = "-";
10886
+ if (typeof field.value === "object") {
10887
+ placeholder = "{ ... }";
10888
+ }
10889
+ if (Array.isArray(field.value)) {
10890
+ placeholder = "[ ... ]";
10891
+ }
10892
+ return /* @__PURE__ */ jsxRuntime.jsx(
10893
+ ConditionalTooltip,
10894
+ {
10895
+ showTooltip: isDisabled,
10896
+ content: "This row is disabled because it contains non-primitive data.",
10897
+ children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "group/table relative", children: [
10898
+ /* @__PURE__ */ jsxRuntime.jsxs(
10899
+ "div",
10900
+ {
10901
+ className: ui.clx("grid grid-cols-2 divide-x", {
10902
+ "overflow-hidden rounded-b-lg": index === fields.length - 1
10903
+ }),
10904
+ children: [
10905
+ /* @__PURE__ */ jsxRuntime.jsx(
10906
+ Form$2.Field,
10907
+ {
10908
+ control: form.control,
10909
+ name: `metadata.${index}.key`,
10910
+ render: ({ field: field2 }) => {
10911
+ return /* @__PURE__ */ jsxRuntime.jsx(Form$2.Item, { children: /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
10912
+ GridInput,
10913
+ {
10914
+ "aria-labelledby": METADATA_KEY_LABEL_ID,
10915
+ ...field2,
10916
+ disabled: isDisabled,
10917
+ placeholder: "Key"
10918
+ }
10919
+ ) }) });
10920
+ }
10921
+ }
10922
+ ),
10923
+ /* @__PURE__ */ jsxRuntime.jsx(
10924
+ Form$2.Field,
10925
+ {
10926
+ control: form.control,
10927
+ name: `metadata.${index}.value`,
10928
+ render: ({ field: { value, ...field2 } }) => {
10929
+ return /* @__PURE__ */ jsxRuntime.jsx(Form$2.Item, { children: /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
10930
+ GridInput,
10931
+ {
10932
+ "aria-labelledby": METADATA_VALUE_LABEL_ID,
10933
+ ...field2,
10934
+ value: isDisabled ? placeholder : value,
10935
+ disabled: isDisabled,
10936
+ placeholder: "Value"
10937
+ }
10938
+ ) }) });
10939
+ }
10940
+ }
10941
+ )
10942
+ ]
10943
+ }
10944
+ ),
10945
+ /* @__PURE__ */ jsxRuntime.jsxs(ui.DropdownMenu, { children: [
10946
+ /* @__PURE__ */ jsxRuntime.jsx(
10947
+ ui.DropdownMenu.Trigger,
10948
+ {
10949
+ className: ui.clx(
10950
+ "invisible absolute inset-y-0 -right-2.5 my-auto group-hover/table:visible data-[state='open']:visible",
10951
+ {
10952
+ hidden: isDisabled
10953
+ }
10954
+ ),
10955
+ disabled: isDisabled,
10956
+ asChild: true,
10957
+ children: /* @__PURE__ */ jsxRuntime.jsx(ui.IconButton, { size: "2xsmall", children: /* @__PURE__ */ jsxRuntime.jsx(icons.EllipsisVertical, {}) })
10958
+ }
10959
+ ),
10960
+ /* @__PURE__ */ jsxRuntime.jsxs(ui.DropdownMenu.Content, { children: [
10961
+ /* @__PURE__ */ jsxRuntime.jsxs(
10962
+ ui.DropdownMenu.Item,
10963
+ {
10964
+ className: "gap-x-2",
10965
+ onClick: () => insertRow(index, "above"),
10966
+ children: [
10967
+ /* @__PURE__ */ jsxRuntime.jsx(icons.ArrowUpMini, { className: "text-ui-fg-subtle" }),
10968
+ "Insert row above"
10969
+ ]
10970
+ }
10971
+ ),
10972
+ /* @__PURE__ */ jsxRuntime.jsxs(
10973
+ ui.DropdownMenu.Item,
10974
+ {
10975
+ className: "gap-x-2",
10976
+ onClick: () => insertRow(index, "below"),
10977
+ children: [
10978
+ /* @__PURE__ */ jsxRuntime.jsx(icons.ArrowDownMini, { className: "text-ui-fg-subtle" }),
10979
+ "Insert row below"
10980
+ ]
10981
+ }
10982
+ ),
10983
+ /* @__PURE__ */ jsxRuntime.jsx(ui.DropdownMenu.Separator, {}),
10984
+ /* @__PURE__ */ jsxRuntime.jsxs(
10985
+ ui.DropdownMenu.Item,
10986
+ {
10987
+ className: "gap-x-2",
10988
+ onClick: () => deleteRow(index),
10989
+ children: [
10990
+ /* @__PURE__ */ jsxRuntime.jsx(icons.Trash, { className: "text-ui-fg-subtle" }),
10991
+ "Delete row"
10992
+ ]
10993
+ }
10994
+ )
10995
+ ] })
10996
+ ] })
10997
+ ] })
10998
+ },
10999
+ field.id
11000
+ );
11001
+ })
11002
+ ] }),
11003
+ hasUneditableRows && /* @__PURE__ */ jsxRuntime.jsx(InlineTip, { variant: "warning", label: "Some rows are disabled", children: "This object contains non-primitive metadata, such as arrays or objects, that can't be edited here. To edit the disabled rows, use the API directly." })
11004
+ ] }),
11005
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
11006
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", type: "button", children: "Cancel" }) }),
11007
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
11008
+ ] }) })
11009
+ ]
11010
+ }
11011
+ ) });
11012
+ };
11013
+ const GridInput = React.forwardRef(({ className, ...props }, ref) => {
11014
+ return /* @__PURE__ */ jsxRuntime.jsx(
11015
+ "input",
11016
+ {
11017
+ ref,
11018
+ ...props,
11019
+ autoComplete: "off",
11020
+ className: ui.clx(
11021
+ "txt-compact-small text-ui-fg-base placeholder:text-ui-fg-muted disabled:text-ui-fg-disabled disabled:bg-ui-bg-base bg-transparent px-2 py-1.5 outline-none",
11022
+ className
11023
+ )
11024
+ }
11025
+ );
11026
+ });
11027
+ GridInput.displayName = "MetadataForm.GridInput";
11028
+ const PlaceholderInner = () => {
11029
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-1 flex-col overflow-hidden", children: [
11030
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Skeleton, { className: "h-[148ox] w-full rounded-lg" }) }),
11031
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
11032
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Skeleton, { className: "h-7 w-12 rounded-md" }),
11033
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Skeleton, { className: "h-7 w-12 rounded-md" })
11034
+ ] }) })
11035
+ ] });
11036
+ };
11037
+ const EDITABLE_TYPES = ["string", "number", "boolean"];
11038
+ function getDefaultValues(metadata) {
11039
+ if (!metadata || !Object.keys(metadata).length) {
11040
+ return [
11041
+ {
11042
+ key: "",
11043
+ value: "",
11044
+ disabled: false
11045
+ }
11046
+ ];
11047
+ }
11048
+ return Object.entries(metadata).map(([key, value]) => {
11049
+ if (!EDITABLE_TYPES.includes(typeof value)) {
11050
+ return {
11051
+ key,
11052
+ value,
11053
+ disabled: true
11054
+ };
11055
+ }
11056
+ let stringValue = value;
11057
+ if (typeof value !== "string") {
11058
+ stringValue = JSON.stringify(value);
11059
+ }
11060
+ return {
11061
+ key,
11062
+ value: stringValue,
11063
+ original_key: key
11064
+ };
11065
+ });
11066
+ }
11067
+ function parseValues(values) {
11068
+ const metadata = values.metadata;
11069
+ const isEmpty = !metadata.length || metadata.length === 1 && !metadata[0].key && !metadata[0].value;
11070
+ if (isEmpty) {
11071
+ return null;
11072
+ }
11073
+ const update = {};
11074
+ metadata.forEach((field) => {
11075
+ let key = field.key;
11076
+ let value = field.value;
11077
+ const disabled = field.disabled;
11078
+ if (!key || !value) {
11079
+ return;
11080
+ }
11081
+ if (disabled) {
11082
+ update[key] = value;
11083
+ return;
11084
+ }
11085
+ key = key.trim();
11086
+ value = value.trim();
11087
+ if (value === "true") {
11088
+ update[key] = true;
11089
+ } else if (value === "false") {
11090
+ update[key] = false;
11091
+ } else {
11092
+ const parsedNumber = parseFloat(value);
11093
+ if (!isNaN(parsedNumber)) {
11094
+ update[key] = parsedNumber;
11095
+ } else {
11096
+ update[key] = value;
11097
+ }
11098
+ }
11099
+ });
11100
+ return update;
11101
+ }
11102
+ function getHasUneditableRows(metadata) {
11103
+ if (!metadata) {
11104
+ return false;
11105
+ }
11106
+ return Object.values(metadata).some(
11107
+ (value) => !EDITABLE_TYPES.includes(typeof value)
11108
+ );
11109
+ }
11110
+ const Email = () => {
11111
+ const { id } = reactRouterDom.useParams();
11112
+ const { order, isPending, isError, error } = useOrder(id, {
11113
+ fields: "+email"
11114
+ });
11115
+ if (isError) {
11116
+ throw error;
11117
+ }
11118
+ const isReady = !isPending && !!order;
11119
+ return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
11120
+ /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
11121
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Email" }) }),
11122
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit the email for the draft order" }) })
11123
+ ] }),
11124
+ isReady && /* @__PURE__ */ jsxRuntime.jsx(EmailForm, { order })
11125
+ ] });
11126
+ };
11127
+ const EmailForm = ({ order }) => {
11128
+ const form = reactHookForm.useForm({
11129
+ defaultValues: {
11130
+ email: order.email ?? ""
11131
+ },
11132
+ resolver: zod.zodResolver(schema$3)
11133
+ });
11134
+ const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
11135
+ const { handleSuccess } = useRouteModal();
11136
+ const onSubmit = form.handleSubmit(async (data) => {
11137
+ await mutateAsync(
11138
+ { email: data.email },
11139
+ {
11140
+ onSuccess: () => {
11141
+ handleSuccess();
11142
+ },
11143
+ onError: (error) => {
11144
+ ui.toast.error(error.message);
11145
+ }
11146
+ }
11147
+ );
11148
+ });
11149
+ return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
11150
+ KeyboundForm,
11151
+ {
11152
+ className: "flex flex-1 flex-col overflow-hidden",
11153
+ onSubmit,
11154
+ children: [
11155
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsx(
11156
+ Form$2.Field,
11157
+ {
11158
+ control: form.control,
11159
+ name: "email",
11160
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11161
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Email" }),
11162
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11163
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11164
+ ] })
11165
+ }
11166
+ ) }),
11167
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
11168
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
11169
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
11170
+ ] }) })
11171
+ ]
11172
+ }
11173
+ ) });
11174
+ };
11175
+ const schema$3 = objectType({
11176
+ email: stringType().email()
11177
+ });
11178
+ const PROMOTION_QUERY_KEY = "promotions";
11179
+ const promotionsQueryKeys = {
11180
+ list: (query2) => [
11181
+ PROMOTION_QUERY_KEY,
11182
+ query2 ? query2 : void 0
11183
+ ],
11184
+ detail: (id, query2) => [
11185
+ PROMOTION_QUERY_KEY,
11186
+ id,
11187
+ query2 ? query2 : void 0
11188
+ ]
11189
+ };
11190
+ const usePromotions = (query2, options) => {
11191
+ const { data, ...rest } = reactQuery.useQuery({
11192
+ queryKey: promotionsQueryKeys.list(query2),
11193
+ queryFn: async () => sdk.admin.promotion.list(query2),
11194
+ ...options
11195
+ });
11196
+ return { ...data, ...rest };
11197
+ };
11198
+ const Promotions = () => {
11199
+ const { id } = reactRouterDom.useParams();
11200
+ const {
11201
+ order: preview,
11202
+ isError: isPreviewError,
11203
+ error: previewError
11204
+ } = useOrderPreview(id, void 0);
11205
+ useInitiateOrderEdit({ preview });
11206
+ const { onCancel } = useCancelOrderEdit({ preview });
11207
+ if (isPreviewError) {
11208
+ throw previewError;
11209
+ }
11210
+ const isReady = !!preview;
11211
+ return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { onClose: onCancel, children: [
11212
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Header, { children: /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Promotions" }) }) }),
11213
+ isReady && /* @__PURE__ */ jsxRuntime.jsx(PromotionForm, { preview })
11214
+ ] });
11215
+ };
11216
+ const PromotionForm = ({ preview }) => {
11217
+ const { items, shipping_methods } = preview;
11218
+ const [isSubmitting, setIsSubmitting] = React.useState(false);
11219
+ const [comboboxValue, setComboboxValue] = React.useState("");
11220
+ const { handleSuccess } = useRouteModal();
11221
+ const { mutateAsync: addPromotions, isPending: isAddingPromotions } = useDraftOrderAddPromotions(preview.id);
11222
+ const promoIds = getPromotionIds(items, shipping_methods);
11223
+ const { promotions, isPending, isError, error } = usePromotions(
11224
+ {
11225
+ id: promoIds
11226
+ },
11227
+ {
11228
+ enabled: !!promoIds.length
11229
+ }
11230
+ );
11231
+ const comboboxData = useComboboxData({
11232
+ queryKey: ["promotions", "combobox", promoIds],
11233
+ queryFn: async (params) => {
11234
+ return await sdk.admin.promotion.list({
11235
+ ...params,
11236
+ id: {
11237
+ $nin: promoIds
11238
+ }
11239
+ });
11240
+ },
11241
+ getOptions: (data) => {
11242
+ return data.promotions.map((promotion) => ({
11243
+ label: promotion.code,
11244
+ value: promotion.code
11245
+ }));
11246
+ }
11247
+ });
11248
+ const add = async (value) => {
11249
+ if (!value) {
11250
+ return;
11251
+ }
11252
+ addPromotions(
11253
+ {
11254
+ promo_codes: [value]
11255
+ },
11256
+ {
11257
+ onError: (e) => {
11258
+ ui.toast.error(e.message);
11259
+ comboboxData.onSearchValueChange("");
11260
+ setComboboxValue("");
11261
+ },
11262
+ onSuccess: () => {
11263
+ comboboxData.onSearchValueChange("");
11264
+ setComboboxValue("");
11265
+ }
11266
+ }
11267
+ );
11268
+ };
11269
+ const { mutateAsync: confirmOrderEdit } = useDraftOrderConfirmEdit(preview.id);
11270
+ const { mutateAsync: requestOrderEdit } = useOrderEditRequest(preview.id);
11271
+ const onSubmit = async () => {
11272
+ setIsSubmitting(true);
11273
+ let requestSucceeded = false;
11274
+ await requestOrderEdit(void 0, {
11275
+ onError: (e) => {
11276
+ ui.toast.error(e.message);
11277
+ },
11278
+ onSuccess: () => {
11279
+ requestSucceeded = true;
11280
+ }
11281
+ });
11282
+ if (!requestSucceeded) {
11283
+ setIsSubmitting(false);
11284
+ return;
11285
+ }
11286
+ await confirmOrderEdit(void 0, {
11287
+ onError: (e) => {
11288
+ ui.toast.error(e.message);
11289
+ },
11290
+ onSuccess: () => {
11291
+ handleSuccess();
11292
+ },
10943
11293
  onSettled: () => {
10944
11294
  setIsSubmitting(false);
10945
11295
  }
@@ -11102,88 +11452,46 @@ function getPromotionIds(items, shippingMethods) {
11102
11452
  }
11103
11453
  return Array.from(promotionIds);
11104
11454
  }
11105
- const InlineTip = React.forwardRef(
11106
- ({ variant = "tip", label, className, children, ...props }, ref) => {
11107
- const labelValue = label || (variant === "warning" ? "Warning" : "Tip");
11108
- return /* @__PURE__ */ jsxRuntime.jsxs(
11109
- "div",
11110
- {
11111
- ref,
11112
- className: ui.clx(
11113
- "bg-ui-bg-component txt-small text-ui-fg-subtle grid grid-cols-[4px_1fr] items-start gap-3 rounded-lg border p-3",
11114
- className
11115
- ),
11116
- ...props,
11117
- children: [
11118
- /* @__PURE__ */ jsxRuntime.jsx(
11119
- "div",
11120
- {
11121
- role: "presentation",
11122
- className: ui.clx("w-4px bg-ui-tag-neutral-icon h-full rounded-full", {
11123
- "bg-ui-tag-orange-icon": variant === "warning"
11124
- })
11125
- }
11126
- ),
11127
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-pretty", children: [
11128
- /* @__PURE__ */ jsxRuntime.jsxs("strong", { className: "txt-small-plus text-ui-fg-base", children: [
11129
- labelValue,
11130
- ":"
11131
- ] }),
11132
- " ",
11133
- children
11134
- ] })
11135
- ]
11136
- }
11137
- );
11138
- }
11139
- );
11140
- InlineTip.displayName = "InlineTip";
11141
- const MetadataFieldSchema = objectType({
11142
- key: stringType(),
11143
- disabled: booleanType().optional(),
11144
- value: anyType()
11145
- });
11146
- const MetadataSchema = objectType({
11147
- metadata: arrayType(MetadataFieldSchema)
11148
- });
11149
- const Metadata = () => {
11455
+ const SalesChannel = () => {
11150
11456
  const { id } = reactRouterDom.useParams();
11151
- const { order, isPending, isError, error } = useOrder(id, {
11152
- fields: "metadata"
11153
- });
11457
+ const { draft_order, isPending, isError, error } = useDraftOrder(
11458
+ id,
11459
+ {
11460
+ fields: "+sales_channel_id"
11461
+ },
11462
+ {
11463
+ enabled: !!id
11464
+ }
11465
+ );
11154
11466
  if (isError) {
11155
11467
  throw error;
11156
11468
  }
11157
- const isReady = !isPending && !!order;
11469
+ const ISrEADY = !!draft_order && !isPending;
11158
11470
  return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
11159
11471
  /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
11160
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Metadata" }) }),
11161
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Add metadata to the draft order." }) })
11472
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Sales Channel" }) }),
11473
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Update which sales channel the draft order is associated with" }) })
11162
11474
  ] }),
11163
- !isReady ? /* @__PURE__ */ jsxRuntime.jsx(PlaceholderInner, {}) : /* @__PURE__ */ jsxRuntime.jsx(MetadataForm, { orderId: id, metadata: order == null ? void 0 : order.metadata })
11475
+ ISrEADY && /* @__PURE__ */ jsxRuntime.jsx(SalesChannelForm, { order: draft_order })
11164
11476
  ] });
11165
11477
  };
11166
- const METADATA_KEY_LABEL_ID = "metadata-form-key-label";
11167
- const METADATA_VALUE_LABEL_ID = "metadata-form-value-label";
11168
- const MetadataForm = ({ orderId, metadata }) => {
11169
- const { handleSuccess } = useRouteModal();
11170
- const hasUneditableRows = getHasUneditableRows(metadata);
11171
- const { mutateAsync, isPending } = useUpdateDraftOrder(orderId);
11478
+ const SalesChannelForm = ({ order }) => {
11172
11479
  const form = reactHookForm.useForm({
11173
11480
  defaultValues: {
11174
- metadata: getDefaultValues(metadata)
11481
+ sales_channel_id: order.sales_channel_id || ""
11175
11482
  },
11176
- resolver: zod.zodResolver(MetadataSchema)
11483
+ resolver: zod.zodResolver(schema$2)
11177
11484
  });
11178
- const handleSubmit = form.handleSubmit(async (data) => {
11179
- const parsedData = parseValues(data);
11485
+ const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
11486
+ const { handleSuccess } = useRouteModal();
11487
+ const onSubmit = form.handleSubmit(async (data) => {
11180
11488
  await mutateAsync(
11181
11489
  {
11182
- metadata: parsedData
11490
+ sales_channel_id: data.sales_channel_id
11183
11491
  },
11184
11492
  {
11185
11493
  onSuccess: () => {
11186
- ui.toast.success("Metadata updated");
11494
+ ui.toast.success("Sales channel updated");
11187
11495
  handleSuccess();
11188
11496
  },
11189
11497
  onError: (error) => {
@@ -11192,266 +11500,64 @@ const MetadataForm = ({ orderId, metadata }) => {
11192
11500
  }
11193
11501
  );
11194
11502
  });
11195
- const { fields, insert, remove } = reactHookForm.useFieldArray({
11196
- control: form.control,
11197
- name: "metadata"
11198
- });
11199
- function deleteRow(index) {
11200
- remove(index);
11201
- if (fields.length === 1) {
11202
- insert(0, {
11203
- key: "",
11204
- value: "",
11205
- disabled: false
11206
- });
11207
- }
11208
- }
11209
- function insertRow(index, position) {
11210
- insert(index + (position === "above" ? 0 : 1), {
11211
- key: "",
11212
- value: "",
11213
- disabled: false
11214
- });
11215
- }
11216
11503
  return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
11217
11504
  KeyboundForm,
11218
11505
  {
11219
- onSubmit: handleSubmit,
11220
11506
  className: "flex flex-1 flex-col overflow-hidden",
11507
+ onSubmit,
11221
11508
  children: [
11222
- /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Body, { className: "flex flex-1 flex-col gap-y-8 overflow-y-auto", children: [
11223
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-ui-bg-base shadow-elevation-card-rest grid grid-cols-1 divide-y rounded-lg", children: [
11224
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-ui-bg-subtle grid grid-cols-2 divide-x rounded-t-lg", children: [
11225
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "txt-compact-small-plus text-ui-fg-subtle px-2 py-1.5", children: /* @__PURE__ */ jsxRuntime.jsx("label", { id: METADATA_KEY_LABEL_ID, children: "Key" }) }),
11226
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "txt-compact-small-plus text-ui-fg-subtle px-2 py-1.5", children: /* @__PURE__ */ jsxRuntime.jsx("label", { id: METADATA_VALUE_LABEL_ID, children: "Value" }) })
11227
- ] }),
11228
- fields.map((field, index) => {
11229
- const isDisabled = field.disabled || false;
11230
- let placeholder = "-";
11231
- if (typeof field.value === "object") {
11232
- placeholder = "{ ... }";
11233
- }
11234
- if (Array.isArray(field.value)) {
11235
- placeholder = "[ ... ]";
11236
- }
11237
- return /* @__PURE__ */ jsxRuntime.jsx(
11238
- ConditionalTooltip,
11239
- {
11240
- showTooltip: isDisabled,
11241
- content: "This row is disabled because it contains non-primitive data.",
11242
- children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "group/table relative", children: [
11243
- /* @__PURE__ */ jsxRuntime.jsxs(
11244
- "div",
11245
- {
11246
- className: ui.clx("grid grid-cols-2 divide-x", {
11247
- "overflow-hidden rounded-b-lg": index === fields.length - 1
11248
- }),
11249
- children: [
11250
- /* @__PURE__ */ jsxRuntime.jsx(
11251
- Form$2.Field,
11252
- {
11253
- control: form.control,
11254
- name: `metadata.${index}.key`,
11255
- render: ({ field: field2 }) => {
11256
- return /* @__PURE__ */ jsxRuntime.jsx(Form$2.Item, { children: /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
11257
- GridInput,
11258
- {
11259
- "aria-labelledby": METADATA_KEY_LABEL_ID,
11260
- ...field2,
11261
- disabled: isDisabled,
11262
- placeholder: "Key"
11263
- }
11264
- ) }) });
11265
- }
11266
- }
11267
- ),
11268
- /* @__PURE__ */ jsxRuntime.jsx(
11269
- Form$2.Field,
11270
- {
11271
- control: form.control,
11272
- name: `metadata.${index}.value`,
11273
- render: ({ field: { value, ...field2 } }) => {
11274
- return /* @__PURE__ */ jsxRuntime.jsx(Form$2.Item, { children: /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
11275
- GridInput,
11276
- {
11277
- "aria-labelledby": METADATA_VALUE_LABEL_ID,
11278
- ...field2,
11279
- value: isDisabled ? placeholder : value,
11280
- disabled: isDisabled,
11281
- placeholder: "Value"
11282
- }
11283
- ) }) });
11284
- }
11285
- }
11286
- )
11287
- ]
11288
- }
11289
- ),
11290
- /* @__PURE__ */ jsxRuntime.jsxs(ui.DropdownMenu, { children: [
11291
- /* @__PURE__ */ jsxRuntime.jsx(
11292
- ui.DropdownMenu.Trigger,
11293
- {
11294
- className: ui.clx(
11295
- "invisible absolute inset-y-0 -right-2.5 my-auto group-hover/table:visible data-[state='open']:visible",
11296
- {
11297
- hidden: isDisabled
11298
- }
11299
- ),
11300
- disabled: isDisabled,
11301
- asChild: true,
11302
- children: /* @__PURE__ */ jsxRuntime.jsx(ui.IconButton, { size: "2xsmall", children: /* @__PURE__ */ jsxRuntime.jsx(icons.EllipsisVertical, {}) })
11303
- }
11304
- ),
11305
- /* @__PURE__ */ jsxRuntime.jsxs(ui.DropdownMenu.Content, { children: [
11306
- /* @__PURE__ */ jsxRuntime.jsxs(
11307
- ui.DropdownMenu.Item,
11308
- {
11309
- className: "gap-x-2",
11310
- onClick: () => insertRow(index, "above"),
11311
- children: [
11312
- /* @__PURE__ */ jsxRuntime.jsx(icons.ArrowUpMini, { className: "text-ui-fg-subtle" }),
11313
- "Insert row above"
11314
- ]
11315
- }
11316
- ),
11317
- /* @__PURE__ */ jsxRuntime.jsxs(
11318
- ui.DropdownMenu.Item,
11319
- {
11320
- className: "gap-x-2",
11321
- onClick: () => insertRow(index, "below"),
11322
- children: [
11323
- /* @__PURE__ */ jsxRuntime.jsx(icons.ArrowDownMini, { className: "text-ui-fg-subtle" }),
11324
- "Insert row below"
11325
- ]
11326
- }
11327
- ),
11328
- /* @__PURE__ */ jsxRuntime.jsx(ui.DropdownMenu.Separator, {}),
11329
- /* @__PURE__ */ jsxRuntime.jsxs(
11330
- ui.DropdownMenu.Item,
11331
- {
11332
- className: "gap-x-2",
11333
- onClick: () => deleteRow(index),
11334
- children: [
11335
- /* @__PURE__ */ jsxRuntime.jsx(icons.Trash, { className: "text-ui-fg-subtle" }),
11336
- "Delete row"
11337
- ]
11338
- }
11339
- )
11340
- ] })
11341
- ] })
11342
- ] })
11343
- },
11344
- field.id
11345
- );
11346
- })
11347
- ] }),
11348
- hasUneditableRows && /* @__PURE__ */ jsxRuntime.jsx(InlineTip, { variant: "warning", label: "Some rows are disabled", children: "This object contains non-primitive metadata, such as arrays or objects, that can't be edited here. To edit the disabled rows, use the API directly." })
11349
- ] }),
11350
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
11351
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", type: "button", children: "Cancel" }) }),
11509
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsx(SalesChannelField, { control: form.control, order }) }),
11510
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
11511
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
11352
11512
  /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
11353
11513
  ] }) })
11354
11514
  ]
11355
11515
  }
11356
11516
  ) });
11357
11517
  };
11358
- const GridInput = React.forwardRef(({ className, ...props }, ref) => {
11518
+ const SalesChannelField = ({ control, order }) => {
11519
+ const salesChannels = useComboboxData({
11520
+ queryFn: async (params) => {
11521
+ return await sdk.admin.salesChannel.list(params);
11522
+ },
11523
+ queryKey: ["sales-channels"],
11524
+ getOptions: (data) => {
11525
+ return data.sales_channels.map((salesChannel) => ({
11526
+ label: salesChannel.name,
11527
+ value: salesChannel.id
11528
+ }));
11529
+ },
11530
+ defaultValue: order.sales_channel_id || void 0
11531
+ });
11359
11532
  return /* @__PURE__ */ jsxRuntime.jsx(
11360
- "input",
11533
+ Form$2.Field,
11361
11534
  {
11362
- ref,
11363
- ...props,
11364
- autoComplete: "off",
11365
- className: ui.clx(
11366
- "txt-compact-small text-ui-fg-base placeholder:text-ui-fg-muted disabled:text-ui-fg-disabled disabled:bg-ui-bg-base bg-transparent px-2 py-1.5 outline-none",
11367
- className
11368
- )
11369
- }
11370
- );
11371
- });
11372
- GridInput.displayName = "MetadataForm.GridInput";
11373
- const PlaceholderInner = () => {
11374
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-1 flex-col overflow-hidden", children: [
11375
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Skeleton, { className: "h-[148ox] w-full rounded-lg" }) }),
11376
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
11377
- /* @__PURE__ */ jsxRuntime.jsx(ui.Skeleton, { className: "h-7 w-12 rounded-md" }),
11378
- /* @__PURE__ */ jsxRuntime.jsx(ui.Skeleton, { className: "h-7 w-12 rounded-md" })
11379
- ] }) })
11380
- ] });
11381
- };
11382
- const EDITABLE_TYPES = ["string", "number", "boolean"];
11383
- function getDefaultValues(metadata) {
11384
- if (!metadata || !Object.keys(metadata).length) {
11385
- return [
11386
- {
11387
- key: "",
11388
- value: "",
11389
- disabled: false
11390
- }
11391
- ];
11392
- }
11393
- return Object.entries(metadata).map(([key, value]) => {
11394
- if (!EDITABLE_TYPES.includes(typeof value)) {
11395
- return {
11396
- key,
11397
- value,
11398
- disabled: true
11399
- };
11400
- }
11401
- let stringValue = value;
11402
- if (typeof value !== "string") {
11403
- stringValue = JSON.stringify(value);
11404
- }
11405
- return {
11406
- key,
11407
- value: stringValue,
11408
- original_key: key
11409
- };
11410
- });
11411
- }
11412
- function parseValues(values) {
11413
- const metadata = values.metadata;
11414
- const isEmpty = !metadata.length || metadata.length === 1 && !metadata[0].key && !metadata[0].value;
11415
- if (isEmpty) {
11416
- return null;
11417
- }
11418
- const update = {};
11419
- metadata.forEach((field) => {
11420
- let key = field.key;
11421
- let value = field.value;
11422
- const disabled = field.disabled;
11423
- if (!key || !value) {
11424
- return;
11425
- }
11426
- if (disabled) {
11427
- update[key] = value;
11428
- return;
11429
- }
11430
- key = key.trim();
11431
- value = value.trim();
11432
- if (value === "true") {
11433
- update[key] = true;
11434
- } else if (value === "false") {
11435
- update[key] = false;
11436
- } else {
11437
- const parsedNumber = parseFloat(value);
11438
- if (!isNaN(parsedNumber)) {
11439
- update[key] = parsedNumber;
11440
- } else {
11441
- update[key] = value;
11535
+ control,
11536
+ name: "sales_channel_id",
11537
+ render: ({ field }) => {
11538
+ return /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11539
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Sales Channel" }),
11540
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
11541
+ Combobox,
11542
+ {
11543
+ options: salesChannels.options,
11544
+ fetchNextPage: salesChannels.fetchNextPage,
11545
+ isFetchingNextPage: salesChannels.isFetchingNextPage,
11546
+ searchValue: salesChannels.searchValue,
11547
+ onSearchValueChange: salesChannels.onSearchValueChange,
11548
+ placeholder: "Select sales channel",
11549
+ ...field
11550
+ }
11551
+ ) }),
11552
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11553
+ ] });
11442
11554
  }
11443
11555
  }
11444
- });
11445
- return update;
11446
- }
11447
- function getHasUneditableRows(metadata) {
11448
- if (!metadata) {
11449
- return false;
11450
- }
11451
- return Object.values(metadata).some(
11452
- (value) => !EDITABLE_TYPES.includes(typeof value)
11453
11556
  );
11454
- }
11557
+ };
11558
+ const schema$2 = objectType({
11559
+ sales_channel_id: stringType().min(1)
11560
+ });
11455
11561
  const STACKED_FOCUS_MODAL_ID = "shipping-form";
11456
11562
  const Shipping = () => {
11457
11563
  var _a;
@@ -12259,112 +12365,6 @@ const CustomAmountField = ({
12259
12365
  }
12260
12366
  );
12261
12367
  };
12262
- const SalesChannel = () => {
12263
- const { id } = reactRouterDom.useParams();
12264
- const { draft_order, isPending, isError, error } = useDraftOrder(
12265
- id,
12266
- {
12267
- fields: "+sales_channel_id"
12268
- },
12269
- {
12270
- enabled: !!id
12271
- }
12272
- );
12273
- if (isError) {
12274
- throw error;
12275
- }
12276
- const ISrEADY = !!draft_order && !isPending;
12277
- return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
12278
- /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
12279
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Sales Channel" }) }),
12280
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Update which sales channel the draft order is associated with" }) })
12281
- ] }),
12282
- ISrEADY && /* @__PURE__ */ jsxRuntime.jsx(SalesChannelForm, { order: draft_order })
12283
- ] });
12284
- };
12285
- const SalesChannelForm = ({ order }) => {
12286
- const form = reactHookForm.useForm({
12287
- defaultValues: {
12288
- sales_channel_id: order.sales_channel_id || ""
12289
- },
12290
- resolver: zod.zodResolver(schema$2)
12291
- });
12292
- const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
12293
- const { handleSuccess } = useRouteModal();
12294
- const onSubmit = form.handleSubmit(async (data) => {
12295
- await mutateAsync(
12296
- {
12297
- sales_channel_id: data.sales_channel_id
12298
- },
12299
- {
12300
- onSuccess: () => {
12301
- ui.toast.success("Sales channel updated");
12302
- handleSuccess();
12303
- },
12304
- onError: (error) => {
12305
- ui.toast.error(error.message);
12306
- }
12307
- }
12308
- );
12309
- });
12310
- return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
12311
- KeyboundForm,
12312
- {
12313
- className: "flex flex-1 flex-col overflow-hidden",
12314
- onSubmit,
12315
- children: [
12316
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsx(SalesChannelField, { control: form.control, order }) }),
12317
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
12318
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
12319
- /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
12320
- ] }) })
12321
- ]
12322
- }
12323
- ) });
12324
- };
12325
- const SalesChannelField = ({ control, order }) => {
12326
- const salesChannels = useComboboxData({
12327
- queryFn: async (params) => {
12328
- return await sdk.admin.salesChannel.list(params);
12329
- },
12330
- queryKey: ["sales-channels"],
12331
- getOptions: (data) => {
12332
- return data.sales_channels.map((salesChannel) => ({
12333
- label: salesChannel.name,
12334
- value: salesChannel.id
12335
- }));
12336
- },
12337
- defaultValue: order.sales_channel_id || void 0
12338
- });
12339
- return /* @__PURE__ */ jsxRuntime.jsx(
12340
- Form$2.Field,
12341
- {
12342
- control,
12343
- name: "sales_channel_id",
12344
- render: ({ field }) => {
12345
- return /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12346
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Sales Channel" }),
12347
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
12348
- Combobox,
12349
- {
12350
- options: salesChannels.options,
12351
- fetchNextPage: salesChannels.fetchNextPage,
12352
- isFetchingNextPage: salesChannels.isFetchingNextPage,
12353
- searchValue: salesChannels.searchValue,
12354
- onSearchValueChange: salesChannels.onSearchValueChange,
12355
- placeholder: "Select sales channel",
12356
- ...field
12357
- }
12358
- ) }),
12359
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12360
- ] });
12361
- }
12362
- }
12363
- );
12364
- };
12365
- const schema$2 = objectType({
12366
- sales_channel_id: stringType().min(1)
12367
- });
12368
12368
  const ShippingAddress = () => {
12369
12369
  const { id } = reactRouterDom.useParams();
12370
12370
  const { order, isPending, isError, error } = useOrder(id, {
@@ -13072,30 +13072,30 @@ const routeModule = {
13072
13072
  Component: CustomItems,
13073
13073
  path: "/draft-orders/:id/custom-items"
13074
13074
  },
13075
- {
13076
- Component: Email,
13077
- path: "/draft-orders/:id/email"
13078
- },
13079
13075
  {
13080
13076
  Component: Items,
13081
13077
  path: "/draft-orders/:id/items"
13082
13078
  },
13083
- {
13084
- Component: Promotions,
13085
- path: "/draft-orders/:id/promotions"
13086
- },
13087
13079
  {
13088
13080
  Component: Metadata,
13089
13081
  path: "/draft-orders/:id/metadata"
13090
13082
  },
13091
13083
  {
13092
- Component: Shipping,
13093
- path: "/draft-orders/:id/shipping"
13084
+ Component: Email,
13085
+ path: "/draft-orders/:id/email"
13086
+ },
13087
+ {
13088
+ Component: Promotions,
13089
+ path: "/draft-orders/:id/promotions"
13094
13090
  },
13095
13091
  {
13096
13092
  Component: SalesChannel,
13097
13093
  path: "/draft-orders/:id/sales-channel"
13098
13094
  },
13095
+ {
13096
+ Component: Shipping,
13097
+ path: "/draft-orders/:id/shipping"
13098
+ },
13099
13099
  {
13100
13100
  Component: ShippingAddress,
13101
13101
  path: "/draft-orders/:id/shipping-address"