@greatapps/common 1.1.173 → 1.1.175

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

@@ -0,0 +1,250 @@
+"use client";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { useState, useEffect } from "react";
+import { useForm } from "react-hook-form";
+import { toast } from "sonner";
+import { Lock, Mail, MessageCircle } from "lucide-react";
+import { Button } from "../../ui/buttons/Button";
+import { Separator } from "../../ui/data-display/Separator";
+import { Toast } from "../../ui/feedback/Toast";
+import { ComboboxField } from "../../ui/form/ComboboxField";
+import { SelectField } from "../../ui/form/SelectField";
+import SwitchOptionFieldWithIcon from "../../ui/form/SwitchOptionFieldWithIcon";
+import ConfirmGlobalPreferencesModal from "../ConfirmGlobalPreferencesModal";
+import { useAuth } from "../../../providers/auth.provider";
+import { UserProfile } from "../../../modules/users/schema";
+import {
+  useUpdateAccountUser,
+  useUpdateAccount
+} from "../../../modules/accounts/hooks/useAccountManagement";
+import {
+  LANGUAGE_OPTIONS,
+  TIME_FORMAT_OPTIONS,
+  NOTIFICATION_TYPES
+} from "../constants";
+import { useTimezones } from "../../../modules/accounts/hooks/useTimezones";
+import { useCurrencies } from "../../../modules/accounts/hooks/useCurrencies";
+function PreferencesSection({ onClose }) {
+  const { data: timezones = [] } = useTimezones();
+  const { data: currencies = [] } = useCurrencies();
+  const { user, account } = useAuth();
+  const canEditPreferences = user?.profile === UserProfile.owner || user?.profile === UserProfile.admin;
+  const updateAccountUser = useUpdateAccountUser();
+  const updateAccount = useUpdateAccount();
+  const [confirmGlobalOpen, setConfirmGlobalOpen] = useState(false);
+  const [pendingSubmit, setPendingSubmit] = useState(null);
+  const [isSaving, setIsSaving] = useState(false);
+  const { watch, setValue, handleSubmit, reset, formState: { dirtyFields } } = useForm({
+    defaultValues: {
+      language: "",
+      currency: "",
+      timezone: "",
+      timeFormat: "24h",
+      receive_sms: false,
+      receive_email: false
+    }
+  });
+  useEffect(() => {
+    if (!user || !account) return;
+    reset({
+      language: LANGUAGE_OPTIONS.find(
+        (o) => o.apiValue === user.language?.toLowerCase()
+      )?.value ?? "pt-BR",
+      currency: account.currency,
+      timezone: account.timezone,
+      timeFormat: "24h",
+      receive_sms: user.receive_sms ?? false,
+      receive_email: user.receive_email ?? false
+    });
+  }, [user, account, reset]);
+  const receiveSms = watch("receive_sms");
+  const receiveEmail = watch("receive_email");
+  const doSave = async (data, accountFields) => {
+    setIsSaving(true);
+    try {
+      const apiLanguage = LANGUAGE_OPTIONS.find((o) => o.value === data.language)?.apiValue ?? data.language.toLowerCase();
+      await updateAccountUser.mutateAsync({
+        language: apiLanguage,
+        receive_sms: data.receive_sms,
+        receive_email: data.receive_email
+      });
+      if (canEditPreferences && Object.keys(accountFields).length > 0) {
+        await updateAccount.mutateAsync(accountFields);
+      }
+      reset(data);
+      toast.custom((t) => /* @__PURE__ */ jsx(Toast, { variant: "success", message: "Prefer\xEAncias salvas com sucesso", toastId: t }));
+      onClose();
+    } catch (error) {
+      toast.custom((t) => /* @__PURE__ */ jsx(
+        Toast,
+        {
+          variant: "error",
+          message: error instanceof Error ? error.message : "Erro ao salvar prefer\xEAncias",
+          toastId: t
+        }
+      ));
+    } finally {
+      setIsSaving(false);
+    }
+  };
+  const onSubmit = (data) => {
+    const accountFields = {
+      ...canEditPreferences && dirtyFields.currency && { currency: data.currency },
+      ...canEditPreferences && dirtyFields.timezone && { timezone: data.timezone }
+    };
+    const globalFieldChanged = Object.keys(accountFields).length > 0;
+    if (globalFieldChanged) {
+      setPendingSubmit({ data, accountFields });
+      setConfirmGlobalOpen(true);
+    } else {
+      doSave(data, accountFields);
+    }
+  };
+  const handleConfirmGlobal = () => {
+    setConfirmGlobalOpen(false);
+    if (pendingSubmit) {
+      doSave(pendingSubmit.data, pendingSubmit.accountFields);
+      setPendingSubmit(null);
+    }
+  };
+  const handleCancelGlobal = () => {
+    setConfirmGlobalOpen(false);
+    setPendingSubmit(null);
+  };
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsxs("form", { onSubmit: handleSubmit(onSubmit), className: "lg:h-full lg:flex lg:flex-col", children: [
+      /* @__PURE__ */ jsxs("div", { className: "absolute inset-0 overflow-y-auto overscroll-contain px-4 pb-36 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", children: "Prefer\xEAncias" }),
+        /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-8", children: [
+          /* @__PURE__ */ jsxs("div", { className: "flex flex-col lg:flex-row items-center gap-3", children: [
+            /* @__PURE__ */ jsx(
+              ComboboxField,
+              {
+                label: "Idioma",
+                placeholder: "Selecione o idioma",
+                searchPlaceholder: "Buscar idioma...",
+                containerClassName: "w-full",
+                options: LANGUAGE_OPTIONS,
+                value: watch("language"),
+                onChange: (value) => setValue("language", value, { shouldDirty: true })
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              ComboboxField,
+              {
+                label: "Moeda",
+                placeholder: "Selecione a moeda",
+                searchPlaceholder: "Buscar moeda...",
+                containerClassName: "w-full",
+                options: currencies,
+                value: watch("currency"),
+                onChange: (value) => setValue("currency", value, { shouldDirty: true }),
+                icon: !canEditPreferences ? /* @__PURE__ */ jsx(Lock, { className: "size-4 text-gray-400" }) : void 0,
+                disabled: !canEditPreferences
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsx(Separator, {}),
+          /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-4", children: [
+            /* @__PURE__ */ jsx("span", { className: "paragraph-medium-semibold text-gray-600", children: "Exibi\xE7\xE3o hora" }),
+            /* @__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...",
+                  containerClassName: "w-full",
+                  options: timezones,
+                  value: watch("timezone"),
+                  onChange: (value) => setValue("timezone", value, { shouldDirty: true }),
+                  icon: !canEditPreferences ? /* @__PURE__ */ jsx(Lock, { className: "size-4 text-gray-400" }) : void 0,
+                  disabled: !canEditPreferences
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                SelectField,
+                {
+                  label: "Formato hora",
+                  placeholder: "Selecione o formato",
+                  className: "h-10!",
+                  containerClassName: "w-full",
+                  options: TIME_FORMAT_OPTIONS,
+                  value: watch("timeFormat"),
+                  onChange: (value) => setValue("timeFormat", value, { shouldDirty: true }),
+                  icon: /* @__PURE__ */ jsx(Lock, { 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-600", children: "Notifica\xE7\xF5es" }),
+            /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-3", children: [
+              /* @__PURE__ */ jsxs("div", { className: "flex flex-col border border-gray-200 rounded-lg", children: [
+                /* @__PURE__ */ jsx(
+                  SwitchOptionFieldWithIcon,
+                  {
+                    icon: MessageCircle,
+                    label: "WhatsApp",
+                    description: "Receber notifica\xE7\xF5es importantes por WhatsApp",
+                    checked: receiveSms,
+                    onCheckedChange: (val) => setValue("receive_sms", val, { shouldDirty: true })
+                  }
+                ),
+                /* @__PURE__ */ jsx(
+                  SwitchOptionFieldWithIcon,
+                  {
+                    icon: Mail,
+                    label: "E-mail",
+                    description: "Receber notifica\xE7\xF5es e atualiza\xE7\xF5es por email",
+                    checked: receiveEmail,
+                    onCheckedChange: (val) => setValue("receive_email", val, { shouldDirty: true }),
+                    hideBorderBottom: true
+                  }
+                )
+              ] }),
+              /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-4 p-5 pb-6 rounded-lg bg-gray-50", children: [
+                /* @__PURE__ */ jsx("span", { className: "paragraph-small-semibold text-gray-950", children: "Tipos de notifica\xE7\xF5es incluem:" }),
+                /* @__PURE__ */ jsx("div", { className: "flex flex-col", children: NOTIFICATION_TYPES.map((type) => /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+                  /* @__PURE__ */ jsx("div", { className: "size-1 rounded-full bg-gray-600" }),
+                  /* @__PURE__ */ jsx("span", { className: "paragraph-small-medium text-gray-600", children: type })
+                ] }, type)) })
+              ] })
+            ] })
+          ] })
+        ] })
+      ] }),
+      /* @__PURE__ */ jsxs("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", children: [
+        /* @__PURE__ */ jsx(
+          Button,
+          {
+            variant: "secondary",
+            className: "h-10!",
+            type: "button",
+            disabled: isSaving,
+            onClick: () => {
+              reset();
+              onClose();
+            },
+            children: "Cancelar"
+          }
+        ),
+        /* @__PURE__ */ jsx(Button, { className: "h-10!", type: "submit", disabled: isSaving, children: isSaving ? "Salvando..." : "Salvar altera\xE7\xF5es" })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsx(
+      ConfirmGlobalPreferencesModal,
+      {
+        open: confirmGlobalOpen,
+        onConfirm: handleConfirmGlobal,
+        onCancel: handleCancelGlobal
+      }
+    )
+  ] });
+}
+export {
+  PreferencesSection
+};
+//# sourceMappingURL=PreferencesSection.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/account/sections/PreferencesSection.tsx"],"sourcesContent":["'use client';\r\n\r\nimport { useState, useEffect } from 'react';\r\nimport { useForm } from 'react-hook-form';\r\nimport { toast } from 'sonner';\r\nimport { Lock, Mail, MessageCircle } from 'lucide-react';\r\nimport { Button } from '../../ui/buttons/Button';\r\nimport { Separator } from '../../ui/data-display/Separator';\r\nimport { Toast } from '../../ui/feedback/Toast';\r\nimport { ComboboxField } from '../../ui/form/ComboboxField';\r\nimport { SelectField } from '../../ui/form/SelectField';\r\nimport SwitchOptionFieldWithIcon from '../../ui/form/SwitchOptionFieldWithIcon';\r\nimport ConfirmGlobalPreferencesModal from '../ConfirmGlobalPreferencesModal';\r\nimport { useAuth } from '../../../providers/auth.provider';\r\nimport { UserProfile } from '../../../modules/users/schema';\r\nimport type { UpdateAccountRequest } from '../../../modules/accounts/types';\r\nimport {\r\n  useUpdateAccountUser,\r\n  useUpdateAccount,\r\n} from '../../../modules/accounts/hooks/useAccountManagement';\r\nimport {\r\n  LANGUAGE_OPTIONS,\r\n  TIME_FORMAT_OPTIONS,\r\n  NOTIFICATION_TYPES,\r\n} from '../constants';\r\nimport { useTimezones } from '../../../modules/accounts/hooks/useTimezones';\r\nimport { useCurrencies } from '../../../modules/accounts/hooks/useCurrencies';\r\n\r\ninterface PreferencesFormValues {\r\n  language: string;\r\n  currency: string;\r\n  timezone: string;\r\n  timeFormat: string;\r\n  receive_sms: boolean;\r\n  receive_email: boolean;\r\n}\r\n\r\ninterface PreferencesSectionProps {\r\n  onClose: () => void;\r\n}\r\n\r\nexport function PreferencesSection({ onClose }: PreferencesSectionProps) {\r\n  const { data: timezones = [] } = useTimezones();\r\n  const { data: currencies = [] } = useCurrencies();\r\n  const { user, account } = useAuth();\r\n  const canEditPreferences =\r\n    user?.profile === UserProfile.owner || user?.profile === UserProfile.admin;\r\n  const updateAccountUser = useUpdateAccountUser();\r\n  const updateAccount = useUpdateAccount();\r\n  const [confirmGlobalOpen, setConfirmGlobalOpen] = useState(false);\r\n  const [pendingSubmit, setPendingSubmit] = useState<{\r\n    data: PreferencesFormValues;\r\n    accountFields: UpdateAccountRequest;\r\n  } | null>(null);\r\n  const [isSaving, setIsSaving] = useState(false);\r\n\r\n  const { watch, setValue, handleSubmit, reset, formState: { dirtyFields } } =\r\n    useForm<PreferencesFormValues>({\r\n      defaultValues: {\r\n        language: '',\r\n        currency: '',\r\n        timezone: '',\r\n        timeFormat: '24h',\r\n        receive_sms: false,\r\n        receive_email: false,\r\n      },\r\n    });\r\n\r\n  useEffect(() => {\r\n    if (!user || !account) return;\r\n    reset({\r\n      language: LANGUAGE_OPTIONS.find(\r\n        (o) => o.apiValue === user.language?.toLowerCase()\r\n      )?.value ?? 'pt-BR',\r\n      currency: account.currency,\r\n      timezone: account.timezone,\r\n      timeFormat: '24h',\r\n      receive_sms: user.receive_sms ?? false,\r\n      receive_email: user.receive_email ?? false,\r\n    });\r\n  }, [user, account, reset]);\r\n\r\n  const receiveSms = watch('receive_sms');\r\n  const receiveEmail = watch('receive_email');\r\n\r\n  const doSave = async (data: PreferencesFormValues, accountFields: UpdateAccountRequest) => {\r\n    setIsSaving(true);\r\n    try {\r\n      const apiLanguage = LANGUAGE_OPTIONS.find((o) => o.value === data.language)?.apiValue ?? data.language.toLowerCase();\r\n      await updateAccountUser.mutateAsync({\r\n        language: apiLanguage,\r\n        receive_sms: data.receive_sms,\r\n        receive_email: data.receive_email,\r\n      });\r\n\r\n      if (canEditPreferences && Object.keys(accountFields).length > 0) {\r\n        await updateAccount.mutateAsync(accountFields);\r\n      }\r\n\r\n      reset(data);\r\n      toast.custom((t) => (\r\n        <Toast variant=\"success\" message=\"Preferências salvas com sucesso\" toastId={t} />\r\n      ));\r\n      onClose();\r\n    } catch (error) {\r\n      toast.custom((t) => (\r\n        <Toast\r\n          variant=\"error\"\r\n          message={error instanceof Error ? error.message : 'Erro ao salvar preferências'}\r\n          toastId={t}\r\n        />\r\n      ));\r\n    } finally {\r\n      setIsSaving(false);\r\n    }\r\n  };\r\n\r\n  const onSubmit = (data: PreferencesFormValues) => {\r\n    const accountFields: UpdateAccountRequest = {\r\n      ...(canEditPreferences && dirtyFields.currency && { currency: data.currency }),\r\n      ...(canEditPreferences && dirtyFields.timezone && { timezone: data.timezone }),\r\n    };\r\n    const globalFieldChanged = Object.keys(accountFields).length > 0;\r\n\r\n    if (globalFieldChanged) {\r\n      setPendingSubmit({ data, accountFields });\r\n      setConfirmGlobalOpen(true);\r\n    } else {\r\n      doSave(data, accountFields);\r\n    }\r\n  };\r\n\r\n  const handleConfirmGlobal = () => {\r\n    setConfirmGlobalOpen(false);\r\n    if (pendingSubmit) {\r\n      doSave(pendingSubmit.data, pendingSubmit.accountFields);\r\n      setPendingSubmit(null);\r\n    }\r\n  };\r\n\r\n  const handleCancelGlobal = () => {\r\n    setConfirmGlobalOpen(false);\r\n    setPendingSubmit(null);\r\n  };\r\n\r\n  return (\r\n    <>\r\n      <form onSubmit={handleSubmit(onSubmit)} className=\"lg:h-full lg:flex lg:flex-col\">\r\n        <div className=\"absolute inset-0 overflow-y-auto overscroll-contain px-4 pb-36 lg:p-5 lg:static lg:flex-1 lg:min-h-0 lg:overscroll-auto flex flex-col gap-5 lg:gap-6\">\r\n          <span className=\"paragraph-medium-semibold text-gray-950\">Preferências</span>\r\n          <div className=\"flex flex-col gap-8\">\r\n            <div className=\"flex flex-col lg:flex-row items-center gap-3\">\r\n              <ComboboxField\r\n                label=\"Idioma\"\r\n                placeholder=\"Selecione o idioma\"\r\n                searchPlaceholder=\"Buscar idioma...\"\r\n                containerClassName=\"w-full\"\r\n                options={LANGUAGE_OPTIONS}\r\n                value={watch('language')}\r\n                onChange={(value) => setValue('language', value, { shouldDirty: true })}\r\n              />\r\n              <ComboboxField\r\n                label=\"Moeda\"\r\n                placeholder=\"Selecione a moeda\"\r\n                searchPlaceholder=\"Buscar moeda...\"\r\n                containerClassName=\"w-full\"\r\n                options={currencies}\r\n                value={watch('currency')}\r\n                onChange={(value) => setValue('currency', value, { shouldDirty: true })}\r\n                icon={!canEditPreferences ? <Lock className=\"size-4 text-gray-400\" /> : undefined}\r\n                disabled={!canEditPreferences}\r\n              />\r\n            </div>\r\n\r\n            <Separator />\r\n\r\n            <div className=\"flex flex-col gap-4\">\r\n              <span className=\"paragraph-medium-semibold text-gray-600\">Exibição hora</span>\r\n              <div className=\"flex flex-col lg:flex-row items-center gap-3\">\r\n                <ComboboxField\r\n                  label=\"Fuso horário\"\r\n                  placeholder=\"Selecione o fuso horário\"\r\n                  searchPlaceholder=\"Buscar fuso horário...\"\r\n                  containerClassName=\"w-full\"\r\n                  options={timezones}\r\n                  value={watch('timezone')}\r\n                  onChange={(value) => setValue('timezone', value, { shouldDirty: true })}\r\n                  icon={!canEditPreferences ? <Lock className=\"size-4 text-gray-400\" /> : undefined}\r\n                  disabled={!canEditPreferences}\r\n                />\r\n                <SelectField\r\n                  label=\"Formato hora\"\r\n                  placeholder=\"Selecione o formato\"\r\n                  className=\"h-10!\"\r\n                  containerClassName=\"w-full\"\r\n                  options={TIME_FORMAT_OPTIONS}\r\n                  value={watch('timeFormat')}\r\n                  onChange={(value) =>\r\n                    setValue('timeFormat', value as string, { shouldDirty: true })\r\n                  }\r\n                  icon={<Lock className=\"size-4 text-gray-400\" />}\r\n                  disabled\r\n                />\r\n              </div>\r\n            </div>\r\n\r\n            <Separator />\r\n\r\n            <div className=\"flex flex-col gap-4\">\r\n              <span className=\"paragraph-medium-semibold text-gray-600\">Notificações</span>\r\n              <div className=\"flex flex-col gap-3\">\r\n                <div className=\"flex flex-col border border-gray-200 rounded-lg\">\r\n                  <SwitchOptionFieldWithIcon\r\n                    icon={MessageCircle}\r\n                    label=\"WhatsApp\"\r\n                    description=\"Receber notificações importantes por WhatsApp\"\r\n                    checked={receiveSms}\r\n                    onCheckedChange={(val: boolean) => setValue('receive_sms', val, { shouldDirty: true })}\r\n                  />\r\n                  <SwitchOptionFieldWithIcon\r\n                    icon={Mail}\r\n                    label=\"E-mail\"\r\n                    description=\"Receber notificações e atualizações por email\"\r\n                    checked={receiveEmail}\r\n                    onCheckedChange={(val: boolean) => setValue('receive_email', val, { shouldDirty: true })}\r\n                    hideBorderBottom={true}\r\n                  />\r\n                </div>\r\n                <div className=\"flex flex-col gap-4 p-5 pb-6 rounded-lg bg-gray-50\">\r\n                  <span className=\"paragraph-small-semibold text-gray-950\">\r\n                    Tipos de notificações incluem:\r\n                  </span>\r\n                  <div className=\"flex flex-col\">\r\n                    {NOTIFICATION_TYPES.map((type) => (\r\n                      <div key={type} className=\"flex items-center gap-2\">\r\n                        <div className=\"size-1 rounded-full bg-gray-600\" />\r\n                        <span className=\"paragraph-small-medium text-gray-600\">{type}</span>\r\n                      </div>\r\n                    ))}\r\n                  </div>\r\n                </div>\r\n              </div>\r\n            </div>\r\n          </div>\r\n        </div>\r\n\r\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\">\r\n          <Button\r\n            variant=\"secondary\"\r\n            className=\"h-10!\"\r\n            type=\"button\"\r\n            disabled={isSaving}\r\n            onClick={() => {\r\n              reset();\r\n              onClose();\r\n            }}\r\n          >\r\n            Cancelar\r\n          </Button>\r\n          <Button className=\"h-10!\" type=\"submit\" disabled={isSaving}>\r\n            {isSaving ? 'Salvando...' : 'Salvar alterações'}\r\n          </Button>\r\n        </div>\r\n      </form>\r\n\r\n      <ConfirmGlobalPreferencesModal\r\n        open={confirmGlobalOpen}\r\n        onConfirm={handleConfirmGlobal}\r\n        onCancel={handleCancelGlobal}\r\n      />\r\n    </>\r\n  );\r\n}\r\n"],"mappings":";AAqGQ,SA6CJ,UA7CI,KAkDI,YAlDJ;AAnGR,SAAS,UAAU,iBAAiB;AACpC,SAAS,eAAe;AACxB,SAAS,aAAa;AACtB,SAAS,MAAM,MAAM,qBAAqB;AAC1C,SAAS,cAAc;AACvB,SAAS,iBAAiB;AAC1B,SAAS,aAAa;AACtB,SAAS,qBAAqB;AAC9B,SAAS,mBAAmB;AAC5B,OAAO,+BAA+B;AACtC,OAAO,mCAAmC;AAC1C,SAAS,eAAe;AACxB,SAAS,mBAAmB;AAE5B;AAAA,EACE;AAAA,EACA;AAAA,OACK;AACP;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,oBAAoB;AAC7B,SAAS,qBAAqB;AAevB,SAAS,mBAAmB,EAAE,QAAQ,GAA4B;AACvE,QAAM,EAAE,MAAM,YAAY,CAAC,EAAE,IAAI,aAAa;AAC9C,QAAM,EAAE,MAAM,aAAa,CAAC,EAAE,IAAI,cAAc;AAChD,QAAM,EAAE,MAAM,QAAQ,IAAI,QAAQ;AAClC,QAAM,qBACJ,MAAM,YAAY,YAAY,SAAS,MAAM,YAAY,YAAY;AACvE,QAAM,oBAAoB,qBAAqB;AAC/C,QAAM,gBAAgB,iBAAiB;AACvC,QAAM,CAAC,mBAAmB,oBAAoB,IAAI,SAAS,KAAK;AAChE,QAAM,CAAC,eAAe,gBAAgB,IAAI,SAGhC,IAAI;AACd,QAAM,CAAC,UAAU,WAAW,IAAI,SAAS,KAAK;AAE9C,QAAM,EAAE,OAAO,UAAU,cAAc,OAAO,WAAW,EAAE,YAAY,EAAE,IACvE,QAA+B;AAAA,IAC7B,eAAe;AAAA,MACb,UAAU;AAAA,MACV,UAAU;AAAA,MACV,UAAU;AAAA,MACV,YAAY;AAAA,MACZ,aAAa;AAAA,MACb,eAAe;AAAA,IACjB;AAAA,EACF,CAAC;AAEH,YAAU,MAAM;AACd,QAAI,CAAC,QAAQ,CAAC,QAAS;AACvB,UAAM;AAAA,MACJ,UAAU,iBAAiB;AAAA,QACzB,CAAC,MAAM,EAAE,aAAa,KAAK,UAAU,YAAY;AAAA,MACnD,GAAG,SAAS;AAAA,MACZ,UAAU,QAAQ;AAAA,MAClB,UAAU,QAAQ;AAAA,MAClB,YAAY;AAAA,MACZ,aAAa,KAAK,eAAe;AAAA,MACjC,eAAe,KAAK,iBAAiB;AAAA,IACvC,CAAC;AAAA,EACH,GAAG,CAAC,MAAM,SAAS,KAAK,CAAC;AAEzB,QAAM,aAAa,MAAM,aAAa;AACtC,QAAM,eAAe,MAAM,eAAe;AAE1C,QAAM,SAAS,OAAO,MAA6B,kBAAwC;AACzF,gBAAY,IAAI;AAChB,QAAI;AACF,YAAM,cAAc,iBAAiB,KAAK,CAAC,MAAM,EAAE,UAAU,KAAK,QAAQ,GAAG,YAAY,KAAK,SAAS,YAAY;AACnH,YAAM,kBAAkB,YAAY;AAAA,QAClC,UAAU;AAAA,QACV,aAAa,KAAK;AAAA,QAClB,eAAe,KAAK;AAAA,MACtB,CAAC;AAED,UAAI,sBAAsB,OAAO,KAAK,aAAa,EAAE,SAAS,GAAG;AAC/D,cAAM,cAAc,YAAY,aAAa;AAAA,MAC/C;AAEA,YAAM,IAAI;AACV,YAAM,OAAO,CAAC,MACZ,oBAAC,SAAM,SAAQ,WAAU,SAAQ,sCAAkC,SAAS,GAAG,CAChF;AACD,cAAQ;AAAA,IACV,SAAS,OAAO;AACd,YAAM,OAAO,CAAC,MACZ;AAAA,QAAC;AAAA;AAAA,UACC,SAAQ;AAAA,UACR,SAAS,iBAAiB,QAAQ,MAAM,UAAU;AAAA,UAClD,SAAS;AAAA;AAAA,MACX,CACD;AAAA,IACH,UAAE;AACA,kBAAY,KAAK;AAAA,IACnB;AAAA,EACF;AAEA,QAAM,WAAW,CAAC,SAAgC;AAChD,UAAM,gBAAsC;AAAA,MAC1C,GAAI,sBAAsB,YAAY,YAAY,EAAE,UAAU,KAAK,SAAS;AAAA,MAC5E,GAAI,sBAAsB,YAAY,YAAY,EAAE,UAAU,KAAK,SAAS;AAAA,IAC9E;AACA,UAAM,qBAAqB,OAAO,KAAK,aAAa,EAAE,SAAS;AAE/D,QAAI,oBAAoB;AACtB,uBAAiB,EAAE,MAAM,cAAc,CAAC;AACxC,2BAAqB,IAAI;AAAA,IAC3B,OAAO;AACL,aAAO,MAAM,aAAa;AAAA,IAC5B;AAAA,EACF;AAEA,QAAM,sBAAsB,MAAM;AAChC,yBAAqB,KAAK;AAC1B,QAAI,eAAe;AACjB,aAAO,cAAc,MAAM,cAAc,aAAa;AACtD,uBAAiB,IAAI;AAAA,IACvB;AAAA,EACF;AAEA,QAAM,qBAAqB,MAAM;AAC/B,yBAAqB,KAAK;AAC1B,qBAAiB,IAAI;AAAA,EACvB;AAEA,SACE,iCACE;AAAA,yBAAC,UAAK,UAAU,aAAa,QAAQ,GAAG,WAAU,iCAChD;AAAA,2BAAC,SAAI,WAAU,wJACb;AAAA,4BAAC,UAAK,WAAU,2CAA0C,6BAAY;AAAA,QACtE,qBAAC,SAAI,WAAU,uBACb;AAAA,+BAAC,SAAI,WAAU,gDACb;AAAA;AAAA,cAAC;AAAA;AAAA,gBACC,OAAM;AAAA,gBACN,aAAY;AAAA,gBACZ,mBAAkB;AAAA,gBAClB,oBAAmB;AAAA,gBACnB,SAAS;AAAA,gBACT,OAAO,MAAM,UAAU;AAAA,gBACvB,UAAU,CAAC,UAAU,SAAS,YAAY,OAAO,EAAE,aAAa,KAAK,CAAC;AAAA;AAAA,YACxE;AAAA,YACA;AAAA,cAAC;AAAA;AAAA,gBACC,OAAM;AAAA,gBACN,aAAY;AAAA,gBACZ,mBAAkB;AAAA,gBAClB,oBAAmB;AAAA,gBACnB,SAAS;AAAA,gBACT,OAAO,MAAM,UAAU;AAAA,gBACvB,UAAU,CAAC,UAAU,SAAS,YAAY,OAAO,EAAE,aAAa,KAAK,CAAC;AAAA,gBACtE,MAAM,CAAC,qBAAqB,oBAAC,QAAK,WAAU,wBAAuB,IAAK;AAAA,gBACxE,UAAU,CAAC;AAAA;AAAA,YACb;AAAA,aACF;AAAA,UAEA,oBAAC,aAAU;AAAA,UAEX,qBAAC,SAAI,WAAU,uBACb;AAAA,gCAAC,UAAK,WAAU,2CAA0C,iCAAa;AAAA,YACvE,qBAAC,SAAI,WAAU,gDACb;AAAA;AAAA,gBAAC;AAAA;AAAA,kBACC,OAAM;AAAA,kBACN,aAAY;AAAA,kBACZ,mBAAkB;AAAA,kBAClB,oBAAmB;AAAA,kBACnB,SAAS;AAAA,kBACT,OAAO,MAAM,UAAU;AAAA,kBACvB,UAAU,CAAC,UAAU,SAAS,YAAY,OAAO,EAAE,aAAa,KAAK,CAAC;AAAA,kBACtE,MAAM,CAAC,qBAAqB,oBAAC,QAAK,WAAU,wBAAuB,IAAK;AAAA,kBACxE,UAAU,CAAC;AAAA;AAAA,cACb;AAAA,cACA;AAAA,gBAAC;AAAA;AAAA,kBACC,OAAM;AAAA,kBACN,aAAY;AAAA,kBACZ,WAAU;AAAA,kBACV,oBAAmB;AAAA,kBACnB,SAAS;AAAA,kBACT,OAAO,MAAM,YAAY;AAAA,kBACzB,UAAU,CAAC,UACT,SAAS,cAAc,OAAiB,EAAE,aAAa,KAAK,CAAC;AAAA,kBAE/D,MAAM,oBAAC,QAAK,WAAU,wBAAuB;AAAA,kBAC7C,UAAQ;AAAA;AAAA,cACV;AAAA,eACF;AAAA,aACF;AAAA,UAEA,oBAAC,aAAU;AAAA,UAEX,qBAAC,SAAI,WAAU,uBACb;AAAA,gCAAC,UAAK,WAAU,2CAA0C,gCAAY;AAAA,YACtE,qBAAC,SAAI,WAAU,uBACb;AAAA,mCAAC,SAAI,WAAU,mDACb;AAAA;AAAA,kBAAC;AAAA;AAAA,oBACC,MAAM;AAAA,oBACN,OAAM;AAAA,oBACN,aAAY;AAAA,oBACZ,SAAS;AAAA,oBACT,iBAAiB,CAAC,QAAiB,SAAS,eAAe,KAAK,EAAE,aAAa,KAAK,CAAC;AAAA;AAAA,gBACvF;AAAA,gBACA;AAAA,kBAAC;AAAA;AAAA,oBACC,MAAM;AAAA,oBACN,OAAM;AAAA,oBACN,aAAY;AAAA,oBACZ,SAAS;AAAA,oBACT,iBAAiB,CAAC,QAAiB,SAAS,iBAAiB,KAAK,EAAE,aAAa,KAAK,CAAC;AAAA,oBACvF,kBAAkB;AAAA;AAAA,gBACpB;AAAA,iBACF;AAAA,cACA,qBAAC,SAAI,WAAU,sDACb;AAAA,oCAAC,UAAK,WAAU,0CAAyC,kDAEzD;AAAA,gBACA,oBAAC,SAAI,WAAU,iBACZ,6BAAmB,IAAI,CAAC,SACvB,qBAAC,SAAe,WAAU,2BACxB;AAAA,sCAAC,SAAI,WAAU,mCAAkC;AAAA,kBACjD,oBAAC,UAAK,WAAU,wCAAwC,gBAAK;AAAA,qBAFrD,IAGV,CACD,GACH;AAAA,iBACF;AAAA,eACF;AAAA,aACF;AAAA,WACF;AAAA,SACF;AAAA,MAEA,qBAAC,SAAI,WAAU,sIACb;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,SAAQ;AAAA,YACR,WAAU;AAAA,YACV,MAAK;AAAA,YACL,UAAU;AAAA,YACV,SAAS,MAAM;AACb,oBAAM;AACN,sBAAQ;AAAA,YACV;AAAA,YACD;AAAA;AAAA,QAED;AAAA,QACA,oBAAC,UAAO,WAAU,SAAQ,MAAK,UAAS,UAAU,UAC/C,qBAAW,gBAAgB,2BAC9B;AAAA,SACF;AAAA,OACF;AAAA,IAEA;AAAA,MAAC;AAAA;AAAA,QACC,MAAM;AAAA,QACN,WAAW;AAAA,QACX,UAAU;AAAA;AAAA,IACZ;AAAA,KACF;AAEJ;","names":[]}

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

