diff --git a/src/components/mfa/MfaMethodRow.tsx b/src/components/mfa/MfaMethodRow.tsx index f783e807..82ed4f4e 100644 --- a/src/components/mfa/MfaMethodRow.tsx +++ b/src/components/mfa/MfaMethodRow.tsx @@ -22,7 +22,7 @@ type Props = { detail?: string mfaRequirementMessage?: string mfaRequirementMessageIsWarning?: boolean - cypressPrefix: string + cypressPrefix: 'mfa-authenticator' | 'mfa-sms' extraButtons?: React.ReactNode onSetup: () => void onDisable: () => void @@ -48,6 +48,11 @@ function MfaMethodRow({ onDisable, onSetPreferred, }: Props) { + const smsSetupDisabledTooltip = + cypressPrefix === 'mfa-sms' && !isEnabled + ? 'SMS MFA setup will be available in a future release. Please use Authenticator App in the meantime.' + : undefined + return ( @@ -124,7 +129,7 @@ function MfaMethodRow({ title={ showSetupErrorTooltip ? 'We are unable to load your MFA status. Please try again by clicking the reload button on the chip above.' - : '' + : smsSetupDisabledTooltip ?? '' } > diff --git a/src/components/mfa/MultiFactorAuthentication.tsx b/src/components/mfa/MultiFactorAuthentication.tsx index 902b70cf..fae7d790 100644 --- a/src/components/mfa/MultiFactorAuthentication.tsx +++ b/src/components/mfa/MultiFactorAuthentication.tsx @@ -125,7 +125,7 @@ function MfaMethodList({ isUsedForLogin={isMfaMethodUsedForLogin(mfaSettings, 'sms')} isSettingUp={isSettingUpMfa && settingUpMfaMethod === 'sms'} isSettingPreferredMfaMethod={isSettingPreferredMfaMethod} - isSetupDisabled={!!loadingError || isSettingUpMfa} + isSetupDisabled={!!loadingError || isSettingUpMfa || !mfaSettings.sms.enabled} showSetupErrorTooltip={!!loadingError} title="SMS" description="Receive a one-time verification code via SMS each time MFA is required."