diff --git a/app/assets/scripts/a11n/signin.js b/app/assets/scripts/a11n/signin.js
index 17f144cf..666d0191 100644
--- a/app/assets/scripts/a11n/signin.js
+++ b/app/assets/scripts/a11n/signin.js
@@ -24,6 +24,7 @@ import { SectionFieldset } from '../components/common/forms/section-fieldset';
import { FormikInputText } from '../components/common/forms/input-text';
import { createProcessToast } from '../components/common/toasts';
import { useUser } from '../context/user';
+import FormInfoTip from '../components/common/forms/form-info-tooltip';
const OTPModal = styled(Modal)`
max-width: 24rem;
@@ -192,7 +193,33 @@ function SignIn() {
{!mfaEnabled && mfaCode && (
- Set-up OTP
+
+ Set-up OTP
+
+ A one-time password (OTP) increases the security of your APT
+ account. To use OTP with APT, you'll need to download
+ an application (sometimes referred to as MFA) that generates
+ a time-sensitive code (OTP) that is entered upon login. APT
+ doesn't endorse any particular application, but some
+ include{' '}
+
+ Google Authenticator
+ {' '}
+ (Android, iOS),{' '}
+
+ Microsoft Authenticator
+ {' '}
+ (Android, iOS), and{' '}
+ 1Password (Android,
+ iOS, Mac, PC, Linux, web browser). Please follow the
+ respective application's instructions for how to
+ install and setup the OTP generator.
+
+ }
+ />
+
Please use the following code or QR to generate Time-based OTP
from the Authenticator app.
diff --git a/app/assets/scripts/components/common/forms/form-info-tooltip.js b/app/assets/scripts/components/common/forms/form-info-tooltip.js
index 1a108348..be512889 100644
--- a/app/assets/scripts/components/common/forms/form-info-tooltip.js
+++ b/app/assets/scripts/components/common/forms/form-info-tooltip.js
@@ -23,9 +23,9 @@ const TooltipTagComponent = React.forwardRef((props, ref) => (
TooltipTagComponent.displayName = 'TooltipTagComponent';
-export default function FormInfoTip({ title }) {
+export default function FormInfoTip({ title, ...rest }) {
return (
-
+
More information
);