@medusajs/draft-order 2.10.1-snapshot-20250828200637 → 2.10.1-snapshot-20250828204656

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.
@@ -9554,6 +9554,196 @@ const ID = () => {
9554
9554
  /* @__PURE__ */ jsx(Outlet, {})
9555
9555
  ] });
9556
9556
  };
9557
+ const BillingAddress = () => {
9558
+ const { id } = useParams();
9559
+ const { order, isPending, isError, error } = useOrder(id, {
9560
+ fields: "+billing_address"
9561
+ });
9562
+ if (isError) {
9563
+ throw error;
9564
+ }
9565
+ const isReady = !isPending && !!order;
9566
+ return /* @__PURE__ */ jsxs(RouteDrawer, { children: [
9567
+ /* @__PURE__ */ jsxs(RouteDrawer.Header, { children: [
9568
+ /* @__PURE__ */ jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Edit Billing Address" }) }),
9569
+ /* @__PURE__ */ jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Edit the billing address for the draft order" }) })
9570
+ ] }),
9571
+ isReady && /* @__PURE__ */ jsx(BillingAddressForm, { order })
9572
+ ] });
9573
+ };
9574
+ const BillingAddressForm = ({ order }) => {
9575
+ var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
9576
+ const form = useForm({
9577
+ defaultValues: {
9578
+ first_name: ((_a = order.billing_address) == null ? void 0 : _a.first_name) ?? "",
9579
+ last_name: ((_b = order.billing_address) == null ? void 0 : _b.last_name) ?? "",
9580
+ company: ((_c = order.billing_address) == null ? void 0 : _c.company) ?? "",
9581
+ address_1: ((_d = order.billing_address) == null ? void 0 : _d.address_1) ?? "",
9582
+ address_2: ((_e = order.billing_address) == null ? void 0 : _e.address_2) ?? "",
9583
+ city: ((_f = order.billing_address) == null ? void 0 : _f.city) ?? "",
9584
+ province: ((_g = order.billing_address) == null ? void 0 : _g.province) ?? "",
9585
+ country_code: ((_h = order.billing_address) == null ? void 0 : _h.country_code) ?? "",
9586
+ postal_code: ((_i = order.billing_address) == null ? void 0 : _i.postal_code) ?? "",
9587
+ phone: ((_j = order.billing_address) == null ? void 0 : _j.phone) ?? ""
9588
+ },
9589
+ resolver: zodResolver(schema$5)
9590
+ });
9591
+ const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
9592
+ const { handleSuccess } = useRouteModal();
9593
+ const onSubmit = form.handleSubmit(async (data) => {
9594
+ await mutateAsync(
9595
+ { billing_address: data },
9596
+ {
9597
+ onSuccess: () => {
9598
+ handleSuccess();
9599
+ },
9600
+ onError: (error) => {
9601
+ toast.error(error.message);
9602
+ }
9603
+ }
9604
+ );
9605
+ });
9606
+ return /* @__PURE__ */ jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxs(
9607
+ KeyboundForm,
9608
+ {
9609
+ className: "flex flex-1 flex-col overflow-hidden",
9610
+ onSubmit,
9611
+ children: [
9612
+ /* @__PURE__ */ jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-y-4", children: [
9613
+ /* @__PURE__ */ jsx(
9614
+ Form$2.Field,
9615
+ {
9616
+ control: form.control,
9617
+ name: "country_code",
9618
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
9619
+ /* @__PURE__ */ jsx(Form$2.Label, { children: "Country" }),
9620
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(CountrySelect, { ...field }) }),
9621
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
9622
+ ] })
9623
+ }
9624
+ ),
9625
+ /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
9626
+ /* @__PURE__ */ jsx(
9627
+ Form$2.Field,
9628
+ {
9629
+ control: form.control,
9630
+ name: "first_name",
9631
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
9632
+ /* @__PURE__ */ jsx(Form$2.Label, { children: "First name" }),
9633
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
9634
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
9635
+ ] })
9636
+ }
9637
+ ),
9638
+ /* @__PURE__ */ jsx(
9639
+ Form$2.Field,
9640
+ {
9641
+ control: form.control,
9642
+ name: "last_name",
9643
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
9644
+ /* @__PURE__ */ jsx(Form$2.Label, { children: "Last name" }),
9645
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
9646
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
9647
+ ] })
9648
+ }
9649
+ )
9650
+ ] }),
9651
+ /* @__PURE__ */ jsx(
9652
+ Form$2.Field,
9653
+ {
9654
+ control: form.control,
9655
+ name: "company",
9656
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
9657
+ /* @__PURE__ */ jsx(Form$2.Label, { optional: true, children: "Company" }),
9658
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
9659
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
9660
+ ] })
9661
+ }
9662
+ ),
9663
+ /* @__PURE__ */ jsx(
9664
+ Form$2.Field,
9665
+ {
9666
+ control: form.control,
9667
+ name: "address_1",
9668
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
9669
+ /* @__PURE__ */ jsx(Form$2.Label, { children: "Address" }),
9670
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
9671
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
9672
+ ] })
9673
+ }
9674
+ ),
9675
+ /* @__PURE__ */ jsx(
9676
+ Form$2.Field,
9677
+ {
9678
+ control: form.control,
9679
+ name: "address_2",
9680
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
9681
+ /* @__PURE__ */ jsx(Form$2.Label, { optional: true, children: "Apartment, suite, etc." }),
9682
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
9683
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
9684
+ ] })
9685
+ }
9686
+ ),
9687
+ /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
9688
+ /* @__PURE__ */ jsx(
9689
+ Form$2.Field,
9690
+ {
9691
+ control: form.control,
9692
+ name: "postal_code",
9693
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
9694
+ /* @__PURE__ */ jsx(Form$2.Label, { children: "Postal code" }),
9695
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
9696
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
9697
+ ] })
9698
+ }
9699
+ ),
9700
+ /* @__PURE__ */ jsx(
9701
+ Form$2.Field,
9702
+ {
9703
+ control: form.control,
9704
+ name: "city",
9705
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
9706
+ /* @__PURE__ */ jsx(Form$2.Label, { children: "City" }),
9707
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
9708
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
9709
+ ] })
9710
+ }
9711
+ )
9712
+ ] }),
9713
+ /* @__PURE__ */ jsx(
9714
+ Form$2.Field,
9715
+ {
9716
+ control: form.control,
9717
+ name: "province",
9718
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
9719
+ /* @__PURE__ */ jsx(Form$2.Label, { optional: true, children: "Province / State" }),
9720
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
9721
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
9722
+ ] })
9723
+ }
9724
+ ),
9725
+ /* @__PURE__ */ jsx(
9726
+ Form$2.Field,
9727
+ {
9728
+ control: form.control,
9729
+ name: "phone",
9730
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
9731
+ /* @__PURE__ */ jsx(Form$2.Label, { optional: true, children: "Phone" }),
9732
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
9733
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
9734
+ ] })
9735
+ }
9736
+ )
9737
+ ] }) }),
9738
+ /* @__PURE__ */ jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex justify-end gap-2", children: [
9739
+ /* @__PURE__ */ jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
9740
+ /* @__PURE__ */ jsx(Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
9741
+ ] }) })
9742
+ ]
9743
+ }
9744
+ ) });
9745
+ };
9746
+ const schema$5 = addressSchema;
9557
9747
  const CustomItems = () => {
9558
9748
  return /* @__PURE__ */ jsxs(RouteDrawer, { children: [
9559
9749
  /* @__PURE__ */ jsx(RouteDrawer.Header, { children: /* @__PURE__ */ jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Edit Custom Items" }) }) }),
@@ -9562,7 +9752,7 @@ const CustomItems = () => {
9562
9752
  };
9563
9753
  const CustomItemsForm = () => {
9564
9754
  const form = useForm({
9565
- resolver: zodResolver(schema$5)
9755
+ resolver: zodResolver(schema$4)
9566
9756
  });
9567
9757
  return /* @__PURE__ */ jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxs(KeyboundForm, { className: "flex flex-1 flex-col", children: [
9568
9758
  /* @__PURE__ */ jsx(RouteDrawer.Body, {}),
@@ -9572,7 +9762,7 @@ const CustomItemsForm = () => {
9572
9762
  ] }) })
9573
9763
  ] }) });
9574
9764
  };
