@greatapps/common 1.1.336 → 1.1.338

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -18,7 +18,7 @@ function ConfigurationsMyAccountModal() {
18
18
  className: cn(
19
19
  "flex flex-col p-0 gap-0 max-w-full sm:max-w-full overflow-x-hidden border-0",
20
20
  "rounded-t-2xl rounded-b-none h-[100dvh] top-0 bottom-0 left-0 right-0 translate-x-0 translate-y-0",
21
- "lg:w-[700px] lg:max-w-[700px] lg:h-auto lg:rounded-lg lg:border",
21
+ "lg:w-[650px] lg:max-w-[650px] lg:h-auto lg:rounded-lg lg:border",
22
22
  "lg:top-[50%] lg:bottom-auto lg:left-[50%] lg:right-auto lg:translate-x-[-50%] lg:translate-y-[-50%]"
23
23
  ),
24
24
  children: [
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/account/ConfigurationsMyAccountModal.tsx"],"sourcesContent":["'use client';\n\nimport { IconX } from '@tabler/icons-react';\nimport { Dialog, DialogContent, DialogHeader, DialogTitle } from '../ui/overlay/Dialog';\nimport { cn } from '../../infra/utils/clsx';\nimport { PreferencesSection } from './sections/PreferencesSection';\nimport useIsMobile from '../../hooks/useIsMobile';\nimport { useAccountModals } from '../../store/useAccountModals';\n\nexport default function ConfigurationsMyAccountModal() {\n const { activeModal, close } = useAccountModals();\n\n const open = activeModal === 'configurations';\n const isMobile = useIsMobile();\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={cn(\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:w-[700px] lg:max-w-[700px] lg:h-auto 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 >\n <DialogHeader className=\"sr-only\">\n <DialogTitle>Preferências</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\">Preferências</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 <PreferencesSection onClose={close} />\n </DialogContent>\n </Dialog>\n );\n}\n"],"mappings":";AA4BU,cAEF,YAFE;AA1BV,SAAS,aAAa;AACtB,SAAS,QAAQ,eAAe,cAAc,mBAAmB;AACjE,SAAS,UAAU;AACnB,SAAS,0BAA0B;AACnC,OAAO,iBAAiB;AACxB,SAAS,wBAAwB;AAElB,SAAR,+BAAgD;AACrD,QAAM,EAAE,aAAa,MAAM,IAAI,iBAAiB;AAEhD,QAAM,OAAO,gBAAgB;AAC7B,QAAM,WAAW,YAAY;AAE7B,SACE,oBAAC,UAAO,MAAY,cAAc,OAChC;AAAA,IAAC;AAAA;AAAA,MACC,iBAAiB,CAAC;AAAA,MAClB,kBAAiB;AAAA,MACjB,WAAW;AAAA,QACT;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACF;AAAA,MAEA;AAAA,4BAAC,gBAAa,WAAU,WACtB,8BAAC,eAAY,6BAAY,GAC3B;AAAA,QACA,qBAAC,SAAI,WAAU,kFACb;AAAA,8BAAC,UAAK,WAAU,2CAA0C,6BAAY;AAAA,UACtE;AAAA,YAAC;AAAA;AAAA,cACC,MAAK;AAAA,cACL,WAAU;AAAA,cACV,SAAS;AAAA,cAET,8BAAC,SAAM,MAAM,IAAI;AAAA;AAAA,UACnB;AAAA,WACF;AAAA,QACA,oBAAC,sBAAmB,SAAS,OAAO;AAAA;AAAA;AAAA,EACtC,GACF;AAEJ;","names":[]}
1
+ {"version":3,"sources":["../../../src/components/account/ConfigurationsMyAccountModal.tsx"],"sourcesContent":["'use client';\n\nimport { IconX } from '@tabler/icons-react';\nimport { Dialog, DialogContent, DialogHeader, DialogTitle } from '../ui/overlay/Dialog';\nimport { cn } from '../../infra/utils/clsx';\nimport { PreferencesSection } from './sections/PreferencesSection';\nimport useIsMobile from '../../hooks/useIsMobile';\nimport { useAccountModals } from '../../store/useAccountModals';\n\nexport default function ConfigurationsMyAccountModal() {\n const { activeModal, close } = useAccountModals();\n\n const open = activeModal === 'configurations';\n const isMobile = useIsMobile();\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={cn(\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:w-[650px] lg:max-w-[650px] lg:h-auto 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 >\n <DialogHeader className=\"sr-only\">\n <DialogTitle>Preferências</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\">Preferências</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 <PreferencesSection onClose={close} />\n </DialogContent>\n </Dialog>\n );\n}\n"],"mappings":";AA4BU,cAEF,YAFE;AA1BV,SAAS,aAAa;AACtB,SAAS,QAAQ,eAAe,cAAc,mBAAmB;AACjE,SAAS,UAAU;AACnB,SAAS,0BAA0B;AACnC,OAAO,iBAAiB;AACxB,SAAS,wBAAwB;AAElB,SAAR,+BAAgD;AACrD,QAAM,EAAE,aAAa,MAAM,IAAI,iBAAiB;AAEhD,QAAM,OAAO,gBAAgB;AAC7B,QAAM,WAAW,YAAY;AAE7B,SACE,oBAAC,UAAO,MAAY,cAAc,OAChC;AAAA,IAAC;AAAA;AAAA,MACC,iBAAiB,CAAC;AAAA,MAClB,kBAAiB;AAAA,MACjB,WAAW;AAAA,QACT;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACF;AAAA,MAEA;AAAA,4BAAC,gBAAa,WAAU,WACtB,8BAAC,eAAY,6BAAY,GAC3B;AAAA,QACA,qBAAC,SAAI,WAAU,kFACb;AAAA,8BAAC,UAAK,WAAU,2CAA0C,6BAAY;AAAA,UACtE;AAAA,YAAC;AAAA;AAAA,cACC,MAAK;AAAA,cACL,WAAU;AAAA,cACV,SAAS;AAAA,cAET,8BAAC,SAAM,MAAM,IAAI;AAAA;AAAA,UACnB;AAAA,WACF;AAAA,QACA,oBAAC,sBAAmB,SAAS,OAAO;AAAA;AAAA;AAAA,EACtC,GACF;AAEJ;","names":[]}
@@ -1,6 +1,6 @@
1
1
  "use client";
2
2
  import { jsx, jsxs } from "react/jsx-runtime";
3
- import { IconArrowLeft, IconX, IconCopy, IconRefresh } from "@tabler/icons-react";
3
+ import { IconX, IconCopy, IconRefresh } from "@tabler/icons-react";
4
4
  import { Button } from "../ui/buttons/Button";
5
5
  import { Dialog, DialogContent, DialogHeader, DialogTitle } from "../ui/overlay/Dialog";
6
6
  import { Separator } from "../ui/data-display/Separator";
@@ -92,16 +92,6 @@ function TwoFactorAuthModal({ open, onClose, onSuccess }) {
92
92
  children: [
93
93
  /* @__PURE__ */ jsx(DialogHeader, { className: "sr-only", children: /* @__PURE__ */ jsx(DialogTitle, { children: "Autentica\xE7\xE3o de dois fatores" }) }),
94
94
  /* @__PURE__ */ jsxs("div", { className: "shrink-0 flex items-center justify-center px-4 py-3 relative border-b border-gray-200 lg:border-b-0", children: [
95
- /* @__PURE__ */ jsx(
96
- Button,
97
- {
98
- type: "button",
99
- variant: "ghost",
100
- className: "size-8! p-0 absolute left-4",
101
- onClick: handleClose,
102
- children: /* @__PURE__ */ jsx(IconArrowLeft, { size: 20 })
103
- }
104
- ),
105
95
  /* @__PURE__ */ jsx("span", { className: "paragraph-medium-semibold text-gray-950 text-center", children: "Autentica\xE7\xE3o de dois fatores" }),
106
96
  /* @__PURE__ */ jsx(
107
97
  Button,
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/account/TwoFactorAuthModal.tsx"],"sourcesContent":["'use client';\n\nimport { IconArrowLeft, IconX, IconCopy, IconRefresh } 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 useTwoFactorAuthForm from './hooks/useTwoFactorAuthForm';\n\ninterface TwoFactorAuthModalProps {\n open: boolean;\n onClose: () => void;\n onSuccess?: () => void;\n}\n\nexport default function TwoFactorAuthModal({ open, onClose, onSuccess }: TwoFactorAuthModalProps) {\n const {\n code,\n setCode,\n isCodeComplete,\n isGenerating,\n isConfirming,\n generateFailed,\n retryGenerate,\n qrcode,\n backupCodes,\n step,\n handleSubmit,\n handleFinalize,\n handleCopyCodes,\n resetForm,\n } = useTwoFactorAuthForm({ onSuccess, open });\n\n const handleClose = () => {\n resetForm();\n onClose();\n };\n\n if (step === 'recovery') {\n return (\n <Dialog open={open} onOpenChange={handleClose}>\n <DialogContent\n showCloseButton={false}\n overlayClassName=\"z-[1010]\"\n className=\"z-[1011] flex flex-col p-0 gap-0 max-w-full sm:max-w-full border-0 rounded-t-2xl rounded-b-none h-[100dvh] top-0 bottom-0 left-0 right-0 translate-x-0 translate-y-0 lg:max-w-[470px] 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%]\"\n >\n <DialogHeader className=\"sr-only\">\n <DialogTitle>Códigos de segurança</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 Códigos de segurança\n </span>\n <Button\n type=\"button\"\n variant=\"ghost\"\n className=\"size-8! p-0 absolute right-4\"\n onClick={handleClose}\n >\n <IconX size={18} />\n </Button>\n </div>\n\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-2\">\n <h3 className=\"paragraph-medium-semibold text-gray-950 max-w-[269px]\">\n Salve estes códigos de recuperação de emergência\n </h3>\n <div className=\"paragraph-small-regular text-gray-600\">\n <p>\n Se você perder acesso ao seu telefone, não será possível fazer login em sua conta\n sem um código de dois fatores.\n </p>\n <br />\n <p>Imprima, copie ou escreva em um local seguro os códigos abaixo.</p>\n </div>\n </div>\n\n <div className=\"bg-gray-50 rounded-lg p-4 flex flex-col gap-4\">\n <div className=\"paragraph-small-medium text-gray-950 whitespace-nowrap\">\n {backupCodes.map((backupCode, i) => (\n <p key={i}>{backupCode}</p>\n ))}\n </div>\n <Button\n type=\"button\"\n variant=\"secondary\"\n className=\"h-8! w-fit\"\n onClick={handleCopyCodes}\n >\n <IconCopy size={16} />\n Copiar códigos\n </Button>\n </div>\n </div>\n\n <div className=\"flex items-center p-4 lg:p-5 border-t border-gray-200 justify-between 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=\"button\" onClick={handleFinalize}>\n Finalizar\n </Button>\n </div>\n </DialogContent>\n </Dialog>\n );\n }\n\n return (\n <Dialog open={open} onOpenChange={handleClose}>\n <DialogContent\n showCloseButton={false}\n overlayClassName=\"z-[1010]\"\n className=\"z-[1011] flex flex-col p-0 gap-0 max-w-full sm:max-w-full border-0 rounded-t-2xl rounded-b-none h-[100dvh] top-0 bottom-0 left-0 right-0 translate-x-0 translate-y-0 lg:max-w-[470px] lg:h-auto lg:max-h-[90vh] 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%]\"\n >\n <DialogHeader className=\"sr-only\">\n <DialogTitle>Autenticação de dois fatores</DialogTitle>\n </DialogHeader>\n <div className=\"shrink-0 flex items-center justify-center px-4 py-3 relative border-b border-gray-200 lg:border-b-0\">\n <Button\n type=\"button\"\n variant=\"ghost\"\n className=\"size-8! p-0 absolute left-4\"\n onClick={handleClose}\n >\n <IconArrowLeft size={20} />\n </Button>\n <span className=\"paragraph-medium-semibold text-gray-950 text-center\">\n Autenticação de dois fatores\n </span>\n <Button\n type=\"button\"\n variant=\"ghost\"\n className=\"size-8! p-0 absolute right-4\"\n onClick={handleClose}\n >\n <IconX size={18} />\n </Button>\n </div>\n\n <form\n className=\"flex-1 min-h-0 flex flex-col\"\n onSubmit={(e) => {\n e.preventDefault();\n if (isCodeComplete) handleSubmit();\n }}\n >\n <div className=\"flex-1 min-h-0 overflow-y-auto overscroll-contain lg:overflow-visible\">\n <div className=\"flex flex-col items-center gap-4 lg:gap-8 px-4 lg:px-5 py-4 lg:py-6 pb-60 lg:pb-6\">\n <p className=\"paragraph-small-regular text-gray-950 text-center max-w-full lg:max-w-[412px]\">\n Instale um aplicativo autenticador no seu celular (ex.:{' '}\n <a\n href=\"https://support.google.com/accounts/answer/1066447\"\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n className=\"paragraph-small-medium underline\"\n >\n Google Authenticator\n </a>\n ), escaneie o QR Code ao lado ou copie a chave no aplicativo e, em seguida, digite o\n código de 6 dígitos gerado para continuar.\n </p>\n\n <div className=\"border border-gray-200 rounded-lg overflow-hidden p-2 lg:p-3 flex items-center justify-center w-[136px] h-[136px] lg:w-[203px] lg:h-[203px]\">\n {generateFailed ? (\n <button\n type=\"button\"\n onClick={() => retryGenerate()}\n className=\"flex flex-col items-center gap-1.5 text-center\"\n >\n <IconRefresh size={20} className=\"text-gray-400\" />\n <span className=\"paragraph-xsmall-medium text-gray-500\">Tentar novamente</span>\n </button>\n ) : isGenerating || !qrcode ? (\n <div className=\"skeleton w-full h-full rounded\" />\n ) : (\n // eslint-disable-next-line @next/next/no-img-element\n <img\n src={qrcode}\n alt=\"QR Code para autenticação de dois fatores\"\n className=\"w-full h-full\"\n />\n )}\n </div>\n\n <div className=\"flex items-center gap-3 w-full\">\n <Separator className=\"flex-1\" />\n <span className=\"paragraph-xsmall-medium text-gray-500 opacity-80 whitespace-nowrap\">\n Cole os 6 dígitos abaixo\n </span>\n <Separator className=\"flex-1\" />\n </div>\n\n <div className=\"scroll-mt-20\">\n <InputOTP maxLength={6} value={code} onChange={setCode}>\n <InputOTPGroup className=\"gap-2\">\n {Array.from({ length: 6 }).map((_, i) => (\n <InputOTPSlot\n key={i}\n index={i}\n className=\"w-11! lg:w-12! h-13! lg:h-14! rounded-lg! text-lg border-gray-200\"\n />\n ))}\n </InputOTPGroup>\n </InputOTP>\n </div>\n </div>\n </div>\n\n <div className=\"shrink-0 flex items-center p-4 lg:p-5 border-t border-gray-200 justify-between gap-2 bg-white\">\n <Button variant=\"secondary\" className=\"h-10!\" type=\"button\" onClick={handleClose}>\n Cancelar\n </Button>\n <Button type=\"submit\" className=\"h-10!\" disabled={!isCodeComplete || isConfirming}>\n {isConfirming ? 'Ativando...' : 'Ativar autenticação'}\n </Button>\n </div>\n </form>\n </DialogContent>\n </Dialog>\n );\n}\n"],"mappings":"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","names":[]}
1
+ {"version":3,"sources":["../../../src/components/account/TwoFactorAuthModal.tsx"],"sourcesContent":["'use client';\n\nimport { IconX, IconCopy, IconRefresh } 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 useTwoFactorAuthForm from './hooks/useTwoFactorAuthForm';\n\ninterface TwoFactorAuthModalProps {\n open: boolean;\n onClose: () => void;\n onSuccess?: () => void;\n}\n\nexport default function TwoFactorAuthModal({ open, onClose, onSuccess }: TwoFactorAuthModalProps) {\n const {\n code,\n setCode,\n isCodeComplete,\n isGenerating,\n isConfirming,\n generateFailed,\n retryGenerate,\n qrcode,\n backupCodes,\n step,\n handleSubmit,\n handleFinalize,\n handleCopyCodes,\n resetForm,\n } = useTwoFactorAuthForm({ onSuccess, open });\n\n const handleClose = () => {\n resetForm();\n onClose();\n };\n\n if (step === 'recovery') {\n return (\n <Dialog open={open} onOpenChange={handleClose}>\n <DialogContent\n showCloseButton={false}\n overlayClassName=\"z-[1010]\"\n className=\"z-[1011] flex flex-col p-0 gap-0 max-w-full sm:max-w-full border-0 rounded-t-2xl rounded-b-none h-[100dvh] top-0 bottom-0 left-0 right-0 translate-x-0 translate-y-0 lg:max-w-[470px] 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%]\"\n >\n <DialogHeader className=\"sr-only\">\n <DialogTitle>Códigos de segurança</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 Códigos de segurança\n </span>\n <Button\n type=\"button\"\n variant=\"ghost\"\n className=\"size-8! p-0 absolute right-4\"\n onClick={handleClose}\n >\n <IconX size={18} />\n </Button>\n </div>\n\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-2\">\n <h3 className=\"paragraph-medium-semibold text-gray-950 max-w-[269px]\">\n Salve estes códigos de recuperação de emergência\n </h3>\n <div className=\"paragraph-small-regular text-gray-600\">\n <p>\n Se você perder acesso ao seu telefone, não será possível fazer login em sua conta\n sem um código de dois fatores.\n </p>\n <br />\n <p>Imprima, copie ou escreva em um local seguro os códigos abaixo.</p>\n </div>\n </div>\n\n <div className=\"bg-gray-50 rounded-lg p-4 flex flex-col gap-4\">\n <div className=\"paragraph-small-medium text-gray-950 whitespace-nowrap\">\n {backupCodes.map((backupCode, i) => (\n <p key={i}>{backupCode}</p>\n ))}\n </div>\n <Button\n type=\"button\"\n variant=\"secondary\"\n className=\"h-8! w-fit\"\n onClick={handleCopyCodes}\n >\n <IconCopy size={16} />\n Copiar códigos\n </Button>\n </div>\n </div>\n\n <div className=\"flex items-center p-4 lg:p-5 border-t border-gray-200 justify-between 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=\"button\" onClick={handleFinalize}>\n Finalizar\n </Button>\n </div>\n </DialogContent>\n </Dialog>\n );\n }\n\n return (\n <Dialog open={open} onOpenChange={handleClose}>\n <DialogContent\n showCloseButton={false}\n overlayClassName=\"z-[1010]\"\n className=\"z-[1011] flex flex-col p-0 gap-0 max-w-full sm:max-w-full border-0 rounded-t-2xl rounded-b-none h-[100dvh] top-0 bottom-0 left-0 right-0 translate-x-0 translate-y-0 lg:max-w-[470px] lg:h-auto lg:max-h-[90vh] 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%]\"\n >\n <DialogHeader className=\"sr-only\">\n <DialogTitle>Autenticação de dois fatores</DialogTitle>\n </DialogHeader>\n <div className=\"shrink-0 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 Autenticação de dois fatores\n </span>\n <Button\n type=\"button\"\n variant=\"ghost\"\n className=\"size-8! p-0 absolute right-4\"\n onClick={handleClose}\n >\n <IconX size={18} />\n </Button>\n </div>\n\n <form\n className=\"flex-1 min-h-0 flex flex-col\"\n onSubmit={(e) => {\n e.preventDefault();\n if (isCodeComplete) handleSubmit();\n }}\n >\n <div className=\"flex-1 min-h-0 overflow-y-auto overscroll-contain lg:overflow-visible\">\n <div className=\"flex flex-col items-center gap-4 lg:gap-8 px-4 lg:px-5 py-4 lg:py-6 pb-60 lg:pb-6\">\n <p className=\"paragraph-small-regular text-gray-950 text-center max-w-full lg:max-w-[412px]\">\n Instale um aplicativo autenticador no seu celular (ex.:{' '}\n <a\n href=\"https://support.google.com/accounts/answer/1066447\"\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n className=\"paragraph-small-medium underline\"\n >\n Google Authenticator\n </a>\n ), escaneie o QR Code ao lado ou copie a chave no aplicativo e, em seguida, digite o\n código de 6 dígitos gerado para continuar.\n </p>\n\n <div className=\"border border-gray-200 rounded-lg overflow-hidden p-2 lg:p-3 flex items-center justify-center w-[136px] h-[136px] lg:w-[203px] lg:h-[203px]\">\n {generateFailed ? (\n <button\n type=\"button\"\n onClick={() => retryGenerate()}\n className=\"flex flex-col items-center gap-1.5 text-center\"\n >\n <IconRefresh size={20} className=\"text-gray-400\" />\n <span className=\"paragraph-xsmall-medium text-gray-500\">Tentar novamente</span>\n </button>\n ) : isGenerating || !qrcode ? (\n <div className=\"skeleton w-full h-full rounded\" />\n ) : (\n // eslint-disable-next-line @next/next/no-img-element\n <img\n src={qrcode}\n alt=\"QR Code para autenticação de dois fatores\"\n className=\"w-full h-full\"\n />\n )}\n </div>\n\n <div className=\"flex items-center gap-3 w-full\">\n <Separator className=\"flex-1\" />\n <span className=\"paragraph-xsmall-medium text-gray-500 opacity-80 whitespace-nowrap\">\n Cole os 6 dígitos abaixo\n </span>\n <Separator className=\"flex-1\" />\n </div>\n\n <div className=\"scroll-mt-20\">\n <InputOTP maxLength={6} value={code} onChange={setCode}>\n <InputOTPGroup className=\"gap-2\">\n {Array.from({ length: 6 }).map((_, i) => (\n <InputOTPSlot\n key={i}\n index={i}\n className=\"w-11! lg:w-12! h-13! lg:h-14! rounded-lg! text-lg border-gray-200\"\n />\n ))}\n </InputOTPGroup>\n </InputOTP>\n </div>\n </div>\n </div>\n\n <div className=\"shrink-0 flex items-center p-4 lg:p-5 border-t border-gray-200 justify-between gap-2 bg-white\">\n <Button variant=\"secondary\" className=\"h-10!\" type=\"button\" onClick={handleClose}>\n Cancelar\n </Button>\n <Button type=\"submit\" className=\"h-10!\" disabled={!isCodeComplete || isConfirming}>\n {isConfirming ? 'Ativando...' : 'Ativar autenticação'}\n </Button>\n </div>\n </form>\n </DialogContent>\n </Dialog>\n );\n}\n"],"mappings":"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","names":[]}
@@ -1,6 +1,6 @@
1
1
  "use client";
2
2
  import { jsx, jsxs } from "react/jsx-runtime";
3
- import { IconArrowLeft, IconLock } from "@tabler/icons-react";
3
+ import { IconLock, IconX } from "@tabler/icons-react";
4
4
  import { Button } from "../../ui/buttons/Button";
5
5
  import { FormField } from "../../ui/form/FormField";
6
6
  import useChangePasswordForm from "../hooks/useChangePasswordForm";
@@ -17,9 +17,9 @@ function ChangePasswordSection({ onBack }) {
17
17
  onSubmit: handleSubmit,
18
18
  className: "flex-1 overflow-y-auto px-4 pb-5 lg:p-5 flex flex-col h-full lg:h-full gap-5 lg:gap-6",
19
19
  children: [
20
- /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
21
- /* @__PURE__ */ jsx(Button, { type: "button", variant: "ghost", className: "size-8! p-0", onClick: onBack, children: /* @__PURE__ */ jsx(IconArrowLeft, { size: 20 }) }),
22
- /* @__PURE__ */ jsx("span", { className: "paragraph-medium-semibold text-gray-950", children: "Alterar senha" })
20
+ /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
21
+ /* @__PURE__ */ jsx("span", { className: "paragraph-medium-semibold text-gray-950", children: "Alterar senha" }),
22
+ /* @__PURE__ */ jsx(Button, { type: "button", variant: "ghost", className: "size-8! p-0", onClick: onBack, children: /* @__PURE__ */ jsx(IconX, { size: 18 }) })
23
23
  ] }),
24
24
  /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-4", children: [
25
25
  /* @__PURE__ */ jsx(
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../src/components/account/sections/ChangePasswordSection.tsx"],"sourcesContent":["'use client';\n\nimport { IconArrowLeft, IconLock } from '@tabler/icons-react';\nimport { Button } from '../../ui/buttons/Button';\nimport { FormField } from '../../ui/form/FormField';\nimport useChangePasswordForm from '../hooks/useChangePasswordForm';\nimport usePasswordVisibility from '../../../hooks/usePasswordVisibility';\n\ninterface ChangePasswordSectionProps {\n onBack: () => void;\n}\n\nexport function ChangePasswordSection({ onBack }: ChangePasswordSectionProps) {\n const { register, handleSubmit, errors } = useChangePasswordForm({\n onSuccess: onBack,\n });\n const { showPassword: showCurrentPw, togglePassword: toggleCurrentPw } = usePasswordVisibility();\n const { showPassword: showNewPw, togglePassword: toggleNewPw } = usePasswordVisibility();\n\n return (\n <form\n onSubmit={handleSubmit}\n className=\"flex-1 overflow-y-auto px-4 pb-5 lg:p-5 flex flex-col h-full lg:h-full gap-5 lg:gap-6\"\n >\n <div className=\"flex items-center gap-3\">\n <Button type=\"button\" variant=\"ghost\" className=\"size-8! p-0\" onClick={onBack}>\n <IconArrowLeft size={20} />\n </Button>\n <span className=\"paragraph-medium-semibold text-gray-950\">Alterar senha</span>\n </div>\n\n <div className=\"flex flex-col gap-4\">\n <FormField\n label=\"Senha atual\"\n type=\"password\"\n placeholder=\"Digite sua senha atual\"\n leftIcon={IconLock}\n error={!!errors.currentPassword}\n errorMessage={errors.currentPassword?.message}\n classnameContainer=\"h-10!\"\n showPassword={showCurrentPw}\n onTogglePassword={toggleCurrentPw}\n {...register('currentPassword')}\n />\n <FormField\n label=\"Nova senha\"\n type=\"password\"\n placeholder=\"Digite sua nova senha\"\n leftIcon={IconLock}\n error={!!errors.newPassword}\n errorMessage={errors.newPassword?.message}\n classnameContainer=\"h-10!\"\n showPassword={showNewPw}\n onTogglePassword={toggleNewPw}\n {...register('newPassword')}\n />\n </div>\n\n <Button type=\"submit\" className=\"w-fit h-10!\">\n Salvar nova senha\n </Button>\n </form>\n );\n}\n"],"mappings":";AAwBM,SAEI,KAFJ;AAtBN,SAAS,eAAe,gBAAgB;AACxC,SAAS,cAAc;AACvB,SAAS,iBAAiB;AAC1B,OAAO,2BAA2B;AAClC,OAAO,2BAA2B;AAM3B,SAAS,sBAAsB,EAAE,OAAO,GAA+B;AAC5E,QAAM,EAAE,UAAU,cAAc,OAAO,IAAI,sBAAsB;AAAA,IAC/D,WAAW;AAAA,EACb,CAAC;AACD,QAAM,EAAE,cAAc,eAAe,gBAAgB,gBAAgB,IAAI,sBAAsB;AAC/F,QAAM,EAAE,cAAc,WAAW,gBAAgB,YAAY,IAAI,sBAAsB;AAEvF,SACE;AAAA,IAAC;AAAA;AAAA,MACC,UAAU;AAAA,MACV,WAAU;AAAA,MAEV;AAAA,6BAAC,SAAI,WAAU,2BACb;AAAA,8BAAC,UAAO,MAAK,UAAS,SAAQ,SAAQ,WAAU,eAAc,SAAS,QACrE,8BAAC,iBAAc,MAAM,IAAI,GAC3B;AAAA,UACA,oBAAC,UAAK,WAAU,2CAA0C,2BAAa;AAAA,WACzE;AAAA,QAEA,qBAAC,SAAI,WAAU,uBACb;AAAA;AAAA,YAAC;AAAA;AAAA,cACC,OAAM;AAAA,cACN,MAAK;AAAA,cACL,aAAY;AAAA,cACZ,UAAU;AAAA,cACV,OAAO,CAAC,CAAC,OAAO;AAAA,cAChB,cAAc,OAAO,iBAAiB;AAAA,cACtC,oBAAmB;AAAA,cACnB,cAAc;AAAA,cACd,kBAAkB;AAAA,cACjB,GAAG,SAAS,iBAAiB;AAAA;AAAA,UAChC;AAAA,UACA;AAAA,YAAC;AAAA;AAAA,cACC,OAAM;AAAA,cACN,MAAK;AAAA,cACL,aAAY;AAAA,cACZ,UAAU;AAAA,cACV,OAAO,CAAC,CAAC,OAAO;AAAA,cAChB,cAAc,OAAO,aAAa;AAAA,cAClC,oBAAmB;AAAA,cACnB,cAAc;AAAA,cACd,kBAAkB;AAAA,cACjB,GAAG,SAAS,aAAa;AAAA;AAAA,UAC5B;AAAA,WACF;AAAA,QAEA,oBAAC,UAAO,MAAK,UAAS,WAAU,eAAc,+BAE9C;AAAA;AAAA;AAAA,EACF;AAEJ;","names":[]}
1
+ {"version":3,"sources":["../../../../src/components/account/sections/ChangePasswordSection.tsx"],"sourcesContent":["'use client';\n\nimport { IconLock, IconX } from '@tabler/icons-react';\nimport { Button } from '../../ui/buttons/Button';\nimport { FormField } from '../../ui/form/FormField';\nimport useChangePasswordForm from '../hooks/useChangePasswordForm';\nimport usePasswordVisibility from '../../../hooks/usePasswordVisibility';\n\ninterface ChangePasswordSectionProps {\n onBack: () => void;\n}\n\nexport function ChangePasswordSection({ onBack }: ChangePasswordSectionProps) {\n const { register, handleSubmit, errors } = useChangePasswordForm({\n onSuccess: onBack,\n });\n const { showPassword: showCurrentPw, togglePassword: toggleCurrentPw } = usePasswordVisibility();\n const { showPassword: showNewPw, togglePassword: toggleNewPw } = usePasswordVisibility();\n\n return (\n <form\n onSubmit={handleSubmit}\n className=\"flex-1 overflow-y-auto px-4 pb-5 lg:p-5 flex flex-col h-full lg:h-full gap-5 lg:gap-6\"\n >\n <div className=\"flex items-center justify-between\">\n <span className=\"paragraph-medium-semibold text-gray-950\">Alterar senha</span>\n <Button type=\"button\" variant=\"ghost\" className=\"size-8! p-0\" onClick={onBack}>\n <IconX size={18} />\n </Button>\n </div>\n\n <div className=\"flex flex-col gap-4\">\n <FormField\n label=\"Senha atual\"\n type=\"password\"\n placeholder=\"Digite sua senha atual\"\n leftIcon={IconLock}\n error={!!errors.currentPassword}\n errorMessage={errors.currentPassword?.message}\n classnameContainer=\"h-10!\"\n showPassword={showCurrentPw}\n onTogglePassword={toggleCurrentPw}\n {...register('currentPassword')}\n />\n <FormField\n label=\"Nova senha\"\n type=\"password\"\n placeholder=\"Digite sua nova senha\"\n leftIcon={IconLock}\n error={!!errors.newPassword}\n errorMessage={errors.newPassword?.message}\n classnameContainer=\"h-10!\"\n showPassword={showNewPw}\n onTogglePassword={toggleNewPw}\n {...register('newPassword')}\n />\n </div>\n\n <Button type=\"submit\" className=\"w-fit h-10!\">\n Salvar nova senha\n </Button>\n </form>\n );\n}\n"],"mappings":";AAwBM,SACE,KADF;AAtBN,SAAS,UAAU,aAAa;AAChC,SAAS,cAAc;AACvB,SAAS,iBAAiB;AAC1B,OAAO,2BAA2B;AAClC,OAAO,2BAA2B;AAM3B,SAAS,sBAAsB,EAAE,OAAO,GAA+B;AAC5E,QAAM,EAAE,UAAU,cAAc,OAAO,IAAI,sBAAsB;AAAA,IAC/D,WAAW;AAAA,EACb,CAAC;AACD,QAAM,EAAE,cAAc,eAAe,gBAAgB,gBAAgB,IAAI,sBAAsB;AAC/F,QAAM,EAAE,cAAc,WAAW,gBAAgB,YAAY,IAAI,sBAAsB;AAEvF,SACE;AAAA,IAAC;AAAA;AAAA,MACC,UAAU;AAAA,MACV,WAAU;AAAA,MAEV;AAAA,6BAAC,SAAI,WAAU,qCACb;AAAA,8BAAC,UAAK,WAAU,2CAA0C,2BAAa;AAAA,UACvE,oBAAC,UAAO,MAAK,UAAS,SAAQ,SAAQ,WAAU,eAAc,SAAS,QACrE,8BAAC,SAAM,MAAM,IAAI,GACnB;AAAA,WACF;AAAA,QAEA,qBAAC,SAAI,WAAU,uBACb;AAAA;AAAA,YAAC;AAAA;AAAA,cACC,OAAM;AAAA,cACN,MAAK;AAAA,cACL,aAAY;AAAA,cACZ,UAAU;AAAA,cACV,OAAO,CAAC,CAAC,OAAO;AAAA,cAChB,cAAc,OAAO,iBAAiB;AAAA,cACtC,oBAAmB;AAAA,cACnB,cAAc;AAAA,cACd,kBAAkB;AAAA,cACjB,GAAG,SAAS,iBAAiB;AAAA;AAAA,UAChC;AAAA,UACA;AAAA,YAAC;AAAA;AAAA,cACC,OAAM;AAAA,cACN,MAAK;AAAA,cACL,aAAY;AAAA,cACZ,UAAU;AAAA,cACV,OAAO,CAAC,CAAC,OAAO;AAAA,cAChB,cAAc,OAAO,aAAa;AAAA,cAClC,oBAAmB;AAAA,cACnB,cAAc;AAAA,cACd,kBAAkB;AAAA,cACjB,GAAG,SAAS,aAAa;AAAA;AAAA,UAC5B;AAAA,WACF;AAAA,QAEA,oBAAC,UAAO,MAAK,UAAS,WAAU,eAAc,+BAE9C;AAAA;AAAA;AAAA,EACF;AAEJ;","names":[]}
@@ -142,7 +142,7 @@ function PreferencesSection({ onClose }) {
142
142
  ] }),
143
143
  /* @__PURE__ */ jsx(Separator, {}),
144
144
  /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-4", children: [
145
- /* @__PURE__ */ jsx("span", { className: "paragraph-medium-semibold text-gray-600", children: "Exibi\xE7\xE3o hora" }),
145
+ /* @__PURE__ */ jsx("span", { className: "paragraph-medium-semibold text-gray-950", children: "Exibi\xE7\xE3o hora" }),
146
146
  /* @__PURE__ */ jsxs("div", { className: "flex flex-col lg:flex-row items-center gap-3", children: [
147
147
  /* @__PURE__ */ jsx(
148
148
  ComboboxField,
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../src/components/account/sections/PreferencesSection.tsx"],"sourcesContent":["'use client';\n\nimport { useState, useEffect } from 'react';\nimport { useForm } from 'react-hook-form';\nimport { toast } from 'sonner';\nimport { IconLock } from '@tabler/icons-react';\nimport { Button } from '../../ui/buttons/Button';\nimport { Separator } from '../../ui/data-display/Separator';\nimport { Toast } from '../../ui/feedback/Toast';\nimport { ComboboxField } from '../../ui/form/ComboboxField';\nimport { SelectField } from '../../ui/form/SelectField';\nimport ConfirmGlobalPreferencesModal from '../ConfirmGlobalPreferencesModal';\nimport { useAuth } from '../../../providers/auth.provider';\nimport { UserProfile } from '../../../modules/users/schema';\nimport type { UpdateAccountRequest } from '../../../modules/accounts/types';\nimport {\n useUpdateAccountUser,\n useUpdateAccount,\n} from '../../../modules/accounts/hooks/useAccountManagement';\nimport {\n LANGUAGE_OPTIONS,\n TIME_FORMAT_OPTIONS,\n} from '../constants';\nimport { useTimezones } from '../../../modules/accounts/hooks/useTimezones';\nimport { useCurrencies } from '../../../modules/accounts/hooks/useCurrencies';\n\ninterface PreferencesFormValues {\n language: string;\n currency: string;\n timezone: string;\n timeFormat: string;\n receive_sms: boolean;\n receive_email: boolean;\n}\n\ninterface PreferencesSectionProps {\n onClose: () => void;\n}\n\nexport function PreferencesSection({ onClose }: PreferencesSectionProps) {\n const { data: timezones = [] } = useTimezones();\n const { data: currencies = [] } = useCurrencies();\n const { user, account } = useAuth();\n const canEditPreferences =\n user?.profile === UserProfile.owner || user?.profile === UserProfile.admin;\n const updateAccountUser = useUpdateAccountUser();\n const updateAccount = useUpdateAccount();\n const [confirmGlobalOpen, setConfirmGlobalOpen] = useState(false);\n const [pendingSubmit, setPendingSubmit] = useState<{\n data: PreferencesFormValues;\n accountFields: UpdateAccountRequest;\n } | null>(null);\n const [isSaving, setIsSaving] = useState(false);\n\n const { watch, setValue, handleSubmit, reset, formState: { dirtyFields } } =\n useForm<PreferencesFormValues>({\n defaultValues: {\n language: '',\n currency: '',\n timezone: '',\n timeFormat: '24h',\n receive_sms: false,\n receive_email: false,\n },\n });\n\n useEffect(() => {\n if (!user || !account) return;\n reset({\n language: LANGUAGE_OPTIONS.find(\n (o) => o.apiValue === user.language?.toLowerCase()\n )?.value ?? 'pt-BR',\n currency: account.currency,\n timezone: account.timezone,\n timeFormat: '24h',\n receive_sms: user.receive_sms ?? false,\n receive_email: user.receive_email ?? false,\n });\n }, [user, account, reset]);\n\n const doSave = async (data: PreferencesFormValues, accountFields: UpdateAccountRequest) => {\n setIsSaving(true);\n try {\n const apiLanguage = LANGUAGE_OPTIONS.find((o) => o.value === data.language)?.apiValue ?? data.language.toLowerCase();\n await updateAccountUser.mutateAsync({\n language: apiLanguage,\n receive_sms: data.receive_sms,\n receive_email: data.receive_email,\n });\n\n if (canEditPreferences && Object.keys(accountFields).length > 0) {\n await updateAccount.mutateAsync(accountFields);\n }\n\n reset(data);\n toast.custom((t) => (\n <Toast variant=\"success\" message=\"Preferências salvas com sucesso\" toastId={t} />\n ));\n onClose();\n } catch (error) {\n toast.custom((t) => (\n <Toast\n variant=\"error\"\n message={error instanceof Error ? error.message : 'Erro ao salvar preferências'}\n toastId={t}\n />\n ));\n } finally {\n setIsSaving(false);\n }\n };\n\n const onSubmit = (data: PreferencesFormValues) => {\n const accountFields: UpdateAccountRequest = {\n ...(canEditPreferences && dirtyFields.currency && { currency: data.currency }),\n ...(canEditPreferences && dirtyFields.timezone && { timezone: data.timezone }),\n };\n const globalFieldChanged = Object.keys(accountFields).length > 0;\n\n if (globalFieldChanged) {\n setPendingSubmit({ data, accountFields });\n setConfirmGlobalOpen(true);\n } else {\n doSave(data, accountFields);\n }\n };\n\n const handleConfirmGlobal = () => {\n setConfirmGlobalOpen(false);\n if (pendingSubmit) {\n doSave(pendingSubmit.data, pendingSubmit.accountFields);\n setPendingSubmit(null);\n }\n };\n\n const handleCancelGlobal = () => {\n setConfirmGlobalOpen(false);\n setPendingSubmit(null);\n };\n\n return (\n <>\n <form onSubmit={handleSubmit(onSubmit)} className=\"flex flex-col\">\n <div className=\"overflow-y-auto overscroll-contain px-4 pb-4 lg:p-5 flex flex-col gap-5 lg:gap-6\">\n <span className=\"paragraph-medium-semibold text-gray-950\">Preferências</span>\n <div className=\"flex flex-col gap-8\">\n <div className=\"flex flex-col lg:flex-row items-center gap-3\">\n <ComboboxField\n label=\"Idioma\"\n placeholder=\"Selecione o idioma\"\n searchPlaceholder=\"Buscar idioma...\"\n containerClassName=\"w-full\"\n options={LANGUAGE_OPTIONS}\n value={watch('language')}\n onChange={(value) => setValue('language', value, { shouldDirty: true })}\n />\n <ComboboxField\n label=\"Moeda\"\n placeholder=\"Selecione a moeda\"\n searchPlaceholder=\"Buscar moeda...\"\n containerClassName=\"w-full\"\n options={currencies}\n value={watch('currency')}\n onChange={(value) => setValue('currency', value, { shouldDirty: true })}\n icon={!canEditPreferences ? <IconLock className=\"size-4 text-gray-400\" /> : undefined}\n disabled={!canEditPreferences}\n />\n </div>\n\n <Separator />\n\n <div className=\"flex flex-col gap-4\">\n <span className=\"paragraph-medium-semibold text-gray-600\">Exibição hora</span>\n <div className=\"flex flex-col lg:flex-row items-center gap-3\">\n <ComboboxField\n label=\"Fuso horário\"\n placeholder=\"Selecione o fuso horário\"\n searchPlaceholder=\"Buscar fuso horário...\"\n containerClassName=\"w-full\"\n options={timezones}\n value={watch('timezone')}\n onChange={(value) => setValue('timezone', value, { shouldDirty: true })}\n icon={!canEditPreferences ? <IconLock className=\"size-4 text-gray-400\" /> : undefined}\n disabled={!canEditPreferences}\n />\n <SelectField\n label=\"Formato hora\"\n placeholder=\"Selecione o formato\"\n className=\"h-10!\"\n containerClassName=\"w-full\"\n options={TIME_FORMAT_OPTIONS}\n value={watch('timeFormat')}\n onChange={(value) =>\n setValue('timeFormat', value as string, { shouldDirty: true })\n }\n icon={<IconLock className=\"size-4 text-gray-400\" />}\n disabled\n />\n </div>\n </div>\n\n </div>\n </div>\n\n <div className=\"flex items-center h-20 px-4 lg:px-5 border-t border-gray-200 justify-between bg-white\">\n <Button\n variant=\"secondary\"\n className=\"h-10!\"\n type=\"button\"\n disabled={isSaving}\n onClick={() => {\n reset();\n onClose();\n }}\n >\n Cancelar\n </Button>\n <Button className=\"h-10!\" type=\"submit\" disabled={isSaving}>\n {isSaving ? 'Salvando...' : 'Salvar alterações'}\n </Button>\n </div>\n </form>\n\n <ConfirmGlobalPreferencesModal\n open={confirmGlobalOpen}\n onConfirm={handleConfirmGlobal}\n onCancel={handleCancelGlobal}\n />\n </>\n );\n}\n"],"mappings":"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","names":[]}
1
+ {"version":3,"sources":["../../../../src/components/account/sections/PreferencesSection.tsx"],"sourcesContent":["'use client';\n\nimport { useState, useEffect } from 'react';\nimport { useForm } from 'react-hook-form';\nimport { toast } from 'sonner';\nimport { IconLock } from '@tabler/icons-react';\nimport { Button } from '../../ui/buttons/Button';\nimport { Separator } from '../../ui/data-display/Separator';\nimport { Toast } from '../../ui/feedback/Toast';\nimport { ComboboxField } from '../../ui/form/ComboboxField';\nimport { SelectField } from '../../ui/form/SelectField';\nimport ConfirmGlobalPreferencesModal from '../ConfirmGlobalPreferencesModal';\nimport { useAuth } from '../../../providers/auth.provider';\nimport { UserProfile } from '../../../modules/users/schema';\nimport type { UpdateAccountRequest } from '../../../modules/accounts/types';\nimport {\n useUpdateAccountUser,\n useUpdateAccount,\n} from '../../../modules/accounts/hooks/useAccountManagement';\nimport {\n LANGUAGE_OPTIONS,\n TIME_FORMAT_OPTIONS,\n} from '../constants';\nimport { useTimezones } from '../../../modules/accounts/hooks/useTimezones';\nimport { useCurrencies } from '../../../modules/accounts/hooks/useCurrencies';\n\ninterface PreferencesFormValues {\n language: string;\n currency: string;\n timezone: string;\n timeFormat: string;\n receive_sms: boolean;\n receive_email: boolean;\n}\n\ninterface PreferencesSectionProps {\n onClose: () => void;\n}\n\nexport function PreferencesSection({ onClose }: PreferencesSectionProps) {\n const { data: timezones = [] } = useTimezones();\n const { data: currencies = [] } = useCurrencies();\n const { user, account } = useAuth();\n const canEditPreferences =\n user?.profile === UserProfile.owner || user?.profile === UserProfile.admin;\n const updateAccountUser = useUpdateAccountUser();\n const updateAccount = useUpdateAccount();\n const [confirmGlobalOpen, setConfirmGlobalOpen] = useState(false);\n const [pendingSubmit, setPendingSubmit] = useState<{\n data: PreferencesFormValues;\n accountFields: UpdateAccountRequest;\n } | null>(null);\n const [isSaving, setIsSaving] = useState(false);\n\n const { watch, setValue, handleSubmit, reset, formState: { dirtyFields } } =\n useForm<PreferencesFormValues>({\n defaultValues: {\n language: '',\n currency: '',\n timezone: '',\n timeFormat: '24h',\n receive_sms: false,\n receive_email: false,\n },\n });\n\n useEffect(() => {\n if (!user || !account) return;\n reset({\n language: LANGUAGE_OPTIONS.find(\n (o) => o.apiValue === user.language?.toLowerCase()\n )?.value ?? 'pt-BR',\n currency: account.currency,\n timezone: account.timezone,\n timeFormat: '24h',\n receive_sms: user.receive_sms ?? false,\n receive_email: user.receive_email ?? false,\n });\n }, [user, account, reset]);\n\n const doSave = async (data: PreferencesFormValues, accountFields: UpdateAccountRequest) => {\n setIsSaving(true);\n try {\n const apiLanguage = LANGUAGE_OPTIONS.find((o) => o.value === data.language)?.apiValue ?? data.language.toLowerCase();\n await updateAccountUser.mutateAsync({\n language: apiLanguage,\n receive_sms: data.receive_sms,\n receive_email: data.receive_email,\n });\n\n if (canEditPreferences && Object.keys(accountFields).length > 0) {\n await updateAccount.mutateAsync(accountFields);\n }\n\n reset(data);\n toast.custom((t) => (\n <Toast variant=\"success\" message=\"Preferências salvas com sucesso\" toastId={t} />\n ));\n onClose();\n } catch (error) {\n toast.custom((t) => (\n <Toast\n variant=\"error\"\n message={error instanceof Error ? error.message : 'Erro ao salvar preferências'}\n toastId={t}\n />\n ));\n } finally {\n setIsSaving(false);\n }\n };\n\n const onSubmit = (data: PreferencesFormValues) => {\n const accountFields: UpdateAccountRequest = {\n ...(canEditPreferences && dirtyFields.currency && { currency: data.currency }),\n ...(canEditPreferences && dirtyFields.timezone && { timezone: data.timezone }),\n };\n const globalFieldChanged = Object.keys(accountFields).length > 0;\n\n if (globalFieldChanged) {\n setPendingSubmit({ data, accountFields });\n setConfirmGlobalOpen(true);\n } else {\n doSave(data, accountFields);\n }\n };\n\n const handleConfirmGlobal = () => {\n setConfirmGlobalOpen(false);\n if (pendingSubmit) {\n doSave(pendingSubmit.data, pendingSubmit.accountFields);\n setPendingSubmit(null);\n }\n };\n\n const handleCancelGlobal = () => {\n setConfirmGlobalOpen(false);\n setPendingSubmit(null);\n };\n\n return (\n <>\n <form onSubmit={handleSubmit(onSubmit)} className=\"flex flex-col\">\n <div className=\"overflow-y-auto overscroll-contain px-4 pb-4 lg:p-5 flex flex-col gap-5 lg:gap-6\">\n <span className=\"paragraph-medium-semibold text-gray-950\">Preferências</span>\n <div className=\"flex flex-col gap-8\">\n <div className=\"flex flex-col lg:flex-row items-center gap-3\">\n <ComboboxField\n label=\"Idioma\"\n placeholder=\"Selecione o idioma\"\n searchPlaceholder=\"Buscar idioma...\"\n containerClassName=\"w-full\"\n options={LANGUAGE_OPTIONS}\n value={watch('language')}\n onChange={(value) => setValue('language', value, { shouldDirty: true })}\n />\n <ComboboxField\n label=\"Moeda\"\n placeholder=\"Selecione a moeda\"\n searchPlaceholder=\"Buscar moeda...\"\n containerClassName=\"w-full\"\n options={currencies}\n value={watch('currency')}\n onChange={(value) => setValue('currency', value, { shouldDirty: true })}\n icon={!canEditPreferences ? <IconLock className=\"size-4 text-gray-400\" /> : undefined}\n disabled={!canEditPreferences}\n />\n </div>\n\n <Separator />\n\n <div className=\"flex flex-col gap-4\">\n <span className=\"paragraph-medium-semibold text-gray-950\">Exibição hora</span>\n <div className=\"flex flex-col lg:flex-row items-center gap-3\">\n <ComboboxField\n label=\"Fuso horário\"\n placeholder=\"Selecione o fuso horário\"\n searchPlaceholder=\"Buscar fuso horário...\"\n containerClassName=\"w-full\"\n options={timezones}\n value={watch('timezone')}\n onChange={(value) => setValue('timezone', value, { shouldDirty: true })}\n icon={!canEditPreferences ? <IconLock className=\"size-4 text-gray-400\" /> : undefined}\n disabled={!canEditPreferences}\n />\n <SelectField\n label=\"Formato hora\"\n placeholder=\"Selecione o formato\"\n className=\"h-10!\"\n containerClassName=\"w-full\"\n options={TIME_FORMAT_OPTIONS}\n value={watch('timeFormat')}\n onChange={(value) =>\n setValue('timeFormat', value as string, { shouldDirty: true })\n }\n icon={<IconLock className=\"size-4 text-gray-400\" />}\n disabled\n />\n </div>\n </div>\n\n </div>\n </div>\n\n <div className=\"flex items-center h-20 px-4 lg:px-5 border-t border-gray-200 justify-between bg-white\">\n <Button\n variant=\"secondary\"\n className=\"h-10!\"\n type=\"button\"\n disabled={isSaving}\n onClick={() => {\n reset();\n onClose();\n }}\n >\n Cancelar\n </Button>\n <Button className=\"h-10!\" type=\"submit\" disabled={isSaving}>\n {isSaving ? 'Salvando...' : 'Salvar alterações'}\n </Button>\n </div>\n </form>\n\n <ConfirmGlobalPreferencesModal\n open={confirmGlobalOpen}\n onConfirm={handleConfirmGlobal}\n onCancel={handleCancelGlobal}\n />\n </>\n );\n}\n"],"mappings":"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","names":[]}
@@ -15,7 +15,7 @@ function NotificationsPopover({
15
15
  side,
16
16
  align,
17
17
  contentClassName,
18
- badgeClassName = "bg-pages-400"
18
+ badgeClassName = "bg-cyan-300"
19
19
  }) {
20
20
  const [open, setOpen] = useState(false);
21
21
  const { data: messagesData } = useMessages({ type: "notification", readed: true, limit: 5 });
@@ -39,7 +39,7 @@ function NotificationsPopover({
39
39
  "span",
40
40
  {
41
41
  className: cn(
42
- "absolute top-2 right-2 size-2.5 rounded-full",
42
+ "absolute top-0.5 right-0.5 size-3.5 rounded-full border-2 border-white",
43
43
  badgeClassName
44
44
  )
45
45
  }
@@ -1 +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-pages-400\",\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-2 right-2 size-2.5 rounded-full\",\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":[]}
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":[]}
@@ -2,6 +2,7 @@
2
2
  import { Fragment, jsx, jsxs } from "react/jsx-runtime";
3
3
  import { useState } from "react";
4
4
  import * as PopoverPrimitive from "@radix-ui/react-popover";
5
+ import { IconSettings2 } from "@tabler/icons-react";
5
6
  import { Popover } from "../ui/overlay/Popover";
6
7
  import { Progress } from "../ui/feedback/Progress";
7
8
  import { Separator } from "../ui/data-display/Separator";
@@ -12,6 +13,7 @@ import { useAuth } from "../../providers/auth.provider";
12
13
  import { cn } from "../../infra/utils/clsx";
13
14
  import { useIaCredits } from "../../modules/ia-credits/hooks/ia-credits.hook";
14
15
  import { useBuyCreditsModal } from "../../store/useBuyCreditsModal";
16
+ import { useAccountModals } from "../../store/useAccountModals";
15
17
  function ProfilePopover({
16
18
  side = "top",
17
19
  align = "start",
@@ -23,6 +25,7 @@ function ProfilePopover({
23
25
  const [popoverOpen, setPopoverOpen] = useState(false);
24
26
  const { summary, subscription, isSubscriptionLoading, isCreditsLoading } = useIaCredits();
25
27
  const { openModal: openBuyCreditsModal } = useBuyCreditsModal();
28
+ const { openConfigurations } = useAccountModals();
26
29
  const handleLogout = async () => {
27
30
  try {
28
31
  setPopoverOpen(false);
@@ -109,15 +112,28 @@ function ProfilePopover({
109
112
  }
110
113
  ),
111
114
  /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2", children: [
112
- menuItems.length > 0 && /* @__PURE__ */ jsx("div", { className: "flex flex-col", children: menuItems.map((item, index) => /* @__PURE__ */ jsx(
113
- NavBarItem,
114
- {
115
- icon: item.icon,
116
- label: item.label,
117
- onClick: item.onClick
118
- },
119
- index
120
- )) }),
115
+ /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
116
+ /* @__PURE__ */ jsx(
117
+ NavBarItem,
118
+ {
119
+ icon: /* @__PURE__ */ jsx(IconSettings2, { size: 20 }),
120
+ label: "Prefer\xEAncias",
121
+ onClick: () => {
122
+ setPopoverOpen(false);
123
+ openConfigurations();
124
+ }
125
+ }
126
+ ),
127
+ menuItems.map((item, index) => /* @__PURE__ */ jsx(
128
+ NavBarItem,
129
+ {
130
+ icon: item.icon,
131
+ label: item.label,
132
+ onClick: item.onClick
133
+ },
134
+ index
135
+ ))
136
+ ] }),
121
137
  /* @__PURE__ */ jsx(Separator, {}),
122
138
  /* @__PURE__ */ jsx(NavBarItem, { label: "Sair", onClick: handleLogout })
123
139
  ] })
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/layouts/ProfilePopover.tsx"],"sourcesContent":["\"use client\";\n\nimport { useState } from \"react\";\nimport * as PopoverPrimitive from \"@radix-ui/react-popover\";\nimport { Popover } from \"../ui/overlay/Popover\";\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 { 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\n const handleLogout = async () => {\n try {\n setPopoverOpen(false);\n setIsLoggingOut(true);\n await logout();\n } finally {\n setIsLoggingOut(false);\n }\n };\n\n const hasSubscription = !isSubscriptionLoading && subscription !== null;\n\n const shouldShowCredits = hasSubscription && subscription.id_wl === 1;\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] 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 </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-900\",\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 {menuItems.length > 0 && (\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 )}\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":[]}
1
+ {"version":3,"sources":["../../../src/components/layouts/ProfilePopover.tsx"],"sourcesContent":["\"use client\";\n\nimport { useState } from \"react\";\nimport * as PopoverPrimitive from \"@radix-ui/react-popover\";\nimport { IconSettings2 } from \"@tabler/icons-react\";\nimport { Popover } from \"../ui/overlay/Popover\";\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 { cn } from \"../../infra/utils/clsx\";\nimport { useIaCredits } from \"../../modules/ia-credits/hooks/ia-credits.hook\";\nimport { useBuyCreditsModal } from \"../../store/useBuyCreditsModal\";\nimport { useAccountModals } from \"../../store/useAccountModals\";\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 { openConfigurations } = useAccountModals();\n\n const handleLogout = async () => {\n try {\n setPopoverOpen(false);\n setIsLoggingOut(true);\n await logout();\n } finally {\n setIsLoggingOut(false);\n }\n };\n\n const hasSubscription = !isSubscriptionLoading && subscription !== null;\n\n const shouldShowCredits = hasSubscription && subscription.id_wl === 1;\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] 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 </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-900\",\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 <NavBarItem\n icon={<IconSettings2 size={20} />}\n label=\"Preferências\"\n onClick={() => {\n setPopoverOpen(false);\n openConfigurations();\n }}\n />\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/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@greatapps/common",
3
- "version": "1.1.336",
3
+ "version": "1.1.338",
4
4
  "description": "Shared library for GreatApps frontend applications",
5
5
  "main": "./dist/index.mjs",
6
6
  "types": "./src/index.ts",
@@ -1,6 +1,6 @@
1
1
  'use client';
2
2
 
3
- import { IconArrowLeft, IconX, IconCopy, IconRefresh } from '@tabler/icons-react';
3
+ import { IconX, IconCopy, IconRefresh } from '@tabler/icons-react';
4
4
  import { Button } from '../ui/buttons/Button';
5
5
  import { Dialog, DialogContent, DialogHeader, DialogTitle } from '../ui/overlay/Dialog';
6
6
  import { Separator } from '../ui/data-display/Separator';
@@ -118,14 +118,6 @@ export default function TwoFactorAuthModal({ open, onClose, onSuccess }: TwoFact
118
118
  <DialogTitle>Autenticação de dois fatores</DialogTitle>
119
119
  </DialogHeader>
120
120
  <div className="shrink-0 flex items-center justify-center px-4 py-3 relative border-b border-gray-200 lg:border-b-0">
121
- <Button
122
- type="button"
123
- variant="ghost"
124
- className="size-8! p-0 absolute left-4"
125
- onClick={handleClose}
126
- >
127
- <IconArrowLeft size={20} />
128
- </Button>
129
121
  <span className="paragraph-medium-semibold text-gray-950 text-center">
130
122
  Autenticação de dois fatores
131
123
  </span>
@@ -1,6 +1,6 @@
1
1
  'use client';
2
2
 
3
- import { IconArrowLeft, IconLock } from '@tabler/icons-react';
3
+ import { IconLock, IconX } from '@tabler/icons-react';
4
4
  import { Button } from '../../ui/buttons/Button';
5
5
  import { FormField } from '../../ui/form/FormField';
6
6
  import useChangePasswordForm from '../hooks/useChangePasswordForm';
@@ -22,11 +22,11 @@ export function ChangePasswordSection({ onBack }: ChangePasswordSectionProps) {
22
22
  onSubmit={handleSubmit}
23
23
  className="flex-1 overflow-y-auto px-4 pb-5 lg:p-5 flex flex-col h-full lg:h-full gap-5 lg:gap-6"
24
24
  >
25
- <div className="flex items-center gap-3">
25
+ <div className="flex items-center justify-between">
26
+ <span className="paragraph-medium-semibold text-gray-950">Alterar senha</span>
26
27
  <Button type="button" variant="ghost" className="size-8! p-0" onClick={onBack}>
27
- <IconArrowLeft size={20} />
28
+ <IconX size={18} />
28
29
  </Button>
29
- <span className="paragraph-medium-semibold text-gray-950">Alterar senha</span>
30
30
  </div>
31
31
 
32
32
  <div className="flex flex-col gap-4">
@@ -50,7 +50,7 @@ function NotificationsPopover({
50
50
  {totalUnread > 0 && (
51
51
  <span
52
52
  className={cn(
53
- "absolute top-2 right-2 size-2.5 rounded-full",
53
+ "absolute top-0.5 right-0.5 size-3.5 rounded-full border-2 border-white",
54
54
  badgeClassName,
55
55
  )}
56
56
  />