@medusajs/draft-order 2.11.2-preview-20251028031854 → 2.11.2-preview-20251028090156

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.
@@ -10818,6 +10818,356 @@ const customItemSchema = objectType({
10818
10818
  quantity: numberType(),
10819
10819
  unit_price: unionType([numberType(), stringType()])
10820
10820
  });
10821
+ const InlineTip = forwardRef(
10822
+ ({ variant = "tip", label, className, children, ...props }, ref) => {
10823
+ const labelValue = label || (variant === "warning" ? "Warning" : "Tip");
10824
+ return /* @__PURE__ */ jsxs(
10825
+ "div",
10826
+ {
10827
+ ref,
10828
+ className: clx(
10829
+ "bg-ui-bg-component txt-small text-ui-fg-subtle grid grid-cols-[4px_1fr] items-start gap-3 rounded-lg border p-3",
10830
+ className
10831
+ ),
10832
+ ...props,
10833
+ children: [
10834
+ /* @__PURE__ */ jsx(
10835
+ "div",
10836
+ {
10837
+ role: "presentation",
10838
+ className: clx("w-4px bg-ui-tag-neutral-icon h-full rounded-full", {
10839
+ "bg-ui-tag-orange-icon": variant === "warning"
10840
+ })
10841
+ }
10842
+ ),
10843
+ /* @__PURE__ */ jsxs("div", { className: "text-pretty", children: [
10844
+ /* @__PURE__ */ jsxs("strong", { className: "txt-small-plus text-ui-fg-base", children: [
10845
+ labelValue,
10846
+ ":"
10847
+ ] }),
10848
+ " ",
10849
+ children
10850
+ ] })
10851
+ ]
10852
+ }
10853
+ );
10854
+ }
10855
+ );
10856
+ InlineTip.displayName = "InlineTip";
10857
+ const MetadataFieldSchema = objectType({
10858
+ key: stringType(),
10859
+ disabled: booleanType().optional(),
10860
+ value: anyType()
10861
+ });
10862
+ const MetadataSchema = objectType({
10863
+ metadata: arrayType(MetadataFieldSchema)
10864
+ });
10865
+ const Metadata = () => {
10866
+ const { id } = useParams();
10867
+ const { order, isPending, isError, error } = useOrder(id, {
10868
+ fields: "metadata"
10869
+ });
10870
+ if (isError) {
10871
+ throw error;
10872
+ }
10873
+ const isReady = !isPending && !!order;
10874
+ return /* @__PURE__ */ jsxs(RouteDrawer, { children: [
10875
+ /* @__PURE__ */ jsxs(RouteDrawer.Header, { children: [
10876
+ /* @__PURE__ */ jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Metadata" }) }),
10877
+ /* @__PURE__ */ jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Add metadata to the draft order." }) })
10878
+ ] }),
10879
+ !isReady ? /* @__PURE__ */ jsx(PlaceholderInner, {}) : /* @__PURE__ */ jsx(MetadataForm, { orderId: id, metadata: order == null ? void 0 : order.metadata })
10880
+ ] });
10881
+ };
10882
+ const METADATA_KEY_LABEL_ID = "metadata-form-key-label";
10883
+ const METADATA_VALUE_LABEL_ID = "metadata-form-value-label";
10884
+ const MetadataForm = ({ orderId, metadata }) => {
10885
+ const { handleSuccess } = useRouteModal();
10886
+ const hasUneditableRows = getHasUneditableRows(metadata);
10887
+ const { mutateAsync, isPending } = useUpdateDraftOrder(orderId);
10888
+ const form = useForm({
10889
+ defaultValues: {
10890
+ metadata: getDefaultValues(metadata)
10891
+ },
10892
+ resolver: zodResolver(MetadataSchema)
10893
+ });
10894
+ const handleSubmit = form.handleSubmit(async (data) => {
10895
+ const parsedData = parseValues(data);
10896
+ await mutateAsync(
10897
+ {
10898
+ metadata: parsedData
10899
+ },
10900
+ {
10901
+ onSuccess: () => {
10902
+ toast.success("Metadata updated");
10903
+ handleSuccess();
10904
+ },
10905
+ onError: (error) => {
10906
+ toast.error(error.message);
10907
+ }
10908
+ }
10909
+ );
10910
+ });
10911
+ const { fields, insert, remove } = useFieldArray({
10912
+ control: form.control,
10913
+ name: "metadata"
10914
+ });
10915
+ function deleteRow(index) {
10916
+ remove(index);
10917
+ if (fields.length === 1) {
10918
+ insert(0, {
10919
+ key: "",
10920
+ value: "",
10921
+ disabled: false
10922
+ });
10923
+ }
10924
+ }
10925
+ function insertRow(index, position) {
10926
+ insert(index + (position === "above" ? 0 : 1), {
10927
+ key: "",
10928
+ value: "",
10929
+ disabled: false
10930
+ });
10931
+ }
10932
+ return /* @__PURE__ */ jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxs(
10933
+ KeyboundForm,
10934
+ {
10935
+ onSubmit: handleSubmit,
10936
+ className: "flex flex-1 flex-col overflow-hidden",
10937
+ children: [
10938
+ /* @__PURE__ */ jsxs(RouteDrawer.Body, { className: "flex flex-1 flex-col gap-y-8 overflow-y-auto", children: [
10939
+ /* @__PURE__ */ jsxs("div", { className: "bg-ui-bg-base shadow-elevation-card-rest grid grid-cols-1 divide-y rounded-lg", children: [
10940
+ /* @__PURE__ */ jsxs("div", { className: "bg-ui-bg-subtle grid grid-cols-2 divide-x rounded-t-lg", children: [
10941
+ /* @__PURE__ */ jsx("div", { className: "txt-compact-small-plus text-ui-fg-subtle px-2 py-1.5", children: /* @__PURE__ */ jsx("label", { id: METADATA_KEY_LABEL_ID, children: "Key" }) }),
10942
+ /* @__PURE__ */ jsx("div", { className: "txt-compact-small-plus text-ui-fg-subtle px-2 py-1.5", children: /* @__PURE__ */ jsx("label", { id: METADATA_VALUE_LABEL_ID, children: "Value" }) })
10943
+ ] }),
10944
+ fields.map((field, index) => {
10945
+ const isDisabled = field.disabled || false;
10946
+ let placeholder = "-";
10947
+ if (typeof field.value === "object") {
10948
+ placeholder = "{ ... }";
10949
+ }
10950
+ if (Array.isArray(field.value)) {
10951
+ placeholder = "[ ... ]";
10952
+ }
10953
+ return /* @__PURE__ */ jsx(
10954
+ ConditionalTooltip,
10955
+ {
10956
+ showTooltip: isDisabled,
10957
+ content: "This row is disabled because it contains non-primitive data.",
10958
+ children: /* @__PURE__ */ jsxs("div", { className: "group/table relative", children: [
10959
+ /* @__PURE__ */ jsxs(
10960
+ "div",
10961
+ {
10962
+ className: clx("grid grid-cols-2 divide-x", {
10963
+ "overflow-hidden rounded-b-lg": index === fields.length - 1
10964
+ }),
10965
+ children: [
10966
+ /* @__PURE__ */ jsx(
10967
+ Form$2.Field,
10968
+ {
10969
+ control: form.control,
10970
+ name: `metadata.${index}.key`,
10971
+ render: ({ field: field2 }) => {
10972
+ return /* @__PURE__ */ jsx(Form$2.Item, { children: /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(
10973
+ GridInput,
10974
+ {
10975
+ "aria-labelledby": METADATA_KEY_LABEL_ID,
10976
+ ...field2,
10977
+ disabled: isDisabled,
10978
+ placeholder: "Key"
10979
+ }
10980
+ ) }) });
10981
+ }
10982
+ }
10983
+ ),
10984
+ /* @__PURE__ */ jsx(
10985
+ Form$2.Field,
10986
+ {
10987
+ control: form.control,
10988
+ name: `metadata.${index}.value`,
10989
+ render: ({ field: { value, ...field2 } }) => {
10990
+ return /* @__PURE__ */ jsx(Form$2.Item, { children: /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(
10991
+ GridInput,
10992
+ {
10993
+ "aria-labelledby": METADATA_VALUE_LABEL_ID,
10994
+ ...field2,
10995
+ value: isDisabled ? placeholder : value,
10996
+ disabled: isDisabled,
10997
+ placeholder: "Value"
10998
+ }
10999
+ ) }) });
11000
+ }
11001
+ }
11002
+ )
11003
+ ]
11004
+ }
11005
+ ),
11006
+ /* @__PURE__ */ jsxs(DropdownMenu, { children: [
11007
+ /* @__PURE__ */ jsx(
11008
+ DropdownMenu.Trigger,
11009
+ {
11010
+ className: clx(
11011
+ "invisible absolute inset-y-0 -right-2.5 my-auto group-hover/table:visible data-[state='open']:visible",
11012
+ {
11013
+ hidden: isDisabled
11014
+ }
11015
+ ),
11016
+ disabled: isDisabled,
11017
+ asChild: true,
11018
+ children: /* @__PURE__ */ jsx(IconButton, { size: "2xsmall", children: /* @__PURE__ */ jsx(EllipsisVertical, {}) })
11019
+ }
11020
+ ),
11021
+ /* @__PURE__ */ jsxs(DropdownMenu.Content, { children: [
11022
+ /* @__PURE__ */ jsxs(
11023
+ DropdownMenu.Item,
11024
+ {
11025
+ className: "gap-x-2",
11026
+ onClick: () => insertRow(index, "above"),
11027
+ children: [
11028
+ /* @__PURE__ */ jsx(ArrowUpMini, { className: "text-ui-fg-subtle" }),
11029
+ "Insert row above"
11030
+ ]
11031
+ }
11032
+ ),
11033
+ /* @__PURE__ */ jsxs(
11034
+ DropdownMenu.Item,
11035
+ {
11036
+ className: "gap-x-2",
11037
+ onClick: () => insertRow(index, "below"),
11038
+ children: [
11039
+ /* @__PURE__ */ jsx(ArrowDownMini, { className: "text-ui-fg-subtle" }),
11040
+ "Insert row below"
11041
+ ]
11042
+ }
11043
+ ),
11044
+ /* @__PURE__ */ jsx(DropdownMenu.Separator, {}),
11045
+ /* @__PURE__ */ jsxs(
11046
+ DropdownMenu.Item,
11047
+ {
11048
+ className: "gap-x-2",
11049
+ onClick: () => deleteRow(index),
11050
+ children: [
11051
+ /* @__PURE__ */ jsx(Trash, { className: "text-ui-fg-subtle" }),
11052
+ "Delete row"
11053
+ ]
11054
+ }
11055
+ )
11056
+ ] })
11057
+ ] })
11058
+ ] })
11059
+ },
11060
+ field.id
11061
+ );
11062
+ })
11063
+ ] }),
11064
+ hasUneditableRows && /* @__PURE__ */ 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." })
11065
+ ] }),
11066
+ /* @__PURE__ */ jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
11067
+ /* @__PURE__ */ jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", type: "button", children: "Cancel" }) }),
11068
+ /* @__PURE__ */ jsx(Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
11069
+ ] }) })
11070
+ ]
11071
+ }
11072
+ ) });
11073
+ };
11074
+ const GridInput = forwardRef(({ className, ...props }, ref) => {
11075
+ return /* @__PURE__ */ jsx(
11076
+ "input",
11077
+ {
11078
+ ref,
11079
+ ...props,
11080
+ autoComplete: "off",
11081
+ className: clx(
11082
+ "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",
11083
+ className
11084
+ )
11085
+ }
11086
+ );
11087
+ });
11088
+ GridInput.displayName = "MetadataForm.GridInput";
11089
+ const PlaceholderInner = () => {
11090
+ return /* @__PURE__ */ jsxs("div", { className: "flex flex-1 flex-col overflow-hidden", children: [
11091
+ /* @__PURE__ */ jsx(RouteDrawer.Body, { children: /* @__PURE__ */ jsx(Skeleton, { className: "h-[148ox] w-full rounded-lg" }) }),
11092
+ /* @__PURE__ */ jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
11093
+ /* @__PURE__ */ jsx(Skeleton, { className: "h-7 w-12 rounded-md" }),
11094
+ /* @__PURE__ */ jsx(Skeleton, { className: "h-7 w-12 rounded-md" })
11095
+ ] }) })
11096
+ ] });
11097
+ };
11098
+ const EDITABLE_TYPES = ["string", "number", "boolean"];
11099
+ function getDefaultValues(metadata) {
11100
+ if (!metadata || !Object.keys(metadata).length) {
11101
+ return [
11102
+ {
11103
+ key: "",
11104
+ value: "",
11105
+ disabled: false
11106
+ }
11107
+ ];
11108
+ }
11109
+ return Object.entries(metadata).map(([key, value]) => {
11110
+ if (!EDITABLE_TYPES.includes(typeof value)) {
11111
+ return {
11112
+ key,
11113
+ value,
11114
+ disabled: true
11115
+ };
11116
+ }
11117
+ let stringValue = value;
11118
+ if (typeof value !== "string") {
11119
+ stringValue = JSON.stringify(value);
11120
+ }
11121
+ return {
11122
+ key,
11123
+ value: stringValue,
11124
+ original_key: key
11125
+ };
11126
+ });
11127
+ }
11128
+ function parseValues(values) {
11129
+ const metadata = values.metadata;
11130
+ const isEmpty = !metadata.length || metadata.length === 1 && !metadata[0].key && !metadata[0].value;
11131
+ if (isEmpty) {
11132
+ return null;
11133
+ }
11134
+ const update = {};
11135
+ metadata.forEach((field) => {
11136
+ let key = field.key;
11137
+ let value = field.value;
11138
+ const disabled = field.disabled;
11139
+ if (!key || !value) {
11140
+ return;
11141
+ }
11142
+ if (disabled) {
11143
+ update[key] = value;
11144
+ return;
11145
+ }
11146
+ key = key.trim();
11147
+ value = value.trim();
11148
+ if (value === "true") {
11149
+ update[key] = true;
11150
+ } else if (value === "false") {
11151
+ update[key] = false;
11152
+ } else {
11153
+ const parsedNumber = parseFloat(value);
11154
+ if (!isNaN(parsedNumber)) {
11155
+ update[key] = parsedNumber;
11156
+ } else {
11157
+ update[key] = value;
11158
+ }
11159
+ }
11160
+ });
11161
+ return update;
11162
+ }
11163
+ function getHasUneditableRows(metadata) {
11164
+ if (!metadata) {
11165
+ return false;
11166
+ }
11167
+ return Object.values(metadata).some(
11168
+ (value) => !EDITABLE_TYPES.includes(typeof value)
11169
+ );
11170
+ }
10821
11171
  const PROMOTION_QUERY_KEY = "promotions";
