Add validation for activation code and error logging for createFamily in Parent Signup flow

src/components/auth/RegisterChildren.vue

@@ -103,7 +103,7 @@
                 :feedback="false"
               ></PvPassword>
             </div>
-            <span v-if="v$.students.$each.$response.$data[outerIndex].password.$invalid && submitted">
+            <span v-if="v$.students.$each.$response.$errors[outerIndex].password.length > 0 && submitted">
               <span
                 v-for="(error, innerIndex2) in v$.students.$each.$response.$errors[outerIndex].password"
                 :key="`error-${outerIndex}-${innerIndex2}`"
@@ -127,7 +127,7 @@
                 :feedback="false"
               ></PvPassword>
             </div>
-            <span v-if="isPasswordMismatch(outerIndex) && submitted" class="p-error"> Passwords must match </span>
+            <span v-if="isPasswordMismatch(outerIndex)" class="p-error"> Passwords must match </span>
           </div>
         </section>
         <section class="form-section">
@@ -348,7 +348,7 @@
         type="submit"
         label="Submit"
         class="bg-primary text-white border-none border-round w-4 p-2 h-3rem mr-3 hover:surface-300 hover:text-black-alpha-90"
-        @click.prevent="handleFormSubmit(!v$.$invalid)"
+        @click.prevent="handleFormSubmit(!v$.$invalid && !anyPasswordsMismatched())"
       />
       <PvDialog
         v-model:visible="isDialogVisible"
@@ -564,15 +564,18 @@ function isPasswordMismatch(index) {
   return state.students[index].password !== state.students[index]?.confirmPassword;
 }
 
+function anyPasswordsMismatched() {
+  return state.students.some((student) => student.password !== student.confirmPassword);
+}
+
 const v$ = useVuelidate(rules, state);
 
 const handleFormSubmit = async (isFormValid) => {
   submitted.value = true;
 
   if (!isFormValid) {
-    dialogMessage.value = 'Please fill out all the required fields.';
+    dialogMessage.value = 'There is an error with the form input, please correct and re-try.';
     showErrorDialog();
-    submitted.value = false;
     return;
   }
 
@@ -614,7 +617,29 @@ const validateCode = async (studentCode, outerIndex = 0) => {
 
   try {
     const activationCode = await fetchDocById('activationCodes', studentCode, undefined, 'admin', true, true);
-
+    // If two months have elapsed since creation, we should invalidate the code as expired
+    if (activationCode.dateExpired) {
+      const dateExpired = new Date(activationCode.dateExpired);
+      const today = new Date();
+      if (dateExpired < today) {
+        dialogMessage.value = 'The code has expired. Please enter a valid code."';
+        showErrorDialog();
+        submitted.value = false;
+        return;
+      }
+    }
+    // if no dateExpired, fallback to dateCreated to check for validity
+    else if (activationCode.dateCreated) {
+      const dateCreated = new Date(activationCode.dateCreated);
+      const twoMonthsAgo = new Date();
+      twoMonthsAgo.setMonth(twoMonthsAgo.getMonth() - 2);
+      if (dateCreated < twoMonthsAgo) {
+        dialogMessage.value = 'The code has expired. Please enter a valid code."';
+        showErrorDialog();
+        submitted.value = false;
+        return;
+      }
+    }
     if (activationCode.orgId) {
       state.students[outerIndex].orgName = `${_capitalize(activationCode.orgType)} - ${
         activationCode.orgName ?? activationCode.orgId

src/pages/RegisterFamilyUsers.vue

@@ -12,9 +12,11 @@
               <div class="text-sm font-bold text-red-800 ml-1 uppercase">beta</div>
             </div>
             <div class="bg-gray-100 rounded p-2">
-              <div class="flex flex-wrap text-gray-600 text-md font-bold">Register a parent or guardian account.</div>
+              <div class="flex flex-wrap text-gray-600 text-md font-bold">
+                Register a parent or guardian account for ROAR Research Portal
+              </div>
               <div class="flex flex-wrap text-gray-400 text-sm">
-                This account will be used to manage your family's accounts.
+                This account allows your family to participate in ROAR research studies!
               </div>
               <div class="flex flex-wrap text-gray-400 text-sm">
                 You will be able to add children to your family in the next step.
@@ -27,7 +29,9 @@
               <div class="text-sm font-bold text-red-800 ml-1 uppercase">beta</div>
             </div>
             <div class="bg-gray-100 rounded p-2">
-              <div class="flex flex-wrap text-gray-600 text-md font-bold">Register children or students.</div>
+              <div class="flex flex-wrap text-gray-600 text-md font-bold">
+                Register children or students for ROAR Research Portal
+              </div>
               <div class="flex flex-wrap text-gray-400 text-sm">
                 These accounts will be linked to your parent/guardian account.
               </div>
@@ -217,6 +221,12 @@ watch([parentInfo, studentInfo], ([newParentInfo, newStudentInfo]) => {
         dialogHeader.value = 'Success!';
         dialogMessage.value = 'Your family has been created!';
         showDialog();
+      })
+      .catch((error) => {
+        spinner.value = false;
+        dialogHeader.value = 'Error!';
+        dialogMessage.value = error.message;
+        showDialog();
       });
   }
 });