chore(auth): Define default rate-limit policies for the MFA dialog and fix error banner.

Because:
- We never actually specified the rate limits
- We want to prevent users from sending too many emails
- We want to prevent users from guessing at too many otp codes
- We want to apply these restrictions per MFA type (email, 2FA, etc...)
- When rate limiting occurs, we want to show the message in the MFA dialog's error bar.

This Commit:
- Configures default rate limit policies
- Adjusts rate limit check to function per MFA action type
- Improves rate limit error handling for email sending by showing the error in the MFA dialog, and not on the main page.

Author: dschom

libs/accounts/rate-limit/src/lib/config.ts

@@ -79,9 +79,9 @@ export function parseConfigRules(
     } satisfies Rule;
 
     // A couple sanity checks to catch bad rule configuration
-    if (!/^[a-zA-Z]*$/.test(action)) {
+    if (!/^[a-zA-Z0-9]*$/.test(action)) {
       throw new InvalidRule(
-        `Actions can only contain characters a-zA-Z.`,
+        `Actions can only contain characters a-zA-Z0-9.`,
         line
       );
     }

packages/fxa-auth-server/config/rate-limit-rules.txt

@@ -136,3 +136,18 @@ recoveryPhoneSendSetupCode            : ip                : 100         : 24 hou
 #
 recoveryPhoneSendSigninCode           : ip_uid            : 6           : 24 hours        : 24 hours    : block
 recoveryPhoneSendSigninCode           : ip                : 100         : 24 hours        : 15 minutes  : ban
+
+#
+# MFA Dialogs
+# This controls the otp code sending and verification for the MfaGuard. Note that we define these per valid mfa type/action
+# so that dialogs don't interfere with each other. ie The counts that unblock email functionality are kept separate from
+# the counts that effect 2FA activity.
+#
+mfaOtpCodeRequestForEmail              : uid              : 10          : 5 minutes       : 15 minutes   : block
+mfaVerifyOtpCodeForEmail               : uid              : 5           : 5 minutes       : 15 minutes   : block
+mfaOtpCodeRequestFor2fa                : uid              : 10          : 5 minutes       : 15 minutes   : block
+mfaVerifyOtpCodeFor2fa                 : uid              : 5           : 5 minutes       : 15 minutes   : block
+mfaOtpCodeRequestForPassword           : uid              : 10          : 5 minutes       : 15 minutes   : block
+mfaVerifyOtpCodeForPassword            : uid              : 5           : 5 minutes       : 15 minutes   : block
+mfaOtpCodeRequestForRecoveryKey        : uid              : 10          : 5 minutes       : 15 minutes   : block
+mfaVerifyOtpCodeForRecoveryKey         : uid              : 5           : 5 minutes       : 15 minutes   : block

packages/fxa-auth-server/lib/routes/mfa.ts

@@ -45,6 +45,9 @@ interface DB {
   securityEvent: (arg: SecurityEvent) => Promise<void>;
 }
 
+const toPascal = (str) =>
+  str.replace(/(^|_)(\w)/g, (_, __, c) => c.toUpperCase());
+
 class MfaHandler {
   constructor(
     private readonly config: ConfigType,
@@ -66,7 +69,7 @@ class MfaHandler {
       request,
       uid,
       account.email,
-      'mfaOtpCodeRequest'
+      `mfaOtpCodeRequestFor${toPascal(action)}` // turns mfaOtpCodeRequest_recovery_key into mfaOtpCodeRequestRecoveryKey
     );
 
     let success = false;
@@ -133,7 +136,7 @@ class MfaHandler {
       request,
       uid,
       account.email,
-      'mfaVerifyOtpCode'
+      `mfaOtpCodeVerifyFor${toPascal(action)}` // turns mfaOtpCodeRequest_recovery_key into mfaOtpCodeRequestRecoveryKey
     );
 
     let success = false;

packages/fxa-auth-server/test/local/routes/mfa.js

@@ -100,7 +100,7 @@ describe('mfa', () => {
       // for testing purposes this is sufficient.
       id: SESSION_TOKEN_ID,
       uid: UID,
-      uaBrowser: UA_BROWSER
+      uaBrowser: UA_BROWSER,
     });
 
     Container.set(OtpUtils, otpUtils);
@@ -169,6 +169,22 @@ describe('mfa', () => {
     // session that this token was issued from.
     assert.equal(authResult.credentials.id, SESSION_TOKEN_ID);
     assert.equal(authResult.credentials.uaBrowser, UA_BROWSER);
+
+    // Make sure customs was invoked
+    assert.calledWith(
+      customs.checkAuthenticated,
+      sinon.match.any,
+      UID,
+      TEST_EMAIL,
+      'mfaOtpCodeRequestForTest'
+    );
+    assert.calledWith(
+      customs.checkAuthenticated,
+      sinon.match.any,
+      UID,
+      TEST_EMAIL,
+      'mfaOtpCodeVerifyForTest'
+    );
   });
 
   it('will not allow an invalid token', async () => {

packages/fxa-settings/src/components/Settings/MfaGuard/index.tsx

@@ -123,6 +123,14 @@ export const MfaGuard = ({
           handleError(err);
           return;
         }
+        if (err.code === 429) {
+          setShowResendSuccessBanner(false);
+          setLocalizedErrorBannerMessage(
+            getLocalizedErrorMessage(ftlMsgResolver, err)
+          );
+          return;
+        }
+
         Sentry.captureException(err);
         alertBar.error(getLocalizedErrorMessage(ftlMsgResolver, err));
         onDismiss();