mirror of
https://git.vectorsigma.ru/public/AdGuardHome.git
synced 2026-08-03 21:09:29 +00:00
review fix
This commit is contained in:
@@ -876,6 +876,8 @@
|
|||||||
"cache_config_optimistic": "Optimistic caching",
|
"cache_config_optimistic": "Optimistic caching",
|
||||||
"cache_config_optimistic_desc": "AdGuard Home will respond from the cache even if the entries have expired and will try to update them",
|
"cache_config_optimistic_desc": "AdGuard Home will respond from the cache even if the entries have expired and will try to update them",
|
||||||
"cache_config_clear": "Clear cache",
|
"cache_config_clear": "Clear cache",
|
||||||
|
"cache_config_size_validation": "The cache size must be greater than zero when enabled",
|
||||||
|
"cache_config_ttl_validation": "Minimum cache TTL override must be less than or equal to the maximum",
|
||||||
"cache_enabled": "Enable cache",
|
"cache_enabled": "Enable cache",
|
||||||
"cache_enabled_desc": "Store DNS responses locally",
|
"cache_enabled_desc": "Store DNS responses locally",
|
||||||
"cache_confirm_clear_title": "Clear DNS cache",
|
"cache_confirm_clear_title": "Clear DNS cache",
|
||||||
|
|||||||
@@ -73,7 +73,7 @@ export const Form = ({ initialValues, onSubmit, processingSet }: FormProps) => {
|
|||||||
control,
|
control,
|
||||||
handleSubmit,
|
handleSubmit,
|
||||||
watch,
|
watch,
|
||||||
formState: { isSubmitting, isDirty },
|
formState: { isSubmitting },
|
||||||
} = useForm<FormData>({
|
} = useForm<FormData>({
|
||||||
mode: 'onBlur',
|
mode: 'onBlur',
|
||||||
defaultValues: {
|
defaultValues: {
|
||||||
@@ -83,8 +83,6 @@ export const Form = ({ initialValues, onSubmit, processingSet }: FormProps) => {
|
|||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
const allowedClients = watch('allowed_clients');
|
|
||||||
|
|
||||||
const renderField = ({
|
const renderField = ({
|
||||||
id,
|
id,
|
||||||
title,
|
title,
|
||||||
@@ -96,8 +94,6 @@ export const Form = ({ initialValues, onSubmit, processingSet }: FormProps) => {
|
|||||||
faq: ReactNode;
|
faq: ReactNode;
|
||||||
normalizeOnBlur: (value: string) => string;
|
normalizeOnBlur: (value: string) => string;
|
||||||
}) => {
|
}) => {
|
||||||
const disabled = allowedClients && id === 'disallowed_clients';
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div key={id} className={theme.form.input}>
|
<div key={id} className={theme.form.input}>
|
||||||
<Controller
|
<Controller
|
||||||
@@ -111,11 +107,9 @@ export const Form = ({ initialValues, onSubmit, processingSet }: FormProps) => {
|
|||||||
label={
|
label={
|
||||||
<>
|
<>
|
||||||
{title}
|
{title}
|
||||||
{disabled && <> ({intl.getMessage('disabled')})</>}
|
|
||||||
<FaqTooltip text={faq} menuSize="large" spacing={id === 'blocked_hosts'} />
|
<FaqTooltip text={faq} menuSize="large" spacing={id === 'blocked_hosts'} />
|
||||||
</>
|
</>
|
||||||
}
|
}
|
||||||
disabled={disabled || processingSet}
|
|
||||||
onBlur={(e) => {
|
onBlur={(e) => {
|
||||||
field.onChange(normalizeOnBlur(e.target.value));
|
field.onChange(normalizeOnBlur(e.target.value));
|
||||||
}}
|
}}
|
||||||
@@ -137,7 +131,7 @@ export const Form = ({ initialValues, onSubmit, processingSet }: FormProps) => {
|
|||||||
id="access_save"
|
id="access_save"
|
||||||
variant="primary"
|
variant="primary"
|
||||||
size="small"
|
size="small"
|
||||||
disabled={isSubmitting || !isDirty || processingSet}
|
disabled={isSubmitting || processingSet}
|
||||||
className={theme.form.button}>
|
className={theme.form.button}>
|
||||||
{intl.getMessage('save')}
|
{intl.getMessage('save')}
|
||||||
</Button>
|
</Button>
|
||||||
|
|||||||
@@ -104,7 +104,6 @@ export const Form = ({ initialValues, onSubmit }: CacheFormProps) => {
|
|||||||
onChange={field.onChange}
|
onChange={field.onChange}
|
||||||
onBlur={field.onBlur}
|
onBlur={field.onBlur}
|
||||||
data-testid="dns_cache_enabled"
|
data-testid="dns_cache_enabled"
|
||||||
disabled={processingSetConfig}
|
|
||||||
verticalAlign="start">
|
verticalAlign="start">
|
||||||
<div>
|
<div>
|
||||||
<div className={theme.text.t2}>{intl.getMessage('cache_enabled')}</div>
|
<div className={theme.text.t2}>{intl.getMessage('cache_enabled')}</div>
|
||||||
@@ -132,7 +131,6 @@ export const Form = ({ initialValues, onSubmit }: CacheFormProps) => {
|
|||||||
</>
|
</>
|
||||||
}
|
}
|
||||||
placeholder={placeholder}
|
placeholder={placeholder}
|
||||||
disabled={processingSetConfig}
|
|
||||||
min={0}
|
min={0}
|
||||||
max={UINT32_RANGE.MAX}
|
max={UINT32_RANGE.MAX}
|
||||||
onChange={(e) => {
|
onChange={(e) => {
|
||||||
@@ -145,12 +143,14 @@ export const Form = ({ initialValues, onSubmit }: CacheFormProps) => {
|
|||||||
/>
|
/>
|
||||||
|
|
||||||
{name === CACHE_CONFIG_FIELDS.cache_size && cacheSizeZeroWhenEnabled && (
|
{name === CACHE_CONFIG_FIELDS.cache_size && cacheSizeZeroWhenEnabled && (
|
||||||
<span className={theme.form.error}>{intl.getMessage('cache_size_validation')}</span>
|
<div className={theme.form.error}>{intl.getMessage('cache_config_size_validation')}</div>
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
))}
|
))}
|
||||||
|
|
||||||
{minExceedsMax && <div className={theme.form.error}>{intl.getMessage('ttl_cache_validation')}</div>}
|
{minExceedsMax && (
|
||||||
|
<div className={theme.form.error}>{intl.getMessage('cache_config_ttl_validation')}</div>
|
||||||
|
)}
|
||||||
|
|
||||||
<div className={theme.form.input}>
|
<div className={theme.form.input}>
|
||||||
<Controller
|
<Controller
|
||||||
@@ -163,7 +163,6 @@ export const Form = ({ initialValues, onSubmit }: CacheFormProps) => {
|
|||||||
onChange={field.onChange}
|
onChange={field.onChange}
|
||||||
onBlur={field.onBlur}
|
onBlur={field.onBlur}
|
||||||
data-testid="dns_cache_optimistic"
|
data-testid="dns_cache_optimistic"
|
||||||
disabled={processingSetConfig}
|
|
||||||
verticalAlign="start">
|
verticalAlign="start">
|
||||||
<div>
|
<div>
|
||||||
<div className={theme.text.t2}>{intl.getMessage('cache_config_optimistic')}</div>
|
<div className={theme.text.t2}>{intl.getMessage('cache_config_optimistic')}</div>
|
||||||
|
|||||||
@@ -150,7 +150,6 @@ export const Form = ({ processing, initialValues, onSubmit }: Props) => {
|
|||||||
errorMessage={fieldState.error?.message}
|
errorMessage={fieldState.error?.message}
|
||||||
min={UINT32_RANGE.MIN}
|
min={UINT32_RANGE.MIN}
|
||||||
max={UINT32_RANGE.MAX}
|
max={UINT32_RANGE.MAX}
|
||||||
disabled={!!processing}
|
|
||||||
onChange={(e) => {
|
onChange={(e) => {
|
||||||
const { value } = e.target;
|
const { value } = e.target;
|
||||||
field.onChange(toNumber(value));
|
field.onChange(toNumber(value));
|
||||||
@@ -183,7 +182,6 @@ export const Form = ({ processing, initialValues, onSubmit }: Props) => {
|
|||||||
errorMessage={fieldState.error?.message}
|
errorMessage={fieldState.error?.message}
|
||||||
min={0}
|
min={0}
|
||||||
max={32}
|
max={32}
|
||||||
disabled={!!processing}
|
|
||||||
onChange={(e) => {
|
onChange={(e) => {
|
||||||
const { value } = e.target;
|
const { value } = e.target;
|
||||||
field.onChange(toNumber(value));
|
field.onChange(toNumber(value));
|
||||||
@@ -216,7 +214,6 @@ export const Form = ({ processing, initialValues, onSubmit }: Props) => {
|
|||||||
errorMessage={fieldState.error?.message}
|
errorMessage={fieldState.error?.message}
|
||||||
min={0}
|
min={0}
|
||||||
max={128}
|
max={128}
|
||||||
disabled={!!processing}
|
|
||||||
onChange={(e) => {
|
onChange={(e) => {
|
||||||
const { value } = e.target;
|
const { value } = e.target;
|
||||||
field.onChange(toNumber(value));
|
field.onChange(toNumber(value));
|
||||||
@@ -245,7 +242,6 @@ export const Form = ({ processing, initialValues, onSubmit }: Props) => {
|
|||||||
}
|
}
|
||||||
placeholder={intl.getMessage('ip_addresses_placeholder')}
|
placeholder={intl.getMessage('ip_addresses_placeholder')}
|
||||||
errorMessage={fieldState.error?.message}
|
errorMessage={fieldState.error?.message}
|
||||||
disabled={!!processing}
|
|
||||||
size="medium"
|
size="medium"
|
||||||
/>
|
/>
|
||||||
)}
|
)}
|
||||||
@@ -263,7 +259,6 @@ export const Form = ({ processing, initialValues, onSubmit }: Props) => {
|
|||||||
onChange={field.onChange}
|
onChange={field.onChange}
|
||||||
onBlur={field.onBlur}
|
onBlur={field.onBlur}
|
||||||
data-testid="dns_config_edns_cs_enabled"
|
data-testid="dns_config_edns_cs_enabled"
|
||||||
disabled={!!processing}
|
|
||||||
verticalAlign="start">
|
verticalAlign="start">
|
||||||
<div>
|
<div>
|
||||||
<div className={theme.text.t2}>{intl.getMessage('server_config_edns_enable')}</div>
|
<div className={theme.text.t2}>{intl.getMessage('server_config_edns_enable')}</div>
|
||||||
@@ -286,7 +281,7 @@ export const Form = ({ processing, initialValues, onSubmit }: Props) => {
|
|||||||
onChange={field.onChange}
|
onChange={field.onChange}
|
||||||
onBlur={field.onBlur}
|
onBlur={field.onBlur}
|
||||||
data-testid="dns_config_edns_use_custom_ip"
|
data-testid="dns_config_edns_use_custom_ip"
|
||||||
disabled={processing || !edns_cs_enabled}
|
disabled={!edns_cs_enabled}
|
||||||
verticalAlign="start">
|
verticalAlign="start">
|
||||||
<div>
|
<div>
|
||||||
<div className={theme.text.t2}>
|
<div className={theme.text.t2}>
|
||||||
@@ -318,7 +313,7 @@ export const Form = ({ processing, initialValues, onSubmit }: Props) => {
|
|||||||
data-testid="dns_config_edns_cs_custom_ip"
|
data-testid="dns_config_edns_cs_custom_ip"
|
||||||
placeholder={intl.getMessage('enter_ip_address_placeholder')}
|
placeholder={intl.getMessage('enter_ip_address_placeholder')}
|
||||||
errorMessage={fieldState.error?.message}
|
errorMessage={fieldState.error?.message}
|
||||||
disabled={processing || !edns_cs_enabled}
|
disabled={!edns_cs_enabled}
|
||||||
/>
|
/>
|
||||||
)}
|
)}
|
||||||
/>
|
/>
|
||||||
@@ -338,7 +333,6 @@ export const Form = ({ processing, initialValues, onSubmit }: Props) => {
|
|||||||
onChange={field.onChange}
|
onChange={field.onChange}
|
||||||
onBlur={field.onBlur}
|
onBlur={field.onBlur}
|
||||||
id={`dns_config_${name}`}
|
id={`dns_config_${name}`}
|
||||||
disabled={!!processing}
|
|
||||||
verticalAlign="start">
|
verticalAlign="start">
|
||||||
<div>
|
<div>
|
||||||
<div className={theme.text.t2}>{placeholder}</div>
|
<div className={theme.text.t2}>{placeholder}</div>
|
||||||
@@ -371,7 +365,6 @@ export const Form = ({ processing, initialValues, onSubmit }: Props) => {
|
|||||||
handleChange={field.onChange}
|
handleChange={field.onChange}
|
||||||
name={field.name}
|
name={field.name}
|
||||||
options={blockingModeOptions}
|
options={blockingModeOptions}
|
||||||
disabled={!!processing}
|
|
||||||
/>
|
/>
|
||||||
)}
|
)}
|
||||||
/>
|
/>
|
||||||
@@ -403,7 +396,6 @@ export const Form = ({ processing, initialValues, onSubmit }: Props) => {
|
|||||||
}
|
}
|
||||||
placeholder={placeholder}
|
placeholder={placeholder}
|
||||||
errorMessage={fieldState.error?.message}
|
errorMessage={fieldState.error?.message}
|
||||||
disabled={!!processing}
|
|
||||||
/>
|
/>
|
||||||
)}
|
)}
|
||||||
/>
|
/>
|
||||||
@@ -435,7 +427,6 @@ export const Form = ({ processing, initialValues, onSubmit }: Props) => {
|
|||||||
errorMessage={fieldState.error?.message}
|
errorMessage={fieldState.error?.message}
|
||||||
min={UINT32_RANGE.MIN}
|
min={UINT32_RANGE.MIN}
|
||||||
max={UINT32_RANGE.MAX}
|
max={UINT32_RANGE.MAX}
|
||||||
disabled={!!processing}
|
|
||||||
onChange={(e) => {
|
onChange={(e) => {
|
||||||
const { value } = e.target;
|
const { value } = e.target;
|
||||||
field.onChange(toNumber(value));
|
field.onChange(toNumber(value));
|
||||||
|
|||||||
@@ -65,7 +65,7 @@ export const Form = ({ initialValues, onSubmit }: FormProps) => {
|
|||||||
control,
|
control,
|
||||||
handleSubmit,
|
handleSubmit,
|
||||||
watch,
|
watch,
|
||||||
formState: { isSubmitting, isDirty },
|
formState: { isSubmitting },
|
||||||
} = useForm<FormData>({
|
} = useForm<FormData>({
|
||||||
mode: 'onBlur',
|
mode: 'onBlur',
|
||||||
defaultValues: {
|
defaultValues: {
|
||||||
@@ -97,7 +97,7 @@ export const Form = ({ initialValues, onSubmit }: FormProps) => {
|
|||||||
};
|
};
|
||||||
|
|
||||||
const isSavingDisabled = () => {
|
const isSavingDisabled = () => {
|
||||||
return isSubmitting || !isDirty || processingSetConfig || processingTestUpstream;
|
return isSubmitting || processingSetConfig || processingTestUpstream;
|
||||||
};
|
};
|
||||||
|
|
||||||
const isTestDisabled = () => {
|
const isTestDisabled = () => {
|
||||||
@@ -145,7 +145,7 @@ export const Form = ({ initialValues, onSubmit }: FormProps) => {
|
|||||||
</>
|
</>
|
||||||
}
|
}
|
||||||
placeholder={intl.getMessage('upstream_dns_placeholder')}
|
placeholder={intl.getMessage('upstream_dns_placeholder')}
|
||||||
disabled={!!upstreamDnsFile || processingSetConfig || processingTestUpstream}
|
disabled={!!upstreamDnsFile || processingTestUpstream}
|
||||||
size="medium"
|
size="medium"
|
||||||
/>
|
/>
|
||||||
</>
|
</>
|
||||||
@@ -162,7 +162,7 @@ export const Form = ({ initialValues, onSubmit }: FormProps) => {
|
|||||||
{...field}
|
{...field}
|
||||||
handleChange={field.onChange}
|
handleChange={field.onChange}
|
||||||
options={upstreamModeOptions}
|
options={upstreamModeOptions}
|
||||||
disabled={processingSetConfig || processingTestUpstream}
|
disabled={processingTestUpstream}
|
||||||
verticalAlign="start"
|
verticalAlign="start"
|
||||||
textClassName={s.radioText}
|
textClassName={s.radioText}
|
||||||
/>
|
/>
|
||||||
@@ -192,7 +192,6 @@ export const Form = ({ initialValues, onSubmit }: FormProps) => {
|
|||||||
</>
|
</>
|
||||||
}
|
}
|
||||||
placeholder={intl.getMessage('ip_addresses_placeholder')}
|
placeholder={intl.getMessage('ip_addresses_placeholder')}
|
||||||
disabled={processingSetConfig}
|
|
||||||
size="medium"
|
size="medium"
|
||||||
/>
|
/>
|
||||||
)}
|
)}
|
||||||
@@ -218,7 +217,6 @@ export const Form = ({ initialValues, onSubmit }: FormProps) => {
|
|||||||
</>
|
</>
|
||||||
}
|
}
|
||||||
placeholder={intl.getMessage('ip_addresses_placeholder')}
|
placeholder={intl.getMessage('ip_addresses_placeholder')}
|
||||||
disabled={processingSetConfig}
|
|
||||||
size="medium"
|
size="medium"
|
||||||
/>
|
/>
|
||||||
)}
|
)}
|
||||||
@@ -262,7 +260,6 @@ export const Form = ({ initialValues, onSubmit }: FormProps) => {
|
|||||||
</>
|
</>
|
||||||
}
|
}
|
||||||
placeholder={intl.getMessage('ip_addresses_placeholder')}
|
placeholder={intl.getMessage('ip_addresses_placeholder')}
|
||||||
disabled={processingSetConfig}
|
|
||||||
size="medium"
|
size="medium"
|
||||||
/>
|
/>
|
||||||
)}
|
)}
|
||||||
@@ -280,7 +277,6 @@ export const Form = ({ initialValues, onSubmit }: FormProps) => {
|
|||||||
checked={field.value}
|
checked={field.value}
|
||||||
onChange={field.onChange}
|
onChange={field.onChange}
|
||||||
onBlur={field.onBlur}
|
onBlur={field.onBlur}
|
||||||
disabled={processingSetConfig}
|
|
||||||
verticalAlign="start">
|
verticalAlign="start">
|
||||||
<div>
|
<div>
|
||||||
<div className={theme.text.t2}>
|
<div className={theme.text.t2}>
|
||||||
@@ -306,7 +302,6 @@ export const Form = ({ initialValues, onSubmit }: FormProps) => {
|
|||||||
checked={field.value}
|
checked={field.value}
|
||||||
onChange={field.onChange}
|
onChange={field.onChange}
|
||||||
onBlur={field.onBlur}
|
onBlur={field.onBlur}
|
||||||
disabled={processingSetConfig}
|
|
||||||
verticalAlign="start">
|
verticalAlign="start">
|
||||||
<div>
|
<div>
|
||||||
<div className={theme.text.t2}>
|
<div className={theme.text.t2}>
|
||||||
@@ -337,7 +332,6 @@ export const Form = ({ initialValues, onSubmit }: FormProps) => {
|
|||||||
</>
|
</>
|
||||||
}
|
}
|
||||||
placeholder={intl.getMessage('upstream_timeout_placeholder')}
|
placeholder={intl.getMessage('upstream_timeout_placeholder')}
|
||||||
disabled={processingSetConfig}
|
|
||||||
min={1}
|
min={1}
|
||||||
max={UINT32_RANGE.MAX}
|
max={UINT32_RANGE.MAX}
|
||||||
onChange={(e) => {
|
onChange={(e) => {
|
||||||
|
|||||||
@@ -38,3 +38,9 @@
|
|||||||
.inner {
|
.inner {
|
||||||
padding-left: 32px;
|
padding-left: 32px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.error {
|
||||||
|
margin-top: 8px;
|
||||||
|
font-size: 14px;
|
||||||
|
color: var(--default-error-icon);
|
||||||
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user