9575
- const schema$5 = objectType({
9765
+ const schema$4 = objectType({
9576
9766
  email: stringType().email()
9577
9767
  });
9578
9768
  const Email = () => {
@@ -9597,7 +9787,7 @@ const EmailForm = ({ order }) => {
9597
9787
  defaultValues: {
9598
9788
  email: order.email ?? ""
9599
9789
  },
9600
- resolver: zodResolver(schema$4)
9790
+ resolver: zodResolver(schema$3)
9601
9791
  });
9602
9792
  const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
9603
9793
  const { handleSuccess } = useRouteModal();
@@ -9640,7 +9830,7 @@ const EmailForm = ({ order }) => {
9640
9830
  }
9641
9831
  ) });
9642
9832
  };
9643
- const schema$4 = objectType({
9833
+ const schema$3 = objectType({
9644
9834
  email: stringType().email()
9645
9835
  });
9646
9836
  const NumberInput = forwardRef(
@@ -10617,356 +10807,6 @@ const customItemSchema = objectType({
10617
10807
  quantity: numberType(),
10618
10808
  unit_price: unionType([numberType(), stringType()])
10619
10809
  });
10620
- const InlineTip = forwardRef(
10621
- ({ variant = "tip", label, className, children, ...props }, ref) => {
10622
- const labelValue = label || (variant === "warning" ? "Warning" : "Tip");
10623
- return /* @__PURE__ */ jsxs(
10624
- "div",
10625
- {
10626
- ref,
10627
- className: clx(
10628
- "bg-ui-bg-component txt-small text-ui-fg-subtle grid grid-cols-[4px_1fr] items-start gap-3 rounded-lg border p-3",
10629
- className
10630
- ),
10631
- ...props,
10632
- children: [
10633
- /* @__PURE__ */ jsx(
10634
- "div",
10635
- {
10636
- role: "presentation",
10637
- className: clx("w-4px bg-ui-tag-neutral-icon h-full rounded-full", {
10638
- "bg-ui-tag-orange-icon": variant === "warning"
10639
- })
10640
- }
10641
- ),
10642
- /* @__PURE__ */ jsxs("div", { className: "text-pretty", children: [
10643
- /* @__PURE__ */ jsxs("strong", { className: "txt-small-plus text-ui-fg-base", children: [
10644
- labelValue,
10645
- ":"
10646
- ] }),
10647
- " ",
10648
- children
10649
- ] })
10650
- ]
10651
- }
10652
- );
10653
- }
10654
- );
10655
- InlineTip.displayName = "InlineTip";
10656
- const MetadataFieldSchema = objectType({
10657
- key: stringType(),
10658
- disabled: booleanType().optional(),
10659
- value: anyType()
10660
- });
10661
- const MetadataSchema = objectType({
10662
- metadata: arrayType(MetadataFieldSchema)
10663
- });
10664
- const Metadata = () => {
10665
- const { id } = useParams();
10666
- const { order, isPending, isError, error } = useOrder(id, {
10667
- fields: "metadata"
10668
- });
10669
- if (isError) {
10670
- throw error;
10671
- }
10672
- const isReady = !isPending && !!order;
10673
- return /* @__PURE__ */ jsxs(RouteDrawer, { children: [
10674
- /* @__PURE__ */ jsxs(RouteDrawer.Header, { children: [
10675
- /* @__PURE__ */ jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Metadata" }) }),
10676
- /* @__PURE__ */ jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Add metadata to the draft order." }) })
10677
- ] }),
10678
- !isReady ? /* @__PURE__ */ jsx(PlaceholderInner, {}) : /* @__PURE__ */ jsx(MetadataForm, { orderId: id, metadata: order == null ? void 0 : order.metadata })
10679
- ] });
10680
- };
10681
- const METADATA_KEY_LABEL_ID = "metadata-form-key-label";
10682
- const METADATA_VALUE_LABEL_ID = "metadata-form-value-label";
10683
- const MetadataForm = ({ orderId, metadata }) => {
10684
- const { handleSuccess } = useRouteModal();
10685
- const hasUneditableRows = getHasUneditableRows(metadata);
10686
- const { mutateAsync, isPending } = useUpdateDraftOrder(orderId);
10687
- const form = useForm({
10688
- defaultValues: {
10689
- metadata: getDefaultValues(metadata)
10690
- },
10691
- resolver: zodResolver(MetadataSchema)
10692
- });
10693
- const handleSubmit = form.handleSubmit(async (data) => {
10694
- const parsedData = parseValues(data);
10695
- await mutateAsync(
10696
- {
10697
- metadata: parsedData
10698
- },
10699
- {
10700
- onSuccess: () => {
10701
- toast.success("Metadata updated");
10702
- handleSuccess();
10703
- },
10704
- onError: (error) => {
10705
- toast.error(error.message);
10706
- }
10707
- }
10708
- );
10709
- });
10710
- const { fields, insert, remove } = useFieldArray({
10711
- control: form.control,
10712
- name: "metadata"
10713
- });
10714
- function deleteRow(index) {
10715
- remove(index);
10716
- if (fields.length === 1) {
10717
- insert(0, {
10718
- key: "",
10719
- value: "",
10720
- disabled: false
10721
- });
10722
- }
10723
- }
10724
- function insertRow(index, position) {
10725
- insert(index + (position === "above" ? 0 : 1), {
10726
- key: "",
10727
- value: "",
10728
- disabled: false
10729
- });
10730
- }
10731
- return /* @__PURE__ */ jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxs(
10732
- KeyboundForm,
10733
- {
10734
- onSubmit: handleSubmit,
10735
- className: "flex flex-1 flex-col overflow-hidden",
10736
- children: [
10737
- /* @__PURE__ */ jsxs(RouteDrawer.Body, { className: "flex flex-1 flex-col gap-y-8 overflow-y-auto", children: [
10738
- /* @__PURE__ */ jsxs("div", { className: "bg-ui-bg-base shadow-elevation-card-rest grid grid-cols-1 divide-y rounded-lg", children: [
10739
- /* @__PURE__ */ jsxs("div", { className: "bg-ui-bg-subtle grid grid-cols-2 divide-x rounded-t-lg", children: [
10740
- /* @__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" }) }),
10741
- /* @__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" }) })
10742
- ] }),
10743
- fields.map((field, index) => {
10744
- const isDisabled = field.disabled || false;
10745
- let placeholder = "-";
10746
- if (typeof field.value === "object") {
10747
- placeholder = "{ ... }";
10748
- }
10749
- if (Array.isArray(field.value)) {
10750
- placeholder = "[ ... ]";
10751
- }
10752
- return /* @__PURE__ */ jsx(
10753
- ConditionalTooltip,
10754
- {
10755
- showTooltip: isDisabled,
10756
- content: "This row is disabled because it contains non-primitive data.",
10757
- children: /* @__PURE__ */ jsxs("div", { className: "group/table relative", children: [
10758
- /* @__PURE__ */ jsxs(
10759
- "div",
10760
- {
10761
- className: clx("grid grid-cols-2 divide-x", {
10762
- "overflow-hidden rounded-b-lg": index === fields.length - 1
10763
- }),
10764
- children: [
10765
- /* @__PURE__ */ jsx(
10766
- Form$2.Field,
10767
- {
10768
- control: form.control,
10769
- name: `metadata.${index}.key`,
10770
- render: ({ field: field2 }) => {
10771
- return /* @__PURE__ */ jsx(Form$2.Item, { children: /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(
10772
- GridInput,
10773
- {
10774
- "aria-labelledby": METADATA_KEY_LABEL_ID,
10775
- ...field2,
10776
- disabled: isDisabled,
10777
- placeholder: "Key"
10778
- }
10779
- ) }) });
10780
- }
10781
- }
10782
- ),
10783
- /* @__PURE__ */ jsx(
10784
- Form$2.Field,
10785
- {
10786
- control: form.control,
10787
- name: `metadata.${index}.value`,
10788
- render: ({ field: { value, ...field2 } }) => {
10789
- return /* @__PURE__ */ jsx(Form$2.Item, { children: /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(
10790
- GridInput,
10791
- {
10792
- "aria-labelledby": METADATA_VALUE_LABEL_ID,
10793
- ...field2,
10794
- value: isDisabled ? placeholder : value,
10795
- disabled: isDisabled,
10796
- placeholder: "Value"
10797
- }
10798
- ) }) });
10799
- }
10800
- }
10801
- )
10802
- ]
10803
- }
10804
- ),
10805
- /* @__PURE__ */ jsxs(DropdownMenu, { children: [
10806
- /* @__PURE__ */ jsx(
10807
- DropdownMenu.Trigger,
10808
- {
10809
- className: clx(
10810
- "invisible absolute inset-y-0 -right-2.5 my-auto group-hover/table:visible data-[state='open']:visible",
10811
- {
10812
- hidden: isDisabled
10813
- }
10814
- ),
10815
- disabled: isDisabled,
10816
- asChild: true,
10817
- children: /* @__PURE__ */ jsx(IconButton, { size: "2xsmall", children: /* @__PURE__ */ jsx(EllipsisVertical, {}) })
10818
- }
10819
- ),
10820
- /* @__PURE__ */ jsxs(DropdownMenu.Content, { children: [
10821
- /* @__PURE__ */ jsxs(
10822
- DropdownMenu.Item,
10823
- {
10824
- className: "gap-x-2",
10825
- onClick: () => insertRow(index, "above"),
10826
- children: [
10827
- /* @__PURE__ */ jsx(ArrowUpMini, { className: "text-ui-fg-subtle" }),
10828
- "Insert row above"
10829
- ]
10830
- }
10831
- ),
10832
- /* @__PURE__ */ jsxs(
10833
- DropdownMenu.Item,
10834
- {
10835
- className: "gap-x-2",
10836
- onClick: () => insertRow(index, "below"),
10837
- children: [
10838
- /* @__PURE__ */ jsx(ArrowDownMini, { className: "text-ui-fg-subtle" }),
10839
- "Insert row below"
10840
- ]
10841
- }
10842
- ),
10843
- /* @__PURE__ */ jsx(DropdownMenu.Separator, {}),
10844
- /* @__PURE__ */ jsxs(
10845
- DropdownMenu.Item,
10846
- {
10847
- className: "gap-x-2",
10848
- onClick: () => deleteRow(index),
10849
- children: [
10850
- /* @__PURE__ */ jsx(Trash, { className: "text-ui-fg-subtle" }),
10851
- "Delete row"
10852
- ]
10853
- }
10854
- )
10855
- ] })
10856
- ] })
10857
- ] })
10858
- },
10859
- field.id
10860
- );
10861
- })
10862
- ] }),
10863
- 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." })
10864
- ] }),
10865
- /* @__PURE__ */ jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
10866
- /* @__PURE__ */ jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", type: "button", children: "Cancel" }) }),
10867
- /* @__PURE__ */ jsx(Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
10868
- ] }) })
10869
- ]
10870
- }
10871
- ) });
10872
- };
10873
- const GridInput = forwardRef(({ className, ...props }, ref) => {
10874
- return /* @__PURE__ */ jsx(
10875
- "input",
10876
- {
10877
- ref,
10878
- ...props,
10879
- autoComplete: "off",
10880
- className: clx(
10881
- "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",
10882
- className
10883
- )
10884
- }
10885
- );
10886
- });
10887
- GridInput.displayName = "MetadataForm.GridInput";
10888
- const PlaceholderInner = () => {
10889
- return /* @__PURE__ */ jsxs("div", { className: "flex flex-1 flex-col overflow-hidden", children: [
10890
- /* @__PURE__ */ jsx(RouteDrawer.Body, { children: /* @__PURE__ */ jsx(Skeleton, { className: "h-[148ox] w-full rounded-lg" }) }),
10891
- /* @__PURE__ */ jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
10892
- /* @__PURE__ */ jsx(Skeleton, { className: "h-7 w-12 rounded-md" }),
10893
- /* @__PURE__ */ jsx(Skeleton, { className: "h-7 w-12 rounded-md" })
10894
- ] }) })
10895
- ] });
10896
- };
10897
- const EDITABLE_TYPES = ["string", "number", "boolean"];
10898
- function getDefaultValues(metadata) {
10899
- if (!metadata || !Object.keys(metadata).length) {
10900
- return [
10901
- {
10902
- key: "",
10903
- value: "",
10904
- disabled: false
10905
- }
10906
- ];
10907
- }
10908
- return Object.entries(metadata).map(([key, value]) => {
10909
- if (!EDITABLE_TYPES.includes(typeof value)) {
10910
- return {
10911
- key,
10912
- value,
10913
- disabled: true
10914
- };
10915
- }
10916
- let stringValue = value;
10917
- if (typeof value !== "string") {
10918
- stringValue = JSON.stringify(value);
10919
- }
10920
- return {
10921
- key,
10922
- value: stringValue,
10923
- original_key: key
10924
- };
10925
- });
10926
- }
10927
- function parseValues(values) {
10928
- const metadata = values.metadata;
10929
- const isEmpty = !metadata.length || metadata.length === 1 && !metadata[0].key && !metadata[0].value;
10930
- if (isEmpty) {
10931
- return null;
10932
- }
10933
- const update = {};
10934
- metadata.forEach((field) => {
10935
- let key = field.key;
10936
- let value = field.value;
10937
- const disabled = field.disabled;
10938
- if (!key || !value) {
10939
- return;
10940
- }
10941
- if (disabled) {
10942
- update[key] = value;
10943
- return;
10944
- }
10945
- key = key.trim();
10946
- value = value.trim();
10947
- if (value === "true") {
10948
- update[key] = true;
10949
- } else if (value === "false") {
10950
- update[key] = false;
10951
- } else {
10952
- const parsedNumber = parseFloat(value);
10953
- if (!isNaN(parsedNumber)) {
10954
- update[key] = parsedNumber;
10955
- } else {
10956
- update[key] = value;
10957
- }
10958
- }
10959
- });
10960
- return update;
10961
- }
10962
- function getHasUneditableRows(metadata) {
10963
- if (!metadata) {
10964
- return false;
10965
- }
10966
- return Object.values(metadata).some(
10967
- (value) => !EDITABLE_TYPES.includes(typeof value)
10968
- );
10969
- }
10970
10810
  const PROMOTION_QUERY_KEY = "promotions";
