@greatapps/common 1.1.790 → 1.1.792

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

@@ -17,6 +17,7 @@ import { FormField } from "../../ui/form/FormField";
 import { ComboboxField } from "../../ui/form/ComboboxField";
 import { SelectField } from "../../ui/form/SelectField";
 import ConfirmGlobalPreferencesModal from "../ConfirmGlobalPreferencesModal";
+import { FormSection } from "./shared/FormSection";
 import { useAuth } from "../../../providers/auth.provider";
 import { useWhitelabel } from "../../../providers/whitelabel.provider";
 import { UserProfile } from "../../../modules/users/schema";
@@ -30,8 +31,9 @@ import {
 } from "../constants";
 import { useTimezones } from "../../../modules/accounts/hooks/useTimezones";
 import { useCurrencies } from "../../../modules/accounts/hooks/useCurrencies";
+import { useAccountUnsavedChanges } from "../../../store/useAccountUnsavedChanges";
 import { getCurrencyForGateway } from "../../../utils/format/currency";
-function PreferencesSection({ onClose }) {
+function PreferencesSection() {
   const translate = useTranslations();
   const translateLanguage = useTranslations("common.languages");
   const currentLocale = useLocale();
@@ -58,7 +60,10 @@ function PreferencesSection({ onClose }) {
   const [confirmGlobalOpen, setConfirmGlobalOpen] = useState(false);
   const [pendingSubmit, setPendingSubmit] = useState(null);
   const [isSaving, setIsSaving] = useState(false);
-  const { watch, setValue, handleSubmit, reset, formState: { dirtyFields } } = useForm({
+  const setDirtyForm = useAccountUnsavedChanges((state) => state.setDirtyForm);
+  const completeSave = useAccountUnsavedChanges((state) => state.completeSave);
+  const dismissUnsavedChanges = useAccountUnsavedChanges((state) => state.dismiss);
+  const { watch, setValue, handleSubmit, reset, formState: { dirtyFields, isDirty } } = useForm({
     defaultValues: {
       companyName: "",
       language: "",
@@ -99,7 +104,7 @@ function PreferencesSection({ onClose }) {
       }
       reset(data);
       toast.custom((toastId) => /* @__PURE__ */ jsx(Toast, { variant: "success", message: translate("common.preferences.savedSuccess"), toastId }));
-      onClose();
+      completeSave();
       if (data.language !== currentLocale) {
         setLocaleCookie(data.language, whitelabel?.domain);
         router.refresh();
@@ -113,6 +118,7 @@ function PreferencesSection({ onClose }) {
           toastId
         }
       ));
+      dismissUnsavedChanges();
     } finally {
       setIsSaving(false);
     }
@@ -141,55 +147,71 @@ function PreferencesSection({ onClose }) {
   const handleCancelGlobal = () => {
     setConfirmGlobalOpen(false);
     setPendingSubmit(null);
+    dismissUnsavedChanges();
   };
+  useEffect(() => {
+    if (!isDirty) return;
+    setDirtyForm({ submit: handleSubmit(onSubmit), discard: () => reset() });
+    return () => setDirtyForm(null);
+  });
   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: 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: 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 }),
-              disabled: !isOwner
-            }
-          ) }),
-          /* @__PURE__ */ jsxs("div", { className: "flex flex-col lg:flex-row items-center gap-3", children: [
-            /* @__PURE__ */ jsx(
-              ComboboxField,
-              {
-                label: translate("common.preferences.language"),
-                placeholder: translate("common.preferences.languagePlaceholder"),
-                searchPlaceholder: translate("common.preferences.languageSearch"),
-                containerClassName: "w-full",
-                options: languageOptions,
-                value: watch("language"),
-                onChange: (value) => setValue("language", value, { shouldDirty: true })
-              }
-            ),
-            /* @__PURE__ */ jsx(
-              ComboboxField,
-              {
-                label: translate("common.preferences.currency"),
-                placeholder: translate("common.preferences.currencyPlaceholder"),
-                searchPlaceholder: translate("common.preferences.currencySearch"),
-                containerClassName: "w-full",
-                options: currencies,
-                value: watch("currency"),
-                onChange: () => void 0,
-                icon: /* @__PURE__ */ jsx(IconLock, { className: "size-4 text-gray-400" }),
-                disabled: true
-              }
-            )
-          ] }),
-          /* @__PURE__ */ jsx(Separator, {}),
-          /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-4", children: [
-            /* @__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__ */ jsxs("div", { className: "overflow-y-auto [scrollbar-width:auto] [&::-webkit-scrollbar]:w-1.5 [&::-webkit-scrollbar-track]:bg-transparent [&::-webkit-scrollbar-thumb]:rounded-full [&::-webkit-scrollbar-thumb]:bg-zinc-300 overscroll-contain px-4 py-5 pb-24 lg:px-8 lg:py-6 lg:pb-28 flex flex-col gap-6 lg:gap-8 flex-1", children: [
+        /* @__PURE__ */ jsx(
+          FormSection,
+          {
+            title: translate("common.preferences.general"),
+            description: translate("common.preferences.generalDescription"),
+            children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-4", children: [
+              /* @__PURE__ */ jsx(
+                FormField,
+                {
+                  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 }),
+                  disabled: !isOwner
+                }
+              ),
+              /* @__PURE__ */ jsxs("div", { className: "flex flex-col lg:flex-row items-center gap-3", children: [
+                /* @__PURE__ */ jsx(
+                  ComboboxField,
+                  {
+                    label: translate("common.preferences.language"),
+                    placeholder: translate("common.preferences.languagePlaceholder"),
+                    searchPlaceholder: translate("common.preferences.languageSearch"),
+                    containerClassName: "w-full",
+                    options: languageOptions,
+                    value: watch("language"),
+                    onChange: (value) => setValue("language", value, { shouldDirty: true })
+                  }
+                ),
+                /* @__PURE__ */ jsx(
+                  ComboboxField,
+                  {
+                    label: translate("common.preferences.currency"),
+                    placeholder: translate("common.preferences.currencyPlaceholder"),
+                    searchPlaceholder: translate("common.preferences.currencySearch"),
+                    containerClassName: "w-full",
+                    options: currencies,
+                    value: watch("currency"),
+                    onChange: () => void 0,
+                    icon: /* @__PURE__ */ jsx(IconLock, { className: "size-4 text-gray-400" }),
+                    disabled: true
+                  }
+                )
+              ] })
+            ] })
+          }
+        ),
+        /* @__PURE__ */ jsx(Separator, {}),
+        /* @__PURE__ */ jsx(
+          FormSection,
+          {
+            title: translate("common.preferences.timeDisplay"),
+            description: translate("common.preferences.timeDisplayDescription"),
+            children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col lg:flex-row items-center gap-3", children: [
               /* @__PURE__ */ jsx(
                 ComboboxField,
                 {
@@ -219,26 +241,10 @@ function PreferencesSection({ onClose }) {
                 }
               )
             ] })
