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

Pull request: all: client id support

Browse Source 
Merge in DNS/adguard-home from 1383-client-id to master

Updates #1383.

Squashed commit of the following:

commit ebe2678bfa9bf651a2cb1e64499b38edcf19a7ad
Author: Ildar Kamalov <ik@adguard.com>
Date:   Wed Jan 27 17:51:59 2021 +0300

    - client: check if IP is valid

commit 0c330585a170ea149ee75e43dfa65211e057299c
Author: Ildar Kamalov <ik@adguard.com>
Date:   Wed Jan 27 17:07:50 2021 +0300

    - client: find clients by client_id

commit 71c9593ee35d996846f061e114b7867c3aa3c978
Merge: 9104f161 3e9edd9e
Author: Ainar Garipov <A.Garipov@AdGuard.COM>
Date:   Wed Jan 27 16:09:45 2021 +0300

    Merge branch 'master' into 1383-client-id

commit 9104f1615d2d462606c52017df25a422df872cea
Author: Ainar Garipov <A.Garipov@AdGuard.COM>
Date:   Wed Jan 27 13:28:50 2021 +0300

    dnsforward: imp tests

commit ed47f26e611ade625a2cc2c2f71a291b796bbf8f
Author: Ainar Garipov <A.Garipov@AdGuard.COM>
Date:   Wed Jan 27 12:39:52 2021 +0300

    dnsforward: fix address

commit 98b222ba69a5d265f620c180c960d01c84a1fb3b
Author: Ainar Garipov <A.Garipov@AdGuard.COM>
Date:   Tue Jan 26 19:50:31 2021 +0300

    home: imp code

commit 4f3966548a2d8437d0b68207dd108dd1a6cb7d20
Merge: 199fdc05 c215b820
Author: Ainar Garipov <A.Garipov@AdGuard.COM>
Date:   Tue Jan 26 19:45:13 2021 +0300

    Merge branch 'master' into 1383-client-id

commit 199fdc056f8a8be5500584f3aaee32865188aedc
Author: Ainar Garipov <A.Garipov@AdGuard.COM>
Date:   Tue Jan 26 19:20:37 2021 +0300

    all: imp tests, logging, etc

commit 35ff14f4d534251aecb2ea60baba225f3eed8a3e
Author: Ildar Kamalov <ik@adguard.com>
Date:   Tue Jan 26 18:55:19 2021 +0300

    + client: remove block button from clients with client_id

commit 32991a0b4c56583a02fb5e00bba95d96000bce20
Author: Ildar Kamalov <ik@adguard.com>
Date:   Tue Jan 26 18:54:25 2021 +0300

    + client: add requests count for client_id

commit 2d68df4d2eac4a296d7469923e601dad4575c1a1
Author: Ainar Garipov <A.Garipov@AdGuard.COM>
Date:   Tue Jan 26 15:49:50 2021 +0300

    stats: handle client ids

commit 4e14ab3590328f93a8cd6e9cbe1665baf74f220b
Author: Ainar Garipov <A.Garipov@AdGuard.COM>
Date:   Tue Jan 26 13:45:25 2021 +0300

    openapi: fix example

commit ca9cf3f744fe197cace2c28ddc5bc68f71dad1f3
Author: Ainar Garipov <A.Garipov@AdGuard.COM>
Date:   Tue Jan 26 13:37:10 2021 +0300

    openapi: improve clients find api docs

commit f79876e550c424558b704bc316a4cd04f25db011
Author: Ainar Garipov <A.Garipov@AdGuard.COM>
Date:   Tue Jan 26 13:18:52 2021 +0300

    home: accept ids in clients find

commit 5b72595122aa0bd64debadfd753ed8a0e0840629
Merge: 607e241f abf8f65f
Author: Ainar Garipov <A.Garipov@AdGuard.COM>
Date:   Mon Jan 25 18:34:56 2021 +0300

    Merge branch 'master' into 1383-client-id

commit 607e241f1c339dd6397218f70b8301e3de6a1ee0
Author: Ainar Garipov <A.Garipov@AdGuard.COM>
Date:   Mon Jan 25 18:30:39 2021 +0300

    dnsforward: fix quic

commit f046352fef93e46234c2bbe8ae316d21034260e5
Author: Ainar Garipov <A.Garipov@AdGuard.COM>
Date:   Mon Jan 25 16:53:09 2021 +0300

    all: remove wildcard requirement