@@ -0,0 +1,147 @@
+"use client";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { useState, useCallback } from "react";
+import { Lock, Wrench } from "lucide-react";
+import { Badge } from "../../ui/data-display/Badge";
+import { Button } from "../../ui/buttons/Button";
+import { useAuth } from "../../../providers/auth.provider";
+import { useQueryClient } from "@tanstack/react-query";
+import { USER_QUERY_KEY } from "../../../modules/auth/hooks/useUserQuery";
+import { AccountSectionType } from "../../../enums/AccountSectionType";
+import TwoFactorAuthModal from "../TwoFactorAuthModal";
+import DisableTwoFactorAuthModal from "../DisableTwoFactorAuthModal";
+function SecuritySection({
+  setActiveSection,
+  onClose,
+  hasActiveSubscription,
+  onDeleteAccount
+}) {
+  const { user } = useAuth();
+  const queryClient = useQueryClient();
+  const twoFactorAuth = user?.two_factor_authentication ?? false;
+  const [twoFactorOpen, setTwoFactorOpen] = useState(false);
+  const [disableTwoFactorOpen, setDisableTwoFactorOpen] = useState(false);
+  const handleToggleTwoFactor = useCallback(() => {
+    if (twoFactorAuth) {
+      setDisableTwoFactorOpen(true);
+    } else {
+      setTwoFactorOpen(true);
+    }
+  }, [twoFactorAuth]);
+  const handleDisableTwoFactorSuccess = useCallback(() => {
+    queryClient.invalidateQueries({ queryKey: USER_QUERY_KEY });
+    setDisableTwoFactorOpen(false);
+  }, [queryClient]);
+  const handleEnableTwoFactorSuccess = useCallback(() => {
+    queryClient.invalidateQueries({ queryKey: USER_QUERY_KEY });
+    setTwoFactorOpen(false);
+  }, [queryClient]);
+  const handleDeleteAccount = useCallback(() => {
+    onDeleteAccount?.();
+  }, [onDeleteAccount]);
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__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: "Seguran\xE7a" }),
+      /* @__PURE__ */ jsxs("div", { className: "border border-gray-200 rounded-lg overflow-hidden", children: [
+        /* @__PURE__ */ jsxs(
+          "div",
+          {
+            className: "flex flex-col lg:flex-row lg:items-center gap-4 lg:gap-5 p-4 lg:p-5 border-b border-gray-200 cursor-pointer hover:bg-gray-25 transition-colors",
+            onClick: handleToggleTwoFactor,
+            children: [
+              /* @__PURE__ */ jsxs("div", { className: "flex flex-1 items-start lg:items-center gap-4 lg:gap-5", children: [
+                /* @__PURE__ */ jsx("div", { className: "size-10 rounded-lg bg-gray-50 flex items-center justify-center shrink-0", children: /* @__PURE__ */ jsx(Wrench, { size: 20, className: "text-gray-950" }) }),
+                /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1.5 flex-1", children: [
+                  /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-center gap-2", children: [
+                    /* @__PURE__ */ jsx("span", { className: "paragraph-small-semibold text-gray-950", children: "Autentica\xE7\xE3o de dois fatores" }),
+                    /* @__PURE__ */ jsx(
+                      Badge,
+                      {
+                        className: `paragraph-xsmall-semibold rounded-lg ${twoFactorAuth ? "text-green-600 bg-green-50" : "text-gray-600 bg-gray-50"}`,
+                        children: twoFactorAuth ? "Habilitado" : "Desabilitado"
+                      }
+                    )
+                  ] }),
+                  /* @__PURE__ */ jsx("span", { className: "paragraph-small-regular text-gray-600", children: "Envio de c\xF3digo de seguran\xE7a (e-mail ou sms) para o usu\xE1rio acessar o sistema" })
+                ] })
+              ] }),
+              /* @__PURE__ */ jsx(
+                Button,
+                {
+                  variant: "secondary",
+                  className: "h-10! shrink-0 w-full lg:w-auto",
+                  onClick: (e) => {
+                    e.stopPropagation();
+                    handleToggleTwoFactor();
+                  },
+                  children: twoFactorAuth ? "Desabilitar" : "Habilitar"
+                }
+              )
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsxs(
+          "div",
+          {
+            className: "flex flex-col lg:flex-row lg:items-center gap-4 lg:gap-5 p-4 lg:p-5 cursor-pointer hover:bg-gray-25 transition-colors",
+            onClick: () => setActiveSection(AccountSectionType.CHANGE_PASSWORD),
+            children: [
+              /* @__PURE__ */ jsxs("div", { className: "flex flex-1 items-start lg:items-center gap-4 lg:gap-5", children: [
+                /* @__PURE__ */ jsx("div", { className: "size-10 rounded-lg bg-gray-50 flex items-center justify-center shrink-0", children: /* @__PURE__ */ jsx(Lock, { size: 20, className: "text-gray-950" }) }),
+                /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1.5 flex-1", children: [
+                  /* @__PURE__ */ jsx("span", { className: "paragraph-small-semibold text-gray-950", children: "Alterar senha de acesso" }),
+                  /* @__PURE__ */ jsx("span", { className: "paragraph-small-regular text-gray-600", children: "Atualize sua senha sempre que necess\xE1rio para manter sua conta segura." })
+                ] })
+              ] }),
+              /* @__PURE__ */ jsx(
+                Button,
+                {
+                  variant: "secondary",
+                  className: "h-10! shrink-0 w-full lg:w-auto",
+                  onClick: (e) => {
+                    e.stopPropagation();
+                    setActiveSection(AccountSectionType.CHANGE_PASSWORD);
+                  },
+                  children: "Alterar senha"
+                }
+              )
+            ]
+          }
+        )
+      ] }),
+      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: handleDeleteAccount,
+          children: "Excluir minha conta"
+        }
+      )
+    ] }),
+    /* @__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", onClick: onClose, children: "Cancelar" }),
+      /* @__PURE__ */ jsx(Button, { className: "h-10!", onClick: onClose, children: "Salvar altera\xE7\xF5es" })
+    ] }),
+    /* @__PURE__ */ jsx(
+      DisableTwoFactorAuthModal,
+      {
+        open: disableTwoFactorOpen,
+        onClose: () => setDisableTwoFactorOpen(false),
+        onSuccess: handleDisableTwoFactorSuccess
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      TwoFactorAuthModal,
+      {
+        open: twoFactorOpen,
+        onClose: () => setTwoFactorOpen(false),
+        onSuccess: handleEnableTwoFactorSuccess
+      }
+    )
+  ] });
+}
+export {
+  SecuritySection
+};
+//# sourceMappingURL=SecuritySection.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/account/sections/SecuritySection.tsx"],"sourcesContent":["'use client';\r\n\r\nimport { useState, useCallback } from 'react';\r\nimport { Lock, Wrench } from 'lucide-react';\r\nimport { Badge } from '../../ui/data-display/Badge';\r\nimport { Button } from '../../ui/buttons/Button';\r\nimport { useAuth } from '../../../providers/auth.provider';\r\nimport { useQueryClient } from '@tanstack/react-query';\r\nimport { USER_QUERY_KEY } from '../../../modules/auth/hooks/useUserQuery';\r\nimport { AccountSectionType } from '../../../enums/AccountSectionType';\r\nimport TwoFactorAuthModal from '../TwoFactorAuthModal';\r\nimport DisableTwoFactorAuthModal from '../DisableTwoFactorAuthModal';\r\n\r\ninterface SecuritySectionProps {\r\n  setActiveSection: (section: AccountSectionType) => void;\r\n  onClose: () => void;\r\n  hasActiveSubscription?: boolean;\r\n  onDeleteAccount?: () => void;\r\n}\r\n\r\nexport function SecuritySection({\r\n  setActiveSection,\r\n  onClose,\r\n  hasActiveSubscription,\r\n  onDeleteAccount,\r\n}: SecuritySectionProps) {\r\n  const { user } = useAuth();\r\n  const queryClient = useQueryClient();\r\n\r\n  const twoFactorAuth = user?.two_factor_authentication ?? false;\r\n  const [twoFactorOpen, setTwoFactorOpen] = useState(false);\r\n  const [disableTwoFactorOpen, setDisableTwoFactorOpen] = useState(false);\r\n\r\n  const handleToggleTwoFactor = useCallback(() => {\r\n    if (twoFactorAuth) {\r\n      setDisableTwoFactorOpen(true);\r\n    } else {\r\n      setTwoFactorOpen(true);\r\n    }\r\n  }, [twoFactorAuth]);\r\n\r\n  const handleDisableTwoFactorSuccess = useCallback(() => {\r\n    queryClient.invalidateQueries({ queryKey: USER_QUERY_KEY });\r\n    setDisableTwoFactorOpen(false);\r\n  }, [queryClient]);\r\n\r\n  const handleEnableTwoFactorSuccess = useCallback(() => {\r\n    queryClient.invalidateQueries({ queryKey: USER_QUERY_KEY });\r\n    setTwoFactorOpen(false);\r\n  }, [queryClient]);\r\n\r\n  const handleDeleteAccount = useCallback(() => {\r\n    onDeleteAccount?.();\r\n  }, [onDeleteAccount]);\r\n\r\n  return (\r\n    <>\r\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\">\r\n        <span className=\"paragraph-medium-semibold text-gray-950 hidden lg:block\">Segurança</span>\r\n\r\n        <div className=\"border border-gray-200 rounded-lg overflow-hidden\">\r\n          <div\r\n            className=\"flex flex-col lg:flex-row lg:items-center gap-4 lg:gap-5 p-4 lg:p-5 border-b border-gray-200 cursor-pointer hover:bg-gray-25 transition-colors\"\r\n            onClick={handleToggleTwoFactor}\r\n          >\r\n            <div className=\"flex flex-1 items-start lg:items-center gap-4 lg:gap-5\">\r\n              <div className=\"size-10 rounded-lg bg-gray-50 flex items-center justify-center shrink-0\">\r\n                <Wrench size={20} className=\"text-gray-950\" />\r\n              </div>\r\n              <div className=\"flex flex-col gap-1.5 flex-1\">\r\n                <div className=\"flex flex-wrap items-center gap-2\">\r\n                  <span className=\"paragraph-small-semibold text-gray-950\">\r\n                    Autenticação de dois fatores\r\n                  </span>\r\n                  <Badge\r\n                    className={`paragraph-xsmall-semibold rounded-lg ${twoFactorAuth ? 'text-green-600 bg-green-50' : 'text-gray-600 bg-gray-50'}`}\r\n                  >\r\n                    {twoFactorAuth ? 'Habilitado' : 'Desabilitado'}\r\n                  </Badge>\r\n                </div>\r\n                <span className=\"paragraph-small-regular text-gray-600\">\r\n                  Envio de código de segurança (e-mail ou sms) para o usuário acessar o sistema\r\n                </span>\r\n              </div>\r\n            </div>\r\n            <Button\r\n              variant=\"secondary\"\r\n              className=\"h-10! shrink-0 w-full lg:w-auto\"\r\n              onClick={(e) => {\r\n                e.stopPropagation();\r\n                handleToggleTwoFactor();\r\n              }}\r\n            >\r\n              {twoFactorAuth ? 'Desabilitar' : 'Habilitar'}\r\n            </Button>\r\n          </div>\r\n\r\n          <div\r\n            className=\"flex flex-col lg:flex-row lg:items-center gap-4 lg:gap-5 p-4 lg:p-5 cursor-pointer hover:bg-gray-25 transition-colors\"\r\n            onClick={() => setActiveSection(AccountSectionType.CHANGE_PASSWORD)}\r\n          >\r\n            <div className=\"flex flex-1 items-start lg:items-center gap-4 lg:gap-5\">\r\n              <div className=\"size-10 rounded-lg bg-gray-50 flex items-center justify-center shrink-0\">\r\n                <Lock size={20} className=\"text-gray-950\" />\r\n              </div>\r\n              <div className=\"flex flex-col gap-1.5 flex-1\">\r\n                <span className=\"paragraph-small-semibold text-gray-950\">\r\n                  Alterar senha de acesso\r\n                </span>\r\n                <span className=\"paragraph-small-regular text-gray-600\">\r\n                  Atualize sua senha sempre que necessário para manter sua conta segura.\r\n                </span>\r\n              </div>\r\n            </div>\r\n            <Button\r\n              variant=\"secondary\"\r\n              className=\"h-10! shrink-0 w-full lg:w-auto\"\r\n              onClick={(e) => {\r\n                e.stopPropagation();\r\n                setActiveSection(AccountSectionType.CHANGE_PASSWORD);\r\n              }}\r\n            >\r\n              Alterar senha\r\n            </Button>\r\n          </div>\r\n        </div>\r\n\r\n        {onDeleteAccount && (\r\n          <button\r\n            type=\"button\"\r\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\"\r\n            onClick={handleDeleteAccount}\r\n          >\r\n            Excluir minha conta\r\n          </button>\r\n        )}\r\n      </div>\r\n\r\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\">\r\n        <Button variant=\"secondary\" className=\"h-10!\" type=\"button\" onClick={onClose}>\r\n          Cancelar\r\n        </Button>\r\n        <Button className=\"h-10!\" onClick={onClose}>\r\n          Salvar alterações\r\n        </Button>\r\n      </div>\r\n\r\n      <DisableTwoFactorAuthModal\r\n        open={disableTwoFactorOpen}\r\n        onClose={() => setDisableTwoFactorOpen(false)}\r\n        onSuccess={handleDisableTwoFactorSuccess}\r\n      />\r\n      <TwoFactorAuthModal\r\n        open={twoFactorOpen}\r\n        onClose={() => setTwoFactorOpen(false)}\r\n        onSuccess={handleEnableTwoFactorSuccess}\r\n      />\r\n    </>\r\n  );\r\n}\r\n"],"mappings":"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","names":[]}