-          ] })
-        ] })
-      ] }),
-      /* @__PURE__ */ jsxs("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", children: [
-        /* @__PURE__ */ jsx(
-          Button,
-          {
-            variant: "secondary",
-            className: "h-10!",
-            type: "button",
-            disabled: isSaving,
-            onClick: () => {
-              reset();
-              onClose();
-            },
-            children: translate("common.actions.cancel")
           }
-        ),
-        /* @__PURE__ */ jsx(Button, { className: "h-10!", type: "submit", disabled: isSaving, children: isSaving ? translate("common.actions.saving") : translate("common.actions.saveChanges") })
-      ] })
+        )
+      ] }),
+      /* @__PURE__ */ jsx("div", { className: "fixed bottom-0 left-0 right-0 lg:absolute flex items-center h-20 px-4 lg:px-8 border-t border-gray-200 justify-end bg-white z-10", children: /* @__PURE__ */ jsx(Button, { className: "h-10!", type: "submit", disabled: !isDirty || isSaving, children: isSaving ? translate("common.actions.saving") : translate("common.actions.saveChanges") }) })
     ] }),
     /* @__PURE__ */ jsx(
       ConfirmGlobalPreferencesModal,

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 { 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 { isLocale, type Locale } from '../../../i18n/config';\nimport { setLocaleCookie } from '../../../utils/intl/locale-cookie';\nimport { localeToApiLanguage } from '../../../utils/intl/locales';\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';\nimport { getCurrencyForGateway } from '../../../utils/format/currency';\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      // A moeda é derivada do gateway da conta (read-only para o usuário) —\n      // espelha o que useCurrencyFormatter usa no display de preços.\n      currency: getCurrencyForGateway(account.gateway).toUpperCase(),\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 = isLocale(data.language) ? localeToApiLanguage(data.language) : 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      // currency é read-only (derivada do gateway) — não enviada no update.\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={() => undefined}\n                icon={<IconLock className=\"size-4 text-gray-400\" />}\n                disabled\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":[]}
+{"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 { isLocale, type Locale } from '../../../i18n/config';\nimport { setLocaleCookie } from '../../../utils/intl/locale-cookie';\nimport { localeToApiLanguage } from '../../../utils/intl/locales';\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 { FormSection } from './shared/FormSection';\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';\nimport { useAccountUnsavedChanges } from '../../../store/useAccountUnsavedChanges';\nimport { getCurrencyForGateway } from '../../../utils/format/currency';\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\nexport function PreferencesSection() {\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  const setDirtyForm = useAccountUnsavedChanges((state) => state.setDirtyForm);\n  const completeSave = useAccountUnsavedChanges((state) => state.completeSave);\n  const dismissUnsavedChanges = useAccountUnsavedChanges((state) => state.dismiss);\n\n  const { watch, setValue, handleSubmit, reset, formState: { dirtyFields, isDirty } } =\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      // A moeda é derivada do gateway da conta (read-only para o usuário) —\n      // espelha o que useCurrencyFormatter usa no display de preços.\n      currency: getCurrencyForGateway(account.gateway).toUpperCase(),\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 = isLocale(data.language) ? localeToApiLanguage(data.language) : 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      completeSave();\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      dismissUnsavedChanges();\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      // currency é read-only (derivada do gateway) — não enviada no update.\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    dismissUnsavedChanges();\n  };\n\n  useEffect(() => {\n    if (!isDirty) return;\n    setDirtyForm({ submit: handleSubmit(onSubmit), discard: () => reset() });\n    return () => setDirtyForm(null);\n  });\n\n  return (\n    <>\n      <form onSubmit={handleSubmit(onSubmit)} className=\"flex flex-col h-full\">\n        <div className=\"overflow-y-auto [scrollbar-width:auto] [&::-webkit-scrollbar]:w-1.5 [&::-webkit-scrollbar-track]:bg-transparent [&::-webkit-scrollbar-thumb]:rounded-full [&::-webkit-scrollbar-thumb]:bg-zinc-300 overscroll-contain px-4 py-5 pb-24 lg:px-8 lg:py-6 lg:pb-28 flex flex-col gap-6 lg:gap-8 flex-1\">\n          <FormSection\n            title={translate('common.preferences.general')}\n            description={translate('common.preferences.generalDescription')}\n          >\n            <div className=\"flex flex-col gap-4\">\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\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={() => undefined}\n                  icon={<IconLock className=\"size-4 text-gray-400\" />}\n                  disabled\n                />\n              </div>\n            </div>\n          </FormSection>\n\n          <Separator />\n\n          <FormSection\n            title={translate('common.preferences.timeDisplay')}\n            description={translate('common.preferences.timeDisplayDescription')}\n          >\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          </FormSection>\n        </div>\n\n        <div className=\"fixed bottom-0 left-0 right-0 lg:absolute flex items-center h-20 px-4 lg:px-8 border-t border-gray-200 justify-end bg-white z-10\">\n          <Button className=\"h-10!\" type=\"submit\" disabled={!isDirty || 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":[]}

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

@@ -0,0 +1,77 @@
+"use client";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { useState } from "react";
+import { IconPlus, IconSearch } from "@tabler/icons-react";
+import { useTranslations } from "next-intl";
+import { Button } from "../../ui/buttons/Button";
+import { Skeleton } from "../../ui/feedback/Skeleton";
+import { FormField } from "../../ui/form/FormField";
+import { useDebounce } from "../../../hooks/useDebounce";
+import { useManagementPermissions } from "../../../modules/auth/hooks/useManagementPermissions";
+import { useProjects } from "../../../modules/projects/hooks/list-projects.hook";
+import useProjectsActions from "../hooks/useProjectsActions";
+import { ListPagination } from "./shared/ListPagination";
+import { SectionLoadError } from "./shared/SectionLoadError";
+import { WorkspaceSection } from "./shared/WorkspaceSection";
+import { ProjectCard, ProjectRow } from "./projects/ProjectRow";
+import { ProjectFlows } from "./projects/ProjectFlows";
+const PROJECTS_PAGE_SIZE = 10;
+function ProjectsSkeleton() {
+  return /* @__PURE__ */ jsx("div", { className: "border border-zinc-200 rounded-lg bg-white divide-y divide-zinc-200 overflow-hidden", children: Array.from({ length: PROJECTS_PAGE_SIZE }).map((_, index) => /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-4 px-5 py-4", children: [
+    /* @__PURE__ */ jsx(Skeleton, { className: "size-8 rounded-lg" }),
+    /* @__PURE__ */ jsx(Skeleton, { className: "h-4 w-48" }),
+    /* @__PURE__ */ jsx(Skeleton, { className: "hidden lg:block h-8 w-24 rounded-full ml-auto" }),
+    /* @__PURE__ */ jsx(Skeleton, { className: "hidden lg:block h-10 w-[88px] rounded-lg" })
+  ] }, index)) });
+}
+function ProjectsSection() {
+  const translate = useTranslations();
+  const { isOwnerOrAdmin: canManage } = useManagementPermissions();
+  const actions = useProjectsActions();
+  const [searchQuery, setSearchQuery] = useState("");
+  const [currentPage, setCurrentPage] = useState(1);
+  const debouncedSearch = useDebounce(searchQuery, 400, () => setCurrentPage(1));
+  const { data, isPending, isFetching, isPlaceholderData, isError, refetch } = useProjects({
+    page: currentPage,
+    limit: PROJECTS_PAGE_SIZE,
+    sort: "title",
+    search: debouncedSearch || void 0,
+    deleted: 0
+  });
+  const projects = data?.data ?? [];
+  const total = data?.total ?? 0;
+  const totalPages = Math.ceil(total / PROJECTS_PAGE_SIZE);
+  const showSkeleton = isPending && !data || isPlaceholderData && isFetching;
+  const rowProps = { canManage, onOpen: actions.openProject, onDelete: actions.deleteProject };
+  return /* @__PURE__ */ jsxs(WorkspaceSection, { count: data ? total : void 0, children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-3", children: [
+      /* @__PURE__ */ jsx(
+        FormField,
+        {
+          leftIcon: IconSearch,
+          placeholder: translate("common.account.workspace.projects.searchPlaceholder"),
+          value: searchQuery,
+          onChange: (event) => setSearchQuery(event.target.value),
+          classnameContainer: "w-full lg:w-75"
+        }
+      ),
+      canManage && /* @__PURE__ */ jsxs(Button, { className: "h-10! shrink-0", onClick: actions.createProject, children: [
+        /* @__PURE__ */ jsx(IconPlus, { className: "size-5!" }),
+        translate("common.account.workspace.projects.newProject")
+      ] })
+    ] }),
+    showSkeleton && /* @__PURE__ */ jsx(ProjectsSkeleton, {}),
+    !showSkeleton && isError && /* @__PURE__ */ jsx(SectionLoadError, { message: translate("common.account.workspace.loadFailed"), onRetry: () => refetch() }),
+    !showSkeleton && !isError && projects.length === 0 && /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center py-12 border border-zinc-200 rounded-lg bg-white", children: /* @__PURE__ */ jsx("p", { className: "paragraph-small-medium text-zinc-500", children: translate("common.account.workspace.projects.empty") }) }),
+    !showSkeleton && !isError && projects.length > 0 && /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx("div", { className: "hidden lg:block border border-zinc-200 rounded-lg bg-white divide-y divide-zinc-200 overflow-hidden", children: projects.map((project) => /* @__PURE__ */ jsx(ProjectRow, { project, ...rowProps }, project.id)) }),
+      /* @__PURE__ */ jsx("div", { className: "lg:hidden flex flex-col gap-3", children: projects.map((project) => /* @__PURE__ */ jsx(ProjectCard, { project, ...rowProps }, project.id)) })
+    ] }),
+    /* @__PURE__ */ jsx(ListPagination, { currentPage, totalPages, onPageChange: setCurrentPage }),
+    /* @__PURE__ */ jsx(ProjectFlows, {})
+  ] });
+}
+export {
+  ProjectsSection
+};
+//# sourceMappingURL=ProjectsSection.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/account/sections/ProjectsSection.tsx"],"sourcesContent":["'use client';\n\nimport { useState } from 'react';\nimport { IconPlus, IconSearch } from '@tabler/icons-react';\nimport { useTranslations } from 'next-intl';\nimport { Button } from '../../ui/buttons/Button';\nimport { Skeleton } from '../../ui/feedback/Skeleton';\nimport { FormField } from '../../ui/form/FormField';\nimport { useDebounce } from '../../../hooks/useDebounce';\nimport { useManagementPermissions } from '../../../modules/auth/hooks/useManagementPermissions';\nimport { useProjects } from '../../../modules/projects/hooks/list-projects.hook';\nimport useProjectsActions from '../hooks/useProjectsActions';\nimport { ListPagination } from './shared/ListPagination';\nimport { SectionLoadError } from './shared/SectionLoadError';\nimport { WorkspaceSection } from './shared/WorkspaceSection';\nimport { ProjectCard, ProjectRow } from './projects/ProjectRow';\nimport { ProjectFlows } from './projects/ProjectFlows';\n\nconst PROJECTS_PAGE_SIZE = 10;\n\nfunction ProjectsSkeleton() {\n  return (\n    <div className=\"border border-zinc-200 rounded-lg bg-white divide-y divide-zinc-200 overflow-hidden\">\n      {Array.from({ length: PROJECTS_PAGE_SIZE }).map((_, index) => (\n        <div key={index} className=\"flex items-center gap-4 px-5 py-4\">\n          <Skeleton className=\"size-8 rounded-lg\" />\n          <Skeleton className=\"h-4 w-48\" />\n          <Skeleton className=\"hidden lg:block h-8 w-24 rounded-full ml-auto\" />\n          <Skeleton className=\"hidden lg:block h-10 w-[88px] rounded-lg\" />\n        </div>\n      ))}\n    </div>\n  );\n}\n\nexport function ProjectsSection() {\n  const translate = useTranslations();\n  const { isOwnerOrAdmin: canManage } = useManagementPermissions();\n  const actions = useProjectsActions();\n\n  const [searchQuery, setSearchQuery] = useState('');\n  const [currentPage, setCurrentPage] = useState(1);\n  const debouncedSearch = useDebounce(searchQuery, 400, () => setCurrentPage(1));\n\n  const { data, isPending, isFetching, isPlaceholderData, isError, refetch } = useProjects({\n    page: currentPage,\n    limit: PROJECTS_PAGE_SIZE,\n    sort: 'title',\n    search: debouncedSearch || undefined,\n    deleted: 0,\n  });\n\n  const projects = data?.data ?? [];\n  const total = data?.total ?? 0;\n  const totalPages = Math.ceil(total / PROJECTS_PAGE_SIZE);\n  const showSkeleton = (isPending && !data) || (isPlaceholderData && isFetching);\n\n  const rowProps = { canManage, onOpen: actions.openProject, onDelete: actions.deleteProject };\n\n  return (\n    <WorkspaceSection count={data ? total : undefined}>\n      <div className=\"flex items-center justify-between gap-3\">\n        <FormField\n          leftIcon={IconSearch}\n          placeholder={translate('common.account.workspace.projects.searchPlaceholder')}\n          value={searchQuery}\n          onChange={(event) => setSearchQuery(event.target.value)}\n          classnameContainer=\"w-full lg:w-75\"\n        />\n        {canManage && (\n          <Button className=\"h-10! shrink-0\" onClick={actions.createProject}>\n            <IconPlus className=\"size-5!\" />\n            {translate('common.account.workspace.projects.newProject')}\n          </Button>\n        )}\n      </div>\n\n      {showSkeleton && <ProjectsSkeleton />}\n\n      {!showSkeleton && isError && (\n        <SectionLoadError message={translate('common.account.workspace.loadFailed')} onRetry={() => refetch()} />\n      )}\n\n      {!showSkeleton && !isError && projects.length === 0 && (\n        <div className=\"flex items-center justify-center py-12 border border-zinc-200 rounded-lg bg-white\">\n          <p className=\"paragraph-small-medium text-zinc-500\">{translate('common.account.workspace.projects.empty')}</p>\n        </div>\n      )}\n\n      {!showSkeleton && !isError && projects.length > 0 && (\n        <>\n          <div className=\"hidden lg:block border border-zinc-200 rounded-lg bg-white divide-y divide-zinc-200 overflow-hidden\">\n            {projects.map((project) => (\n              <ProjectRow key={project.id} project={project} {...rowProps} />\n            ))}\n          </div>\n          <div className=\"lg:hidden flex flex-col gap-3\">\n            {projects.map((project) => (\n              <ProjectCard key={project.id} project={project} {...rowProps} />\n            ))}\n          </div>\n        </>\n      )}\n\n      <ListPagination currentPage={currentPage} totalPages={totalPages} onPageChange={setCurrentPage} />\n\n      <ProjectFlows />\n    </WorkspaceSection>\n  );\n}\n"],"mappings":"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","names":[]}

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