commit 3b679489bae82c54177372be453fe184d8f0bab6
Author: Andrey Meshkov <am@adguard.com>
Date:   Mon Jan 25 16:02:28 2021 +0300

    workDir now supports symlinks

commit 0647ab4f113de2223f6949df001f42ecab05c995
Author: Ildar Kamalov <ik@adguard.com>
Date:   Mon Jan 25 14:59:46 2021 +0300

    - client: remove wildcard from domain validation

commit b1aec04a4ecadc9d65648ed6d284188fecce01c3
Author: Ildar Kamalov <ik@adguard.com>
Date:   Mon Jan 25 14:55:39 2021 +0300

    + client: add form to download mobileconfig

... and 12 more commits
This commit is contained in:
Ainar Garipov
2021-01-27 18:32:13 +03:00
parent 3e9edd9eac
commit fc9ddcf941
56 changed files with 1735 additions and 623 deletions
Download Patch File Download Diff File Expand all files Collapse all files

370
client/src/components/ui/Guide/Guide.js Normal file
View File

@@ -0,0 +1,370 @@
import React, { useState } from 'react';
import PropTypes from 'prop-types';
import { Trans, useTranslation } from 'react-i18next';
import i18next from 'i18next';
import { useSelector } from 'react-redux';
import { MOBILE_CONFIG_LINKS } from '../../../helpers/constants';
import Tabs from '../Tabs';
import Icons from '../Icons';
import MobileConfigForm from './MobileConfigForm';
const renderLi = ({ label, components }) => <li key={label}>
<Trans components={components?.map((props) => {
if (React.isValidElement(props)) {
return props;
}
const {
// eslint-disable-next-line react/prop-types
href, target = '_blank', rel = 'noopener noreferrer', key = '0',
} = props;
return <a href={href} target={target} rel={rel} key={key}>link</a>;
})}>
{label}
</Trans>
</li>;
const getDnsPrivacyList = () => [
{
title: 'Android',
list: [
{
label: 'setup_dns_privacy_android_1',
},
{
label: 'setup_dns_privacy_android_2',
components: [
{
key: 0,
href: 'https://adguard.com/adguard-android/overview.html',
},
<code key="1">text</code>,
],
},
{
label: 'setup_dns_privacy_android_3',
components: [
{
key: 0,
href: 'https://getintra.org/',
},
<code key="1">text</code>,
],
},
],
},
{
title: 'iOS',
list: [
{
label: 'setup_dns_privacy_ios_2',
components: [
{
key: 0,
href: 'https://adguard.com/adguard-ios/overview.html',
},
<code key="1">text</code>,
],
},
{
label: 'setup_dns_privacy_ios_1',
components: [
{
key: 0,
href: 'https://itunes.apple.com/app/id1452162351',
},
<code key="1">text</code>,
{
key: 2,
href: 'https://dnscrypt.info/stamps',
},
],
},
],
},
{
title: 'setup_dns_privacy_other_title',
list: [
{
label: 'setup_dns_privacy_other_1',
},
{
label: 'setup_dns_privacy_other_2',
components: [
{
key: 0,
href: 'https://github.com/AdguardTeam/dnsproxy',
},
],
},
{
href: 'https://github.com/jedisct1/dnscrypt-proxy',
label: 'setup_dns_privacy_other_3',
components: [
{
key: 0,
href: 'https://github.com/jedisct1/dnscrypt-proxy',
},
<code key="1">text</code>,
],
},
{
label: 'setup_dns_privacy_other_4',
components: [
{
key: 0,
href: 'https://support.mozilla.org/kb/firefox-dns-over-https',
},
<code key="1">text</code>,
],
},
{
label: 'setup_dns_privacy_other_5',
components: [
{
key: 0,
href: 'https://dnscrypt.info/implementations',
},
{
key: 1,
href: 'https://dnsprivacy.org/wiki/display/DP/DNS+Privacy+Clients',
},
],
},
],
},
];
const renderDnsPrivacyList = ({ title, list }) => (
<div className="tab__paragraph" key={title}>
<strong>
<Trans>{title}</Trans>
</strong>
<ul>
{list.map(({ label, components, renderComponent = renderLi }) => (
renderComponent({ label, components })
))}
</ul>
</div>
);
const getTabs = ({
tlsAddress,
httpsAddress,
showDnsPrivacyNotice,
server_name,
t,
}) => ({
Router: {
// eslint-disable-next-line react/display-name
getTitle: () => <p>
<Trans>install_devices_router_desc</Trans>
</p>,
title: 'Router',
list: ['install_devices_router_list_1',
'install_devices_router_list_2',
'install_devices_router_list_3',
// eslint-disable-next-line react/jsx-key
<Trans components={[
<a href="#dhcp" key="0">
link
</a>,
]}>install_devices_router_list_4</Trans>,
],
},
Windows: {
title: 'Windows',
list: ['install_devices_windows_list_1',
'install_devices_windows_list_2',
'install_devices_windows_list_3',
'install_devices_windows_list_4',
'install_devices_windows_list_5',
'install_devices_windows_list_6'],
},
macOS: {
title: 'macOS',
list: ['install_devices_macos_list_1',
'install_devices_macos_list_2',
'install_devices_macos_list_3',
'install_devices_macos_list_4'],
},
Android: {
title: 'Android',
list: ['install_devices_android_list_1',
'install_devices_android_list_2',
'install_devices_android_list_3',
'install_devices_android_list_4',
'install_devices_android_list_5'],
},
iOS: {
title: 'iOS',
list: ['install_devices_ios_list_1',
'install_devices_ios_list_2',
'install_devices_ios_list_3',
'install_devices_ios_list_4'],
},
dns_privacy: {
title: 'dns_privacy',
getTitle: function Title() {
return <div label="dns_privacy" title={t('dns_privacy')}>
<div className="tab__text">
{tlsAddress?.length > 0 && (
<div className="tab__paragraph">
<Trans
values={{ address: tlsAddress[0] }}
components={[
<strong key="0">text</strong>,
<code key="1">text</code>,
]}
>
setup_dns_privacy_1
</Trans>
</div>
)}
{httpsAddress?.length > 0 && (
<div className="tab__paragraph">
<Trans
values={{ address: httpsAddress[0] }}
components={[
<strong key="0">text</strong>,
<code key="1">text</code>,
]}
>
setup_dns_privacy_2
</Trans>
</div>
)}
{showDnsPrivacyNotice ? (
<div className="tab__paragraph">
<Trans
components={[
<a
href="https://github.com/AdguardTeam/AdguardHome/wiki/Encryption"
target="_blank"
rel="noopener noreferrer"
key="0"
>
link
</a>,
<code key="1">text</code>,
]}
>
setup_dns_notice
</Trans>
</div>
) : (
<>
<div className="tab__paragraph">
<Trans components={[<p key="0">text</p>]}>
setup_dns_privacy_3
</Trans>
</div>
{getDnsPrivacyList().map(renderDnsPrivacyList)}
<div>
<strong>
<Trans>
setup_dns_privacy_ioc_mac
</Trans>
</strong>
</div>
<div className="mb-3">
<Trans components={{ highlight: <code /> }}>
setup_dns_privacy_4
</Trans>
</div>
<MobileConfigForm
initialValues={{
host: server_name,
clientId: '',
protocol: MOBILE_CONFIG_LINKS.DOH,
}}
/>
</>
)}
</div>
</div>;
},
},
});
const renderContent = ({ title, list, getTitle }) => (
<div key={title} label={i18next.t(title)}>
<div className="tab__title">
{i18next.t(title)}
</div>
<div className="tab__text">
{getTitle?.()}
{list && (
<ol>
{list.map((item) => (
<li key={item}>
<Trans>{item}</Trans>
</li>
))}
</ol>
)}
</div>
</div>
);
const Guide = ({ dnsAddresses }) => {
const { t } = useTranslation();
const server_name = useSelector((state) => state.encryption?.server_name);
const tlsAddress = dnsAddresses?.filter((item) => item.includes('tls://')) ?? '';
const httpsAddress = dnsAddresses?.filter((item) => item.includes('https://')) ?? '';
const showDnsPrivacyNotice = httpsAddress.length < 1 && tlsAddress.length < 1;
const [activeTabLabel, setActiveTabLabel] = useState('Router');
const tabs = getTabs({
tlsAddress,
httpsAddress,
showDnsPrivacyNotice,
server_name,
t,
});
const activeTab = renderContent(tabs[activeTabLabel]);
return (
<div>
<Tabs
tabs={tabs}
activeTabLabel={activeTabLabel}
setActiveTabLabel={setActiveTabLabel}
>
{activeTab}
</Tabs>
<Icons />
</div>
);
};
Guide.defaultProps = {
dnsAddresses: [],
};
Guide.propTypes = {
dnsAddresses: PropTypes.array,
};
renderDnsPrivacyList.propTypes = {
title: PropTypes.string.isRequired,
list: PropTypes.array.isRequired,
renderList: PropTypes.func,
};
renderContent.propTypes = {
title: PropTypes.string.isRequired,
list: PropTypes.array.isRequired,
getTitle: PropTypes.func,
};
renderLi.propTypes = {
label: PropTypes.string,
components: PropTypes.string,
};
export default Guide;