10971
10811
  const promotionsQueryKeys = {
10972
10812
  list: (query2) => [
@@ -11270,20 +11110,168 @@ const SalesChannel = () => {
11270
11110
  const SalesChannelForm = ({ order }) => {
11271
11111
  const form = useForm({
11272
11112
  defaultValues: {
11273
- sales_channel_id: order.sales_channel_id || ""
11113
+ sales_channel_id: order.sales_channel_id || ""
11114
+ },
11115
+ resolver: zodResolver(schema$2)
11116
+ });
11117
+ const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
11118
+ const { handleSuccess } = useRouteModal();
11119
+ const onSubmit = form.handleSubmit(async (data) => {
11120
+ await mutateAsync(
11121
+ {
11122
+ sales_channel_id: data.sales_channel_id
11123
+ },
11124
+ {
11125
+ onSuccess: () => {
11126
+ toast.success("Sales channel updated");
11127
+ handleSuccess();
11128
+ },
11129
+ onError: (error) => {
11130
+ toast.error(error.message);
11131
+ }
11132
+ }
11133
+ );
11134
+ });
11135
+ return /* @__PURE__ */ jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxs(
11136
+ KeyboundForm,
11137
+ {
11138
+ className: "flex flex-1 flex-col overflow-hidden",
11139
+ onSubmit,
11140
+ children: [
11141
+ /* @__PURE__ */ jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsx(SalesChannelField, { control: form.control, order }) }),
11142
+ /* @__PURE__ */ jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex justify-end gap-2", children: [
11143
+ /* @__PURE__ */ jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
11144
+ /* @__PURE__ */ jsx(Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
11145
+ ] }) })
11146
+ ]
11147
+ }
11148
+ ) });
11149
+ };
11150
+ const SalesChannelField = ({ control, order }) => {
11151
+ const salesChannels = useComboboxData({
11152
+ queryFn: async (params) => {
11153
+ return await sdk.admin.salesChannel.list(params);
11154
+ },
11155
+ queryKey: ["sales-channels"],
11156
+ getOptions: (data) => {
11157
+ return data.sales_channels.map((salesChannel) => ({
11158
+ label: salesChannel.name,
11159
+ value: salesChannel.id
11160
+ }));
11161
+ },
11162
+ defaultValue: order.sales_channel_id || void 0
11163
+ });
11164
+ return /* @__PURE__ */ jsx(
11165
+ Form$2.Field,
11166
+ {
11167
+ control,
11168
+ name: "sales_channel_id",
11169
+ render: ({ field }) => {
11170
+ return /* @__PURE__ */ jsxs(Form$2.Item, { children: [
11171
+ /* @__PURE__ */ jsx(Form$2.Label, { children: "Sales Channel" }),
11172
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(
11173
+ Combobox,
11174
+ {
11175
+ options: salesChannels.options,
11176
+ fetchNextPage: salesChannels.fetchNextPage,
11177
+ isFetchingNextPage: salesChannels.isFetchingNextPage,
11178
+ searchValue: salesChannels.searchValue,
11179
+ onSearchValueChange: salesChannels.onSearchValueChange,
11180
+ placeholder: "Select sales channel",
11181
+ ...field
11182
+ }
11183
+ ) }),
11184
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
11185
+ ] });
11186
+ }
11187
+ }
11188
+ );
11189
+ };
11190
+ const schema$2 = objectType({
11191
+ sales_channel_id: stringType().min(1)
11192
+ });
11193
+ const InlineTip = forwardRef(
11194
+ ({ variant = "tip", label, className, children, ...props }, ref) => {
11195
+ const labelValue = label || (variant === "warning" ? "Warning" : "Tip");
11196
+ return /* @__PURE__ */ jsxs(
11197
+ "div",
11198
+ {
11199
+ ref,
11200
+ className: clx(
11201
+ "bg-ui-bg-component txt-small text-ui-fg-subtle grid grid-cols-[4px_1fr] items-start gap-3 rounded-lg border p-3",
11202
+ className
11203
+ ),
11204
+ ...props,
11205
+ children: [
11206
+ /* @__PURE__ */ jsx(
11207
+ "div",
11208
+ {
11209
+ role: "presentation",
11210
+ className: clx("w-4px bg-ui-tag-neutral-icon h-full rounded-full", {
11211
+ "bg-ui-tag-orange-icon": variant === "warning"
11212
+ })
11213
+ }
11214
+ ),
11215
+ /* @__PURE__ */ jsxs("div", { className: "text-pretty", children: [
11216
+ /* @__PURE__ */ jsxs("strong", { className: "txt-small-plus text-ui-fg-base", children: [
11217
+ labelValue,
11218
+ ":"
11219
+ ] }),
11220
+ " ",
11221
+ children
11222
+ ] })
11223
+ ]
11224
+ }
11225
+ );
11226
+ }
11227
+ );
11228
+ InlineTip.displayName = "InlineTip";
11229
+ const MetadataFieldSchema = objectType({
11230
+ key: stringType(),
11231
+ disabled: booleanType().optional(),
11232
+ value: anyType()
11233
+ });
11234
+ const MetadataSchema = objectType({
11235
+ metadata: arrayType(MetadataFieldSchema)
11236
+ });
11237
+ const Metadata = () => {
11238
+ const { id } = useParams();
11239
+ const { order, isPending, isError, error } = useOrder(id, {
11240
+ fields: "metadata"
11241
+ });
11242
+ if (isError) {
11243
+ throw error;
11244
+ }
11245
+ const isReady = !isPending && !!order;
11246
+ return /* @__PURE__ */ jsxs(RouteDrawer, { children: [
11247
+ /* @__PURE__ */ jsxs(RouteDrawer.Header, { children: [
11248
+ /* @__PURE__ */ jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Metadata" }) }),
11249
+ /* @__PURE__ */ jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Add metadata to the draft order." }) })
11250
+ ] }),
11251
+ !isReady ? /* @__PURE__ */ jsx(PlaceholderInner, {}) : /* @__PURE__ */ jsx(MetadataForm, { orderId: id, metadata: order == null ? void 0 : order.metadata })
11252
+ ] });
11253
+ };
11254
+ const METADATA_KEY_LABEL_ID = "metadata-form-key-label";
11255
+ const METADATA_VALUE_LABEL_ID = "metadata-form-value-label";
11256
+ const MetadataForm = ({ orderId, metadata }) => {
11257
+ const { handleSuccess } = useRouteModal();
11258
+ const hasUneditableRows = getHasUneditableRows(metadata);
11259
+ const { mutateAsync, isPending } = useUpdateDraftOrder(orderId);
11260
+ const form = useForm({
11261
+ defaultValues: {
11262
+ metadata: getDefaultValues(metadata)
11274
11263
  },
11275
- resolver: zodResolver(schema$3)
11264
+ resolver: zodResolver(MetadataSchema)
11276
11265
  });
11277
- const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
11278
- const { handleSuccess } = useRouteModal();
11279
- const onSubmit = form.handleSubmit(async (data) => {
11266
+ const handleSubmit = form.handleSubmit(async (data) => {
11267
+ const parsedData = parseValues(data);
11280
11268
  await mutateAsync(
11281
11269
  {
11282
- sales_channel_id: data.sales_channel_id
11270
+ metadata: parsedData
11283
11271
  },
11284
11272
  {
11285
11273
  onSuccess: () => {
11286
- toast.success("Sales channel updated");
11274
+ toast.success("Metadata updated");
11287
11275
  handleSuccess();
11288
11276
  },
11289
11277
  onError: (error) => {
@@ -11292,64 +11280,266 @@ const SalesChannelForm = ({ order }) => {
11292
11280
  }
11293
11281
  );
11294
11282
  });
11283
+ const { fields, insert, remove } = useFieldArray({
11284
+ control: form.control,
11285
+ name: "metadata"
11286
+ });
11287
+ function deleteRow(index) {
11288
+ remove(index);
11289
+ if (fields.length === 1) {
11290
+ insert(0, {
11291
+ key: "",
11292
+ value: "",
11293
+ disabled: false
11294
+ });
11295
+ }
11296
+ }
11297
+ function insertRow(index, position) {
11298
+ insert(index + (position === "above" ? 0 : 1), {
11299
+ key: "",
11300
+ value: "",
11301
+ disabled: false
11302
+ });
11303
+ }
11295
11304
  return /* @__PURE__ */ jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxs(
11296
11305
  KeyboundForm,
11297
11306
  {
11307
+ onSubmit: handleSubmit,
11298
11308
  className: "flex flex-1 flex-col overflow-hidden",
11299
- onSubmit,
11300
11309
  children: [
11301
- /* @__PURE__ */ jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsx(SalesChannelField, { control: form.control, order }) }),
11302
- /* @__PURE__ */ jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex justify-end gap-2", children: [
11303
- /* @__PURE__ */ jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
11310
+ /* @__PURE__ */ jsxs(RouteDrawer.Body, { className: "flex flex-1 flex-col gap-y-8 overflow-y-auto", children: [
11311
+ /* @__PURE__ */ jsxs("div", { className: "bg-ui-bg-base shadow-elevation-card-rest grid grid-cols-1 divide-y rounded-lg", children: [
11312
+ /* @__PURE__ */ jsxs("div", { className: "bg-ui-bg-subtle grid grid-cols-2 divide-x rounded-t-lg", children: [
11313
+ /* @__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" }) }),
11314
+ /* @__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" }) })
11315
+ ] }),
11316
+ fields.map((field, index) => {
11317
+ const isDisabled = field.disabled || false;
11318
+ let placeholder = "-";
11319
+ if (typeof field.value === "object") {
11320
+ placeholder = "{ ... }";
11321
+ }
11322
+ if (Array.isArray(field.value)) {
11323
+ placeholder = "[ ... ]";
11324
+ }
11325
+ return /* @__PURE__ */ jsx(
11326
+ ConditionalTooltip,
11327
+ {
11328
+ showTooltip: isDisabled,
11329
+ content: "This row is disabled because it contains non-primitive data.",
11330
+ children: /* @__PURE__ */ jsxs("div", { className: "group/table relative", children: [
11331
+ /* @__PURE__ */ jsxs(
11332
+ "div",
11333
+ {
11334
+ className: clx("grid grid-cols-2 divide-x", {
11335
+ "overflow-hidden rounded-b-lg": index === fields.length - 1
11336
+ }),
11337
+ children: [
11338
+ /* @__PURE__ */ jsx(
11339
+ Form$2.Field,
11340
+ {
11341
+ control: form.control,
11342
+ name: `metadata.${index}.key`,
11343
+ render: ({ field: field2 }) => {
11344
+ return /* @__PURE__ */ jsx(Form$2.Item, { children: /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(
11345
+ GridInput,
11346
+ {
11347
+ "aria-labelledby": METADATA_KEY_LABEL_ID,
11348
+ ...field2,
11349
+ disabled: isDisabled,
11350
+ placeholder: "Key"
11351
+ }
11352
+ ) }) });
11353
+ }
11354
+ }
11355
+ ),
11356
+ /* @__PURE__ */ jsx(
11357
+ Form$2.Field,
11358
+ {
11359
+ control: form.control,
11360
+ name: `metadata.${index}.value`,
11361
+ render: ({ field: { value, ...field2 } }) => {
11362
+ return /* @__PURE__ */ jsx(Form$2.Item, { children: /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(
11363
+ GridInput,
11364
+ {
11365
+ "aria-labelledby": METADATA_VALUE_LABEL_ID,
11366
+ ...field2,
11367
+ value: isDisabled ? placeholder : value,
11368
+ disabled: isDisabled,
11369
+ placeholder: "Value"
11370
+ }
11371
+ ) }) });
11372
+ }
11373
+ }
11374
+ )
11375
+ ]
11376
+ }
11377
+ ),
11378
+ /* @__PURE__ */ jsxs(DropdownMenu, { children: [
11379
+ /* @__PURE__ */ jsx(
11380
+ DropdownMenu.Trigger,
11381
+ {
11382
+ className: clx(
11383
+ "invisible absolute inset-y-0 -right-2.5 my-auto group-hover/table:visible data-[state='open']:visible",
11384
+ {
11385
+ hidden: isDisabled
11386
+ }
11387
+ ),
11388
+ disabled: isDisabled,
11389
+ asChild: true,
11390
+ children: /* @__PURE__ */ jsx(IconButton, { size: "2xsmall", children: /* @__PURE__ */ jsx(EllipsisVertical, {}) })
11391
+ }
11392
+ ),
11393
+ /* @__PURE__ */ jsxs(DropdownMenu.Content, { children: [
11394
+ /* @__PURE__ */ jsxs(
11395
+ DropdownMenu.Item,
11396
+ {
11397
+ className: "gap-x-2",
11398
+ onClick: () => insertRow(index, "above"),
11399
+ children: [
11400
+ /* @__PURE__ */ jsx(ArrowUpMini, { className: "text-ui-fg-subtle" }),
11401
+ "Insert row above"
11402
+ ]
11403
+ }
11404
+ ),
11405
+ /* @__PURE__ */ jsxs(
11406
+ DropdownMenu.Item,
11407
+ {
11408
+ className: "gap-x-2",
11409
+ onClick: () => insertRow(index, "below"),
11410
+ children: [
11411
+ /* @__PURE__ */ jsx(ArrowDownMini, { className: "text-ui-fg-subtle" }),
11412
+ "Insert row below"
11413
+ ]
11414
+ }
11415
+ ),
11416
+ /* @__PURE__ */ jsx(DropdownMenu.Separator, {}),
11417
+ /* @__PURE__ */ jsxs(
11418
+ DropdownMenu.Item,
11419
+ {
11420
+ className: "gap-x-2",
11421
+ onClick: () => deleteRow(index),
11422
+ children: [
11423
+ /* @__PURE__ */ jsx(Trash, { className: "text-ui-fg-subtle" }),
11424
+ "Delete row"
11425
+ ]
11426
+ }
11427
+ )
11428
+ ] })
11429
+ ] })
11430
+ ] })
11431
+ },
11432
+ field.id
11433
+ );
11434
+ })
11435
+ ] }),
11436
+ 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." })
11437
+ ] }),
11438
+ /* @__PURE__ */ jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
11439
+ /* @__PURE__ */ jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", type: "button", children: "Cancel" }) }),
11304
11440
  /* @__PURE__ */ jsx(Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
11305
11441
  ] }) })
