fix(signup): Disallow age submissions > 130

Because:
* The age limit was 999, which is too high

This commit:
* Adds an age limit of 130, else we display an error tooltip

fixes FXA-9104

packages/fxa-settings/src/lib/auth-errors/en.ftl

@@ -24,4 +24,6 @@ auth-error-1003 = Local storage or cookies are still disabled
 auth-error-1008 = Your new password must be different
 auth-error-1010 = Valid password required
 auth-error-1011 = Valid email required
+auth-error-1031 = You must enter your age to sign up
+auth-error-1032 = You must enter a valid age to sign up
 auth-error-1062 = Invalid redirect

packages/fxa-settings/src/pages/Signup/en.ftl

@@ -10,8 +10,6 @@ signup-change-email-link = Change email
 # Checking the user's age is required by COPPA. To register for an account, the user must indicate their age (number only)
 signup-age-check-label =
   .label = How old are you?
-# Error displayed in a tooltip when the user attempts to submit the form without filling in their age
-signup-age-check-input-error = You must enter your age to sign up
 # Link goes to https://www.ftc.gov/business-guidance/resources/childrens-online-privacy-protection-rule-not-just-kids-sites
 # This link appears just below signup-age-check-input-label
 signup-coppa-check-explanation-link = Why do we ask?

packages/fxa-settings/src/pages/Signup/index.test.tsx

@@ -357,6 +357,23 @@ describe('Signup page', () => {
           );
         });
       });
+
+      it('with age set over 130, does not submit and displays error', async () => {
+        const mockBeginSignupHandler = jest.fn();
+        renderWithLocalizationProvider(
+          <Subject beginSignupHandler={mockBeginSignupHandler} />
+        );
+        await fillOutForm('131');
+
+        submit();
+        await waitFor(() => {
+          expect(screen.getByTestId('tooltip')).toHaveTextContent(
+            'You must enter a valid age to sign up'
+          );
+        });
+        expect(GleanMetrics.registration.submit).toHaveBeenCalledTimes(1);
+        expect(mockBeginSignupHandler).not.toBeCalled();
+      });
     });
 
     describe('fails for Relay email masks', () => {

packages/fxa-settings/src/pages/Signup/index.tsx

@@ -157,9 +157,13 @@ export const Signup = ({
   const ftlMsgResolver = useFtlMsgResolver();
 
   const localizedAgeIsRequiredError = ftlMsgResolver.getMsg(
-    'signup-age-check-input-error',
+    'auth-error-1031',
     'You must enter your age to sign up'
   );
+  const localizedValidAgeError = ftlMsgResolver.getMsg(
+    'auth-error-1032',
+    'You must enter a valid age to sign up'
+  );
 
   const onFocus = () => {
     if (!isFocused) {
@@ -198,6 +202,9 @@ export const Signup = ({
         document.cookie = 'tooyoung=1;';
         navigate('/cannot_create_account');
         return;
+      } else if (Number(age) > 130) {
+        setAgeCheckErrorText(localizedValidAgeError);
+        return;
       }
 
       // Disable creating accounts with email masks
@@ -293,6 +300,7 @@ export const Signup = ({
       integration,
       offeredSyncEngineConfigs,
       isSyncOAuth,
+      localizedValidAgeError,
     ]
   );