@medusajs/draft-order 2.11.4-preview-20251108180137 → 2.11.4-preview-20251109000311

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.
@@ -9779,6 +9779,74 @@ const CustomItemsForm = () => {
9779
9779
  const schema$4 = objectType({
9780
9780
  email: stringType().email()
9781
9781
  });
9782
+ const Email = () => {
9783
+ const { id } = reactRouterDom.useParams();
9784
+ const { order, isPending, isError, error } = useOrder(id, {
9785
+ fields: "+email"
9786
+ });
9787
+ if (isError) {
9788
+ throw error;
9789
+ }
9790
+ const isReady = !isPending && !!order;
9791
+ return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
9792
+ /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
9793
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Email" }) }),
9794
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit the email for the draft order" }) })
9795
+ ] }),
9796
+ isReady && /* @__PURE__ */ jsxRuntime.jsx(EmailForm, { order })
9797
+ ] });
9798
+ };
9799
+ const EmailForm = ({ order }) => {
9800
+ const form = reactHookForm.useForm({
9801
+ defaultValues: {
9802
+ email: order.email ?? ""
9803
+ },
9804
+ resolver: zod.zodResolver(schema$3)
9805
+ });
9806
+ const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
9807
+ const { handleSuccess } = useRouteModal();
9808
+ const onSubmit = form.handleSubmit(async (data) => {
9809
+ await mutateAsync(
9810
+ { email: data.email },
9811
+ {
9812
+ onSuccess: () => {
9813
+ handleSuccess();
9814
+ },
9815
+ onError: (error) => {
9816
+ ui.toast.error(error.message);
9817
+ }
9818
+ }
9819
+ );
9820
+ });
9821
+ return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
9822
+ KeyboundForm,
9823
+ {
9824
+ className: "flex flex-1 flex-col overflow-hidden",
9825
+ onSubmit,
9826
+ children: [
9827
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsx(
9828
+ Form$2.Field,
9829
+ {
9830
+ control: form.control,
9831
+ name: "email",
9832
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9833
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Email" }),
9834
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9835
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9836
+ ] })
9837
+ }
9838
+ ) }),
9839
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
9840
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
9841
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
9842
+ ] }) })
9843
+ ]
9844
+ }
9845
+ ) });
9846
+ };
9847
+ const schema$3 = objectType({
9848
+ email: stringType().email()
9849
+ });
9782
9850
  const NumberInput = React.forwardRef(
9783
9851
  ({
9784
9852
  value,
@@ -10753,527 +10821,109 @@ const customItemSchema = objectType({
10753
10821
  quantity: numberType(),
10754
10822
  unit_price: unionType([numberType(), stringType()])
10755
10823
  });
10756
- const InlineTip = React.forwardRef(
10757
- ({ variant = "tip", label, className, children, ...props }, ref) => {
10758
- const labelValue = label || (variant === "warning" ? "Warning" : "Tip");
10759
- return /* @__PURE__ */ jsxRuntime.jsxs(
10760
- "div",
10761
- {
10762
- ref,
10763
- className: ui.clx(
10764
- "bg-ui-bg-component txt-small text-ui-fg-subtle grid grid-cols-[4px_1fr] items-start gap-3 rounded-lg border p-3",
10765
- className
10766
- ),
10767
- ...props,
10768
- children: [
10769
- /* @__PURE__ */ jsxRuntime.jsx(
10770
- "div",
10771
- {
10772
- role: "presentation",
10773
- className: ui.clx("w-4px bg-ui-tag-neutral-icon h-full rounded-full", {
10774
- "bg-ui-tag-orange-icon": variant === "warning"
10775
- })
10776
- }
10777
- ),
10778
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-pretty", children: [
10779
- /* @__PURE__ */ jsxRuntime.jsxs("strong", { className: "txt-small-plus text-ui-fg-base", children: [
10780
- labelValue,
10781
- ":"
10782
- ] }),
10783
- " ",
10784
- children
10785
- ] })
10786
- ]
10787
- }
10788
- );
10789
- }
10790
- );
10791
- InlineTip.displayName = "InlineTip";
10792
- const MetadataFieldSchema = objectType({
10793
- key: stringType(),
10794
- disabled: booleanType().optional(),
10795
- value: anyType()
10796
- });
10797
- const MetadataSchema = objectType({
10798
- metadata: arrayType(MetadataFieldSchema)
10799
- });
10800
- const Metadata = () => {
10801
- const { id } = reactRouterDom.useParams();
10802
- const { order, isPending, isError, error } = useOrder(id, {
10803
- fields: "metadata"
10824
+ const PROMOTION_QUERY_KEY = "promotions";
10825
+ const promotionsQueryKeys = {
10826
+ list: (query2) => [
10827
+ PROMOTION_QUERY_KEY,
10828
+ query2 ? query2 : void 0
10829
+ ],
10830
+ detail: (id, query2) => [
10831
+ PROMOTION_QUERY_KEY,
10832
+ id,
10833
+ query2 ? query2 : void 0
10834
+ ]
10835
+ };
10836
+ const usePromotions = (query2, options) => {
10837
+ const { data, ...rest } = reactQuery.useQuery({
10838
+ queryKey: promotionsQueryKeys.list(query2),
10839
+ queryFn: async () => sdk.admin.promotion.list(query2),
10840
+ ...options
10804
10841
  });
10805
- if (isError) {
10806
- throw error;
10842
+ return { ...data, ...rest };
10843
+ };
10844
+ const Promotions = () => {
10845
+ const { id } = reactRouterDom.useParams();
10846
+ const {
10847
+ order: preview,
10848
+ isError: isPreviewError,
10849
+ error: previewError
10850
+ } = useOrderPreview(id, void 0);
10851
+ useInitiateOrderEdit({ preview });
10852
+ const { onCancel } = useCancelOrderEdit({ preview });
10853
+ if (isPreviewError) {
10854
+ throw previewError;
10807
10855
  }
10808
- const isReady = !isPending && !!order;
10809
- return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
10810
- /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
10811
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Metadata" }) }),
10812
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Add metadata to the draft order." }) })
10813
- ] }),
10814
- !isReady ? /* @__PURE__ */ jsxRuntime.jsx(PlaceholderInner, {}) : /* @__PURE__ */ jsxRuntime.jsx(MetadataForm, { orderId: id, metadata: order == null ? void 0 : order.metadata })
10856
+ const isReady = !!preview;
10857
+ return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { onClose: onCancel, children: [
10858
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Header, { children: /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Promotions" }) }) }),
10859
+ isReady && /* @__PURE__ */ jsxRuntime.jsx(PromotionForm, { preview })
10815
10860
  ] });
10816
10861
  };
10817
- const METADATA_KEY_LABEL_ID = "metadata-form-key-label";
10818
- const METADATA_VALUE_LABEL_ID = "metadata-form-value-label";
10819
- const MetadataForm = ({ orderId, metadata }) => {
10862
+ const PromotionForm = ({ preview }) => {
10863
+ const { items, shipping_methods } = preview;
10864
+ const [isSubmitting, setIsSubmitting] = React.useState(false);
10865
+ const [comboboxValue, setComboboxValue] = React.useState("");
10820
10866
  const { handleSuccess } = useRouteModal();
10821
- const hasUneditableRows = getHasUneditableRows(metadata);
10822
- const { mutateAsync, isPending } = useUpdateDraftOrder(orderId);
10823
- const form = reactHookForm.useForm({
10824
- defaultValues: {
10825
- metadata: getDefaultValues(metadata)
10867
+ const { mutateAsync: addPromotions, isPending: isAddingPromotions } = useDraftOrderAddPromotions(preview.id);
10868
+ const promoIds = getPromotionIds(items, shipping_methods);
10869
+ const { promotions, isPending, isError, error } = usePromotions(
10870
+ {
10871
+ id: promoIds
10826
10872
  },
10827
- resolver: zod.zodResolver(MetadataSchema)
10873
+ {
10874
+ enabled: !!promoIds.length
10875
+ }
10876
+ );
10877
+ const comboboxData = useComboboxData({
10878
+ queryKey: ["promotions", "combobox", promoIds],
10879
+ queryFn: async (params) => {
10880
+ return await sdk.admin.promotion.list({
10881
+ ...params,
10882
+ id: {
10883
+ $nin: promoIds
10884
+ }
10885
+ });
10886
+ },
10887
+ getOptions: (data) => {
10888
+ return data.promotions.map((promotion) => ({
10889
+ label: promotion.code,
10890
+ value: promotion.code
10891
+ }));
10892
+ }
10828
10893
  });
10829
- const handleSubmit = form.handleSubmit(async (data) => {
10830
- const parsedData = parseValues(data);
10831
- await mutateAsync(
10894
+ const add = async (value) => {
10895
+ if (!value) {
10896
+ return;
10897
+ }
10898
+ addPromotions(
10832
10899
  {
10833
- metadata: parsedData
10900
+ promo_codes: [value]
10834
10901
  },
10835
10902
  {
10836
- onSuccess: () => {
10837
- ui.toast.success("Metadata updated");
10838
- handleSuccess();
10903
+ onError: (e) => {
10904
+ ui.toast.error(e.message);
10905
+ comboboxData.onSearchValueChange("");
10906
+ setComboboxValue("");
10839
10907
  },
10840
- onError: (error) => {
10841
- ui.toast.error(error.message);
10908
+ onSuccess: () => {
10909
+ comboboxData.onSearchValueChange("");
10910
+ setComboboxValue("");
10842
10911
  }
10843
10912
  }
10844
10913
  );
10845
- });
10846
- const { fields, insert, remove } = reactHookForm.useFieldArray({
10847
- control: form.control,
10848
- name: "metadata"
10849
- });
10850
- function deleteRow(index) {
10851
- remove(index);
10852
- if (fields.length === 1) {
10853
- insert(0, {
10854
- key: "",
10855
- value: "",
10856
- disabled: false
10857
- });
10858
- }
10859
- }
10860
- function insertRow(index, position) {
10861
- insert(index + (position === "above" ? 0 : 1), {
10862
- key: "",
10863
- value: "",
10864
- disabled: false
10865
- });
10866
- }
10867
- return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
10868
- KeyboundForm,
10869
- {
10870
- onSubmit: handleSubmit,
10871
- className: "flex flex-1 flex-col overflow-hidden",
10872
- children: [
10873
- /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Body, { className: "flex flex-1 flex-col gap-y-8 overflow-y-auto", children: [
10874
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-ui-bg-base shadow-elevation-card-rest grid grid-cols-1 divide-y rounded-lg", children: [
10875
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-ui-bg-subtle grid grid-cols-2 divide-x rounded-t-lg", children: [
10876
- /* @__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" }) }),
10877
- /* @__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" }) })
10878
- ] }),
10879
- fields.map((field, index) => {
10880
- const isDisabled = field.disabled || false;
10881
- let placeholder = "-";
10882
- if (typeof field.value === "object") {
10883
- placeholder = "{ ... }";
10884
- }
10885
- if (Array.isArray(field.value)) {
10886
- placeholder = "[ ... ]";
10887
- }
10888
- return /* @__PURE__ */ jsxRuntime.jsx(
10889
- ConditionalTooltip,
10890
- {
10891
- showTooltip: isDisabled,
10892
- content: "This row is disabled because it contains non-primitive data.",
10893
- children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "group/table relative", children: [
10894
- /* @__PURE__ */ jsxRuntime.jsxs(
10895
- "div",
10896
- {
10897
- className: ui.clx("grid grid-cols-2 divide-x", {
10898
- "overflow-hidden rounded-b-lg": index === fields.length - 1
10899
- }),
10900
- children: [
10901
- /* @__PURE__ */ jsxRuntime.jsx(
10902
- Form$2.Field,
10903
- {
10904
- control: form.control,
10905
- name: `metadata.${index}.key`,
10906
- render: ({ field: field2 }) => {
10907
- return /* @__PURE__ */ jsxRuntime.jsx(Form$2.Item, { children: /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
10908
- GridInput,
10909
- {
10910
- "aria-labelledby": METADATA_KEY_LABEL_ID,
10911
- ...field2,
10912
- disabled: isDisabled,
10913
- placeholder: "Key"
10914
- }
10915
- ) }) });
10916
- }
10917
- }
10918
- ),
10919
- /* @__PURE__ */ jsxRuntime.jsx(
10920
- Form$2.Field,
10921
- {
10922
- control: form.control,
10923
- name: `metadata.${index}.value`,
10924
- render: ({ field: { value, ...field2 } }) => {
10925
- return /* @__PURE__ */ jsxRuntime.jsx(Form$2.Item, { children: /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
10926
- GridInput,
10927
- {
10928
- "aria-labelledby": METADATA_VALUE_LABEL_ID,
10929
- ...field2,
10930
- value: isDisabled ? placeholder : value,
10931
- disabled: isDisabled,
10932
- placeholder: "Value"
10933
- }
10934
- ) }) });
10935
- }
10936
- }
10937
- )
10938
- ]
10939
- }
10940
- ),
10941
- /* @__PURE__ */ jsxRuntime.jsxs(ui.DropdownMenu, { children: [
10942
- /* @__PURE__ */ jsxRuntime.jsx(
10943
- ui.DropdownMenu.Trigger,
10944
- {
10945
- className: ui.clx(
10946
- "invisible absolute inset-y-0 -right-2.5 my-auto group-hover/table:visible data-[state='open']:visible",
10947
- {
10948
- hidden: isDisabled
10949
- }
10950
- ),
10951
- disabled: isDisabled,
10952
- asChild: true,
10953
- children: /* @__PURE__ */ jsxRuntime.jsx(ui.IconButton, { size: "2xsmall", children: /* @__PURE__ */ jsxRuntime.jsx(icons.EllipsisVertical, {}) })
10954
- }
10955
- ),
10956
- /* @__PURE__ */ jsxRuntime.jsxs(ui.DropdownMenu.Content, { children: [
10957
- /* @__PURE__ */ jsxRuntime.jsxs(
10958
- ui.DropdownMenu.Item,
10959
- {
10960
- className: "gap-x-2",
10961
- onClick: () => insertRow(index, "above"),
10962
- children: [
10963
- /* @__PURE__ */ jsxRuntime.jsx(icons.ArrowUpMini, { className: "text-ui-fg-subtle" }),
10964
- "Insert row above"
10965
- ]
10966
- }
10967
- ),
10968
- /* @__PURE__ */ jsxRuntime.jsxs(
10969
- ui.DropdownMenu.Item,
10970
- {
10971
- className: "gap-x-2",
10972
- onClick: () => insertRow(index, "below"),
10973
- children: [
10974
- /* @__PURE__ */ jsxRuntime.jsx(icons.ArrowDownMini, { className: "text-ui-fg-subtle" }),
10975
- "Insert row below"
10976
- ]
10977
- }
10978
- ),
10979
- /* @__PURE__ */ jsxRuntime.jsx(ui.DropdownMenu.Separator, {}),
10980
- /* @__PURE__ */ jsxRuntime.jsxs(
10981
- ui.DropdownMenu.Item,
10982
- {
10983
- className: "gap-x-2",
10984
- onClick: () => deleteRow(index),
10985
- children: [
10986
- /* @__PURE__ */ jsxRuntime.jsx(icons.Trash, { className: "text-ui-fg-subtle" }),
10987
- "Delete row"
10988
- ]
10989
- }
10990
- )
10991
- ] })
10992
- ] })
10993
- ] })
10994
- },
10995
- field.id
10996
- );
10997
- })
10998
- ] }),
10999
- 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." })
11000
- ] }),
11001
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
11002
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", type: "button", children: "Cancel" }) }),
11003
- /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
11004
- ] }) })
11005
- ]
11006
- }
11007
- ) });
11008
- };
11009
- const GridInput = React.forwardRef(({ className, ...props }, ref) => {
11010
- return /* @__PURE__ */ jsxRuntime.jsx(
11011
- "input",
11012
- {
11013
- ref,
11014
- ...props,
11015
- autoComplete: "off",
11016
- className: ui.clx(
11017
- "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",
11018
- className
11019
- )
11020
- }
11021
- );
11022
- });
11023
- GridInput.displayName = "MetadataForm.GridInput";
11024
- const PlaceholderInner = () => {
11025
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-1 flex-col overflow-hidden", children: [
11026
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Skeleton, { className: "h-[148ox] w-full rounded-lg" }) }),
11027
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
11028
- /* @__PURE__ */ jsxRuntime.jsx(ui.Skeleton, { className: "h-7 w-12 rounded-md" }),
11029
- /* @__PURE__ */ jsxRuntime.jsx(ui.Skeleton, { className: "h-7 w-12 rounded-md" })
11030
- ] }) })
11031
- ] });
11032
- };
11033
- const EDITABLE_TYPES = ["string", "number", "boolean"];
11034
- function getDefaultValues(metadata) {
11035
- if (!metadata || !Object.keys(metadata).length) {
11036
- return [
11037
- {
11038
- key: "",
11039
- value: "",
11040
- disabled: false
11041
- }
11042
- ];
11043
- }
11044
- return Object.entries(metadata).map(([key, value]) => {
11045
- if (!EDITABLE_TYPES.includes(typeof value)) {
11046
- return {
11047
- key,
11048
- value,
11049
- disabled: true
11050
- };
11051
- }
11052
- let stringValue = value;
11053
- if (typeof value !== "string") {
11054
- stringValue = JSON.stringify(value);
11055
- }
11056
- return {
11057
- key,
11058
- value: stringValue,
11059
- original_key: key
11060
- };
11061
- });
11062
- }
11063
- function parseValues(values) {
11064
- const metadata = values.metadata;
11065
- const isEmpty = !metadata.length || metadata.length === 1 && !metadata[0].key && !metadata[0].value;
11066
- if (isEmpty) {
11067
- return null;
11068
- }
11069
- const update = {};
11070
- metadata.forEach((field) => {
11071
- let key = field.key;
11072
- let value = field.value;
11073
- const disabled = field.disabled;
11074
- if (!key || !value) {
11075
- return;
11076
- }
11077
- if (disabled) {
11078
- update[key] = value;
11079
- return;
11080
- }
11081
- key = key.trim();
11082
- value = value.trim();
11083
- if (value === "true") {
11084
- update[key] = true;
11085
- } else if (value === "false") {
11086
- update[key] = false;
11087
- } else {
11088
- const parsedNumber = parseFloat(value);
11089
- if (!isNaN(parsedNumber)) {
11090
- update[key] = parsedNumber;
11091
- } else {
11092
- update[key] = value;
11093
- }
11094
- }
11095
- });
11096
- return update;
11097
- }
11098
- function getHasUneditableRows(metadata) {
11099
- if (!metadata) {
11100
- return false;
11101
- }
11102
- return Object.values(metadata).some(
11103
- (value) => !EDITABLE_TYPES.includes(typeof value)
11104
- );
11105
- }
11106
- const Email = () => {
11107
- const { id } = reactRouterDom.useParams();
11108
- const { order, isPending, isError, error } = useOrder(id, {
11109
- fields: "+email"
11110
- });
11111
- if (isError) {
11112
- throw error;
11113
- }
11114
- const isReady = !isPending && !!order;
11115
- return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
11116
- /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
11117
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Email" }) }),
11118
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit the email for the draft order" }) })
11119
- ] }),
11120
- isReady && /* @__PURE__ */ jsxRuntime.jsx(EmailForm, { order })
11121
- ] });
11122
- };
11123
- const EmailForm = ({ order }) => {
11124
- const form = reactHookForm.useForm({
11125
- defaultValues: {
11126
- email: order.email ?? ""
11127
- },
11128
- resolver: zod.zodResolver(schema$3)
11129
- });
11130
- const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
11131
- const { handleSuccess } = useRouteModal();
11132
- const onSubmit = form.handleSubmit(async (data) => {
11133
- await mutateAsync(
11134
- { email: data.email },
11135
- {
11136
- onSuccess: () => {
11137
- handleSuccess();
11138
- },
11139
- onError: (error) => {
11140
- ui.toast.error(error.message);
11141
- }
11142
- }
11143
- );
11144
- });
11145
- return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
11146
- KeyboundForm,
11147
- {
11148
- className: "flex flex-1 flex-col overflow-hidden",
11149
- onSubmit,
11150
- children: [
11151
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsx(
11152
- Form$2.Field,
11153
- {
11154
- control: form.control,
11155
- name: "email",
11156
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11157
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Email" }),
11158
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11159
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11160
- ] })
11161
- }
11162
- ) }),
11163
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
11164
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
11165
- /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
11166
- ] }) })
11167
- ]
11168
- }
11169
- ) });
11170
- };
11171
- const schema$3 = objectType({
11172
- email: stringType().email()
11173
- });
11174
- const PROMOTION_QUERY_KEY = "promotions";
11175
- const promotionsQueryKeys = {
11176
- list: (query2) => [
11177
- PROMOTION_QUERY_KEY,
11178
- query2 ? query2 : void 0
11179
- ],
11180
- detail: (id, query2) => [
11181
- PROMOTION_QUERY_KEY,
11182
- id,
11183
- query2 ? query2 : void 0
11184
- ]
11185
- };
11186
- const usePromotions = (query2, options) => {
11187
- const { data, ...rest } = reactQuery.useQuery({
11188
- queryKey: promotionsQueryKeys.list(query2),
11189
- queryFn: async () => sdk.admin.promotion.list(query2),
11190
- ...options
11191
- });
11192
- return { ...data, ...rest };
11193
- };
11194
- const Promotions = () => {
11195
- const { id } = reactRouterDom.useParams();
11196
- const {
11197
- order: preview,
11198
- isError: isPreviewError,
11199
- error: previewError
11200
- } = useOrderPreview(id, void 0);
11201
- useInitiateOrderEdit({ preview });
11202
- const { onCancel } = useCancelOrderEdit({ preview });
11203
- if (isPreviewError) {
11204
- throw previewError;
11205
- }
11206
- const isReady = !!preview;
11207
- return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { onClose: onCancel, children: [
11208
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Header, { children: /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Promotions" }) }) }),
11209
- isReady && /* @__PURE__ */ jsxRuntime.jsx(PromotionForm, { preview })
11210
- ] });
11211
- };
11212
- const PromotionForm = ({ preview }) => {
11213
- const { items, shipping_methods } = preview;
11214
- const [isSubmitting, setIsSubmitting] = React.useState(false);
11215
- const [comboboxValue, setComboboxValue] = React.useState("");
11216
- const { handleSuccess } = useRouteModal();
11217
- const { mutateAsync: addPromotions, isPending: isAddingPromotions } = useDraftOrderAddPromotions(preview.id);
11218
- const promoIds = getPromotionIds(items, shipping_methods);
11219
- const { promotions, isPending, isError, error } = usePromotions(
11220
- {
11221
- id: promoIds
11222
- },
11223
- {
11224
- enabled: !!promoIds.length
11225
- }
11226
- );
11227
- const comboboxData = useComboboxData({
11228
- queryKey: ["promotions", "combobox", promoIds],
11229
- queryFn: async (params) => {
11230
- return await sdk.admin.promotion.list({
11231
- ...params,
11232
- id: {
11233
- $nin: promoIds
11234
- }
11235
- });
11236
- },
11237
- getOptions: (data) => {
11238
- return data.promotions.map((promotion) => ({
11239
- label: promotion.code,
11240
- value: promotion.code
11241
- }));
11242
- }
11243
- });
11244
- const add = async (value) => {
11245
- if (!value) {
11246
- return;
11247
- }
11248
- addPromotions(
11249
- {
11250
- promo_codes: [value]
11251
- },
11252
- {
11253
- onError: (e) => {
11254
- ui.toast.error(e.message);
11255
- comboboxData.onSearchValueChange("");
11256
- setComboboxValue("");
11257
- },
11258
- onSuccess: () => {
11259
- comboboxData.onSearchValueChange("");
11260
- setComboboxValue("");
11261
- }
11262
- }
11263
- );
11264
- };
11265
- const { mutateAsync: confirmOrderEdit } = useDraftOrderConfirmEdit(preview.id);
11266
- const { mutateAsync: requestOrderEdit } = useOrderEditRequest(preview.id);
11267
- const onSubmit = async () => {
11268
- setIsSubmitting(true);
11269
- let requestSucceeded = false;
11270
- await requestOrderEdit(void 0, {
11271
- onError: (e) => {
11272
- ui.toast.error(e.message);
11273
- },
11274
- onSuccess: () => {
11275
- requestSucceeded = true;
11276
- }
10914
+ };
10915
+ const { mutateAsync: confirmOrderEdit } = useDraftOrderConfirmEdit(preview.id);
10916
+ const { mutateAsync: requestOrderEdit } = useOrderEditRequest(preview.id);
10917
+ const onSubmit = async () => {
10918
+ setIsSubmitting(true);
10919
+ let requestSucceeded = false;
10920
+ await requestOrderEdit(void 0, {
10921
+ onError: (e) => {
10922
+ ui.toast.error(e.message);
10923
+ },
10924
+ onSuccess: () => {
10925
+ requestSucceeded = true;
10926
+ }
11277
10927
  });
11278
10928
  if (!requestSucceeded) {
11279
10929
  setIsSubmitting(false);
@@ -11360,93 +11010,443 @@ const PromotionItem = ({
11360
11010
  }
11361
11011
  }
11362
11012
  );
11363
- };
11364
- const displayValue = getDisplayValue(promotion);
11365
- return /* @__PURE__ */ jsxRuntime.jsxs(
11366
- "div",
11013
+ };
11014
+ const displayValue = getDisplayValue(promotion);
11015
+ return /* @__PURE__ */ jsxRuntime.jsxs(
11016
+ "div",
11017
+ {
11018
+ className: ui.clx(
11019
+ "bg-ui-bg-component shadow-elevation-card-rest flex items-center justify-between rounded-lg px-3 py-2",
11020
+ {
11021
+ "animate-pulse": isLoading
11022
+ }
11023
+ ),
11024
+ children: [
11025
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
11026
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", weight: "plus", leading: "compact", children: promotion.code }),
11027
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-ui-fg-subtle flex items-center gap-1.5", children: [
11028
+ displayValue && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1.5", children: [
11029
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", leading: "compact", children: displayValue }),
11030
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", leading: "compact", children: "·" })
11031
+ ] }),
11032
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", leading: "compact", className: "capitalize", children: (_a = promotion.application_method) == null ? void 0 : _a.allocation })
11033
+ ] })
11034
+ ] }),
11035
+ /* @__PURE__ */ jsxRuntime.jsx(
11036
+ ui.IconButton,
11037
+ {
11038
+ size: "small",
11039
+ type: "button",
11040
+ variant: "transparent",
11041
+ onClick: onRemove,
11042
+ isLoading: isPending || isLoading,
11043
+ children: /* @__PURE__ */ jsxRuntime.jsx(icons.XMark, {})
11044
+ }
11045
+ )
11046
+ ]
11047
+ },
11048
+ promotion.id
11049
+ );
11050
+ };
11051
+ function getDisplayValue(promotion) {
11052
+ var _a, _b, _c, _d;
11053
+ const value = (_a = promotion.application_method) == null ? void 0 : _a.value;
11054
+ if (!value) {
11055
+ return null;
11056
+ }
11057
+ if (((_b = promotion.application_method) == null ? void 0 : _b.type) === "fixed") {
11058
+ const currency = (_c = promotion.application_method) == null ? void 0 : _c.currency_code;
11059
+ if (!currency) {
11060
+ return null;
11061
+ }
11062
+ return getLocaleAmount(value, currency);
11063
+ } else if (((_d = promotion.application_method) == null ? void 0 : _d.type) === "percentage") {
11064
+ return formatPercentage(value);
11065
+ }
11066
+ return null;
11067
+ }
11068
+ const formatter = new Intl.NumberFormat([], {
11069
+ style: "percent",
11070
+ minimumFractionDigits: 2
11071
+ });
11072
+ const formatPercentage = (value, isPercentageValue = false) => {
11073
+ let val = value || 0;
11074
+ if (!isPercentageValue) {
11075
+ val = val / 100;
11076
+ }
11077
+ return formatter.format(val);
11078
+ };
11079
+ function getPromotionIds(items, shippingMethods) {
11080
+ const promotionIds = /* @__PURE__ */ new Set();
11081
+ for (const item of items) {
11082
+ if (item.adjustments) {
11083
+ for (const adjustment of item.adjustments) {
11084
+ if (adjustment.promotion_id) {
11085
+ promotionIds.add(adjustment.promotion_id);
11086
+ }
11087
+ }
11088
+ }
11089
+ }
11090
+ for (const shippingMethod of shippingMethods) {
11091
+ if (shippingMethod.adjustments) {
11092
+ for (const adjustment of shippingMethod.adjustments) {
11093
+ if (adjustment.promotion_id) {
11094
+ promotionIds.add(adjustment.promotion_id);
11095
+ }
11096
+ }
11097
+ }
11098
+ }
11099
+ return Array.from(promotionIds);
11100
+ }
11101
+ const InlineTip = React.forwardRef(
11102
+ ({ variant = "tip", label, className, children, ...props }, ref) => {
11103
+ const labelValue = label || (variant === "warning" ? "Warning" : "Tip");
11104
+ return /* @__PURE__ */ jsxRuntime.jsxs(
11105
+ "div",
11106
+ {
11107
+ ref,
11108
+ className: ui.clx(
11109
+ "bg-ui-bg-component txt-small text-ui-fg-subtle grid grid-cols-[4px_1fr] items-start gap-3 rounded-lg border p-3",
11110
+ className
11111
+ ),
11112
+ ...props,
11113
+ children: [
11114
+ /* @__PURE__ */ jsxRuntime.jsx(
11115
+ "div",
11116
+ {
11117
+ role: "presentation",
11118
+ className: ui.clx("w-4px bg-ui-tag-neutral-icon h-full rounded-full", {
11119
+ "bg-ui-tag-orange-icon": variant === "warning"
11120
+ })
11121
+ }
11122
+ ),
11123
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-pretty", children: [
11124
+ /* @__PURE__ */ jsxRuntime.jsxs("strong", { className: "txt-small-plus text-ui-fg-base", children: [
11125
+ labelValue,
11126
+ ":"
11127
+ ] }),
11128
+ " ",
11129
+ children
11130
+ ] })
11131
+ ]
11132
+ }
11133
+ );
11134
+ }
11135
+ );
11136
+ InlineTip.displayName = "InlineTip";
11137
+ const MetadataFieldSchema = objectType({
11138
+ key: stringType(),
11139
+ disabled: booleanType().optional(),
11140
+ value: anyType()
11141
+ });
11142
+ const MetadataSchema = objectType({
11143
+ metadata: arrayType(MetadataFieldSchema)
11144
+ });
11145
+ const Metadata = () => {
11146
+ const { id } = reactRouterDom.useParams();
11147
+ const { order, isPending, isError, error } = useOrder(id, {
11148
+ fields: "metadata"
11149
+ });
11150
+ if (isError) {
11151
+ throw error;
11152
+ }
11153
+ const isReady = !isPending && !!order;
11154
+ return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
11155
+ /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
11156
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Metadata" }) }),
11157
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Add metadata to the draft order." }) })
11158
+ ] }),
11159
+ !isReady ? /* @__PURE__ */ jsxRuntime.jsx(PlaceholderInner, {}) : /* @__PURE__ */ jsxRuntime.jsx(MetadataForm, { orderId: id, metadata: order == null ? void 0 : order.metadata })
11160
+ ] });
11161
+ };
11162
+ const METADATA_KEY_LABEL_ID = "metadata-form-key-label";
11163
+ const METADATA_VALUE_LABEL_ID = "metadata-form-value-label";
11164
+ const MetadataForm = ({ orderId, metadata }) => {
11165
+ const { handleSuccess } = useRouteModal();
11166
+ const hasUneditableRows = getHasUneditableRows(metadata);
11167
+ const { mutateAsync, isPending } = useUpdateDraftOrder(orderId);
11168
+ const form = reactHookForm.useForm({
11169
+ defaultValues: {
11170
+ metadata: getDefaultValues(metadata)
11171
+ },
11172
+ resolver: zod.zodResolver(MetadataSchema)
11173
+ });
11174
+ const handleSubmit = form.handleSubmit(async (data) => {
11175
+ const parsedData = parseValues(data);
11176
+ await mutateAsync(
11177
+ {
11178
+ metadata: parsedData
11179
+ },
11180
+ {
11181
+ onSuccess: () => {
11182
+ ui.toast.success("Metadata updated");
11183
+ handleSuccess();
11184
+ },
11185
+ onError: (error) => {
11186
+ ui.toast.error(error.message);
11187
+ }
11188
+ }
11189
+ );
11190
+ });
11191
+ const { fields, insert, remove } = reactHookForm.useFieldArray({
11192
+ control: form.control,
11193
+ name: "metadata"
11194
+ });
11195
+ function deleteRow(index) {
11196
+ remove(index);
11197
+ if (fields.length === 1) {
11198
+ insert(0, {
11199
+ key: "",
11200
+ value: "",
11201
+ disabled: false
11202
+ });
11203
+ }
11204
+ }
11205
+ function insertRow(index, position) {
11206
+ insert(index + (position === "above" ? 0 : 1), {
11207
+ key: "",
11208
+ value: "",
11209
+ disabled: false
11210
+ });
11211
+ }
11212
+ return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
11213
+ KeyboundForm,
11367
11214
  {
11368
- className: ui.clx(
11369
- "bg-ui-bg-component shadow-elevation-card-rest flex items-center justify-between rounded-lg px-3 py-2",
11370
- {
11371
- "animate-pulse": isLoading
11372
- }
11373
- ),
11215
+ onSubmit: handleSubmit,
11216
+ className: "flex flex-1 flex-col overflow-hidden",
11374
11217
  children: [
11375
- /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
11376
- /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", weight: "plus", leading: "compact", children: promotion.code }),
11377
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-ui-fg-subtle flex items-center gap-1.5", children: [
11378
- displayValue && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1.5", children: [
11379
- /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", leading: "compact", children: displayValue }),
11380
- /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", leading: "compact", children: "·" })
11218
+ /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Body, { className: "flex flex-1 flex-col gap-y-8 overflow-y-auto", children: [
11219
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-ui-bg-base shadow-elevation-card-rest grid grid-cols-1 divide-y rounded-lg", children: [
11220
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-ui-bg-subtle grid grid-cols-2 divide-x rounded-t-lg", children: [
11221
+ /* @__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" }) }),
11222
+ /* @__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" }) })
11381
11223
  ] }),
11382
- /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", leading: "compact", className: "capitalize", children: (_a = promotion.application_method) == null ? void 0 : _a.allocation })
11383
- ] })
11224
+ fields.map((field, index) => {
11225
+ const isDisabled = field.disabled || false;
11226
+ let placeholder = "-";
11227
+ if (typeof field.value === "object") {
11228
+ placeholder = "{ ... }";
11229
+ }
11230
+ if (Array.isArray(field.value)) {
11231
+ placeholder = "[ ... ]";
11232
+ }
11233
+ return /* @__PURE__ */ jsxRuntime.jsx(
11234
+ ConditionalTooltip,
11235
+ {
11236
+ showTooltip: isDisabled,
11237
+ content: "This row is disabled because it contains non-primitive data.",
11238
+ children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "group/table relative", children: [
11239
+ /* @__PURE__ */ jsxRuntime.jsxs(
11240
+ "div",
11241
+ {
11242
+ className: ui.clx("grid grid-cols-2 divide-x", {
11243
+ "overflow-hidden rounded-b-lg": index === fields.length - 1
11244
+ }),
11245
+ children: [
11246
+ /* @__PURE__ */ jsxRuntime.jsx(
11247
+ Form$2.Field,
11248
+ {
11249
+ control: form.control,
11250
+ name: `metadata.${index}.key`,
11251
+ render: ({ field: field2 }) => {
11252
+ return /* @__PURE__ */ jsxRuntime.jsx(Form$2.Item, { children: /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
11253
+ GridInput,
11254
+ {
11255
+ "aria-labelledby": METADATA_KEY_LABEL_ID,
11256
+ ...field2,
11257
+ disabled: isDisabled,
11258
+ placeholder: "Key"
11259
+ }
11260
+ ) }) });
11261
+ }
11262
+ }
11263
+ ),
11264
+ /* @__PURE__ */ jsxRuntime.jsx(
11265
+ Form$2.Field,
11266
+ {
11267
+ control: form.control,
11268
+ name: `metadata.${index}.value`,
11269
+ render: ({ field: { value, ...field2 } }) => {
11270
+ return /* @__PURE__ */ jsxRuntime.jsx(Form$2.Item, { children: /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
11271
+ GridInput,
11272
+ {
11273
+ "aria-labelledby": METADATA_VALUE_LABEL_ID,
11274
+ ...field2,
11275
+ value: isDisabled ? placeholder : value,
11276
+ disabled: isDisabled,
11277
+ placeholder: "Value"
11278
+ }
11279
+ ) }) });
11280
+ }
11281
+ }
11282
+ )
11283
+ ]
11284
+ }
11285
+ ),
11286
+ /* @__PURE__ */ jsxRuntime.jsxs(ui.DropdownMenu, { children: [
11287
+ /* @__PURE__ */ jsxRuntime.jsx(
11288
+ ui.DropdownMenu.Trigger,
11289
+ {
11290
+ className: ui.clx(
11291
+ "invisible absolute inset-y-0 -right-2.5 my-auto group-hover/table:visible data-[state='open']:visible",
11292
+ {
11293
+ hidden: isDisabled
11294
+ }
11295
+ ),
11296
+ disabled: isDisabled,
11297
+ asChild: true,
11298
+ children: /* @__PURE__ */ jsxRuntime.jsx(ui.IconButton, { size: "2xsmall", children: /* @__PURE__ */ jsxRuntime.jsx(icons.EllipsisVertical, {}) })
11299
+ }
11300
+ ),
11301
+ /* @__PURE__ */ jsxRuntime.jsxs(ui.DropdownMenu.Content, { children: [
11302
+ /* @__PURE__ */ jsxRuntime.jsxs(
11303
+ ui.DropdownMenu.Item,
11304
+ {
11305
+ className: "gap-x-2",
11306
+ onClick: () => insertRow(index, "above"),
11307
+ children: [
11308
+ /* @__PURE__ */ jsxRuntime.jsx(icons.ArrowUpMini, { className: "text-ui-fg-subtle" }),
11309
+ "Insert row above"
11310
+ ]
11311
+ }
11312
+ ),
11313
+ /* @__PURE__ */ jsxRuntime.jsxs(
11314
+ ui.DropdownMenu.Item,
11315
+ {
11316
+ className: "gap-x-2",
11317
+ onClick: () => insertRow(index, "below"),
11318
+ children: [
11319
+ /* @__PURE__ */ jsxRuntime.jsx(icons.ArrowDownMini, { className: "text-ui-fg-subtle" }),
11320
+ "Insert row below"
11321
+ ]
11322
+ }
11323
+ ),
11324
+ /* @__PURE__ */ jsxRuntime.jsx(ui.DropdownMenu.Separator, {}),
11325
+ /* @__PURE__ */ jsxRuntime.jsxs(
11326
+ ui.DropdownMenu.Item,
11327
+ {
11328
+ className: "gap-x-2",
11329
+ onClick: () => deleteRow(index),
11330
+ children: [
11331
+ /* @__PURE__ */ jsxRuntime.jsx(icons.Trash, { className: "text-ui-fg-subtle" }),
11332
+ "Delete row"
11333
+ ]
11334
+ }
11335
+ )
11336
+ ] })
11337
+ ] })
11338
+ ] })
11339
+ },
11340
+ field.id
11341
+ );
11342
+ })
11343
+ ] }),
11344
+ 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." })
11384
11345
  ] }),