@@ -1,5 +1,5 @@
 "use client";
-import { jsx, jsxs } from "react/jsx-runtime";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { IconAlertTriangle } from "@tabler/icons-react";
 import { useTranslations } from "next-intl";
 import { toast } from "sonner";
@@ -8,11 +8,24 @@ import { useAuth } from "../../../providers/auth.provider";
 import { useUnlinkGoogle } from "../../../modules/auth/hooks/unlink-google.hook";
 import { USER_QUERY_KEY } from "../../../modules/auth/hooks/useUserQuery";
 import { Button } from "../../ui/buttons/Button";
+import { Separator } from "../../ui/data-display/Separator";
 import { Toast } from "../../ui/feedback/Toast";
 import { GoogleIcon } from "../../ui/data-display/GoogleIcon";
-function SecuritySection({
-  onDeleteAccount
-}) {
+import { cn } from "../../../infra/utils/clsx";
+import { WorkspaceSection } from "./shared/WorkspaceSection";
+function SecurityBlock({ icon, iconClassName, title, description, action }) {
+  return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-4", children: [
+    /* @__PURE__ */ jsx("div", { className: cn("size-10 rounded-lg flex items-center justify-center", iconClassName), children: icon }),
+    /* @__PURE__ */ jsxs("div", { className: "flex flex-col lg:flex-row lg:items-center justify-between gap-4", children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2 max-w-125", children: [
+        /* @__PURE__ */ jsx("span", { className: "paragraph-medium-semibold text-gray-950", children: title }),
+        /* @__PURE__ */ jsx("span", { className: "paragraph-small-regular text-gray-600", children: description })
+      ] }),
+      action && /* @__PURE__ */ jsx("div", { className: "shrink-0", children: action })
+    ] })
+  ] });
+}
+function SecuritySection({ onDeleteAccount }) {
   const translate = useTranslations();
   const { user } = useAuth();
   const queryClient = useQueryClient();
@@ -28,42 +41,48 @@ function SecuritySection({
       toast.custom((toastId) => /* @__PURE__ */ jsx(Toast, { variant: "error", message, toastId }));
     }
   };
-  return /* @__PURE__ */ jsxs("div", { className: "h-full overflow-y-auto overscroll-contain px-4 pb-20 lg:p-5 lg:pt-5 flex flex-col gap-5 lg:gap-6 lg:pb-31 lg:overscroll-auto", children: [
-    /* @__PURE__ */ jsx("span", { className: "paragraph-medium-semibold text-gray-950 hidden lg:block", children: translate("common.account.security.title") }),
-    hasGoogleLinked && /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center lg:items-start gap-4", children: [
-      /* @__PURE__ */ jsx("div", { className: "size-10 rounded-lg bg-gray-50 flex items-center justify-center", children: /* @__PURE__ */ jsx(GoogleIcon, { size: 20 }) }),
-      /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2", children: [
-        /* @__PURE__ */ jsx("span", { className: "paragraph-medium-semibold text-gray-950", children: translate("common.account.security.googleLinkedTitle") }),
-        /* @__PURE__ */ jsx("span", { className: "paragraph-small-regular text-gray-600", children: translate("common.account.security.googleLinkedDescription") })
-      ] }),
+  return /* @__PURE__ */ jsxs(WorkspaceSection, { children: [
+    hasGoogleLinked && /* @__PURE__ */ jsxs(Fragment, { children: [
       /* @__PURE__ */ jsx(
-        Button,
+        SecurityBlock,
         {
-          variant: "secondary",
-          className: "h-10! w-fit",
-          type: "button",
-          disabled: isUnlinking,
-          onClick: handleUnlinkGoogle,
-          children: isUnlinking ? translate("common.account.security.unlinking") : translate("common.account.security.unlinkGoogle")
+          icon: /* @__PURE__ */ jsx(GoogleIcon, { size: 20 }),
+          iconClassName: "bg-gray-50",
+          title: translate("common.account.security.googleLinkedTitle"),
+          description: translate("common.account.security.googleLinkedDescription"),
+          action: /* @__PURE__ */ jsx(
+            Button,
+            {
+              variant: "secondary",
+              className: "h-10! w-fit",
+              type: "button",
+              disabled: isUnlinking,
+              onClick: handleUnlinkGoogle,
+              children: isUnlinking ? translate("common.account.security.unlinking") : translate("common.account.security.unlinkGoogle")
+            }
+          )
         }
-      )
+      ),
+      /* @__PURE__ */ jsx(Separator, {})
     ] }),
-    /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center lg:items-start gap-4", children: [
-      /* @__PURE__ */ jsx("div", { className: "size-10 rounded-lg bg-red-50 flex items-center justify-center", children: /* @__PURE__ */ jsx(IconAlertTriangle, { size: 20, className: "text-red-500" }) }),
-      /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2", children: [
-        /* @__PURE__ */ jsx("span", { className: "paragraph-medium-semibold text-gray-950", children: translate("common.account.deleteAccount.title") }),
-        /* @__PURE__ */ jsx("span", { className: "paragraph-small-regular text-gray-600", children: translate("common.account.security.deleteAccountDescription") })
-      ] }),
-      onDeleteAccount && /* @__PURE__ */ jsx(
-        "button",
-        {
-          type: "button",
-          className: "paragraph-small-semibold text-red-600 bg-red-50 rounded-lg px-3 py-2 cursor-pointer hover:bg-red-100 transition-colors w-fit",
-          onClick: onDeleteAccount,
-          children: translate("common.account.security.deleteMyAccount")
-        }
-      )
-    ] })
+    /* @__PURE__ */ jsx(
+      SecurityBlock,
+      {
+        icon: /* @__PURE__ */ jsx(IconAlertTriangle, { size: 20, className: "text-red-500" }),
+        iconClassName: "bg-red-50",
+        title: translate("common.account.deleteAccount.title"),
+        description: translate("common.account.security.deleteAccountDescription"),
+        action: onDeleteAccount && /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            className: "paragraph-small-semibold text-red-600 bg-red-50 rounded-lg h-10 px-3 cursor-pointer hover:bg-red-100 transition-colors w-fit",
+            onClick: onDeleteAccount,
+            children: translate("common.account.security.deleteMyAccount")
+          }
+        )
+      }
+    )
   ] });
 }
 export {

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/account/sections/SecuritySection.tsx"],"sourcesContent":["'use client';\n\nimport { IconAlertTriangle } from '@tabler/icons-react';\nimport { useTranslations } from 'next-intl';\nimport { toast } from 'sonner';\nimport { useQueryClient } from '@tanstack/react-query';\nimport { useAuth } from '../../../providers/auth.provider';\nimport { AccountSectionType } from '../../../enums/AccountSectionType';\nimport { useUnlinkGoogle } from '../../../modules/auth/hooks/unlink-google.hook';\nimport { USER_QUERY_KEY } from '../../../modules/auth/hooks/useUserQuery';\nimport { Button } from '../../ui/buttons/Button';\nimport { Toast } from '../../ui/feedback/Toast';\nimport { GoogleIcon } from '../../ui/data-display/GoogleIcon';\n\ninterface SecuritySectionProps {\n  setActiveSection: (section: AccountSectionType) => void;\n  onClose: () => void;\n  onDeleteAccount?: () => void;\n}\n\nexport function SecuritySection({\n  onDeleteAccount,\n}: SecuritySectionProps) {\n  const translate = useTranslations();\n  const { user } = useAuth();\n  const queryClient = useQueryClient();\n  const { mutateAsync: unlinkGoogle, isPending: isUnlinking } = useUnlinkGoogle();\n  const hasGoogleLinked = !!user?.google_sub;\n\n  const handleUnlinkGoogle = async () => {\n    try {\n      const result = await unlinkGoogle();\n      toast.custom((t) => (\n        <Toast variant=\"success\" message={result.message} toastId={t} />\n      ));\n      queryClient.invalidateQueries({ queryKey: USER_QUERY_KEY });\n    } catch (error) {\n      const message =\n        error instanceof Error ? error.message : translate('common.account.security.unlinkError');\n      toast.custom((toastId) => <Toast variant=\"error\" message={message} toastId={toastId} />);\n    }\n  };\n\n  return (\n    <div className=\"h-full overflow-y-auto overscroll-contain px-4 pb-20 lg:p-5 lg:pt-5 flex flex-col gap-5 lg:gap-6 lg:pb-31 lg:overscroll-auto\">\n      <span className=\"paragraph-medium-semibold text-gray-950 hidden lg:block\">\n        {translate('common.account.security.title')}\n      </span>\n\n      {hasGoogleLinked && (\n        <div className=\"flex flex-col items-center lg:items-start gap-4\">\n          <div className=\"size-10 rounded-lg bg-gray-50 flex items-center justify-center\">\n            <GoogleIcon size={20} />\n          </div>\n\n          <div className=\"flex flex-col gap-2\">\n            <span className=\"paragraph-medium-semibold text-gray-950\">\n              {translate('common.account.security.googleLinkedTitle')}\n            </span>\n            <span className=\"paragraph-small-regular text-gray-600\">\n              {translate('common.account.security.googleLinkedDescription')}\n            </span>\n          </div>\n\n          <Button\n            variant=\"secondary\"\n            className=\"h-10! w-fit\"\n            type=\"button\"\n            disabled={isUnlinking}\n            onClick={handleUnlinkGoogle}\n          >\n            {isUnlinking\n              ? translate('common.account.security.unlinking')\n              : translate('common.account.security.unlinkGoogle')}\n          </Button>\n        </div>\n      )}\n\n      <div className=\"flex flex-col items-center lg:items-start gap-4\">\n        <div className=\"size-10 rounded-lg bg-red-50 flex items-center justify-center\">\n          <IconAlertTriangle size={20} className=\"text-red-500\" />\n        </div>\n\n        <div className=\"flex flex-col gap-2\">\n          <span className=\"paragraph-medium-semibold text-gray-950\">\n            {translate('common.account.deleteAccount.title')}\n          </span>\n          <span className=\"paragraph-small-regular text-gray-600\">\n            {translate('common.account.security.deleteAccountDescription')}\n          </span>\n        </div>\n\n        {onDeleteAccount && (\n          <button\n            type=\"button\"\n            className=\"paragraph-small-semibold text-red-600 bg-red-50 rounded-lg px-3 py-2 cursor-pointer hover:bg-red-100 transition-colors w-fit\"\n            onClick={onDeleteAccount}\n          >\n            {translate('common.account.security.deleteMyAccount')}\n          </button>\n        )}\n      </div>\n    </div>\n  );\n}\n"],"mappings":";AAiCQ,cAsBE,YAtBF;AA/BR,SAAS,yBAAyB;AAClC,SAAS,uBAAuB;AAChC,SAAS,aAAa;AACtB,SAAS,sBAAsB;AAC/B,SAAS,eAAe;AAExB,SAAS,uBAAuB;AAChC,SAAS,sBAAsB;AAC/B,SAAS,cAAc;AACvB,SAAS,aAAa;AACtB,SAAS,kBAAkB;AAQpB,SAAS,gBAAgB;AAAA,EAC9B;AACF,GAAyB;AACvB,QAAM,YAAY,gBAAgB;AAClC,QAAM,EAAE,KAAK,IAAI,QAAQ;AACzB,QAAM,cAAc,eAAe;AACnC,QAAM,EAAE,aAAa,cAAc,WAAW,YAAY,IAAI,gBAAgB;AAC9E,QAAM,kBAAkB,CAAC,CAAC,MAAM;AAEhC,QAAM,qBAAqB,YAAY;AACrC,QAAI;AACF,YAAM,SAAS,MAAM,aAAa;AAClC,YAAM,OAAO,CAAC,MACZ,oBAAC,SAAM,SAAQ,WAAU,SAAS,OAAO,SAAS,SAAS,GAAG,CAC/D;AACD,kBAAY,kBAAkB,EAAE,UAAU,eAAe,CAAC;AAAA,IAC5D,SAAS,OAAO;AACd,YAAM,UACJ,iBAAiB,QAAQ,MAAM,UAAU,UAAU,qCAAqC;AAC1F,YAAM,OAAO,CAAC,YAAY,oBAAC,SAAM,SAAQ,SAAQ,SAAkB,SAAkB,CAAE;AAAA,IACzF;AAAA,EACF;AAEA,SACE,qBAAC,SAAI,WAAU,gIACb;AAAA,wBAAC,UAAK,WAAU,2DACb,oBAAU,+BAA+B,GAC5C;AAAA,IAEC,mBACC,qBAAC,SAAI,WAAU,mDACb;AAAA,0BAAC,SAAI,WAAU,kEACb,8BAAC,cAAW,MAAM,IAAI,GACxB;AAAA,MAEA,qBAAC,SAAI,WAAU,uBACb;AAAA,4BAAC,UAAK,WAAU,2CACb,oBAAU,2CAA2C,GACxD;AAAA,QACA,oBAAC,UAAK,WAAU,yCACb,oBAAU,iDAAiD,GAC9D;AAAA,SACF;AAAA,MAEA;AAAA,QAAC;AAAA;AAAA,UACC,SAAQ;AAAA,UACR,WAAU;AAAA,UACV,MAAK;AAAA,UACL,UAAU;AAAA,UACV,SAAS;AAAA,UAER,wBACG,UAAU,mCAAmC,IAC7C,UAAU,sCAAsC;AAAA;AAAA,MACtD;AAAA,OACF;AAAA,IAGF,qBAAC,SAAI,WAAU,mDACb;AAAA,0BAAC,SAAI,WAAU,iEACb,8BAAC,qBAAkB,MAAM,IAAI,WAAU,gBAAe,GACxD;AAAA,MAEA,qBAAC,SAAI,WAAU,uBACb;AAAA,4BAAC,UAAK,WAAU,2CACb,oBAAU,oCAAoC,GACjD;AAAA,QACA,oBAAC,UAAK,WAAU,yCACb,oBAAU,kDAAkD,GAC/D;AAAA,SACF;AAAA,MAEC,mBACC;AAAA,QAAC;AAAA;AAAA,UACC,MAAK;AAAA,UACL,WAAU;AAAA,UACV,SAAS;AAAA,UAER,oBAAU,yCAAyC;AAAA;AAAA,MACtD;AAAA,OAEJ;AAAA,KACF;AAEJ;","names":[]}
+{"version":3,"sources":["../../../../src/components/account/sections/SecuritySection.tsx"],"sourcesContent":["'use client';\n\nimport type { ReactNode } from 'react';\nimport { IconAlertTriangle } from '@tabler/icons-react';\nimport { useTranslations } from 'next-intl';\nimport { toast } from 'sonner';\nimport { useQueryClient } from '@tanstack/react-query';\nimport { useAuth } from '../../../providers/auth.provider';\nimport { AccountSectionType } from '../../../enums/AccountSectionType';\nimport { useUnlinkGoogle } from '../../../modules/auth/hooks/unlink-google.hook';\nimport { USER_QUERY_KEY } from '../../../modules/auth/hooks/useUserQuery';\nimport { Button } from '../../ui/buttons/Button';\nimport { Separator } from '../../ui/data-display/Separator';\nimport { Toast } from '../../ui/feedback/Toast';\nimport { GoogleIcon } from '../../ui/data-display/GoogleIcon';\nimport { cn } from '../../../infra/utils/clsx';\nimport { WorkspaceSection } from './shared/WorkspaceSection';\n\ninterface SecuritySectionProps {\n  setActiveSection: (section: AccountSectionType) => void;\n  onClose: () => void;\n  onDeleteAccount?: () => void;\n}\n\ntype SecurityBlockProps = {\n  icon: ReactNode;\n  iconClassName?: string;\n  title: string;\n  description: string;\n  action?: ReactNode;\n};\n\n/** Ícone em cima e, abaixo, texto à esquerda com a ação à direita. */\nfunction SecurityBlock({ icon, iconClassName, title, description, action }: SecurityBlockProps) {\n  return (\n    <div className=\"flex flex-col gap-4\">\n      <div className={cn('size-10 rounded-lg flex items-center justify-center', iconClassName)}>{icon}</div>\n\n      <div className=\"flex flex-col lg:flex-row lg:items-center justify-between gap-4\">\n        <div className=\"flex flex-col gap-2 max-w-125\">\n          <span className=\"paragraph-medium-semibold text-gray-950\">{title}</span>\n          <span className=\"paragraph-small-regular text-gray-600\">{description}</span>\n        </div>\n        {action && <div className=\"shrink-0\">{action}</div>}\n      </div>\n    </div>\n  );\n}\n\nexport function SecuritySection({ onDeleteAccount }: SecuritySectionProps) {\n  const translate = useTranslations();\n  const { user } = useAuth();\n  const queryClient = useQueryClient();\n  const { mutateAsync: unlinkGoogle, isPending: isUnlinking } = useUnlinkGoogle();\n  const hasGoogleLinked = !!user?.google_sub;\n\n  const handleUnlinkGoogle = async () => {\n    try {\n      const result = await unlinkGoogle();\n      toast.custom((t) => <Toast variant=\"success\" message={result.message} toastId={t} />);\n      queryClient.invalidateQueries({ queryKey: USER_QUERY_KEY });\n    } catch (error) {\n      const message =\n        error instanceof Error ? error.message : translate('common.account.security.unlinkError');\n      toast.custom((toastId) => <Toast variant=\"error\" message={message} toastId={toastId} />);\n    }\n  };\n\n  return (\n    <WorkspaceSection>\n      {hasGoogleLinked && (\n        <>\n          <SecurityBlock\n            icon={<GoogleIcon size={20} />}\n            iconClassName=\"bg-gray-50\"\n            title={translate('common.account.security.googleLinkedTitle')}\n            description={translate('common.account.security.googleLinkedDescription')}\n            action={\n              <Button\n                variant=\"secondary\"\n                className=\"h-10! w-fit\"\n                type=\"button\"\n                disabled={isUnlinking}\n                onClick={handleUnlinkGoogle}\n              >\n                {isUnlinking\n                  ? translate('common.account.security.unlinking')\n                  : translate('common.account.security.unlinkGoogle')}\n              </Button>\n            }\n          />\n          <Separator />\n        </>\n      )}\n\n      <SecurityBlock\n        icon={<IconAlertTriangle size={20} className=\"text-red-500\" />}\n        iconClassName=\"bg-red-50\"\n        title={translate('common.account.deleteAccount.title')}\n        description={translate('common.account.security.deleteAccountDescription')}\n        action={\n          onDeleteAccount && (\n            <button\n              type=\"button\"\n              className=\"paragraph-small-semibold text-red-600 bg-red-50 rounded-lg h-10 px-3 cursor-pointer hover:bg-red-100 transition-colors w-fit\"\n              onClick={onDeleteAccount}\n            >\n              {translate('common.account.security.deleteMyAccount')}\n            </button>\n          )\n        }\n      />\n    </WorkspaceSection>\n  );\n}\n"],"mappings":";AAoCM,SAmCE,UAnCF,KAGE,YAHF;AAjCN,SAAS,yBAAyB;AAClC,SAAS,uBAAuB;AAChC,SAAS,aAAa;AACtB,SAAS,sBAAsB;AAC/B,SAAS,eAAe;AAExB,SAAS,uBAAuB;AAChC,SAAS,sBAAsB;AAC/B,SAAS,cAAc;AACvB,SAAS,iBAAiB;AAC1B,SAAS,aAAa;AACtB,SAAS,kBAAkB;AAC3B,SAAS,UAAU;AACnB,SAAS,wBAAwB;AAiBjC,SAAS,cAAc,EAAE,MAAM,eAAe,OAAO,aAAa,OAAO,GAAuB;AAC9F,SACE,qBAAC,SAAI,WAAU,uBACb;AAAA,wBAAC,SAAI,WAAW,GAAG,uDAAuD,aAAa,GAAI,gBAAK;AAAA,IAEhG,qBAAC,SAAI,WAAU,mEACb;AAAA,2BAAC,SAAI,WAAU,iCACb;AAAA,4BAAC,UAAK,WAAU,2CAA2C,iBAAM;AAAA,QACjE,oBAAC,UAAK,WAAU,yCAAyC,uBAAY;AAAA,SACvE;AAAA,MACC,UAAU,oBAAC,SAAI,WAAU,YAAY,kBAAO;AAAA,OAC/C;AAAA,KACF;AAEJ;AAEO,SAAS,gBAAgB,EAAE,gBAAgB,GAAyB;AACzE,QAAM,YAAY,gBAAgB;AAClC,QAAM,EAAE,KAAK,IAAI,QAAQ;AACzB,QAAM,cAAc,eAAe;AACnC,QAAM,EAAE,aAAa,cAAc,WAAW,YAAY,IAAI,gBAAgB;AAC9E,QAAM,kBAAkB,CAAC,CAAC,MAAM;AAEhC,QAAM,qBAAqB,YAAY;AACrC,QAAI;AACF,YAAM,SAAS,MAAM,aAAa;AAClC,YAAM,OAAO,CAAC,MAAM,oBAAC,SAAM,SAAQ,WAAU,SAAS,OAAO,SAAS,SAAS,GAAG,CAAE;AACpF,kBAAY,kBAAkB,EAAE,UAAU,eAAe,CAAC;AAAA,IAC5D,SAAS,OAAO;AACd,YAAM,UACJ,iBAAiB,QAAQ,MAAM,UAAU,UAAU,qCAAqC;AAC1F,YAAM,OAAO,CAAC,YAAY,oBAAC,SAAM,SAAQ,SAAQ,SAAkB,SAAkB,CAAE;AAAA,IACzF;AAAA,EACF;AAEA,SACE,qBAAC,oBACE;AAAA,uBACC,iCACE;AAAA;AAAA,QAAC;AAAA;AAAA,UACC,MAAM,oBAAC,cAAW,MAAM,IAAI;AAAA,UAC5B,eAAc;AAAA,UACd,OAAO,UAAU,2CAA2C;AAAA,UAC5D,aAAa,UAAU,iDAAiD;AAAA,UACxE,QACE;AAAA,YAAC;AAAA;AAAA,cACC,SAAQ;AAAA,cACR,WAAU;AAAA,cACV,MAAK;AAAA,cACL,UAAU;AAAA,cACV,SAAS;AAAA,cAER,wBACG,UAAU,mCAAmC,IAC7C,UAAU,sCAAsC;AAAA;AAAA,UACtD;AAAA;AAAA,MAEJ;AAAA,MACA,oBAAC,aAAU;AAAA,OACb;AAAA,IAGF;AAAA,MAAC;AAAA;AAAA,QACC,MAAM,oBAAC,qBAAkB,MAAM,IAAI,WAAU,gBAAe;AAAA,QAC5D,eAAc;AAAA,QACd,OAAO,UAAU,oCAAoC;AAAA,QACrD,aAAa,UAAU,kDAAkD;AAAA,QACzE,QACE,mBACE;AAAA,UAAC;AAAA;AAAA,YACC,MAAK;AAAA,YACL,WAAU;AAAA,YACV,SAAS;AAAA,YAER,oBAAU,yCAAyC;AAAA;AAAA,QACtD;AAAA;AAAA,IAGN;AAAA,KACF;AAEJ;","names":[]}

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

@@ -0,0 +1,29 @@
+"use client";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { useTranslations } from "next-intl";
+import { Separator } from "../../ui/data-display/Separator";
+import { useCurrentSubscription } from "../../../modules/subscriptions/hooks/use-current-subscription.hook";
+import { isFreeSubscription } from "../../../modules/subscriptions/utils/is-free-subscription";
+import { SubscriptionPlanCard } from "./subscription/SubscriptionPlanCard";
+import { PaymentMethodsCard } from "./subscription/PaymentMethodsCard";
+import { ChargesList } from "./subscription/ChargesList";
+import { SubscriptionFlows } from "./subscription/SubscriptionFlows";
+import { WorkspaceSection } from "./shared/WorkspaceSection";
+function SubscriptionSection() {
+  const translate = useTranslations();
+  const { data: { data: [subscription] = [] } = {}, isPending } = useCurrentSubscription();
+  const hasBilling = !isPending && !!subscription && !isFreeSubscription(subscription) && subscription.type !== "trial";
+  return /* @__PURE__ */ jsxs(WorkspaceSection, { children: [
+    /* @__PURE__ */ jsx(SubscriptionPlanCard, {}),
+    hasBilling && /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx(PaymentMethodsCard, {}),
+      /* @__PURE__ */ jsx(Separator, {}),
+      /* @__PURE__ */ jsx(ChargesList, {})
+    ] }),
+    /* @__PURE__ */ jsx(SubscriptionFlows, {})
+  ] });
+}
+export {
+  SubscriptionSection
+};
+//# sourceMappingURL=SubscriptionSection.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/account/sections/SubscriptionSection.tsx"],"sourcesContent":["'use client';\n\nimport { useTranslations } from 'next-intl';\nimport { Separator } from '../../ui/data-display/Separator';\nimport { useCurrentSubscription } from '../../../modules/subscriptions/hooks/use-current-subscription.hook';\nimport { isFreeSubscription } from '../../../modules/subscriptions/utils/is-free-subscription';\nimport { SubscriptionPlanCard } from './subscription/SubscriptionPlanCard';\nimport { PaymentMethodsCard } from './subscription/PaymentMethodsCard';\nimport { ChargesList } from './subscription/ChargesList';\nimport { SubscriptionFlows } from './subscription/SubscriptionFlows';\nimport { WorkspaceSection } from './shared/WorkspaceSection';\n\nexport function SubscriptionSection() {\n  const translate = useTranslations();\n  const { data: { data: [subscription] = [] } = {}, isPending } = useCurrentSubscription();\n\n  // Mesma regra da tela de assinatura: free, trial e sem assinatura não têm cobrança a gerir.\n  const hasBilling =\n    !isPending && !!subscription && !isFreeSubscription(subscription) && subscription.type !== 'trial';\n\n  return (\n    <WorkspaceSection>\n      <SubscriptionPlanCard />\n\n      {hasBilling && (\n        <>\n          <PaymentMethodsCard />\n          <Separator />\n          <ChargesList />\n        </>\n      )}\n\n      <SubscriptionFlows />\n    </WorkspaceSection>\n  );\n}\n"],"mappings":";AAsBM,SAGE,UAHF,KAGE,YAHF;AApBN,SAAS,uBAAuB;AAChC,SAAS,iBAAiB;AAC1B,SAAS,8BAA8B;AACvC,SAAS,0BAA0B;AACnC,SAAS,4BAA4B;AACrC,SAAS,0BAA0B;AACnC,SAAS,mBAAmB;AAC5B,SAAS,yBAAyB;AAClC,SAAS,wBAAwB;AAE1B,SAAS,sBAAsB;AACpC,QAAM,YAAY,gBAAgB;AAClC,QAAM,EAAE,MAAM,EAAE,MAAM,CAAC,YAAY,IAAI,CAAC,EAAE,IAAI,CAAC,GAAG,UAAU,IAAI,uBAAuB;AAGvF,QAAM,aACJ,CAAC,aAAa,CAAC,CAAC,gBAAgB,CAAC,mBAAmB,YAAY,KAAK,aAAa,SAAS;AAE7F,SACE,qBAAC,oBACC;AAAA,wBAAC,wBAAqB;AAAA,IAErB,cACC,iCACE;AAAA,0BAAC,sBAAmB;AAAA,MACpB,oBAAC,aAAU;AAAA,MACX,oBAAC,eAAY;AAAA,OACf;AAAA,IAGF,oBAAC,qBAAkB;AAAA,KACrB;AAEJ;","names":[]}