10822
11172
  const promotionsQueryKeys = {
10823
11173
  list: (query2) => [
@@ -11095,88 +11445,46 @@ function getPromotionIds(items, shippingMethods) {
11095
11445
  }
11096
11446
  return Array.from(promotionIds);
11097
11447
  }
11098
- const InlineTip = forwardRef(
11099
- ({ variant = "tip", label, className, children, ...props }, ref) => {
11100
- const labelValue = label || (variant === "warning" ? "Warning" : "Tip");
11101
- return /* @__PURE__ */ jsxs(
11102
- "div",
11103
- {
11104
- ref,
11105
- className: clx(
11106
- "bg-ui-bg-component txt-small text-ui-fg-subtle grid grid-cols-[4px_1fr] items-start gap-3 rounded-lg border p-3",
11107
- className
11108
- ),
11109
- ...props,
11110
- children: [
11111
- /* @__PURE__ */ jsx(
11112
- "div",
11113
- {
11114
- role: "presentation",
11115
- className: clx("w-4px bg-ui-tag-neutral-icon h-full rounded-full", {
11116
- "bg-ui-tag-orange-icon": variant === "warning"
11117
- })
11118
- }
11119
- ),
11120
- /* @__PURE__ */ jsxs("div", { className: "text-pretty", children: [
11121
- /* @__PURE__ */ jsxs("strong", { className: "txt-small-plus text-ui-fg-base", children: [
11122
- labelValue,
11123
- ":"
11124
- ] }),
11125
- " ",
11126
- children
11127
- ] })
11128
- ]
11129
- }
11130
- );
11131
- }
11132
- );
11133
- InlineTip.displayName = "InlineTip";
11134
- const MetadataFieldSchema = objectType({
11135
- key: stringType(),
11136
- disabled: booleanType().optional(),
11137
- value: anyType()
11138
- });
11139
- const MetadataSchema = objectType({
11140
- metadata: arrayType(MetadataFieldSchema)
11141
- });
11142
- const Metadata = () => {
11448
+ const SalesChannel = () => {
11143
11449
  const { id } = useParams();
11144
- const { order, isPending, isError, error } = useOrder(id, {
11145
- fields: "metadata"
11146
- });
11450
+ const { draft_order, isPending, isError, error } = useDraftOrder(
11451
+ id,
11452
+ {
11453
+ fields: "+sales_channel_id"
11454
+ },
11455
+ {
11456
+ enabled: !!id
11457
+ }
11458
+ );
11147
11459
  if (isError) {
11148
11460
  throw error;
11149
11461
  }
11150
- const isReady = !isPending && !!order;
11462
+ const ISrEADY = !!draft_order && !isPending;
11151
11463
  return /* @__PURE__ */ jsxs(RouteDrawer, { children: [
11152
11464
  /* @__PURE__ */ jsxs(RouteDrawer.Header, { children: [
11153
- /* @__PURE__ */ jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Metadata" }) }),
11154
- /* @__PURE__ */ jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Add metadata to the draft order." }) })
11465
+ /* @__PURE__ */ jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Edit Sales Channel" }) }),
11466
+ /* @__PURE__ */ jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Update which sales channel the draft order is associated with" }) })
11155
11467
  ] }),
11156
- !isReady ? /* @__PURE__ */ jsx(PlaceholderInner, {}) : /* @__PURE__ */ jsx(MetadataForm, { orderId: id, metadata: order == null ? void 0 : order.metadata })
11468
+ ISrEADY && /* @__PURE__ */ jsx(SalesChannelForm, { order: draft_order })
11157
11469
  ] });
11158
11470
  };
11159
- const METADATA_KEY_LABEL_ID = "metadata-form-key-label";
11160
- const METADATA_VALUE_LABEL_ID = "metadata-form-value-label";
11161
- const MetadataForm = ({ orderId, metadata }) => {
11162
- const { handleSuccess } = useRouteModal();
11163
- const hasUneditableRows = getHasUneditableRows(metadata);
11164
- const { mutateAsync, isPending } = useUpdateDraftOrder(orderId);
11471
+ const SalesChannelForm = ({ order }) => {
11165
11472
  const form = useForm({
11166
11473
  defaultValues: {
11167
- metadata: getDefaultValues(metadata)
11474
+ sales_channel_id: order.sales_channel_id || ""
11168
11475
  },
11169
- resolver: zodResolver(MetadataSchema)
11476
+ resolver: zodResolver(schema$2)
11170
11477
  });
11171
- const handleSubmit = form.handleSubmit(async (data) => {
11172
- const parsedData = parseValues(data);
11478
+ const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
11479
+ const { handleSuccess } = useRouteModal();
11480
+ const onSubmit = form.handleSubmit(async (data) => {
11173
11481
  await mutateAsync(
11174
11482
  {
11175
- metadata: parsedData
11483
+ sales_channel_id: data.sales_channel_id
11176
11484
  },
11177
11485
  {
11178
11486
  onSuccess: () => {
11179
- toast.success("Metadata updated");
11487
+ toast.success("Sales channel updated");
11180
11488
  handleSuccess();
11181
11489
  },
11182
11490
  onError: (error) => {
@@ -11185,266 +11493,64 @@ const MetadataForm = ({ orderId, metadata }) => {
11185
11493
  }
11186
11494
  );
11187
11495
  });
11188
- const { fields, insert, remove } = useFieldArray({
11189
- control: form.control,
11190
- name: "metadata"
11191
- });
11192
- function deleteRow(index) {
11193
- remove(index);
11194
- if (fields.length === 1) {
11195
- insert(0, {
11196
- key: "",
11197
- value: "",
11198
- disabled: false
11199
- });
11200
- }
11201
- }
11202
- function insertRow(index, position) {
11203
- insert(index + (position === "above" ? 0 : 1), {
11204
- key: "",
11205
- value: "",
11206
- disabled: false
11207
- });
11208
- }
11209
11496
  return /* @__PURE__ */ jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxs(
11210
11497
  KeyboundForm,
11211
11498
  {
11212
- onSubmit: handleSubmit,
11213
11499
  className: "flex flex-1 flex-col overflow-hidden",
11214
- children: [
11215
- /* @__PURE__ */ jsxs(RouteDrawer.Body, { className: "flex flex-1 flex-col gap-y-8 overflow-y-auto", children: [
11216
- /* @__PURE__ */ jsxs("div", { className: "bg-ui-bg-base shadow-elevation-card-rest grid grid-cols-1 divide-y rounded-lg", children: [
11217
- /* @__PURE__ */ jsxs("div", { className: "bg-ui-bg-subtle grid grid-cols-2 divide-x rounded-t-lg", children: [
11218
- /* @__PURE__ */ jsx("div", { className: "txt-compact-small-plus text-ui-fg-subtle px-2 py-1.5", children: /* @__PURE__ */ jsx("label", { id: METADATA_KEY_LABEL_ID, children: "Key" }) }),
11219
- /* @__PURE__ */ jsx("div", { className: "txt-compact-small-plus text-ui-fg-subtle px-2 py-1.5", children: /* @__PURE__ */ jsx("label", { id: METADATA_VALUE_LABEL_ID, children: "Value" }) })
11220
- ] }),
11221
- fields.map((field, index) => {
11222
- const isDisabled = field.disabled || false;
11223
- let placeholder = "-";
11224
- if (typeof field.value === "object") {
11225
- placeholder = "{ ... }";
11226
- }
11227
- if (Array.isArray(field.value)) {
11228
- placeholder = "[ ... ]";
11229
- }
11230
- return /* @__PURE__ */ jsx(
11231
- ConditionalTooltip,
11232
- {
11233
- showTooltip: isDisabled,
11234
- content: "This row is disabled because it contains non-primitive data.",
11235
- children: /* @__PURE__ */ jsxs("div", { className: "group/table relative", children: [
11236
- /* @__PURE__ */ jsxs(
11237
- "div",
11238
- {
11239
- className: clx("grid grid-cols-2 divide-x", {
11240
- "overflow-hidden rounded-b-lg": index === fields.length - 1
11241
- }),
11242
- children: [
11243
- /* @__PURE__ */ jsx(
11244
- Form$2.Field,
11245
- {
11246
- control: form.control,
11247
- name: `metadata.${index}.key`,
11248
- render: ({ field: field2 }) => {
11249
- return /* @__PURE__ */ jsx(Form$2.Item, { children: /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(
11250
- GridInput,
11251
- {
11252
- "aria-labelledby": METADATA_KEY_LABEL_ID,
11253
- ...field2,
11254
- disabled: isDisabled,
11255
- placeholder: "Key"
11256
- }
11257
- ) }) });
11258
- }
11259
- }
11260
- ),
11261
- /* @__PURE__ */ jsx(
11262
- Form$2.Field,
11263
- {
11264
- control: form.control,
11265
- name: `metadata.${index}.value`,
11266
- render: ({ field: { value, ...field2 } }) => {
11267
- return /* @__PURE__ */ jsx(Form$2.Item, { children: /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(
11268
- GridInput,
11269
- {
11270
- "aria-labelledby": METADATA_VALUE_LABEL_ID,
11271
- ...field2,
11272
- value: isDisabled ? placeholder : value,
11273
- disabled: isDisabled,
11274
- placeholder: "Value"
11275
- }
11276
- ) }) });
11277
- }
11278
- }
11279
- )
11280
- ]
11281
- }
11282
- ),
11283
- /* @__PURE__ */ jsxs(DropdownMenu, { children: [
11284
- /* @__PURE__ */ jsx(
11285
- DropdownMenu.Trigger,
11286
- {
11287
- className: clx(
11288
- "invisible absolute inset-y-0 -right-2.5 my-auto group-hover/table:visible data-[state='open']:visible",
11289
- {
11290
- hidden: isDisabled
11291
- }
11292
- ),
11293
- disabled: isDisabled,
11294
- asChild: true,
11295
- children: /* @__PURE__ */ jsx(IconButton, { size: "2xsmall", children: /* @__PURE__ */ jsx(EllipsisVertical, {}) })
11296
- }
11297
- ),
11298
- /* @__PURE__ */ jsxs(DropdownMenu.Content, { children: [
11299
- /* @__PURE__ */ jsxs(
11300
- DropdownMenu.Item,
11301
- {
11302
- className: "gap-x-2",
11303
- onClick: () => insertRow(index, "above"),
11304
- children: [
11305
- /* @__PURE__ */ jsx(ArrowUpMini, { className: "text-ui-fg-subtle" }),
11306
- "Insert row above"
11307
- ]
11308
- }
11309
- ),
11310
- /* @__PURE__ */ jsxs(
11311
- DropdownMenu.Item,
11312
- {
11313
- className: "gap-x-2",
11314
- onClick: () => insertRow(index, "below"),
11315
- children: [
11316
- /* @__PURE__ */ jsx(ArrowDownMini, { className: "text-ui-fg-subtle" }),
11317
- "Insert row below"
11318
- ]
11319
- }
11320
- ),
11321
- /* @__PURE__ */ jsx(DropdownMenu.Separator, {}),
11322
- /* @__PURE__ */ jsxs(
11323
- DropdownMenu.Item,
11324
- {
11325
- className: "gap-x-2",
11326
- onClick: () => deleteRow(index),
11327
- children: [
11328
- /* @__PURE__ */ jsx(Trash, { className: "text-ui-fg-subtle" }),
11329
- "Delete row"
11330
- ]
11331
- }
11332
- )
11333
- ] })
11334
- ] })
11335
- ] })
11336
- },
11337
- field.id
11338
- );
11339
- })
11340
- ] }),
11341
- hasUneditableRows && /* @__PURE__ */ 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." })
11342
- ] }),
11343
- /* @__PURE__ */ jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
11344
- /* @__PURE__ */ jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", type: "button", children: "Cancel" }) }),
11500
+ onSubmit,
11501
+ children: [
11502
+ /* @__PURE__ */ jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsx(SalesChannelField, { control: form.control, order }) }),
11503
+ /* @__PURE__ */ jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex justify-end gap-2", children: [
11504
+ /* @__PURE__ */ jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
11345
11505
  /* @__PURE__ */ jsx(Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
11346
11506
  ] }) })
11347
11507
  ]
11348
11508
  }