11385
- /* @__PURE__ */ jsxRuntime.jsx(
11386
- ui.IconButton,
11387
- {
11388
- size: "small",
11389
- type: "button",
11390
- variant: "transparent",
11391
- onClick: onRemove,
11392
- isLoading: isPending || isLoading,
11393
- children: /* @__PURE__ */ jsxRuntime.jsx(icons.XMark, {})
11394
- }
11395
- )
11346
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
11347
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", type: "button", children: "Cancel" }) }),
11348
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
11349
+ ] }) })
11396
11350
  ]
11397
- },
11398
- promotion.id
11399
- );
11351
+ }
11352
+ ) });
11400
11353
  };
11401
- function getDisplayValue(promotion) {
11402
- var _a, _b, _c, _d;
11403
- const value = (_a = promotion.application_method) == null ? void 0 : _a.value;
11404
- if (!value) {
11405
- return null;
11406
- }
11407
- if (((_b = promotion.application_method) == null ? void 0 : _b.type) === "fixed") {
11408
- const currency = (_c = promotion.application_method) == null ? void 0 : _c.currency_code;
11409
- if (!currency) {
11410
- return null;
11354
+ const GridInput = React.forwardRef(({ className, ...props }, ref) => {
11355
+ return /* @__PURE__ */ jsxRuntime.jsx(
11356
+ "input",
11357
+ {
11358
+ ref,
11359
+ ...props,
11360
+ autoComplete: "off",
11361
+ className: ui.clx(
11362
+ "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",
11363
+ className
11364
+ )
11411
11365
  }
11412
- return getLocaleAmount(value, currency);
11413
- } else if (((_d = promotion.application_method) == null ? void 0 : _d.type) === "percentage") {
11414
- return formatPercentage(value);
11415
- }
11416
- return null;
11417
- }
11418
- const formatter = new Intl.NumberFormat([], {
11419
- style: "percent",
11420
- minimumFractionDigits: 2
11366
+ );
11421
11367
  });
11422
- const formatPercentage = (value, isPercentageValue = false) => {
11423
- let val = value || 0;
11424
- if (!isPercentageValue) {
11425
- val = val / 100;
11426
- }
11427
- return formatter.format(val);
11368
+ GridInput.displayName = "MetadataForm.GridInput";
11369
+ const PlaceholderInner = () => {
11370
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-1 flex-col overflow-hidden", children: [
11371
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Skeleton, { className: "h-[148ox] w-full rounded-lg" }) }),
11372
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
11373
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Skeleton, { className: "h-7 w-12 rounded-md" }),
11374
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Skeleton, { className: "h-7 w-12 rounded-md" })
11375
+ ] }) })
11376
+ ] });
11428
11377
  };
