mirror of
https://github.com/LaCasemate/fab-manager.git
synced 2025-01-30 19:52:20 +01:00
(quality) remove unnecessary getValue function
This commit is contained in:
parent
4800d4aee1
commit
06a93391a2
@ -1,6 +1,6 @@
|
|||||||
import React, { useState, useEffect } from 'react';
|
import React, { useState, useEffect } from 'react';
|
||||||
import { useTranslation } from 'react-i18next';
|
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 { FormSwitch } from '../form/form-switch';
|
||||||
import { FormRichText } from '../form/form-rich-text';
|
import { FormRichText } from '../form/form-rich-text';
|
||||||
import { FormInput } from '../form/form-input';
|
import { FormInput } from '../form/form-input';
|
||||||
@ -12,8 +12,7 @@ interface EditorialBlockFormProps {
|
|||||||
control: Control<Record<SettingName, SettingValue>>,
|
control: Control<Record<SettingName, SettingValue>>,
|
||||||
formState: FormState<Record<SettingName, SettingValue>>,
|
formState: FormState<Record<SettingName, SettingValue>>,
|
||||||
info?: string
|
info?: string
|
||||||
keys: Record<EditorialKeys, SettingName>,
|
keys: Record<EditorialKeys, SettingName>
|
||||||
getValues?: UseFormGetValues<Record<SettingName, SettingValue>>,
|
|
||||||
}
|
}
|
||||||
|
|
||||||
// regular expression to validate the input fields
|
// 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.
|
* 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 { t } = useTranslation('admin');
|
||||||
|
|
||||||
const [isActiveTextBlock, setIsActiveTextBlock] = useState<boolean>(false);
|
const [isActiveTextBlock, setIsActiveTextBlock] = useState<boolean>(false);
|
||||||
@ -71,7 +70,6 @@ export const EditorialBlockForm: React.FC<EditorialBlockFormProps> = ({ register
|
|||||||
<FormInput id={keys.cta_label}
|
<FormInput id={keys.cta_label}
|
||||||
register={register}
|
register={register}
|
||||||
formState={formState}
|
formState={formState}
|
||||||
getValues={getValues}
|
|
||||||
rules={{ required: { value: isActiveCta, message: t('app.admin.editorial_block_form.label_is_required') } }}
|
rules={{ required: { value: isActiveCta, message: t('app.admin.editorial_block_form.label_is_required') } }}
|
||||||
maxLength={40}
|
maxLength={40}
|
||||||
label={t('app.admin.editorial_block_form.cta_label')} />
|
label={t('app.admin.editorial_block_form.cta_label')} />
|
||||||
|
@ -1,9 +1,9 @@
|
|||||||
import { ReactNode, useCallback, useState, useEffect } from 'react';
|
import { ReactNode, useCallback, useState } from 'react';
|
||||||
import * as React 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 { debounce as _debounce } from 'lodash';
|
||||||
import { FieldValues } from 'react-hook-form/dist/types/fields';
|
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 { FormComponent } from '../../models/form-component';
|
||||||
import { AbstractFormItem, AbstractFormItemProps } from './abstract-form-item';
|
import { AbstractFormItem, AbstractFormItemProps } from './abstract-form-item';
|
||||||
|
|
||||||
@ -22,14 +22,13 @@ type FormInputProps<TFieldValues, TInputType> = FormComponent<TFieldValues> & Ab
|
|||||||
onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void,
|
onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void,
|
||||||
nullable?: boolean,
|
nullable?: boolean,
|
||||||
ariaLabel?: string,
|
ariaLabel?: string,
|
||||||
maxLength?: number,
|
maxLength?: number
|
||||||
getValues?: UseFormGetValues<TFieldValues>
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* This component is a template for an input component to use within React Hook Form
|
* 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);
|
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
|
// Compose classnames from props
|
||||||
const classNames = [
|
const classNames = [
|
||||||
`${className || ''}`,
|
`${className || ''}`,
|
||||||
|
@ -24,7 +24,7 @@ interface MachinesSettingsProps {
|
|||||||
*/
|
*/
|
||||||
export const MachinesSettings: React.FC<MachinesSettingsProps> = ({ onError, onSuccess, beforeSubmit }) => {
|
export const MachinesSettings: React.FC<MachinesSettingsProps> = ({ onError, onSuccess, beforeSubmit }) => {
|
||||||
const { t } = useTranslation('admin');
|
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 */
|
/** Link Machines Banner Setting Names to generic keys expected by the Editorial Form */
|
||||||
const bannerKeys: Record<EditorialKeys, SettingName> = {
|
const bannerKeys: Record<EditorialKeys, SettingName> = {
|
||||||
@ -63,7 +63,6 @@ export const MachinesSettings: React.FC<MachinesSettingsProps> = ({ onError, onS
|
|||||||
<EditorialBlockForm register={register}
|
<EditorialBlockForm register={register}
|
||||||
control={control}
|
control={control}
|
||||||
formState={formState}
|
formState={formState}
|
||||||
getValues={getValues}
|
|
||||||
keys={bannerKeys}
|
keys={bannerKeys}
|
||||||
info={t('app.admin.machines_settings.generic_text_block_info')} />
|
info={t('app.admin.machines_settings.generic_text_block_info')} />
|
||||||
</div>
|
</div>
|
||||||
|
Loading…
x
Reference in New Issue
Block a user