131
client/src/components/ui/Guide/MobileConfigForm.js Normal file
View File

@@ -0,0 +1,131 @@
import React from 'react';
import PropTypes from 'prop-types';
import { Trans } from 'react-i18next';
import { useSelector } from 'react-redux';
import { Field, reduxForm } from 'redux-form';
import i18next from 'i18next';
import cn from 'classnames';
import { getPathWithQueryString } from '../../../helpers/helpers';
import { FORM_NAME, MOBILE_CONFIG_LINKS } from '../../../helpers/constants';
import {
renderInputField,
renderSelectField,
} from '../../../helpers/form';
import {
validateClientId,
validateServerName,
} from '../../../helpers/validators';
const getDownloadLink = (host, clientId, protocol, invalid) => {
if (!host || invalid) {
return (
<button
type="button"
className="btn btn-success btn-standard btn-large disabled"
>
<Trans>download_mobileconfig</Trans>
</button>
);
}
const linkParams = { host };
if (clientId) {
linkParams.client_id = clientId;
}
return (
<a
href={getPathWithQueryString(protocol, linkParams)}
className={cn('btn btn-success btn-standard btn-large')}
download
>
<Trans>download_mobileconfig</Trans>
</a>
);
};
const MobileConfigForm = ({ invalid }) => {
const formValues = useSelector((state) => state.form[FORM_NAME.MOBILE_CONFIG]?.values);
if (!formValues) {
return null;
}
const { host, clientId, protocol } = formValues;
const githubLink = (
<a
href="https://github.com/AdguardTeam/AdGuardHome/wiki/Clients#idclient"
target="_blank"
rel="noopener noreferrer"
>
text
</a>
);
return (
<form onSubmit={(e) => e.preventDefault()}>
<div>
<div className="form__group form__group--settings">
<label htmlFor="host" className="form__label">
{i18next.t('dhcp_table_hostname')}
</label>
<Field
name="host"
type="text"
component={renderInputField}
className="form-control"
placeholder={i18next.t('form_enter_hostname')}
validate={validateServerName}
/>
</div>
<div className="form__group form__group--settings">
<label htmlFor="clientId" className="form__label form__label--with-desc">
{i18next.t('client_id')}
</label>
<div className="form__desc form__desc--top">
<Trans components={{ a: githubLink }}>
client_id_desc
</Trans>
</div>
<Field
name="clientId"
type="text"
component={renderInputField}
className="form-control"
placeholder={i18next.t('client_id_placeholder')}
validate={validateClientId}
/>
</div>
<div className="form__group form__group--settings">
<label htmlFor="protocol" className="form__label">
{i18next.t('protocol')}
</label>
<Field
name="protocol"
type="text"
component={renderSelectField}
className="form-control"
>
<option value={MOBILE_CONFIG_LINKS.DOT}>
{i18next.t('dns_over_tls')}
</option>
<option value={MOBILE_CONFIG_LINKS.DOH}>
{i18next.t('dns_over_https')}
</option>
</Field>
</div>
</div>
{getDownloadLink(host, clientId, protocol, invalid)}
</form>
);
};
MobileConfigForm.propTypes = {
invalid: PropTypes.bool.isRequired,
};
export default reduxForm({ form: FORM_NAME.MOBILE_CONFIG })(MobileConfigForm);

1
client/src/components/ui/Guide/index.js Normal file
View File

@@ -0,0 +1 @@
export { default } from './Guide';