package/dist/components/handlers/SearchParamsHandler.mjs

@@ -0,0 +1,24 @@
+"use client";
+import { jsx } from "react/jsx-runtime";
+import { Suspense, useEffect } from "react";
+import { useSearchParams } from "next/navigation";
+function SearchParamsHandler(options) {
+  return /* @__PURE__ */ jsx(Suspense, { fallback: null, children: /* @__PURE__ */ jsx(SearchParamsHandlerChildren, { ...options }) });
+}
+function SearchParamsHandlerChildren(options) {
+  const searchParams = useSearchParams();
+  useEffect(() => {
+    Object.keys(options.handlers).forEach((key) => {
+      const value = searchParams.get(key);
+      if (value) {
+        options.handlers[key]();
+      }
+    });
+  }, [searchParams]);
+  return null;
+}
+export {
+  SearchParamsHandler,
+  SearchParamsHandlerChildren
+};
+//# sourceMappingURL=SearchParamsHandler.mjs.map

package/dist/components/handlers/SearchParamsHandler.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/handlers/SearchParamsHandler.tsx"],"sourcesContent":["\"use client\";\n\nimport { Suspense, useEffect } from \"react\";\nimport { useSearchParams } from \"next/navigation\";\n\ninterface SearchParamsHandlerProps {\n  handlers: {\n    [key: string]: () => void;\n  };\n}\n\n/**\n * SearchParamsHandler\n *\n * Este componente é responsável por ler os parâmetros da URL e executar callbacks\n * correspondentes a cada parâmetro encontrado.\n *\n * Por que precisamos deste componente?\n * - O Next.js 16 exige que useSearchParams() seja envolvido em um <Suspense> boundary\n * - Isso evita erros de prerendering durante o build\n * - Permite que URLs como \"/page?tab=performance\" naveguem diretamente para uma aba específica\n *\n * Exemplo de como funciona\n * 1. Usa useSearchParams() para ler o parâmetro \"tab\" da URL\n * 2. Monitora mudanças nos parâmetros com useEffect\n * 3. Quando encontra um parâmetro \"tab\", chama onTabChange com o valor\n * 4. Retorna null porque não renderiza nada na tela\n *\n * Exemplo de uso:\n * <Suspense fallback={null}>\n *   <SearchParamsHandler handlers={{ tab: () => console.log(\"Tab changed\") }} />\n * </Suspense>\n *\n * Exemplos de URL:\n * - /greatpages/123?tab=performance → abre a aba \"performance\"\n * - /greatpages/123?tab=leads → abre a aba \"leads\"\n */\nexport function SearchParamsHandler(options: SearchParamsHandlerProps) {\n  return (\n    <Suspense fallback={null}>\n      <SearchParamsHandlerChildren {...options} />\n    </Suspense>\n  );\n}\n\nexport function SearchParamsHandlerChildren(options: SearchParamsHandlerProps) {\n  const searchParams = useSearchParams();\n\n  useEffect(() => {\n    Object.keys(options.handlers).forEach((key) => {\n      const value = searchParams.get(key);\n\n      if (value) {\n        options.handlers[key]();\n      }\n    });\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [searchParams]);\n\n  return null;\n}\n"],"mappings":";AAwCM;AAtCN,SAAS,UAAU,iBAAiB;AACpC,SAAS,uBAAuB;AAkCzB,SAAS,oBAAoB,SAAmC;AACrE,SACE,oBAAC,YAAS,UAAU,MAClB,8BAAC,+BAA6B,GAAG,SAAS,GAC5C;AAEJ;AAEO,SAAS,4BAA4B,SAAmC;AAC7E,QAAM,eAAe,gBAAgB;AAErC,YAAU,MAAM;AACd,WAAO,KAAK,QAAQ,QAAQ,EAAE,QAAQ,CAAC,QAAQ;AAC7C,YAAM,QAAQ,aAAa,IAAI,GAAG;AAElC,UAAI,OAAO;AACT,gBAAQ,SAAS,GAAG,EAAE;AAAA,MACxB;AAAA,IACF,CAAC;AAAA,EAEH,GAAG,CAAC,YAAY,CAAC;AAEjB,SAAO;AACT;","names":[]}