11429
- function getPromotionIds(items, shippingMethods) {
11430
- const promotionIds = /* @__PURE__ */ new Set();
11431
- for (const item of items) {
11432
- if (item.adjustments) {
11433
- for (const adjustment of item.adjustments) {
11434
- if (adjustment.promotion_id) {
11435
- promotionIds.add(adjustment.promotion_id);
11436
- }
11378
+ const EDITABLE_TYPES = ["string", "number", "boolean"];
11379
+ function getDefaultValues(metadata) {
11380
+ if (!metadata || !Object.keys(metadata).length) {
11381
+ return [
11382
+ {
11383
+ key: "",
11384
+ value: "",
11385
+ disabled: false
11437
11386
  }
11387
+ ];
11388
+ }
11389
+ return Object.entries(metadata).map(([key, value]) => {
11390
+ if (!EDITABLE_TYPES.includes(typeof value)) {
11391
+ return {
11392
+ key,
11393
+ value,
11394
+ disabled: true
11395
+ };
11396
+ }
11397
+ let stringValue = value;
11398
+ if (typeof value !== "string") {
11399
+ stringValue = JSON.stringify(value);
11438
11400
  }
11401
+ return {
11402
+ key,
11403
+ value: stringValue,
11404
+ original_key: key
11405
+ };
11406
+ });
11407
+ }
11408
+ function parseValues(values) {
11409
+ const metadata = values.metadata;
11410
+ const isEmpty = !metadata.length || metadata.length === 1 && !metadata[0].key && !metadata[0].value;
11411
+ if (isEmpty) {
11412
+ return null;
11439
11413
  }
11440
- for (const shippingMethod of shippingMethods) {
11441
- if (shippingMethod.adjustments) {
11442
- for (const adjustment of shippingMethod.adjustments) {
11443
- if (adjustment.promotion_id) {
11444
- promotionIds.add(adjustment.promotion_id);
11445
- }
11414
+ const update = {};
11415
+ metadata.forEach((field) => {
11416
+ let key = field.key;
11417
+ let value = field.value;
11418
+ const disabled = field.disabled;
11419
+ if (!key || !value) {
11420
+ return;
11421
+ }
11422
+ if (disabled) {
11423
+ update[key] = value;
11424
+ return;
11425
+ }
11426
+ key = key.trim();
11427
+ value = value.trim();
11428
+ if (value === "true") {
11429
+ update[key] = true;
11430
+ } else if (value === "false") {
11431
+ update[key] = false;
11432
+ } else {
11433
+ const parsedNumber = parseFloat(value);
11434
+ if (!isNaN(parsedNumber)) {
11435
+ update[key] = parsedNumber;
11436
+ } else {
11437
+ update[key] = value;
11446
11438
  }
11447
11439
  }
11440
+ });
11441
+ return update;
11442
+ }
11443
+ function getHasUneditableRows(metadata) {
11444
+ if (!metadata) {
11445
+ return false;
11448
11446
  }
11449
- return Array.from(promotionIds);
11447
+ return Object.values(metadata).some(
11448
+ (value) => !EDITABLE_TYPES.includes(typeof value)
11449
+ );
11450
11450
  }
11451
11451
  const SalesChannel = () => {
11452
11452
  const { id } = reactRouterDom.useParams();
@@ -12350,17 +12350,220 @@ const CustomAmountField = ({
12350
12350
  /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
12351
12351
  ui.CurrencyInput,
12352
12352
  {
12353
- ...field,
12354
- onValueChange: (value) => onChange(value),
12355
- symbol: getNativeSymbol(currencyCode),
12356
- code: currencyCode
12353
+ ...field,
12354
+ onValueChange: (value) => onChange(value),
12355
+ symbol: getNativeSymbol(currencyCode),
12356
+ code: currencyCode
12357
+ }
12358
+ ) })
12359
+ ] });
12360
+ }
12361
+ }
12362
+ );
12363
+ };
12364
+ const ShippingAddress = () => {
12365
+ const { id } = reactRouterDom.useParams();
12366
+ const { order, isPending, isError, error } = useOrder(id, {
12367
+ fields: "+shipping_address"
12368
+ });
12369
+ if (isError) {
12370
+ throw error;
12371
+ }
12372
+ const isReady = !isPending && !!order;
12373
+ return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
12374
+ /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
12375
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Shipping Address" }) }),
12376
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit the shipping address for the draft order" }) })
12377
+ ] }),
12378
+ isReady && /* @__PURE__ */ jsxRuntime.jsx(ShippingAddressForm, { order })
12379
+ ] });
12380
+ };
12381
+ const ShippingAddressForm = ({ order }) => {
12382
+ var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
12383
+ const form = reactHookForm.useForm({
12384
+ defaultValues: {
12385
+ first_name: ((_a = order.shipping_address) == null ? void 0 : _a.first_name) ?? "",
12386
+ last_name: ((_b = order.shipping_address) == null ? void 0 : _b.last_name) ?? "",
12387
+ company: ((_c = order.shipping_address) == null ? void 0 : _c.company) ?? "",
12388
+ address_1: ((_d = order.shipping_address) == null ? void 0 : _d.address_1) ?? "",
12389
+ address_2: ((_e = order.shipping_address) == null ? void 0 : _e.address_2) ?? "",
12390
+ city: ((_f = order.shipping_address) == null ? void 0 : _f.city) ?? "",
12391
+ province: ((_g = order.shipping_address) == null ? void 0 : _g.province) ?? "",
12392
+ country_code: ((_h = order.shipping_address) == null ? void 0 : _h.country_code) ?? "",
12393
+ postal_code: ((_i = order.shipping_address) == null ? void 0 : _i.postal_code) ?? "",
12394
+ phone: ((_j = order.shipping_address) == null ? void 0 : _j.phone) ?? ""
12395
+ },
12396
+ resolver: zod.zodResolver(schema$1)
12397
+ });
12398
+ const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
12399
+ const { handleSuccess } = useRouteModal();
12400
+ const onSubmit = form.handleSubmit(async (data) => {
12401
+ await mutateAsync(
12402
+ {
12403
+ shipping_address: {
12404
+ first_name: data.first_name,
12405
+ last_name: data.last_name,
12406
+ company: data.company,
12407
+ address_1: data.address_1,
12408
+ address_2: data.address_2,
12409
+ city: data.city,
12410
+ province: data.province,
12411
+ country_code: data.country_code,
12412
+ postal_code: data.postal_code,
12413
+ phone: data.phone
12414
+ }
12415
+ },
12416
+ {
12417
+ onSuccess: () => {
12418
+ handleSuccess();
12419
+ },
12420
+ onError: (error) => {
12421
+ ui.toast.error(error.message);
12422
+ }
12423
+ }
12424
+ );
12425
+ });
12426
+ return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
12427
+ KeyboundForm,
12428
+ {
12429
+ className: "flex flex-1 flex-col overflow-hidden",
12430
+ onSubmit,
12431
+ children: [
12432
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-y-4", children: [
12433
+ /* @__PURE__ */ jsxRuntime.jsx(
12434
+ Form$2.Field,
12435
+ {
12436
+ control: form.control,
12437
+ name: "country_code",
12438
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12439
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Country" }),
12440
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(CountrySelect, { ...field }) }),
12441
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12442
+ ] })
12443
+ }
12444
+ ),
12445
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
12446
+ /* @__PURE__ */ jsxRuntime.jsx(
12447
+ Form$2.Field,
12448
+ {
12449
+ control: form.control,
12450
+ name: "first_name",
12451
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12452
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "First name" }),
12453
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12454
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12455
+ ] })
12456
+ }
12457
+ ),
12458
+ /* @__PURE__ */ jsxRuntime.jsx(
12459
+ Form$2.Field,
12460
+ {
12461
+ control: form.control,
12462
+ name: "last_name",
12463
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12464
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Last name" }),
12465
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12466
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12467
+ ] })
12468
+ }
12469
+ )
12470
+ ] }),
12471
+ /* @__PURE__ */ jsxRuntime.jsx(
12472
+ Form$2.Field,
12473
+ {
12474
+ control: form.control,
12475
+ name: "company",
12476
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12477
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Company" }),
12478
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12479
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12480
+ ] })
12481
+ }
12482
+ ),
12483
+ /* @__PURE__ */ jsxRuntime.jsx(
12484
+ Form$2.Field,
12485
+ {
12486
+ control: form.control,
12487
+ name: "address_1",
12488
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12489
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Address" }),
12490
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12491
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12492
+ ] })
12493
+ }
12494
+ ),
12495
+ /* @__PURE__ */ jsxRuntime.jsx(
12496
+ Form$2.Field,
12497
+ {
12498
+ control: form.control,
12499
+ name: "address_2",
12500
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12501
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Apartment, suite, etc." }),
12502
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12503
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12504
+ ] })
12505
+ }
12506
+ ),
12507
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
12508
+ /* @__PURE__ */ jsxRuntime.jsx(
12509
+ Form$2.Field,
12510
+ {
12511
+ control: form.control,
12512
+ name: "postal_code",
12513
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12514
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Postal code" }),
12515
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12516
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12517
+ ] })
12518
+ }
12519
+ ),
12520
+ /* @__PURE__ */ jsxRuntime.jsx(
12521
+ Form$2.Field,
12522
+ {
12523
+ control: form.control,
12524
+ name: "city",
12525
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12526
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "City" }),
12527
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12528
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12529
+ ] })
12530
+ }
12531
+ )
12532
+ ] }),
12533
+ /* @__PURE__ */ jsxRuntime.jsx(
12534
+ Form$2.Field,
12535
+ {
12536
+ control: form.control,
12537
+ name: "province",
12538
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12539
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Province / State" }),
12540
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12541
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12542
+ ] })
12543
+ }
12544
+ ),
12545
+ /* @__PURE__ */ jsxRuntime.jsx(
12546
+ Form$2.Field,
12547
+ {
12548
+ control: form.control,
12549
+ name: "phone",
12550
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12551
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Phone" }),
12552
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12553
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12554
+ ] })
12357
12555
  }
