@greatapps/common 1.1.676 → 1.1.678

package/dist/components/account/sections/ChangePhoneModal.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/account/sections/ChangePhoneModal.tsx"],"sourcesContent":["'use client';\n\nimport { IconChevronLeft, IconX, IconMessage } from '@tabler/icons-react';\nimport { Button } from '../../ui/buttons/Button';\nimport { Dialog, DialogContent, DialogHeader, DialogTitle } from '../../ui/overlay/Dialog';\nimport { Separator } from '../../ui/data-display/Separator';\nimport { InputOTP, InputOTPGroup, InputOTPSlot } from '../../ui/form/InputOtp';\nimport PhoneInput from '../../ui/form/PhoneInput';\nimport { formatTimer, formatPhone } from '../../../utils/format/masks';\nimport { OTP_CODE_LENGTH, OTP_ALPHANUMERIC_PATTERN } from '../../../utils/validators/account';\nimport { useAuth } from '../../../providers/auth.provider';\nimport { useInvalidateUser } from '../../../modules/auth/hooks/useUserQuery';\nimport { confirmPhoneChangeAction } from '../../../modules/accounts/actions/account-management.action';\nimport useChangePhoneForm from '../hooks/useChangePhoneForm';\nimport useOtpVerification from '../hooks/useOtpVerification';\n\ninterface ChangePhoneModalProps {\n  open: boolean;\n  onClose: () => void;\n}\n\nexport function ChangePhoneModal({ open, onClose }: ChangePhoneModalProps) {\n  const { user } = useAuth();\n  const invalidateUser = useInvalidateUser();\n\n  const hasExistingPhone = !!user?.phone;\n\n  const currentPhoneDisplay = user?.phone\n    ? formatPhone(\n        user.ddi && user.phone.startsWith(user.ddi) ? user.phone.slice(user.ddi.length) : user.phone\n      )\n    : '';\n\n  const handleDirectUpdateSuccess = () => {\n    invalidateUser();\n    onClose();\n  };\n\n  const {\n    showVerification,\n    phoneValue,\n    phoneError,\n    isSubmitting,\n    submittedPhone,\n    handlePhoneChange,\n    handleContinue,\n    handleBack,\n    resetForm,\n  } = useChangePhoneForm({\n    hasExistingPhone,\n    onDirectUpdateSuccess: handleDirectUpdateSuccess,\n  });\n\n  const handleSuccess = () => {\n    invalidateUser();\n    resetForm();\n    onClose();\n  };\n\n  const {\n    code,\n    isLoading,\n    hasError,\n    timer,\n    canResend,\n    isValidLength,\n    handleCodeChange,\n    handleValidate,\n    handleResend,\n    reset: resetOtp,\n  } = useOtpVerification({\n    onSuccess: handleSuccess,\n    successMessage: 'Telefone alterado',\n    validateFn: async (token) => {\n      const result = await confirmPhoneChangeAction(token, submittedPhone.local, submittedPhone.ddi);\n      return result.success;\n    },\n    resendFn: async () => {\n      const { requestPhoneChangeAction } = await import('../../../modules/accounts/actions/account-management.action');\n      const result = await requestPhoneChangeAction(submittedPhone.local, submittedPhone.ddi);\n      if (!result.success) {\n        throw new Error(result.error);\n      }\n    },\n  });\n\n  const handleClose = () => {\n    resetForm();\n    resetOtp();\n    onClose();\n  };\n\n  const handleBackFromVerification = () => {\n    resetOtp();\n    handleBack();\n  };\n\n  return (\n    <Dialog open={open} onOpenChange={handleClose}>\n      <DialogContent\n        showCloseButton={false}\n        overlayClassName=\"z-[1002]\"\n        className=\"flex flex-col p-0 gap-0 max-w-full sm:max-w-full border-0 rounded-t-2xl rounded-b-none h-dvh top-0 bottom-0 left-0 right-0 translate-x-0 translate-y-0 lg:max-w-125 lg:h-auto lg:rounded-lg lg:border lg:top-[50%] lg:left-[50%] lg:right-auto lg:bottom-auto lg:translate-x-[-50%] lg:translate-y-[-50%] z-[1003]\"\n      >\n        {showVerification ? (\n          <DialogHeader className=\"flex flex-row items-center justify-between px-4 py-3 border-b border-gray-200 lg:border-b-0\">\n            <Button variant=\"ghost\" className=\"size-8! p-0\" onClick={handleBackFromVerification}>\n              <IconChevronLeft size={20} className=\"text-gray-950\" />\n            </Button>\n            <DialogTitle className=\"paragraph-medium-semibold text-gray-950 text-center flex-1\">\n              Alterar telefone\n            </DialogTitle>\n            <Button variant=\"ghost\" className=\"size-8! p-0\" onClick={handleClose}>\n              <IconX size={18} className=\"text-gray-500\" />\n            </Button>\n          </DialogHeader>\n        ) : (\n          <>\n            <DialogHeader className=\"sr-only\">\n              <DialogTitle>{hasExistingPhone ? 'Alterar telefone' : 'Adicionar telefone'}</DialogTitle>\n            </DialogHeader>\n            <div className=\"flex items-center justify-center px-4 py-3 relative border-b border-gray-200 lg:border-b-0\">\n              <span className=\"paragraph-medium-semibold text-gray-950 text-center\">\n                {hasExistingPhone ? 'Alterar telefone' : 'Adicionar telefone'}\n              </span>\n              <Button\n                variant=\"ghost\"\n                className=\"absolute right-2 size-8! p-0\"\n                onClick={handleClose}\n              >\n                <IconX size={18} className=\"text-gray-500\" />\n              </Button>\n            </div>\n          </>\n        )}\n\n        <div className={`${showVerification || !hasExistingPhone ? 'w-full' : 'w-1/2'} h-0.75 bg-primary`} />\n\n        {showVerification ? (\n          <form\n            onSubmit={(e) => {\n              e.preventDefault();\n              handleValidate();\n            }}\n            className=\"flex flex-col flex-1 lg:flex-none\"\n          >\n            <div className=\"px-4 lg:px-5 py-5 lg:py-6 flex flex-col gap-4 flex-1 lg:flex-none\">\n              <div className=\"flex items-center justify-center size-12 bg-white rounded-lg shadow-xs border border-gray-200\">\n                <IconMessage size={20} className=\"text-gray-950\" />\n              </div>\n\n              <div className=\"flex flex-col gap-1\">\n                <h3 className=\"paragraph-medium-semibold text-gray-950\">Código de validação</h3>\n                <p className=\"paragraph-small-regular text-gray-600\">\n                  Enviamos um código de validação para o número atual{' '}\n                  <span className=\"font-semibold text-gray-950\">{currentPhoneDisplay}.</span>\n                </p>\n              </div>\n\n              <div className=\"flex flex-col gap-2\">\n                <InputOTP maxLength={OTP_CODE_LENGTH} pattern={OTP_ALPHANUMERIC_PATTERN} value={code} onChange={handleCodeChange}>\n                  <InputOTPGroup className=\"flex flex-row gap-2\">\n                    {[...Array(OTP_CODE_LENGTH)].map((_, i) => (\n                      <InputOTPSlot\n                        key={i}\n                        index={i}\n                        className={`uppercase text-2xl font-medium w-11 lg:w-12 h-13 lg:h-14 rounded-lg border bg-white shadow-none [&_div.animate-caret-blink]:bg-gray-950 ${hasError ? 'border-red-500' : 'border-gray-200'}`}\n                      />\n                    ))}\n                  </InputOTPGroup>\n                </InputOTP>\n                {hasError && (\n                  <p className=\"paragraph-small-regular text-red-500\">Código incorreto</p>\n                )}\n              </div>\n\n              {canResend ? (\n                <button\n                  type=\"button\"\n                  onClick={handleResend}\n                  className=\"paragraph-small-medium text-gray-950 underline cursor-pointer hover:text-gray-700 w-fit\"\n                >\n                  Reenviar código\n                </button>\n              ) : (\n                <p className=\"paragraph-small-regular text-gray-500\">\n                  Reenviar em{' '}\n                  <span className=\"paragraph-small-semibold text-gray-950\">\n                    {formatTimer(timer)}\n                  </span>\n                </p>\n              )}\n            </div>\n\n            <Separator />\n\n            <div className=\"flex items-center justify-between px-4 lg:px-5 py-4 lg:py-5 mt-auto lg:mt-0\">\n              <Button variant=\"secondary\" className=\"h-10!\" type=\"button\" onClick={handleClose}>\n                Cancelar\n              </Button>\n              <Button className=\"h-10!\" type=\"submit\" disabled={!isValidLength || isLoading}>\n                {isLoading ? 'Validando...' : 'Alterar telefone'}\n              </Button>\n            </div>\n          </form>\n        ) : (\n          <form onSubmit={handleContinue} className=\"flex flex-col flex-1 lg:flex-none\">\n            <div className=\"flex flex-col gap-5 lg:gap-6 px-4 lg:px-5 py-5 lg:py-6 flex-1 lg:flex-none\">\n              <div className=\"flex flex-col gap-1\">\n                <span className=\"paragraph-medium-semibold text-gray-950\">\n                  {hasExistingPhone ? 'Atualizar telefone de contato' : 'Adicionar telefone de contato'}\n                </span>\n                <span className=\"paragraph-small-regular text-gray-600\">\n                  {hasExistingPhone\n                    ? 'Informe o novo número para manter seu contato atualizado.'\n                    : 'Informe seu número de telefone para contato.'}\n                </span>\n              </div>\n\n              <PhoneInput\n                label={hasExistingPhone ? 'Novo número' : 'Número de telefone'}\n                placeholder=\"(00) 0 0000-0000\"\n                value={phoneValue}\n                onChange={handlePhoneChange}\n                error={!!phoneError}\n                errorMessage={phoneError}\n              />\n            </div>\n\n            <div className=\"flex items-center justify-between p-4 lg:p-5 border-t border-gray-200 mt-auto lg:mt-0\">\n              <Button variant=\"secondary\" className=\"h-10!\" type=\"button\" onClick={handleClose}>\n                Cancelar\n              </Button>\n              <Button className=\"h-10!\" type=\"submit\" disabled={isSubmitting}>\n                {isSubmitting\n                  ? (hasExistingPhone ? 'Enviando...' : 'Salvando...')\n                  : (hasExistingPhone ? 'Continuar' : 'Salvar')}\n              </Button>\n            </div>\n          </form>\n        )}\n      </DialogContent>\n    </Dialog>\n  );\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../../../src/components/account/sections/ChangePhoneModal.tsx"],"sourcesContent":["'use client';\n\nimport { useTranslations } from 'next-intl';\nimport { IconChevronLeft, IconX, IconMessage } from '@tabler/icons-react';\nimport { Button } from '../../ui/buttons/Button';\nimport { Dialog, DialogContent, DialogHeader, DialogTitle } from '../../ui/overlay/Dialog';\nimport { Separator } from '../../ui/data-display/Separator';\nimport { InputOTP, InputOTPGroup, InputOTPSlot } from '../../ui/form/InputOtp';\nimport PhoneInput from '../../ui/form/PhoneInput';\nimport { formatTimer, formatPhone } from '../../../utils/format/masks';\nimport { OTP_CODE_LENGTH, OTP_ALPHANUMERIC_PATTERN } from '../../../utils/validators/account';\nimport { useAuth } from '../../../providers/auth.provider';\nimport { useInvalidateUser } from '../../../modules/auth/hooks/useUserQuery';\nimport { confirmPhoneChangeAction } from '../../../modules/accounts/actions/account-management.action';\nimport useChangePhoneForm from '../hooks/useChangePhoneForm';\nimport useOtpVerification from '../hooks/useOtpVerification';\n\ninterface ChangePhoneModalProps {\n  open: boolean;\n  onClose: () => void;\n}\n\nexport function ChangePhoneModal({ open, onClose }: ChangePhoneModalProps) {\n  const translate = useTranslations();\n  const { user } = useAuth();\n  const invalidateUser = useInvalidateUser();\n\n  const hasExistingPhone = !!user?.phone;\n\n  const currentPhoneDisplay = user?.phone\n    ? formatPhone(\n        user.ddi && user.phone.startsWith(user.ddi) ? user.phone.slice(user.ddi.length) : user.phone\n      )\n    : '';\n\n  const handleDirectUpdateSuccess = () => {\n    invalidateUser();\n    onClose();\n  };\n\n  const {\n    showVerification,\n    phoneValue,\n    phoneError,\n    isSubmitting,\n    submittedPhone,\n    handlePhoneChange,\n    handleContinue,\n    handleBack,\n    resetForm,\n  } = useChangePhoneForm({\n    hasExistingPhone,\n    onDirectUpdateSuccess: handleDirectUpdateSuccess,\n  });\n\n  const handleSuccess = () => {\n    invalidateUser();\n    resetForm();\n    onClose();\n  };\n\n  const {\n    code,\n    isLoading,\n    hasError,\n    timer,\n    canResend,\n    isValidLength,\n    handleCodeChange,\n    handleValidate,\n    handleResend,\n    reset: resetOtp,\n  } = useOtpVerification({\n    onSuccess: handleSuccess,\n    successMessage: translate('common.account.changePhone.phoneChanged'),\n    validateFn: async (token) => {\n      const result = await confirmPhoneChangeAction(token, submittedPhone.local, submittedPhone.ddi);\n      return result.success;\n    },\n    resendFn: async () => {\n      const { requestPhoneChangeAction } = await import('../../../modules/accounts/actions/account-management.action');\n      const result = await requestPhoneChangeAction(submittedPhone.local, submittedPhone.ddi);\n      if (!result.success) {\n        throw new Error(result.error);\n      }\n    },\n  });\n\n  const handleClose = () => {\n    resetForm();\n    resetOtp();\n    onClose();\n  };\n\n  const handleBackFromVerification = () => {\n    resetOtp();\n    handleBack();\n  };\n\n  return (\n    <Dialog open={open} onOpenChange={handleClose}>\n      <DialogContent\n        showCloseButton={false}\n        overlayClassName=\"z-[1002]\"\n        className=\"flex flex-col p-0 gap-0 max-w-full sm:max-w-full border-0 rounded-t-2xl rounded-b-none h-dvh top-0 bottom-0 left-0 right-0 translate-x-0 translate-y-0 lg:max-w-125 lg:h-auto lg:rounded-lg lg:border lg:top-[50%] lg:left-[50%] lg:right-auto lg:bottom-auto lg:translate-x-[-50%] lg:translate-y-[-50%] z-[1003]\"\n      >\n        {showVerification ? (\n          <DialogHeader className=\"flex flex-row items-center justify-between px-4 py-3 border-b border-gray-200 lg:border-b-0\">\n            <Button variant=\"ghost\" className=\"size-8! p-0\" onClick={handleBackFromVerification}>\n              <IconChevronLeft size={20} className=\"text-gray-950\" />\n            </Button>\n            <DialogTitle className=\"paragraph-medium-semibold text-gray-950 text-center flex-1\">\n              {translate('common.account.changePhone.titleEdit')}\n            </DialogTitle>\n            <Button variant=\"ghost\" className=\"size-8! p-0\" onClick={handleClose}>\n              <IconX size={18} className=\"text-gray-500\" />\n            </Button>\n          </DialogHeader>\n        ) : (\n          <>\n            <DialogHeader className=\"sr-only\">\n              <DialogTitle>\n                {hasExistingPhone\n                  ? translate('common.account.changePhone.titleEdit')\n                  : translate('common.account.changePhone.titleAdd')}\n              </DialogTitle>\n            </DialogHeader>\n            <div className=\"flex items-center justify-center px-4 py-3 relative border-b border-gray-200 lg:border-b-0\">\n              <span className=\"paragraph-medium-semibold text-gray-950 text-center\">\n                {hasExistingPhone\n                  ? translate('common.account.changePhone.titleEdit')\n                  : translate('common.account.changePhone.titleAdd')}\n              </span>\n              <Button\n                variant=\"ghost\"\n                className=\"absolute right-2 size-8! p-0\"\n                onClick={handleClose}\n              >\n                <IconX size={18} className=\"text-gray-500\" />\n              </Button>\n            </div>\n          </>\n        )}\n\n        <div className={`${showVerification || !hasExistingPhone ? 'w-full' : 'w-1/2'} h-0.75 bg-primary`} />\n\n        {showVerification ? (\n          <form\n            onSubmit={(e) => {\n              e.preventDefault();\n              handleValidate();\n            }}\n            className=\"flex flex-col flex-1 lg:flex-none\"\n          >\n            <div className=\"px-4 lg:px-5 py-5 lg:py-6 flex flex-col gap-4 flex-1 lg:flex-none\">\n              <div className=\"flex items-center justify-center size-12 bg-white rounded-lg shadow-xs border border-gray-200\">\n                <IconMessage size={20} className=\"text-gray-950\" />\n              </div>\n\n              <div className=\"flex flex-col gap-1\">\n                <h3 className=\"paragraph-medium-semibold text-gray-950\">\n                  {translate('common.account.otp.validationCode')}\n                </h3>\n                <p className=\"paragraph-small-regular text-gray-600\">\n                  {translate.rich('common.account.changePhone.sentCodeTo', {\n                    phone: currentPhoneDisplay,\n                    b: (chunks) => <span className=\"font-semibold text-gray-950\">{chunks}</span>,\n                  })}\n                </p>\n              </div>\n\n              <div className=\"flex flex-col gap-2\">\n                <InputOTP maxLength={OTP_CODE_LENGTH} pattern={OTP_ALPHANUMERIC_PATTERN} value={code} onChange={handleCodeChange}>\n                  <InputOTPGroup className=\"flex flex-row gap-2\">\n                    {[...Array(OTP_CODE_LENGTH)].map((_, i) => (\n                      <InputOTPSlot\n                        key={i}\n                        index={i}\n                        className={`uppercase text-2xl font-medium w-11 lg:w-12 h-13 lg:h-14 rounded-lg border bg-white shadow-none [&_div.animate-caret-blink]:bg-gray-950 ${hasError ? 'border-red-500' : 'border-gray-200'}`}\n                      />\n                    ))}\n                  </InputOTPGroup>\n                </InputOTP>\n                {hasError && (\n                  <p className=\"paragraph-small-regular text-red-500\">\n                    {translate('common.account.otp.incorrectCode')}\n                  </p>\n                )}\n              </div>\n\n              {canResend ? (\n                <button\n                  type=\"button\"\n                  onClick={handleResend}\n                  className=\"paragraph-small-medium text-gray-950 underline cursor-pointer hover:text-gray-700 w-fit\"\n                >\n                  {translate('common.account.otp.resend')}\n                </button>\n              ) : (\n                <p className=\"paragraph-small-regular text-gray-500\">\n                  {translate.rich('common.account.otp.resendIn', {\n                    time: formatTimer(timer),\n                    b: (chunks) => (\n                      <span className=\"paragraph-small-semibold text-gray-950\">{chunks}</span>\n                    ),\n                  })}\n                </p>\n              )}\n            </div>\n\n            <Separator />\n\n            <div className=\"flex items-center justify-between px-4 lg:px-5 py-4 lg:py-5 mt-auto lg:mt-0\">\n              <Button variant=\"secondary\" className=\"h-10!\" type=\"button\" onClick={handleClose}>\n                {translate('common.actions.cancel')}\n              </Button>\n              <Button className=\"h-10!\" type=\"submit\" disabled={!isValidLength || isLoading}>\n                {isLoading\n                  ? translate('common.account.otp.validating')\n                  : translate('common.account.changePhone.confirm')}\n              </Button>\n            </div>\n          </form>\n        ) : (\n          <form onSubmit={handleContinue} className=\"flex flex-col flex-1 lg:flex-none\">\n            <div className=\"flex flex-col gap-5 lg:gap-6 px-4 lg:px-5 py-5 lg:py-6 flex-1 lg:flex-none\">\n              <div className=\"flex flex-col gap-1\">\n                <span className=\"paragraph-medium-semibold text-gray-950\">\n                  {hasExistingPhone\n                    ? translate('common.account.changePhone.updateTitle')\n                    : translate('common.account.changePhone.addTitle')}\n                </span>\n                <span className=\"paragraph-small-regular text-gray-600\">\n                  {hasExistingPhone\n                    ? translate('common.account.changePhone.updateDescription')\n                    : translate('common.account.changePhone.addDescription')}\n                </span>\n              </div>\n\n              <PhoneInput\n                label={\n                  hasExistingPhone\n                    ? translate('common.account.changePhone.newNumber')\n                    : translate('common.account.changePhone.numberLabel')\n                }\n                placeholder=\"(00) 0 0000-0000\"\n                value={phoneValue}\n                onChange={handlePhoneChange}\n                error={!!phoneError}\n                errorMessage={phoneError}\n              />\n            </div>\n\n            <div className=\"flex items-center justify-between p-4 lg:p-5 border-t border-gray-200 mt-auto lg:mt-0\">\n              <Button variant=\"secondary\" className=\"h-10!\" type=\"button\" onClick={handleClose}>\n                {translate('common.actions.cancel')}\n              </Button>\n              <Button className=\"h-10!\" type=\"submit\" disabled={isSubmitting}>\n                {isSubmitting\n                  ? hasExistingPhone\n                    ? translate('common.actions.sending')\n                    : translate('common.actions.saving')\n                  : hasExistingPhone\n                    ? translate('common.actions.continue')\n                    : translate('common.actions.save')}\n              </Button>\n            </div>\n          </form>\n        )}\n      </DialogContent>\n    </Dialog>\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/components/account/sections/MyProfileSection.mjs

@@ -2,6 +2,7 @@
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { useState, useRef } from "react";
 import Image from "next/image";
+import { useTranslations } from "next-intl";
 import { useForm } from "react-hook-form";
 import { zodResolver } from "@hookform/resolvers/zod";
 import { toast } from "sonner";
@@ -20,6 +21,13 @@ import { GENDER_OPTIONS } from "../constants";
 import { ChangePhoneModal } from "./ChangePhoneModal";
 import { ChangeEmailModal } from "./ChangeEmailModal";
 function MyProfileSection({ onClose, storageUrl }) {
+  const translate = useTranslations();
+  const genderOptions = GENDER_OPTIONS.map((option) => ({
+    ...option,
+    label: translate(
+      `common.account.profile.genderOptions.${option.value === "masculino" ? "male" : "female"}`
+    )
+  }));
   const { user } = useAuth();
   const updateAccountUser = useUpdateAccountUser();
   const fileInputRef = useRef(null);
@@ -68,15 +76,22 @@ function MyProfileSection({ onClose, storageUrl }) {
       form.reset(data);
       setSelectedPhoto(null);
       setPhotoRemoved(false);
-      toast.custom((t) => /* @__PURE__ */ jsx(Toast, { variant: "success", message: "Perfil atualizado com sucesso", toastId: t }));
+      toast.custom((toastId) => /* @__PURE__ */ jsx(
+        Toast,
+        {
+          variant: "success",
+          message: translate("common.account.profile.savedSuccess"),
+          toastId
+        }
+      ));
       onClose();
     } catch (error) {
-      toast.custom((t) => /* @__PURE__ */ jsx(
+      toast.custom((toastId) => /* @__PURE__ */ jsx(
         Toast,
         {
           variant: "error",
-          message: error instanceof Error ? error.message : "Erro ao atualizar perfil",
-          toastId: t
+          message: error instanceof Error ? error.message : translate("common.account.profile.saveError"),
+          toastId
         }
       ));
     }
@@ -94,14 +109,14 @@ function MyProfileSection({ onClose, storageUrl }) {
         }
       ),
       /* @__PURE__ */ jsxs("div", { className: "absolute inset-0 overflow-y-auto overscroll-contain px-4 pb-20 lg:p-5 lg:static lg:flex-1 lg:min-h-0 lg:overscroll-auto flex flex-col gap-5 lg:gap-6", children: [
-        /* @__PURE__ */ jsx("span", { className: "paragraph-medium-semibold text-gray-950 hidden lg:block", children: "Meu perfil" }),
+        /* @__PURE__ */ jsx("span", { className: "paragraph-medium-semibold text-gray-950 hidden lg:block", children: translate("common.account.profile.title") }),
         /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-5", children: [
           /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-4", children: [
             avatarPreview ? /* @__PURE__ */ jsx(
               Image,
               {
                 src: avatarPreview,
-                alt: "Foto do usu\xE1rio",
+                alt: translate("common.account.profile.avatarAlt"),
                 width: 48,
                 height: 48,
                 className: "size-12 rounded-full object-cover cursor-pointer",
@@ -123,7 +138,7 @@ function MyProfileSection({ onClose, storageUrl }) {
                   className: "w-fit h-8!",
                   type: "button",
                   onClick: () => fileInputRef.current?.click(),
-                  children: "Alterar foto"
+                  children: translate("common.account.profile.changePhoto")
                 }
               ),
               /* @__PURE__ */ jsx(
@@ -143,7 +158,7 @@ function MyProfileSection({ onClose, storageUrl }) {
                 className: "w-fit h-8!",
                 type: "button",
                 onClick: () => fileInputRef.current?.click(),
-                children: "Alterar foto"
+                children: translate("common.account.profile.changePhoto")
               }
             )
           ] }),
@@ -153,8 +168,8 @@ function MyProfileSection({ onClose, storageUrl }) {
                 /* @__PURE__ */ jsx(
                   FormField,
                   {
-                    label: "Nome",
-                    placeholder: "Digite seu nome",
+                    label: translate("common.account.profile.name"),
+                    placeholder: translate("common.account.profile.namePlaceholder"),
                     error: !!errors.name,
                     errorMessage: errors.name?.message,
                     ...register("name")
@@ -163,8 +178,8 @@ function MyProfileSection({ onClose, storageUrl }) {
                 /* @__PURE__ */ jsx(
                   FormField,
                   {
-                    label: "Sobrenome",
-                    placeholder: "Digite seu sobrenome",
+                    label: translate("common.account.profile.lastName"),
+                    placeholder: translate("common.account.profile.lastNamePlaceholder"),
                     error: !!errors.last_name,
                     errorMessage: errors.last_name?.message,
                     ...register("last_name")
@@ -174,9 +189,9 @@ function MyProfileSection({ onClose, storageUrl }) {
               /* @__PURE__ */ jsx(
                 SelectField,
                 {
-                  label: "G\xEAnero",
-                  placeholder: "Selecione seu g\xEAnero",
-                  options: GENDER_OPTIONS,
+                  label: translate("common.account.profile.gender"),
+                  placeholder: translate("common.account.profile.genderPlaceholder"),
+                  options: genderOptions,
                   value: watch("gender"),
                   className: "h-10!",
                   onChange: (value) => setValue("gender", value)
@@ -186,7 +201,7 @@ function MyProfileSection({ onClose, storageUrl }) {
                 /* @__PURE__ */ jsx(
                   PhoneInput,
                   {
-                    label: "Telefone",
+                    label: translate("common.account.profile.phone"),
                     value: user?.phone ?? "",
                     disabled: true,
                     classnameContainer: "bg-gray-50 border-0!"
@@ -198,19 +213,19 @@ function MyProfileSection({ onClose, storageUrl }) {
                     type: "button",
                     className: "absolute right-3 top-5.5 h-10 flex items-center paragraph-xsmall-semibold text-gray-950 underline cursor-pointer",
                     onClick: () => setChangePhoneOpen(true),
-                    children: "Alterar"
+                    children: translate("common.account.profile.change")
                   }
                 )
               ] })
             ] }),
             /* @__PURE__ */ jsx(Separator, {}),
             /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-4", children: [
-              /* @__PURE__ */ jsx("span", { className: "paragraph-medium-semibold text-gray-600", children: "Dados de acesso" }),
+              /* @__PURE__ */ jsx("span", { className: "paragraph-medium-semibold text-gray-600", children: translate("common.account.profile.accessData") }),
               /* @__PURE__ */ jsxs("div", { className: "relative", children: [
                 /* @__PURE__ */ jsx("div", { className: "cursor-not-allowed", children: /* @__PURE__ */ jsx(
                   FormField,
                   {
-                    label: "E-mail",
+                    label: translate("common.account.profile.email"),
                     value: user?.email ?? "",
                     disabled: true,
                     classnameContainer: "bg-gray-50 border-0!"
@@ -222,7 +237,7 @@ function MyProfileSection({ onClose, storageUrl }) {
                     type: "button",
                     className: "absolute right-3 top-5.5 h-10 flex items-center paragraph-xsmall-semibold text-gray-950 underline cursor-pointer",
                     onClick: () => setChangeEmailOpen(true),
-                    children: "Alterar"
+                    children: translate("common.account.profile.change")
                   }
                 )
               ] })
@@ -244,10 +259,10 @@ function MyProfileSection({ onClose, storageUrl }) {
               setPhotoRemoved(false);
               onClose();
             },
-            children: "Cancelar"
+            children: translate("common.actions.cancel")
           }
         ),
-        /* @__PURE__ */ jsx(Button, { className: "h-10! cursor-pointer", type: "submit", disabled: isSubmitting, children: isSubmitting ? "Salvando..." : "Salvar altera\xE7\xF5es" })
+        /* @__PURE__ */ jsx(Button, { className: "h-10! cursor-pointer", type: "submit", disabled: isSubmitting, children: isSubmitting ? translate("common.actions.saving") : translate("common.actions.saveChanges") })
       ] })
     ] }),
     /* @__PURE__ */ jsx(ChangePhoneModal, { open: changePhoneOpen, onClose: () => setChangePhoneOpen(false) }),

package/dist/components/account/sections/MyProfileSection.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/account/sections/MyProfileSection.tsx"],"sourcesContent":["'use client';\n\nimport { useState, useRef } from 'react';\nimport Image from 'next/image';\nimport { useForm } from 'react-hook-form';\nimport { zodResolver } from '@hookform/resolvers/zod';\nimport { toast } from 'sonner';\nimport { IconUpload, IconTrash } from '@tabler/icons-react';\nimport { ACCEPTED_IMAGE_FORMATS_STRING } from '../../../modules/images/constants/image.constants';\nimport { Button } from '../../ui/buttons/Button';\nimport { Separator } from '../../ui/data-display/Separator';\nimport { Toast } from '../../ui/feedback/Toast';\nimport { FormField } from '../../ui/form/FormField';\nimport { SelectField } from '../../ui/form/SelectField';\nimport PhoneInput from '../../ui/form/PhoneInput';\nimport { useAuth } from '../../../providers/auth.provider';\nimport { myProfileSchema, type MyProfileFormData } from '../../../utils/validators/account';\nimport { useUpdateAccountUser } from '../../../modules/accounts/hooks/useAccountManagement';\nimport { GENDER_OPTIONS } from '../constants';\nimport { ChangePhoneModal } from './ChangePhoneModal';\nimport { ChangeEmailModal } from './ChangeEmailModal';\n\ninterface MyProfileSectionProps {\n  onClose: () => void;\n  storageUrl?: string;\n}\n\nexport function MyProfileSection({ onClose, storageUrl }: MyProfileSectionProps) {\n  const { user } = useAuth();\n  const updateAccountUser = useUpdateAccountUser();\n  const fileInputRef = useRef<HTMLInputElement>(null);\n  const [selectedPhoto, setSelectedPhoto] = useState<File | null>(null);\n  const [photoRemoved, setPhotoRemoved] = useState(false);\n  const [changePhoneOpen, setChangePhoneOpen] = useState(false);\n  const [changeEmailOpen, setChangeEmailOpen] = useState(false);\n\n  const form = useForm<MyProfileFormData>({\n    resolver: zodResolver(myProfileSchema),\n    mode: 'onChange',\n    defaultValues: {\n      name: user?.name ?? '',\n      last_name: user?.last_name ?? '',\n      gender: GENDER_OPTIONS.find((g) => g.apiValue === user?.gender)?.value ?? '',\n    },\n  });\n\n  const {\n    register,\n    handleSubmit,\n    watch,\n    setValue,\n    formState: { errors, isSubmitting },\n  } = form;\n\n  const baseStorageUrl = storageUrl ?? process.env.NEXT_PUBLIC_STORAGE_URL ?? '';\n\n  const avatarPreview = selectedPhoto\n    ? URL.createObjectURL(selectedPhoto)\n    : !photoRemoved && user?.photo\n      ? `${baseStorageUrl}/${user.photo}`\n      : null;\n\n  const handlePhotoChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n    const file = e.target.files?.[0] ?? null;\n    if (file) {\n      setSelectedPhoto(file);\n      setPhotoRemoved(false);\n    }\n  };\n\n  const handleRemovePhoto = () => {\n    setSelectedPhoto(null);\n    setPhotoRemoved(true);\n  };\n\n  const onSubmit = async (data: MyProfileFormData) => {\n    try {\n      await updateAccountUser.mutateAsync({\n        name: data.name,\n        last_name: data.last_name,\n        gender: GENDER_OPTIONS.find((g) => g.value === data.gender)?.apiValue,\n        ...(selectedPhoto ? { photo: selectedPhoto } : {}),\n        ...(photoRemoved ? { photo: '' } : {}),\n      });\n\n      form.reset(data);\n      setSelectedPhoto(null);\n      setPhotoRemoved(false);\n      toast.custom((t) => (\n        <Toast variant=\"success\" message=\"Perfil atualizado com sucesso\" toastId={t} />\n      ));\n      onClose();\n    } catch (error) {\n      toast.custom((t) => (\n        <Toast\n          variant=\"error\"\n          message={error instanceof Error ? error.message : 'Erro ao atualizar perfil'}\n          toastId={t}\n        />\n      ));\n    }\n  };\n\n  return (\n    <>\n      <form onSubmit={handleSubmit(onSubmit)} className=\"lg:h-full lg:flex lg:flex-col\">\n        <input\n          ref={fileInputRef}\n          type=\"file\"\n          accept={ACCEPTED_IMAGE_FORMATS_STRING}\n          className=\"hidden\"\n          onChange={handlePhotoChange}\n        />\n        <div className=\"absolute inset-0 overflow-y-auto overscroll-contain px-4 pb-20 lg:p-5 lg:static lg:flex-1 lg:min-h-0 lg:overscroll-auto flex flex-col gap-5 lg:gap-6\">\n          <span className=\"paragraph-medium-semibold text-gray-950 hidden lg:block\">\n            Meu perfil\n          </span>\n          <div className=\"flex flex-col gap-5\">\n            <div className=\"flex items-center gap-4\">\n              {avatarPreview ? (\n                <Image\n                  src={avatarPreview}\n                  alt=\"Foto do usuário\"\n                  width={48}\n                  height={48}\n                  className=\"size-12 rounded-full object-cover cursor-pointer\"\n                  onClick={() => fileInputRef.current?.click()}\n                />\n              ) : (\n                <div\n                  className=\"size-12 rounded-full bg-gray-50 border border-dashed border-gray-200 flex items-center justify-center cursor-pointer\"\n                  onClick={() => fileInputRef.current?.click()}\n                >\n                  <IconUpload size={20} className=\"text-gray-400\" />\n                </div>\n              )}\n              {avatarPreview ? (\n                <div className=\"flex items-center gap-2\">\n                  <Button\n                    variant=\"secondary\"\n                    className=\"w-fit h-8!\"\n                    type=\"button\"\n                    onClick={() => fileInputRef.current?.click()}\n                  >\n                    Alterar foto\n                  </Button>\n                  <Button\n                    type=\"button\"\n                    variant=\"ghost\"\n                    className=\"h-8!\"\n                    onClick={handleRemovePhoto}\n                  >\n                    <IconTrash size={16} className=\"text-gray-500\" />\n                  </Button>\n                </div>\n              ) : (\n                <Button\n                  variant=\"secondary\"\n                  className=\"w-fit h-8!\"\n                  type=\"button\"\n                  onClick={() => fileInputRef.current?.click()}\n                >\n                  Alterar foto\n                </Button>\n              )}\n            </div>\n\n            <div className=\"flex flex-col gap-8\">\n              <div className=\"flex flex-col gap-4\">\n                <div className=\"flex gap-4\">\n                  <FormField\n                    label=\"Nome\"\n                    placeholder=\"Digite seu nome\"\n                    error={!!errors.name}\n                    errorMessage={errors.name?.message}\n                    {...register('name')}\n                  />\n                  <FormField\n                    label=\"Sobrenome\"\n                    placeholder=\"Digite seu sobrenome\"\n                    error={!!errors.last_name}\n                    errorMessage={errors.last_name?.message}\n                    {...register('last_name')}\n                  />\n                </div>\n                <SelectField\n                  label=\"Gênero\"\n                  placeholder=\"Selecione seu gênero\"\n                  options={GENDER_OPTIONS}\n                  value={watch('gender')}\n                  className=\"h-10!\"\n                  onChange={(value) => setValue('gender', value as string)}\n                />\n                <div className=\"relative\">\n                  <PhoneInput\n                    label=\"Telefone\"\n                    value={user?.phone ?? ''}\n                    disabled\n                    classnameContainer=\"bg-gray-50 border-0!\"\n                  />\n                  <button\n                    type=\"button\"\n                    className=\"absolute right-3 top-5.5 h-10 flex items-center paragraph-xsmall-semibold text-gray-950 underline cursor-pointer\"\n                    onClick={() => setChangePhoneOpen(true)}\n                  >\n                    Alterar\n                  </button>\n                </div>\n              </div>\n\n              <Separator />\n\n              <div className=\"flex flex-col gap-4\">\n                <span className=\"paragraph-medium-semibold text-gray-600\">Dados de acesso</span>\n                <div className=\"relative\">\n                  <div className='cursor-not-allowed'>\n                    <FormField\n                      label=\"E-mail\"\n                      value={user?.email ?? ''}\n                      disabled\n                      classnameContainer=\"bg-gray-50 border-0!\"\n                    />\n                  </div>\n                  <button\n                    type=\"button\"\n                    className=\"absolute right-3 top-5.5 h-10 flex items-center paragraph-xsmall-semibold text-gray-950 underline cursor-pointer\"\n                    onClick={() => setChangeEmailOpen(true)}\n                  >\n                    Alterar\n                  </button>\n                </div>\n              </div>\n            </div>\n          </div>\n        </div>\n\n        <div className=\"fixed bottom-0 left-0 right-0 lg:static flex items-center h-20 px-4 lg:px-5 border-t border-gray-200 justify-between bg-white z-10\">\n          <Button\n            variant=\"secondary\"\n            className=\"h-10!\"\n            type=\"button\"\n            disabled={isSubmitting}\n            onClick={() => {\n              form.reset();\n              setSelectedPhoto(null);\n              setPhotoRemoved(false);\n              onClose();\n            }}\n          >\n            Cancelar\n          </Button>\n          <Button className=\"h-10! cursor-pointer\" type=\"submit\" disabled={isSubmitting}>\n            {isSubmitting ? 'Salvando...' : 'Salvar alterações'}\n          </Button>\n        </div>\n      </form>\n\n      <ChangePhoneModal open={changePhoneOpen} onClose={() => setChangePhoneOpen(false)} />\n      <ChangeEmailModal open={changeEmailOpen} onClose={() => setChangeEmailOpen(false)} />\n    </>\n  );\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../../../src/components/account/sections/MyProfileSection.tsx"],"sourcesContent":["'use client';\n\nimport { useState, useRef } from 'react';\nimport Image from 'next/image';\nimport { useTranslations } from 'next-intl';\nimport { useForm } from 'react-hook-form';\nimport { zodResolver } from '@hookform/resolvers/zod';\nimport { toast } from 'sonner';\nimport { IconUpload, IconTrash } from '@tabler/icons-react';\nimport { ACCEPTED_IMAGE_FORMATS_STRING } from '../../../modules/images/constants/image.constants';\nimport { Button } from '../../ui/buttons/Button';\nimport { Separator } from '../../ui/data-display/Separator';\nimport { Toast } from '../../ui/feedback/Toast';\nimport { FormField } from '../../ui/form/FormField';\nimport { SelectField } from '../../ui/form/SelectField';\nimport PhoneInput from '../../ui/form/PhoneInput';\nimport { useAuth } from '../../../providers/auth.provider';\nimport { myProfileSchema, type MyProfileFormData } from '../../../utils/validators/account';\nimport { useUpdateAccountUser } from '../../../modules/accounts/hooks/useAccountManagement';\nimport { GENDER_OPTIONS } from '../constants';\nimport { ChangePhoneModal } from './ChangePhoneModal';\nimport { ChangeEmailModal } from './ChangeEmailModal';\n\ninterface MyProfileSectionProps {\n  onClose: () => void;\n  storageUrl?: string;\n}\n\nexport function MyProfileSection({ onClose, storageUrl }: MyProfileSectionProps) {\n  const translate = useTranslations();\n  const genderOptions = GENDER_OPTIONS.map((option) => ({\n    ...option,\n    label: translate(\n      `common.account.profile.genderOptions.${option.value === 'masculino' ? 'male' : 'female'}`,\n    ),\n  }));\n  const { user } = useAuth();\n  const updateAccountUser = useUpdateAccountUser();\n  const fileInputRef = useRef<HTMLInputElement>(null);\n  const [selectedPhoto, setSelectedPhoto] = useState<File | null>(null);\n  const [photoRemoved, setPhotoRemoved] = useState(false);\n  const [changePhoneOpen, setChangePhoneOpen] = useState(false);\n  const [changeEmailOpen, setChangeEmailOpen] = useState(false);\n\n  const form = useForm<MyProfileFormData>({\n    resolver: zodResolver(myProfileSchema),\n    mode: 'onChange',\n    defaultValues: {\n      name: user?.name ?? '',\n      last_name: user?.last_name ?? '',\n      gender: GENDER_OPTIONS.find((g) => g.apiValue === user?.gender)?.value ?? '',\n    },\n  });\n\n  const {\n    register,\n    handleSubmit,\n    watch,\n    setValue,\n    formState: { errors, isSubmitting },\n  } = form;\n\n  const baseStorageUrl = storageUrl ?? process.env.NEXT_PUBLIC_STORAGE_URL ?? '';\n\n  const avatarPreview = selectedPhoto\n    ? URL.createObjectURL(selectedPhoto)\n    : !photoRemoved && user?.photo\n      ? `${baseStorageUrl}/${user.photo}`\n      : null;\n\n  const handlePhotoChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n    const file = e.target.files?.[0] ?? null;\n    if (file) {\n      setSelectedPhoto(file);\n      setPhotoRemoved(false);\n    }\n  };\n\n  const handleRemovePhoto = () => {\n    setSelectedPhoto(null);\n    setPhotoRemoved(true);\n  };\n\n  const onSubmit = async (data: MyProfileFormData) => {\n    try {\n      await updateAccountUser.mutateAsync({\n        name: data.name,\n        last_name: data.last_name,\n        gender: GENDER_OPTIONS.find((g) => g.value === data.gender)?.apiValue,\n        ...(selectedPhoto ? { photo: selectedPhoto } : {}),\n        ...(photoRemoved ? { photo: '' } : {}),\n      });\n\n      form.reset(data);\n      setSelectedPhoto(null);\n      setPhotoRemoved(false);\n      toast.custom((toastId) => (\n        <Toast\n          variant=\"success\"\n          message={translate('common.account.profile.savedSuccess')}\n          toastId={toastId}\n        />\n      ));\n      onClose();\n    } catch (error) {\n      toast.custom((toastId) => (\n        <Toast\n          variant=\"error\"\n          message={error instanceof Error ? error.message : translate('common.account.profile.saveError')}\n          toastId={toastId}\n        />\n      ));\n    }\n  };\n\n  return (\n    <>\n      <form onSubmit={handleSubmit(onSubmit)} className=\"lg:h-full lg:flex lg:flex-col\">\n        <input\n          ref={fileInputRef}\n          type=\"file\"\n          accept={ACCEPTED_IMAGE_FORMATS_STRING}\n          className=\"hidden\"\n          onChange={handlePhotoChange}\n        />\n        <div className=\"absolute inset-0 overflow-y-auto overscroll-contain px-4 pb-20 lg:p-5 lg:static lg:flex-1 lg:min-h-0 lg:overscroll-auto flex flex-col gap-5 lg:gap-6\">\n          <span className=\"paragraph-medium-semibold text-gray-950 hidden lg:block\">\n            {translate('common.account.profile.title')}\n          </span>\n          <div className=\"flex flex-col gap-5\">\n            <div className=\"flex items-center gap-4\">\n              {avatarPreview ? (\n                <Image\n                  src={avatarPreview}\n                  alt={translate('common.account.profile.avatarAlt')}\n                  width={48}\n                  height={48}\n                  className=\"size-12 rounded-full object-cover cursor-pointer\"\n                  onClick={() => fileInputRef.current?.click()}\n                />\n              ) : (\n                <div\n                  className=\"size-12 rounded-full bg-gray-50 border border-dashed border-gray-200 flex items-center justify-center cursor-pointer\"\n                  onClick={() => fileInputRef.current?.click()}\n                >\n                  <IconUpload size={20} className=\"text-gray-400\" />\n                </div>\n              )}\n              {avatarPreview ? (\n                <div className=\"flex items-center gap-2\">\n                  <Button\n                    variant=\"secondary\"\n                    className=\"w-fit h-8!\"\n                    type=\"button\"\n                    onClick={() => fileInputRef.current?.click()}\n                  >\n                    {translate('common.account.profile.changePhoto')}\n                  </Button>\n                  <Button\n                    type=\"button\"\n                    variant=\"ghost\"\n                    className=\"h-8!\"\n                    onClick={handleRemovePhoto}\n                  >\n                    <IconTrash size={16} className=\"text-gray-500\" />\n                  </Button>\n                </div>\n              ) : (\n                <Button\n                  variant=\"secondary\"\n                  className=\"w-fit h-8!\"\n                  type=\"button\"\n                  onClick={() => fileInputRef.current?.click()}\n                >\n                  {translate('common.account.profile.changePhoto')}\n                </Button>\n              )}\n            </div>\n\n            <div className=\"flex flex-col gap-8\">\n              <div className=\"flex flex-col gap-4\">\n                <div className=\"flex gap-4\">\n                  <FormField\n                    label={translate('common.account.profile.name')}\n                    placeholder={translate('common.account.profile.namePlaceholder')}\n                    error={!!errors.name}\n                    errorMessage={errors.name?.message}\n                    {...register('name')}\n                  />\n                  <FormField\n                    label={translate('common.account.profile.lastName')}\n                    placeholder={translate('common.account.profile.lastNamePlaceholder')}\n                    error={!!errors.last_name}\n                    errorMessage={errors.last_name?.message}\n                    {...register('last_name')}\n                  />\n                </div>\n                <SelectField\n                  label={translate('common.account.profile.gender')}\n                  placeholder={translate('common.account.profile.genderPlaceholder')}\n                  options={genderOptions}\n                  value={watch('gender')}\n                  className=\"h-10!\"\n                  onChange={(value) => setValue('gender', value as string)}\n                />\n                <div className=\"relative\">\n                  <PhoneInput\n                    label={translate('common.account.profile.phone')}\n                    value={user?.phone ?? ''}\n                    disabled\n                    classnameContainer=\"bg-gray-50 border-0!\"\n                  />\n                  <button\n                    type=\"button\"\n                    className=\"absolute right-3 top-5.5 h-10 flex items-center paragraph-xsmall-semibold text-gray-950 underline cursor-pointer\"\n                    onClick={() => setChangePhoneOpen(true)}\n                  >\n                    {translate('common.account.profile.change')}\n                  </button>\n                </div>\n              </div>\n\n              <Separator />\n\n              <div className=\"flex flex-col gap-4\">\n                <span className=\"paragraph-medium-semibold text-gray-600\">\n                  {translate('common.account.profile.accessData')}\n                </span>\n                <div className=\"relative\">\n                  <div className='cursor-not-allowed'>\n                    <FormField\n                      label={translate('common.account.profile.email')}\n                      value={user?.email ?? ''}\n                      disabled\n                      classnameContainer=\"bg-gray-50 border-0!\"\n                    />\n                  </div>\n                  <button\n                    type=\"button\"\n                    className=\"absolute right-3 top-5.5 h-10 flex items-center paragraph-xsmall-semibold text-gray-950 underline cursor-pointer\"\n                    onClick={() => setChangeEmailOpen(true)}\n                  >\n                    {translate('common.account.profile.change')}\n                  </button>\n                </div>\n              </div>\n            </div>\n          </div>\n        </div>\n\n        <div className=\"fixed bottom-0 left-0 right-0 lg:static flex items-center h-20 px-4 lg:px-5 border-t border-gray-200 justify-between bg-white z-10\">\n          <Button\n            variant=\"secondary\"\n            className=\"h-10!\"\n            type=\"button\"\n            disabled={isSubmitting}\n            onClick={() => {\n              form.reset();\n              setSelectedPhoto(null);\n              setPhotoRemoved(false);\n              onClose();\n            }}\n          >\n            {translate('common.actions.cancel')}\n          </Button>\n          <Button className=\"h-10! cursor-pointer\" type=\"submit\" disabled={isSubmitting}>\n            {isSubmitting ? translate('common.actions.saving') : translate('common.actions.saveChanges')}\n          </Button>\n        </div>\n      </form>\n\n      <ChangePhoneModal open={changePhoneOpen} onClose={() => setChangePhoneOpen(false)} />\n      <ChangeEmailModal open={changeEmailOpen} onClose={() => setChangeEmailOpen(false)} />\n    </>\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/components/account/sections/PreferencesSection.mjs

@@ -2,9 +2,12 @@
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { useState, useEffect } from "react";
 import { useForm } from "react-hook-form";
+import { useTranslations, useLocale } from "next-intl";
+import { useRouter } from "next/navigation";
 import { toast } from "sonner";
 import { IconLock } from "@tabler/icons-react";
 import { cn } from "../../../infra/utils/clsx";
+import { setLocaleCookie } from "../../../utils/intl/locale-cookie";
 import { Button } from "../../ui/buttons/Button";
 import { Separator } from "../../ui/data-display/Separator";
 import { Toast } from "../../ui/feedback/Toast";
@@ -13,6 +16,7 @@ import { ComboboxField } from "../../ui/form/ComboboxField";
 import { SelectField } from "../../ui/form/SelectField";
 import ConfirmGlobalPreferencesModal from "../ConfirmGlobalPreferencesModal";
 import { useAuth } from "../../../providers/auth.provider";
+import { useWhitelabel } from "../../../providers/whitelabel.provider";
 import { UserProfile } from "../../../modules/users/schema";
 import {
   useUpdateAccountUser,
@@ -25,9 +29,25 @@ import {
 import { useTimezones } from "../../../modules/accounts/hooks/useTimezones";
 import { useCurrencies } from "../../../modules/accounts/hooks/useCurrencies";
 function PreferencesSection({ onClose }) {
+  const translate = useTranslations();
+  const translateLanguage = useTranslations("common.languages");
+  const currentLocale = useLocale();
+  const router = useRouter();
   const { data: timezones = [] } = useTimezones();
   const { data: currencies = [] } = useCurrencies();
   const { user, account } = useAuth();
+  const { whitelabel } = useWhitelabel();
+  const languageOptions = LANGUAGE_OPTIONS.map((option) => ({
+    ...option,
+    label: translateLanguage(option.value),
+    displayValue: translateLanguage(option.value)
+  }));
+  const timeFormatOptions = TIME_FORMAT_OPTIONS.map((option) => ({
+    ...option,
+    label: translate(
+      `common.preferences.timeFormatOptions.${option.value === "24h" ? "h24" : "h12"}`
+    )
+  }));
   const isOwner = user?.profile === UserProfile.owner;
   const canEditPreferences = isOwner || user?.profile === UserProfile.admin;
   const updateAccountUser = useUpdateAccountUser();
@@ -52,7 +72,7 @@ function PreferencesSection({ onClose }) {
       companyName: account.name ?? "",
       language: LANGUAGE_OPTIONS.find(
         (o) => o.apiValue === user.language?.toLowerCase()
-      )?.value ?? "pt-BR",
+      )?.value ?? "pt-br",
       currency: account.currency,
       timezone: account.timezone,
       timeFormat: "24h",
@@ -73,15 +93,19 @@ function PreferencesSection({ onClose }) {
         await updateAccount.mutateAsync(accountFields);
       }
       reset(data);
-      toast.custom((t) => /* @__PURE__ */ jsx(Toast, { variant: "success", message: "Prefer\xEAncias salvas com sucesso", toastId: t }));
+      toast.custom((toastId) => /* @__PURE__ */ jsx(Toast, { variant: "success", message: translate("common.preferences.savedSuccess"), toastId }));
       onClose();
+      if (data.language !== currentLocale) {
+        setLocaleCookie(data.language, whitelabel?.domain);
+        router.refresh();
+      }
     } catch (error) {
-      toast.custom((t) => /* @__PURE__ */ jsx(
+      toast.custom((toastId) => /* @__PURE__ */ jsx(
         Toast,
         {
           variant: "error",
-          message: error instanceof Error ? error.message : "Erro ao salvar prefer\xEAncias",
-          toastId: t
+          message: error instanceof Error ? error.message : translate("common.preferences.saveError"),
+          toastId
         }
       ));
     } finally {
@@ -116,13 +140,13 @@ function PreferencesSection({ onClose }) {
   return /* @__PURE__ */ jsxs(Fragment, { children: [
     /* @__PURE__ */ jsxs("form", { onSubmit: handleSubmit(onSubmit), className: "flex flex-col h-full", children: [
       /* @__PURE__ */ jsxs("div", { className: "overflow-y-auto overscroll-contain px-4 pb-4 lg:p-5 flex flex-col gap-5 lg:gap-6 flex-1", children: [
-        /* @__PURE__ */ jsx("span", { className: "paragraph-medium-semibold text-gray-950", children: "Prefer\xEAncias" }),
+        /* @__PURE__ */ jsx("span", { className: "paragraph-medium-semibold text-gray-950", children: translate("common.preferences.title") }),
         /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-8", children: [
           /* @__PURE__ */ jsx("div", { className: "flex flex-col lg:flex-row items-center gap-3", children: /* @__PURE__ */ jsx(
             FormField,
             {
-              label: "Nome da empresa",
-              placeholder: "Digite o nome da empresa",
+              label: translate("common.preferences.companyName"),
+              placeholder: translate("common.preferences.companyNamePlaceholder"),
               classnameContainer: cn("w-full", !isOwner && "cursor-not-allowed opacity-50"),
               value: watch("companyName"),
               onChange: (e) => setValue("companyName", e.target.value, { shouldDirty: true }),
@@ -133,11 +157,11 @@ function PreferencesSection({ onClose }) {
             /* @__PURE__ */ jsx(
               ComboboxField,
               {
-                label: "Idioma",
-                placeholder: "Selecione o idioma",
-                searchPlaceholder: "Buscar idioma...",
+                label: translate("common.preferences.language"),
+                placeholder: translate("common.preferences.languagePlaceholder"),
+                searchPlaceholder: translate("common.preferences.languageSearch"),
                 containerClassName: "w-full",
-                options: LANGUAGE_OPTIONS,
+                options: languageOptions,
                 value: watch("language"),
                 onChange: (value) => setValue("language", value, { shouldDirty: true })
               }
@@ -145,9 +169,9 @@ function PreferencesSection({ onClose }) {
             /* @__PURE__ */ jsx(
               ComboboxField,
               {
-                label: "Moeda",
-                placeholder: "Selecione a moeda",
-                searchPlaceholder: "Buscar moeda...",
+                label: translate("common.preferences.currency"),
+                placeholder: translate("common.preferences.currencyPlaceholder"),
+                searchPlaceholder: translate("common.preferences.currencySearch"),
                 containerClassName: "w-full",
                 options: currencies,
                 value: watch("currency"),
@@ -159,14 +183,14 @@ function PreferencesSection({ onClose }) {
           ] }),
           /* @__PURE__ */ jsx(Separator, {}),
           /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-4", children: [
-            /* @__PURE__ */ jsx("span", { className: "paragraph-medium-semibold text-gray-950", children: "Exibi\xE7\xE3o hora" }),
+            /* @__PURE__ */ jsx("span", { className: "paragraph-medium-semibold text-gray-950", children: translate("common.preferences.timeDisplay") }),
             /* @__PURE__ */ jsxs("div", { className: "flex flex-col lg:flex-row items-center gap-3", children: [
               /* @__PURE__ */ jsx(
                 ComboboxField,
                 {
-                  label: "Fuso hor\xE1rio",
-                  placeholder: "Selecione o fuso hor\xE1rio",
-                  searchPlaceholder: "Buscar fuso hor\xE1rio...",
+                  label: translate("common.preferences.timezone"),
+                  placeholder: translate("common.preferences.timezonePlaceholder"),
+                  searchPlaceholder: translate("common.preferences.timezoneSearch"),
                   containerClassName: "w-full",
                   options: timezones,
                   value: watch("timezone"),
@@ -178,11 +202,11 @@ function PreferencesSection({ onClose }) {
               /* @__PURE__ */ jsx(
                 SelectField,
                 {
-                  label: "Formato hora",
-                  placeholder: "Selecione o formato",
+                  label: translate("common.preferences.timeFormat"),
+                  placeholder: translate("common.preferences.timeFormatPlaceholder"),
                   className: "h-10!",
                   containerClassName: "w-full",
-                  options: TIME_FORMAT_OPTIONS,
+                  options: timeFormatOptions,
                   value: watch("timeFormat"),
                   onChange: (value) => setValue("timeFormat", value, { shouldDirty: true }),
                   icon: /* @__PURE__ */ jsx(IconLock, { className: "size-4 text-gray-400" }),
@@ -205,10 +229,10 @@ function PreferencesSection({ onClose }) {
               reset();
               onClose();
             },
-            children: "Cancelar"
+            children: translate("common.actions.cancel")
           }
         ),
-        /* @__PURE__ */ jsx(Button, { className: "h-10!", type: "submit", disabled: isSaving, children: isSaving ? "Salvando..." : "Salvar altera\xE7\xF5es" })
+        /* @__PURE__ */ jsx(Button, { className: "h-10!", type: "submit", disabled: isSaving, children: isSaving ? translate("common.actions.saving") : translate("common.actions.saveChanges") })
       ] })
     ] }),
     /* @__PURE__ */ jsx(

package/dist/components/account/sections/PreferencesSection.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/account/sections/PreferencesSection.tsx"],"sourcesContent":["'use client';\n\nimport { useState, useEffect } from 'react';\nimport { useForm } from 'react-hook-form';\nimport { toast } from 'sonner';\nimport { IconLock } from '@tabler/icons-react';\nimport { cn } from '../../../infra/utils/clsx';\nimport { Button } from '../../ui/buttons/Button';\nimport { Separator } from '../../ui/data-display/Separator';\nimport { Toast } from '../../ui/feedback/Toast';\nimport { FormField } from '../../ui/form/FormField';\nimport { ComboboxField } from '../../ui/form/ComboboxField';\nimport { SelectField } from '../../ui/form/SelectField';\nimport ConfirmGlobalPreferencesModal from '../ConfirmGlobalPreferencesModal';\nimport { useAuth } from '../../../providers/auth.provider';\nimport { UserProfile } from '../../../modules/users/schema';\nimport type { UpdateAccountRequest } from '../../../modules/accounts/types';\nimport {\n  useUpdateAccountUser,\n  useUpdateAccount,\n} from '../../../modules/accounts/hooks/useAccountManagement';\nimport {\n  LANGUAGE_OPTIONS,\n  TIME_FORMAT_OPTIONS,\n} from '../constants';\nimport { useTimezones } from '../../../modules/accounts/hooks/useTimezones';\nimport { useCurrencies } from '../../../modules/accounts/hooks/useCurrencies';\n\ninterface PreferencesFormValues {\n  companyName: string;\n  language: string;\n  currency: string;\n  timezone: string;\n  timeFormat: string;\n  receive_sms: boolean;\n  receive_email: boolean;\n}\n\ninterface PreferencesSectionProps {\n  onClose: () => void;\n}\n\nexport function PreferencesSection({ onClose }: PreferencesSectionProps) {\n  const { data: timezones = [] } = useTimezones();\n  const { data: currencies = [] } = useCurrencies();\n  const { user, account } = useAuth();\n  const isOwner = user?.profile === UserProfile.owner;\n  const canEditPreferences = isOwner || user?.profile === UserProfile.admin;\n  const updateAccountUser = useUpdateAccountUser();\n  const updateAccount = useUpdateAccount();\n  const [confirmGlobalOpen, setConfirmGlobalOpen] = useState(false);\n  const [pendingSubmit, setPendingSubmit] = useState<{\n    data: PreferencesFormValues;\n    accountFields: UpdateAccountRequest;\n  } | null>(null);\n  const [isSaving, setIsSaving] = useState(false);\n\n  const { watch, setValue, handleSubmit, reset, formState: { dirtyFields } } =\n    useForm<PreferencesFormValues>({\n      defaultValues: {\n        companyName: '',\n        language: '',\n        currency: '',\n        timezone: '',\n        timeFormat: '24h',\n        receive_sms: false,\n        receive_email: false,\n      },\n    });\n\n  useEffect(() => {\n    if (!user || !account) return;\n    reset({\n      companyName: account.name ?? '',\n      language: LANGUAGE_OPTIONS.find(\n        (o) => o.apiValue === user.language?.toLowerCase()\n      )?.value ?? 'pt-BR',\n      currency: account.currency,\n      timezone: account.timezone,\n      timeFormat: '24h',\n      receive_sms: user.receive_sms ?? false,\n      receive_email: user.receive_email ?? false,\n    });\n  }, [user, account, reset]);\n\n  const doSave = async (data: PreferencesFormValues, accountFields: UpdateAccountRequest) => {\n    setIsSaving(true);\n    try {\n      const apiLanguage = LANGUAGE_OPTIONS.find((o) => o.value === data.language)?.apiValue ?? data.language.toLowerCase();\n      await updateAccountUser.mutateAsync({\n        language: apiLanguage,\n        receive_sms: data.receive_sms,\n        receive_email: data.receive_email,\n      });\n\n      if (canEditPreferences && Object.keys(accountFields).length > 0) {\n        await updateAccount.mutateAsync(accountFields);\n      }\n\n      reset(data);\n      toast.custom((t) => (\n        <Toast variant=\"success\" message=\"Preferências salvas com sucesso\" toastId={t} />\n      ));\n      onClose();\n    } catch (error) {\n      toast.custom((t) => (\n        <Toast\n          variant=\"error\"\n          message={error instanceof Error ? error.message : 'Erro ao salvar preferências'}\n          toastId={t}\n        />\n      ));\n    } finally {\n      setIsSaving(false);\n    }\n  };\n\n  const onSubmit = (data: PreferencesFormValues) => {\n    const accountFields: UpdateAccountRequest = {\n      ...(isOwner && dirtyFields.companyName && { name: data.companyName }),\n      ...(canEditPreferences && dirtyFields.currency && { currency: data.currency }),\n      ...(canEditPreferences && dirtyFields.timezone && { timezone: data.timezone }),\n    };\n    const globalFieldChanged = Object.keys(accountFields).length > 0;\n\n    if (globalFieldChanged) {\n      setPendingSubmit({ data, accountFields });\n      setConfirmGlobalOpen(true);\n    } else {\n      doSave(data, accountFields);\n    }\n  };\n\n  const handleConfirmGlobal = () => {\n    setConfirmGlobalOpen(false);\n    if (pendingSubmit) {\n      doSave(pendingSubmit.data, pendingSubmit.accountFields);\n      setPendingSubmit(null);\n    }\n  };\n\n  const handleCancelGlobal = () => {\n    setConfirmGlobalOpen(false);\n    setPendingSubmit(null);\n  };\n\n  return (\n    <>\n      <form onSubmit={handleSubmit(onSubmit)} className=\"flex flex-col h-full\">\n        <div className=\"overflow-y-auto overscroll-contain px-4 pb-4 lg:p-5 flex flex-col gap-5 lg:gap-6 flex-1\">\n          <span className=\"paragraph-medium-semibold text-gray-950\">Preferências</span>\n          <div className=\"flex flex-col gap-8\">\n            <div className=\"flex flex-col lg:flex-row items-center gap-3\">\n              <FormField\n                label=\"Nome da empresa\"\n                placeholder=\"Digite o nome da empresa\"\n                classnameContainer={cn('w-full', !isOwner && 'cursor-not-allowed opacity-50')}\n                value={watch('companyName')}\n                onChange={(e) => setValue('companyName', e.target.value, { shouldDirty: true })}\n                disabled={!isOwner}\n              />\n            </div>\n\n            <div className=\"flex flex-col lg:flex-row items-center gap-3\">\n              <ComboboxField\n                label=\"Idioma\"\n                placeholder=\"Selecione o idioma\"\n                searchPlaceholder=\"Buscar idioma...\"\n                containerClassName=\"w-full\"\n                options={LANGUAGE_OPTIONS}\n                value={watch('language')}\n                onChange={(value) => setValue('language', value, { shouldDirty: true })}\n              />\n              <ComboboxField\n                label=\"Moeda\"\n                placeholder=\"Selecione a moeda\"\n                searchPlaceholder=\"Buscar moeda...\"\n                containerClassName=\"w-full\"\n                options={currencies}\n                value={watch('currency')}\n                onChange={(value) => setValue('currency', value, { shouldDirty: true })}\n                icon={!canEditPreferences ? <IconLock className=\"size-4 text-gray-400\" /> : undefined}\n                disabled={!canEditPreferences}\n              />\n            </div>\n\n            <Separator />\n\n            <div className=\"flex flex-col gap-4\">\n              <span className=\"paragraph-medium-semibold text-gray-950\">Exibição hora</span>\n              <div className=\"flex flex-col lg:flex-row items-center gap-3\">\n                <ComboboxField\n                  label=\"Fuso horário\"\n                  placeholder=\"Selecione o fuso horário\"\n                  searchPlaceholder=\"Buscar fuso horário...\"\n                  containerClassName=\"w-full\"\n                  options={timezones}\n                  value={watch('timezone')}\n                  onChange={(value) => setValue('timezone', value, { shouldDirty: true })}\n                  icon={!canEditPreferences ? <IconLock className=\"size-4 text-gray-400\" /> : undefined}\n                  disabled={!canEditPreferences}\n                />\n                <SelectField\n                  label=\"Formato hora\"\n                  placeholder=\"Selecione o formato\"\n                  className=\"h-10!\"\n                  containerClassName=\"w-full\"\n                  options={TIME_FORMAT_OPTIONS}\n                  value={watch('timeFormat')}\n                  onChange={(value) =>\n                    setValue('timeFormat', value as string, { shouldDirty: true })\n                  }\n                  icon={<IconLock className=\"size-4 text-gray-400\" />}\n                  disabled\n                />\n              </div>\n            </div>\n\n          </div>\n        </div>\n\n        <div className=\"fixed bottom-0 left-0 right-0 lg:absolute flex items-center h-20 px-4 lg:px-5 border-t border-gray-200 justify-between bg-white z-10\">\n          <Button\n            variant=\"secondary\"\n            className=\"h-10!\"\n            type=\"button\"\n            disabled={isSaving}\n            onClick={() => {\n              reset();\n              onClose();\n            }}\n          >\n            Cancelar\n          </Button>\n          <Button className=\"h-10!\" type=\"submit\" disabled={isSaving}>\n            {isSaving ? 'Salvando...' : 'Salvar alterações'}\n          </Button>\n        </div>\n      </form>\n\n      <ConfirmGlobalPreferencesModal\n        open={confirmGlobalOpen}\n        onConfirm={handleConfirmGlobal}\n        onCancel={handleCancelGlobal}\n      />\n    </>\n  );\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../../../src/components/account/sections/PreferencesSection.tsx"],"sourcesContent":["'use client';\n\nimport { useState, useEffect } from 'react';\nimport { useForm } from 'react-hook-form';\nimport { useTranslations, useLocale } from 'next-intl';\nimport { useRouter } from 'next/navigation';\nimport { toast } from 'sonner';\nimport { IconLock } from '@tabler/icons-react';\nimport { cn } from '../../../infra/utils/clsx';\nimport type { Locale } from '../../../i18n/config';\nimport { setLocaleCookie } from '../../../utils/intl/locale-cookie';\nimport { Button } from '../../ui/buttons/Button';\nimport { Separator } from '../../ui/data-display/Separator';\nimport { Toast } from '../../ui/feedback/Toast';\nimport { FormField } from '../../ui/form/FormField';\nimport { ComboboxField } from '../../ui/form/ComboboxField';\nimport { SelectField } from '../../ui/form/SelectField';\nimport ConfirmGlobalPreferencesModal from '../ConfirmGlobalPreferencesModal';\nimport { useAuth } from '../../../providers/auth.provider';\nimport { useWhitelabel } from '../../../providers/whitelabel.provider';\nimport { UserProfile } from '../../../modules/users/schema';\nimport type { UpdateAccountRequest } from '../../../modules/accounts/types';\nimport {\n  useUpdateAccountUser,\n  useUpdateAccount,\n} from '../../../modules/accounts/hooks/useAccountManagement';\nimport {\n  LANGUAGE_OPTIONS,\n  TIME_FORMAT_OPTIONS,\n} from '../constants';\nimport { useTimezones } from '../../../modules/accounts/hooks/useTimezones';\nimport { useCurrencies } from '../../../modules/accounts/hooks/useCurrencies';\n\ninterface PreferencesFormValues {\n  companyName: string;\n  language: string;\n  currency: string;\n  timezone: string;\n  timeFormat: string;\n  receive_sms: boolean;\n  receive_email: boolean;\n}\n\ninterface PreferencesSectionProps {\n  onClose: () => void;\n}\n\nexport function PreferencesSection({ onClose }: PreferencesSectionProps) {\n  // Padrão raiz: um único `translate` chamado pela chave inteira (`common.<modulo>.<chave>`).\n  const translate = useTranslations();\n  // Exceção: chave dinâmica (option.value) numa lista → namespace escopado.\n  const translateLanguage = useTranslations('common.languages');\n  const currentLocale = useLocale();\n  const router = useRouter();\n  const { data: timezones = [] } = useTimezones();\n  const { data: currencies = [] } = useCurrencies();\n  const { user, account } = useAuth();\n  const { whitelabel } = useWhitelabel();\n  const languageOptions = LANGUAGE_OPTIONS.map((option) => ({\n    ...option,\n    label: translateLanguage(option.value as Locale),\n    displayValue: translateLanguage(option.value as Locale),\n  }));\n  const timeFormatOptions = TIME_FORMAT_OPTIONS.map((option) => ({\n    ...option,\n    label: translate(\n      `common.preferences.timeFormatOptions.${option.value === '24h' ? 'h24' : 'h12'}`,\n    ),\n  }));\n  const isOwner = user?.profile === UserProfile.owner;\n  const canEditPreferences = isOwner || user?.profile === UserProfile.admin;\n  const updateAccountUser = useUpdateAccountUser();\n  const updateAccount = useUpdateAccount();\n  const [confirmGlobalOpen, setConfirmGlobalOpen] = useState(false);\n  const [pendingSubmit, setPendingSubmit] = useState<{\n    data: PreferencesFormValues;\n    accountFields: UpdateAccountRequest;\n  } | null>(null);\n  const [isSaving, setIsSaving] = useState(false);\n\n  const { watch, setValue, handleSubmit, reset, formState: { dirtyFields } } =\n    useForm<PreferencesFormValues>({\n      defaultValues: {\n        companyName: '',\n        language: '',\n        currency: '',\n        timezone: '',\n        timeFormat: '24h',\n        receive_sms: false,\n        receive_email: false,\n      },\n    });\n\n  useEffect(() => {\n    if (!user || !account) return;\n    reset({\n      companyName: account.name ?? '',\n      language: LANGUAGE_OPTIONS.find(\n        (o) => o.apiValue === user.language?.toLowerCase()\n      )?.value ?? 'pt-br',\n      currency: account.currency,\n      timezone: account.timezone,\n      timeFormat: '24h',\n      receive_sms: user.receive_sms ?? false,\n      receive_email: user.receive_email ?? false,\n    });\n  }, [user, account, reset]);\n\n  const doSave = async (data: PreferencesFormValues, accountFields: UpdateAccountRequest) => {\n    setIsSaving(true);\n    try {\n      const apiLanguage = LANGUAGE_OPTIONS.find((o) => o.value === data.language)?.apiValue ?? data.language.toLowerCase();\n      await updateAccountUser.mutateAsync({\n        language: apiLanguage,\n        receive_sms: data.receive_sms,\n        receive_email: data.receive_email,\n      });\n\n      if (canEditPreferences && Object.keys(accountFields).length > 0) {\n        await updateAccount.mutateAsync(accountFields);\n      }\n\n      reset(data);\n      toast.custom((toastId) => (\n        <Toast variant=\"success\" message={translate('common.preferences.savedSuccess')} toastId={toastId} />\n      ));\n      onClose();\n      if (data.language !== currentLocale) {\n        setLocaleCookie(data.language, whitelabel?.domain);\n        router.refresh();\n      }\n    } catch (error) {\n      toast.custom((toastId) => (\n        <Toast\n          variant=\"error\"\n          message={error instanceof Error ? error.message : translate('common.preferences.saveError')}\n          toastId={toastId}\n        />\n      ));\n    } finally {\n      setIsSaving(false);\n    }\n  };\n\n  const onSubmit = (data: PreferencesFormValues) => {\n    const accountFields: UpdateAccountRequest = {\n      ...(isOwner && dirtyFields.companyName && { name: data.companyName }),\n      ...(canEditPreferences && dirtyFields.currency && { currency: data.currency }),\n      ...(canEditPreferences && dirtyFields.timezone && { timezone: data.timezone }),\n    };\n    const globalFieldChanged = Object.keys(accountFields).length > 0;\n\n    if (globalFieldChanged) {\n      setPendingSubmit({ data, accountFields });\n      setConfirmGlobalOpen(true);\n    } else {\n      doSave(data, accountFields);\n    }\n  };\n\n  const handleConfirmGlobal = () => {\n    setConfirmGlobalOpen(false);\n    if (pendingSubmit) {\n      doSave(pendingSubmit.data, pendingSubmit.accountFields);\n      setPendingSubmit(null);\n    }\n  };\n\n  const handleCancelGlobal = () => {\n    setConfirmGlobalOpen(false);\n    setPendingSubmit(null);\n  };\n\n  return (\n    <>\n      <form onSubmit={handleSubmit(onSubmit)} className=\"flex flex-col h-full\">\n        <div className=\"overflow-y-auto overscroll-contain px-4 pb-4 lg:p-5 flex flex-col gap-5 lg:gap-6 flex-1\">\n          <span className=\"paragraph-medium-semibold text-gray-950\">{translate('common.preferences.title')}</span>\n          <div className=\"flex flex-col gap-8\">\n            <div className=\"flex flex-col lg:flex-row items-center gap-3\">\n              <FormField\n                label={translate('common.preferences.companyName')}\n                placeholder={translate('common.preferences.companyNamePlaceholder')}\n                classnameContainer={cn('w-full', !isOwner && 'cursor-not-allowed opacity-50')}\n                value={watch('companyName')}\n                onChange={(e) => setValue('companyName', e.target.value, { shouldDirty: true })}\n                disabled={!isOwner}\n              />\n            </div>\n\n            <div className=\"flex flex-col lg:flex-row items-center gap-3\">\n              <ComboboxField\n                label={translate('common.preferences.language')}\n                placeholder={translate('common.preferences.languagePlaceholder')}\n                searchPlaceholder={translate('common.preferences.languageSearch')}\n                containerClassName=\"w-full\"\n                options={languageOptions}\n                value={watch('language')}\n                onChange={(value) => setValue('language', value, { shouldDirty: true })}\n              />\n              <ComboboxField\n                label={translate('common.preferences.currency')}\n                placeholder={translate('common.preferences.currencyPlaceholder')}\n                searchPlaceholder={translate('common.preferences.currencySearch')}\n                containerClassName=\"w-full\"\n                options={currencies}\n                value={watch('currency')}\n                onChange={(value) => setValue('currency', value, { shouldDirty: true })}\n                icon={!canEditPreferences ? <IconLock className=\"size-4 text-gray-400\" /> : undefined}\n                disabled={!canEditPreferences}\n              />\n            </div>\n\n            <Separator />\n\n            <div className=\"flex flex-col gap-4\">\n              <span className=\"paragraph-medium-semibold text-gray-950\">{translate('common.preferences.timeDisplay')}</span>\n              <div className=\"flex flex-col lg:flex-row items-center gap-3\">\n                <ComboboxField\n                  label={translate('common.preferences.timezone')}\n                  placeholder={translate('common.preferences.timezonePlaceholder')}\n                  searchPlaceholder={translate('common.preferences.timezoneSearch')}\n                  containerClassName=\"w-full\"\n                  options={timezones}\n                  value={watch('timezone')}\n                  onChange={(value) => setValue('timezone', value, { shouldDirty: true })}\n                  icon={!canEditPreferences ? <IconLock className=\"size-4 text-gray-400\" /> : undefined}\n                  disabled={!canEditPreferences}\n                />\n                <SelectField\n                  label={translate('common.preferences.timeFormat')}\n                  placeholder={translate('common.preferences.timeFormatPlaceholder')}\n                  className=\"h-10!\"\n                  containerClassName=\"w-full\"\n                  options={timeFormatOptions}\n                  value={watch('timeFormat')}\n                  onChange={(value) =>\n                    setValue('timeFormat', value as string, { shouldDirty: true })\n                  }\n                  icon={<IconLock className=\"size-4 text-gray-400\" />}\n                  disabled\n                />\n              </div>\n            </div>\n\n          </div>\n        </div>\n\n        <div className=\"fixed bottom-0 left-0 right-0 lg:absolute flex items-center h-20 px-4 lg:px-5 border-t border-gray-200 justify-between bg-white z-10\">\n          <Button\n            variant=\"secondary\"\n            className=\"h-10!\"\n            type=\"button\"\n            disabled={isSaving}\n            onClick={() => {\n              reset();\n              onClose();\n            }}\n          >\n            {translate('common.actions.cancel')}\n          </Button>\n          <Button className=\"h-10!\" type=\"submit\" disabled={isSaving}>\n            {isSaving ? translate('common.actions.saving') : translate('common.actions.saveChanges')}\n          </Button>\n        </div>\n      </form>\n\n      <ConfirmGlobalPreferencesModal\n        open={confirmGlobalOpen}\n        onConfirm={handleConfirmGlobal}\n        onCancel={handleCancelGlobal}\n      />\n    </>\n  );\n}\n"],"mappings":"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","names":[]}