Fix registration page issues AB#16783 AB#16793 (#6271)

* Supply OIDC scope when loading site AB#16783 * Fix behaviour of disabled fields on registration page AB#16793
bcgov · Jul 23, 2024 · 581a6ff · 581a6ff
1 parent 4bb944a
commit 581a6ff
Show file tree

Hide file tree

Showing 3 changed files with 37 additions and 16 deletions.
diff --git a/Apps/WebClient/src/ClientApp/src/components/private/registration/RegistrationView.vue b/Apps/WebClient/src/ClientApp/src/components/private/registration/RegistrationView.vue
@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import { useVuelidate } from "@vuelidate/core";
-import { helpers, requiredIf, sameAs } from "@vuelidate/validators";
+import { helpers, required, sameAs } from "@vuelidate/validators";
 import { vMaska } from "maska";
 import { computed, Ref, ref } from "vue";
 import { useRouter } from "vue-router";
@@ -20,6 +20,7 @@ import { useConfigStore } from "@/stores/config";
 import { useErrorStore } from "@/stores/error";
 import { useUserStore } from "@/stores/user";
 import PhoneUtil from "@/utility/phoneUtil";
+import ValidationUtil from "@/utility/validationUtil";
 
 const smsMaskaOptions = {
     mask: "(###) ###-####",
@@ -85,23 +86,29 @@ const validateEmail = (value: string) => {
 
 const validations = computed(() => ({
     smsNumber: {
-        required: requiredIf(isSMSNumberChecked),
-        sms: helpers.withMessage(
-            "Invalid phone number",
-            helpers.withAsync(validPhoneNumberFormat)
-        ),
+        ...ValidationUtil.getConditionalValidators(isSMSNumberChecked.value, {
+            required: required,
+            sms: helpers.withMessage(
+                "Invalid phone number",
+                helpers.withAsync(validPhoneNumberFormat)
+            ),
+        }),
     },
     email: {
-        required: requiredIf(isEmailChecked),
-        email: helpers.withMessage("Invalid email", validateEmail),
+        ...ValidationUtil.getConditionalValidators(isEmailChecked.value, {
+            required: required,
+            email: helpers.withMessage("Invalid email", validateEmail),
+        }),
     },
     emailConfirmation: {
-        required: requiredIf(isEmailChecked),
-        sameAsEmail: helpers.withMessage(
-            "Both email addresses must match",
-            sameAs(email)
-        ),
-        email: helpers.withMessage("Invalid email", validateEmail),
+        ...ValidationUtil.getConditionalValidators(isEmailChecked.value, {
+            required: required,
+            sameAsEmail: helpers.withMessage(
+                "Both email addresses must match",
+                sameAs(email)
+            ),
+            email: helpers.withMessage("Invalid email", validateEmail),
+        }),
     },
     accepted: { isChecked: sameAs(true) },
 }));
@@ -219,9 +226,9 @@ async function onSubmit(): Promise<void> {
             hdid: userStore.oidcUserInfo.hdid,
             termsOfServiceId: termsOfService.value?.id ?? "",
             acceptedTermsOfService: accepted.value,
-            email: email.value ?? "",
+            email: isEmailChecked.value ? email.value ?? "" : "",
             isEmailVerified: false,
-            smsNumber: smsNumber.value ?? "",
+            smsNumber: isSMSNumberChecked.value ? smsNumber.value ?? "" : "",
             isSMSNumberVerified: false,
             preferences: {},
             lastLoginDateTimes: [],

diff --git a/Apps/WebClient/src/ClientApp/src/services/restAuthService.ts b/Apps/WebClient/src/ClientApp/src/services/restAuthService.ts
@@ -63,6 +63,7 @@ export class RestAuthenticationService implements IAuthenticationService {
 
         await keycloak.init({
             onLoad: "check-sso",
+            scope: oidcConfig.scope,
         });
 
         return new RestAuthenticationService(logger, keycloak, oidcConfig);

diff --git a/Apps/WebClient/src/ClientApp/src/utility/validationUtil.ts b/Apps/WebClient/src/ClientApp/src/utility/validationUtil.ts
@@ -68,4 +68,17 @@ export default abstract class ValidationUtil {
             : validator.$silentErrors;
         return errors.map((e) => unref(e.$message));
     }
+
+    /**
+     * Conditionally returns either the provided validator object or an empty object, depending on the value of the predicate.
+     * @param predicate Condition that determines whether the validators should be returned.
+     * @param validatorObject An object containing the conditional validators.
+     * @returns the provided validator object if the predicate is true, otherwise an empty object.
+     */
+    public static getConditionalValidators(
+        predicate: boolean,
+        validatorObject: object
+    ) {
+        return predicate ? validatorObject : {};
+    }
 }