From 3c2a5aac3c21e81897521881f1bca8af5ecd9cca Mon Sep 17 00:00:00 2001
From: benjaminjohnson2204 <ben332004@gmail.com>
Date: Sat, 24 Feb 2024 11:46:36 -0800
Subject: [PATCH] Fix bugs with VSR age & num children

---
 frontend/src/app/vsr/page.tsx | 11 +++++++----
 1 file changed, 7 insertions(+), 4 deletions(-)

diff --git a/frontend/src/app/vsr/page.tsx b/frontend/src/app/vsr/page.tsx
index fb94e6a..f31a013 100644
--- a/frontend/src/app/vsr/page.tsx
+++ b/frontend/src/app/vsr/page.tsx
@@ -142,7 +142,8 @@ const VeteranServiceRequest: React.FC = () => {
         </div>
 
         <div className={styles.numChildren}>
-          {Array.from({ length: numChildrenThisGender }, (_, index) => (
+          {/* Cap it at 100 children per gender to avoid freezing web browser */}
+          {Array.from({ length: Math.min(numChildrenThisGender, 100) }, (_, index) => (
             <div key={index} className={styles.childInputWrapper}>
               <TextField
                 label={`Age`}
@@ -241,13 +242,15 @@ const VeteranServiceRequest: React.FC = () => {
                   <div className={styles.longText}>
                     <TextField
                       label="Age"
+                      type="number"
                       variant="outlined"
                       placeholder="Enter your age"
                       {...register("age", {
                         required: "Age is required",
-                        min: {
-                          value: 0,
-                          message: "This field must be positive",
+                        pattern: {
+                          // Only allow up to 2 digits
+                          value: /^[0-9]+$/,
+                          message: "This field must be a number",
                         },
                       })}
                       required