11349
11509
  ) });
11350
11510
  };
11351
- const GridInput = forwardRef(({ className, ...props }, ref) => {
11511
+ const SalesChannelField = ({ control, order }) => {
11512
+ const salesChannels = useComboboxData({
11513
+ queryFn: async (params) => {
11514
+ return await sdk.admin.salesChannel.list(params);
11515
+ },
11516
+ queryKey: ["sales-channels"],
11517
+ getOptions: (data) => {
11518
+ return data.sales_channels.map((salesChannel) => ({
11519
+ label: salesChannel.name,
11520
+ value: salesChannel.id
11521
+ }));
11522
+ },
11523
+ defaultValue: order.sales_channel_id || void 0
11524
+ });
11352
11525
  return /* @__PURE__ */ jsx(
11353
- "input",
11526
+ Form$2.Field,
11354
11527
  {
11355
- ref,
11356
- ...props,
11357
- autoComplete: "off",
11358
- className: clx(
11359
- "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",
11360
- className
11361
- )
11362
- }
11363
- );
11364
- });
11365
- GridInput.displayName = "MetadataForm.GridInput";
11366
- const PlaceholderInner = () => {
11367
- return /* @__PURE__ */ jsxs("div", { className: "flex flex-1 flex-col overflow-hidden", children: [
11368
- /* @__PURE__ */ jsx(RouteDrawer.Body, { children: /* @__PURE__ */ jsx(Skeleton, { className: "h-[148ox] w-full rounded-lg" }) }),
11369
- /* @__PURE__ */ jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
11370
- /* @__PURE__ */ jsx(Skeleton, { className: "h-7 w-12 rounded-md" }),
11371
- /* @__PURE__ */ jsx(Skeleton, { className: "h-7 w-12 rounded-md" })
11372
- ] }) })
11373
- ] });
11374
- };
11375
- const EDITABLE_TYPES = ["string", "number", "boolean"];
11376
- function getDefaultValues(metadata) {
11377
- if (!metadata || !Object.keys(metadata).length) {
11378
- return [
11379
- {
11380
- key: "",
11381
- value: "",
11382
- disabled: false
11383
- }
11384
- ];
11385
- }
11386
- return Object.entries(metadata).map(([key, value]) => {
11387
- if (!EDITABLE_TYPES.includes(typeof value)) {
11388
- return {
11389
- key,
11390
- value,
11391
- disabled: true
11392
- };
11393
- }
11394
- let stringValue = value;
11395
- if (typeof value !== "string") {
11396
- stringValue = JSON.stringify(value);
11397
- }
11398
- return {
11399
- key,
11400
- value: stringValue,
11401
- original_key: key
11402
- };
11403
- });
11404
- }
11405
- function parseValues(values) {
11406
- const metadata = values.metadata;
11407
- const isEmpty = !metadata.length || metadata.length === 1 && !metadata[0].key && !metadata[0].value;
11408
- if (isEmpty) {
11409
- return null;
11410
- }
11411
- const update = {};
11412
- metadata.forEach((field) => {
11413
- let key = field.key;
11414
- let value = field.value;
11415
- const disabled = field.disabled;
11416
- if (!key || !value) {
11417
- return;
11418
- }
11419
- if (disabled) {
11420
- update[key] = value;
11421
- return;
11422
- }
11423
- key = key.trim();
11424
- value = value.trim();
11425
- if (value === "true") {
11426
- update[key] = true;
11427
- } else if (value === "false") {
11428
- update[key] = false;
11429
- } else {
11430
- const parsedNumber = parseFloat(value);
11431
- if (!isNaN(parsedNumber)) {
11432
- update[key] = parsedNumber;
11433
- } else {
11434
- update[key] = value;
11528
+ control,
11529
+ name: "sales_channel_id",
11530
+ render: ({ field }) => {
11531
+ return /* @__PURE__ */ jsxs(Form$2.Item, { children: [
11532
+ /* @__PURE__ */ jsx(Form$2.Label, { children: "Sales Channel" }),
11533
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(
11534
+ Combobox,
11535
+ {
11536
+ options: salesChannels.options,
11537
+ fetchNextPage: salesChannels.fetchNextPage,
11538
+ isFetchingNextPage: salesChannels.isFetchingNextPage,
11539
+ searchValue: salesChannels.searchValue,
11540
+ onSearchValueChange: salesChannels.onSearchValueChange,
11541
+ placeholder: "Select sales channel",
11542
+ ...field
11543
+ }
11544
+ ) }),
11545
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
11546
+ ] });
11435
11547
  }
11436
11548
  }
11437
- });
11438
- return update;
11439
- }
11440
- function getHasUneditableRows(metadata) {
11441
- if (!metadata) {
11442
- return false;
11443
- }
11444
- return Object.values(metadata).some(
11445
- (value) => !EDITABLE_TYPES.includes(typeof value)
11446
11549
  );
11447
- }
11550
+ };
11551
+ const schema$2 = objectType({
11552
+ sales_channel_id: stringType().min(1)
11553
+ });
11448
11554
  const STACKED_FOCUS_MODAL_ID = "shipping-form";
