(quality) remove unnecessary getValue function

app/frontend/src/javascript/components/editorial-block/editorial-block-form.tsx

@@ -1,6 +1,6 @@
 import React, { useState, useEffect } from 'react';
 import { useTranslation } from 'react-i18next';
-import { Control, FormState, UseFormRegister, UseFormGetValues } from 'react-hook-form';
+import { Control, FormState, UseFormRegister } from 'react-hook-form';
 import { FormSwitch } from '../form/form-switch';
 import { FormRichText } from '../form/form-rich-text';
 import { FormInput } from '../form/form-input';
@@ -12,8 +12,7 @@ interface EditorialBlockFormProps {
   control: Control<Record<SettingName, SettingValue>>,
   formState: FormState<Record<SettingName, SettingValue>>,
   info?: string
-  keys: Record<EditorialKeys, SettingName>,
-  getValues?: UseFormGetValues<Record<SettingName, SettingValue>>,
+  keys: Record<EditorialKeys, SettingName>
 }
 
 // regular expression to validate the input fields
@@ -22,7 +21,7 @@ const urlRegex = /^(https?:\/\/)([^.]+)\.(.{2,30})(\/.*)*\/?$/;
 /**
  * Allows to create a formatted text and optional cta button in a form block, to be included in a resource form managed by react-hook-form.
  */
-export const EditorialBlockForm: React.FC<EditorialBlockFormProps> = ({ register, control, formState, info, keys, getValues }) => {
+export const EditorialBlockForm: React.FC<EditorialBlockFormProps> = ({ register, control, formState, info, keys }) => {
   const { t } = useTranslation('admin');
 
   const [isActiveTextBlock, setIsActiveTextBlock] = useState<boolean>(false);
@@ -71,7 +70,6 @@ export const EditorialBlockForm: React.FC<EditorialBlockFormProps> = ({ register
             <FormInput id={keys.cta_label}
                       register={register}
                       formState={formState}
-                      getValues={getValues}
                       rules={{ required: { value: isActiveCta, message: t('app.admin.editorial_block_form.label_is_required') } }}
                       maxLength={40}
                       label={t('app.admin.editorial_block_form.cta_label')} />

app/frontend/src/javascript/components/form/form-input.tsx

@@ -1,9 +1,9 @@
-import { ReactNode, useCallback, useState, useEffect } from 'react';
+import { ReactNode, useCallback, useState } from 'react';
 import * as React from 'react';
-import { FieldPathValue, UseFormGetValues } from 'react-hook-form';
+import { FieldPathValue } from 'react-hook-form';
 import { debounce as _debounce } from 'lodash';
 import { FieldValues } from 'react-hook-form/dist/types/fields';
-import { Path, FieldPath } from 'react-hook-form/dist/types/path';
+import { FieldPath } from 'react-hook-form/dist/types/path';
 import { FormComponent } from '../../models/form-component';
 import { AbstractFormItem, AbstractFormItemProps } from './abstract-form-item';
 
@@ -22,14 +22,13 @@ type FormInputProps<TFieldValues, TInputType> = FormComponent<TFieldValues> & Ab
   onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void,
   nullable?: boolean,
   ariaLabel?: string,
-  maxLength?: number,
-  getValues?: UseFormGetValues<TFieldValues>
+  maxLength?: number
 }
 
 /**
  * This component is a template for an input component to use within React Hook Form
  */
-export const FormInput = <TFieldValues extends FieldValues, TInputType>({ id, register, getValues, label, tooltip, defaultValue, icon, className, rules, disabled, type, addOn, addOnAction, addOnClassName, addOnAriaLabel, placeholder, error, warning, formState, step, onChange, debounce, accept, nullable = false, ariaLabel, maxLength }: FormInputProps<TFieldValues, TInputType>) => {
+export const FormInput = <TFieldValues extends FieldValues, TInputType>({ id, register, label, tooltip, defaultValue, icon, className, rules, disabled, type, addOn, addOnAction, addOnClassName, addOnAriaLabel, placeholder, error, warning, formState, step, onChange, debounce, accept, nullable = false, ariaLabel, maxLength }: FormInputProps<TFieldValues, TInputType>) => {
   const [characterCount, setCharacterCount] = useState<number>(0);
 
   /**
@@ -70,13 +69,6 @@ export const FormInput = <TFieldValues extends FieldValues, TInputType>({ id, re
     }
   };
 
-  // If maxLength and getValues is provided, uses input ref to initiate the countdown of characters
-  useEffect(() => {
-    if (getValues && maxLength) {
-      setCharacterCount(getValues(id as Path<TFieldValues>).length);
-    }
-  }, [maxLength, getValues]);
-
   // Compose classnames from props
   const classNames = [
     `${className || ''}`,

app/frontend/src/javascript/components/machines/machines-settings.tsx

@@ -24,7 +24,7 @@ interface MachinesSettingsProps {
  */
 export const MachinesSettings: React.FC<MachinesSettingsProps> = ({ onError, onSuccess, beforeSubmit }) => {
   const { t } = useTranslation('admin');
-  const { register, control, formState, handleSubmit, reset, getValues } = useForm<Record<SettingName, SettingValue>>();
+  const { register, control, formState, handleSubmit, reset } = useForm<Record<SettingName, SettingValue>>();
 
   /** Link Machines Banner Setting Names to generic keys expected by the Editorial Form */
   const bannerKeys: Record<EditorialKeys, SettingName> = {
@@ -63,7 +63,6 @@ export const MachinesSettings: React.FC<MachinesSettingsProps> = ({ onError, onS
           <EditorialBlockForm register={register}
                               control={control}
                               formState={formState}
-                              getValues={getValues}
                               keys={bannerKeys}
                               info={t('app.admin.machines_settings.generic_text_block_info')} />
         </div>