package/dist/components/layouts/AppMobileNavBar.mjs

@@ -0,0 +1,115 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import Image from "next/image";
+import { ProfilePopover } from "./ProfilePopover";
+import { useAccountModals } from "../../store/useAccountModals";
+import { Tooltip, TooltipContent, TooltipTrigger } from "../ui/overlay/Tooltip";
+function AppMobileNavBar({
+  activeApp,
+  onLogoClick,
+  onAppIconClick,
+  extraLeftSlot,
+  rightActionSlot,
+  menuItems = [],
+  onCreditsClick
+}) {
+  const { openConfigurations } = useAccountModals();
+  const isGpagesActive = activeApp === "gpages";
+  const isGappsActive = activeApp === "gapps";
+  return /* @__PURE__ */ jsxs("div", { className: "fixed top-0 left-0 right-0 flex md:hidden items-center justify-between p-4 bg-white z-50 border-b border-gray-200", children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1.5", children: [
+      /* @__PURE__ */ jsxs(Tooltip, { children: [
+        /* @__PURE__ */ jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(
+          "div",
+          {
+            className: `relative size-10 flex items-center justify-center rounded-lg transition-colors ${onLogoClick ? "cursor-pointer hover:bg-gray-100" : ""}`,
+            onClick: onLogoClick,
+            children: [
+              /* @__PURE__ */ jsx(
+                Image,
+                {
+                  src: "/icons/great-icon.svg",
+                  alt: "GreatApps",
+                  width: 28,
+                  height: 28
+                }
+              ),
+              isGappsActive && /* @__PURE__ */ jsx("div", { className: "absolute bottom-[-17px] left-1/2 -translate-x-1/2 w-5 h-[3px] bg-gray-950 rounded-t-xl" })
+            ]
+          }
+        ) }),
+        /* @__PURE__ */ jsx(TooltipContent, { side: "bottom", children: "GreatApps" })
+      ] }),
+      /* @__PURE__ */ jsxs("div", { className: "relative", children: [
+        /* @__PURE__ */ jsxs(Tooltip, { children: [
+          /* @__PURE__ */ jsx(TooltipTrigger, { asChild: true, children: isGpagesActive ? /* @__PURE__ */ jsx(
+            "div",
+            {
+              className: "size-10 rounded-xl cursor-pointer p-[2px]",
+              style: {
+                border: "1.5px solid rgba(153,234,255,0.75)",
+                background: "white",
+                boxShadow: "0 0 8px rgba(153,234,255,0.5), 0 0 18px rgba(153,234,255,0.2)"
+              },
+              onClick: onAppIconClick,
+              children: /* @__PURE__ */ jsx(
+                "div",
+                {
+                  className: "w-full h-full rounded-lg flex items-center justify-center",
+                  style: {
+                    background: "radial-gradient(circle at center, rgba(255,255,255,0.95) 0%, rgba(153,234,255,0.45) 100%)"
+                  },
+                  children: /* @__PURE__ */ jsx(
+                    Image,
+                    {
+                      src: "/icons/icon-navbar.svg",
+                      alt: "GreatPages",
+                      width: 24,
+                      height: 24
+                    }
+                  )
+                }
+              )
+            }
+          ) : /* @__PURE__ */ jsx(
+            "div",
+            {
+              className: `size-10 flex items-center justify-center rounded-lg transition-colors duration-300 bg-gray-100 ${onAppIconClick ? "cursor-pointer hover:opacity-80" : ""}`,
+              onClick: onAppIconClick,
+              children: /* @__PURE__ */ jsx(
+                Image,
+                {
+                  src: "/icons/icon-navbar.svg",
+                  alt: "GreatPages",
+                  width: 24,
+                  height: 24
+                }
+              )
+            }
+          ) }),
+          /* @__PURE__ */ jsx(TooltipContent, { side: "bottom", children: "GreatPages" })
+        ] }),
+        isGpagesActive && /* @__PURE__ */ jsx("div", { className: "absolute -bottom-[17px] left-1/2 -translate-x-1/2 w-5 h-[3px] rounded-t-xl", style: { backgroundColor: "#6ADCFF" } })
+      ] }),
+      extraLeftSlot
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1.5", children: [
+      /* @__PURE__ */ jsx(
+        ProfilePopover,
+        {
+          side: "bottom",
+          align: "end",
+          contentClassName: "",
+          onEditProfile: () => openConfigurations(),
+          onCreditsClick,
+          menuItems
+        }
+      ),
+      rightActionSlot
+    ] })
+  ] });
+}
+export {
+  AppMobileNavBar
+};
+//# sourceMappingURL=AppMobileNavBar.mjs.map

