fix: Regenerate TOTP backup codes not opening modal

.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

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(<GenericModal title='Modal' onDismiss={onDismiss} onClose={onClose} />);
+
+		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();

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<string>('');
 	const ref = useAutoFocus<HTMLInputElement>();
@@ -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')}

apps/meteor/client/views/account/security/TwoFactorTOTP.tsx

@@ -115,8 +115,8 @@ const TwoFactorTOTP = (props: TwoFactorTOTPProps): ReactElement => {
 			}
 		};
 
-		setModal(<TwoFactorTotpModal onConfirm={onRegenerate} onClose={closeModal} />);
-	}, [closeModal, dispatchToastMessage, regenerateCodesFn, setModal, t]);
+		setModal(<TwoFactorTotpModal onDismiss={() => undefined} onConfirm={onRegenerate} onClose={closeModal} />);
+	}, [closeModal, dispatchToastMessage, setModal, regenerateCodesFn, t]);
 
 	return (
 		<Box display='flex' flexDirection='column' alignItems='flex-start' {...props}>