fix(clerk-js): Move addFullStop helper in generateErrorTextUtil

clerk · Jul 14, 2023 · de0e94f · de0e94f
1 parent fabb4b9
commit de0e94f
Show file tree

Hide file tree

Showing 2 changed files with 17 additions and 15 deletions.
diff --git a/packages/clerk-js/src/ui/elements/FormControl.tsx b/packages/clerk-js/src/ui/elements/FormControl.tsx
@@ -119,16 +119,6 @@ const useCalculateErrorTextHeight = (config: CalculateConfigProps = {}) => {
   };
 };
 
-const addFullStop = (string: string | undefined) => {
-  if (!string) {
-    return '';
-  }
-
-  const wordSet = string?.split(' ');
-  const lastWordHasFullStop = wordSet.slice(-1)[0].includes('.') || '';
-  return lastWordHasFullStop || wordSet.length <= 1 ? string : string + '.';
-};
-
 type FormFeedbackDescriptorsKeys = 'error' | 'warning' | 'info' | 'success';
 
 type FormFeedbackProps = Partial<ReturnType<typeof useFormControlFeedback>['debounced'] & { id: FieldId }> & {
@@ -188,7 +178,7 @@ export const FormFeedback = (props: FormFeedbackProps) => {
           ref={calculateHeight}
           sx={getFormTextAnimation(!!props.informationText && !props?.successfulText && !props.warningText)}
         >
-          {addFullStop(informationMessage)}
+          {informationMessage}
         </FormInfoText>
       )}
       {/* Display the error message after the directions is unmounted*/}
@@ -198,7 +188,7 @@ export const FormFeedback = (props: FormFeedbackProps) => {
           ref={calculateHeight}
           sx={getFormTextAnimation(!!props?.errorText)}
         >
-          {addFullStop(errorMessage)}
+          {errorMessage}
         </FormErrorText>
       )}
 
@@ -209,7 +199,7 @@ export const FormFeedback = (props: FormFeedbackProps) => {
           ref={calculateHeight}
           sx={getFormTextAnimation(!!props?.successfulText)}
         >
-          {addFullStop(successMessage)}
+          {successMessage}
         </FormSuccessText>
       )}
 
@@ -219,7 +209,7 @@ export const FormFeedback = (props: FormFeedbackProps) => {
           ref={calculateHeight}
           sx={getFormTextAnimation(!!props.warningText)}
         >
-          {addFullStop(warningMessage)}
+          {warningMessage}
         </FormWarningText>
       )}
     </Box>

diff --git a/packages/clerk-js/src/ui/hooks/usePasswordComplexity.ts b/packages/clerk-js/src/ui/hooks/usePasswordComplexity.ts
@@ -51,6 +51,16 @@ const errorMessages = {
   require_special_char: 'unstable__errors.passwordComplexity.requireSpecialCharacter',
 };
 
+const addFullStop = (string: string | undefined) => {
+  if (!string) {
+    return '';
+  }
+
+  const wordSet = string?.split(' ');
+  const lastWordHasFullStop = wordSet.slice(-1)[0].includes('.') || '';
+  return lastWordHasFullStop || wordSet.length <= 1 ? string : string + '.';
+};
+
 export const generateErrorTextUtil = ({
   config,
   failedValidations,
@@ -84,7 +94,9 @@ export const generateErrorTextUtil = ({
   } else {
     messageWithPrefix = messages.join(', ');
   }
-  return `${t(localizationKeys('unstable__errors.passwordComplexity.sentencePrefix'))} ${messageWithPrefix}`;
+  return addFullStop(
+    `${t(localizationKeys('unstable__errors.passwordComplexity.sentencePrefix'))} ${messageWithPrefix}`,
+  );
 };
 
 const validate = (password: string, config: UsePasswordComplexityConfig): ComplexityErrors => {