12358
- ) })
12359
- ] });
12360
- }
12556
+ )
12557
+ ] }) }),
12558
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
12559
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
12560
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
12561
+ ] }) })
12562
+ ]
12361
12563
  }
12362
- );
12564
+ ) });
12363
12565
  };
12566
+ const schema$1 = addressSchema;
12364
12567
  const TransferOwnership = () => {
12365
12568
  const { id } = reactRouterDom.useParams();
12366
12569
  const { draft_order, isPending, isError, error } = useDraftOrder(id, {
@@ -12384,7 +12587,7 @@ const TransferOwnershipForm = ({ order }) => {
12384
12587
  defaultValues: {
12385
12588
  customer_id: order.customer_id || ""
12386
12589
  },
12387
- resolver: zod.zodResolver(schema$1)
12590
+ resolver: zod.zodResolver(schema)
12388
12591
  });
12389
12592
  const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
12390
12593
  const { handleSuccess } = useRouteModal();
@@ -12834,212 +13037,9 @@ const Illustration = () => {
12834
13037
  }
12835
13038
  );
12836
13039
  };
12837
- const schema$1 = objectType({
13040
+ const schema = objectType({
12838
13041
  customer_id: stringType().min(1)
12839
13042
  });
12840
- const ShippingAddress = () => {
12841
- const { id } = reactRouterDom.useParams();
12842
- const { order, isPending, isError, error } = useOrder(id, {
12843
- fields: "+shipping_address"
12844
- });
12845
- if (isError) {
12846
- throw error;
12847
- }
12848
- const isReady = !isPending && !!order;
12849
- return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
12850
- /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
12851
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Shipping Address" }) }),
12852
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit the shipping address for the draft order" }) })
12853
- ] }),
12854
- isReady && /* @__PURE__ */ jsxRuntime.jsx(ShippingAddressForm, { order })
12855
- ] });
12856
- };
12857
- const ShippingAddressForm = ({ order }) => {
12858
- var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
12859
- const form = reactHookForm.useForm({
12860
- defaultValues: {
12861
- first_name: ((_a = order.shipping_address) == null ? void 0 : _a.first_name) ?? "",
12862
- last_name: ((_b = order.shipping_address) == null ? void 0 : _b.last_name) ?? "",
12863
- company: ((_c = order.shipping_address) == null ? void 0 : _c.company) ?? "",
12864
- address_1: ((_d = order.shipping_address) == null ? void 0 : _d.address_1) ?? "",
12865
- address_2: ((_e = order.shipping_address) == null ? void 0 : _e.address_2) ?? "",
12866
- city: ((_f = order.shipping_address) == null ? void 0 : _f.city) ?? "",
12867
- province: ((_g = order.shipping_address) == null ? void 0 : _g.province) ?? "",
12868
- country_code: ((_h = order.shipping_address) == null ? void 0 : _h.country_code) ?? "",
12869
- postal_code: ((_i = order.shipping_address) == null ? void 0 : _i.postal_code) ?? "",
12870
- phone: ((_j = order.shipping_address) == null ? void 0 : _j.phone) ?? ""
12871
- },
12872
- resolver: zod.zodResolver(schema)
12873
- });
12874
- const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
12875
- const { handleSuccess } = useRouteModal();
12876
- const onSubmit = form.handleSubmit(async (data) => {
12877
- await mutateAsync(
12878
- {
12879
- shipping_address: {
12880
- first_name: data.first_name,
12881
- last_name: data.last_name,
12882
- company: data.company,
12883
- address_1: data.address_1,
12884
- address_2: data.address_2,
12885
- city: data.city,
12886
- province: data.province,
12887
- country_code: data.country_code,
12888
- postal_code: data.postal_code,
12889
- phone: data.phone
12890
- }
12891
- },
12892
- {
12893
- onSuccess: () => {
12894
- handleSuccess();
12895
- },
12896
- onError: (error) => {
12897
- ui.toast.error(error.message);
12898
- }
12899
- }
12900
- );
12901
- });
12902
- return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
12903
- KeyboundForm,
12904
- {
12905
- className: "flex flex-1 flex-col overflow-hidden",
12906
- onSubmit,
12907
- children: [
12908
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-y-4", children: [
12909
- /* @__PURE__ */ jsxRuntime.jsx(
12910
- Form$2.Field,
12911
- {
12912
- control: form.control,
12913
- name: "country_code",
12914
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12915
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Country" }),
12916
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(CountrySelect, { ...field }) }),
12917
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12918
- ] })
12919
- }
12920
- ),
12921
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
12922
- /* @__PURE__ */ jsxRuntime.jsx(
12923
- Form$2.Field,
12924
- {
12925
- control: form.control,
12926
- name: "first_name",
12927
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12928
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "First name" }),
12929
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12930
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12931
- ] })
12932
- }
12933
- ),
12934
- /* @__PURE__ */ jsxRuntime.jsx(
12935
- Form$2.Field,
12936
- {
12937
- control: form.control,
12938
- name: "last_name",
12939
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12940
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Last name" }),
12941
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12942
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12943
- ] })
12944
- }
12945
- )
12946
- ] }),
12947
- /* @__PURE__ */ jsxRuntime.jsx(
12948
- Form$2.Field,
12949
- {
12950
- control: form.control,
12951
- name: "company",
12952
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12953
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Company" }),
12954
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12955
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12956
- ] })
12957
- }
12958
- ),
12959
- /* @__PURE__ */ jsxRuntime.jsx(
12960
- Form$2.Field,
12961
- {
12962
- control: form.control,
12963
- name: "address_1",
12964
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12965
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Address" }),
12966
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12967
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12968
- ] })
12969
- }
12970
- ),
12971
- /* @__PURE__ */ jsxRuntime.jsx(
12972
- Form$2.Field,
12973
- {
12974
- control: form.control,
12975
- name: "address_2",
12976
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12977
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Apartment, suite, etc." }),
12978
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12979
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12980
- ] })
12981
- }
12982
- ),
12983
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
12984
- /* @__PURE__ */ jsxRuntime.jsx(
12985
- Form$2.Field,
12986
- {
12987
- control: form.control,
12988
- name: "postal_code",
12989
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12990
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Postal code" }),
12991
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12992
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12993
- ] })
12994
- }
12995
- ),
12996
- /* @__PURE__ */ jsxRuntime.jsx(
12997
- Form$2.Field,
12998
- {
12999
- control: form.control,
13000
- name: "city",
13001
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
13002
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "City" }),
13003
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
13004
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
13005
- ] })
13006
- }
13007
- )
13008
- ] }),
13009
- /* @__PURE__ */ jsxRuntime.jsx(
13010
- Form$2.Field,
13011
- {
13012
- control: form.control,
13013
- name: "province",
13014
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
13015
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Province / State" }),
13016
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
13017
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
13018
- ] })
13019
- }
13020
- ),
13021
- /* @__PURE__ */ jsxRuntime.jsx(
13022
- Form$2.Field,
13023
- {
13024
- control: form.control,
13025
- name: "phone",
13026
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
13027
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Phone" }),
13028
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
13029
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
13030
- ] })
13031
- }
13032
- )
13033
- ] }) }),
13034
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
13035
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
13036
- /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
13037
- ] }) })
13038
- ]
13039
- }
13040
- ) });
13041
- };
13042
- const schema = addressSchema;
13043
13043
  const widgetModule = { widgets: [] };