11306
11442
  ]
11307
11443
  }
11308
11444
  ) });
11309
11445
  };
11310
- const SalesChannelField = ({ control, order }) => {
11311
- const salesChannels = useComboboxData({
11312
- queryFn: async (params) => {
11313
- return await sdk.admin.salesChannel.list(params);
11314
- },
11315
- queryKey: ["sales-channels"],
11316
- getOptions: (data) => {
11317
- return data.sales_channels.map((salesChannel) => ({
11318
- label: salesChannel.name,
11319
- value: salesChannel.id
11320
- }));
11321
- },
11322
- defaultValue: order.sales_channel_id || void 0
11323
- });
11446
+ const GridInput = forwardRef(({ className, ...props }, ref) => {
11324
11447
  return /* @__PURE__ */ jsx(
11325
- Form$2.Field,
11448
+ "input",
11326
11449
  {
11327
- control,
11328
- name: "sales_channel_id",
11329
- render: ({ field }) => {
11330
- return /* @__PURE__ */ jsxs(Form$2.Item, { children: [
11331
- /* @__PURE__ */ jsx(Form$2.Label, { children: "Sales Channel" }),
11332
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(
11333
- Combobox,
11334
- {
11335
- options: salesChannels.options,
11336
- fetchNextPage: salesChannels.fetchNextPage,
11337
- isFetchingNextPage: salesChannels.isFetchingNextPage,
11338
- searchValue: salesChannels.searchValue,
11339
- onSearchValueChange: salesChannels.onSearchValueChange,
11340
- placeholder: "Select sales channel",
11341
- ...field
11342
- }
11343
- ) }),
11344
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
11345
- ] });
11450
+ ref,
11451
+ ...props,
11452
+ autoComplete: "off",
11453
+ className: clx(
11454
+ "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",
11455
+ className
11456
+ )
11457
+ }
11458
+ );
11459
+ });
11460
+ GridInput.displayName = "MetadataForm.GridInput";
11461
+ const PlaceholderInner = () => {
11462
+ return /* @__PURE__ */ jsxs("div", { className: "flex flex-1 flex-col overflow-hidden", children: [
11463
+ /* @__PURE__ */ jsx(RouteDrawer.Body, { children: /* @__PURE__ */ jsx(Skeleton, { className: "h-[148ox] w-full rounded-lg" }) }),
11464
+ /* @__PURE__ */ jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
11465
+ /* @__PURE__ */ jsx(Skeleton, { className: "h-7 w-12 rounded-md" }),
11466
+ /* @__PURE__ */ jsx(Skeleton, { className: "h-7 w-12 rounded-md" })
11467
+ ] }) })
11468
+ ] });
11469
+ };
11470
+ const EDITABLE_TYPES = ["string", "number", "boolean"];
11471
+ function getDefaultValues(metadata) {
11472
+ if (!metadata || !Object.keys(metadata).length) {
11473
+ return [
11474
+ {
11475
+ key: "",
11476
+ value: "",
11477
+ disabled: false
11478
+ }
11479
+ ];
11480
+ }
11481
+ return Object.entries(metadata).map(([key, value]) => {
11482
+ if (!EDITABLE_TYPES.includes(typeof value)) {
11483
+ return {
11484
+ key,
11485
+ value,
11486
+ disabled: true
11487
+ };
11488
+ }
11489
+ let stringValue = value;
11490
+ if (typeof value !== "string") {
11491
+ stringValue = JSON.stringify(value);
11492
+ }
11493
+ return {
11494
+ key,
11495
+ value: stringValue,
11496
+ original_key: key
11497
+ };
11498
+ });
11499
+ }
11500
+ function parseValues(values) {
11501
+ const metadata = values.metadata;
11502
+ const isEmpty = !metadata.length || metadata.length === 1 && !metadata[0].key && !metadata[0].value;
11503
+ if (isEmpty) {
11504
+ return null;
11505
+ }
11506
+ const update = {};
11507
+ metadata.forEach((field) => {
11508
+ let key = field.key;
11509
+ let value = field.value;
11510
+ const disabled = field.disabled;
11511
+ if (!key || !value) {
11512
+ return;
11513
+ }
11514
+ if (disabled) {
11515
+ update[key] = value;
11516
+ return;
11517
+ }
11518
+ key = key.trim();
11519
+ value = value.trim();
11520
+ if (value === "true") {
11521
+ update[key] = true;
11522
+ } else if (value === "false") {
11523
+ update[key] = false;
11524
+ } else {
11525
+ const parsedNumber = parseFloat(value);
11526
+ if (!isNaN(parsedNumber)) {
11527
+ update[key] = parsedNumber;
11528
+ } else {
11529
+ update[key] = value;
11346
11530
  }
11347
11531
  }
11532
+ });
11533
+ return update;
11534
+ }
11535
+ function getHasUneditableRows(metadata) {
11536
+ if (!metadata) {
11537
+ return false;
11538
+ }
11539
+ return Object.values(metadata).some(
11540
+ (value) => !EDITABLE_TYPES.includes(typeof value)
11348
11541
  );
11349
- };
11350
- const schema$3 = objectType({
11351
- sales_channel_id: stringType().min(1)
11352
- });
11542
+ }
11353
11543
  const STACKED_FOCUS_MODAL_ID = "shipping-form";
