daxi20/AdGuardHome
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix static leases form

Browse Source
This commit is contained in:
Ildar Kamalov
2025-01-27 10:47:43 +03:00
parent eb9b9b6c2b
commit 5279124130
1 changed files with 33 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

54
client/src/components/Settings/Dhcp/StaticLeases/Form.tsx
View File

@@ -14,6 +14,7 @@ import {
import { toggleLeaseModal } from '../../../../actions'; import { toggleLeaseModal } from '../../../../actions';
import { RootState } from '../../../../initialState'; import { RootState } from '../../../../initialState';
import { Input } from '../../../ui/Controls/Input';
type Props = { type Props = {
initialValues?: { initialValues?: {
@@ -27,15 +28,21 @@ type Props = {
cidr?: string; cidr?: string;
isEdit?: boolean; isEdit?: boolean;
onSubmit: (data: any) => void; onSubmit: (data: any) => void;
} };
export const Form = ({ initialValues, processingAdding, cidr, isEdit, onSubmit }: Props) => { export const Form = ({ initialValues, processingAdding, cidr, isEdit, onSubmit }: Props) => {
const { t } = useTranslation(); const { t } = useTranslation();
const dispatch = useDispatch(); const dispatch = useDispatch();
const dynamicLease = useSelector((store: RootState) => store.dhcp.leaseModalConfig, shallowEqual); const dynamicLease = useSelector((store: RootState) => store.dhcp.leaseModalConfig, shallowEqual);
const { handleSubmit, control, reset, formState: { isSubmitting, isDirty } } = useForm({ const {
handleSubmit,
control,
reset,
formState: { isSubmitting, isDirty },
} = useForm({
defaultValues: initialValues, defaultValues: initialValues,
mode: 'onBlur',
}); });
const onClick = () => { const onClick = () => {
@@ -51,13 +58,14 @@ export const Form = ({ initialValues, processingAdding, cidr, isEdit, onSubmit }
name="mac" name="mac"
control={control} control={control}
rules={{ validate: { required: validateRequiredValue, mac: validateMac } }} rules={{ validate: { required: validateRequiredValue, mac: validateMac } }}
render={({ field }) => ( render={({ field, fieldState }) => (
<input <Input
{...field} {...field}
type="text" type="text"
className="form-control" data-testid="static_lease_mac"
placeholder={t('form_enter_mac')} placeholder={t('form_enter_mac')}
disabled={isEdit} disabled={isEdit}
error={fieldState.error?.message}
onChange={(e) => field.onChange(normalizeMac(e.target.value))} onChange={(e) => field.onChange(normalizeMac(e.target.value))}
/> />
)} )}
@@ -68,17 +76,20 @@ export const Form = ({ initialValues, processingAdding, cidr, isEdit, onSubmit }
<Controller <Controller
name="ip" name="ip"
control={control} control={control}
rules={{ validate: { rules={{
required: validateRequiredValue, validate: {
ipv4: validateIpv4, required: validateRequiredValue,
inCidr: validateIpv4InCidr, ipv4: validateIpv4,
gateway: validateIpGateway, inCidr: validateIpv4InCidr,
} }} gateway: validateIpGateway,
render={({ field }) => ( },
<input }}
render={({ field, fieldState }) => (
<Input
{...field} {...field}
type="text" type="text"
className="form-control" data-testid="static_lease_ip"
error={fieldState.error?.message}
placeholder={t('form_enter_subnet_ip', { cidr })} placeholder={t('form_enter_subnet_ip', { cidr })}
/> />
)} )}
@@ -89,11 +100,12 @@ export const Form = ({ initialValues, processingAdding, cidr, isEdit, onSubmit }
<Controller <Controller
name="hostname" name="hostname"
control={control} control={control}
render={({ field }) => ( render={({ field, fieldState }) => (
<input <Input
{...field} {...field}
type="text" type="text"
className="form-control" data-testid="static_lease_hostname"
error={fieldState.error?.message}
placeholder={t('form_enter_hostname')} placeholder={t('form_enter_hostname')}
/> />
)} )}
@@ -105,18 +117,18 @@ export const Form = ({ initialValues, processingAdding, cidr, isEdit, onSubmit }
<div className="btn-list"> <div className="btn-list">
<button <button
type="button" type="button"
data-testid="static_lease_cancel"
className="btn btn-secondary btn-standard" className="btn btn-secondary btn-standard"
disabled={isSubmitting} disabled={isSubmitting}
onClick={onClick} onClick={onClick}>
>
<Trans>cancel_btn</Trans> <Trans>cancel_btn</Trans>
</button> </button>
<button <button
type="submit" type="submit"
data-testid="static_lease_save"
className="btn btn-success btn-standard" className="btn btn-success btn-standard"
disabled={isSubmitting || processingAdding || (!isDirty && !dynamicLease)} disabled={isSubmitting || processingAdding || (!isDirty && !dynamicLease)}>
>
<Trans>save_btn</Trans> <Trans>save_btn</Trans>
</button> </button>
</div> </div>