13044
13044
  const routeModule = {
13045
13045
  routes: [
@@ -13068,22 +13068,22 @@ const routeModule = {
13068
13068
  Component: CustomItems,
13069
13069
  path: "/draft-orders/:id/custom-items"
13070
13070
  },
13071
- {
13072
- Component: Items,
13073
- path: "/draft-orders/:id/items"
13074
- },
13075
- {
13076
- Component: Metadata,
13077
- path: "/draft-orders/:id/metadata"
13078
- },
13079
13071
  {
13080
13072
  Component: Email,
13081
13073
  path: "/draft-orders/:id/email"
13082
13074
  },
13075
+ {
13076
+ Component: Items,
13077
+ path: "/draft-orders/:id/items"
13078
+ },
13083
13079
  {
13084
13080
  Component: Promotions,
13085
13081
  path: "/draft-orders/:id/promotions"
13086
13082
  },
13083
+ {
13084
+ Component: Metadata,
13085
+ path: "/draft-orders/:id/metadata"
13086
+ },
13087
13087
  {
13088
13088
  Component: SalesChannel,
13089
13089
  path: "/draft-orders/:id/sales-channel"
@@ -13092,13 +13092,13 @@ const routeModule = {
13092
13092
  Component: Shipping,
13093
13093
  path: "/draft-orders/:id/shipping"
13094
13094
  },
13095
- {
13096
- Component: TransferOwnership,
13097
- path: "/draft-orders/:id/transfer-ownership"
13098
- },
13099
13095
  {
13100
13096
  Component: ShippingAddress,
13101
13097
  path: "/draft-orders/:id/shipping-address"
13098
+ },
13099
+ {
13100
+ Component: TransferOwnership,
13101
+ path: "/draft-orders/:id/transfer-ownership"
13102
13102
  }
13103
13103
  ]
13104
13104
  }