11354
11544
  const Shipping = () => {
11355
11545
  var _a;
@@ -12189,7 +12379,7 @@ const ShippingAddressForm = ({ order }) => {
12189
12379
  postal_code: ((_i = order.shipping_address) == null ? void 0 : _i.postal_code) ?? "",
12190
12380
  phone: ((_j = order.shipping_address) == null ? void 0 : _j.phone) ?? ""
12191
12381
  },
12192
- resolver: zodResolver(schema$2)
12382
+ resolver: zodResolver(schema$1)
12193
12383
  });
12194
12384
  const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
12195
12385
  const { handleSuccess } = useRouteModal();
@@ -12359,7 +12549,7 @@ const ShippingAddressForm = ({ order }) => {
12359
12549
  }
12360
12550
  ) });
12361
12551
  };
12362
- const schema$2 = addressSchema;
12552
+ const schema$1 = addressSchema;
12363
12553
  const TransferOwnership = () => {
12364
12554
  const { id } = useParams();
12365
12555
  const { draft_order, isPending, isError, error } = useDraftOrder(id, {
@@ -12383,7 +12573,7 @@ const TransferOwnershipForm = ({ order }) => {
12383
12573
  defaultValues: {
12384
12574
  customer_id: order.customer_id || ""
12385
12575
  },
12386
- resolver: zodResolver(schema$1)
12576
+ resolver: zodResolver(schema)
12387
12577
  });
12388
12578
  const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
12389
12579
  const { handleSuccess } = useRouteModal();
@@ -12833,199 +13023,9 @@ const Illustration = () => {
12833
13023
  }
12834
13024
  );
12835
13025
  };