package/dist/components/layouts/AppMobileNavBar.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/layouts/AppMobileNavBar.tsx"],"sourcesContent":["\"use client\";\n\nimport { ReactNode } from \"react\";\nimport Image from \"next/image\";\nimport { ProfilePopover } from \"./ProfilePopover\";\nimport { useAccountModals } from \"../../store/useAccountModals\";\nimport type { ProfileMenuItem } from \"./ProfilePopover\";\nimport { Tooltip, TooltipContent, TooltipTrigger } from \"../ui/overlay/Tooltip\";\n\nexport interface AppMobileNavBarProps {\n  /** Which app is currently active — controls which icon gets the indicator */\n  activeApp?: \"gapps\" | \"gpages\";\n  /** Called when the GreatApps logo is clicked */\n  onLogoClick?: () => void;\n  /** Called when the app icon (e.g. GreatPages) is clicked */\n  onAppIconClick?: () => void;\n  /** Extra slot rendered after the app icon (e.g. project selector) */\n  extraLeftSlot?: ReactNode;\n  /** Required: the right-side action element (toggle button, sheet button, etc.) */\n  rightActionSlot: ReactNode;\n  menuItems?: ProfileMenuItem[];\n  onCreditsClick?: () => void;\n}\n\nexport function AppMobileNavBar({\n  activeApp,\n  onLogoClick,\n  onAppIconClick,\n  extraLeftSlot,\n  rightActionSlot,\n  menuItems = [],\n  onCreditsClick,\n}: AppMobileNavBarProps) {\n  const { openConfigurations } = useAccountModals();\n\n  const isGpagesActive = activeApp === \"gpages\";\n  const isGappsActive = activeApp === \"gapps\";\n\n  return (\n    <div className=\"fixed top-0 left-0 right-0 flex md:hidden items-center justify-between p-4 bg-white z-50 border-b border-gray-200\">\n      <div className=\"flex items-center gap-1.5\">\n        <Tooltip>\n          <TooltipTrigger asChild>\n            <div\n              className={`relative size-10 flex items-center justify-center rounded-lg transition-colors ${onLogoClick ? \"cursor-pointer hover:bg-gray-100\" : \"\"}`}\n              onClick={onLogoClick}\n            >\n              <Image\n                src=\"/icons/great-icon.svg\"\n                alt=\"GreatApps\"\n                width={28}\n                height={28}\n              />\n              {isGappsActive && (\n                <div className=\"absolute bottom-[-17px] left-1/2 -translate-x-1/2 w-5 h-[3px] bg-gray-950 rounded-t-xl\" />\n              )}\n            </div>\n          </TooltipTrigger>\n          <TooltipContent side=\"bottom\">GreatApps</TooltipContent>\n        </Tooltip>\n        <div className=\"relative\">\n          <Tooltip>\n            <TooltipTrigger asChild>\n              {isGpagesActive ? (\n                <div\n                  className=\"size-10 rounded-xl cursor-pointer p-[2px]\"\n                  style={{\n                    border: \"1.5px solid rgba(153,234,255,0.75)\",\n                    background: \"white\",\n                    boxShadow:\n                      \"0 0 8px rgba(153,234,255,0.5), 0 0 18px rgba(153,234,255,0.2)\",\n                  }}\n                  onClick={onAppIconClick}\n                >\n                  <div\n                    className=\"w-full h-full rounded-lg flex items-center justify-center\"\n                    style={{\n                      background:\n                        \"radial-gradient(circle at center, rgba(255,255,255,0.95) 0%, rgba(153,234,255,0.45) 100%)\",\n                    }}\n                  >\n                    <Image\n                      src=\"/icons/icon-navbar.svg\"\n                      alt=\"GreatPages\"\n                      width={24}\n                      height={24}\n                    />\n                  </div>\n                </div>\n              ) : (\n                <div\n                  className={`size-10 flex items-center justify-center rounded-lg transition-colors duration-300 bg-gray-100 ${onAppIconClick ? \"cursor-pointer hover:opacity-80\" : \"\"}`}\n                  onClick={onAppIconClick}\n                >\n                  <Image\n                    src=\"/icons/icon-navbar.svg\"\n                    alt=\"GreatPages\"\n                    width={24}\n                    height={24}\n                  />\n                </div>\n              )}\n            </TooltipTrigger>\n            <TooltipContent side=\"bottom\">GreatPages</TooltipContent>\n          </Tooltip>\n          {isGpagesActive && (\n            <div className=\"absolute -bottom-[17px] left-1/2 -translate-x-1/2 w-5 h-[3px] rounded-t-xl\" style={{ backgroundColor: \"#6ADCFF\" }} />\n          )}\n        </div>\n        {extraLeftSlot}\n      </div>\n      <div className=\"flex items-center gap-1.5\">\n        <ProfilePopover\n          side=\"bottom\"\n          align=\"end\"\n          contentClassName=\"\"\n          onEditProfile={() => openConfigurations()}\n          onCreditsClick={onCreditsClick}\n          menuItems={menuItems}\n        />\n        {rightActionSlot}\n      </div>\n    </div>\n  );\n}\n"],"mappings":";AA2CY,SAIE,KAJF;AAxCZ,OAAO,WAAW;AAClB,SAAS,sBAAsB;AAC/B,SAAS,wBAAwB;AAEjC,SAAS,SAAS,gBAAgB,sBAAsB;AAiBjD,SAAS,gBAAgB;AAAA,EAC9B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,YAAY,CAAC;AAAA,EACb;AACF,GAAyB;AACvB,QAAM,EAAE,mBAAmB,IAAI,iBAAiB;AAEhD,QAAM,iBAAiB,cAAc;AACrC,QAAM,gBAAgB,cAAc;AAEpC,SACE,qBAAC,SAAI,WAAU,qHACb;AAAA,yBAAC,SAAI,WAAU,6BACb;AAAA,2BAAC,WACC;AAAA,4BAAC,kBAAe,SAAO,MACrB;AAAA,UAAC;AAAA;AAAA,YACC,WAAW,kFAAkF,cAAc,qCAAqC,EAAE;AAAA,YAClJ,SAAS;AAAA,YAET;AAAA;AAAA,gBAAC;AAAA;AAAA,kBACC,KAAI;AAAA,kBACJ,KAAI;AAAA,kBACJ,OAAO;AAAA,kBACP,QAAQ;AAAA;AAAA,cACV;AAAA,cACC,iBACC,oBAAC,SAAI,WAAU,0FAAyF;AAAA;AAAA;AAAA,QAE5G,GACF;AAAA,QACA,oBAAC,kBAAe,MAAK,UAAS,uBAAS;AAAA,SACzC;AAAA,MACA,qBAAC,SAAI,WAAU,YACb;AAAA,6BAAC,WACC;AAAA,8BAAC,kBAAe,SAAO,MACpB,2BACC;AAAA,YAAC;AAAA;AAAA,cACC,WAAU;AAAA,cACV,OAAO;AAAA,gBACL,QAAQ;AAAA,gBACR,YAAY;AAAA,gBACZ,WACE;AAAA,cACJ;AAAA,cACA,SAAS;AAAA,cAET;AAAA,gBAAC;AAAA;AAAA,kBACC,WAAU;AAAA,kBACV,OAAO;AAAA,oBACL,YACE;AAAA,kBACJ;AAAA,kBAEA;AAAA,oBAAC;AAAA;AAAA,sBACC,KAAI;AAAA,sBACJ,KAAI;AAAA,sBACJ,OAAO;AAAA,sBACP,QAAQ;AAAA;AAAA,kBACV;AAAA;AAAA,cACF;AAAA;AAAA,UACF,IAEA;AAAA,YAAC;AAAA;AAAA,cACC,WAAW,kGAAkG,iBAAiB,oCAAoC,EAAE;AAAA,cACpK,SAAS;AAAA,cAET;AAAA,gBAAC;AAAA;AAAA,kBACC,KAAI;AAAA,kBACJ,KAAI;AAAA,kBACJ,OAAO;AAAA,kBACP,QAAQ;AAAA;AAAA,cACV;AAAA;AAAA,UACF,GAEJ;AAAA,UACA,oBAAC,kBAAe,MAAK,UAAS,wBAAU;AAAA,WAC1C;AAAA,QACC,kBACC,oBAAC,SAAI,WAAU,8EAA6E,OAAO,EAAE,iBAAiB,UAAU,GAAG;AAAA,SAEvI;AAAA,MACC;AAAA,OACH;AAAA,IACA,qBAAC,SAAI,WAAU,6BACb;AAAA;AAAA,QAAC;AAAA;AAAA,UACC,MAAK;AAAA,UACL,OAAM;AAAA,UACN,kBAAiB;AAAA,UACjB,eAAe,MAAM,mBAAmB;AAAA,UACxC;AAAA,UACA;AAAA;AAAA,MACF;AAAA,MACC;AAAA,OACH;AAAA,KACF;AAEJ;","names":[]}