fix: Full name validation in register page Issue#1250

src/register/RegistrationFields/NameField/NameField.test.jsx

@@ -90,7 +90,7 @@ describe('NameField', () => {
       expect(props.handleErrorChange).toHaveBeenCalledTimes(1);
       expect(props.handleErrorChange).toHaveBeenCalledWith(
         'name',
-        'Enter a valid name',
+        'The name must be between 3 to 30 characters and can only contain letters.',
       );
     });
 

src/register/RegistrationFields/NameField/validator.js

@@ -1,21 +1,32 @@
 import messages from '../../messages';
 
-// regex more focused towards url matching
-export const URL_REGEX = /[-a-zA-Z0-9@:%._\+~#=]{1,256}\.[a-zA-Z0-9()]{1,6}\b([-a-zA-Z0-9()@:%_\+.~#?&//=]*)?/gi; // eslint-disable-line no-useless-escape
+const MIN_NAME_LENGTH = 3;
+const MAX_NAME_LENGTH = 30;
 
-// regex for html tags
+export const VALID_NAME_REGEX = /^[\p{L}]+( [\p{L}]+)*$/u;
+export const URL_REGEX = /[-a-zA-Z0-9@:%._+~#=]{1,256}\.[a-zA-Z0-9()]{1,6}\b([-a-zA-Z0-9()@:%_+.~#?&//=]*)?/gi;
 export const HTML_REGEX = /<|>/u;
-
-// regex from backend
-export const INVALID_NAME_REGEX = /https?:\/\/(?:[-\w.]|(?:%[\da-fA-F]{2}))*/g;
+export const INVALID_NAME_REGEX = /https?:\/\/(?:[-\w.]|(?:%[\da-fA-F]{2}))/g;
 
 const validateName = (value, formatMessage) => {
   let fieldError = '';
-  if (!value.trim()) {
+  const trimmedValue = value.trim();
+
+  const isEmpty = !trimmedValue;
+  const isInvalidLength = trimmedValue.length < MIN_NAME_LENGTH || trimmedValue.length > MAX_NAME_LENGTH;
+  const hasInvalidCharacters = !VALID_NAME_REGEX.test(trimmedValue);
+  const containsUrlOrHtml = (
+    URL_REGEX.test(trimmedValue)
+    || HTML_REGEX.test(trimmedValue)
+    || INVALID_NAME_REGEX.test(trimmedValue)
+  );
+
+  if (isEmpty) {
     fieldError = formatMessage(messages['empty.name.field.error']);
-  } else if (URL_REGEX.test(value) || HTML_REGEX.test(value) || INVALID_NAME_REGEX.test(value)) {
+  } else if (isInvalidLength || hasInvalidCharacters || containsUrlOrHtml) {
     fieldError = formatMessage(messages['name.validation.message']);
   }
+
   return fieldError;
 };
 

src/register/messages.jsx

@@ -123,7 +123,7 @@ const messages = defineMessages({
   },
   'name.validation.message': {
     id: 'name.validation.message',
-    defaultMessage: 'Enter a valid name',
+    defaultMessage: 'The name must be between 3 to 30 characters and can only contain letters.',
     description: 'Validation message that appears when fullname contain URL',
   },
   'password.validation.message': {
@@ -165,8 +165,8 @@ const messages = defineMessages({
   'registration.tpa.authentication.failure': {
     id: 'registration.tpa.authentication.failure',
     defaultMessage: 'We are sorry, you are not authorized to access {platform_name} via this channel. '
-        + 'Please contact your learning administrator or manager in order to access {platform_name}.'
-        + '{lineBreak}{lineBreak}Error Details:{lineBreak}{errorMessage}',
+      + 'Please contact your learning administrator or manager in order to access {platform_name}.'
+      + '{lineBreak}{lineBreak}Error Details:{lineBreak}{errorMessage}',
     description: 'Error message third party authentication pipeline fails',
   },
   // Terms of Service and Honor Code