12836
- const schema$1 = objectType({
13026
+ const schema = objectType({
12837
13027
  customer_id: stringType().min(1)
12838
13028
  });
12839
- const BillingAddress = () => {
12840
- const { id } = useParams();
12841
- const { order, isPending, isError, error } = useOrder(id, {
12842
- fields: "+billing_address"
12843
- });
12844
- if (isError) {
12845
- throw error;
12846
- }
12847
- const isReady = !isPending && !!order;
12848
- return /* @__PURE__ */ jsxs(RouteDrawer, { children: [
12849
- /* @__PURE__ */ jsxs(RouteDrawer.Header, { children: [
12850
- /* @__PURE__ */ jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Edit Billing Address" }) }),
12851
- /* @__PURE__ */ jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Edit the billing address for the draft order" }) })
12852
- ] }),
12853
- isReady && /* @__PURE__ */ jsx(BillingAddressForm, { order })
12854
- ] });
12855
- };
12856
- const BillingAddressForm = ({ order }) => {
12857
- var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
12858
- const form = useForm({
12859
- defaultValues: {
12860
- first_name: ((_a = order.billing_address) == null ? void 0 : _a.first_name) ?? "",
12861
- last_name: ((_b = order.billing_address) == null ? void 0 : _b.last_name) ?? "",
12862
- company: ((_c = order.billing_address) == null ? void 0 : _c.company) ?? "",
12863
- address_1: ((_d = order.billing_address) == null ? void 0 : _d.address_1) ?? "",
12864
- address_2: ((_e = order.billing_address) == null ? void 0 : _e.address_2) ?? "",
12865
- city: ((_f = order.billing_address) == null ? void 0 : _f.city) ?? "",
12866
- province: ((_g = order.billing_address) == null ? void 0 : _g.province) ?? "",
12867
- country_code: ((_h = order.billing_address) == null ? void 0 : _h.country_code) ?? "",
12868
- postal_code: ((_i = order.billing_address) == null ? void 0 : _i.postal_code) ?? "",
12869
- phone: ((_j = order.billing_address) == null ? void 0 : _j.phone) ?? ""
12870
- },
12871
- resolver: zodResolver(schema)
12872
- });
12873
- const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
12874
- const { handleSuccess } = useRouteModal();
12875
- const onSubmit = form.handleSubmit(async (data) => {
12876
- await mutateAsync(
12877
- { billing_address: data },
12878
- {
12879
- onSuccess: () => {
12880
- handleSuccess();
12881
- },
12882
- onError: (error) => {
12883
- toast.error(error.message);
12884
- }
12885
- }
12886
- );
12887
- });
12888
- return /* @__PURE__ */ jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxs(
12889
- KeyboundForm,
12890
- {
12891
- className: "flex flex-1 flex-col overflow-hidden",
12892
- onSubmit,
12893
- children: [
12894
- /* @__PURE__ */ jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-y-4", children: [
12895
- /* @__PURE__ */ jsx(
12896
- Form$2.Field,
12897
- {
12898
- control: form.control,
12899
- name: "country_code",
12900
- render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
12901
- /* @__PURE__ */ jsx(Form$2.Label, { children: "Country" }),
12902
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(CountrySelect, { ...field }) }),
12903
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
12904
- ] })
12905
- }
12906
- ),
12907
- /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
12908
- /* @__PURE__ */ jsx(
12909
- Form$2.Field,
12910
- {
12911
- control: form.control,
12912
- name: "first_name",
12913
- render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
12914
- /* @__PURE__ */ jsx(Form$2.Label, { children: "First name" }),
12915
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
12916
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
12917
- ] })
12918
- }
12919
- ),
12920
- /* @__PURE__ */ jsx(
12921
- Form$2.Field,
12922
- {
12923
- control: form.control,
12924
- name: "last_name",
12925
- render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
12926
- /* @__PURE__ */ jsx(Form$2.Label, { children: "Last name" }),
12927
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
12928
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
12929
- ] })
12930
- }
12931
- )
12932
- ] }),
12933
- /* @__PURE__ */ jsx(
12934
- Form$2.Field,
12935
- {
12936
- control: form.control,
12937
- name: "company",
12938
- render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
12939
- /* @__PURE__ */ jsx(Form$2.Label, { optional: true, children: "Company" }),
12940
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
12941
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
12942
- ] })
12943
- }
12944
- ),
12945
- /* @__PURE__ */ jsx(
12946
- Form$2.Field,
12947
- {
12948
- control: form.control,
12949
- name: "address_1",
12950
- render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
12951
- /* @__PURE__ */ jsx(Form$2.Label, { children: "Address" }),
12952
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
12953
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
12954
- ] })
12955
- }
12956
- ),
12957
- /* @__PURE__ */ jsx(
12958
- Form$2.Field,
12959
- {
12960
- control: form.control,
12961
- name: "address_2",
12962
- render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
12963
- /* @__PURE__ */ jsx(Form$2.Label, { optional: true, children: "Apartment, suite, etc." }),
12964
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
12965
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
12966
- ] })
12967
- }
12968
- ),
12969
- /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
12970
- /* @__PURE__ */ jsx(
12971
- Form$2.Field,
12972
- {
12973
- control: form.control,
12974
- name: "postal_code",
12975
- render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
12976
- /* @__PURE__ */ jsx(Form$2.Label, { children: "Postal code" }),
12977
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
12978
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
12979
- ] })
12980
- }
12981
- ),
12982
- /* @__PURE__ */ jsx(
12983
- Form$2.Field,
12984
- {
12985
- control: form.control,
12986
- name: "city",
12987
- render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
12988
- /* @__PURE__ */ jsx(Form$2.Label, { children: "City" }),
12989
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
12990
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
12991
- ] })
12992
- }
12993
- )
12994
- ] }),
12995
- /* @__PURE__ */ jsx(
12996
- Form$2.Field,
12997
- {
12998
- control: form.control,
12999
- name: "province",
13000
- render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
13001
- /* @__PURE__ */ jsx(Form$2.Label, { optional: true, children: "Province / State" }),
13002
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
13003
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
13004
- ] })
13005
- }
13006
- ),
13007
- /* @__PURE__ */ jsx(
13008
- Form$2.Field,
13009
- {
13010
- control: form.control,
13011
- name: "phone",
13012
- render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
13013
- /* @__PURE__ */ jsx(Form$2.Label, { optional: true, children: "Phone" }),
13014
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
13015
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
13016
- ] })
13017
- }
13018
- )
13019
- ] }) }),
13020
- /* @__PURE__ */ jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex justify-end gap-2", children: [
13021
- /* @__PURE__ */ jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
13022
- /* @__PURE__ */ jsx(Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
13023
- ] }) })
13024
- ]
13025
- }
13026
- ) });
13027
- };
13028
- const schema = addressSchema;
13029
13029
  const widgetModule = { widgets: [] };