11449
11555
  const Shipping = () => {
11450
11556
  var _a;
@@ -12284,7 +12390,7 @@ const ShippingAddressForm = ({ order }) => {
12284
12390
  postal_code: ((_i = order.shipping_address) == null ? void 0 : _i.postal_code) ?? "",
12285
12391
  phone: ((_j = order.shipping_address) == null ? void 0 : _j.phone) ?? ""
12286
12392
  },
12287
- resolver: zodResolver(schema$2)
12393
+ resolver: zodResolver(schema$1)
12288
12394
  });
12289
12395
  const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
12290
12396
  const { handleSuccess } = useRouteModal();
@@ -12454,7 +12560,7 @@ const ShippingAddressForm = ({ order }) => {
12454
12560
  }
12455
12561
  ) });
12456
12562
  };
12457
- const schema$2 = addressSchema;
12563
+ const schema$1 = addressSchema;
12458
12564
  const TransferOwnership = () => {
12459
12565
  const { id } = useParams();
12460
12566
  const { draft_order, isPending, isError, error } = useDraftOrder(id, {
@@ -12478,7 +12584,7 @@ const TransferOwnershipForm = ({ order }) => {
12478
12584
  defaultValues: {
12479
12585
  customer_id: order.customer_id || ""
12480
12586
  },
12481
- resolver: zodResolver(schema$1)
12587
+ resolver: zodResolver(schema)
12482
12588
  });
12483
12589
  const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
12484
12590
  const { handleSuccess } = useRouteModal();
@@ -12928,114 +13034,8 @@ const Illustration = () => {
12928
13034
  }
12929
13035
  );
12930
13036
  };
