@greatapps/common 1.1.488 → 1.1.490

package/dist/components/account/ConfigurationsMyAccountModal.mjs

@@ -24,7 +24,7 @@ function ConfigurationsMyAccountModal() {
   const open = activeModal === "configurations";
   const { hasActiveSubscription } = config;
   const { user } = useAuth();
-  const isOwnerOrAdmin = user?.profile === UserProfile.owner || user?.profile === UserProfile.admin;
+  const isOwner = user?.profile === UserProfile.owner;
   const isMobile = useIsMobile();
   const { activeSection, setActiveSection } = useConfigurationsModal({
     isOpen: open
@@ -94,7 +94,7 @@ function ConfigurationsMyAccountModal() {
                         /* @__PURE__ */ jsx(IconSettings2, { size: 20, className: "shrink-0" }),
                         /* @__PURE__ */ jsx("span", { className: "paragraph-small-medium", children: "Prefer\xEAncias" })
                       ] }),
-                      isOwnerOrAdmin && /* @__PURE__ */ jsxs(TabsTrigger, { value: AccountSectionType.SECURITY, className: tabTriggerClasses, children: [
+                      isOwner && /* @__PURE__ */ jsxs(TabsTrigger, { value: AccountSectionType.SECURITY, className: tabTriggerClasses, children: [
                         /* @__PURE__ */ jsx(IconLock, { size: 20, className: "shrink-0" }),
                         /* @__PURE__ */ jsx("span", { className: "paragraph-small-medium", children: "Seguran\xE7a" })
                       ] })
@@ -104,7 +104,7 @@ function ConfigurationsMyAccountModal() {
               ),
               /* @__PURE__ */ jsxs("div", { className: "w-full flex-1 min-h-0 lg:h-full overflow-hidden lg:overflow-visible relative flex flex-col", children: [
                 /* @__PURE__ */ jsx(TabsContent, { value: AccountSectionType.PREFERENCES, className: "h-full! relative overflow-hidden", children: /* @__PURE__ */ jsx(PreferencesSection, { onClose: close }) }),
-                isOwnerOrAdmin && /* @__PURE__ */ jsxs(Fragment, { children: [
+                isOwner && /* @__PURE__ */ jsxs(Fragment, { children: [
                   /* @__PURE__ */ jsx(TabsContent, { value: AccountSectionType.SECURITY, className: "h-full! relative overflow-hidden", children: /* @__PURE__ */ jsx(
                     SecuritySection,
                     {

package/dist/components/account/ConfigurationsMyAccountModal.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/account/ConfigurationsMyAccountModal.tsx"],"sourcesContent":["'use client';\n\nimport { IconLock, IconSettings2, IconX } from '@tabler/icons-react';\nimport { Dialog, DialogContent, DialogHeader, DialogTitle } from '../ui/overlay/Dialog';\nimport { Tabs, TabsList, TabsTrigger, TabsContent } from '../ui/data-display/Tabs';\nimport { cn } from '../../infra/utils/clsx';\nimport { AccountSectionType } from '../../enums/AccountSectionType';\nimport { PreferencesSection } from './sections/PreferencesSection';\nimport { ChangePasswordSection } from './sections/ChangePasswordSection';\nimport { SecuritySection } from './sections/SecuritySection';\nimport useConfigurationsModal from './hooks/useConfigurationsModal';\nimport useIsMobile from '../../hooks/useIsMobile';\nimport { useAccountModals } from '../../store/useAccountModals';\nimport { useAuth } from '../../providers/auth.provider';\nimport { UserProfile } from '../../modules/users/schema';\n\nexport default function ConfigurationsMyAccountModal() {\n  const {\n    activeModal,\n    config,\n    openDeleteAccount,\n    openIsntPossibleDelete,\n    close,\n  } = useAccountModals();\n\n  const open = activeModal === 'configurations';\n  const { hasActiveSubscription } = config;\n\n  const { user } = useAuth();\n  const isOwnerOrAdmin = user?.profile === UserProfile.owner || user?.profile === UserProfile.admin;\n  const isMobile = useIsMobile();\n  const { activeSection, setActiveSection } = useConfigurationsModal({\n    isOpen: open,\n  });\n\n  const handleDeleteAccount = () => {\n    close();\n    if (hasActiveSubscription) {\n      openIsntPossibleDelete();\n    } else {\n      openDeleteAccount();\n    }\n  };\n\n  const tabTriggerClasses = cn(\n    'border-0! px-0 py-0',\n\n    'lg:rounded-md lg:flex lg:items-center lg:gap-2 lg:p-3 lg:justify-start lg:w-full',\n    'lg:bg-white lg:hover:bg-gray-100 lg:active:bg-gray-50 lg:border-0',\n    'lg:data-[state=active]:bg-gray-50',\n\n    'flex items-center gap-1.5 px-3 py-3 justify-center whitespace-nowrap',\n    'border-b-2 border-transparent',\n    'data-[state=active]:bg-gray-50 rounded-lg',\n\n    'text-gray-500 data-[state=active]:text-gray-950',\n    'hover:text-gray-900 transition-colors'\n  );\n\n  return (\n    <Dialog open={open} onOpenChange={close}>\n      <DialogContent\n        showCloseButton={!isMobile}\n        overlayClassName=\"bg-black/20 lg:bg-black/50\"\n        className=\"\n          flex flex-col p-0 gap-0 max-w-full sm:max-w-full overflow-x-hidden border-0\n          rounded-t-2xl rounded-b-none h-[100dvh] top-0 bottom-0 left-0 right-0 translate-x-0 translate-y-0\n          lg:flex-row lg:w-[892px] lg:max-w-[892px] lg:h-[626px] lg:rounded-lg lg:border\n          lg:top-[50%] lg:bottom-auto lg:left-[50%] lg:right-auto lg:translate-x-[-50%] lg:translate-y-[-50%]\"\n      >\n        <DialogHeader className=\"sr-only\">\n          <DialogTitle>Configurações</DialogTitle>\n        </DialogHeader>\n        <div className=\"md:hidden flex items-center justify-between px-5 py-3 border-b border-gray-200\">\n          <span className=\"text-gray-950 paragraph-medium-semibold\">Configurações</span>\n          <button\n            type=\"button\"\n            className=\"size-8 flex items-center justify-center text-gray-500 cursor-pointer\"\n            onClick={close}\n          >\n            <IconX size={18} />\n          </button>\n        </div>\n        <Tabs\n          value={activeSection}\n          onValueChange={(value) => setActiveSection(value as AccountSectionType)}\n          orientation=\"vertical\"\n          className=\"flex lg:flex-row flex-col w-full h-full flex-1 lg:h-full lg:pt-0 lg:gap-0\"\n        >\n          <TabsList\n            className={cn(\n              'flex gap-0 bg-transparent border-b-0',\n\n              'lg:flex-col lg:items-stretch lg:justify-start lg:w-auto lg:min-w-60',\n              'lg:border-r lg:border-gray-200 lg:pl-5 lg:pr-5 lg:pt-5 lg:gap-5 lg:overflow-x-visible lg:self-stretch',\n\n              'flex-row items-center justify-start w-full overflow-x-auto scrollbar-hide shrink-0',\n              'px-4 py-3',\n              '[mask-image:linear-gradient(to_right,transparent,black_16px,black_calc(100%-24px),transparent)] lg:[mask-image:none]'\n            )}\n          >\n            <span className=\"hidden lg:block paragraph-medium-semibold text-gray-950 mb-0\">\n              Configurações\n            </span>\n\n            <div className=\"lg:flex lg:flex-col flex flex-row lg:gap-0 gap-0 lg:w-full\">\n              <TabsTrigger value={AccountSectionType.PREFERENCES} className={tabTriggerClasses}>\n                <IconSettings2 size={20} className=\"shrink-0\" />\n                <span className=\"paragraph-small-medium\">Preferências</span>\n              </TabsTrigger>\n\n              {isOwnerOrAdmin && (\n                <TabsTrigger value={AccountSectionType.SECURITY} className={tabTriggerClasses}>\n                  <IconLock size={20} className=\"shrink-0\" />\n                  <span className=\"paragraph-small-medium\">Segurança</span>\n                </TabsTrigger>\n              )}\n            </div>\n          </TabsList>\n\n          <div className=\"w-full flex-1 min-h-0 lg:h-full overflow-hidden lg:overflow-visible relative flex flex-col\">\n            <TabsContent value={AccountSectionType.PREFERENCES} className=\"h-full! relative overflow-hidden\">\n              <PreferencesSection onClose={close} />\n            </TabsContent>\n\n            {isOwnerOrAdmin && (\n              <>\n                <TabsContent value={AccountSectionType.SECURITY} className=\"h-full! relative overflow-hidden\">\n                  <SecuritySection\n                    setActiveSection={setActiveSection}\n                    onClose={close}\n                    onDeleteAccount={handleDeleteAccount}\n                  />\n                </TabsContent>\n\n                <TabsContent value={AccountSectionType.CHANGE_PASSWORD} className=\"h-full! relative overflow-hidden\">\n                  <ChangePasswordSection onBack={() => setActiveSection(AccountSectionType.SECURITY)} />\n                </TabsContent>\n              </>\n            )}\n          </div>\n        </Tabs>\n      </DialogContent>\n    </Dialog>\n  );\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../../src/components/account/ConfigurationsMyAccountModal.tsx"],"sourcesContent":["'use client';\n\nimport { IconLock, IconSettings2, IconX } from '@tabler/icons-react';\nimport { Dialog, DialogContent, DialogHeader, DialogTitle } from '../ui/overlay/Dialog';\nimport { Tabs, TabsList, TabsTrigger, TabsContent } from '../ui/data-display/Tabs';\nimport { cn } from '../../infra/utils/clsx';\nimport { AccountSectionType } from '../../enums/AccountSectionType';\nimport { PreferencesSection } from './sections/PreferencesSection';\nimport { ChangePasswordSection } from './sections/ChangePasswordSection';\nimport { SecuritySection } from './sections/SecuritySection';\nimport useConfigurationsModal from './hooks/useConfigurationsModal';\nimport useIsMobile from '../../hooks/useIsMobile';\nimport { useAccountModals } from '../../store/useAccountModals';\nimport { useAuth } from '../../providers/auth.provider';\nimport { UserProfile } from '../../modules/users/schema';\n\nexport default function ConfigurationsMyAccountModal() {\n  const {\n    activeModal,\n    config,\n    openDeleteAccount,\n    openIsntPossibleDelete,\n    close,\n  } = useAccountModals();\n\n  const open = activeModal === 'configurations';\n  const { hasActiveSubscription } = config;\n\n  const { user } = useAuth();\n  const isOwner = user?.profile === UserProfile.owner;\n\n  const isMobile = useIsMobile();\n  const { activeSection, setActiveSection } = useConfigurationsModal({\n    isOpen: open,\n  });\n\n  const handleDeleteAccount = () => {\n    close();\n    if (hasActiveSubscription) {\n      openIsntPossibleDelete();\n    } else {\n      openDeleteAccount();\n    }\n  };\n\n  const tabTriggerClasses = cn(\n    'border-0! px-0 py-0',\n\n    'lg:rounded-md lg:flex lg:items-center lg:gap-2 lg:p-3 lg:justify-start lg:w-full',\n    'lg:bg-white lg:hover:bg-gray-100 lg:active:bg-gray-50 lg:border-0',\n    'lg:data-[state=active]:bg-gray-50',\n\n    'flex items-center gap-1.5 px-3 py-3 justify-center whitespace-nowrap',\n    'border-b-2 border-transparent',\n    'data-[state=active]:bg-gray-50 rounded-lg',\n\n    'text-gray-500 data-[state=active]:text-gray-950',\n    'hover:text-gray-900 transition-colors'\n  );\n\n  return (\n    <Dialog open={open} onOpenChange={close}>\n      <DialogContent\n        showCloseButton={!isMobile}\n        overlayClassName=\"bg-black/20 lg:bg-black/50\"\n        className=\"\n          flex flex-col p-0 gap-0 max-w-full sm:max-w-full overflow-x-hidden border-0\n          rounded-t-2xl rounded-b-none h-[100dvh] top-0 bottom-0 left-0 right-0 translate-x-0 translate-y-0\n          lg:flex-row lg:w-[892px] lg:max-w-[892px] lg:h-[626px] lg:rounded-lg lg:border\n          lg:top-[50%] lg:bottom-auto lg:left-[50%] lg:right-auto lg:translate-x-[-50%] lg:translate-y-[-50%]\"\n      >\n        <DialogHeader className=\"sr-only\">\n          <DialogTitle>Configurações</DialogTitle>\n        </DialogHeader>\n        <div className=\"md:hidden flex items-center justify-between px-5 py-3 border-b border-gray-200\">\n          <span className=\"text-gray-950 paragraph-medium-semibold\">Configurações</span>\n          <button\n            type=\"button\"\n            className=\"size-8 flex items-center justify-center text-gray-500 cursor-pointer\"\n            onClick={close}\n          >\n            <IconX size={18} />\n          </button>\n        </div>\n        <Tabs\n          value={activeSection}\n          onValueChange={(value) => setActiveSection(value as AccountSectionType)}\n          orientation=\"vertical\"\n          className=\"flex lg:flex-row flex-col w-full h-full flex-1 lg:h-full lg:pt-0 lg:gap-0\"\n        >\n          <TabsList\n            className={cn(\n              'flex gap-0 bg-transparent border-b-0',\n\n              'lg:flex-col lg:items-stretch lg:justify-start lg:w-auto lg:min-w-60',\n              'lg:border-r lg:border-gray-200 lg:pl-5 lg:pr-5 lg:pt-5 lg:gap-5 lg:overflow-x-visible lg:self-stretch',\n\n              'flex-row items-center justify-start w-full overflow-x-auto scrollbar-hide shrink-0',\n              'px-4 py-3',\n              '[mask-image:linear-gradient(to_right,transparent,black_16px,black_calc(100%-24px),transparent)] lg:[mask-image:none]'\n            )}\n          >\n            <span className=\"hidden lg:block paragraph-medium-semibold text-gray-950 mb-0\">\n              Configurações\n            </span>\n\n            <div className=\"lg:flex lg:flex-col flex flex-row lg:gap-0 gap-0 lg:w-full\">\n              <TabsTrigger value={AccountSectionType.PREFERENCES} className={tabTriggerClasses}>\n                <IconSettings2 size={20} className=\"shrink-0\" />\n                <span className=\"paragraph-small-medium\">Preferências</span>\n              </TabsTrigger>\n\n              {isOwner && (\n                <TabsTrigger value={AccountSectionType.SECURITY} className={tabTriggerClasses}>\n                  <IconLock size={20} className=\"shrink-0\" />\n                  <span className=\"paragraph-small-medium\">Segurança</span>\n                </TabsTrigger>\n              )}\n            </div>\n          </TabsList>\n\n          <div className=\"w-full flex-1 min-h-0 lg:h-full overflow-hidden lg:overflow-visible relative flex flex-col\">\n            <TabsContent value={AccountSectionType.PREFERENCES} className=\"h-full! relative overflow-hidden\">\n              <PreferencesSection onClose={close} />\n            </TabsContent>\n\n            {isOwner && (\n              <>\n                <TabsContent value={AccountSectionType.SECURITY} className=\"h-full! relative overflow-hidden\">\n                  <SecuritySection\n                    setActiveSection={setActiveSection}\n                    onClose={close}\n                    onDeleteAccount={handleDeleteAccount}\n                  />\n                </TabsContent>\n\n                <TabsContent value={AccountSectionType.CHANGE_PASSWORD} className=\"h-full! relative overflow-hidden\">\n                  <ChangePasswordSection onBack={() => setActiveSection(AccountSectionType.SECURITY)} />\n                </TabsContent>\n              </>\n            )}\n          </div>\n        </Tabs>\n      </DialogContent>\n    </Dialog>\n  );\n}\n"],"mappings":"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","names":[]}

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

@@ -9,12 +9,14 @@ import { FormField } from "../../ui/form/FormField";
 import { formatTimer } from "../../../utils/format/masks";
 import { OTP_CODE_LENGTH } from "../../../utils/validators/account";
 import { useAuth } from "../../../providers/auth.provider";
+import { useIsDefaultWhitelabel } from "../../../providers/whitelabel.provider";
 import { useInvalidateUser } from "../../../modules/auth/hooks/useUserQuery";
 import { confirmEmailChangeAction } from "../../../modules/accounts/actions/account-management.action";
 import useChangeEmailForm from "../hooks/useChangeEmailForm";
 import useOtpVerification from "../hooks/useOtpVerification";
 function ChangeEmailModal({ open, onClose }) {
   const { user } = useAuth();
+  const isDefaultWl = useIsDefaultWhitelabel();
   const invalidateUser = useInvalidateUser();
   const {
     showVerification,
@@ -92,7 +94,7 @@ function ChangeEmailModal({ open, onClose }) {
             )
           ] })
         ] }),
-        /* @__PURE__ */ jsx("div", { className: `${showVerification ? "w-full" : "w-1/2"} h-0.75 bg-cyan-300` }),
+        /* @__PURE__ */ jsx("div", { className: `${showVerification ? "w-full" : "w-1/2"} h-0.75 ${isDefaultWl ? "bg-cyan-300" : "bg-zinc-300"}` }),
         showVerification ? /* @__PURE__ */ jsxs(
           "form",
           {

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/account/sections/ChangeEmailModal.tsx"],"sourcesContent":["'use client';\n\nimport { IconChevronLeft, IconX, IconMail } from '@tabler/icons-react';\nimport { Button } from '../../ui/buttons/Button';\nimport { Dialog, DialogContent, DialogHeader, DialogTitle } from '../../ui/overlay/Dialog';\nimport { Separator } from '../../ui/data-display/Separator';\nimport { InputOTP, InputOTPGroup, InputOTPSlot } from '../../ui/form/InputOtp';\nimport { FormField } from '../../ui/form/FormField';\nimport { formatTimer } from '../../../utils/format/masks';\nimport { OTP_CODE_LENGTH } from '../../../utils/validators/account';\nimport { useAuth } from '../../../providers/auth.provider';\nimport { useInvalidateUser } from '../../../modules/auth/hooks/useUserQuery';\nimport { confirmEmailChangeAction } from '../../../modules/accounts/actions/account-management.action';\nimport useChangeEmailForm from '../hooks/useChangeEmailForm';\nimport useOtpVerification from '../hooks/useOtpVerification';\n\ninterface ChangeEmailModalProps {\n  open: boolean;\n  onClose: () => void;\n}\n\nexport function ChangeEmailModal({ open, onClose }: ChangeEmailModalProps) {\n  const { user } = useAuth();\n  const invalidateUser = useInvalidateUser();\n\n  const {\n    showVerification,\n    emailToVerify,\n    isSubmitting,\n    errors,\n    register,\n    handleContinue,\n    handleBack,\n    resetForm,\n  } = useChangeEmailForm();\n\n  const handleSuccess = () => {\n    invalidateUser();\n    resetForm();\n    onClose();\n  };\n\n  const {\n    code,\n    isLoading,\n    hasError,\n    timer,\n    canResend,\n    isValidLength,\n    handleCodeChange,\n    handleValidate,\n    handleResend,\n    reset: resetOtp,\n  } = useOtpVerification({\n    onSuccess: handleSuccess,\n    successMessage: 'E-mail alterado com sucesso',\n    validateFn: async (token) => {\n      const result = await confirmEmailChangeAction(token, emailToVerify);\n      return result.success;\n    },\n    resendFn: async () => {\n      const { requestEmailChangeAction } = await import('../../../modules/accounts/actions/account-management.action');\n      const result = await requestEmailChangeAction(emailToVerify);\n      if (!result.success) {\n        throw new Error(result.error);\n      }\n    },\n  });\n\n  const handleClose = () => {\n    resetForm();\n    resetOtp();\n    onClose();\n  };\n\n  const handleBackFromVerification = () => {\n    resetOtp();\n    handleBack();\n  };\n\n  return (\n    <Dialog open={open} onOpenChange={handleClose}>\n      <DialogContent\n        showCloseButton={false}\n        overlayClassName=\"z-[1002]\"\n        className=\"flex flex-col p-0 gap-0 max-w-full sm:max-w-full border-0 rounded-t-2xl rounded-b-none h-dvh top-0 bottom-0 left-0 right-0 translate-x-0 translate-y-0 lg:max-w-125 lg:h-auto lg:rounded-lg lg:border lg:top-[50%] lg:left-[50%] lg:right-auto lg:bottom-auto lg:translate-x-[-50%] lg:translate-y-[-50%] z-[1003]\"\n      >\n        {showVerification ? (\n          <DialogHeader className=\"flex flex-row items-center justify-between px-4 py-3 border-b border-gray-200 lg:border-b-0\">\n            <Button variant=\"ghost\" className=\"size-8! p-0\" onClick={handleBackFromVerification}>\n              <IconChevronLeft size={20} className=\"text-gray-950\" />\n            </Button>\n            <DialogTitle className=\"paragraph-medium-semibold text-gray-950 text-center flex-1\">\n              Alterar e-mail\n            </DialogTitle>\n            <Button variant=\"ghost\" className=\"size-8! p-0\" onClick={handleClose}>\n              <IconX size={18} className=\"text-gray-500\" />\n            </Button>\n          </DialogHeader>\n        ) : (\n          <>\n            <DialogHeader className=\"sr-only\">\n              <DialogTitle>Alterar e-mail</DialogTitle>\n            </DialogHeader>\n            <div className=\"flex items-center justify-center px-4 py-3 relative border-b border-gray-200 lg:border-b-0\">\n              <span className=\"paragraph-medium-semibold text-gray-950 text-center\">\n                Alterar e-mail\n              </span>\n              <Button\n                variant=\"ghost\"\n                className=\"absolute right-2 size-8! p-0\"\n                onClick={handleClose}\n              >\n                <IconX size={18} className=\"text-gray-500\" />\n              </Button>\n            </div>\n          </>\n        )}\n\n        <div className={`${showVerification ? 'w-full' : 'w-1/2'} h-0.75 bg-cyan-300`} />\n\n        {showVerification ? (\n          <form\n            onSubmit={(e) => {\n              e.preventDefault();\n              handleValidate();\n            }}\n            className=\"flex flex-col flex-1 lg:flex-none\"\n          >\n            <div className=\"px-4 lg:px-5 py-5 lg:py-6 flex flex-col gap-4 flex-1 lg:flex-none\">\n              <div className=\"flex items-center justify-center size-12 bg-white rounded-lg shadow-xs border border-gray-200\">\n                <IconMail size={20} className=\"text-gray-950\" />\n              </div>\n\n              <div className=\"flex flex-col gap-1\">\n                <h3 className=\"paragraph-medium-semibold text-gray-950\">Código de validação</h3>\n                <p className=\"paragraph-small-regular text-gray-600\">\n                  Enviamos um código de validação para o E-mail{' '}\n                  <span className=\"font-semibold text-gray-950 break-all\">{user?.email}.</span>\n                </p>\n              </div>\n\n              <div className=\"flex flex-col gap-2\">\n                <InputOTP maxLength={OTP_CODE_LENGTH} value={code} onChange={handleCodeChange}>\n                  <InputOTPGroup className=\"flex flex-row gap-2\">\n                    {[...Array(OTP_CODE_LENGTH)].map((_, i) => (\n                      <InputOTPSlot\n                        key={i}\n                        index={i}\n                        className={`uppercase text-2xl font-medium w-11 lg:w-12 h-13 lg:h-14 rounded-lg border bg-white shadow-none [&_div.animate-caret-blink]:bg-gray-950 ${hasError ? 'border-red-500' : 'border-gray-200'}`}\n                      />\n                    ))}\n                  </InputOTPGroup>\n                </InputOTP>\n                {hasError && (\n                  <p className=\"paragraph-small-regular text-red-500\">Código incorreto</p>\n                )}\n              </div>\n\n              {canResend ? (\n                <button\n                  type=\"button\"\n                  onClick={handleResend}\n                  className=\"paragraph-small-medium text-gray-950 underline cursor-pointer hover:text-gray-700 w-fit\"\n                >\n                  Reenviar código\n                </button>\n              ) : (\n                <p className=\"paragraph-small-regular text-gray-500\">\n                  Reenviar em{' '}\n                  <span className=\"paragraph-small-semibold text-gray-950\">\n                    {formatTimer(timer)}\n                  </span>\n                </p>\n              )}\n            </div>\n\n            <Separator />\n\n            <div className=\"flex items-center justify-between px-4 lg:px-5 py-4 lg:py-5 mt-auto lg:mt-0\">\n              <Button variant=\"secondary\" className=\"h-10!\" type=\"button\" onClick={handleClose}>\n                Cancelar\n              </Button>\n              <Button className=\"h-10!\" type=\"submit\" disabled={!isValidLength || isLoading}>\n                {isLoading ? 'Validando...' : 'Alterar e-mail'}\n              </Button>\n            </div>\n          </form>\n        ) : (\n          <form onSubmit={handleContinue} className=\"flex flex-col flex-1 lg:flex-none\">\n            <div className=\"flex flex-col gap-5 lg:gap-6 px-4 lg:px-5 py-5 lg:py-6 flex-1 lg:flex-none\">\n              <div className=\"flex flex-col gap-1\">\n                <span className=\"paragraph-medium-semibold text-gray-950\">\n                  Atualizar E-mail de contato\n                </span>\n                <span className=\"paragraph-small-regular text-gray-600\">\n                  Informe o seu novo E-mail para manter seu contato atualizado.\n                </span>\n              </div>\n\n              <FormField\n                label=\"Novo e-mail\"\n                placeholder=\"Digite seu novo e-mail\"\n                type=\"email\"\n                {...register('email')}\n                error={!!errors.email}\n                errorMessage={errors.email?.message}\n                leftIcon={IconMail}\n              />\n            </div>\n\n            <div className=\"flex items-center justify-between p-4 lg:p-5 border-t border-gray-200 mt-auto lg:mt-0\">\n              <Button variant=\"secondary\" className=\"h-10!\" type=\"button\" onClick={handleClose}>\n                Cancelar\n              </Button>\n              <Button className=\"h-10!\" type=\"submit\" disabled={isSubmitting}>\n                {isSubmitting ? 'Enviando...' : 'Continuar'}\n              </Button>\n            </div>\n          </form>\n        )}\n      </DialogContent>\n    </Dialog>\n  );\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../../../src/components/account/sections/ChangeEmailModal.tsx"],"sourcesContent":["'use client';\n\nimport { IconChevronLeft, IconX, IconMail } from '@tabler/icons-react';\nimport { Button } from '../../ui/buttons/Button';\nimport { Dialog, DialogContent, DialogHeader, DialogTitle } from '../../ui/overlay/Dialog';\nimport { Separator } from '../../ui/data-display/Separator';\nimport { InputOTP, InputOTPGroup, InputOTPSlot } from '../../ui/form/InputOtp';\nimport { FormField } from '../../ui/form/FormField';\nimport { formatTimer } from '../../../utils/format/masks';\nimport { OTP_CODE_LENGTH } from '../../../utils/validators/account';\nimport { useAuth } from '../../../providers/auth.provider';\nimport { useIsDefaultWhitelabel } from '../../../providers/whitelabel.provider';\nimport { useInvalidateUser } from '../../../modules/auth/hooks/useUserQuery';\nimport { confirmEmailChangeAction } from '../../../modules/accounts/actions/account-management.action';\nimport useChangeEmailForm from '../hooks/useChangeEmailForm';\nimport useOtpVerification from '../hooks/useOtpVerification';\n\ninterface ChangeEmailModalProps {\n  open: boolean;\n  onClose: () => void;\n}\n\nexport function ChangeEmailModal({ open, onClose }: ChangeEmailModalProps) {\n  const { user } = useAuth();\n  const isDefaultWl = useIsDefaultWhitelabel();\n  const invalidateUser = useInvalidateUser();\n\n  const {\n    showVerification,\n    emailToVerify,\n    isSubmitting,\n    errors,\n    register,\n    handleContinue,\n    handleBack,\n    resetForm,\n  } = useChangeEmailForm();\n\n  const handleSuccess = () => {\n    invalidateUser();\n    resetForm();\n    onClose();\n  };\n\n  const {\n    code,\n    isLoading,\n    hasError,\n    timer,\n    canResend,\n    isValidLength,\n    handleCodeChange,\n    handleValidate,\n    handleResend,\n    reset: resetOtp,\n  } = useOtpVerification({\n    onSuccess: handleSuccess,\n    successMessage: 'E-mail alterado com sucesso',\n    validateFn: async (token) => {\n      const result = await confirmEmailChangeAction(token, emailToVerify);\n      return result.success;\n    },\n    resendFn: async () => {\n      const { requestEmailChangeAction } = await import('../../../modules/accounts/actions/account-management.action');\n      const result = await requestEmailChangeAction(emailToVerify);\n      if (!result.success) {\n        throw new Error(result.error);\n      }\n    },\n  });\n\n  const handleClose = () => {\n    resetForm();\n    resetOtp();\n    onClose();\n  };\n\n  const handleBackFromVerification = () => {\n    resetOtp();\n    handleBack();\n  };\n\n  return (\n    <Dialog open={open} onOpenChange={handleClose}>\n      <DialogContent\n        showCloseButton={false}\n        overlayClassName=\"z-[1002]\"\n        className=\"flex flex-col p-0 gap-0 max-w-full sm:max-w-full border-0 rounded-t-2xl rounded-b-none h-dvh top-0 bottom-0 left-0 right-0 translate-x-0 translate-y-0 lg:max-w-125 lg:h-auto lg:rounded-lg lg:border lg:top-[50%] lg:left-[50%] lg:right-auto lg:bottom-auto lg:translate-x-[-50%] lg:translate-y-[-50%] z-[1003]\"\n      >\n        {showVerification ? (\n          <DialogHeader className=\"flex flex-row items-center justify-between px-4 py-3 border-b border-gray-200 lg:border-b-0\">\n            <Button variant=\"ghost\" className=\"size-8! p-0\" onClick={handleBackFromVerification}>\n              <IconChevronLeft size={20} className=\"text-gray-950\" />\n            </Button>\n            <DialogTitle className=\"paragraph-medium-semibold text-gray-950 text-center flex-1\">\n              Alterar e-mail\n            </DialogTitle>\n            <Button variant=\"ghost\" className=\"size-8! p-0\" onClick={handleClose}>\n              <IconX size={18} className=\"text-gray-500\" />\n            </Button>\n          </DialogHeader>\n        ) : (\n          <>\n            <DialogHeader className=\"sr-only\">\n              <DialogTitle>Alterar e-mail</DialogTitle>\n            </DialogHeader>\n            <div className=\"flex items-center justify-center px-4 py-3 relative border-b border-gray-200 lg:border-b-0\">\n              <span className=\"paragraph-medium-semibold text-gray-950 text-center\">\n                Alterar e-mail\n              </span>\n              <Button\n                variant=\"ghost\"\n                className=\"absolute right-2 size-8! p-0\"\n                onClick={handleClose}\n              >\n                <IconX size={18} className=\"text-gray-500\" />\n              </Button>\n            </div>\n          </>\n        )}\n\n        <div className={`${showVerification ? 'w-full' : 'w-1/2'} h-0.75 ${isDefaultWl ? 'bg-cyan-300' : 'bg-zinc-300'}`} />\n\n        {showVerification ? (\n          <form\n            onSubmit={(e) => {\n              e.preventDefault();\n              handleValidate();\n            }}\n            className=\"flex flex-col flex-1 lg:flex-none\"\n          >\n            <div className=\"px-4 lg:px-5 py-5 lg:py-6 flex flex-col gap-4 flex-1 lg:flex-none\">\n              <div className=\"flex items-center justify-center size-12 bg-white rounded-lg shadow-xs border border-gray-200\">\n                <IconMail size={20} className=\"text-gray-950\" />\n              </div>\n\n              <div className=\"flex flex-col gap-1\">\n                <h3 className=\"paragraph-medium-semibold text-gray-950\">Código de validação</h3>\n                <p className=\"paragraph-small-regular text-gray-600\">\n                  Enviamos um código de validação para o E-mail{' '}\n                  <span className=\"font-semibold text-gray-950 break-all\">{user?.email}.</span>\n                </p>\n              </div>\n\n              <div className=\"flex flex-col gap-2\">\n                <InputOTP maxLength={OTP_CODE_LENGTH} value={code} onChange={handleCodeChange}>\n                  <InputOTPGroup className=\"flex flex-row gap-2\">\n                    {[...Array(OTP_CODE_LENGTH)].map((_, i) => (\n                      <InputOTPSlot\n                        key={i}\n                        index={i}\n                        className={`uppercase text-2xl font-medium w-11 lg:w-12 h-13 lg:h-14 rounded-lg border bg-white shadow-none [&_div.animate-caret-blink]:bg-gray-950 ${hasError ? 'border-red-500' : 'border-gray-200'}`}\n                      />\n                    ))}\n                  </InputOTPGroup>\n                </InputOTP>\n                {hasError && (\n                  <p className=\"paragraph-small-regular text-red-500\">Código incorreto</p>\n                )}\n              </div>\n\n              {canResend ? (\n                <button\n                  type=\"button\"\n                  onClick={handleResend}\n                  className=\"paragraph-small-medium text-gray-950 underline cursor-pointer hover:text-gray-700 w-fit\"\n                >\n                  Reenviar código\n                </button>\n              ) : (\n                <p className=\"paragraph-small-regular text-gray-500\">\n                  Reenviar em{' '}\n                  <span className=\"paragraph-small-semibold text-gray-950\">\n                    {formatTimer(timer)}\n                  </span>\n                </p>\n              )}\n            </div>\n\n            <Separator />\n\n            <div className=\"flex items-center justify-between px-4 lg:px-5 py-4 lg:py-5 mt-auto lg:mt-0\">\n              <Button variant=\"secondary\" className=\"h-10!\" type=\"button\" onClick={handleClose}>\n                Cancelar\n              </Button>\n              <Button className=\"h-10!\" type=\"submit\" disabled={!isValidLength || isLoading}>\n                {isLoading ? 'Validando...' : 'Alterar e-mail'}\n              </Button>\n            </div>\n          </form>\n        ) : (\n          <form onSubmit={handleContinue} className=\"flex flex-col flex-1 lg:flex-none\">\n            <div className=\"flex flex-col gap-5 lg:gap-6 px-4 lg:px-5 py-5 lg:py-6 flex-1 lg:flex-none\">\n              <div className=\"flex flex-col gap-1\">\n                <span className=\"paragraph-medium-semibold text-gray-950\">\n                  Atualizar E-mail de contato\n                </span>\n                <span className=\"paragraph-small-regular text-gray-600\">\n                  Informe o seu novo E-mail para manter seu contato atualizado.\n                </span>\n              </div>\n\n              <FormField\n                label=\"Novo e-mail\"\n                placeholder=\"Digite seu novo e-mail\"\n                type=\"email\"\n                {...register('email')}\n                error={!!errors.email}\n                errorMessage={errors.email?.message}\n                leftIcon={IconMail}\n              />\n            </div>\n\n            <div className=\"flex items-center justify-between p-4 lg:p-5 border-t border-gray-200 mt-auto lg:mt-0\">\n              <Button variant=\"secondary\" className=\"h-10!\" type=\"button\" onClick={handleClose}>\n                Cancelar\n              </Button>\n              <Button className=\"h-10!\" type=\"submit\" disabled={isSubmitting}>\n                {isSubmitting ? 'Enviando...' : 'Continuar'}\n              </Button>\n            </div>\n          </form>\n        )}\n      </DialogContent>\n    </Dialog>\n  );\n}\n"],"mappings":"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","names":[]}

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

@@ -9,12 +9,14 @@ import PhoneInput from "../../ui/form/PhoneInput";
 import { formatTimer, formatPhone } from "../../../utils/format/masks";
 import { OTP_CODE_LENGTH } from "../../../utils/validators/account";
 import { useAuth } from "../../../providers/auth.provider";
+import { useIsDefaultWhitelabel } from "../../../providers/whitelabel.provider";
 import { useInvalidateUser } from "../../../modules/auth/hooks/useUserQuery";
 import { confirmPhoneChangeAction } from "../../../modules/accounts/actions/account-management.action";
 import useChangePhoneForm from "../hooks/useChangePhoneForm";
 import useOtpVerification from "../hooks/useOtpVerification";
 function ChangePhoneModal({ open, onClose }) {
   const { user } = useAuth();
+  const isDefaultWl = useIsDefaultWhitelabel();
   const invalidateUser = useInvalidateUser();
   const hasExistingPhone = !!user?.phone;
   const currentPhoneDisplay = user?.phone ? formatPhone(
@@ -104,7 +106,7 @@ function ChangePhoneModal({ open, onClose }) {
             )
           ] })
         ] }),
-        /* @__PURE__ */ jsx("div", { className: `${showVerification || !hasExistingPhone ? "w-full" : "w-1/2"} h-0.75 bg-cyan-300` }),
+        /* @__PURE__ */ jsx("div", { className: `${showVerification || !hasExistingPhone ? "w-full" : "w-1/2"} h-0.75 ${isDefaultWl ? "bg-cyan-300" : "bg-zinc-300"}` }),
         showVerification ? /* @__PURE__ */ jsxs(
           "form",
           {

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

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

package/dist/components/layouts/AppMobileNavBar.mjs

@@ -4,6 +4,7 @@ import Image from "next/image";
 import { IconMenu2, IconX } from "@tabler/icons-react";
 import { ProfilePopover } from "./ProfilePopover";
 import { useMobileNavbarSheet } from "../../store/useMobileNavbarSheet";
+import { useIsDefaultWhitelabel } from "../../providers/whitelabel.provider";
 function AppMobileNavBar({
   activeApp,
   onAppIconClick,
@@ -12,13 +13,14 @@ function AppMobileNavBar({
   showMenuToggle = true
 }) {
   const { isOpen, toggle } = useMobileNavbarSheet();
+  const isDefaultWl = useIsDefaultWhitelabel();
   const isGpagesActive = activeApp === "gpages";
   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__ */ jsx("div", { className: "relative", children: /* @__PURE__ */ jsx(
         "div",
         {
-          className: `size-10 rounded-lg flex items-center justify-center transition-colors ${isGpagesActive ? "bg-cyan-100 border-2 border-white ring-2 ring-cyan-300" : onAppIconClick ? "cursor-pointer hover:bg-gray-100" : ""}`,
+          className: `size-10 rounded-lg flex items-center justify-center transition-colors ${isGpagesActive ? isDefaultWl ? "bg-cyan-100 border-2 border-white ring-2 ring-cyan-300" : "border-2 border-white ring-2 ring-zinc-300 bg-zinc-100" : onAppIconClick ? "cursor-pointer hover:bg-gray-100" : ""}`,
           onClick: onAppIconClick,
           children: /* @__PURE__ */ jsx(
             Image,

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/layouts/AppMobileNavBar.tsx"],"sourcesContent":["\"use client\";\n\nimport { ReactNode } from \"react\";\nimport Image from \"next/image\";\nimport { IconMenu2, IconX } from \"@tabler/icons-react\";\nimport { ProfilePopover } from \"./ProfilePopover\";\nimport { useMobileNavbarSheet } from \"../../store/useMobileNavbarSheet\";\nimport type { ProfileMenuItem } from \"./ProfilePopover\";\n\nexport interface AppMobileNavBarProps {\n  /** Which app is currently active — controls which icon gets the indicator */\n  activeApp?: \"gapps\" | \"gpages\";\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  menuItems?: ProfileMenuItem[];\n  showMenuToggle?: boolean;\n}\n\nexport function AppMobileNavBar({\n  activeApp,\n  onAppIconClick,\n  extraLeftSlot,\n  menuItems = [],\n  showMenuToggle = true,\n}: AppMobileNavBarProps) {\n  const { isOpen, toggle } = useMobileNavbarSheet();\n\n  const isGpagesActive = activeApp === \"gpages\";\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        <div className=\"relative\">\n          <div\n            className={`size-10 rounded-lg flex items-center justify-center transition-colors ${\n              isGpagesActive\n                ? \"bg-cyan-100 border-2 border-white ring-2 ring-cyan-300\"\n                : onAppIconClick ? \"cursor-pointer hover:bg-gray-100\" : \"\"\n            }`}\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        </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          menuItems={menuItems}\n        />\n        {showMenuToggle && (\n          <button\n            className=\"size-10 flex items-center justify-center border border-zinc-200 rounded-lg bg-white cursor-pointer\"\n            onClick={toggle}\n          >\n            {isOpen ? (\n              <IconX size={18} className=\"text-zinc-950\" />\n            ) : (\n              <IconMenu2 size={18} className=\"text-zinc-950\" />\n            )}\n          </button>\n        )}\n      </div>\n    </div>\n  );\n}\n"],"mappings":";AAiCM,SAUM,KAVN;AA9BN,OAAO,WAAW;AAClB,SAAS,WAAW,aAAa;AACjC,SAAS,sBAAsB;AAC/B,SAAS,4BAA4B;AAc9B,SAAS,gBAAgB;AAAA,EAC9B;AAAA,EACA;AAAA,EACA;AAAA,EACA,YAAY,CAAC;AAAA,EACb,iBAAiB;AACnB,GAAyB;AACvB,QAAM,EAAE,QAAQ,OAAO,IAAI,qBAAqB;AAEhD,QAAM,iBAAiB,cAAc;AAErC,SACE,qBAAC,SAAI,WAAU,qHACb;AAAA,yBAAC,SAAI,WAAU,6BACb;AAAA,0BAAC,SAAI,WAAU,YACb;AAAA,QAAC;AAAA;AAAA,UACC,WAAW,yEACT,iBACI,2DACA,iBAAiB,qCAAqC,EAC5D;AAAA,UACA,SAAS;AAAA,UAET;AAAA,YAAC;AAAA;AAAA,cACC,KAAI;AAAA,cACJ,KAAI;AAAA,cACJ,OAAO;AAAA,cACP,QAAQ;AAAA;AAAA,UACV;AAAA;AAAA,MACF,GACF;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;AAAA;AAAA,MACF;AAAA,MACC,kBACC;AAAA,QAAC;AAAA;AAAA,UACC,WAAU;AAAA,UACV,SAAS;AAAA,UAER,mBACC,oBAAC,SAAM,MAAM,IAAI,WAAU,iBAAgB,IAE3C,oBAAC,aAAU,MAAM,IAAI,WAAU,iBAAgB;AAAA;AAAA,MAEnD;AAAA,OAEJ;AAAA,KACF;AAEJ;","names":[]}
+{"version":3,"sources":["../../../src/components/layouts/AppMobileNavBar.tsx"],"sourcesContent":["\"use client\";\n\nimport { ReactNode } from \"react\";\nimport Image from \"next/image\";\nimport { IconMenu2, IconX } from \"@tabler/icons-react\";\nimport { ProfilePopover } from \"./ProfilePopover\";\nimport { useMobileNavbarSheet } from \"../../store/useMobileNavbarSheet\";\nimport { useIsDefaultWhitelabel } from \"../../providers/whitelabel.provider\";\nimport type { ProfileMenuItem } from \"./ProfilePopover\";\n\nexport interface AppMobileNavBarProps {\n  /** Which app is currently active — controls which icon gets the indicator */\n  activeApp?: \"gapps\" | \"gpages\";\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  menuItems?: ProfileMenuItem[];\n  showMenuToggle?: boolean;\n}\n\nexport function AppMobileNavBar({\n  activeApp,\n  onAppIconClick,\n  extraLeftSlot,\n  menuItems = [],\n  showMenuToggle = true,\n}: AppMobileNavBarProps) {\n  const { isOpen, toggle } = useMobileNavbarSheet();\n  const isDefaultWl = useIsDefaultWhitelabel();\n\n  const isGpagesActive = activeApp === \"gpages\";\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        <div className=\"relative\">\n          <div\n            className={`size-10 rounded-lg flex items-center justify-center transition-colors ${\n              isGpagesActive\n                ? isDefaultWl\n                  ? \"bg-cyan-100 border-2 border-white ring-2 ring-cyan-300\"\n                  : \"border-2 border-white ring-2 ring-zinc-300 bg-zinc-100\"\n                : onAppIconClick ? \"cursor-pointer hover:bg-gray-100\" : \"\"\n            }`}\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        </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          menuItems={menuItems}\n        />\n        {showMenuToggle && (\n          <button\n            className=\"size-10 flex items-center justify-center border border-zinc-200 rounded-lg bg-white cursor-pointer\"\n            onClick={toggle}\n          >\n            {isOpen ? (\n              <IconX size={18} className=\"text-zinc-950\" />\n            ) : (\n              <IconMenu2 size={18} className=\"text-zinc-950\" />\n            )}\n          </button>\n        )}\n      </div>\n    </div>\n  );\n}\n"],"mappings":";AAmCM,SAYM,KAZN;AAhCN,OAAO,WAAW;AAClB,SAAS,WAAW,aAAa;AACjC,SAAS,sBAAsB;AAC/B,SAAS,4BAA4B;AACrC,SAAS,8BAA8B;AAchC,SAAS,gBAAgB;AAAA,EAC9B;AAAA,EACA;AAAA,EACA;AAAA,EACA,YAAY,CAAC;AAAA,EACb,iBAAiB;AACnB,GAAyB;AACvB,QAAM,EAAE,QAAQ,OAAO,IAAI,qBAAqB;AAChD,QAAM,cAAc,uBAAuB;AAE3C,QAAM,iBAAiB,cAAc;AAErC,SACE,qBAAC,SAAI,WAAU,qHACb;AAAA,yBAAC,SAAI,WAAU,6BACb;AAAA,0BAAC,SAAI,WAAU,YACb;AAAA,QAAC;AAAA;AAAA,UACC,WAAW,yEACT,iBACI,cACE,2DACA,2DACF,iBAAiB,qCAAqC,EAC5D;AAAA,UACA,SAAS;AAAA,UAET;AAAA,YAAC;AAAA;AAAA,cACC,KAAI;AAAA,cACJ,KAAI;AAAA,cACJ,OAAO;AAAA,cACP,QAAQ;AAAA;AAAA,UACV;AAAA;AAAA,MACF,GACF;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;AAAA;AAAA,MACF;AAAA,MACC,kBACC;AAAA,QAAC;AAAA;AAAA,UACC,WAAU;AAAA,UACV,SAAS;AAAA,UAER,mBACC,oBAAC,SAAM,MAAM,IAAI,WAAU,iBAAgB,IAE3C,oBAAC,aAAU,MAAM,IAAI,WAAU,iBAAgB;AAAA;AAAA,MAEnD;AAAA,OAEJ;AAAA,KACF;AAEJ;","names":[]}

package/dist/components/layouts/NavBar.mjs

@@ -5,7 +5,7 @@ import { IconChevronRight } from "@tabler/icons-react";
 import { Separator } from "../ui/data-display/Separator";
 import { Tooltip, TooltipContent, TooltipTrigger } from "../ui/overlay/Tooltip";
 import { useDesktopSidebarStore, useDesktopSidebarHydration } from "../../store/useDesktopSidebarStore";
-import { useWhitelabel } from "../../providers/whitelabel.provider";
+import { useWhitelabel, useIsDefaultWhitelabel } from "../../providers/whitelabel.provider";
 import { cn } from "../../infra/utils/clsx";
 function NavBar({
   onLogoClick,
@@ -19,7 +19,7 @@ function NavBar({
   const { isExpanded: isDesktopExpanded, toggle: toggleDesktop } = useDesktopSidebarStore();
   useDesktopSidebarHydration();
   const { whitelabel } = useWhitelabel();
-  const isDefaultWl = !whitelabel || whitelabel.id === 1;
+  const isDefaultWl = useIsDefaultWhitelabel();
   const primaryColor = whitelabel?.general?.primary_color;
   const wlName = whitelabel?.name || "Great";
   return /* @__PURE__ */ jsxs(

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/layouts/NavBar.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport Image from \"next/image\";\nimport { IconChevronRight } from \"@tabler/icons-react\";\nimport { Separator } from \"../ui/data-display/Separator\";\nimport { Tooltip, TooltipContent, TooltipTrigger } from \"../ui/overlay/Tooltip\";\nimport { useDesktopSidebarStore, useDesktopSidebarHydration } from \"../../store/useDesktopSidebarStore\";\nimport { useWhitelabel } from \"../../providers/whitelabel.provider\";\nimport { cn } from \"../../infra/utils/clsx\";\n\ntype NavBarProps = {\n  onLogoClick: () => void;\n  onAppIconClick?: () => void;\n  activeApp?: \"gapps\" | \"gpages\";\n  showExpandButton?: boolean;\n  onExpandClick?: () => void;\n  children?: React.ReactNode;\n  className?: string;\n};\n\nfunction NavBar({\n  onLogoClick,\n  onAppIconClick,\n  activeApp,\n  showExpandButton = false,\n  onExpandClick,\n  children,\n  className,\n}: NavBarProps) {\n  const { isExpanded: isDesktopExpanded, toggle: toggleDesktop } =\n    useDesktopSidebarStore();\n  useDesktopSidebarHydration();\n  const { whitelabel } = useWhitelabel();\n  const isDefaultWl = !whitelabel || whitelabel.id === 1;\n  const primaryColor = whitelabel?.general?.primary_color;\n  const wlName = whitelabel?.name || 'Great';\n\n  return (\n    <div\n      className={cn(\n        \"hidden md:flex flex-col justify-between h-screen p-4 border-r border-gray-200 overflow-visible z-40 bg-white\",\n        className,\n      )}\n    >\n      <div className=\"flex flex-col gap-4 items-center mt-[6.5px]\">\n        {/* GreatApps logo */}\n        <div className=\"relative\">\n          <Tooltip>\n            <TooltipTrigger\n              className=\"cursor-pointer\"\n              asChild\n              onClick={onLogoClick}\n            >\n              {isDefaultWl ? (\n                <Image\n                  src=\"/icons/great-icon.svg\"\n                  alt=\"Great Icon\"\n                  width={28}\n                  height={28}\n                />\n              ) : (\n                <div\n                  className={cn(\"size-10 rounded-lg flex items-center justify-center transition-opacity duration-300\", activeApp !== \"gapps\" && \"opacity-20\")}\n                  style={{ backgroundColor: primaryColor }}\n                >\n                  <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"white\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\">\n                    <path d=\"M4 5a1 1 0 0 1 1 -1h4a1 1 0 0 1 1 1v4a1 1 0 0 1 -1 1h-4a1 1 0 0 1 -1 -1l0 -4\" />\n                    <path d=\"M14 5a1 1 0 0 1 1 -1h4a1 1 0 0 1 1 1v4a1 1 0 0 1 -1 1h-4a1 1 0 0 1 -1 -1l0 -4\" />\n                    <path d=\"M4 15a1 1 0 0 1 1 -1h4a1 1 0 0 1 1 1v4a1 1 0 0 1 -1 1h-4a1 1 0 0 1 -1 -1l0 -4\" />\n                    <path d=\"M14 15a1 1 0 0 1 1 -1h4a1 1 0 0 1 1 1v4a1 1 0 0 1 -1 1h-4a1 1 0 0 1 -1 -1l0 -4\" />\n                  </svg>\n                </div>\n              )}\n            </TooltipTrigger>\n            <TooltipContent side=\"right\">{wlName}</TooltipContent>\n          </Tooltip>\n          <div\n            className={cn(\n              \"absolute -left-[22px] top-1/2 -translate-y-1/2 z-10 w-[3px] h-5 rounded-r-xl transition-opacity duration-300\",\n              isDefaultWl ? \"bg-gray-950\" : \"\",\n              activeApp === \"gapps\" ? \"opacity-100\" : \"opacity-0\",\n            )}\n            style={!isDefaultWl ? { backgroundColor: primaryColor } : undefined}\n          />\n        </div>\n\n        <div className=\"relative w-full mt-[7.5px]\">\n          <Separator />\n          {/* Md expand button */}\n          {showExpandButton && (\n            <Tooltip>\n              <TooltipTrigger asChild>\n                <button\n                  onClick={onExpandClick}\n                  className=\"hidden md:flex lg:hidden absolute top-1/2 -translate-y-1/2 right-0 translate-x-[calc(50%+1rem)] size-8 items-center justify-center rounded-full border border-gray-200 bg-white hover:bg-gray-100 cursor-pointer transition-colors z-10\"\n                >\n                  <IconChevronRight size={16} className=\"text-gray-500\" />\n                </button>\n              </TooltipTrigger>\n              <TooltipContent side=\"right\">Expandir menu</TooltipContent>\n            </Tooltip>\n          )}\n          {/* Desktop expand button */}\n          {!isDesktopExpanded && (\n            <Tooltip>\n              <TooltipTrigger asChild>\n                <button\n                  onClick={toggleDesktop}\n                  className=\"hidden lg:flex absolute top-1/2 -translate-y-1/2 right-0 translate-x-[calc(50%+1rem)] size-8 items-center justify-center rounded-full border border-gray-200 bg-white hover:bg-gray-100 cursor-pointer transition-colors z-10\"\n                >\n                  <IconChevronRight size={16} className=\"text-gray-500\" />\n                </button>\n              </TooltipTrigger>\n              <TooltipContent side=\"right\">Expandir menu</TooltipContent>\n            </Tooltip>\n          )}\n        </div>\n\n        {/* GreatPages icon */}\n        <div className=\"relative\">\n          <Tooltip>\n            <TooltipTrigger asChild onClick={onAppIconClick}>\n              <div\n                className={cn(\n                  \"size-10 rounded-lg cursor-pointer flex items-center justify-center border-2 ring-2 transition-colors duration-300\",\n                  activeApp === \"gpages\"\n                    ? isDefaultWl\n                      ? \"bg-cyan-100 border-white ring-cyan-300\"\n                      : \"border-white ring-transparent\"\n                    : isDefaultWl\n                      ? \"hover:bg-gray-100 border-transparent ring-transparent\"\n                      : \"border-transparent ring-transparent\",\n                )}\n                style={!isDefaultWl ? { backgroundColor: primaryColor, boxShadow: activeApp === \"gpages\" ? `0 0 0 2px ${primaryColor}40` : undefined, opacity: activeApp !== \"gpages\" ? 0.2 : undefined } : undefined}\n              >\n                {isDefaultWl ? (\n                  <Image\n                    src=\"/icons/icon-navbar.svg\"\n                    alt=\"GreatPages\"\n                    width={24}\n                    height={24}\n                  />\n                ) : (\n                  <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"white\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\">\n                    <path d=\"M4 8h16\" />\n                    <path d=\"M4 6a2 2 0 0 1 2 -2h12a2 2 0 0 1 2 2v12a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2l0 -12\" />\n                    <path d=\"M8 4v4\" />\n                  </svg>\n                )}\n              </div>\n            </TooltipTrigger>\n            <TooltipContent side=\"right\">{isDefaultWl ? 'GreatPages' : 'Páginas'}</TooltipContent>\n          </Tooltip>\n          <div\n            className={cn(\n              \"absolute -left-4 top-1/2 -translate-y-1/2 z-10 w-[3px] h-5 rounded-r-xl transition-opacity duration-300\",\n              isDefaultWl ? \"bg-cyan-300\" : \"\",\n              activeApp === \"gpages\" ? \"opacity-100\" : \"opacity-0\",\n            )}\n            style={!isDefaultWl ? { backgroundColor: primaryColor } : undefined}\n          />\n        </div>\n      </div>\n\n      <div className=\"flex flex-col items-center gap-2\">{children}</div>\n    </div>\n  );\n}\n\nexport { NavBar };\nexport type { NavBarProps };\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../../src/components/layouts/NavBar.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport Image from \"next/image\";\nimport { IconChevronRight } from \"@tabler/icons-react\";\nimport { Separator } from \"../ui/data-display/Separator\";\nimport { Tooltip, TooltipContent, TooltipTrigger } from \"../ui/overlay/Tooltip\";\nimport { useDesktopSidebarStore, useDesktopSidebarHydration } from \"../../store/useDesktopSidebarStore\";\nimport { useWhitelabel, useIsDefaultWhitelabel } from \"../../providers/whitelabel.provider\";\nimport { cn } from \"../../infra/utils/clsx\";\n\ntype NavBarProps = {\n  onLogoClick: () => void;\n  onAppIconClick?: () => void;\n  activeApp?: \"gapps\" | \"gpages\";\n  showExpandButton?: boolean;\n  onExpandClick?: () => void;\n  children?: React.ReactNode;\n  className?: string;\n};\n\nfunction NavBar({\n  onLogoClick,\n  onAppIconClick,\n  activeApp,\n  showExpandButton = false,\n  onExpandClick,\n  children,\n  className,\n}: NavBarProps) {\n  const { isExpanded: isDesktopExpanded, toggle: toggleDesktop } =\n    useDesktopSidebarStore();\n  useDesktopSidebarHydration();\n  const { whitelabel } = useWhitelabel();\n  const isDefaultWl = useIsDefaultWhitelabel();\n  const primaryColor = whitelabel?.general?.primary_color;\n  const wlName = whitelabel?.name || 'Great';\n\n  return (\n    <div\n      className={cn(\n        \"hidden md:flex flex-col justify-between h-screen p-4 border-r border-gray-200 overflow-visible z-40 bg-white\",\n        className,\n      )}\n    >\n      <div className=\"flex flex-col gap-4 items-center mt-[6.5px]\">\n        {/* GreatApps logo */}\n        <div className=\"relative\">\n          <Tooltip>\n            <TooltipTrigger\n              className=\"cursor-pointer\"\n              asChild\n              onClick={onLogoClick}\n            >\n              {isDefaultWl ? (\n                <Image\n                  src=\"/icons/great-icon.svg\"\n                  alt=\"Great Icon\"\n                  width={28}\n                  height={28}\n                />\n              ) : (\n                <div\n                  className={cn(\"size-10 rounded-lg flex items-center justify-center transition-opacity duration-300\", activeApp !== \"gapps\" && \"opacity-20\")}\n                  style={{ backgroundColor: primaryColor }}\n                >\n                  <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"white\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\">\n                    <path d=\"M4 5a1 1 0 0 1 1 -1h4a1 1 0 0 1 1 1v4a1 1 0 0 1 -1 1h-4a1 1 0 0 1 -1 -1l0 -4\" />\n                    <path d=\"M14 5a1 1 0 0 1 1 -1h4a1 1 0 0 1 1 1v4a1 1 0 0 1 -1 1h-4a1 1 0 0 1 -1 -1l0 -4\" />\n                    <path d=\"M4 15a1 1 0 0 1 1 -1h4a1 1 0 0 1 1 1v4a1 1 0 0 1 -1 1h-4a1 1 0 0 1 -1 -1l0 -4\" />\n                    <path d=\"M14 15a1 1 0 0 1 1 -1h4a1 1 0 0 1 1 1v4a1 1 0 0 1 -1 1h-4a1 1 0 0 1 -1 -1l0 -4\" />\n                  </svg>\n                </div>\n              )}\n            </TooltipTrigger>\n            <TooltipContent side=\"right\">{wlName}</TooltipContent>\n          </Tooltip>\n          <div\n            className={cn(\n              \"absolute -left-[22px] top-1/2 -translate-y-1/2 z-10 w-[3px] h-5 rounded-r-xl transition-opacity duration-300\",\n              isDefaultWl ? \"bg-gray-950\" : \"\",\n              activeApp === \"gapps\" ? \"opacity-100\" : \"opacity-0\",\n            )}\n            style={!isDefaultWl ? { backgroundColor: primaryColor } : undefined}\n          />\n        </div>\n\n        <div className=\"relative w-full mt-[7.5px]\">\n          <Separator />\n          {/* Md expand button */}\n          {showExpandButton && (\n            <Tooltip>\n              <TooltipTrigger asChild>\n                <button\n                  onClick={onExpandClick}\n                  className=\"hidden md:flex lg:hidden absolute top-1/2 -translate-y-1/2 right-0 translate-x-[calc(50%+1rem)] size-8 items-center justify-center rounded-full border border-gray-200 bg-white hover:bg-gray-100 cursor-pointer transition-colors z-10\"\n                >\n                  <IconChevronRight size={16} className=\"text-gray-500\" />\n                </button>\n              </TooltipTrigger>\n              <TooltipContent side=\"right\">Expandir menu</TooltipContent>\n            </Tooltip>\n          )}\n          {/* Desktop expand button */}\n          {!isDesktopExpanded && (\n            <Tooltip>\n              <TooltipTrigger asChild>\n                <button\n                  onClick={toggleDesktop}\n                  className=\"hidden lg:flex absolute top-1/2 -translate-y-1/2 right-0 translate-x-[calc(50%+1rem)] size-8 items-center justify-center rounded-full border border-gray-200 bg-white hover:bg-gray-100 cursor-pointer transition-colors z-10\"\n                >\n                  <IconChevronRight size={16} className=\"text-gray-500\" />\n                </button>\n              </TooltipTrigger>\n              <TooltipContent side=\"right\">Expandir menu</TooltipContent>\n            </Tooltip>\n          )}\n        </div>\n\n        {/* GreatPages icon */}\n        <div className=\"relative\">\n          <Tooltip>\n            <TooltipTrigger asChild onClick={onAppIconClick}>\n              <div\n                className={cn(\n                  \"size-10 rounded-lg cursor-pointer flex items-center justify-center border-2 ring-2 transition-colors duration-300\",\n                  activeApp === \"gpages\"\n                    ? isDefaultWl\n                      ? \"bg-cyan-100 border-white ring-cyan-300\"\n                      : \"border-white ring-transparent\"\n                    : isDefaultWl\n                      ? \"hover:bg-gray-100 border-transparent ring-transparent\"\n                      : \"border-transparent ring-transparent\",\n                )}\n                style={!isDefaultWl ? { backgroundColor: primaryColor, boxShadow: activeApp === \"gpages\" ? `0 0 0 2px ${primaryColor}40` : undefined, opacity: activeApp !== \"gpages\" ? 0.2 : undefined } : undefined}\n              >\n                {isDefaultWl ? (\n                  <Image\n                    src=\"/icons/icon-navbar.svg\"\n                    alt=\"GreatPages\"\n                    width={24}\n                    height={24}\n                  />\n                ) : (\n                  <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"white\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\">\n                    <path d=\"M4 8h16\" />\n                    <path d=\"M4 6a2 2 0 0 1 2 -2h12a2 2 0 0 1 2 2v12a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2l0 -12\" />\n                    <path d=\"M8 4v4\" />\n                  </svg>\n                )}\n              </div>\n            </TooltipTrigger>\n            <TooltipContent side=\"right\">{isDefaultWl ? 'GreatPages' : 'Páginas'}</TooltipContent>\n          </Tooltip>\n          <div\n            className={cn(\n              \"absolute -left-4 top-1/2 -translate-y-1/2 z-10 w-[3px] h-5 rounded-r-xl transition-opacity duration-300\",\n              isDefaultWl ? \"bg-cyan-300\" : \"\",\n              activeApp === \"gpages\" ? \"opacity-100\" : \"opacity-0\",\n            )}\n            style={!isDefaultWl ? { backgroundColor: primaryColor } : undefined}\n          />\n        </div>\n      </div>\n\n      <div className=\"flex flex-col items-center gap-2\">{children}</div>\n    </div>\n  );\n}\n\nexport { NavBar };\nexport type { NavBarProps };\n"],"mappings":"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","names":[]}

package/dist/components/layouts/NotificationsPopover.mjs

@@ -8,6 +8,7 @@ import { Button } from "../ui/buttons/Button";
 import NotificationCard from "../widgets/notifications/NotificationCard";
 import { cn } from "../../infra/utils/clsx";
 import { useMessages, useMarkAllMessagesAsRead } from "../../modules/users/hooks/messages.hook";
+import { useIsDefaultWhitelabel } from "../../providers/whitelabel.provider";
 import { formatDistanceToNow } from "date-fns";
 import { ptBR } from "date-fns/locale";
 function NotificationsPopover({
@@ -15,8 +16,10 @@ function NotificationsPopover({
   side,
   align,
   contentClassName,
-  badgeClassName = "bg-cyan-300"
+  badgeClassName
 }) {
+  const isDefaultWl = useIsDefaultWhitelabel();
+  const resolvedBadgeClassName = badgeClassName ?? (isDefaultWl ? "bg-cyan-300" : "bg-zinc-300");
   const [open, setOpen] = useState(false);
   const { data: messagesData } = useMessages({ type: "notification", readed: true, limit: 5 });
   const { mutate: markAllAsRead } = useMarkAllMessagesAsRead();
@@ -40,7 +43,7 @@ function NotificationsPopover({
             {
               className: cn(
                 "absolute top-0.5 right-0.5 size-3.5 rounded-full border-2 border-white",
-                badgeClassName
+                resolvedBadgeClassName
               )
             }
           )

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/layouts/NotificationsPopover.tsx"],"sourcesContent":["\"use client\";\n\nimport { useState } from \"react\";\nimport { IconBell } from '@tabler/icons-react';\nimport * as PopoverPrimitive from \"@radix-ui/react-popover\";\nimport { Popover } from \"../ui/overlay/Popover\";\nimport { Button } from \"../ui/buttons/Button\";\nimport NotificationCard from \"../widgets/notifications/NotificationCard\";\nimport { cn } from \"../../infra/utils/clsx\";\nimport { useMessages, useMarkAllMessagesAsRead } from \"../../modules/users/hooks/messages.hook\";\nimport { formatDistanceToNow } from \"date-fns\";\nimport { ptBR } from \"date-fns/locale\";\n\nexport interface NotificationsPopoverProps {\n  onViewAll?: () => void;\n  side?: \"top\" | \"bottom\" | \"left\" | \"right\";\n  align?: \"start\" | \"center\" | \"end\";\n  contentClassName?: string;\n  badgeClassName?: string;\n}\n\nfunction NotificationsPopover({\n  onViewAll,\n  side,\n  align,\n  contentClassName,\n  badgeClassName = \"bg-cyan-300\",\n}: NotificationsPopoverProps) {\n  const [open, setOpen] = useState(false);\n  const { data: messagesData } = useMessages({ type: 'notification', readed: true, limit: 5 });\n  const { mutate: markAllAsRead } = useMarkAllMessagesAsRead();\n\n  const messages = messagesData?.data ?? [];\n  const totalUnread = messagesData?.totalUnread ?? 0;\n\n  const handleOpenChange = (isOpen: boolean) => {\n    setOpen(isOpen);\n    if (isOpen && totalUnread > 0) {\n      markAllAsRead();\n    }\n  };\n\n  return (\n    <Popover open={open} onOpenChange={handleOpenChange}>\n      <PopoverPrimitive.Trigger className=\"cursor-pointer\">\n        <div\n          className={`relative rounded-full p-2.5 ${open ? \"bg-gray-100\" : \"hover:bg-gray-100\"}`}\n        >\n          <IconBell size={20} className=\"text-gray-500\" />\n          {totalUnread > 0 && (\n            <span\n              className={cn(\n                \"absolute top-0.5 right-0.5 size-3.5 rounded-full border-2 border-white\",\n                badgeClassName,\n              )}\n            />\n          )}\n        </div>\n      </PopoverPrimitive.Trigger>\n      <PopoverPrimitive.Portal>\n        <PopoverPrimitive.Content\n          className={cn(\n            \"absolute bottom-2 left-[26px] z-[9999] w-[308px] p-0 pt-4 bg-white rounded-2xl shadow-md border border-gray-200\",\n            contentClassName,\n          )}\n          side={side}\n          align={align}\n          sideOffset={8}\n        >\n          <span className=\"paragraph-small-semibold text-gray-950 px-4\">\n            Últimas notificações\n          </span>\n\n          {messages.length > 0 ? (\n            messages.map((message, index) => (\n              <NotificationCard\n                key={message.id}\n                icon={<IconBell size={16} />}\n                iconBgColor=\"bg-gray-100\"\n                title={message.subject}\n                time={formatDistanceToNow(new Date(message.datetime_add), {\n                  addSuffix: true,\n                  locale: ptBR,\n                })}\n                gapPx={6}\n                showBorder={index < messages.length - 1}\n              />\n            ))\n          ) : (\n            <div className=\"flex flex-col items-center gap-4 pt-[41.5px] pb-[33.5px]\">\n              <div className=\"bg-gray-50 rounded-md p-2.5\">\n                <IconBell size={20} color=\"var(--color-gray-950)\" />\n              </div>\n              <span className=\"paragraph-small-medium text-gray-950\">\n                Sem notificações por enquanto\n              </span>\n            </div>\n          )}\n\n          {onViewAll && (\n            <Button\n              variant=\"secondary\"\n              className=\"h-8! mt-2 mb-4 mx-4 paragraph-small-semibold\"\n              onClick={onViewAll}\n            >\n              Todas as notificações\n            </Button>\n          )}\n        </PopoverPrimitive.Content>\n      </PopoverPrimitive.Portal>\n    </Popover>\n  );\n}\n\nexport { NotificationsPopover };\n"],"mappings":";AA6CQ,SAGE,KAHF;AA3CR,SAAS,gBAAgB;AACzB,SAAS,gBAAgB;AACzB,YAAY,sBAAsB;AAClC,SAAS,eAAe;AACxB,SAAS,cAAc;AACvB,OAAO,sBAAsB;AAC7B,SAAS,UAAU;AACnB,SAAS,aAAa,gCAAgC;AACtD,SAAS,2BAA2B;AACpC,SAAS,YAAY;AAUrB,SAAS,qBAAqB;AAAA,EAC5B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,iBAAiB;AACnB,GAA8B;AAC5B,QAAM,CAAC,MAAM,OAAO,IAAI,SAAS,KAAK;AACtC,QAAM,EAAE,MAAM,aAAa,IAAI,YAAY,EAAE,MAAM,gBAAgB,QAAQ,MAAM,OAAO,EAAE,CAAC;AAC3F,QAAM,EAAE,QAAQ,cAAc,IAAI,yBAAyB;AAE3D,QAAM,WAAW,cAAc,QAAQ,CAAC;AACxC,QAAM,cAAc,cAAc,eAAe;AAEjD,QAAM,mBAAmB,CAAC,WAAoB;AAC5C,YAAQ,MAAM;AACd,QAAI,UAAU,cAAc,GAAG;AAC7B,oBAAc;AAAA,IAChB;AAAA,EACF;AAEA,SACE,qBAAC,WAAQ,MAAY,cAAc,kBACjC;AAAA,wBAAC,iBAAiB,SAAjB,EAAyB,WAAU,kBAClC;AAAA,MAAC;AAAA;AAAA,QACC,WAAW,+BAA+B,OAAO,gBAAgB,mBAAmB;AAAA,QAEpF;AAAA,8BAAC,YAAS,MAAM,IAAI,WAAU,iBAAgB;AAAA,UAC7C,cAAc,KACb;AAAA,YAAC;AAAA;AAAA,cACC,WAAW;AAAA,gBACT;AAAA,gBACA;AAAA,cACF;AAAA;AAAA,UACF;AAAA;AAAA;AAAA,IAEJ,GACF;AAAA,IACA,oBAAC,iBAAiB,QAAjB,EACC;AAAA,MAAC,iBAAiB;AAAA,MAAjB;AAAA,QACC,WAAW;AAAA,UACT;AAAA,UACA;AAAA,QACF;AAAA,QACA;AAAA,QACA;AAAA,QACA,YAAY;AAAA,QAEZ;AAAA,8BAAC,UAAK,WAAU,+CAA8C,2CAE9D;AAAA,UAEC,SAAS,SAAS,IACjB,SAAS,IAAI,CAAC,SAAS,UACrB;AAAA,YAAC;AAAA;AAAA,cAEC,MAAM,oBAAC,YAAS,MAAM,IAAI;AAAA,cAC1B,aAAY;AAAA,cACZ,OAAO,QAAQ;AAAA,cACf,MAAM,oBAAoB,IAAI,KAAK,QAAQ,YAAY,GAAG;AAAA,gBACxD,WAAW;AAAA,gBACX,QAAQ;AAAA,cACV,CAAC;AAAA,cACD,OAAO;AAAA,cACP,YAAY,QAAQ,SAAS,SAAS;AAAA;AAAA,YATjC,QAAQ;AAAA,UAUf,CACD,IAED,qBAAC,SAAI,WAAU,4DACb;AAAA,gCAAC,SAAI,WAAU,+BACb,8BAAC,YAAS,MAAM,IAAI,OAAM,yBAAwB,GACpD;AAAA,YACA,oBAAC,UAAK,WAAU,wCAAuC,iDAEvD;AAAA,aACF;AAAA,UAGD,aACC;AAAA,YAAC;AAAA;AAAA,cACC,SAAQ;AAAA,cACR,WAAU;AAAA,cACV,SAAS;AAAA,cACV;AAAA;AAAA,UAED;AAAA;AAAA;AAAA,IAEJ,GACF;AAAA,KACF;AAEJ;","names":[]}
+{"version":3,"sources":["../../../src/components/layouts/NotificationsPopover.tsx"],"sourcesContent":["\"use client\";\n\nimport { useState } from \"react\";\nimport { IconBell } from '@tabler/icons-react';\nimport * as PopoverPrimitive from \"@radix-ui/react-popover\";\nimport { Popover } from \"../ui/overlay/Popover\";\nimport { Button } from \"../ui/buttons/Button\";\nimport NotificationCard from \"../widgets/notifications/NotificationCard\";\nimport { cn } from \"../../infra/utils/clsx\";\nimport { useMessages, useMarkAllMessagesAsRead } from \"../../modules/users/hooks/messages.hook\";\nimport { useIsDefaultWhitelabel } from \"../../providers/whitelabel.provider\";\nimport { formatDistanceToNow } from \"date-fns\";\nimport { ptBR } from \"date-fns/locale\";\n\nexport interface NotificationsPopoverProps {\n  onViewAll?: () => void;\n  side?: \"top\" | \"bottom\" | \"left\" | \"right\";\n  align?: \"start\" | \"center\" | \"end\";\n  contentClassName?: string;\n  badgeClassName?: string;\n}\n\nfunction NotificationsPopover({\n  onViewAll,\n  side,\n  align,\n  contentClassName,\n  badgeClassName,\n}: NotificationsPopoverProps) {\n  const isDefaultWl = useIsDefaultWhitelabel();\n  const resolvedBadgeClassName = badgeClassName ?? (isDefaultWl ? \"bg-cyan-300\" : \"bg-zinc-300\");\n  const [open, setOpen] = useState(false);\n  const { data: messagesData } = useMessages({ type: 'notification', readed: true, limit: 5 });\n  const { mutate: markAllAsRead } = useMarkAllMessagesAsRead();\n\n  const messages = messagesData?.data ?? [];\n  const totalUnread = messagesData?.totalUnread ?? 0;\n\n  const handleOpenChange = (isOpen: boolean) => {\n    setOpen(isOpen);\n    if (isOpen && totalUnread > 0) {\n      markAllAsRead();\n    }\n  };\n\n  return (\n    <Popover open={open} onOpenChange={handleOpenChange}>\n      <PopoverPrimitive.Trigger className=\"cursor-pointer\">\n        <div\n          className={`relative rounded-full p-2.5 ${open ? \"bg-gray-100\" : \"hover:bg-gray-100\"}`}\n        >\n          <IconBell size={20} className=\"text-gray-500\" />\n          {totalUnread > 0 && (\n            <span\n              className={cn(\n                \"absolute top-0.5 right-0.5 size-3.5 rounded-full border-2 border-white\",\n                resolvedBadgeClassName,\n              )}\n            />\n          )}\n        </div>\n      </PopoverPrimitive.Trigger>\n      <PopoverPrimitive.Portal>\n        <PopoverPrimitive.Content\n          className={cn(\n            \"absolute bottom-2 left-[26px] z-[9999] w-[308px] p-0 pt-4 bg-white rounded-2xl shadow-md border border-gray-200\",\n            contentClassName,\n          )}\n          side={side}\n          align={align}\n          sideOffset={8}\n        >\n          <span className=\"paragraph-small-semibold text-gray-950 px-4\">\n            Últimas notificações\n          </span>\n\n          {messages.length > 0 ? (\n            messages.map((message, index) => (\n              <NotificationCard\n                key={message.id}\n                icon={<IconBell size={16} />}\n                iconBgColor=\"bg-gray-100\"\n                title={message.subject}\n                time={formatDistanceToNow(new Date(message.datetime_add), {\n                  addSuffix: true,\n                  locale: ptBR,\n                })}\n                gapPx={6}\n                showBorder={index < messages.length - 1}\n              />\n            ))\n          ) : (\n            <div className=\"flex flex-col items-center gap-4 pt-[41.5px] pb-[33.5px]\">\n              <div className=\"bg-gray-50 rounded-md p-2.5\">\n                <IconBell size={20} color=\"var(--color-gray-950)\" />\n              </div>\n              <span className=\"paragraph-small-medium text-gray-950\">\n                Sem notificações por enquanto\n              </span>\n            </div>\n          )}\n\n          {onViewAll && (\n            <Button\n              variant=\"secondary\"\n              className=\"h-8! mt-2 mb-4 mx-4 paragraph-small-semibold\"\n              onClick={onViewAll}\n            >\n              Todas as notificações\n            </Button>\n          )}\n        </PopoverPrimitive.Content>\n      </PopoverPrimitive.Portal>\n    </Popover>\n  );\n}\n\nexport { NotificationsPopover };\n"],"mappings":";AAgDQ,SAGE,KAHF;AA9CR,SAAS,gBAAgB;AACzB,SAAS,gBAAgB;AACzB,YAAY,sBAAsB;AAClC,SAAS,eAAe;AACxB,SAAS,cAAc;AACvB,OAAO,sBAAsB;AAC7B,SAAS,UAAU;AACnB,SAAS,aAAa,gCAAgC;AACtD,SAAS,8BAA8B;AACvC,SAAS,2BAA2B;AACpC,SAAS,YAAY;AAUrB,SAAS,qBAAqB;AAAA,EAC5B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAA8B;AAC5B,QAAM,cAAc,uBAAuB;AAC3C,QAAM,yBAAyB,mBAAmB,cAAc,gBAAgB;AAChF,QAAM,CAAC,MAAM,OAAO,IAAI,SAAS,KAAK;AACtC,QAAM,EAAE,MAAM,aAAa,IAAI,YAAY,EAAE,MAAM,gBAAgB,QAAQ,MAAM,OAAO,EAAE,CAAC;AAC3F,QAAM,EAAE,QAAQ,cAAc,IAAI,yBAAyB;AAE3D,QAAM,WAAW,cAAc,QAAQ,CAAC;AACxC,QAAM,cAAc,cAAc,eAAe;AAEjD,QAAM,mBAAmB,CAAC,WAAoB;AAC5C,YAAQ,MAAM;AACd,QAAI,UAAU,cAAc,GAAG;AAC7B,oBAAc;AAAA,IAChB;AAAA,EACF;AAEA,SACE,qBAAC,WAAQ,MAAY,cAAc,kBACjC;AAAA,wBAAC,iBAAiB,SAAjB,EAAyB,WAAU,kBAClC;AAAA,MAAC;AAAA;AAAA,QACC,WAAW,+BAA+B,OAAO,gBAAgB,mBAAmB;AAAA,QAEpF;AAAA,8BAAC,YAAS,MAAM,IAAI,WAAU,iBAAgB;AAAA,UAC7C,cAAc,KACb;AAAA,YAAC;AAAA;AAAA,cACC,WAAW;AAAA,gBACT;AAAA,gBACA;AAAA,cACF;AAAA;AAAA,UACF;AAAA;AAAA;AAAA,IAEJ,GACF;AAAA,IACA,oBAAC,iBAAiB,QAAjB,EACC;AAAA,MAAC,iBAAiB;AAAA,MAAjB;AAAA,QACC,WAAW;AAAA,UACT;AAAA,UACA;AAAA,QACF;AAAA,QACA;AAAA,QACA;AAAA,QACA,YAAY;AAAA,QAEZ;AAAA,8BAAC,UAAK,WAAU,+CAA8C,2CAE9D;AAAA,UAEC,SAAS,SAAS,IACjB,SAAS,IAAI,CAAC,SAAS,UACrB;AAAA,YAAC;AAAA;AAAA,cAEC,MAAM,oBAAC,YAAS,MAAM,IAAI;AAAA,cAC1B,aAAY;AAAA,cACZ,OAAO,QAAQ;AAAA,cACf,MAAM,oBAAoB,IAAI,KAAK,QAAQ,YAAY,GAAG;AAAA,gBACxD,WAAW;AAAA,gBACX,QAAQ;AAAA,cACV,CAAC;AAAA,cACD,OAAO;AAAA,cACP,YAAY,QAAQ,SAAS,SAAS;AAAA;AAAA,YATjC,QAAQ;AAAA,UAUf,CACD,IAED,qBAAC,SAAI,WAAU,4DACb;AAAA,gCAAC,SAAI,WAAU,+BACb,8BAAC,YAAS,MAAM,IAAI,OAAM,yBAAwB,GACpD;AAAA,YACA,oBAAC,UAAK,WAAU,wCAAuC,iDAEvD;AAAA,aACF;AAAA,UAGD,aACC;AAAA,YAAC;AAAA;AAAA,cACC,SAAQ;AAAA,cACR,WAAU;AAAA,cACV,SAAS;AAAA,cACV;AAAA;AAAA,UAED;AAAA;AAAA;AAAA,IAEJ,GACF;AAAA,KACF;AAEJ;","names":[]}

package/dist/components/layouts/ProfilePopover.mjs

@@ -11,7 +11,7 @@ import { NavBarItem } from "./NavBarItem";
 import { UserAvatar } from "../ui/data-display/UserAvatar";
 import { LoadingOverlay } from "../ui/feedback/LoadingOverlay";
 import { useAuth } from "../../providers/auth.provider";
-import { useWhitelabelUrls } from "../../providers/whitelabel.provider";
+import { useIsDefaultWhitelabel, useWhitelabelUrls } from "../../providers/whitelabel.provider";
 import { cn } from "../../infra/utils/clsx";
 import { useIaCredits } from "../../modules/ia-credits/hooks/ia-credits.hook";
 import { useBuyCreditsModal } from "../../store/useBuyCreditsModal";
@@ -26,6 +26,7 @@ function ProfilePopover({
   const [popoverOpen, setPopoverOpen] = useState(false);
   const { summary, subscription, isSubscriptionLoading, isCreditsLoading } = useIaCredits();
   const { openModal: openBuyCreditsModal } = useBuyCreditsModal();
+  const isDefaultWl = useIsDefaultWhitelabel();
   const { accountsUrl } = useWhitelabelUrls();
   const router = useRouter();
   const handleLogout = async () => {
@@ -35,7 +36,7 @@ function ProfilePopover({
   };
   const hasSubscription = !isSubscriptionLoading && subscription !== null;
   const isApiPlan = hasSubscription && subscription.id_plan === 411;
-  const shouldShowCredits = hasSubscription && subscription.id_wl === 1 && !isApiPlan;
+  const shouldShowCredits = hasSubscription && isDefaultWl && !isApiPlan;
   const creditsPercentage = shouldShowCredits && summary.totalCredits > 0 ? summary.usedCredits / summary.totalCredits * 100 : 0;
   return /* @__PURE__ */ jsxs(Fragment, { children: [
     /* @__PURE__ */ jsx(

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/layouts/ProfilePopover.tsx"],"sourcesContent":["\"use client\";\n\nimport { useState } from \"react\";\nimport { useRouter } from \"next/navigation\";\nimport * as PopoverPrimitive from \"@radix-ui/react-popover\";\nimport { Popover } from \"../ui/overlay/Popover\";\nimport { Button } from \"../ui/buttons/Button\";\nimport { Progress } from \"../ui/feedback/Progress\";\nimport { Separator } from \"../ui/data-display/Separator\";\nimport { NavBarItem } from \"./NavBarItem\";\nimport { UserAvatar } from \"../ui/data-display/UserAvatar\";\nimport { LoadingOverlay } from \"../ui/feedback/LoadingOverlay\";\nimport { useAuth } from \"../../providers/auth.provider\";\nimport { useWhitelabelUrls } from \"../../providers/whitelabel.provider\";\nimport { cn } from \"../../infra/utils/clsx\";\nimport { useIaCredits } from \"../../modules/ia-credits/hooks/ia-credits.hook\";\nimport { useBuyCreditsModal } from \"../../store/useBuyCreditsModal\";\n\nexport interface ProfileMenuItem {\n  icon?: React.ReactNode;\n  label: string;\n  onClick: () => void;\n}\n\nexport interface ProfilePopoverProps {\n  side?: \"top\" | \"bottom\" | \"left\" | \"right\";\n  align?: \"start\" | \"center\" | \"end\";\n  contentClassName?: string;\n  menuItems?: ProfileMenuItem[];\n}\n\nfunction ProfilePopover({\n  side = \"top\",\n  align = \"start\",\n  contentClassName = \"absolute bottom-2 left-[26px]\",\n  menuItems = [],\n}: ProfilePopoverProps) {\n  const { user, logout } = useAuth();\n  const [isLoggingOut, setIsLoggingOut] = useState(false);\n  const [popoverOpen, setPopoverOpen] = useState(false);\n\n  const { summary, subscription, isSubscriptionLoading, isCreditsLoading } =\n    useIaCredits();\n  const { openModal: openBuyCreditsModal } = useBuyCreditsModal();\n  const { accountsUrl } = useWhitelabelUrls();\n  const router = useRouter();\n\n  const handleLogout = async () => {\n    setPopoverOpen(false);\n    setIsLoggingOut(true);\n    await logout();\n  };\n\n  const hasSubscription = !isSubscriptionLoading && subscription !== null;\n\n  const isApiPlan = hasSubscription && subscription.id_plan === 411;\n  const shouldShowCredits = hasSubscription && subscription.id_wl === 1 && !isApiPlan;\n  const creditsPercentage =\n    shouldShowCredits && summary.totalCredits > 0\n      ? (summary.usedCredits / summary.totalCredits) * 100\n      : 0;\n\n  return (\n    <>\n      <LoadingOverlay\n        isLoading={isLoggingOut}\n        message=\"Saindo da sua conta...\"\n      />\n      <Popover open={popoverOpen} onOpenChange={setPopoverOpen}>\n        <PopoverPrimitive.Trigger className=\"cursor-pointer\">\n          {user && (\n            <UserAvatar\n              key={user.id}\n              photo={user.photo}\n              name={user.name}\n              size={40}\n            />\n          )}\n        </PopoverPrimitive.Trigger>\n\n        <PopoverPrimitive.Portal>\n          <PopoverPrimitive.Content\n            className={cn(\n              \"w-64.75 p-0 bg-white rounded-2xl shadow-md border border-gray-200 z-99\",\n              contentClassName,\n            )}\n            side={side}\n            align={align}\n            sideOffset={8}\n          >\n            <div className=\"grid grid-cols-[32px_1fr_auto] items-center gap-3 p-3 w-full\">\n              {user && (\n                <UserAvatar\n                  key={user.id}\n                  photo={user.photo}\n                  name={user.name}\n                  size={32}\n                />\n              )}\n\n              <div className=\"flex flex-col gap-0.5 min-w-0\">\n                <span className=\"paragraph-small-semibold text-gray-950 truncate\">\n                  {user?.name || \"\"}\n                </span>\n                <span className=\"paragraph-xsmall-medium text-gray-500 truncate\">\n                  {user?.email || \"\"}\n                </span>\n              </div>\n\n              <Button\n                variant=\"secondary\"\n                className=\"h-8! px-3! paragraph-xsmall-semibold\"\n                onClick={() => {\n                  const isSameOrigin = accountsUrl.startsWith(window.location.origin);\n                  if (isSameOrigin) {\n                    setPopoverOpen(false);\n                    router.push(`${window.location.pathname}?openProfile=true`);\n                  } else {\n                    window.location.href = `${accountsUrl}?openProfile=true`;\n                  }\n                }}\n              >\n                Editar\n              </Button>\n            </div>\n\n            <div className=\"flex flex-col gap-2 border-t border-gray-200 rounded-2xl p-1.5\">\n              {shouldShowCredits && (\n                <div\n                  className={cn(\n                    \"flex flex-col bg-gray-950 rounded-lg gap-4 w-full p-4 transition-colors\",\n                    \"cursor-pointer hover:bg-gray-950/90\",\n                  )}\n                  onClick={() => openBuyCreditsModal()}\n                >\n                  <div className=\"flex items-center justify-between gap-2\">\n                    <span className=\"paragraph-xsmall-semibold text-white truncate\">\n                      Créditos usados\n                    </span>\n                    <span className=\"paragraph-xsmall-medium text-white/50\">\n                      {summary.usedCredits.toLocaleString(\"pt-BR\")}/\n                      {summary.totalCredits.toLocaleString(\"pt-BR\")}\n                    </span>\n                  </div>\n                  <Progress\n                    className=\"bg-white/10\"\n                    indicatorColor=\"bg-white\"\n                    value={creditsPercentage}\n                  />\n                </div>\n              )}\n\n              <div className=\"flex flex-col gap-2\">\n                <div className=\"flex flex-col\">\n                  {menuItems.map((item, index) => (\n                    <NavBarItem\n                      key={index}\n                      icon={item.icon}\n                      label={item.label}\n                      onClick={item.onClick}\n                    />\n                  ))}\n                </div>\n                <Separator />\n                <NavBarItem label=\"Sair\" onClick={handleLogout} />\n              </div>\n            </div>\n          </PopoverPrimitive.Content>\n        </PopoverPrimitive.Portal>\n      </Popover>\n    </>\n  );\n}\n\nexport { ProfilePopover };\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../../src/components/layouts/ProfilePopover.tsx"],"sourcesContent":["\"use client\";\n\nimport { useState } from \"react\";\nimport { useRouter } from \"next/navigation\";\nimport * as PopoverPrimitive from \"@radix-ui/react-popover\";\nimport { Popover } from \"../ui/overlay/Popover\";\nimport { Button } from \"../ui/buttons/Button\";\nimport { Progress } from \"../ui/feedback/Progress\";\nimport { Separator } from \"../ui/data-display/Separator\";\nimport { NavBarItem } from \"./NavBarItem\";\nimport { UserAvatar } from \"../ui/data-display/UserAvatar\";\nimport { LoadingOverlay } from \"../ui/feedback/LoadingOverlay\";\nimport { useAuth } from \"../../providers/auth.provider\";\nimport { useIsDefaultWhitelabel, useWhitelabelUrls } from \"../../providers/whitelabel.provider\";\nimport { cn } from \"../../infra/utils/clsx\";\nimport { useIaCredits } from \"../../modules/ia-credits/hooks/ia-credits.hook\";\nimport { useBuyCreditsModal } from \"../../store/useBuyCreditsModal\";\n\nexport interface ProfileMenuItem {\n  icon?: React.ReactNode;\n  label: string;\n  onClick: () => void;\n}\n\nexport interface ProfilePopoverProps {\n  side?: \"top\" | \"bottom\" | \"left\" | \"right\";\n  align?: \"start\" | \"center\" | \"end\";\n  contentClassName?: string;\n  menuItems?: ProfileMenuItem[];\n}\n\nfunction ProfilePopover({\n  side = \"top\",\n  align = \"start\",\n  contentClassName = \"absolute bottom-2 left-[26px]\",\n  menuItems = [],\n}: ProfilePopoverProps) {\n  const { user, logout } = useAuth();\n  const [isLoggingOut, setIsLoggingOut] = useState(false);\n  const [popoverOpen, setPopoverOpen] = useState(false);\n\n  const { summary, subscription, isSubscriptionLoading, isCreditsLoading } =\n    useIaCredits();\n  const { openModal: openBuyCreditsModal } = useBuyCreditsModal();\n  const isDefaultWl = useIsDefaultWhitelabel();\n  const { accountsUrl } = useWhitelabelUrls();\n  const router = useRouter();\n\n  const handleLogout = async () => {\n    setPopoverOpen(false);\n    setIsLoggingOut(true);\n    await logout();\n  };\n\n  const hasSubscription = !isSubscriptionLoading && subscription !== null;\n\n  const isApiPlan = hasSubscription && subscription.id_plan === 411;\n  const shouldShowCredits = hasSubscription && isDefaultWl && !isApiPlan;\n  const creditsPercentage =\n    shouldShowCredits && summary.totalCredits > 0\n      ? (summary.usedCredits / summary.totalCredits) * 100\n      : 0;\n\n  return (\n    <>\n      <LoadingOverlay\n        isLoading={isLoggingOut}\n        message=\"Saindo da sua conta...\"\n      />\n      <Popover open={popoverOpen} onOpenChange={setPopoverOpen}>\n        <PopoverPrimitive.Trigger className=\"cursor-pointer\">\n          {user && (\n            <UserAvatar\n              key={user.id}\n              photo={user.photo}\n              name={user.name}\n              size={40}\n            />\n          )}\n        </PopoverPrimitive.Trigger>\n\n        <PopoverPrimitive.Portal>\n          <PopoverPrimitive.Content\n            className={cn(\n              \"w-64.75 p-0 bg-white rounded-2xl shadow-md border border-gray-200 z-99\",\n              contentClassName,\n            )}\n            side={side}\n            align={align}\n            sideOffset={8}\n          >\n            <div className=\"grid grid-cols-[32px_1fr_auto] items-center gap-3 p-3 w-full\">\n              {user && (\n                <UserAvatar\n                  key={user.id}\n                  photo={user.photo}\n                  name={user.name}\n                  size={32}\n                />\n              )}\n\n              <div className=\"flex flex-col gap-0.5 min-w-0\">\n                <span className=\"paragraph-small-semibold text-gray-950 truncate\">\n                  {user?.name || \"\"}\n                </span>\n                <span className=\"paragraph-xsmall-medium text-gray-500 truncate\">\n                  {user?.email || \"\"}\n                </span>\n              </div>\n\n              <Button\n                variant=\"secondary\"\n                className=\"h-8! px-3! paragraph-xsmall-semibold\"\n                onClick={() => {\n                  const isSameOrigin = accountsUrl.startsWith(window.location.origin);\n                  if (isSameOrigin) {\n                    setPopoverOpen(false);\n                    router.push(`${window.location.pathname}?openProfile=true`);\n                  } else {\n                    window.location.href = `${accountsUrl}?openProfile=true`;\n                  }\n                }}\n              >\n                Editar\n              </Button>\n            </div>\n\n            <div className=\"flex flex-col gap-2 border-t border-gray-200 rounded-2xl p-1.5\">\n              {shouldShowCredits && (\n                <div\n                  className={cn(\n                    \"flex flex-col bg-gray-950 rounded-lg gap-4 w-full p-4 transition-colors\",\n                    \"cursor-pointer hover:bg-gray-950/90\",\n                  )}\n                  onClick={() => openBuyCreditsModal()}\n                >\n                  <div className=\"flex items-center justify-between gap-2\">\n                    <span className=\"paragraph-xsmall-semibold text-white truncate\">\n                      Créditos usados\n                    </span>\n                    <span className=\"paragraph-xsmall-medium text-white/50\">\n                      {summary.usedCredits.toLocaleString(\"pt-BR\")}/\n                      {summary.totalCredits.toLocaleString(\"pt-BR\")}\n                    </span>\n                  </div>\n                  <Progress\n                    className=\"bg-white/10\"\n                    indicatorColor=\"bg-white\"\n                    value={creditsPercentage}\n                  />\n                </div>\n              )}\n\n              <div className=\"flex flex-col gap-2\">\n                <div className=\"flex flex-col\">\n                  {menuItems.map((item, index) => (\n                    <NavBarItem\n                      key={index}\n                      icon={item.icon}\n                      label={item.label}\n                      onClick={item.onClick}\n                    />\n                  ))}\n                </div>\n                <Separator />\n                <NavBarItem label=\"Sair\" onClick={handleLogout} />\n              </div>\n            </div>\n          </PopoverPrimitive.Content>\n        </PopoverPrimitive.Portal>\n      </Popover>\n    </>\n  );\n}\n\nexport { ProfilePopover };\n"],"mappings":"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","names":[]}

package/dist/components/modals/BuyCreditsModal.mjs

@@ -24,6 +24,7 @@ import { useActiveSubscription } from "../../modules/subscriptions/hooks/find-ac
 import { useCalculateSubscription } from "../../modules/subscriptions/hooks/calculate-subscription.hook";
 import { useUpdateSubscriptionPlan } from "../../modules/subscriptions/hooks/update-subscription-plan.hook";
 import { getPriceFromCalculatedData } from "../../modules/subscriptions/utils/periodicity";
+import { useIsDefaultWhitelabel } from "../../providers/whitelabel.provider";
 import { IconInfoCircle, IconX, IconLoader2 } from "@tabler/icons-react";
 import { useCallback, useEffect, useMemo, useRef } from "react";
 import { useForm } from "react-hook-form";
@@ -39,6 +40,7 @@ const buyCreditSchema = z.object({
 function BuyCreditsModal() {
   const { open, closeModal } = useBuyCreditsModal();
   const { openModal } = useModalManager();
+  const isDefaultWl = useIsDefaultWhitelabel();
   const { data: cardsData } = useCards();
   const { data: subscriptionData } = useActiveSubscription();
   const subscription = subscriptionData?.data?.[0] ?? null;
@@ -238,7 +240,7 @@ function BuyCreditsModal() {
                       onOpenAddCard: handleOpenAddCardModal
                     }
                   ),
-                  hasChanged && /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3 p-4 bg-cyan-50 rounded-lg", children: [
+                  hasChanged && /* @__PURE__ */ jsxs("div", { className: `flex items-center gap-3 p-4 rounded-lg ${isDefaultWl ? "bg-cyan-50" : "bg-zinc-50"}`, children: [
                     /* @__PURE__ */ jsx(IconInfoCircle, { className: "size-4 text-zinc-950 shrink-0" }),
                     /* @__PURE__ */ jsx("span", { className: "paragraph-small-regular text-zinc-950", children: isIncreasingCredits ? "O pagamento ser\xE1 processado no momento da confirma\xE7\xE3o." : "As altera\xE7\xF5es entrar\xE3o em vigor a partir da sua pr\xF3xima fatura." })
                   ] })