diff --git a/.changeset/flat-balloons-draw.md b/.changeset/flat-balloons-draw.md new file mode 100644 index 0000000000000..c9035b7bf2e2b --- /dev/null +++ b/.changeset/flat-balloons-draw.md @@ -0,0 +1,5 @@ +--- +'@rocket.chat/meteor': patch +--- + +Fixes an issue where backup codes modal is not opening when regenerating codes diff --git a/apps/meteor/client/components/GenericModal/GenericModal.spec.tsx b/apps/meteor/client/components/GenericModal/GenericModal.spec.tsx index 3acb61326beeb..0204c93504ab6 100644 --- a/apps/meteor/client/components/GenericModal/GenericModal.spec.tsx +++ b/apps/meteor/client/components/GenericModal/GenericModal.spec.tsx @@ -40,6 +40,20 @@ describe('callbacks', () => { expect(handleClose).toHaveBeenCalled(); }); + it('should call onDismiss and not call onClose', async () => { + const onDismiss = jest.fn(() => undefined); + const onClose = jest.fn(() => undefined); + + renderModal(); + + expect(await screen.findByRole('heading', { name: 'Modal' })).toBeInTheDocument(); + + await userEvent.keyboard('{Escape}'); + + expect(onDismiss).toHaveBeenCalled(); + expect(onClose).not.toHaveBeenCalled(); + }); + it('should NOT call onClose callback when confirmed', async () => { const handleConfirm = jest.fn(); const handleClose = jest.fn(); diff --git a/apps/meteor/client/components/TwoFactorModal/TwoFactorTotpModal.tsx b/apps/meteor/client/components/TwoFactorModal/TwoFactorTotpModal.tsx index cf398f4ac9154..d9a3dac000399 100644 --- a/apps/meteor/client/components/TwoFactorModal/TwoFactorTotpModal.tsx +++ b/apps/meteor/client/components/TwoFactorModal/TwoFactorTotpModal.tsx @@ -11,10 +11,11 @@ import { Method } from './TwoFactorModal'; type TwoFactorTotpModalProps = { onConfirm: OnConfirm; onClose: () => void; + onDismiss?: () => void; invalidAttempt?: boolean; }; -const TwoFactorTotpModal = ({ onConfirm, onClose, invalidAttempt }: TwoFactorTotpModalProps): ReactElement => { +const TwoFactorTotpModal = ({ onConfirm, onClose, onDismiss, invalidAttempt }: TwoFactorTotpModalProps): ReactElement => { const { t } = useTranslation(); const [code, setCode] = useState(''); const ref = useAutoFocus(); @@ -36,6 +37,7 @@ const TwoFactorTotpModal = ({ onConfirm, onClose, invalidAttempt }: TwoFactorTot confirmText={t('Verify')} title={t('Enter_TOTP_password')} onClose={onClose} + onDismiss={onDismiss} variant='warning' confirmDisabled={!code} tagline={t('Two-factor_authentication')} diff --git a/apps/meteor/client/views/account/security/TwoFactorTOTP.tsx b/apps/meteor/client/views/account/security/TwoFactorTOTP.tsx index c447fb2449284..a8d2230eec62e 100644 --- a/apps/meteor/client/views/account/security/TwoFactorTOTP.tsx +++ b/apps/meteor/client/views/account/security/TwoFactorTOTP.tsx @@ -115,8 +115,8 @@ const TwoFactorTOTP = (props: TwoFactorTOTPProps): ReactElement => { } }; - setModal(); - }, [closeModal, dispatchToastMessage, regenerateCodesFn, setModal, t]); + setModal( undefined} onConfirm={onRegenerate} onClose={closeModal} />); + }, [closeModal, dispatchToastMessage, setModal, regenerateCodesFn, t]); return (