12931
- const schema$1 = objectType({
12932
- customer_id: stringType().min(1)
12933
- });
12934
- const SalesChannel = () => {
12935
- const { id } = useParams();
12936
- const { draft_order, isPending, isError, error } = useDraftOrder(
12937
- id,
12938
- {
12939
- fields: "+sales_channel_id"
12940
- },
12941
- {
12942
- enabled: !!id
12943
- }
12944
- );
12945
- if (isError) {
12946
- throw error;
12947
- }
12948
- const ISrEADY = !!draft_order && !isPending;
12949
- return /* @__PURE__ */ jsxs(RouteDrawer, { children: [
12950
- /* @__PURE__ */ jsxs(RouteDrawer.Header, { children: [
12951
- /* @__PURE__ */ jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Edit Sales Channel" }) }),
12952
- /* @__PURE__ */ jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Update which sales channel the draft order is associated with" }) })
12953
- ] }),
12954
- ISrEADY && /* @__PURE__ */ jsx(SalesChannelForm, { order: draft_order })
12955
- ] });
12956
- };
12957
- const SalesChannelForm = ({ order }) => {
12958
- const form = useForm({
12959
- defaultValues: {
12960
- sales_channel_id: order.sales_channel_id || ""
12961
- },
12962
- resolver: zodResolver(schema)
12963
- });
12964
- const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
12965
- const { handleSuccess } = useRouteModal();
12966
- const onSubmit = form.handleSubmit(async (data) => {
12967
- await mutateAsync(
12968
- {
12969
- sales_channel_id: data.sales_channel_id
12970
- },
12971
- {
12972
- onSuccess: () => {
12973
- toast.success("Sales channel updated");
12974
- handleSuccess();
12975
- },
12976
- onError: (error) => {
12977
- toast.error(error.message);
12978
- }
12979
- }
12980
- );
12981
- });
12982
- return /* @__PURE__ */ jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxs(
12983
- KeyboundForm,
12984
- {
12985
- className: "flex flex-1 flex-col overflow-hidden",
12986
- onSubmit,
12987
- children: [
12988
- /* @__PURE__ */ jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsx(SalesChannelField, { control: form.control, order }) }),
12989
- /* @__PURE__ */ jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex justify-end gap-2", children: [
12990
- /* @__PURE__ */ jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
12991
- /* @__PURE__ */ jsx(Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
12992
- ] }) })
12993
- ]
12994
- }
12995
- ) });
12996
- };
12997
- const SalesChannelField = ({ control, order }) => {
12998
- const salesChannels = useComboboxData({
12999
- queryFn: async (params) => {
13000
- return await sdk.admin.salesChannel.list(params);
13001
- },
13002
- queryKey: ["sales-channels"],
13003
- getOptions: (data) => {
13004
- return data.sales_channels.map((salesChannel) => ({
13005
- label: salesChannel.name,
13006
- value: salesChannel.id
13007
- }));
13008
- },
13009
- defaultValue: order.sales_channel_id || void 0
13010
- });
13011
- return /* @__PURE__ */ jsx(
13012
- Form$2.Field,
13013
- {
13014
- control,
13015
- name: "sales_channel_id",
13016
- render: ({ field }) => {
13017
- return /* @__PURE__ */ jsxs(Form$2.Item, { children: [
13018
- /* @__PURE__ */ jsx(Form$2.Label, { children: "Sales Channel" }),
13019
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(
13020
- Combobox,
13021
- {
13022
- options: salesChannels.options,
13023
- fetchNextPage: salesChannels.fetchNextPage,
13024
- isFetchingNextPage: salesChannels.isFetchingNextPage,
13025
- searchValue: salesChannels.searchValue,
13026
- onSearchValueChange: salesChannels.onSearchValueChange,
13027
- placeholder: "Select sales channel",
13028
- ...field
13029
- }
13030
- ) }),
13031
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
13032
- ] });
13033
- }
13034
- }
13035
- );
13036
- };
13037
13037
  const schema = objectType({
13038
- sales_channel_id: stringType().min(1)
13038
+ customer_id: stringType().min(1)
13039
13039
  });
13040
13040
  const widgetModule = { widgets: [] };
13041
13041
  const routeModule = {
@@ -13073,13 +13073,17 @@ const routeModule = {
13073
13073
  Component: Items,
13074
13074
  path: "/draft-orders/:id/items"
13075
13075
  },
13076
+ {
13077
+ Component: Metadata,
13078
+ path: "/draft-orders/:id/metadata"
13079
+ },
13076
13080
  {
13077
13081
  Component: Promotions,
13078
13082
  path: "/draft-orders/:id/promotions"
13079
13083
  },
13080
13084
  {
13081
- Component: Metadata,
13082
- path: "/draft-orders/:id/metadata"
13085
+ Component: SalesChannel,
13086
+ path: "/draft-orders/:id/sales-channel"
13083
13087
  },
13084
13088
  {
13085
13089
  Component: Shipping,
@@ -13092,10 +13096,6 @@ const routeModule = {
13092
13096
  {
13093
13097
  Component: TransferOwnership,
13094
13098
  path: "/draft-orders/:id/transfer-ownership"
13095
- },
13096
- {
13097
- Component: SalesChannel,
13098
- path: "/draft-orders/:id/sales-channel"
13099
13099
  }
13100
13100
  ]
13101
13101
  }