import "./chunk-TKGWSUEI.js";
import {
  KeyboundForm
} from "./chunk-U2ZFCAPX.js";
import {
  useDocumentDirection
} from "./chunk-Y7QKP6QU.js";
import {
  languages
} from "./chunk-XQNVC4Q7.js";
import {
  RouteDrawer,
  useRouteModal
} from "./chunk-OV7R2AH5.js";
import {
  Form
} from "./chunk-3QSRE5LS.js";
import {
  useMe,
  useUpdateUser
} from "./chunk-XKVXLDSJ.js";
import "./chunk-RHKRREUU.js";
import "./chunk-ZA2KFUFR.js";
import "./chunk-RIN4CBRB.js";
import "./chunk-NBMM2TZK.js";

// src/pages/profile/profile-edit/profile-edit.tsx
import { Heading } from "@medusajs/ui";
import { useTranslation as useTranslation2 } from "react-i18next";

// src/pages/profile/profile-edit/components/edit-profile-form/edit-profile-form.tsx
import { zodResolver } from "@hookform/resolvers/zod";
import { Button, Input, Select, toast } from "@medusajs/ui";
import { useForm } from "react-hook-form";
import { useTranslation } from "react-i18next";
import * as zod from "zod";
import { jsx, jsxs } from "react/jsx-runtime";
var EditProfileSchema = zod.object({
  first_name: zod.string().optional(),
  last_name: zod.string().optional(),
  language: zod.string()
  // usage_insights: zod.boolean(),
});
var EditProfileForm = ({ user }) => {
  const { t, i18n } = useTranslation();
  const { handleSuccess } = useRouteModal();
  const direction = useDocumentDirection();
  const form = useForm({
    defaultValues: {
      first_name: user.first_name ?? "",
      last_name: user.last_name ?? "",
      language: i18n.language
      // usage_insights: usageInsights,
    },
    resolver: zodResolver(EditProfileSchema)
  });
  const changeLanguage = async (code) => {
    await i18n.changeLanguage(code);
  };
  const sortedLanguages = languages.sort(
    (a, b) => a.display_name.localeCompare(b.display_name)
  );
  const { mutateAsync, isPending } = useUpdateUser(user.id);
  const handleSubmit = form.handleSubmit(async (values) => {
    await mutateAsync(
      {
        first_name: values.first_name,
        last_name: values.last_name
      },
      {
        onError: (error) => {
          toast.error(error.message);
          return;
        }
      }
    );
    await changeLanguage(values.language);
    toast.success(t("profile.toast.edit"));
    handleSuccess();
  });
  return /* @__PURE__ */ jsx(RouteDrawer.Form, { form, "data-testid": "profile-edit-form", children: /* @__PURE__ */ jsxs(KeyboundForm, { onSubmit: handleSubmit, className: "flex flex-1 flex-col", children: [
    /* @__PURE__ */ jsx(RouteDrawer.Body, { "data-testid": "profile-edit-body", children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-y-8", children: [
      /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
        /* @__PURE__ */ jsx(
          Form.Field,
          {
            control: form.control,
            name: "first_name",
            render: ({ field }) => /* @__PURE__ */ jsxs(Form.Item, { "data-testid": "profile-edit-first-name-item", children: [
              /* @__PURE__ */ jsx(Form.Label, { "data-testid": "profile-edit-first-name-label", children: t("fields.firstName") }),
              /* @__PURE__ */ jsx(Form.Control, { "data-testid": "profile-edit-first-name-control", children: /* @__PURE__ */ jsx(Input, { ...field, "data-testid": "profile-edit-first-name-input" }) }),
              /* @__PURE__ */ jsx(Form.ErrorMessage, { "data-testid": "profile-edit-first-name-error" })
            ] })
          }
        ),
        /* @__PURE__ */ jsx(
          Form.Field,
          {
            control: form.control,
            name: "last_name",
            render: ({ field }) => /* @__PURE__ */ jsxs(Form.Item, { "data-testid": "profile-edit-last-name-item", children: [
              /* @__PURE__ */ jsx(Form.Label, { "data-testid": "profile-edit-last-name-label", children: t("fields.lastName") }),
              /* @__PURE__ */ jsx(Form.Control, { "data-testid": "profile-edit-last-name-control", children: /* @__PURE__ */ jsx(Input, { ...field, "data-testid": "profile-edit-last-name-input" }) }),
              /* @__PURE__ */ jsx(Form.ErrorMessage, { "data-testid": "profile-edit-last-name-error" })
            ] })
          }
        )
      ] }),
      /* @__PURE__ */ jsx(
        Form.Field,
        {
          control: form.control,
          name: "language",
          render: ({ field: { ref, ...field } }) => /* @__PURE__ */ jsxs(Form.Item, { className: "gap-y-4", "data-testid": "profile-edit-language-item", children: [
            /* @__PURE__ */ jsxs("div", { children: [
              /* @__PURE__ */ jsx(Form.Label, { "data-testid": "profile-edit-language-label", children: t("profile.fields.languageLabel") }),
              /* @__PURE__ */ jsx(Form.Hint, { "data-testid": "profile-edit-language-hint", children: t("profile.edit.languageHint") })
            ] }),
            /* @__PURE__ */ jsxs("div", { children: [
              /* @__PURE__ */ jsx(Form.Control, { "data-testid": "profile-edit-language-control", children: /* @__PURE__ */ jsxs(
                Select,
                {
                  dir: direction,
                  ...field,
                  onValueChange: field.onChange,
                  "data-testid": "profile-edit-language-select",
                  children: [
                    /* @__PURE__ */ jsx(Select.Trigger, { ref, className: "py-1 text-[13px]", "data-testid": "profile-edit-language-trigger", children: /* @__PURE__ */ jsx(
                      Select.Value,
                      {
                        placeholder: t("profile.edit.languagePlaceholder"),
                        children: sortedLanguages.find(
                          (language) => language.code === field.value
                        )?.display_name
                      }
                    ) }),
                    /* @__PURE__ */ jsx(Select.Content, { "data-testid": "profile-edit-language-content", children: languages.map((language) => /* @__PURE__ */ jsx(
                      Select.Item,
                      {
                        value: language.code,
                        "data-testid": `profile-edit-language-option-${language.code}`,
                        children: language.display_name
                      },
                      language.code
                    )) })
                  ]
                }
              ) }),
              /* @__PURE__ */ jsx(Form.ErrorMessage, { "data-testid": "profile-edit-language-error" })
            ] })
          ] })
        }
      )
    ] }) }),
    /* @__PURE__ */ jsx(RouteDrawer.Footer, { "data-testid": "profile-edit-footer", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-x-2", children: [
      /* @__PURE__ */ jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", "data-testid": "profile-edit-cancel-button", children: t("actions.cancel") }) }),
      /* @__PURE__ */ jsx(Button, { size: "small", type: "submit", isLoading: isPending, "data-testid": "profile-edit-save-button", children: t("actions.save") })
    ] }) })
  ] }) });
};

// src/pages/profile/profile-edit/profile-edit.tsx
import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
var ProfileEdit = () => {
  const { user, isPending: isLoading, isError, error } = useMe();
  const { t } = useTranslation2();
  if (isError) {
    throw error;
  }
  return /* @__PURE__ */ jsxs2(RouteDrawer, { "data-testid": "profile-edit-drawer", children: [
    /* @__PURE__ */ jsx2(RouteDrawer.Header, { className: "capitalize", "data-testid": "profile-edit-drawer-header", children: /* @__PURE__ */ jsx2(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsx2(Heading, { "data-testid": "profile-edit-drawer-title", children: t("profile.edit.header") }) }) }),
    !isLoading && user && /* @__PURE__ */ jsx2(EditProfileForm, { user })
  ] });
};
export {
  ProfileEdit as Component
};
