Hide option in UI for oAuth users

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

@@ -1,15 +1,18 @@
 import { Box, Button, Margins } from '@rocket.chat/fuselage';
-import { useUser, useTranslation } from '@rocket.chat/ui-contexts';
-import type { ComponentProps, ReactElement } from 'react';
+import { useUser, useTranslation, useSetting } from '@rocket.chat/ui-contexts';
+import type { ComponentProps } from 'react';
 import React, { useCallback } from 'react';
 
 import { useEndpointAction } from '../../../hooks/useEndpointAction';
 
-const TwoFactorEmail = (props: ComponentProps<typeof Box>): ReactElement => {
+const TwoFactorEmail = (props: ComponentProps<typeof Box>): JSX.Element | null => {
 	const t = useTranslation();
 	const user = useUser();
 
+	const disableEmail2FAForOAuth = useSetting('Accounts_TwoFactorAuthentication_Disable_Email_For_OAuth_Users');
+	const isOAuthUser = !user?.services?.password?.exists;
 	const isEnabled = user?.services?.email2fa?.enabled;
+	const isAllowed = !isOAuthUser || !disableEmail2FAForOAuth;
 
 	const enable2faAction = useEndpointAction('POST', '/v1/users.2fa.enableEmail', {
 		successMessage: t('Two-factor_authentication_enabled'),
@@ -25,6 +28,10 @@ const TwoFactorEmail = (props: ComponentProps<typeof Box>): ReactElement => {
 		await disable2faAction();
 	}, [disable2faAction]);
 
+	if (!isAllowed) {
+		return null;
+	}
+
 	return (
 		<Box display='flex' flexDirection='column' alignItems='flex-start' mbs={16} {...props}>
 			<Margins blockEnd={8}>