13030
13030
  const routeModule = {
13031
13031
  routes: [
@@ -13046,6 +13046,10 @@ const routeModule = {
13046
13046
  handle,
13047
13047
  loader,
13048
13048
  children: [
13049
+ {
13050
+ Component: BillingAddress,
13051
+ path: "/draft-orders/:id/billing-address"
13052
+ },
13049
13053
  {
13050
13054
  Component: CustomItems,
13051
13055
  path: "/draft-orders/:id/custom-items"
@@ -13058,10 +13062,6 @@ const routeModule = {
13058
13062
  Component: Items,
13059
13063
  path: "/draft-orders/:id/items"
13060
13064
  },
13061
- {
13062
- Component: Metadata,
13063
- path: "/draft-orders/:id/metadata"
13064
- },
13065
13065
  {
13066
13066
  Component: Promotions,
13067
13067
  path: "/draft-orders/:id/promotions"
@@ -13070,6 +13070,10 @@ const routeModule = {
13070
13070
  Component: SalesChannel,
13071
13071
  path: "/draft-orders/:id/sales-channel"
13072
13072
  },
13073
+ {
13074
+ Component: Metadata,
13075
+ path: "/draft-orders/:id/metadata"
13076
+ },
13073
13077
  {
13074
13078
  Component: Shipping,
13075
13079
  path: "/draft-orders/:id/shipping"
@@ -13081,10 +13085,6 @@ const routeModule = {
13081
13085
  {
13082
13086
  Component: TransferOwnership,
13083
13087
  path: "/draft-orders/:id/transfer-ownership"
13084
- },
13085
- {
13086
- Component: BillingAddress,
13087
- path: "/draft-orders/:id/billing-address"
13088
13088
  }
13089
13089
  ]
13090
13090
  }