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

all: sync with master; upd chlog

Browse Source
This commit is contained in:
Ainar Garipov
2023-04-12 14:48:42 +03:00
parent 0dad53b5f7
commit d9c57cdd9a
181 changed files with 6992 additions and 3430 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
client/src/components/Settings/Clients/ClientsTable/ClientsTable.js
View File

@@ -7,6 +7,7 @@ import { useDispatch, useSelector } from 'react-redux';
import ReactTable from 'react-table';
import { getAllBlockedServices } from '../../../../actions/services';
import { initSettings } from '../../../../actions';
import {
splitByNewLine,
countClientsStatistics,
@@ -38,9 +39,13 @@ const ClientsTable = ({
const [t] = useTranslation();
const dispatch = useDispatch();
const services = useSelector((store) => store?.services);
const globalSettings = useSelector((store) => store?.settings.settingsList) || {};
const { safesearch } = globalSettings;
useEffect(() => {
dispatch(getAllBlockedServices());
dispatch(initSettings());
}, []);
const handleFormAdd = (values) => {
@@ -107,6 +112,7 @@ const ClientsTable = ({
tags: [],
use_global_settings: true,
use_global_blocked_services: true,
safe_search: { ...(safesearch || {}) },
};
};

33
client/src/components/Settings/Clients/Form.js
View File

@@ -11,7 +11,7 @@ import Select from 'react-select';
import i18n from '../../../i18n';
import Tabs from '../../ui/Tabs';
import Examples from '../Dns/Upstream/Examples';
import { toggleAllServices, trimLinesAndRemoveEmpty } from '../../../helpers/helpers';
import { toggleAllServices, trimLinesAndRemoveEmpty, captitalizeWords } from '../../../helpers/helpers';
import {
renderInputField,
renderGroupField,
@@ -40,10 +40,6 @@ const settingsCheckboxes = [
name: 'parental_enabled',
placeholder: 'use_adguard_parental',
},
{
name: 'safesearch_enabled',
placeholder: 'enforce_safe_search',
},
];
const validate = (values) => {
const errors = {};
@@ -139,8 +135,12 @@ let Form = (props) => {
processingUpdating,
invalid,
tagsOptions,
initialValues,
} = props;
const services = useSelector((store) => store?.services);
const { safe_search } = initialValues;
const safeSearchServices = { ...safe_search };
delete safeSearchServices.enabled;
const [activeTabLabel, setActiveTabLabel] = useState('settings');
@@ -163,6 +163,28 @@ let Form = (props) => {
/>
</div>
))}
<div className="form__group">
<Field
name="safe_search.enabled"
type="checkbox"
component={CheckboxField}
placeholder={t('enforce_safe_search')}
disabled={useGlobalSettings}
/>
</div>
<div className='form__group--inner'>
{Object.keys(safeSearchServices).map((searchKey) => (
<div key={searchKey}>
<Field
name={`safe_search.${searchKey}`}
type="checkbox"
component={CheckboxField}
placeholder={captitalizeWords(searchKey)}
disabled={useGlobalSettings}
/>
</div>
))}
</div>
</div>,
},
block_services: {
@@ -358,6 +380,7 @@ Form.propTypes = {
processingUpdating: PropTypes.bool.isRequired,
invalid: PropTypes.bool.isRequired,
tagsOptions: PropTypes.array.isRequired,
initialValues: PropTypes.object,
};
const selector = formValueSelector(FORM_NAME.CLIENT);

35
client/src/components/Settings/Dhcp/Leases.js
View File

@@ -1,9 +1,11 @@
import React, { Component } from 'react';
import { connect } from 'react-redux';
import PropTypes from 'prop-types';
import ReactTable from 'react-table';
import { Trans, withTranslation } from 'react-i18next';
import { LEASES_TABLE_DEFAULT_PAGE_SIZE } from '../../../helpers/constants';
import { sortIp } from '../../../helpers/helpers';
import { toggleLeaseModal } from '../../../actions';
class Leases extends Component {
cellWrap = ({ value }) => (
@@ -14,6 +16,30 @@ class Leases extends Component {
</div>
);
convertToStatic = (data) => () => {
const { dispatch } = this.props;
dispatch(toggleLeaseModal(data));
}
makeStatic = ({ row }) => {
const { t, disabledLeasesButton } = this.props;
return (
<div className="logs__row logs__row--center">
<button
type="button"
className="btn btn-icon btn-icon--green btn-outline-secondary btn-sm"
title={t('make_static')}
onClick={this.convertToStatic(row)}
disabled={disabledLeasesButton}
>
<svg className="icons icon12">
<use xlinkHref="#plus" />
</svg>
</button>
</div>
);
}
render() {
const { leases, t } = this.props;
return (
@@ -39,8 +65,11 @@ class Leases extends Component {
}, {
Header: <Trans>dhcp_table_expires</Trans>,
accessor: 'expires',
minWidth: 130,
minWidth: 220,
Cell: this.cellWrap,
}, {
Header: <Trans>actions_table_header</Trans>,
Cell: this.makeStatic,
},
]}
pageSize={LEASES_TABLE_DEFAULT_PAGE_SIZE}
@@ -57,6 +86,8 @@ class Leases extends Component {
Leases.propTypes = {
leases: PropTypes.array,
t: PropTypes.func,
dispatch: PropTypes.func,
disabledLeasesButton: PropTypes.bool,
};
export default withTranslation()(Leases);
export default withTranslation()(connect(() => ({}), (dispatch) => ({ dispatch }))(Leases));

5
client/src/components/Settings/Dhcp/StaticLeases/Form.js
View File

@@ -2,7 +2,7 @@ import React from 'react';
import PropTypes from 'prop-types';
import { Field, reduxForm } from 'redux-form';
import { Trans, useTranslation } from 'react-i18next';
import { useDispatch } from 'react-redux';
import { useDispatch, useSelector, shallowEqual } from 'react-redux';
import { renderInputField, normalizeMac } from '../../../../helpers/form';
import {
@@ -25,6 +25,7 @@ const Form = ({
}) => {
const { t } = useTranslation();
const dispatch = useDispatch();
const dynamicLease = useSelector((store) => store.dhcp.leaseModalConfig, shallowEqual);
const onClick = () => {
reset();
@@ -87,7 +88,7 @@ const Form = ({
<button
type="submit"
className="btn btn-success btn-standard"
disabled={submitting || pristine || processingAdding}
disabled={submitting || processingAdding || (pristine && !dynamicLease)}
>
<Trans>save_btn</Trans>
</button>

11
client/src/components/Settings/Dhcp/StaticLeases/Modal.js
View File

@@ -2,7 +2,7 @@ import React from 'react';
import PropTypes from 'prop-types';
import { Trans, withTranslation } from 'react-i18next';
import ReactModal from 'react-modal';
import { useDispatch } from 'react-redux';
import { shallowEqual, useDispatch, useSelector } from 'react-redux';
import Form from './Form';
import { toggleLeaseModal } from '../../../../actions';
@@ -18,6 +18,9 @@ const Modal = ({
const dispatch = useDispatch();
const toggleModal = () => dispatch(toggleLeaseModal());
const leaseInitialData = useSelector(
(state) => state.dhcp.leaseModalConfig, shallowEqual,
) || {};
return (
<ReactModal
@@ -37,9 +40,9 @@ const Modal = ({
</div>
<Form
initialValues={{
mac: '',
ip: '',
hostname: '',
mac: leaseInitialData.mac ?? '',
ip: leaseInitialData.ip ?? '',
hostname: leaseInitialData.hostname ?? '',
cidr,
rangeStart,
rangeEnd,

6
client/src/components/Settings/Dhcp/index.js
View File

@@ -188,8 +188,8 @@ const Dhcp = () => {
const inputtedIPv4values = dhcp?.values?.v4?.gateway_ip && dhcp?.values?.v4?.subnet_mask;
const isEmptyConfig = !Object.values(dhcp?.values?.v4 ?? {}).some(Boolean);
const disabledLeasesButton = dhcp?.syncErrors || interfaces?.syncErrors
|| !isInterfaceIncludesIpv4 || isEmptyConfig || processingConfig || !inputtedIPv4values;
const disabledLeasesButton = Boolean(dhcp?.syncErrors || interfaces?.syncErrors
|| !isInterfaceIncludesIpv4 || isEmptyConfig || processingConfig || !inputtedIPv4values);
const cidr = inputtedIPv4values ? `${dhcp?.values?.v4?.gateway_ip}/${subnetMaskToBitMask(dhcp?.values?.v4?.subnet_mask)}` : '';
return <>
@@ -260,7 +260,7 @@ const Dhcp = () => {
>
<div className="row">
<div className="col">
<Leases leases={leases} />
<Leases leases={leases} disabledLeasesButton={disabledLeasesButton}/>
</div>
</div>
</Card>}

41
client/src/components/Settings/Dns/Config/Form.js
View File

@@ -13,15 +13,11 @@ import {
validateIpv4,
validateIpv6,
validateRequiredValue,
validateIp,
} from '../../../../helpers/validators';
import { BLOCKING_MODES, FORM_NAME, UINT32_RANGE } from '../../../../helpers/constants';
const checkboxes = [
{
name: 'edns_cs_enabled',
placeholder: 'edns_enable',
subtitle: 'edns_cs_desc',
},
{
name: 'dnssec_enabled',
placeholder: 'dnssec_enable',
@@ -66,6 +62,8 @@ const Form = ({
const { t } = useTranslation();
const {
blocking_mode,
edns_cs_enabled,
edns_cs_use_custom,
} = useSelector((state) => state.form[FORM_NAME.BLOCKING_MODE].values ?? {}, shallowEqual);
return <form onSubmit={handleSubmit}>
@@ -92,6 +90,39 @@ const Form = ({
/>
</div>
</div>
<div className="col-12">
<div className="form__group form__group--settings">
<Field
name="edns_cs_enabled"
type="checkbox"
component={CheckboxField}
placeholder={t('edns_enable')}
disabled={processing}
subtitle={t('edns_cs_desc')}
/>
</div>
</div>
<div className="col-12 form__group form__group--inner">
<div className="form__group ">
<Field
name="edns_cs_use_custom"
type="checkbox"
component={CheckboxField}
placeholder={t('edns_use_custom_ip')}
disabled={processing || !edns_cs_enabled}
subtitle={t('edns_use_custom_ip_desc')}
/>
</div>
{edns_cs_use_custom && (<Field
name="edns_cs_custom_ip"
component={renderInputField}
className="form-control"
placeholder={t('form_enter_ip')}
validate={[validateIp, validateRequiredValue]}
/>)}
</div>
{checkboxes.map(({ name, placeholder, subtitle }) => <div className="col-12" key={name}>
<div className="form__group form__group--settings">
<Field

4
client/src/components/Settings/Dns/Config/index.js
View File

@@ -14,6 +14,8 @@ const Config = () => {
blocking_ipv4,
blocking_ipv6,
edns_cs_enabled,
edns_cs_use_custom,
edns_cs_custom_ip,
dnssec_enabled,
disable_ipv6,
processingSetConfig,
@@ -39,6 +41,8 @@ const Config = () => {
edns_cs_enabled,
disable_ipv6,
dnssec_enabled,
edns_cs_use_custom,
edns_cs_custom_ip,
}}
onSubmit={handleFormSubmit}
processing={processingSetConfig}

36
client/src/components/Settings/LogsConfig/Form.js
View File

@@ -4,18 +4,28 @@ import { Field, reduxForm } from 'redux-form';
import { Trans, withTranslation } from 'react-i18next';
import flow from 'lodash/flow';
import { CheckboxField, renderRadioField, toFloatNumber } from '../../../helpers/form';
import { FORM_NAME, QUERY_LOG_INTERVALS_DAYS } from '../../../helpers/constants';
import {
CheckboxField,
renderRadioField,
toFloatNumber,
renderTextareaField,
} from '../../../helpers/form';
import {
FORM_NAME,
QUERY_LOG_INTERVALS_DAYS,
HOUR,
DAY,
} from '../../../helpers/constants';
import '../FormButton.css';
const getIntervalTitle = (interval, t) => {
switch (interval) {
case 0.25:
case 6 * HOUR:
return t('interval_6_hour');
case 1:
case DAY:
return t('interval_24_hour');
default:
return t('interval_days', { count: interval });
return t('interval_days', { count: interval / DAY });
}
};
@@ -66,6 +76,22 @@ const Form = (props) => {
{getIntervalFields(processing, t, toFloatNumber)}
</div>
</div>
<label className="form__label form__label--with-desc">
<Trans>ignore_domains_title</Trans>
</label>
<div className="form__desc form__desc--top">
<Trans>ignore_domains_desc_query</Trans>
</div>
<div className="form__group form__group--settings">
<Field
name="ignored"
type="textarea"
className="form-control form-control--textarea font-monospace text-input"
component={renderTextareaField}
placeholder={t('ignore_domains')}
disabled={processing}
/>
</div>
<div className="mt-5">
<button
type="submit"

10
client/src/components/Settings/LogsConfig/index.js
View File

@@ -10,13 +10,15 @@ class LogsConfig extends Component {
const { t, interval: prevInterval } = this.props;
const { interval } = values;
const data = { ...values, ignored: values.ignored ? values.ignored.split('\n') : [] };
if (interval !== prevInterval) {
// eslint-disable-next-line no-alert
if (window.confirm(t('query_log_retention_confirm'))) {
this.props.setLogsConfig(values);
this.props.setLogsConfig(data);
}
} else {
this.props.setLogsConfig(values);
this.props.setLogsConfig(data);
}
};
@@ -30,7 +32,7 @@ class LogsConfig extends Component {
render() {
const {
t, enabled, interval, processing, processingClear, anonymize_client_ip,
t, enabled, interval, processing, processingClear, anonymize_client_ip, ignored,
} = this.props;
return (
@@ -45,6 +47,7 @@ class LogsConfig extends Component {
enabled,
interval,
anonymize_client_ip,
ignored: ignored.join('\n'),
}}
onSubmit={this.handleFormSubmit}
processing={processing}
@@ -62,6 +65,7 @@ LogsConfig.propTypes = {
enabled: PropTypes.bool.isRequired,
anonymize_client_ip: PropTypes.bool.isRequired,
processing: PropTypes.bool.isRequired,
ignored: PropTypes.array.isRequired,
processingClear: PropTypes.bool.isRequired,
setLogsConfig: PropTypes.func.isRequired,
clearLogs: PropTypes.func.isRequired,

8
client/src/components/Settings/Settings.css
View File

@@ -22,6 +22,14 @@
margin-bottom: 25px;
}
.form__group--inner .form__group--checkbox {
margin-bottom: 12px;
}
.form__group--inner .form__group--checkbox:last-child {
margin-bottom: 0;
}
.form__inline {
display: flex;
justify-content: flex-start;

48
client/src/components/Settings/StatsConfig/Form.js
View File

@@ -4,23 +4,31 @@ import { Field, reduxForm } from 'redux-form';
import { Trans, withTranslation } from 'react-i18next';
import flow from 'lodash/flow';
import { renderRadioField, toNumber, CheckboxField } from '../../../helpers/form';
import { FORM_NAME, STATS_INTERVALS_DAYS, DISABLED_STATS_INTERVAL } from '../../../helpers/constants';
import {
renderRadioField,
toNumber,
CheckboxField,
renderTextareaField,
} from '../../../helpers/form';
import {
FORM_NAME,
STATS_INTERVALS_DAYS,
DAY,
} from '../../../helpers/constants';
import '../FormButton.css';
const getIntervalTitle = (interval, t) => {
switch (interval) {
const getIntervalTitle = (intervalMs, t) => {
switch (intervalMs / DAY) {
case 1:
return t('interval_24_hour');
default:
return t('interval_days', { count: interval });
return t('interval_days', { count: intervalMs / DAY });
}
};
const Form = (props) => {
const {
handleSubmit,
change,
processing,
submitting,
invalid,
@@ -38,13 +46,6 @@ const Form = (props) => {
component={CheckboxField}
placeholder={t('statistics_enable')}
disabled={processing}
onChange={(event) => {
if (event.target.checked) {
change('interval', STATS_INTERVALS_DAYS[0]);
} else {
change('interval', DISABLED_STATS_INTERVAL);
}
}}
/>
</div>
<label className="form__label form__label--with-desc">
@@ -65,15 +66,26 @@ const Form = (props) => {
placeholder={getIntervalTitle(interval, t)}
normalize={toNumber}
disabled={processing}
onChange={(event) => {
if (event.target.checked) {
change('enabled', true);
}
}}
/>
))}
</div>
</div>
<label className="form__label form__label--with-desc">
<Trans>ignore_domains_title</Trans>
</label>
<div className="form__desc form__desc--top">
<Trans>ignore_domains_desc_stats</Trans>
</div>
<div className="form__group form__group--settings">
<Field
name="ignored"
type="textarea"
className="form-control form-control--textarea font-monospace text-input"
component={renderTextareaField}
placeholder={t('ignore_domains')}
disabled={processing}
/>
</div>
<div className="mt-5">
<button
type="submit"

15
client/src/components/Settings/StatsConfig/index.js
View File

@@ -6,9 +6,13 @@ import Card from '../../ui/Card';
import Form from './Form';
class StatsConfig extends Component {
handleFormSubmit = (values) => {
handleFormSubmit = ({ enabled, interval, ignored }) => {
const { t, interval: prevInterval } = this.props;
const config = { interval: values.interval };
const config = {
enabled,
interval,
ignored: ignored ? ignored.split('\n') : [],
};
if (config.interval < prevInterval) {
if (window.confirm(t('statistics_retention_confirm'))) {
@@ -29,7 +33,7 @@ class StatsConfig extends Component {
render() {
const {
t, interval, processing, processingReset,
t, interval, processing, processingReset, ignored, enabled,
} = this.props;
return (
@@ -42,7 +46,8 @@ class StatsConfig extends Component {
<Form
initialValues={{
interval,
enabled: !!interval,
enabled,
ignored: ignored.join('\n'),
}}
onSubmit={this.handleFormSubmit}
processing={processing}
@@ -57,6 +62,8 @@ class StatsConfig extends Component {
StatsConfig.propTypes = {
interval: PropTypes.number.isRequired,
ignored: PropTypes.array.isRequired,
enabled: PropTypes.bool.isRequired,
processing: PropTypes.bool.isRequired,
processingReset: PropTypes.bool.isRequired,
setStatsConfig: PropTypes.func.isRequired,

46
client/src/components/Settings/index.js
View File

@@ -10,7 +10,7 @@ import Checkbox from '../ui/Checkbox';
import Loading from '../ui/Loading';
import PageTitle from '../ui/PageTitle';
import Card from '../ui/Card';
import { getObjectKeysSorted } from '../../helpers/helpers';
import { getObjectKeysSorted, captitalizeWords } from '../../helpers/helpers';
import './Settings.css';
const ORDER_KEY = 'order';
@@ -28,12 +28,6 @@ const SETTINGS = {
subtitle: 'use_adguard_parental_hint',
[ORDER_KEY]: 1,
},
safesearch: {
enabled: false,
title: 'enforce_safe_search',
subtitle: 'enforce_save_search_hint',
[ORDER_KEY]: 2,
},
};
class Settings extends Component {
@@ -44,7 +38,7 @@ class Settings extends Component {
this.props.getFilteringStatus();
}
renderSettings = (settings) => getObjectKeysSorted(settings, ORDER_KEY)
renderSettings = (settings) => getObjectKeysSorted(SETTINGS, ORDER_KEY)
.map((key) => {
const setting = settings[key];
const { enabled } = setting;
@@ -55,6 +49,35 @@ class Settings extends Component {
/>;
});
renderSafeSearch = () => {
const { settings: { settingsList: { safesearch } } } = this.props;
const { enabled } = safesearch || {};
const searches = { ...(safesearch || {}) };
delete searches.enabled;
return (
<>
<Checkbox
enabled={enabled}
title='enforce_safe_search'
subtitle='enforce_save_search_hint'
handleChange={({ target: { checked: enabled } }) => this.props.toggleSetting('safesearch', { ...safesearch, enabled })}
/>
<div className='form__group--inner'>
{Object.keys(searches).map((searchKey) => (
<Checkbox
key={searchKey}
enabled={searches[searchKey]}
title={captitalizeWords(searchKey)}
subtitle=''
disabled={!safesearch.enabled}
handleChange={({ target: { checked } }) => this.props.toggleSetting('safesearch', { ...safesearch, [searchKey]: checked })}
/>
))}
</div>
</>
);
};
render() {
const {
settings,
@@ -92,12 +115,14 @@ class Settings extends Component {
setFiltersConfig={setFiltersConfig}
/>
{this.renderSettings(settings.settingsList)}
{this.renderSafeSearch()}
</div>
</Card>
</div>
<div className="col-md-12">
<LogsConfig
enabled={queryLogs.enabled}
ignored={queryLogs.ignored}
interval={queryLogs.interval}
anonymize_client_ip={queryLogs.anonymize_client_ip}
processing={queryLogs.processingSetConfig}
@@ -109,6 +134,8 @@ class Settings extends Component {
<div className="col-md-12">
<StatsConfig
interval={stats.interval}
ignored={stats.ignored}
enabled={stats.enabled}
processing={stats.processingSetConfig}
processingReset={stats.processingReset}
setStatsConfig={setStatsConfig}
@@ -139,6 +166,8 @@ Settings.propTypes = {
stats: PropTypes.shape({
processingGetConfig: PropTypes.bool,
interval: PropTypes.number,
enabled: PropTypes.bool,
ignored: PropTypes.array,
processingSetConfig: PropTypes.bool,
processingReset: PropTypes.bool,
}),
@@ -149,6 +178,7 @@ Settings.propTypes = {
processingSetConfig: PropTypes.bool,
processingClear: PropTypes.bool,
processingGetConfig: PropTypes.bool,
ignored: PropTypes.array,
}),
filtering: PropTypes.shape({
interval: PropTypes.number,